:root{font-family:Inter,"Helvetica Neue","PingFang SC",sans-serif;color:#11110f;background:#f3f3eb;font-synthesis:none}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,input,select{font:inherit;color:inherit}button{border:1px solid #11110f;background:transparent;padding:12px 20px;cursor:pointer;border-radius:0}button:hover{background:#d5ff00}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #8754ff;outline-offset:3px}button:disabled{opacity:.5;cursor:wait}[hidden]{display:none!important}#stage{display:block;width:100vw;height:100dvh;touch-action:none;outline:none}.intro{position:fixed;inset:0;background:#f3f3eb;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:6vw 12vw}.eyebrow{font-size:12px;letter-spacing:.12em}.intro h1{font-size:clamp(54px,7vw,110px);line-height:1.04;font-weight:650;letter-spacing:-.07em;margin:30px 0}.intro h1 span{color:#8754ff;margin-left:.12em}.lead{font-size:clamp(17px,2vw,24px);line-height:1.6}.actions{display:flex;gap:12px;margin:20px 0 12px}.primary{background:#d5ff00;min-width:150px}.note{font-size:12px;line-height:1.7;color:#696960;max-width:580px}#mode-tag{position:fixed;top:20px;left:24px;font-size:11px;letter-spacing:.08em;color:#6b6b60;pointer-events:none}#transport{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);display:flex;gap:6px;padding:8px;background:#f3f3ebeb;opacity:.12;transition:opacity .2s}#transport:hover,#transport:focus-within,body.controls-visible #transport{opacity:1}#transport button{font-size:12px;padding:8px 12px;white-space:nowrap}#debug{position:fixed;right:16px;top:16px;bottom:80px;overflow:auto;width:350px;max-width:calc(100vw - 32px);background:#f3f3ebf5;border:1px solid #11110f;padding:20px;font-size:12px;line-height:1.6;box-shadow:0 10px 40px #0001}#debug p{overflow-wrap:anywhere}.panel-heading{display:flex;align-items:center;justify-content:space-between}.panel-heading button{border:0;font-size:24px;padding:0 4px}#debug label{display:block;margin:12px 0}#debug select,#debug input:not([type=checkbox]){display:block;width:100%;background:#fff;border:1px solid #cacac0;padding:8px;margin-top:4px}#debug input[type=checkbox]{accent-color:#8754ff}#debug form{border-top:1px solid #cacac0;margin-top:16px;padding-top:8px}#status{position:fixed;left:50%;bottom:76px;transform:translateX(-50%);background:#f3f3ebee;padding:10px 18px;max-width:90vw;font-size:13px;text-align:center;pointer-events:none}#boot-error{max-width:540px;color:#a02c20;font-size:13px;line-height:1.6}@media(max-width:600px){.intro{padding:7vw}.intro h1{margin:22px 0}.note{font-size:11px}#transport{bottom:8px}#mode-tag{top:12px;left:12px}}
.expression-trace{border:1px solid #cacac0;padding:0 12px;background:#fff9}#expression-output{font-size:24px}#emoji-library{font-size:27px;line-height:1.7}#metrics{white-space:pre-line}@media(max-height:730px){.intro{padding-top:24px;padding-bottom:24px;overflow-y:auto}.intro h1{font-size:clamp(44px,7vw,76px);margin:14px 0}.lead{margin:8px 0}.actions{margin:16px 0 4px}}
#stage{position:relative}.actions{flex-wrap:wrap}#transport{z-index:4}#status{z-index:4}#debug{z-index:7}#mode-tag{z-index:3}body[data-room-role] #stage{width:50vw;height:100dvh;position:absolute;top:0;left:0}body[data-room-role="B"] #stage{left:50vw}#remote-pane{position:absolute;top:0;right:0;width:50vw;height:100dvh;background:#eeeee5;border-left:1px solid #11110f22;overflow:hidden}body[data-room-role="B"] #remote-pane{left:0;right:auto;border-left:0;border-right:1px solid #11110f22}#remote-video{width:100%;height:100%;object-fit:contain;display:block}#remote-placeholder{position:absolute;inset:45% 24px auto;margin:0;text-align:center;font-size:14px;color:#696960}#remote-resume{position:absolute;top:55%;left:50%;transform:translateX(-50%);background:#f3f3eb}#participant-local,#participant-remote{position:absolute;top:20px;left:20px;font-size:11px;letter-spacing:.07em;background:#f3f3ebcc;padding:5px 8px;pointer-events:none}#participant-local{z-index:2}body[data-room-role="B"] #participant-local{left:calc(50vw + 20px)}body[data-room-role] #mode-tag{top:57px}body[data-room-role="B"] #mode-tag{left:calc(50vw + 24px)}#room-panel{position:fixed;z-index:8;top:50%;left:50%;transform:translate(-50%,-50%);width:420px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px);overflow:auto;background:#f3f3ebf9;border:1px solid #11110f;padding:24px;box-shadow:0 10px 40px #0002}#room-panel label{display:block;margin:16px 0 6px;font-size:12px}#room-panel input,#room-panel select{display:block;width:100%;border:1px solid #cacac0;background:#fff;padding:9px;font-size:13px}#room-panel button:not(.panel-heading button){margin-top:10px;font-size:13px}#room-panel .panel-heading button{margin:0}#room-status{font-size:13px;line-height:1.6;overflow-wrap:anywhere}#room-invite{font-size:11px!important}#room-badge{position:fixed;z-index:4;top:16px;left:50%;transform:translateX(-50%);background:#f3f3ebeb;padding:6px 12px;font-size:11px;max-width:50vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#room-metrics{white-space:pre-line}.room-actions{display:flex;gap:6px;flex-wrap:wrap}@media(max-width:600px){#transport{max-width:calc(100vw - 12px);flex-wrap:wrap;justify-content:center}#transport button{padding:7px 9px}#participant-local,#participant-remote{top:12px;left:8px;font-size:10px}body[data-room-role="B"] #participant-local{left:calc(50vw + 8px)}#room-badge{top:48px;max-width:90vw}#room-panel{padding:18px}}
