:root{--bg:#f5f6f8;--panel:#fff;--panel-2:#eef1f5;--border:#d9dee6;--text:#1f2430;--text-dim:#6b7686;--accent:#0f766e;--accent-2:#2563eb;--warn:#b45309;--bad:#dc2626;font-size:14px}*{box-sizing:border-box}[hidden]{display:none!important}html,body{height:100%}body{background:var(--bg);color:var(--text);flex-direction:column;margin:0;font-family:Hiragino Sans,Noto Sans JP,system-ui,sans-serif;display:flex;overflow:hidden}header{background:var(--panel);border-bottom:1px solid var(--border);flex:none;justify-content:space-between;align-items:center;gap:12px;padding:8px 14px;display:flex}header h1{margin:0;font-size:1rem;font-weight:700}header .sub{color:var(--text-dim);margin-left:8px;font-size:.72rem;font-weight:400}@media (width<=760px){header{flex-wrap:wrap}header .sub{display:none}.view-switch{max-width:100%;overflow-x:auto}.header-right{display:none}}.view-switch{flex-wrap:nowrap;display:flex}.view-switch .btn{white-space:nowrap}.header-right{align-items:center;gap:8px;display:flex}.btn{background:var(--panel);color:var(--text);border:1px solid var(--border);cursor:pointer;border-radius:6px;padding:5px 12px;font-size:.82rem}.btn:hover:not(:disabled){border-color:var(--accent-2)}.btn:disabled{opacity:.45;cursor:default}.btn.recording{border-color:var(--bad);color:var(--bad)}.chip{background:var(--panel-2);border:1px solid var(--border);color:var(--text-dim);white-space:nowrap;border-radius:999px;padding:2px 10px;font-size:.78rem;display:inline-block}.chip.good{color:var(--accent);border-color:var(--accent)}.chip.poor{color:var(--warn);border-color:var(--warn)}.chip.alert{color:var(--bad);border-color:var(--bad)}#status-banner{background:var(--panel);border:1px solid var(--accent-2);white-space:pre-wrap;border-radius:8px;flex:none;margin:8px 14px 0;padding:8px 12px;font-size:.85rem}#status-banner.error{border-color:var(--bad);color:var(--bad)}.grid{flex:1;grid-template:"video expr"minmax(0,1.4fr)"video pulse"minmax(0,.6fr)"pose payload"minmax(0,1fr)/minmax(0,1.5fr) minmax(0,1fr);gap:10px;min-height:0;padding:10px 14px 12px;display:grid}.panel{background:var(--panel);border:1px solid var(--border);border-radius:10px;flex-direction:column;min-width:0;min-height:0;padding:10px 12px;display:flex;overflow:hidden}.panel h2{color:var(--text-dim);flex:none;margin:0 0 6px;font-size:.82rem;font-weight:600}.panel h3{color:var(--text-dim);flex:none;margin:6px 0 3px;font-size:.72rem;font-weight:600}.note{color:var(--text-dim);font-size:.68rem;font-weight:400}.video-panel{grid-area:video}.expr-panel{grid-area:expr}.pulse-panel{grid-area:pulse}.pose-panel{grid-area:pose}.payload-panel{grid-area:payload}.expr-panel{overflow-y:auto}.video-wrap{background:#dfe3e9;border-radius:8px;flex:1;min-height:0;position:relative;overflow:hidden}.video-wrap video,.video-wrap canvas{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.mirrored video,.mirrored canvas{transform:scaleX(-1)}.panel-foot{color:var(--text-dim);flex:none;gap:14px;padding-top:6px;font-size:.78rem;display:flex}.panel-foot label{cursor:pointer;align-items:center;gap:5px;display:flex}.big-row{flex-wrap:wrap;flex:none;align-items:baseline;gap:12px;margin-bottom:4px;display:flex}.big-label{color:var(--accent);font-size:1.7rem;font-weight:800;line-height:1.1}.big-sub{color:var(--text-dim);font-variant-numeric:tabular-nums;font-size:.95rem}.bars{flex-direction:column;gap:3px;display:flex}.bars.small{gap:2px}.bar-row{grid-template-columns:6em 1fr 3em;align-items:center;gap:8px;font-size:.74rem;display:grid}.bars.small .bar-row{color:var(--text-dim);font-size:.68rem}.bar-track{background:var(--panel-2);border-radius:4px;height:7px;overflow:hidden}.bars.small .bar-track{height:4px}.bar-fill{background:var(--accent);border-radius:4px;width:0%;height:100%;transition:width .12s linear}.bars.small .bar-fill{background:var(--accent-2)}.bar-val{text-align:right;font-variant-numeric:tabular-nums;color:var(--text-dim)}.pulse-meta{flex-direction:column;gap:4px;display:flex}#bpm{color:var(--accent-2)}#bpm.dim{color:var(--text-dim)}#waveform{flex:none;width:100%;height:40px;margin-top:4px}#pose3d{background:var(--panel-2);border-radius:8px;flex:1;min-height:0;overflow:hidden}.pose-meta{flex:none;align-items:center;gap:10px;padding-top:6px;display:flex}.motion-row{flex:none;align-items:center;gap:10px;padding-top:6px;font-size:.78rem;display:flex}.motion-title{color:var(--text-dim)}.meter{background:var(--panel-2);border-radius:4px;flex:1;max-width:200px;height:7px;overflow:hidden}#motion-bar{background:var(--accent);border-radius:4px;width:0%;height:100%;transition:width .15s linear}.view-switch{gap:0;display:flex}.view-switch .btn{border-radius:0}.view-switch .btn:first-child{border-radius:6px 0 0 6px}.view-switch .btn:last-child{border-radius:0 6px 6px 0}.view-switch .btn+.btn{border-left:none}.view-switch .btn.active{background:var(--accent-2);border-color:var(--accent-2);color:#fff}.chat-panel{grid-area:chat;display:none}.state-mini-panel{grid-area:state;display:none}body.mode-dialog .chat-panel,body.mode-dialog .state-mini-panel{display:flex}body.mode-dialog .expr-panel,body.mode-dialog .pulse-panel,body.mode-dialog .pose-panel,body.mode-dialog .payload-panel{display:none}body.mode-dialog .grid{grid-template:"chat video"minmax(0,1fr)"chat state"minmax(0,1fr)/minmax(0,1.6fr) minmax(0,1fr)}body.mode-dialog .msg{max-width:80%;font-size:.88rem}body.mode-dialog .chat-input-row input{padding:9px 12px;font-size:.95rem}body.mode-dialog .chat-input-row .btn{padding:8px 14px;font-size:.95rem}.state-chips{flex-wrap:wrap;flex:none;gap:6px;display:flex}.state-chips .chip{color:var(--text);font-size:.8rem}.state-mini-panel #events-mini{flex:1;min-height:0;max-height:none;margin:0;padding:0;font-size:.74rem;list-style:none;overflow-y:auto}.state-mini-panel #events-mini li{border-bottom:1px solid var(--border);color:var(--text-dim);padding:2px 0}.state-mini-panel #events-mini li .t{color:var(--accent-2);font-variant-numeric:tabular-nums;margin-right:8px}.note a{color:var(--accent-2);cursor:pointer;text-decoration:none}.chat-setup{flex:none;gap:6px;margin-bottom:6px;display:flex}.chat-setup input{border:1px solid var(--border);border-radius:6px;flex:1;min-width:0;padding:5px 8px;font-size:.76rem}.chat-setup .key-note{color:var(--text-dim);align-self:center;font-size:.68rem}#chat-log,#sim-log{flex-direction:column;flex:1;gap:4px;min-height:0;padding:2px 0;display:flex;overflow-y:auto}.msg{white-space:pre-wrap;word-break:break-word;border-radius:10px;max-width:85%;padding:6px 9px;font-size:.78rem;line-height:1.45}.msg.user{background:#e3edff;align-self:flex-end}.msg.ai{background:var(--panel-2);align-self:flex-start}.msg.error{color:var(--bad);background:#fdecec;align-self:flex-start}.msg .state-line{color:var(--text-dim);margin-top:4px;font-size:.64rem;display:block}.msg details{color:var(--text-dim);margin-top:3px;font-size:.64rem}.msg details pre{background:#0000000d;border-radius:5px;margin:3px 0 0;padding:5px;font-size:.62rem;line-height:1.4;overflow-x:auto}.chat-input-row{flex:none;align-items:center;gap:6px;padding-top:6px;display:flex}.chat-input-row input{border:1px solid var(--border);border-radius:6px;flex:1;min-width:0;padding:6px 9px;font-size:.8rem}#btn-mic.recording,#btn-sim-mic.recording{border-color:var(--bad);color:var(--bad);background:#fdecec}.tts-toggle{color:var(--text-dim);cursor:pointer;white-space:nowrap;align-items:center;gap:4px;font-size:.72rem;display:flex}.sim-prompt-panel{grid-area:simprompt;display:none}.sim-chat-panel{grid-area:simchat;display:none}.sim-cards-panel{grid-area:simcards;display:none}body.mode-sim .sim-prompt-panel,body.mode-sim .sim-chat-panel,body.mode-sim .sim-cards-panel{display:flex}body.mode-sim .video-panel,body.mode-sim .expr-panel,body.mode-sim .pulse-panel,body.mode-sim .pose-panel,body.mode-sim .payload-panel{display:none}body.mode-sim{--sim-c1:1fr;--sim-c2:1.35fr;--sim-c3:1.05fr}body.mode-sim.prompt-table{--sim-c1:1.6fr;--sim-c2:1.05fr;--sim-c3:.85fr}body.mode-sim .grid{grid-template-columns:minmax(0, var(--sim-c1)) 10px minmax(0, var(--sim-c2)) 10px minmax(0, var(--sim-c3));grid-template-rows:minmax(0,1fr);grid-template-areas:"simprompt sp1 simchat sp2 simcards";column-gap:0}body.mode-flow main.grid,body.mode-flow #status-banner{display:none!important}.test-picker-panel{grid-area:simprompt;display:none}.only-test,body.mode-test .only-sim{display:none}body.mode-test .only-test{display:inline}body.mode-test #sim-chat-setup{display:none}body.mode-test .test-picker-panel,body.mode-test .sim-prompt-panel{display:flex}body.mode-sim.mode-test .grid{grid-template-rows:auto minmax(0,1fr);grid-template-areas:"testpick sp1 simchat sp2 simcards""simprompt sp1 simchat sp2 simcards";row-gap:10px}body.mode-test .test-picker-panel{grid-area:testpick}body.mode-sim.mode-test{--sim-c1:.9fr;--sim-c2:1.35fr;--sim-c3:1.05fr}.sim-splitter{cursor:col-resize;touch-action:none;display:none;position:relative}.sim-splitter[data-split="0"]{grid-area:sp1}.sim-splitter[data-split="1"]{grid-area:sp2}body.mode-sim .sim-splitter{display:block}.sim-splitter:after{content:"";background:0 0;border-radius:1px;width:2px;transition:background .12s;position:absolute;top:0;bottom:0;left:4px}.sim-splitter:hover:after,.sim-splitter.dragging:after{background:var(--accent-2)}body.col-resizing{cursor:col-resize;-webkit-user-select:none;user-select:none}body.col-resizing iframe,body.col-resizing textarea{pointer-events:none}#sim-prompt{resize:none;border:1px solid var(--border);min-height:0;color:var(--text);background:#fbfcfd;border-radius:8px;flex:1;padding:8px 10px;font:.72rem/1.5 ui-monospace,Menlo,Consolas,monospace}#sim-prompt:focus{border-color:var(--accent-2);outline:none}.pe-notice{border:1px solid var(--warn);color:var(--text);background:#fff8ed;border-radius:6px;flex:none;margin-bottom:6px;padding:7px 9px;font-size:.7rem;line-height:1.5}.pe-notice .row{flex-wrap:wrap;gap:6px;margin-top:5px;display:flex}.pe-notice .btn{padding:2px 8px;font-size:.68rem}.pe-tabs{flex:none;margin-bottom:6px;display:flex}.pe-tabs .btn{border-radius:6px 0 0 6px;padding:3px 10px;font-size:.74rem}.pe-tabs .btn+.btn{border-left:none;border-radius:0 6px 6px 0}.pe-tabs .btn.active{background:var(--accent-2);border-color:var(--accent-2);color:#fff}.pe-view{flex:1;min-height:0;padding:2px 6px 8px 0;font-size:.72rem;overflow:auto}.pe-section{margin-bottom:14px}.pe-h2{color:var(--accent-2);border-bottom:1px solid var(--border);margin:6px 0;padding-bottom:3px;font-size:.8rem;font-weight:700}.pe-h3{color:var(--text);margin:10px 0 4px;font-size:.74rem;font-weight:600}.pe-view textarea{width:100%;font:inherit;border:1px solid var(--border);color:var(--text);resize:vertical;field-sizing:content;background:#fbfcfd;border-radius:5px;min-height:1.9em;max-height:18em;padding:4px 6px;font-size:.7rem;line-height:1.45;display:block}.pe-view textarea:focus{border-color:var(--accent-2);outline:none}.pe-fields{flex-direction:column;gap:4px;margin:4px 0;display:flex}.pe-field{grid-template-columns:6em 1fr;align-items:start;gap:6px;display:grid}.pe-field>span{color:var(--text-dim);padding-top:4px;font-size:.68rem}.pe-toggle{cursor:pointer;align-items:center;gap:6px;margin:6px 0;font-size:.76rem;display:flex}table.pe-table{border-collapse:collapse;table-layout:fixed;width:100%;margin:4px 0}.pe-table th{text-align:left;color:var(--text-dim);border-bottom:1px solid var(--border);padding:3px 4px;font-size:.68rem;font-weight:600}.pe-table td{vertical-align:top;border-bottom:1px solid var(--panel-2);padding:3px}.pe-table th.no,.pe-table td.no{width:3.4em}.pe-table td.no textarea{text-align:center;padding:4px 2px}.pe-table th.del,.pe-table td.del{width:1.6em;padding:3px 0}.pe-del{color:var(--text-dim);cursor:pointer;background:0 0;border:none;padding:3px 4px;font-size:.9rem;line-height:1}.pe-del:hover{color:var(--bad)}.pe-add{margin:2px 0 6px;padding:2px 8px;font-size:.7rem}.pe-stages th.stage,.pe-stages td.stage{width:7.5em}.pe-stage-id{color:var(--accent-2);font-weight:700;display:block}.pe-stage-ts{color:var(--text-dim);font-size:.64rem;line-height:1.3}.pe-cellgroup{flex-direction:column;gap:3px;display:flex}.pe-cellgroup>span{color:var(--text-dim);font-size:.64rem}.sim-controls{color:var(--text-dim);flex-wrap:wrap;flex:none;align-items:center;gap:8px;font-size:.76rem;display:flex}.sim-controls label{white-space:nowrap;align-items:center;gap:4px;display:flex}.sim-controls label:has(#sim-stage){flex:1;min-width:0}.sim-controls select{border:1px solid var(--border);background:var(--panel);color:var(--text);border-radius:6px;min-width:0;padding:3px 6px;font-size:.76rem}#sim-stage{flex:1}.sim-controls .rounds{white-space:nowrap}.sim-controls .rounds input{border:1px solid var(--border);background:var(--panel);width:3.4em;color:var(--text);font:inherit;text-align:center;border-radius:5px;padding:3px 2px;font-size:.76rem}.sim-controls .rounds input:focus{border-color:var(--accent-2);outline:none}.sim-stage-hint{flex:none;padding:3px 0 5px}body.mode-sim #status-banner{display:none!important}.msg.choices{background:0 0;flex-wrap:wrap;align-self:flex-start;gap:6px;max-width:100%;padding:2px 0 4px;display:flex}.choice-btn{border-color:var(--accent-2);color:var(--accent-2);border-radius:999px;padding:4px 12px;font-size:.78rem}.choice-btn:disabled{opacity:.4}.choice-btn.chosen,.choice-btn.chosen:disabled{background:var(--accent-2);color:#fff;opacity:1}.choice-btn.manual{border-color:var(--border);color:var(--text-dim);padding:3px 10px;font-size:.7rem}.choice-btn.manual:hover:not(:disabled){border-color:var(--accent-2);color:var(--accent-2)}.choice-hint{color:var(--text-dim);font-size:.7rem}.msg.choices.done .choice-hint{opacity:.5}.sim-cards-tools{flex:none;gap:6px;padding-bottom:6px;display:flex}.sim-cards{flex-direction:column;flex:1;gap:5px;min-height:0;padding-right:2px;display:flex;overflow-y:auto}.card-row{grid-template-columns:7.5em 1fr;align-items:start;gap:6px;display:grid}.card-name{color:var(--text-dim);padding-top:3px;font-size:.72rem}.card-name .card-note{color:var(--warn);font-size:.6rem}.card-source{color:var(--text);border-bottom:1px solid var(--border);margin-top:4px;padding-bottom:2px;font-size:.68rem;font-weight:700}.card-source:first-child{margin-top:0}.card-values{flex-wrap:wrap;gap:4px;display:flex}.card-btn{border:1px solid var(--border);background:var(--panel);color:var(--text);cursor:pointer;border-radius:999px;padding:2px 8px;font-family:inherit;font-size:.68rem}.card-btn:hover{border-color:var(--accent-2)}.card-btn.active{background:var(--accent-2);border-color:var(--accent-2);color:#fff}.card-btn.neutral{color:var(--text-dim)}.card-btn.neutral.active{background:var(--text-dim);border-color:var(--text-dim);color:#fff}#sim-json{background:var(--panel-2);border-radius:8px;flex:none;max-height:32%;margin:0;padding:8px;font-size:.64rem;line-height:1.4;overflow:auto}.payload-panel pre{background:var(--panel-2);border-radius:8px;flex:1;min-height:60px;margin:0;padding:8px;font-size:.7rem;line-height:1.4;overflow:auto}#events{flex:none;max-height:90px;margin:0;padding:0;font-size:.74rem;list-style:none;overflow-y:auto}#events li{border-bottom:1px solid var(--border);color:var(--text-dim);padding:2px 0}#events li .t{color:var(--accent-2);font-variant-numeric:tabular-nums;margin-right:8px}@media (height<=720px){.expr-panel h3,#expr-blend{display:none}}@media (width<=980px){body{overflow:auto}.grid{grid-template-rows:none;grid-template-columns:minmax(0,1fr);grid-template-areas:"video""expr""pulse""pose""payload"}.video-wrap{aspect-ratio:4/3;flex:none}}.test-form{flex-direction:column;flex:1;gap:10px;min-height:0;display:flex;overflow-y:auto}.test-sec{border:1px solid var(--border);border-radius:8px;flex-direction:column;gap:6px;padding:8px 10px;display:flex}.test-sec h3{margin:0}.test-sec.off .test-row,.test-sec.off .test-key,.test-sec.off .test-msg{opacity:.4;pointer-events:none}.test-row{color:var(--text-dim);grid-template-columns:5.5em minmax(0,1fr);align-items:center;gap:6px;font-size:.74rem;display:grid}.test-row select{border:1px solid var(--border);background:var(--panel);width:100%;min-width:0;color:var(--text);border-radius:6px;padding:4px 6px;font-size:.78rem}.test-row select:disabled{background:var(--panel-2);color:var(--text-dim)}.test-key{color:var(--text-dim);flex-direction:column;gap:3px;margin-left:calc(5.5em + 6px);font-size:.68rem;display:flex}.test-key .key-line{gap:4px;display:flex}.test-key input{border:1px solid var(--border);border-radius:6px;flex:1;min-width:0;padding:3px 6px;font-size:.74rem}.test-key .btn{padding:3px 8px;font-size:.72rem}.test-key a,.test-msg a{color:var(--accent-2);text-decoration:none}.test-msg{color:var(--text-dim);min-height:1em;margin-left:calc(5.5em + 6px);font-size:.66rem}.test-msg a{margin-left:6px}.test-msg.error{color:var(--bad);white-space:pre-wrap}.test-current{color:var(--text);border-top:1px dashed var(--border);padding:6px 2px 0;font-size:.72rem}.test-current b{color:var(--accent-2)}
