:root{--color-paper: #ffffff;--color-paper-dim: #f5f5f2;--color-ink: #1d1d1f;--color-ink-soft: #515154;--color-ink-faint: #86868b;--color-line: #1d1d1f;--color-line-soft: #d2d2d7;--color-danger: #b42318;--color-success: #2d7a46;--color-warning: #b45309;--stripe-green: #61bb46;--stripe-yellow: #fdb827;--stripe-orange: #f5821f;--stripe-red: #e03a3e;--stripe-purple: #963d97;--stripe-blue: #009ddc;--font-display: "Iowan Old Style", Garamond, "Apple Garamond", "Times New Roman", serif;--font-ui: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, "Segoe UI", Arial, sans-serif;--font-mono: "SF Mono", ui-monospace, Menlo, Monaco, "Courier New", monospace;--text-xs: .75rem;--text-sm: .875rem;--text-md: 1rem;--text-lg: 1.25rem;--text-xl: 1.75rem;--text-2xl: 2.5rem;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.5rem;--space-6: 2rem;--space-7: 3rem;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--border-hairline: 1px solid var(--color-line);--border-soft: 1px solid var(--color-line-soft);--shadow-offset: 3px 3px 0 var(--color-ink);--touch-target: 44px}*,*:before,*:after{box-sizing:border-box}html{height:100%}body{margin:0;min-height:100%;background:var(--color-paper);color:var(--color-ink);font-family:var(--font-ui);font-size:var(--text-md);line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}#root{min-height:100dvh;display:flex;flex-direction:column}h1,h2,h3,p{margin:0}img{max-width:100%;display:block}button,input{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--color-ink);outline-offset:2px}.ui-stripe{display:flex;height:4px;width:100%}.ui-stripe>span{flex:1}.ui-stripe>span:nth-child(1){background:var(--stripe-green)}.ui-stripe>span:nth-child(2){background:var(--stripe-yellow)}.ui-stripe>span:nth-child(3){background:var(--stripe-orange)}.ui-stripe>span:nth-child(4){background:var(--stripe-red)}.ui-stripe>span:nth-child(5){background:var(--stripe-purple)}.ui-stripe>span:nth-child(6){background:var(--stripe-blue)}.ui-screen{flex:1;display:flex;flex-direction:column;width:100%;max-width:430px;margin:0 auto;padding:var(--space-5) var(--space-4) var(--space-6)}.ui-screen-body{flex:1;display:flex;flex-direction:column}.ui-stack{display:flex;flex-direction:column}.ui-stack--gap-2{gap:var(--space-2)}.ui-stack--gap-4{gap:var(--space-4)}.ui-stack--gap-6{gap:var(--space-6)}.ui-card{background:var(--color-paper);border:var(--border-hairline);border-radius:var(--radius-md);box-shadow:var(--shadow-offset);padding:var(--space-5)}.ui-button{display:inline-flex;align-items:center;justify-content:center;min-height:var(--touch-target);padding:0 var(--space-5);border:var(--border-hairline);border-radius:var(--radius-md);background:var(--color-paper);font-family:var(--font-ui);font-size:var(--text-md);font-weight:600;cursor:pointer;box-shadow:var(--shadow-offset);transition:transform 80ms ease,box-shadow 80ms ease}.ui-button:active{transform:translate(3px,3px);box-shadow:0 0 0 var(--color-ink)}.ui-button--primary{background:var(--color-ink);color:var(--color-paper)}.ui-button:disabled{cursor:not-allowed;color:var(--color-ink-faint);border-color:var(--color-line-soft);box-shadow:none;background:transparent}.ui-button--primary:disabled{background:transparent;color:var(--color-ink-faint)}.ui-button:disabled:active{transform:none;box-shadow:none}.ui-button--block{width:100%}.ui-button-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2)}.ui-input{width:100%;min-height:var(--touch-target);padding:0 var(--space-4);border:var(--border-hairline);border-radius:var(--radius-md);background:var(--color-paper)}.ui-input::placeholder{color:var(--color-ink-faint)}.ui-label{display:block;font-size:var(--text-sm);font-weight:600;margin-bottom:var(--space-2)}.ui-label-optional{font-weight:400;color:var(--color-ink-faint)}.ui-phase{display:inline-flex;align-items:center;gap:var(--space-2);align-self:flex-start;border:var(--border-hairline);border-radius:999px;padding:var(--space-1) var(--space-3);font-family:var(--font-mono);font-size:var(--text-xs);letter-spacing:.08em;text-transform:uppercase}.ui-title{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:400;line-height:1.15;letter-spacing:-.01em}.ui-subtitle{color:var(--color-ink-soft);font-size:var(--text-md)}.ui-footnote{color:var(--color-ink-faint);font-size:var(--text-xs);text-align:center}.app-shell{min-height:100dvh;display:flex;flex-direction:column}.ui-screen--centered .ui-screen-body{justify-content:center;align-items:center;text-align:center}.ui-error{color:var(--color-danger);font-size:var(--text-sm);margin:0}.ui-link{background:none;border:none;color:var(--color-ink);font-family:var(--font-ui);font-size:var(--text-md);text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:var(--space-2) 0}.ui-link:disabled{color:var(--color-ink-faint);cursor:not-allowed;text-decoration:none}.ui-link-row{display:flex;flex-wrap:wrap;gap:var(--space-3) var(--space-4)}.ui-link--center{display:block;width:100%;text-align:center}.ui-skip-controls{display:flex;flex-direction:column;gap:var(--space-3)}.ui-badge{font-size:var(--text-sm);color:var(--color-ink-soft);white-space:nowrap}.ui-player-row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-2) 0;border-bottom:var(--border-soft)}.ui-player-row:last-child{border-bottom:none}.ui-vote-row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);width:100%;min-height:var(--touch-target);padding:var(--space-2) 0;border:none;border-bottom:var(--border-soft);background:none;cursor:pointer;text-align:left;font:inherit;color:inherit}.ui-vote-row:last-child{border-bottom:none}.ui-vote-row[aria-pressed=true] .name-text{font-weight:600}.ui-vote-row[aria-pressed=true] .ui-badge{color:var(--color-ink);font-weight:600}.ui-player-name{display:flex;align-items:center;gap:var(--space-3);font-size:var(--text-md);min-width:0}.ui-player-identity{display:flex;flex-direction:column;gap:1px;min-width:0}.ui-player-name .name-text{display:inline-flex;align-items:center;gap:var(--space-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ui-you-chip{flex-shrink:0;font-size:var(--text-xs);font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--color-ink);border:var(--border-hairline);padding:0 .35rem;line-height:1.4}.ui-connection-label{font-size:var(--text-xs);color:var(--color-ink-faint);line-height:1.2}.player-character{display:inline-flex;flex-shrink:0;align-items:center;justify-content:center;line-height:0}.player-character svg{width:100%;height:100%;display:block;overflow:visible}.player-character--away{opacity:.55}.ui-status-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;border:var(--border-hairline)}.ui-status-dot.connected{background:var(--color-success)}.ui-status-dot.disconnected{background:var(--color-ink-faint)}.ui-connection-banner{text-align:center;font-size:var(--text-sm);color:var(--color-warning);padding:var(--space-2)}.ui-timer{font-family:var(--font-display);font-size:var(--text-xl);text-align:center}.ui-error-toast{position:fixed;left:var(--space-4);right:var(--space-4);bottom:var(--space-4);max-width:430px;margin:0 auto;background:var(--color-ink);color:var(--color-paper);padding:var(--space-3) var(--space-4);border:var(--border-hairline);box-shadow:var(--shadow-offset);display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);z-index:100}.ui-error-toast button{background:transparent;border:none;color:var(--color-paper);font-size:var(--text-lg);cursor:pointer;min-width:var(--touch-target);min-height:var(--touch-target)}.private-card-frame{position:relative;width:100%;aspect-ratio:4 / 3;border:var(--border-hairline);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-offset)}.private-card-image{width:100%;height:100%;display:block;background:var(--color-paper-dim);object-fit:cover;transition:opacity .15s ease-in}.private-card-skeleton{width:100%;aspect-ratio:4 / 3;border:var(--border-hairline);border-radius:var(--radius-lg);background:linear-gradient(90deg,var(--color-paper-dim) 25%,var(--color-paper) 37%,var(--color-paper-dim) 63%);background-size:200% 100%;animation:skeleton-shimmer 1.4s ease-in-out infinite}.private-card-frame .private-card-skeleton{position:absolute;inset:0}@keyframes skeleton-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.private-card-blank{width:100%;aspect-ratio:4 / 3;border:var(--border-hairline);border-radius:var(--radius-lg);box-shadow:var(--shadow-offset);background:repeating-linear-gradient(45deg,var(--color-paper-dim),var(--color-paper-dim) 10px,var(--color-paper) 10px,var(--color-paper) 20px);display:flex;align-items:center;justify-content:center;text-align:center;padding:var(--space-5);font-size:var(--text-lg);font-weight:600}.private-card-hidden{width:100%;aspect-ratio:4 / 3;border:var(--border-hairline);border-radius:var(--radius-lg);box-shadow:var(--shadow-offset);background:var(--color-paper-dim);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-2);text-align:center;padding:var(--space-5);cursor:pointer;font:inherit;color:inherit;min-height:var(--touch-target)}.private-card-hidden-title{font-size:var(--text-lg);font-weight:600}.private-card-hidden-hint{font-size:var(--text-sm);color:var(--color-ink-soft)}.private-card-peek-hint{position:absolute;left:var(--space-3);bottom:var(--space-3);margin:0;padding:.2rem .45rem;font-size:var(--text-xs);font-weight:600;letter-spacing:.02em;text-transform:uppercase;background:var(--color-ink);color:var(--color-paper);border:var(--border-hairline)}.room-settings{text-align:center}.room-settings-label{margin:0;font-size:var(--text-sm);font-weight:600;color:var(--color-ink-soft)}.room-settings-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-2)}.room-settings-chip{min-height:var(--touch-target);min-width:5.5rem;padding:0 var(--space-4);border:var(--border-hairline);border-radius:var(--radius-md);background:var(--color-paper);color:var(--color-ink);font:inherit;font-size:var(--text-sm);font-weight:600;cursor:pointer}.room-settings-chip:disabled:not(.room-settings-chip--selected){opacity:.55;cursor:not-allowed}.room-settings-chip--selected{background:var(--color-ink);color:var(--color-paper);cursor:default}.reveal-images{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2);width:100%}.reveal-images>figure{margin:0;min-width:0}.reveal-images img,.reveal-images .private-card-blank{width:100%;aspect-ratio:1 / 1;max-height:6.5rem;object-fit:cover;border:var(--border-hairline);border-radius:var(--radius-sm);box-shadow:2px 2px 0 var(--color-ink)}.reveal-images .private-card-blank{min-height:0;height:6.5rem;padding:var(--space-2);font-size:var(--text-xs)}.reveal-images figcaption{text-align:center;font-size:var(--text-xs);color:var(--color-ink-soft);margin-top:var(--space-1)}.reveal-scoring-caption{font-size:var(--text-md);font-weight:600;color:var(--color-success)}.reveal-standings{gap:var(--space-3)}.reveal-standings-label{font-size:var(--text-sm);font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--color-ink-faint)}.reveal-score-row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);min-height:3.75rem;padding:var(--space-3) var(--space-4);border:var(--border-hairline);border-radius:var(--radius-md);background:var(--color-paper);box-shadow:2px 2px 0 var(--color-line-soft)}.reveal-score-row--gained{border-color:var(--color-ink);box-shadow:3px 3px 0 var(--color-ink);background:color-mix(in srgb,var(--color-success) 10%,var(--color-paper))}.reveal-score-name{display:inline-flex;align-items:center;gap:var(--space-2);min-width:0;font-size:var(--text-xl);font-weight:600;line-height:1.15;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.reveal-score-meta{display:inline-flex;align-items:center;gap:var(--space-3);flex-shrink:0}.reveal-score-delta{display:inline-flex;align-items:center;justify-content:center;min-width:3.5rem;min-height:2.5rem;padding:.25rem .65rem;border:var(--border-hairline);border-radius:var(--radius-sm);background:var(--color-paper);box-shadow:2px 2px 0 var(--color-ink);color:var(--color-success);font-family:var(--font-mono);font-size:var(--text-lg);font-weight:700;line-height:1.2}.reveal-score-delta--none{border:none;background:transparent;box-shadow:none;color:var(--color-ink-faint);font-weight:400;min-width:3.5rem;justify-content:center}.reveal-score-total{min-width:2rem;text-align:right;font-family:var(--font-mono);font-size:var(--text-xl);font-weight:700;color:var(--color-ink);line-height:1}.reveal-score-row--gained .reveal-score-total{color:var(--color-ink)}.personal-votes-section{display:flex;flex-direction:column;gap:var(--space-2)}.personal-votes-heading{margin:0;font-family:var(--font-ui);font-size:var(--text-sm);font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--color-ink-soft)}.personal-votes-empty{margin:0;padding:var(--space-3) 0;font-size:var(--text-md);color:var(--color-ink-soft);border-bottom:var(--border-soft)}.onboarding-overlay{position:fixed;inset:0;z-index:40;display:flex;align-items:stretch;justify-content:center;padding:var(--space-4);background:radial-gradient(ellipse 120% 80% at 50% -10%,rgba(245,245,242,.95),transparent 55%),#ffffffeb;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.onboarding-panel{width:min(100%,430px);margin:auto;display:flex;flex-direction:column;gap:var(--space-5);max-height:min(100%,720px);overflow:auto;padding:var(--space-5) var(--space-4);border:var(--border-hairline);border-radius:var(--radius-lg);background:var(--color-paper);box-shadow:var(--shadow-offset)}.onboarding-panel--demo{margin:0 auto;max-height:none}.howto{display:flex;flex-direction:column;gap:var(--space-4)}.howto-title{font-size:var(--text-xl);text-align:center}.howto-pair{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3)}.howto-card{margin:0;display:flex;flex-direction:column;gap:var(--space-2);text-align:center}.howto-card figcaption{font-size:var(--text-xs);font-family:var(--font-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--color-ink-soft)}.howto-scene{display:block;width:100%;height:auto;aspect-ratio:1 / 1;object-fit:cover;border:var(--border-hairline);border-radius:var(--radius-sm);background:var(--color-paper-dim)}.howto-rules{margin:0;padding:var(--space-4);list-style:none;display:flex;flex-direction:column;gap:var(--space-3);border:var(--border-soft);border-radius:var(--radius-md);background:var(--color-paper-dim);text-align:left}.howto-rules li{position:relative;padding-left:var(--space-4);color:var(--color-ink-soft);font-size:var(--text-sm);line-height:1.4}.howto-rules li:before{content:"";position:absolute;left:0;top:.55em;width:6px;height:6px;border-radius:50%;background:var(--color-ink)}@media(max-width:380px){.onboarding-panel{padding:var(--space-4) var(--space-3)}}.demo-page{min-height:100dvh;display:grid;grid-template-columns:minmax(240px,320px) 1fr;background:radial-gradient(circle at 12% 18%,rgba(255,214,170,.55),transparent 42%),radial-gradient(circle at 88% 12%,rgba(170,214,255,.45),transparent 38%),linear-gradient(180deg,#f7f1e6,#efe6d6);color:var(--color-ink)}.demo-chrome{padding:var(--space-5);border-right:var(--border-hairline);background:#fffcf6e0;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);overflow-y:auto}.demo-kicker{margin:0;font-size:var(--text-sm);letter-spacing:.08em;text-transform:uppercase;color:var(--color-ink-soft)}.demo-title{margin:0;font-family:var(--font-display);font-size:var(--text-xl);line-height:1.1}.demo-copy{margin:0;font-size:var(--text-sm);color:var(--color-ink-soft)}.demo-scenario-list{display:flex;flex-direction:column;gap:var(--space-2)}.demo-scenario-btn{display:flex;flex-direction:column;gap:2px;width:100%;padding:var(--space-3);border:var(--border-hairline);background:var(--color-paper);text-align:left;cursor:pointer;box-shadow:var(--shadow-offset)}.demo-scenario-btn--active{outline:2px solid var(--color-ink);outline-offset:1px}.demo-scenario-label{font-weight:600;font-size:var(--text-md)}.demo-scenario-desc{font-size:var(--text-sm);color:var(--color-ink-soft)}.demo-stage{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-4);padding:var(--space-5)}.demo-phone{width:min(100%,390px);min-height:720px;border:var(--border-hairline);border-radius:28px;background:var(--color-paper);box-shadow:var(--shadow-offset);overflow:hidden;display:flex;flex-direction:column;position:relative}.demo-phone-notch{height:12px;margin:10px auto 0;width:108px;border-radius:999px;background:#00000014;flex-shrink:0}.demo-phone .ui-screen{min-height:0;flex:1}.demo-stage-caption{margin:0;font-size:var(--text-sm);color:var(--color-ink-soft)}@media(max-width:860px){.demo-page{grid-template-columns:1fr}.demo-chrome{border-right:none;border-bottom:var(--border-hairline)}.demo-phone{min-height:640px}}.demo-page{display:grid;grid-template-columns:minmax(240px,320px) minmax(0,1fr);gap:var(--space-5);width:100%;max-width:1100px;margin:0 auto;padding:var(--space-5) var(--space-4) var(--space-7);align-items:start}.demo-controls{display:flex;flex-direction:column;gap:var(--space-4);position:sticky;top:var(--space-4)}.demo-eyebrow{font-size:var(--text-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--color-ink-faint)}.demo-meta{font-size:var(--text-sm);color:var(--color-ink-soft);line-height:1.45}.demo-frame{border:var(--border-hairline);border-radius:var(--radius-lg);box-shadow:var(--shadow-offset);background:var(--color-paper-dim);overflow:hidden;max-width:430px;justify-self:center;width:100%}.demo-frame .ui-screen{max-width:none;min-height:640px;background:var(--color-paper)}@media(max-width:800px){.demo-page{grid-template-columns:1fr}.demo-controls{position:static}.demo-frame{justify-self:stretch}}