:root{--font-display: "Manrope", "Segoe UI", sans-serif;--bg: #eef2f1;--surface: rgba(255, 255, 255, .72);--surface-strong: #ffffff;--surface-muted: rgba(255, 255, 255, .58);--border: rgba(58, 70, 78, .12);--text: #12212b;--text-muted: #60717d;--accent: #0ea5a4;--accent-strong: #0a7e7d;--shadow: 0 30px 80px rgba(32, 52, 63, .12);--panel-bg: rgba(255, 255, 255, .78);--panel-inner: rgba(252, 252, 252, .88);--error: #b93845;--warning: #8c6b10}:root[data-theme=dark]{--bg: #060a0f;--surface: rgba(10, 14, 21, .78);--surface-strong: rgba(14, 19, 28, .94);--surface-muted: rgba(17, 24, 32, .82);--border: rgba(177, 194, 211, .14);--text: #edf6fa;--text-muted: #93a6b2;--accent: #4ee9d8;--accent-strong: #96fff4;--shadow: 0 30px 90px rgba(0, 0, 0, .45);--panel-bg: rgba(8, 12, 17, .84);--panel-inner: rgba(15, 21, 30, .94);--error: #ff8e96;--warning: #f5ce65}*{box-sizing:border-box}html,body,#root{width:100%;height:100%}body{margin:0;font-family:var(--font-display);color:var(--text);background:radial-gradient(circle at top left,rgba(99,182,189,.28),transparent 34%),radial-gradient(circle at top right,rgba(255,196,128,.2),transparent 30%),linear-gradient(180deg,rgba(249,250,251,.96),var(--bg));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden}:root[data-theme=dark] body{background:radial-gradient(circle at top left,rgba(14,94,98,.34),transparent 32%),radial-gradient(circle at top right,rgba(52,85,126,.28),transparent 30%),linear-gradient(180deg,rgba(6,9,13,.98),var(--bg))}button,input,textarea,select{font:inherit}button{cursor:pointer}a{color:inherit}.screen-shell{min-height:100dvh;height:100dvh;display:flex;justify-content:center;padding:10px 22px 12px;overflow:hidden;background:radial-gradient(circle at 12% 18%,var(--screen-left-glow, transparent) 0%,transparent 34%),radial-gradient(circle at 88% 16%,var(--screen-right-glow, transparent) 0%,transparent 32%)}.screen-shell__loading{margin:auto;padding:18px 22px;border-radius:20px;background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow)}.app-frame{position:relative;width:min(1240px,100%);height:100%;min-height:0;padding:8px 0 0;display:grid;grid-template-rows:auto auto auto auto minmax(0,1fr);gap:12px;isolation:isolate}.app-frame:before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(circle at 50% 0%,var(--frame-tint, transparent) 0%,transparent 54%),linear-gradient(180deg,rgba(255,255,255,.05),transparent 28%)}.app-frame>*{position:relative;z-index:1}.top-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;width:min(1140px,100%);margin:0 auto;padding:0 6px}.top-toolbar__meta{display:flex;flex-direction:column;gap:4px}.top-toolbar__name{font-size:1.15rem;font-weight:700;letter-spacing:-.03em}.top-toolbar__subline{color:var(--text-muted);font-size:.88rem}.top-toolbar__actions{display:flex;gap:10px}.icon-button,.browser-panel__icon-button,.settings-drawer__close,.character-arrow{border:1px solid var(--border);background:var(--surface-muted);color:var(--text);border-radius:18px;transition:transform .18s ease,border-color .18s ease,background .18s ease}.icon-button:hover,.browser-panel__icon-button:hover,.settings-drawer__close:hover,.character-arrow:hover{transform:translateY(-1px);border-color:#0ea5a452}.icon-button{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center}.icon-button.is-active{color:var(--accent)}.icon-button svg,.browser-panel__icon-button svg,.settings-drawer__close svg,.character-arrow svg{width:19px;height:19px}.avatar-stage-layout{display:grid;width:min(760px,100%);margin:0 auto;grid-template-columns:46px minmax(0,1fr) 46px;align-items:center;gap:22px}.avatar-stage-wrap{display:flex;flex-direction:column;align-items:center;gap:10px}.avatar-stage{width:min(100%,280px);aspect-ratio:1 / 1;border-radius:26px;overflow:hidden;box-shadow:0 18px 42px var(--stage-shadow, rgba(20, 30, 40, .12));position:relative;border:1px solid var(--stage-border, transparent)}.avatar-stage:before,.avatar-stage:after{content:"";position:absolute;inset:0;pointer-events:none}.avatar-stage:before{background:linear-gradient(180deg,rgba(255,255,255,.18),transparent 32%),radial-gradient(circle at 18% 14%,rgba(255,255,255,.22) 0%,transparent 22%)}.avatar-stage:after{inset:1px;border-radius:25px;box-shadow:inset 0 1px #ffffff29}.avatar-stage canvas{width:100%!important;height:100%!important}.avatar-stage__error{width:220px;display:flex;flex-direction:column;gap:6px;padding:14px 16px;border-radius:16px;color:var(--error);background:var(--surface-strong);border:1px solid rgba(185,56,69,.22);text-align:center}.live-pill{min-width:116px;padding:8px 12px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;gap:8px;background:#080a0eeb;color:#d7fff8;box-shadow:0 10px 24px #0000002e}.live-pill__dot{width:8px;height:8px;border-radius:50%;background:#4ade80}.live-pill__label{font-size:.77rem;text-transform:uppercase;letter-spacing:.08em}.live-pill__meters{display:inline-flex;align-items:end;gap:3px;height:13px}.live-pill__meters span{width:3px;height:100%;border-radius:999px;background:var(--accent);transform-origin:bottom}.live-pill--error .live-pill__dot{background:#fb7185}.live-pill--connecting .live-pill__dot{background:#facc15}.character-arrow{width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center}.controls-strip{display:flex;justify-content:center;width:min(460px,100%);margin:0 auto}.primary-button{width:100%;min-width:0;padding:13px 22px;border:1px solid rgba(12,25,34,.06);border-radius:16px;background:linear-gradient(135deg,#14212d,#1c2e39);color:#fff;font-weight:700;letter-spacing:-.01em;box-shadow:0 16px 34px #12212b2e}.primary-button--secondary{background:var(--surface-strong);color:var(--text);border-color:var(--border);box-shadow:none}.primary-button:disabled{opacity:.55;cursor:not-allowed}.status-stack{display:flex;flex-direction:column;gap:8px;width:min(1140px,100%);margin:0 auto;max-height:min(16vh,132px);overflow-y:auto;padding-right:4px}.notice{padding:11px 14px;border-radius:16px;font-size:.94rem;border:1px solid var(--border);background:var(--surface-muted)}.notice--error{color:var(--error)}.notice--warning{color:var(--warning)}.notice--soft{color:var(--text-muted)}.app-footer-version{position:fixed;bottom:6px;left:50%;transform:translate(-50%);font-size:10px;color:#80808066;font-family:monospace;pointer-events:none;z-index:9999}.browser-panel{width:min(1140px,100%);height:100%;min-height:0;margin:0 auto;border-radius:18px;background:linear-gradient(180deg,var(--panel-tint, transparent),transparent 34%),var(--panel-bg);overflow:hidden}.browser-panel--remote{display:grid;grid-template-rows:auto minmax(0,1fr)}:root[data-theme=dark] .browser-panel{background:#090d13e0}.browser-panel--loading-visual{position:relative}.browser-panel--idle{background:#ffffff38}:root[data-theme=dark] .browser-panel--idle{background:#ffffff08}.browser-panel__blank{height:100%}.browser-panel--visual{display:flex;align-items:center;justify-content:center;background:#070b11}.browser-panel__toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;border-bottom:1px solid var(--border);background:var(--surface-muted)}.browser-panel__toolbar-meta{min-width:0;display:flex;flex-direction:column;gap:4px}.browser-panel__toolbar-meta strong,.browser-panel__toolbar-meta span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.browser-panel__toolbar-meta strong{font-size:.94rem}.browser-panel__toolbar-meta span{color:var(--text-muted);font-size:.82rem}.browser-panel__toolbar-actions{display:inline-flex;align-items:center;gap:8px}.browser-panel__icon-button{width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center}.browser-panel__icon-button:disabled{opacity:.44;cursor:not-allowed;transform:none}.browser-panel__surface{width:100%;height:100%;min-height:0;overflow:hidden;background:#fff;cursor:pointer}.browser-panel__surface--client-inline{position:relative;cursor:default}.browser-panel__surface--disabled{cursor:default}.browser-panel__snapshot{width:100%;height:100%;display:block;object-fit:contain;object-position:top center;background:#fff}.browser-panel__iframe{width:100%;height:100%;display:block;border:none;background:#fff}.browser-panel__state{height:100%;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:20px;text-align:center}.browser-panel__state--overlay{position:absolute;left:16px;right:16px;bottom:16px;height:auto;padding:14px 18px;border-radius:18px;background:#ffffffd1;border:1px solid rgba(18,33,43,.08);box-shadow:0 16px 34px #12212b29;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}:root[data-theme=dark] .browser-panel__state--overlay{background:#070a0fc7;border-color:#b1c2d324;box-shadow:0 18px 36px #00000052}.browser-panel__state strong{font-size:1.02rem;font-weight:700;color:var(--text)}.browser-panel__state p{margin:0;color:var(--text-muted)}.browser-panel__meta{max-width:min(720px,100%);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.88rem;color:var(--text-muted);opacity:.82}.browser-panel__spinner{width:30px;height:30px;border-radius:50%;border:3px solid rgba(14,165,164,.2);border-top-color:var(--accent);animation:spin .8s linear infinite}.browser-panel__hint{padding:10px 14px 12px;border-top:1px solid var(--border);color:var(--text-muted);font-size:.82rem}.settings-drawer__eyebrow{color:var(--text-muted);font-size:.76rem;letter-spacing:.12em;text-transform:uppercase}.settings-drawer__close{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none}.settings-backdrop{position:fixed;inset:0;border:none;background:#03050a3d}.settings-drawer{position:fixed;top:18px;right:18px;width:min(420px,calc(100vw - 36px));height:min(calc(100dvh - 36px),860px);border-radius:24px;border:1px solid var(--border);background:var(--surface-strong);box-shadow:var(--shadow);padding:20px;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:16px;overflow:hidden;z-index:20}.settings-drawer__header{display:flex;align-items:start;justify-content:space-between;gap:16px;flex-shrink:0}.settings-drawer__header h2{margin:8px 0 0;font-size:1.12rem}.settings-drawer__body{flex:1;min-height:0;display:flex;flex-direction:column;gap:16px;overflow-y:auto;padding-right:4px}.settings-field{display:flex;flex-direction:column;gap:8px}.settings-field span{font-size:.92rem;color:var(--text-muted)}.settings-field input,.settings-field textarea,.settings-field select{width:100%;padding:11px 13px;border-radius:14px;border:1px solid var(--border);background:var(--surface);color:var(--text)}.settings-field--textarea{min-height:0}.settings-field textarea{min-height:180px;max-height:min(36dvh,360px);resize:vertical}.settings-drawer__footer{position:sticky;bottom:0;z-index:1;display:flex;justify-content:flex-end;align-items:center;gap:12px;flex-shrink:0;padding-top:14px;padding-bottom:max(6px,env(safe-area-inset-bottom));border-top:1px solid var(--border);background:linear-gradient(180deg,rgba(255,255,255,0),var(--surface-strong) 26%)}.settings-save-button{padding:12px 18px;min-width:148px;border-radius:14px;border:none;background:linear-gradient(135deg,var(--accent),var(--accent-strong));color:#05282a;font-weight:700}.tester-drawer__handle{position:fixed;left:0;top:50%;transform:translateY(-50%);border:1px solid var(--border);border-left:none;border-radius:0 16px 16px 0;background:var(--surface-strong);color:var(--text);padding:12px 10px;writing-mode:vertical-rl;text-orientation:mixed;letter-spacing:.08em;text-transform:uppercase;box-shadow:var(--shadow);z-index:18}.tester-drawer{position:fixed;top:18px;left:18px;width:min(380px,calc(100vw - 44px));height:min(calc(100dvh - 36px),860px);border-radius:24px;border:1px solid var(--border);background:var(--surface-strong);box-shadow:var(--shadow);padding:20px;display:grid;grid-template-rows:auto minmax(0,1fr);gap:16px;overflow:hidden;transform:translate(calc(-100% - 28px));opacity:0;pointer-events:none;transition:transform .18s ease,opacity .18s ease;z-index:19}.tester-drawer.is-open{transform:translate(0);opacity:1;pointer-events:auto}.tester-drawer__header,.tester-block__header{display:flex;align-items:start;justify-content:space-between;gap:12px}.tester-drawer__eyebrow{color:var(--text-muted);font-size:.76rem;letter-spacing:.12em;text-transform:uppercase}.tester-drawer__header h2,.tester-block h3{margin:6px 0 0}.tester-drawer__close,.tester-clear-button{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:12px;padding:8px 10px}.tester-drawer__body{min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:14px;padding-right:4px}.tester-block{display:flex;flex-direction:column;gap:12px;padding:14px;border-radius:18px;border:1px solid var(--border);background:var(--surface)}.tester-status-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.tester-status-grid div,.tester-status-stack div{display:flex;flex-direction:column;gap:4px}.tester-status-grid span,.tester-status-stack span,.tester-field span,.tester-event__detail span{font-size:.78rem;color:var(--text-muted)}.tester-status-grid strong,.tester-status-stack strong,.tester-field strong,.tester-event__detail strong,.tester-event__head strong{font-weight:600}.tester-status-stack{display:flex;flex-direction:column;gap:10px}.tester-field{display:flex;flex-direction:column;gap:8px}.tester-field__range{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center}.tester-field--toggle{display:flex;flex-direction:row;align-items:center;justify-content:space-between}.tester-field--toggle input{width:18px;height:18px}.tester-event-list{display:flex;flex-direction:column;gap:10px;max-height:360px;overflow-y:auto;padding-right:4px}.tester-event{display:flex;flex-direction:column;gap:8px;padding:10px 12px;border-radius:14px;border:1px solid var(--border);background:var(--surface-strong)}.tester-event--empty{color:var(--text-muted)}.tester-event__head{display:flex;align-items:center;justify-content:space-between;gap:10px}.tester-event__head span{color:var(--text-muted);font-size:.78rem}.tester-event__details{display:flex;flex-direction:column;gap:6px}.tester-event__detail{display:grid;grid-template-columns:minmax(0,110px) minmax(0,1fr);gap:10px;align-items:start}.loader-overlay{color:var(--text);background:#fff9;padding:10px 14px;border-radius:999px;border:1px solid var(--border)}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:900px){.app-frame{padding-top:4px}.avatar-stage-layout{width:min(560px,100%);grid-template-columns:40px minmax(0,1fr) 40px;gap:14px}.avatar-stage{width:min(100%,240px)}}@media(max-width:640px){.screen-shell{padding:8px}.app-frame{gap:10px}.top-toolbar{gap:10px;align-items:flex-start;flex-wrap:wrap}.top-toolbar__meta{max-width:none;width:100%}.top-toolbar__actions{width:100%;justify-content:flex-end}.avatar-stage{width:min(100%,220px)}.browser-panel__toolbar{padding:10px;gap:10px}.browser-panel__toolbar-meta{max-width:calc(100% - 182px)}.browser-panel__toolbar-actions{flex-wrap:wrap;justify-content:flex-end}.settings-drawer{inset:10px;width:auto;height:auto;padding:16px;border-radius:22px}.settings-drawer__body{padding-right:2px}.settings-field textarea{min-height:144px;max-height:min(28dvh,280px)}.settings-drawer__footer{padding-top:12px}.settings-save-button{width:100%}.tester-drawer{top:10px;left:10px;right:10px;width:auto;height:auto;max-height:calc(100dvh - 20px);padding:16px;border-radius:22px;transform:translate(calc(-100% - 20px))}.tester-drawer__handle{top:auto;bottom:18px;transform:none;writing-mode:horizontal-tb;text-orientation:initial;padding:10px 14px}.tester-status-grid{grid-template-columns:1fr}.tester-event__detail{grid-template-columns:1fr;gap:4px}}@media(orientation:portrait)and (min-width:700px){.screen-shell{justify-content:center;align-items:stretch;padding-top:12px}.app-frame{height:100%;min-height:0;width:min(980px,100%);grid-template-rows:auto auto auto auto minmax(0,1fr);gap:16px}.avatar-stage-layout{width:min(920px,100%);grid-template-columns:58px minmax(0,1fr) 58px;gap:26px}.avatar-stage{width:min(100%,625px);margin-inline:auto}.controls-strip{width:min(760px,100%)}.top-toolbar{width:min(920px,100%);margin-inline:auto}.status-stack{max-height:min(10vh,96px);overflow-y:auto;padding-right:4px}}