:root {
  --ink:#0b0b0d;
  --paper:#f1efe8;
  --acid:#c8ff2e;
  --cyan:#52d7ff;
  --orange:#ff5c35;
  --muted:#9a9994;
  --line:rgba(241,239,232,.2);
  --pad:clamp(1rem,3vw,2.6rem);
}
*{box-sizing:border-box}
html{background:var(--ink);color:var(--paper);font-family:Arial,Helvetica,sans-serif;scroll-behavior:smooth}
body{margin:0;min-height:100vh;background:var(--ink);overflow-x:hidden}
button,input,textarea{font:inherit}
button{color:inherit}
button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}
.noise{position:fixed;inset:0;pointer-events:none;opacity:.045;z-index:20;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E")}
.topbar{height:72px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 var(--pad);position:relative;z-index:5;background:rgba(11,11,13,.93);backdrop-filter:blur(14px)}
.brand{border:0;background:none;padding:0;display:flex;align-items:center;gap:.7rem;font-weight:900;letter-spacing:-.04em;font-size:1.05rem;cursor:pointer;width:max-content}
.brand-mark{width:32px;height:32px;display:grid;place-items:center;background:var(--acid);color:var(--ink);border-radius:50%;font-family:Georgia,serif;font-style:italic;font-size:1.15rem}
.top-meta{font-size:.68rem;letter-spacing:.15em;font-weight:700;color:var(--muted)}
.live-dot{display:inline-block;width:7px;height:7px;background:var(--acid);border-radius:50%;margin-right:.55rem;box-shadow:0 0 14px var(--acid)}
.text-button{justify-self:end;border:0;background:none;padding:.5rem 0;font-size:.72rem;font-weight:800;letter-spacing:.08em;cursor:pointer}
.header-actions{justify-self:end;display:flex;align-items:center;gap:1rem}
.profile-chip{border:1px solid var(--line);background:#141417;display:flex;align-items:center;gap:.55rem;padding:.55rem .7rem;font-size:.68rem;font-weight:900;letter-spacing:.08em;cursor:pointer}
.profile-chip span:first-child{width:9px;height:9px;border-radius:50%;box-shadow:0 0 12px currentColor}
.home{min-height:calc(100vh - 72px);display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr)}
.hero{padding:clamp(3rem,7vw,7rem) var(--pad) 2rem;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;width:32vw;height:32vw;border:1px solid rgba(82,215,255,.25);border-radius:50%;right:-8vw;top:13%;box-shadow:0 0 0 5vw rgba(82,215,255,.035),0 0 0 10vw rgba(82,215,255,.02);pointer-events:none}
.kicker,.eyebrow{font-size:.72rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase}
.kicker{display:flex;align-items:center;gap:.7rem;color:var(--acid)}
.kicker:before{content:"";width:34px;height:2px;background:currentColor}
.display{font-size:clamp(4.4rem,11.8vw,11rem);line-height:.75;letter-spacing:-.085em;margin:clamp(2rem,5vw,4rem) 0 2rem;font-weight:950;max-width:1100px;position:relative;z-index:1}
.display em{display:block;font-family:Georgia,serif;font-weight:400;color:var(--cyan);letter-spacing:-.08em;transform:translateX(9%)}
.hero-bottom{display:grid;grid-template-columns:minmax(210px,420px) 1fr;align-items:end;gap:2rem;position:relative;z-index:1}
.lede{font-size:clamp(1.05rem,1.6vw,1.35rem);line-height:1.45;margin:0;color:#c9c7c0;max-width:38ch}
.scribble{justify-self:end;color:var(--orange);font-family:Georgia,serif;font-style:italic;transform:rotate(-7deg);font-size:1rem;max-width:160px;text-align:center}
.side-panel{border-left:1px solid var(--line);display:flex;flex-direction:column;background:#101013}
.panel-top{padding:var(--pad);flex:1;display:flex;flex-direction:column;justify-content:center}
.big-number{font-size:clamp(5rem,9vw,9rem);font-weight:900;letter-spacing:-.09em;line-height:1;color:var(--acid)}
.panel-copy{font-size:.78rem;text-transform:uppercase;letter-spacing:.11em;line-height:1.5;color:var(--muted);max-width:25ch}
.panel-actions{padding:var(--pad);border-top:1px solid var(--line);display:grid;gap:.8rem}
.primary,.secondary,.danger{border:1px solid transparent;min-height:58px;padding:0 1.25rem;font-size:.82rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;display:flex;align-items:center;justify-content:space-between;transition:transform .18s,background .18s,color .18s}
.primary{background:var(--acid);color:var(--ink)}
.primary:hover{transform:translateY(-3px);background:#dcff78}
.primary:disabled{opacity:.35;cursor:not-allowed;transform:none}
.secondary{border-color:var(--line);background:transparent}
.secondary:hover{border-color:var(--paper)}
.danger{background:var(--orange);color:var(--ink)}
.workspace{min-height:calc(100vh - 72px);padding:var(--pad);display:grid;grid-template-rows:auto 1fr;gap:clamp(2rem,4vw,4rem)}
.progress-rail{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1rem;font-size:.7rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.rail{height:3px;background:#2a2a2d;position:relative;overflow:hidden}
.rail span{display:block;height:100%;background:var(--acid);transition:width .5s cubic-bezier(.22,1,.36,1)}
.setup-grid{display:grid;grid-template-columns:minmax(250px,.65fr) minmax(0,1.35fr);gap:clamp(2rem,7vw,8rem);align-items:start;max-width:1400px;width:100%;margin:auto}
.section-title{font-size:clamp(3.3rem,7vw,7.7rem);line-height:.84;letter-spacing:-.075em;margin:.75rem 0 1.5rem;font-weight:950}
.section-title em{font-family:Georgia,serif;font-weight:400;color:var(--cyan)}
.support{color:#aaa9a4;line-height:1.55;max-width:36ch;margin:0}
.form-stack{display:grid;gap:1.35rem}
.field{display:grid;gap:.55rem}
.field label,.field-label{font-size:.69rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase;color:#bbb9b2}
.field input,.field textarea{width:100%;border:0;border-bottom:1px solid #555;background:transparent;color:var(--paper);padding:.8rem 0;font-size:clamp(1.2rem,2.4vw,2.1rem);border-radius:0}
.field textarea{min-height:145px;resize:vertical;line-height:1.2;font-family:Georgia,serif;font-size:clamp(1.4rem,2.8vw,2.35rem)}
.field input::placeholder,.field textarea::placeholder{color:#555}
.counter{justify-self:end;font-size:.68rem;color:var(--muted)}
.players-head{display:flex;justify-content:space-between;align-items:center}
.stepper{display:flex;align-items:center;border:1px solid var(--line)}
.stepper button{width:42px;height:38px;background:transparent;border:0;color:var(--paper);font-size:1.2rem;cursor:pointer}
.stepper output{width:42px;text-align:center;font-weight:900;color:var(--acid)}
.names{display:grid;grid-template-columns:repeat(2,1fr);gap:.7rem}
.name-input{background:#161619!important;border:1px solid var(--line)!important;padding:.85rem!important;font-size:1rem!important}
.form-actions{display:flex;gap:.8rem;margin-top:.7rem}
.form-actions>*{flex:1}
.handoff{min-height:calc(100vh - 72px);display:grid;place-items:center;padding:var(--pad);position:relative;overflow:hidden;text-align:center}
.handoff:before{content:"";position:absolute;inset:8%;border:1px solid var(--line);border-radius:50%;animation:pulse 2.5s ease-in-out infinite}
.handoff-card{position:relative;z-index:1;max-width:760px}
.handoff-index{font-size:clamp(8rem,25vw,20rem);font-weight:950;line-height:.72;letter-spacing:-.1em;color:#17171a;-webkit-text-stroke:1px #333;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:-1}
.handoff h1{font-size:clamp(3rem,8vw,7rem);letter-spacing:-.07em;line-height:.86;margin:1rem 0}
.handoff h1 em{display:block;color:var(--acid);font-family:Georgia,serif;font-weight:400}
.handoff p{color:var(--muted);font-size:1rem;margin:1rem auto 2rem;max-width:38ch;line-height:1.5}
.handoff .primary{min-width:min(100%,360px);margin:auto}
.retell-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(290px,.45fr);gap:clamp(2rem,5vw,5rem);align-items:stretch;max-width:1500px;width:100%;margin:auto}
.message-stage{display:flex;flex-direction:column;gap:1.5rem}
.heard-box{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:clamp(1.5rem,3vw,3rem) 0}
.heard-box blockquote{font-family:Georgia,serif;font-size:clamp(2rem,4.5vw,4.5rem);line-height:1.06;letter-spacing:-.045em;margin:1rem 0 0;max-width:22ch}
.retell-box textarea{background:var(--paper);color:var(--ink);border:0;width:100%;min-height:170px;padding:1.25rem;font-family:Georgia,serif;font-size:clamp(1.3rem,2.6vw,2.2rem);line-height:1.25;resize:vertical}
.mission-card{background:var(--cyan);color:var(--ink);padding:clamp(1.5rem,3vw,2.5rem);display:flex;flex-direction:column;justify-content:space-between;min-height:480px}
.mission-card .eyebrow{opacity:.65}
.mission-card h2{font-size:clamp(2.7rem,5vw,5rem);line-height:.82;letter-spacing:-.07em;margin:1rem 0}
.mission-card p{line-height:1.5;max-width:28ch}
.mission-card .primary{background:var(--ink);color:var(--paper)}
.share-strip{border:1px solid var(--line);padding:1rem;display:grid;grid-template-columns:1fr auto;gap:1rem;align-items:center}
.share-strip p{margin:.2rem 0;color:var(--muted);font-size:.8rem}
.compact{min-height:42px;padding:0 1rem}
.reveal{padding:var(--pad);max-width:1600px;margin:auto}
.reveal-head{display:grid;grid-template-columns:1fr auto;align-items:end;gap:2rem;padding:clamp(2rem,6vw,6rem) 0 2rem}
.reveal-title{font-size:clamp(4.5rem,11vw,11rem);line-height:.72;letter-spacing:-.085em;margin:0;font-weight:950}
.reveal-title em{font-family:Georgia,serif;font-weight:400;color:var(--orange)}
.score{width:170px;height:170px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;text-align:center;position:relative}
.score strong{font-size:3.6rem;line-height:1;letter-spacing:-.08em;color:var(--acid)}
.score span{display:block;font-size:.62rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin-top:.4rem}
.comparison{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);margin:2rem 0}
.compare-card{padding:clamp(1.5rem,3.5vw,3.5rem);min-height:330px}
.compare-card+ .compare-card{border-left:1px solid var(--line);background:var(--paper);color:var(--ink)}
.compare-card blockquote{font-family:Georgia,serif;font-size:clamp(1.65rem,3vw,3rem);line-height:1.15;margin:2rem 0 0}
.evidence-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:3rem}
.evidence{background:var(--ink);padding:1.5rem;min-height:170px}
.evidence b{font-size:2.7rem;display:block;letter-spacing:-.06em;margin:.65rem 0}
.evidence:nth-child(1) b{color:var(--orange)}.evidence:nth-child(2) b{color:var(--acid)}.evidence:nth-child(3) b{color:var(--cyan)}
.chips{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1rem}
.chip{border:1px solid #3e3e42;padding:.35rem .55rem;border-radius:999px;font-size:.7rem;color:#c6c4be}
.timeline-head{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 0;border-bottom:1px solid var(--line)}
.timeline{display:grid}
.timeline-item{display:grid;grid-template-columns:80px 160px 1fr auto;gap:1rem;align-items:start;padding:1.4rem 0;border-bottom:1px solid var(--line)}
.turn-num{font-size:.7rem;color:var(--muted);letter-spacing:.1em}
.speaker{font-size:.8rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em;color:var(--cyan)}
.timeline-item p{font-family:Georgia,serif;font-size:clamp(1.15rem,2vw,1.7rem);line-height:1.25;margin:0}
.delta{font-size:.67rem;white-space:nowrap;color:var(--muted)}
.reveal-actions{display:flex;gap:.8rem;padding:2rem 0 5rem}.reveal-actions>*{flex:1}
.dialog{background:var(--paper);color:var(--ink);border:0;padding:0;max-width:680px;width:calc(100% - 2rem);box-shadow:0 30px 100px rgba(0,0,0,.5)}
.dialog::backdrop{background:rgba(11,11,13,.78);backdrop-filter:blur(6px)}
.dialog-head{display:flex;justify-content:space-between;align-items:center;padding:1.25rem;border-bottom:1px solid #cbc8bf}
.icon-button{border:0;background:none;font-size:2rem;line-height:1;cursor:pointer}
.rule-list{list-style:none;padding:0;margin:0;counter-reset:rules}
.rule-list li{display:grid;grid-template-columns:120px 1fr;gap:1rem;padding:1.5rem;border-bottom:1px solid #cbc8bf;line-height:1.45}
.rule-list b{font-size:1.2rem}.rule-list span{color:#4f4f4c}
.fine-print{padding:1.5rem;margin:0;font-size:.75rem;text-transform:uppercase;letter-spacing:.08em}
.profile-body{padding:clamp(1.25rem,4vw,2.5rem);display:grid;gap:1.4rem}
.avatar-xl{width:92px;height:92px;border-radius:50%;display:grid;place-items:center;color:var(--ink);font-size:2rem;font-weight:950}
.color-field{border:0;padding:0;margin:0}.color-field legend{font-size:.69rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase;color:#555;margin-bottom:.7rem}
.color-options{display:flex;flex-wrap:wrap;gap:.65rem}.color-choice input{position:absolute;opacity:0}.color-choice span{display:block;width:36px;height:36px;background:var(--swatch);border-radius:50%;cursor:pointer;border:4px solid transparent}.color-choice input:checked+span{border-color:var(--ink);outline:2px solid var(--swatch);outline-offset:2px}
.profile-note{padding:0;color:#65655f}
.lobby-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.65fr);gap:clamp(2rem,6vw,6rem);align-items:start;max-width:1500px;width:100%;margin:auto}
.lobby-main{display:grid;gap:1.5rem}.invite-box{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem;align-items:center;padding:1rem 1.1rem;border:1px solid var(--line);background:#111114}.invite-box p{margin:.45rem 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--cyan);font-size:.8rem}
.participant-section{margin-top:1rem}.connection-count{font-size:.7rem;color:var(--acid);letter-spacing:.1em;font-weight:900}
.participant-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;margin-top:1rem}.participant{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.8rem;border:1px solid var(--line);background:#121215;padding:.8rem}.avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;color:var(--ink);font-size:.78rem;font-weight:950}.participant b{display:block;font-size:.88rem}.participant small{display:block;font-size:.61rem;color:var(--muted);letter-spacing:.1em;margin-top:.25rem}
.online-dot{width:8px;height:8px;border-radius:50%;background:var(--acid);box-shadow:0 0 12px var(--acid);display:inline-block}.online-dot.offline{background:var(--orange);box-shadow:0 0 12px var(--orange)}
.host-form{border:1px solid var(--line);background:#111114;padding:clamp(1.3rem,3vw,2.2rem)}.host-badge,.signal-badge{font-size:.68rem;letter-spacing:.11em;font-weight:900}.host-badge .live-dot{margin-right:.45rem}.host-hint{font-size:.78rem;color:var(--muted);margin:0}
.signal-orbit{width:110px;height:110px;position:relative;margin:0 auto 2rem;border:1px solid rgba(82,215,255,.25);border-radius:50%}.signal-orbit:before,.signal-orbit:after{content:"";position:absolute;inset:16px;border:1px solid rgba(82,215,255,.3);border-radius:50%;animation:pulse 1.8s ease-in-out infinite}.signal-orbit:after{inset:34px;animation-delay:.3s}.signal-orbit span{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--cyan);left:50%;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 24px var(--cyan)}.signal-orbit.small{width:76px;height:76px}
.guest-lobby{max-width:900px;width:100%;margin:auto;text-align:center}.guest-lobby .support{margin:0 auto}.signal-badge{display:inline-flex;align-items:center;gap:.55rem;border:1px solid var(--line);padding:.65rem .8rem}.participant-list.wide{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:3rem;text-align:left}
.monitor{display:grid;grid-template-columns:1fr minmax(320px,.8fr);gap:clamp(2rem,8vw,8rem);align-items:center;max-width:1300px;width:100%;margin:auto}.transmission-card{border:1px solid var(--line);padding:clamp(1.5rem,4vw,3rem);background:#111114;display:grid;gap:2.4rem}.active-player{display:flex;align-items:center;gap:1.2rem}.active-player .avatar-xl{width:100px;height:100px}.active-player small{font-size:.68rem;letter-spacing:.12em;color:var(--muted)}.active-player h2{font-size:clamp(2rem,4vw,4rem);letter-spacing:-.06em;margin:.25rem 0}.status-line{display:flex;align-items:center;justify-content:center;gap:.7rem;padding:1rem;border:1px solid var(--line);font-size:.68rem;font-weight:900;letter-spacing:.1em}.turn-order{display:flex;gap:.5rem}.turn-order span{width:34px;height:34px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;font-size:.7rem;color:var(--muted)}.turn-order span.done{background:var(--acid);border-color:var(--acid);color:var(--ink)}.turn-order span.active{border-color:var(--cyan);color:var(--cyan);box-shadow:0 0 16px rgba(82,215,255,.25)}
.waiting-card{margin:auto;text-align:center}.waiting-card .status-line{width:max-content;max-width:100%;margin:2rem auto 0}
.toast{position:fixed;left:50%;bottom:2rem;transform:translate(-50%,140%);background:var(--acid);color:var(--ink);padding:.9rem 1.2rem;font-weight:900;font-size:.75rem;letter-spacing:.08em;z-index:30;transition:transform .25s}
.toast.show{transform:translate(-50%,0)}
@keyframes pulse{50%{transform:scale(.94);opacity:.5}}
@media(max-width:850px){
  .topbar{grid-template-columns:1fr auto}.top-meta{display:none}.header-actions .text-button{display:none}
  .home{grid-template-columns:1fr}.side-panel{border-left:0;border-top:1px solid var(--line)}
  .panel-top{display:none}.hero{min-height:64vh}.hero-bottom{grid-template-columns:1fr}.scribble{display:none}
  .setup-grid,.retell-layout,.lobby-grid,.monitor{grid-template-columns:1fr}.mission-card{min-height:auto;gap:2rem}.participant-list.wide{grid-template-columns:repeat(2,minmax(0,1fr))}
  .reveal-head{grid-template-columns:1fr}.score{width:130px;height:130px}.comparison{grid-template-columns:1fr}.compare-card+.compare-card{border-left:0;border-top:1px solid var(--line)}
  .evidence-grid{grid-template-columns:1fr}.timeline-item{grid-template-columns:54px 1fr}.timeline-item p{grid-column:2}.delta{grid-column:2}
}
@media(max-width:520px){
  .topbar{height:62px}.home,.workspace,.handoff{min-height:calc(100vh - 62px)}
  .display{font-size:22vw}.names{grid-template-columns:1fr}.form-actions,.reveal-actions{flex-direction:column}.profile-chip #profile-name{display:none}.participant-list,.participant-list.wide{grid-template-columns:1fr}.invite-box{grid-template-columns:1fr}.big-number{font-size:4.8rem}
  .share-strip{grid-template-columns:1fr}.rule-list li{grid-template-columns:1fr;gap:.4rem}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}