:root{--paper:oklch(97.5% .005 90);--card:#fff;--ink:oklch(20% .005 90);--ink2:oklch(37% .005 90);--ink3:oklch(55% .004 90);--hl:#0000001a;--hlm:#00000029;--hls:#0000003d;--verm:oklch(55% .2 30);--verm-soft:oklch(55% .2 30/.07);--sans:Inter, -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Noto Sans JP", "Segoe UI", sans-serif;--mono:"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace}*{box-sizing:border-box}body{background:var(--paper);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;margin:0;font-size:14px;line-height:1.7}#root{max-width:640px;margin:0 auto;padding:20px 16px 48px}.brand{border-bottom:1px solid var(--hlm);align-items:center;gap:10px;margin-bottom:20px;padding:14px 2px;display:flex}.brand-sq{background:var(--verm);flex:none;width:9px;height:9px}.brand-name{letter-spacing:.3em;color:var(--ink);white-space:nowrap;font-size:17px;font-weight:300}.brand-name strong{font-weight:600}.brand-role{color:var(--ink3);letter-spacing:.14em;white-space:nowrap;margin-left:2px;font-size:11px}.brand-status{color:var(--ink2);white-space:nowrap;align-items:center;gap:7px;margin-left:auto;font-size:12px;display:flex}.dot{border:1px solid var(--hls);background:#fff;border-radius:50%;flex:none;width:7px;height:7px}.dot.on{background:var(--verm);border-color:var(--verm)}.card{background:var(--card);border:1px solid var(--hl);border-radius:2px;margin-bottom:14px;padding:18px 20px}.card-label{letter-spacing:.18em;color:var(--ink3);margin:0 0 12px;font-size:11px;font-weight:600}.hint{color:var(--ink3);margin:6px 0 0;font-size:12.5px}.warn{color:var(--verm);margin:8px 0 0;font-size:13px}.mono{font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:12.5px}button,.btn{font-family:var(--sans);color:var(--ink);border:1px solid var(--hls);cursor:pointer;background:#fff;border-radius:2px;padding:9px 18px;font-size:14px;font-weight:500;transition:border-color .12s ease-out,color .12s ease-out,opacity .12s ease-out}button:hover:not(:disabled){border-color:var(--verm);color:var(--verm)}button:disabled{opacity:.35;cursor:default}.btn-primary{background:var(--verm);border-color:var(--verm);color:#fff}.btn-primary:hover:not(:disabled){color:#fff;opacity:.88}.btn-big{padding:14px 32px;font-size:16px}input[type=text]{font-family:var(--sans);border:1px solid var(--hlm);color:var(--ink);background:#fff;border-radius:2px;padding:8px 10px;font-size:14px}input[type=text]:focus{border-color:var(--verm);outline:none}input[type=range],input[type=checkbox]{accent-color:var(--verm)}input[type=range]{width:100%}code{font-family:var(--mono);background:var(--paper);border:1px solid var(--hl);border-radius:2px;padding:1px 5px;font-size:12.5px}.meter{border:1px solid var(--hl);background:#fff;height:6px;overflow:hidden}.meter>div{background:#0003;height:100%;transition:width .2s linear}.meter.buffering>div{background:var(--verm)}.slider-row{align-items:center;gap:12px;margin-top:12px;display:flex}.slider-row .slider-name{color:var(--ink2);flex:none;min-width:4em;font-size:13px}.slider-row .slider-end{color:var(--ink3);flex:none;font-size:11px}details.tech{border-top:1px solid var(--hl);margin-top:12px;padding-top:10px}details.tech summary{color:var(--ink3);cursor:pointer;letter-spacing:.08em;font-size:12px;list-style:none}details.tech summary:before{content:"▸ "}details.tech[open] summary:before{content:"▾ "}details.tech p{color:var(--ink2);margin:8px 0 0;font-size:12.5px}.chat-log{border:1px solid var(--hl);background:var(--paper);border-radius:2px;height:240px;padding:10px 12px;font-size:13px;overflow-y:auto}.chat-log .t{color:var(--ink3);font-family:var(--mono);margin-right:7px;font-size:11px}.chat-log .who{color:var(--ink2);font-weight:600}.chat-log .who.me{color:var(--verm)}.site-foot{border-top:1px solid var(--hl);justify-content:space-between;align-items:baseline;margin-top:28px;padding-top:14px;display:flex}.site-foot .brand-foot{letter-spacing:.3em;color:var(--ink3);font-size:11px;font-weight:600}.site-foot .tech-foot{letter-spacing:.12em;color:var(--ink3);font-size:10px}@media (width<=480px){.brand-name{letter-spacing:.18em}.card{padding:14px}}
