:root{color:#eef1ef;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#111311;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{min-width:320px;min-height:100%;margin:0}body{min-height:100svh;overflow-x:hidden}button,input,textarea,select{font:inherit}button{-webkit-tap-highlight-color:transparent}:root{--lcd-width:240px;--lcd-height:280px;--lcd-bezel:10px;--device-width:340px;--device-height:520px;--device-radius:30px;--case-pad-x:40px;--case-pad-top:26px;--deck-gap:24px;--pad-size:140px;--pad-ok-size:54px;--key-width:82px;--key-height:42px;--key-gap:30px;--scale:1;--mint:#6fdcbb;--mint-deep:#2c6d5b;--amber:#d9a05e;--stop:#c9564d;--stop-edge:#6d3a36;--lcd-bg:#070b0a;--lcd-panel:#0d1614;--lcd-line:#222d2a;--lcd-text:#eef3f1;--lcd-dim:#77857f;--case:#343835;--case-deep:#232624;--case-edge:#161817;--key-face:#3b3f3c}.demo-stage{background:#111311;flex-direction:column;justify-content:center;align-items:center;gap:20px;min-height:100svh;padding:24px 16px;display:flex;position:relative}.demo-stage:before{z-index:0;content:"";pointer-events:none;background:radial-gradient(60% 50% at 50% 45%,#ffffff09,#0000 70%);position:absolute;inset:0}.device-frame{z-index:1;width:calc(var(--device-width) * var(--scale));height:calc(var(--device-height) * var(--scale));flex:none;position:relative}.device-shell{width:var(--device-width);height:var(--device-height);padding:var(--case-pad-top) var(--case-pad-x) 0;border-radius:var(--device-radius);color:#eef0ef;background:linear-gradient(180deg, #383c39 0%, var(--case) 26%, var(--case-deep) 100%);box-shadow:0 0 0 1px var(--case-edge), 0 1px 0 #ffffff17 inset, 0 -1px 0 #00000080 inset, 0 18px 38px #00000080;transform:scale(var(--scale));transform-origin:0 0;flex-direction:column;display:flex;position:absolute;top:0;left:0}.display-module{width:calc(var(--lcd-width) + var(--lcd-bezel) * 2);height:calc(var(--lcd-height) + var(--lcd-bezel) * 2);padding:var(--lcd-bezel);background:linear-gradient(#0c100f,#070a09);border-radius:5px;flex:none;box-shadow:0 0 0 1px #101312,0 1px #ffffff0d,0 3px 8px #00000059}.lcd-glass{width:var(--lcd-width);height:var(--lcd-height);background:var(--lcd-bg);border-radius:2px;box-shadow:0 0 0 1px #000000e6}.lcd-display{width:100%;height:100%;color:var(--lcd-text);background:var(--lcd-bg);border-radius:2px;font-family:SFMono-Regular,Consolas,Liberation Mono,ui-monospace,monospace;position:relative;overflow:hidden}.pixel-grid{z-index:0;opacity:.05;pointer-events:none;background-image:linear-gradient(#b4d2c829 1px,#0000 1px),linear-gradient(90deg,#b4d2c81f 1px,#0000 1px);background-size:3px 3px;position:absolute;inset:0}.lcd-content{z-index:1;flex-direction:column;padding:11px 12px 10px;display:flex;position:absolute;inset:0}.lcd-header{border-bottom:1px solid var(--lcd-line);letter-spacing:.04em;color:var(--lcd-dim);flex:none;align-items:center;gap:6px;padding-bottom:7px;font-size:9.5px;display:flex}.lcd-header strong{letter-spacing:.1em;color:#ccd4d0;font-size:10px;font-weight:700}.lcd-header__model{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.connection-dot{background:var(--mint);border-radius:50%;flex:none;width:5px;height:5px}.connection-dot.is-offline{background:#5a6560}.page-dots{gap:4px;margin-left:auto;display:flex}.page-dots i{background:#2e3a36;border-radius:50%;width:4px;height:4px}.page-dots i.is-active{background:var(--mint)}.lcd-screen{flex-direction:column;flex:1;min-height:0;padding-top:11px;display:flex;overflow:hidden}.screen-title{letter-spacing:.16em;color:#9aa6a1;margin:0 0 8px;font-size:10px;font-weight:700}.status-hero{letter-spacing:.01em;align-items:center;gap:7px;font-size:23px;font-weight:750;line-height:1;display:inline-flex}.status-hero--active,.status-hero--approval{color:var(--mint)}.status-hero--danger{color:var(--stop)}.status-hero--success{color:#e7ece9}.status-hero--muted{color:#99a4a0}.status-icon--animated{animation:1.4s steps(2,end) infinite lcdPulse}.task-line{color:var(--lcd-text);margin:13px 0 0;font-family:ui-sans-serif,system-ui,sans-serif;font-size:13px;font-weight:600;line-height:1.35}.overview-screen .task-line{min-height:2.6em}.action-line{color:#a3afaa;text-overflow:ellipsis;white-space:nowrap;margin:5px 0 0;font-size:11px;overflow:hidden}.pending-line{border-left:2px solid var(--mint);letter-spacing:.1em;color:var(--mint);background:#0d1c18;margin:8px 0 0;padding:4px 6px;font-size:9.5px;font-weight:700}.metrics-row{border-top:1px solid var(--lcd-line);border-bottom:1px solid var(--lcd-line);color:#93a09a;justify-content:space-between;align-items:center;margin-top:14px;padding:8px 0;font-size:10.5px;display:flex}.metrics-row .is-stopped{color:var(--amber)}.overview-usage{grid-template-columns:1fr 1fr;gap:14px;margin-top:10px;display:grid}.usage-stack{gap:9px;display:grid}.usage-bar{border-left:2px solid #0000;padding-left:5px}.usage-bar.is-focused{border-left-color:var(--mint)}.usage-bar__meta{letter-spacing:.06em;color:#7b8883;justify-content:space-between;align-items:baseline;margin-bottom:4px;font-size:9.5px;display:flex}.usage-bar.is-focused .usage-bar__meta{color:#b6c2bd}.usage-bar__meta strong{color:#d6ddd9;font-size:11px}.usage-bar__track{grid-template-columns:repeat(10,1fr);gap:1px;height:5px;display:grid}.usage-bar__track i{background:#232e2b}.usage-bar__track i.is-filled{background:#c4cfca}.usage-bar--mint .usage-bar__track i.is-filled{background:var(--mint)}.usage-bar--amber .usage-bar__track i.is-filled{background:var(--amber)}.usage-bar--soft .usage-bar__track i.is-filled{background:#7d8b85}.session-list,.file-list{gap:3px;margin:0;padding:0;list-style:none;display:grid}.session-list li{color:#8b9792;background:var(--lcd-panel);border-left:2px solid #0000;grid-template-columns:auto 1fr auto;align-items:center;gap:3px 7px;padding:6px 7px;font-size:10px;display:grid}.session-list li.is-focused{border-left-color:var(--mint);color:#dbe3df;background:#16211e}.session-list__agent{letter-spacing:.08em;color:#d3dbd7;font-weight:700}.session-list__project{color:#6f7c77;text-overflow:ellipsis;white-space:nowrap;font-size:9px;overflow:hidden}.session-list__status{letter-spacing:.06em;color:#8b9792;grid-area:1/3;font-size:9px;font-weight:700}.session-list__status.is-working,.session-list__status.is-thinking,.session-list__status.is-approval,.session-list__status.is-needs_input{color:var(--mint)}.session-list__status.is-error{color:var(--stop)}.session-list__time{text-align:right;color:#6f7c77;grid-area:2/2/auto/4;font-size:9px}.detail-head{color:#6f7c77;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:8px;font-size:9.5px;display:flex}.detail-head strong{letter-spacing:.08em;color:#d3dbd7;font-size:10.5px}.file-list li{color:#8b9792;background:var(--lcd-panel);border-left:2px solid #0000;justify-content:space-between;align-items:center;gap:8px;padding:6px 7px;font-size:10px;display:flex}.file-list li.is-focused{border-left-color:var(--mint);color:#dbe3df;background:#16211e}.file-list__name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.file-list__diff{flex:none;gap:5px;font-size:9px;font-style:normal;display:flex}.file-list__diff .is-added{color:#7fb99c;font-style:normal}.file-list__diff .is-removed{color:#a97b76;font-style:normal}.detail-rows{gap:3px;margin-top:auto;padding-top:9px;display:grid}.detail-rows div{color:#6f7c77;justify-content:space-between;align-items:baseline;gap:8px;font-size:9.5px;display:flex}.detail-rows strong{color:#c3ccc8;text-overflow:ellipsis;white-space:nowrap;max-width:62%;font-family:ui-sans-serif,system-ui,sans-serif;font-size:10px;overflow:hidden}.decision-title{letter-spacing:.04em;color:var(--mint);margin:0;font-size:15px;font-weight:750}.command-card{background:var(--lcd-panel);border:1px solid #2d3d38;margin-top:10px;padding:7px 8px}.command-card code{color:#e2e9e6;text-overflow:ellipsis;white-space:nowrap;font-size:12px;display:block;overflow:hidden}.command-card span{letter-spacing:.06em;color:#6f7c77;margin-top:4px;font-size:9px;display:block}.choice-list{gap:4px;margin:12px 0 0;padding:0;list-style:none;display:grid}.choice-list li{color:#8b9792;background:#0b1211;border-left:2px solid #0000;align-items:center;min-height:30px;padding:0 9px;font-family:ui-sans-serif,system-ui,sans-serif;font-size:12px;font-weight:600;display:flex}.choice-list li.is-selected{border-left-color:var(--mint);color:#eaf4f0;background:#1a2a26}.choice-list li.choice--reject.is-selected{border-left-color:var(--stop);color:#f4e0de;background:#241716}.state-screen{text-align:center;align-items:center}.state-icon{border:1px solid;border-radius:50%;place-items:center;width:40px;height:40px;margin-top:6px;display:grid}.state-icon--done{color:#cfd8d4}.state-icon--error{color:var(--stop)}.state-icon--offline{color:#8a948f}.state-title{letter-spacing:.06em;color:#dfe6e3;margin:10px 0 0;font-size:18px;font-weight:750}.state-title--error{color:var(--stop)}.state-screen .task-line{margin-top:6px;font-size:12px}.state-screen .detail-rows{text-align:left;width:100%}.reconnect-icon{animation:1s steps(8,end) infinite reconnectSpin}.screen-footer{border-top:1px solid var(--lcd-line);flex:none;grid-template-columns:1fr 1fr;gap:5px 8px;margin-top:10px;padding-top:8px;display:grid}.screen-footer span{letter-spacing:.04em;color:#66736e;white-space:nowrap;align-items:center;gap:5px;min-width:0;font-size:9px;display:flex}.screen-footer strong{color:#b3bdb8;font-size:9px;font-weight:700}.stop-hold{z-index:4;border:1px solid var(--stop-edge);letter-spacing:.08em;color:#f0b7b2;background:#2a1413;align-items:center;gap:8px;padding:7px 9px;font-size:9.5px;font-weight:700;display:flex;position:absolute;inset:auto 10px 10px}.stop-hold__track{background:#4d2724;flex:1;height:3px}.stop-hold__track i{background:var(--stop);height:100%;display:block}.control-deck{height:var(--pad-size);margin-top:var(--deck-gap);flex:none;justify-content:space-between;align-items:center;display:flex}.five-way-pad{width:var(--pad-size);height:var(--pad-size);flex:none;position:relative}.pad-seat{box-shadow:0 0 0 1px var(--case-edge), 0 1px 0 #ffffff12, 0 3px 7px #00000057, 0 2px 3px #00000073 inset;background:linear-gradient(#313532,#232725);border-radius:50%;position:absolute;inset:0}.pad-sectors{border-radius:50%;position:absolute;inset:4px;overflow:hidden}.pad-direction{color:#9aa29e;cursor:pointer;touch-action:manipulation;background:0 0;border:0;padding:0;display:flex;position:absolute;inset:0}.pad-direction--up{clip-path:polygon(50% 50%,0 0,100% 0);justify-content:center;align-items:flex-start;padding-top:10px}.pad-direction--right{clip-path:polygon(50% 50%,100% 0,100% 100%);justify-content:flex-end;align-items:center;padding-right:10px}.pad-direction--down{clip-path:polygon(50% 50%,100% 100%,0 100%);justify-content:center;align-items:flex-end;padding-bottom:10px}.pad-direction--left{clip-path:polygon(50% 50%,0 100%,0 0);justify-content:flex-start;align-items:center;padding-left:10px}.pad-icon{place-items:center;transition:transform 60ms ease-out;display:grid}.pad-dividers{z-index:3;pointer-events:none;position:absolute;inset:0}.pad-dividers:before,.pad-dividers:after{content:"";background:#0000006b;width:1px;margin-left:-.5px;position:absolute;top:-20%;bottom:-20%;left:50%}.pad-dividers:before{transform:rotate(45deg)}.pad-dividers:after{transform:rotate(-45deg)}.pad-direction:hover{color:#e2e8e5}.pad-direction:active,.pad-direction.is-keyboard-active{color:var(--mint);background:#6fdcbb1f}.pad-direction:active .pad-icon,.pad-direction.is-keyboard-active .pad-icon{transform:translateY(1.5px)}.pad-ok{z-index:4;width:var(--pad-ok-size);height:var(--pad-ok-size);color:#edf1ef;letter-spacing:.06em;background:linear-gradient(180deg, var(--key-face), #2c302e);box-shadow:0 0 0 1px var(--case-edge), 0 1px 0 #ffffff1a inset, 0 2px 4px #00000080;cursor:pointer;touch-action:manipulation;border:0;border-radius:50%;padding:0;font-size:11px;font-weight:750;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.pad-ok:hover{color:#fff}.pad-ok:active,.pad-ok.is-keyboard-active{box-shadow:0 0 0 1px var(--case-edge), 0 1px 2px #00000080;background:linear-gradient(#363a37,#2a2e2c);transform:translate(-50%,-50%)translateY(1.5px)}.secondary-controls{gap:var(--key-gap);flex-direction:column;flex:none;display:flex}.key-button{width:var(--key-width);height:var(--key-height);border:1px solid var(--case-edge);color:#c3cac6;letter-spacing:.11em;background:linear-gradient(180deg, var(--key-face), #2c302e);cursor:pointer;touch-action:none;border-radius:9px;justify-content:center;align-items:center;padding:0;font-size:10px;font-weight:700;display:flex;position:relative;box-shadow:inset 0 1px #ffffff12,0 2px 4px #0006}.key-button--back{gap:6px}.key-button--stop{border-color:var(--stop-edge);color:#dfb3af;flex-direction:column;gap:2px}.key-button__hint{letter-spacing:.06em;color:#8d6b68;font-size:7.5px;font-weight:600}.key-button:hover{color:#f1f4f3}.key-button--stop:hover{color:#f6cdc9}.key-button:active,.key-button.is-keyboard-active{transform:translateY(1.5px);box-shadow:0 1px 2px #00000073}.stop-ring{opacity:0;pointer-events:none;background:conic-gradient(var(--stop) calc(var(--stop-progress,0) * 360deg), transparent 0);-webkit-mask-composite:xor;border-radius:9px;padding:1.5px;position:absolute;inset:-1px;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.key-button--stop[data-holding=true] .stop-ring{opacity:1}.key-button--stop[data-near=true]{border-color:var(--stop);color:#ffd9d5;background:linear-gradient(#4a2b28,#331d1b)}.key-button--stop[data-near=true] .key-button__hint{color:#d29a95}.pad-direction:focus-visible,.pad-ok:focus-visible,.key-button:focus-visible{outline:none}.pad-direction:focus-visible .pad-icon{outline-offset:3px;border-radius:3px;outline:2px solid #ccd5d1}.pad-ok:focus-visible,.key-button:focus-visible{outline-offset:3px;outline:2px solid #ccd5d1}.key-button--stop:focus-visible{outline-color:var(--stop)}.device-mark{letter-spacing:.34em;color:#6c736f;flex:1;justify-content:center;align-items:center;font-size:7.5px;font-weight:700;display:flex}.demo-hint{z-index:1;letter-spacing:.02em;color:#5c645f;text-align:center;margin:0;font-size:11px;position:relative}.demo-hint span{color:#3b403d;margin:0 4px}@keyframes lcdPulse{50%{opacity:.4}}@keyframes reconnectSpin{to{transform:rotate(360deg)}}@media (height>=880px){:root{--scale:1.08}}@media (height<=700px){:root{--scale:.86}.demo-stage{gap:12px;padding-block:12px}}@media (height<=620px){:root{--scale:.76}.demo-hint{font-size:10px}}@media (width<=420px){:root{--scale:.82}.demo-hint{font-size:10px}}@media (width<=420px) and (height<=700px){:root{--scale:.78}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}