.swq-root {
    --swq-border: #d8d5cf;
    --swq-text: #282725;
    --swq-muted: #6d6963;
    --swq-surface: #fff;
    --swq-soft: #f5f3ef;
    max-width: 920px;
    margin: 2rem auto;
    color: var(--swq-text);
}
.swq-panel, .swq-result { background: var(--swq-surface); }
.swq-kicker, .swq-byline, .swq-progress { color: var(--swq-muted); }
.swq-progress { display:flex; justify-content:flex-end; margin-bottom:1rem; font-size:.9rem; }
.swq-options { display:grid; gap:1rem; margin:1.5rem 0; }
.swq-options-image { grid-template-columns:repeat(2,minmax(0,1fr)); }
.swq-option {
    appearance:none;
    width:100%;
    text-align:left;
    border:1px solid var(--swq-border);
    background:var(--swq-surface);
    color:inherit;
    padding:0;
    cursor:pointer;
    display:grid;
    grid-template-columns:auto 1fr;
    align-items:start;
}
.swq-option:hover, .swq-option:focus-visible { border-color:currentColor; }
.swq-option.is-selected { outline:2px solid currentColor; outline-offset:2px; }
.swq-option-letter { padding:1rem 0 1rem 1rem; font-weight:700; }
.swq-option-label { padding:1rem; }
.swq-option-image, .swq-image-placeholder {
    grid-column:1 / -1;
    width:100%;
    aspect-ratio:4/5;
    object-fit:cover;
    display:block;
}
.swq-image-placeholder {
    background:var(--swq-soft);
    color:var(--swq-muted);
    display:flex;
    align-items:center;
    justify-content:center;
    padding:1rem;
    text-align:center;
    border-bottom:1px solid var(--swq-border);
}
.swq-nav { display:flex; justify-content:space-between; gap:1rem; margin-top:1.5rem; }
.swq-primary, .swq-secondary {
    appearance:none;
    border:1px solid currentColor;
    padding:.75rem 1rem;
    cursor:pointer;
    font:inherit;
}
.swq-primary { background:var(--swq-text); color:#fff; }
.swq-secondary { background:transparent; color:inherit; }
.swq-primary:disabled { opacity:.45; cursor:not-allowed; }
.swq-result-header { margin-bottom:2rem; }
.swq-book-body, .swq-comparison, .swq-runner { margin:2rem 0; }
.swq-comparison { padding:1.25rem; background:var(--swq-soft); }
.swq-tied-books { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:2rem; }
.swq-error { border:1px solid #b33; padding:1rem; }

.swq-book-lead {
    display:grid;
    grid-template-columns:minmax(110px, 165px) minmax(0, 1fr);
    gap:1.5rem;
    align-items:start;
    margin-bottom:1rem;
}
.swq-book-cover {
    display:block;
    width:100%;
    height:auto;
    max-width:100%;
    box-shadow:0 1px 4px rgba(0,0,0,.16);
}
.swq-primary-cover, .swq-runner-cover, .swq-tied-cover {
    min-width:0;
}
.swq-book-lead-copy > :first-child,
.swq-runner-copy > :first-child {
    margin-top:0;
}
.swq-runner-grid {
    display:grid;
    grid-template-columns:minmax(78px, 115px) minmax(0, 1fr);
    gap:1.25rem;
    align-items:start;
}
.swq-runner-copy > :last-child {
    margin-bottom:0;
}
.swq-tied-book {
    min-width:0;
}
.swq-tied-cover {
    width:min(150px, 55%);
    margin:0 0 1rem 0;
}
.swq-result-tie .swq-tied-books {
    align-items:start;
}
.swq-runner-multiple .swq-runner-grid + .swq-runner-grid {
    margin-top:1.5rem;
}

@media (max-width:680px) {
    .swq-options-image, .swq-tied-books { grid-template-columns:1fr; }
    .swq-book-lead { grid-template-columns:1fr; }
    .swq-primary-cover { width:min(180px, 52vw); margin:0 auto; }
    .swq-runner-grid { grid-template-columns:minmax(72px, 100px) minmax(0, 1fr); }
    .swq-tied-cover { width:min(160px, 48vw); }
}
@media (prefers-reduced-motion: reduce) {
    .swq-root * { scroll-behavior:auto !important; transition:none !important; animation:none !important; }
}


.swq-book-index {
    max-width:920px;
    margin:2.5rem auto 0;
    border-top:1px solid var(--swq-border, #d8d5cf);
    border-bottom:1px solid var(--swq-border, #d8d5cf);
}
.swq-book-index > summary {
    cursor:pointer;
    padding:1rem 0;
    font-weight:700;
}
.swq-book-index > summary:focus-visible {
    outline:2px solid currentColor;
    outline-offset:4px;
}
.swq-book-index__content {
    padding:0 0 1rem;
}
.swq-book-index__book {
    padding:1.5rem 0;
    border-top:1px solid var(--swq-border, #d8d5cf);
}
.swq-book-index__book h3 {
    margin:0 0 .25rem;
}
.swq-book-index__author {
    margin:.25rem 0 1rem;
    color:var(--swq-muted, #6d6963);
}
.swq-book-index__book > :last-child {
    margin-bottom:0;
}
