:root{--bayeux-beige:#efe3ca;--bayeux-beige-light:#f8f1e2;--resisting-red:#6b2a2d;--old-olive:#5e5640;--bayeux-blue:#14405f;--ink:#2a1b18;--ink-muted:#5c4b44;--font-heading:Georgia, "Times New Roman", serif;--font-body:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--space-xs:.25rem;--space-s:.5rem;--space-m:1rem;--space-l:1.5rem;--space-xl:2.5rem;--tap-size:3rem;--radius:.5rem}*,:before,:after{box-sizing:border-box}body{font-family:var(--font-body);color:var(--ink);background:var(--bayeux-beige);margin:0;font-size:1rem;line-height:1.5}#root{flex-direction:column;min-height:100dvh;display:flex}h1,h2{font-family:var(--font-heading);color:var(--resisting-red);margin:0;line-height:1.2}h1{font-size:clamp(1.5rem,6vw,2rem)}h2{font-size:1.25rem}p{margin:0}ul,ol{margin:0;padding:0;list-style:none}img{max-width:100%;display:block}.screen{width:100%;max-width:36rem;padding:var(--space-l) var(--space-m) calc(var(--space-xl) + env(safe-area-inset-bottom));gap:var(--space-m);flex-direction:column;flex:1;margin:0 auto;display:flex}.prototype-banner{background:var(--old-olive);color:var(--bayeux-beige-light);text-align:center;padding:var(--space-s) var(--space-m);font-size:.875rem}:focus-visible{outline:3px solid var(--bayeux-blue);outline-offset:3px}h1:focus{outline:none}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}button{font:inherit;color:inherit;cursor:pointer}.button{min-height:var(--tap-size);padding:var(--space-s) var(--space-l);border:2px solid var(--resisting-red);border-radius:var(--radius);background:var(--resisting-red);color:var(--bayeux-beige-light);font-weight:600}.button.secondary{color:var(--resisting-red);background:0 0}.text-button{min-height:var(--tap-size);color:var(--bayeux-blue);background:0 0;border:none;align-self:flex-start;padding:0;text-decoration:underline}.icon-button{width:var(--tap-size);height:var(--tap-size);border:2px solid var(--resisting-red);border-radius:var(--radius);background:var(--bayeux-beige-light);flex-shrink:0;font-size:1.25rem}.icon-button[aria-disabled=true]{opacity:.4;cursor:default}.hint{color:var(--ink-muted)}.options{gap:var(--space-s);flex-direction:column;display:flex}.option{width:100%;min-height:var(--tap-size);align-items:center;gap:var(--space-m);padding:var(--space-s) var(--space-m);border:2px solid var(--resisting-red);border-radius:var(--radius);background:var(--bayeux-beige-light);text-align:left;display:flex}.option-letter{color:var(--resisting-red);font-weight:700}.image-options{gap:var(--space-s);grid-template-columns:repeat(2,1fr);display:grid}.image-option{gap:var(--space-s);width:100%;height:100%;padding:var(--space-s);border:2px solid var(--resisting-red);border-radius:var(--radius);background:var(--bayeux-beige-light);flex-direction:column;display:flex}.image-placeholder{aspect-ratio:4/3;background:var(--bayeux-beige);border:1px dashed var(--old-olive);width:100%;color:var(--ink-muted);place-items:center;font-size:.875rem;display:grid}.slider input{width:100%;min-height:var(--tap-size);accent-color:var(--resisting-red)}.slider-ends{color:var(--ink-muted);justify-content:space-between;font-size:.875rem;display:flex}.slider-value{margin-top:var(--space-s);text-align:center;font-weight:600}.ranking{gap:var(--space-s);flex-direction:column;display:flex}.ranking-item{align-items:center;gap:var(--space-s);padding:var(--space-xs) var(--space-s);border:2px solid var(--resisting-red);border-radius:var(--radius);background:var(--bayeux-beige-light);display:flex}.ranking-item.is-dragging{background:var(--bayeux-beige);border-style:dashed}.drag-handle{width:var(--tap-size);height:var(--tap-size);cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;place-items:center;font-size:1.5rem;display:grid}.ranking-number{color:var(--resisting-red);font-weight:700}.ranking-label{flex:1}.timer{gap:var(--space-xs);flex-direction:column;display:flex}.progress{color:var(--ink-muted);margin-top:auto;font-size:.875rem}.progress-track{background:var(--bayeux-beige-light);border:1px solid var(--old-olive);border-radius:999px;height:.5rem;overflow:hidden}.progress-fill{background:var(--bayeux-blue);height:100%}.loading-dots{gap:var(--space-s);display:flex}.loading-dots span{background:var(--resisting-red);border-radius:50%;width:.75rem;height:.75rem;animation:1s infinite alternate pulse}.loading-dots span:nth-child(2){animation-delay:.2s}.loading-dots span:nth-child(3){animation-delay:.4s}@keyframes pulse{to{opacity:.2}}.result-intro{color:var(--ink-muted);font-size:1rem;display:block}.tags{gap:var(--space-s);flex-wrap:wrap;display:flex}.tags li{padding:var(--space-xs) var(--space-m);border:1px solid var(--old-olive);background:var(--bayeux-beige-light);border-radius:999px;font-size:.875rem}.result-image{aspect-ratio:4/3}.matches{gap:var(--space-m);flex-direction:column;display:flex}.matches li{gap:var(--space-xs);grid-template-columns:1fr auto;display:grid}.matches .progress-track{grid-column:1/-1}.match-percent{font-weight:600}.share-fallback{gap:var(--space-xs);flex-direction:column;display:flex}.share-fallback textarea{font:inherit;padding:var(--space-s);border:2px solid var(--old-olive);border-radius:var(--radius)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}