@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;--bg:#091318;--panel:#101e25;--line:#263941;--text:#edf3ee;--muted:#a2b4b8;--dim:#78929a;--lime:#b7f76b;--teal:#53d6c7;--red:#ff826d;--amber:#efcc74;--risk:var(--teal);font:16px 'DM Sans',sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}h1,h2,h3,p{margin:0}h1,h2,h3,.brand{font-family:'Manrope',sans-serif}h2{font-size:.94rem;font-weight:700}h3{font-size:.9rem}p{line-height:1.5}button,input,select{font:inherit}button{color:inherit}button,select,input[type=range],.scenario{cursor:pointer}button:disabled{opacity:.38;cursor:not-allowed}button:not(:disabled):hover{filter:brightness(1.12)}:focus-visible{outline:2px solid var(--lime);outline-offset:3px}
.masthead{height:54px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px;font-size:1.28rem;letter-spacing:-.05em;font-weight:800;white-space:nowrap}.brand svg{width:24px;height:28px}.brand svg path:first-child{fill:var(--lime)}.brand svg path:last-child{fill:var(--bg)}.divider{height:18px;width:1px;background:var(--line);margin:0 8px}.lab-label{font:500 .75rem 'DM Sans',sans-serif;letter-spacing:.1em;color:var(--muted)}
.preferences{display:flex;align-items:center;gap:20px;font-size:.875rem}.speed-setting{display:flex;align-items:center;gap:7px}select{border:1px solid var(--line);border-radius:6px;background:#182a32;color:var(--text);padding:4px;font-size:.875rem}.toggle{position:relative;display:flex;align-items:center;gap:8px;cursor:pointer}.toggle input{position:absolute;right:0;width:32px;height:22px;opacity:0}.switch{height:18px;width:32px;border-radius:30px;background:#42565d;padding:3px;pointer-events:none}.switch:after{content:'';display:block;width:12px;height:12px;border-radius:50%;background:#d0dcde;transition:transform .2s}.toggle input:checked+.switch{background:var(--lime)}.toggle input:checked+.switch:after{transform:translateX(14px);background:#17351f}.toggle input:focus-visible+.switch{outline:2px solid var(--lime);outline-offset:4px}
main{padding:12px 16px 0;max-width:2200px;margin:auto}.workspace{display:grid;grid-template-columns:236px minmax(400px,1fr) 328px;grid-template-rows:minmax(0,1.25fr) minmax(0,1fr);gap:12px;min-height:0}.panel{border:1px solid var(--line);border-radius:12px;background:var(--panel);min-height:0;min-width:0;overflow:hidden}.controls{grid-column:1;grid-row:1/3;padding:15px;display:flex;flex-direction:column}.section-label{font-size:.75rem;letter-spacing:.08em;color:var(--muted);margin-bottom:10px}fieldset{border:0;padding:0;margin:0;display:grid;gap:6px;flex:none}legend{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}.scenario{position:relative;display:flex;gap:10px;align-items:center;min-height:49px;padding:8px 9px;border:1px solid var(--line);border-radius:8px;background:#112129;transition:background .2s,border-color .2s}.scenario:has(input:checked){border-color:#89b94f;background:#223129}.scenario:has(input:focus-visible){outline:2px solid var(--lime);outline-offset:2px}.scenario input{appearance:none;position:absolute;width:100%;height:100%;margin:0;inset:0;border-radius:8px}.scenario strong{font-size:.875rem;font-weight:600;display:block}.scenario small{font-size:.75rem;color:var(--muted);display:block;margin-top:2px;line-height:1.25}.scenario-symbol{font-size:1.05rem;color:var(--teal);width:17px;text-align:center}.scenario:has(input:checked) .scenario-symbol{color:var(--lime)}
.threshold-control{border-top:1px solid var(--line);margin-top:12px;padding-top:9px;flex:none}.line-label{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:.875rem}#threshold-value{font:600 1.6rem 'Manrope',sans-serif;color:var(--lime)}#threshold-value span{font-size:.9rem;margin-left:2px}input[type=range]{width:100%;height:18px;margin:7px 0 3px;accent-color:var(--lime)}.range-labels{display:flex;justify-content:space-between;font-size:.75rem;color:var(--muted)}.threshold-control .hint{display:none}.button{border:1px solid var(--line);border-radius:7px;padding:7px 10px;font-size:.875rem;font-weight:600;min-height:34px;transition:background .2s,filter .2s}.primary{width:100%;background:var(--lime);border-color:var(--lime);color:#122316;display:flex;gap:8px;justify-content:center;align-items:center;margin-top:12px;flex:none}.secondary{background:#182a32}.transport{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;margin-top:6px;flex:none}.transport .button{padding:6px 3px;font-size:.8rem}.end-button{background:#281e21;color:var(--red)}.hint{font-size:.75rem;color:var(--muted);line-height:1.4}.privacy-note{margin:10px 0 12px;flex:none}
.activity{border-top:1px solid var(--line);display:flex;flex:1;min-height:65px;flex-direction:column}.activity .panel-head{padding:12px 0 5px}.activity h2{font-size:.875rem}#events{margin:0;padding:0;list-style:none;min-height:0;overflow:auto;flex:1;scrollbar-width:thin;scrollbar-color:#456068 transparent}#events li{font-size:.75rem;line-height:1.45;display:flex;gap:8px;padding:8px 0;border-bottom:1px solid #263b4266}#events time{font-family:ui-monospace,monospace;font-size:.75rem;color:var(--dim);min-width:35px}#events span{color:#b5c8ca}#events li.important span{color:var(--lime)}
.stage{grid-column:2;grid-row:1;display:flex;flex-direction:column;background:radial-gradient(ellipse at 45% 42%,#1b3439 0,transparent 64%),#0f2027}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:13px 16px;flex:none}.stage-tools{display:flex;gap:13px;align-items:center}.stage-tools .button{font-size:.75rem;min-height:28px;padding:4px 8px}.state-pill{font-size:.75rem;color:var(--muted);display:flex;gap:6px;align-items:center;white-space:nowrap}.state-pill:before{content:'';display:block;width:5px;height:5px;border-radius:50%;background:var(--dim)}.state-pill.active{color:var(--lime)}.state-pill.active:before{background:var(--lime)}.state-pill.alert{color:var(--red)}.state-pill.alert:before{background:var(--red)}.scene-wrap{position:relative;flex:1;min-height:0}#scene{position:absolute;inset:0}#scene canvas{display:block;width:100%;height:100%}.scene-caption{position:absolute;bottom:7px;left:16px;font-size:.75rem;color:var(--dim);pointer-events:none}.scene-key{position:absolute;right:16px;bottom:7px;display:flex;gap:10px;font-size:.75rem;color:var(--muted)}.scene-key span{display:flex;align-items:center;gap:5px}.scene-key i{width:5px;height:5px;border-radius:10px;background:var(--teal)}.scene-key .key-alert{background:var(--red)}#scene-fallback{position:absolute;inset:0;padding:20px;text-align:center;color:var(--muted);font-size:.875rem}
.pipeline{display:grid;grid-template-columns:repeat(5,1fr);margin:6px 16px 0;padding:0;list-style:none;flex:none}.pipeline li{padding:8px 3px 8px 0;border-top:1px solid #3a5058;min-width:0}.pipeline b{font-size:.75rem;color:var(--dim);font-weight:500;margin-right:5px}.pipeline span{font-size:.8rem;font-weight:600}.pipeline small{font-size:.75rem;color:var(--muted);display:block;margin-top:3px;line-height:1.25}.pipeline li.active{border-color:var(--lime)}.pipeline li.active b,.pipeline li.active span{color:var(--lime)}.pipeline li.done{border-color:var(--teal)}.pipeline li.done b{color:var(--teal)}.pipeline li.alert{border-color:var(--red)}.pipeline li.alert b,.pipeline li.alert span{color:var(--red)}.stage-narration{display:flex;gap:11px;align-items:center;padding:9px 16px;background:#0b181ecc;border-top:1px solid var(--line);height:57px;flex:none}.stage-narration>span{font:500 1.3rem 'Manrope',sans-serif;color:var(--lime)}.stage-narration p{font-size:.875rem;line-height:1.4;max-height:40px;overflow:auto}
.response{grid-column:3;grid-row:1/3;padding:16px;display:flex;flex-direction:column}.score-title{display:flex;justify-content:space-between;align-items:center;gap:8px;flex:none}.score-title>span{color:var(--risk);font-size:.75rem}.score-row{display:flex;align-items:end;justify-content:space-between;margin-top:6px;flex:none}#score{font:500 3.3rem/1.05 'Manrope',sans-serif;letter-spacing:-.06em;color:var(--risk)}.percent{font-size:1.2rem;color:var(--dim);margin-left:4px}#risk-spark{height:44px;display:flex;align-items:end;gap:3px;width:90px;margin-bottom:4px}#risk-spark i{display:block;width:6px;background:var(--risk);opacity:.5;border-radius:2px 2px 0 0}.risk-track{position:relative;height:5px;border-radius:3px;background:#30434b;margin-top:11px;flex:none}#risk-fill{height:100%;width:0;background:var(--risk);border-radius:3px;transition:width .65s}#threshold-marker{position:absolute;left:70%;top:-4px;height:13px;width:2px;background:var(--text)}.score-meta{font-size:.75rem;color:var(--muted);margin-top:8px;flex:none}.evidence{color:var(--muted);font-size:.875rem;line-height:1.45;margin:12px 0;min-height:42px;max-height:61px;overflow:auto;flex:none}
.guardian{border:1px solid #34515a;border-radius:10px;padding:13px;background:#152930;transition:border-color .3s;min-height:0;display:flex;flex-direction:column;flex:1}.guardian.notified{border-color:var(--red);background:#2a292b}.guardian-title{display:flex;align-items:center;gap:8px;flex:none}.avatar{border-radius:50%;background:#344949;width:30px;height:30px;display:grid;place-items:center;font-size:.75rem;color:#e9edce;flex:none}.guardian-title h3{font-size:.875rem}.guardian-title p{font-size:.75rem;color:var(--muted);margin-top:2px}#guardian-badge{font-size:.75rem;color:var(--teal);margin-left:auto;text-align:right;max-width:80px}.guardian-summary{font-size:.875rem;line-height:1.4;color:#b6c9cc;padding:10px 0;flex:none}#guardian-excerpt{font-size:.8rem;line-height:1.45;padding:7px 9px;border-left:2px solid var(--red);margin-bottom:10px;background:#0a15194d;color:#e1dbd4;max-height:64px;overflow:auto;flex-shrink:0}.guardian-actions{display:flex;flex-direction:column;gap:6px;flex:none}.guardian-button{padding:8px;background:#233941;font-size:.85rem;text-align:left;display:flex;align-items:center;gap:8px;min-height:36px}.guardian-button span{color:var(--teal);font-size:1rem}.notified .guardian-button:not(:disabled){border-color:#59725d;background:#2f4337}.guardian-button.done{border-color:var(--teal);opacity:.85;background:#203d37}.integration-note{font-size:.75rem;margin-top:auto;padding-top:10px}#action-feedback:not(:empty){font-size:.85rem;line-height:1.4;margin-top:10px;padding:8px;border:1px solid #57794e;border-radius:7px;color:var(--lime);background:#23322c;min-height:0;max-height:72px;overflow:auto}
.transcript{grid-column:2;grid-row:2;display:flex;flex-direction:column;min-height:0}.transcript-heading{display:flex;gap:12px;align-items:center}.transcript-heading>span{font-size:.75rem;color:var(--teal)}.mono{font-family:ui-monospace,monospace;font-size:.875rem;color:var(--muted)}#transcript{flex:1;min-height:0;overflow:auto;padding:0 16px 14px;scrollbar-width:thin;scrollbar-color:#456068 transparent}.transcript-empty{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:8px}.wave-icon{color:var(--teal);letter-spacing:4px;font-size:1.3rem;opacity:.7}.transcript-empty p{font-size:.94rem;color:var(--muted)}.transcript-empty small{font-size:.8rem;color:var(--dim)}.utterance{display:grid;grid-template-columns:64px 1fr;gap:10px;margin:12px 0 0;align-items:start}.utterance .speaker{font-size:.8rem;color:var(--teal);line-height:1.55}.utterance time{display:block;font-size:.75rem;color:var(--dim);margin-top:2px}.utterance p{font-size:1rem;line-height:1.5;color:#d4e3e3}.utterance.user .speaker{color:var(--muted)}.utterance.guardian .speaker{color:var(--lime)}.utterance.risky p{border-left:2px solid var(--red);padding-left:10px}.utterance.typing p:after{content:'▍';color:var(--lime);margin-left:3px}.transcript-footer{padding:8px 16px;border-top:1px solid var(--line);font-size:.75rem;display:flex;justify-content:space-between;color:var(--muted);gap:10px;flex:none}
footer{font-size:.75rem;color:var(--dim);height:26px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex:none}dialog{width:min(650px,calc(100vw - 32px));max-height:85dvh;border:1px solid #45616a;border-radius:14px;padding:24px;background:var(--panel);color:var(--text)}dialog::backdrop{background:#02090dcf;backdrop-filter:blur(5px)}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}.notes-grid{display:grid;gap:20px}.notes-grid h3{color:var(--teal);margin-bottom:8px}.notes-grid p{font-size:1rem;line-height:1.6}.skip{position:absolute;left:20px;top:-100px;z-index:10;background:var(--lime);color:var(--bg);padding:10px}.skip:focus{top:6px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.noscript{padding:30px;color:var(--red)}
@media(min-width:1100px) and (min-height:620px){html,body{height:100%;overflow:hidden}body{display:flex;flex-direction:column}.masthead{flex:none}main{width:100%;flex:1;min-height:0;display:flex;flex-direction:column}.workspace{flex:1}}
@media(min-width:1600px){.workspace{grid-template-columns:260px minmax(400px,1fr) 360px}.scenario{min-height:56px}.controls{padding:18px}.response{padding:20px}.guardian{padding:16px}.guardian-button{min-height:42px}.guardian-summary{padding:13px 0}}
@media(min-width:1100px) and (max-height:780px){.masthead{height:46px}main{padding:8px 12px 0}.workspace{gap:8px;grid-template-columns:218px minmax(400px,1fr) 310px}.controls,.response{padding:12px}.scenario{min-height:43px;padding:6px 8px;gap:8px}.section-label{margin-bottom:7px}.threshold-control{margin-top:9px;padding-top:5px}.range-labels{display:none}.primary{margin-top:8px}.privacy-note{margin:8px 0}.button{min-height:31px;padding:5px 8px}.panel-head{padding:9px 12px}.pipeline{margin:3px 12px 0}.pipeline small,.pipeline b{display:none}.pipeline li{padding:7px 2px 7px 0}.stage-narration{height:48px;padding:6px 12px}.stage-narration p{font-size:.85rem;max-height:36px}.stage-tools{gap:8px}.stage-tools .button{min-height:26px}.scene-caption{bottom:4px}.score-row{margin-top:3px}#score{font-size:2.85rem}.risk-track{margin-top:8px}.score-meta{margin-top:6px}.evidence{margin:9px 0;min-height:38px;max-height:58px;font-size:.85rem}.guardian{padding:10px}.guardian-summary{font-size:.82rem;padding:7px 0}#guardian-excerpt{max-height:44px;margin-bottom:7px;padding:5px 7px}.guardian-actions{gap:5px}.guardian-button{font-size:.82rem;min-height:32px;padding:6px}.integration-note{padding-top:7px}.transcript-footer{padding:7px 12px}#transcript{padding:0 12px 10px}#action-feedback:not(:empty){margin-top:7px;padding:6px;font-size:.8rem;max-height:49px}footer{height:23px}}
@media(max-width:1250px) and (min-width:1100px){.workspace{grid-template-columns:205px minmax(0,1fr) 294px}.lab-label,.divider{display:none}.preferences{gap:14px}.pipeline span{font-size:.75rem}.pipeline small{display:none}.guardian-title{gap:6px}}
@media(max-width:1099px),(max-height:619px){.workspace{grid-template-columns:210px minmax(0,1fr);grid-template-rows:400px 300px auto}.controls{grid-row:1/3}.stage{grid-column:2;grid-row:1}.transcript{grid-column:2;grid-row:2}.response{grid-column:1/3;grid-row:3;display:grid;grid-template-columns:1fr 1fr;column-gap:24px}.response>.score-title,.response>.score-row,.response>.risk-track,.response>.score-meta,.response>.evidence{grid-column:1}.guardian{grid-column:2;grid-row:1/7}.preferences{gap:12px}.lab-label,.divider{display:none}.pipeline small,.pipeline b{display:none}.stage-tools{gap:8px}.scene-caption{display:none}.evidence{max-height:none}}
@media(max-width:700px){.masthead{height:auto;min-height:85px;padding:10px 14px;flex-wrap:wrap;gap:9px}.brand{font-size:1.2rem}.preferences{width:100%;justify-content:space-between;font-size:.8rem;gap:8px}.preferences .button{font-size:.75rem;min-height:28px;padding:4px 7px}main{padding:10px 10px 0}.workspace{display:flex;flex-direction:column;gap:10px}.controls{padding:12px;max-height:none}.activity{height:145px;flex:auto}.scenario{min-height:52px}fieldset{grid-template-columns:1fr 1fr}.privacy-note{margin:8px 0}.stage{height:365px;flex:none;scroll-margin-top:10px}.stage-tools .state-pill{display:none}.panel-head{padding:12px}.pipeline{margin:4px 12px 0}.pipeline span{font-size:.75rem}.stage-narration{height:66px;padding:8px 12px}.stage-narration p{max-height:50px;font-size:.85rem}.transcript{height:290px;flex:none}.transcript-heading{gap:8px}.utterance{grid-template-columns:56px 1fr}.transcript-footer{padding:8px 12px;flex-wrap:wrap}.response{display:flex;padding:14px}.guardian{margin-top:6px}.guardian-summary{font-size:.875rem}.guardian-button{font-size:.875rem;min-height:40px}#action-feedback:not(:empty){max-height:none}footer{height:auto;padding:10px 0;flex-wrap:wrap;gap:6px}.workspace.running .controls fieldset,.workspace.running .controls .section-label,.workspace.running .privacy-note,.workspace.running .activity{display:none}.workspace.running .controls{position:sticky;top:0;z-index:5;box-shadow:0 8px 25px #0005}.workspace.running .threshold-control{margin:0;padding:0;border:0}.workspace.running .range-labels,.workspace.running #run{display:none}.workspace.running .stage{scroll-margin-top:125px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
.guardian-summary.notification{padding:9px;margin:9px 0;border:1px solid #a56d5d;border-left:3px solid var(--red);border-radius:7px;background:#4a302d;color:#ffe9df}.notification strong{display:flex;align-items:center;gap:7px;font-size:.85rem;line-height:1.35}.notification-icon{display:grid;place-items:center;width:19px;height:19px;border-radius:50%;flex:none;background:var(--red);color:#351912;font-size:.85rem;font-weight:700}.notification p{font-size:.8rem;line-height:1.4;margin:5px 0 0 26px;color:#eed5ca}
@media(min-width:1100px) and (max-height:780px){.guardian-summary.notification{padding:7px;margin:7px 0}.notification strong{font-size:.82rem}.notification p{font-size:.78rem;margin-top:4px}}