:root{--sans:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--accent:#2f74b5;--accent-soft:#eef6fb;--accent-soft-border:#cfe2ee;--accent-soft-text:#2d5d7f;--border:#d9e1e5;--border-strong:#cfd9de;--button-bg:#eef2f3;--button-bg-hover:#e4edf1;--danger:#9b3723;--danger-bg:#fff2ed;--danger-border:#f2c7ba;--grid-line:#1720260d;--modal-text:#eef2f3;--overlay:#11181d9e;--on-contrast:#fff;--on-primary:#fff;--page-bg:#f4f7f8;--panel-bg:#fff;--phone-shell:#172026;--phone-screen:#11181d;--primary:#1c7c54;--primary-hover:#166843;--primary-muted:#8bbdaa;--shadow:#1c2c3714;--shadow-strong:#00000047;--status-bg:#eef2f3;--status-ok-bg:#e7f5ef;--status-ok-border:#b7decf;--status-ok-text:#1d6b4f;--status-text:#53636d;--subtle-bg:#f8fafb;--surface-muted:#f2f5f6;--surface-muted-border:#dfe7eb;--text:#172026;--text-muted:#5b6f7c;--text-soft:#6d7c86;--text-secondary:#42515c;--warn:#8b5c10;--warn-bg:#fff4dc;--warn-border:#f0d49d;color:var(--text);background:var(--page-bg);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font:16px/1.45 var(--sans);font-synthesis:none;letter-spacing:0;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:root[data-theme=dark]{--accent:#75b8f0;--accent-soft:#153249;--accent-soft-border:#254b68;--accent-soft-text:#9fd0fb;--border:#2b3942;--border-strong:#3a4a54;--button-bg:#1d2931;--button-bg-hover:#26353f;--danger:#ffb2a1;--danger-bg:#3a1d17;--danger-border:#734135;--grid-line:#eef4f70f;--modal-text:#eef2f3;--overlay:#03080bb8;--on-contrast:#0f1418;--on-primary:#fff;--page-bg:#0f1418;--panel-bg:#151d23;--phone-shell:#0c1115;--phone-screen:#0b1014;--primary:#43a978;--primary-hover:#55bd89;--primary-muted:#2e684f;--shadow:#00000038;--shadow-strong:#00000080;--status-bg:#1d2931;--status-ok-bg:#173428;--status-ok-border:#2e6b50;--status-ok-text:#8be0b9;--status-text:#b2c0c9;--subtle-bg:#11191f;--surface-muted:#1c252c;--surface-muted-border:#2f3d46;--text:#eef4f7;--text-muted:#9fb0bc;--text-soft:#8ea0aa;--text-secondary:#c6d3da;--warn:#ffd48a;--warn-bg:#332714;--warn-border:#6f5523;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}@media (prefers-color-scheme:dark){:root[data-theme=system]{--accent:#75b8f0;--accent-soft:#153249;--accent-soft-border:#254b68;--accent-soft-text:#9fd0fb;--border:#2b3942;--border-strong:#3a4a54;--button-bg:#1d2931;--button-bg-hover:#26353f;--danger:#ffb2a1;--danger-bg:#3a1d17;--danger-border:#734135;--grid-line:#eef4f70f;--modal-text:#eef2f3;--overlay:#03080bb8;--on-contrast:#0f1418;--on-primary:#fff;--page-bg:#0f1418;--panel-bg:#151d23;--phone-shell:#0c1115;--phone-screen:#0b1014;--primary:#43a978;--primary-hover:#55bd89;--primary-muted:#2e684f;--shadow:#00000038;--shadow-strong:#00000080;--status-bg:#1d2931;--status-ok-bg:#173428;--status-ok-border:#2e6b50;--status-ok-text:#8be0b9;--status-text:#b2c0c9;--subtle-bg:#11191f;--surface-muted:#1c252c;--surface-muted-border:#2f3d46;--text:#eef4f7;--text-muted:#9fb0bc;--text-soft:#8ea0aa;--text-secondary:#c6d3da;--warn:#ffd48a;--warn-bg:#332714;--warn-border:#6f5523;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}body{background:var(--page-bg);min-width:320px;margin:0}#root{min-height:100vh}.app-shell{min-height:100vh;padding:24px}.topbar{flex-wrap:wrap;justify-content:space-between;align-items:end;gap:24px;max-width:1520px;margin:0 auto 18px;display:flex}.topbar-actions{flex-wrap:wrap;justify-content:flex-end;align-items:flex-end;gap:10px;display:flex}.eyebrow{color:var(--text-muted);letter-spacing:0;text-transform:uppercase;margin:0 0 6px;font-size:13px;font-weight:700}h1,h2{letter-spacing:0;margin:0}h1{color:var(--text);font-size:34px;line-height:1.1}h2{color:var(--text);font-size:16px;line-height:1.2}.status-strip,.button-row,.panel-title,.status,.alert,button{align-items:center;display:flex}.status-strip{flex-wrap:wrap;justify-content:flex-end;gap:8px}.status{background:var(--status-bg);border:1px solid var(--border);color:var(--status-text);border-radius:999px;gap:6px;padding:7px 10px}.status.ok{background:var(--status-ok-bg);border-color:var(--status-ok-border);color:var(--status-ok-text)}.status.warn{background:var(--warn-bg);border-color:var(--warn-border);color:var(--warn)}.settings-button{background:var(--text);border-color:var(--text);color:var(--on-contrast)}.settings-button:hover:not(:disabled){background:var(--text-secondary);border-color:var(--text-secondary)}.about-page{background:var(--overlay);z-index:40;justify-content:flex-end;align-items:flex-start;padding:24px;display:flex;position:fixed;inset:0}.about-panel{background:var(--panel-bg);border:1px solid var(--border);box-shadow:0 24px 72px var(--shadow-strong);border-radius:8px;gap:16px;width:min(100%,520px);max-width:520px;padding:20px;display:grid}.about-header{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.about-header h2{font-size:24px}.about-close{flex:none}.about-copy{color:var(--text-secondary);margin:0;line-height:1.55}.settings-field span{align-items:center;gap:8px;display:flex}.settings-field svg{color:var(--accent)}.repository-link{background:var(--subtle-bg);border:1px solid var(--border);color:var(--text);border-radius:8px;align-items:center;gap:8px;min-width:0;padding:12px;text-decoration:none;display:flex}.repository-link span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.repository-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.repository-stats div{background:var(--subtle-bg);border:1px solid var(--border);border-radius:8px;justify-items:start;gap:6px;min-height:104px;padding:12px;display:grid}.repository-stats svg{color:var(--accent)}.repository-stats strong{color:var(--text);font-size:24px;line-height:1}.repository-stats span,.about-error{color:var(--text-soft);font-size:13px}.about-error{margin:0}.alert{background:var(--danger-bg);border:1px solid var(--danger-border);color:var(--danger);border-radius:8px;gap:8px;max-width:1520px;margin:0 auto 18px;padding:12px 14px}.workspace{grid-template-columns:minmax(260px,320px) minmax(320px,1fr) minmax(280px,360px);gap:18px;max-width:1520px;margin:0 auto;display:grid}.panel,.log-section{background:var(--panel-bg);border:1px solid var(--border);box-shadow:0 12px 36px var(--shadow);border-radius:8px}.panel{flex-direction:column;gap:14px;padding:16px;display:flex}.panel-title{gap:8px}.log-title{justify-content:space-between}.log-title span{align-items:center;gap:8px;display:flex}.panel-title svg{color:var(--accent)}label{color:var(--text-secondary);gap:7px;font-size:13px;font-weight:700;display:grid}input,select,textarea{background:var(--subtle-bg);border:1px solid var(--border-strong);box-sizing:border-box;color:var(--text);font:14px/1.35 var(--sans);letter-spacing:0;border-radius:6px;width:100%;min-width:0;padding:10px 11px}textarea{resize:vertical;min-height:116px}input:focus,select:focus,textarea:focus{border-color:var(--accent);outline:3px solid #2f74b529}.toggle{align-items:center;gap:10px;display:flex}.toggle input{width:18px;height:18px}.device-box,.model-box{background:var(--subtle-bg);border:1px solid var(--border);border-radius:8px;gap:4px;padding:12px;display:grid}.device-box span,.model-box>span{color:var(--text);font-weight:800}.device-details,.model-details{gap:4px;display:grid}.device-details summary,.model-details summary{color:var(--text-muted);cursor:pointer;font-size:12px;font-weight:800;list-style-position:inside}.device-box small,.pending-header small,.muted{color:var(--text-soft)}.capability-grid{flex-wrap:wrap;gap:6px;display:flex}.timing-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;display:grid}.capability-grid span{background:var(--accent-soft);border:1px solid var(--accent-soft-border);color:var(--accent-soft-text);border-radius:999px;padding:4px 8px;font-size:12px;font-weight:800}.button-row{gap:8px}button{background:var(--button-bg);border:1px solid var(--border-strong);color:var(--text);cursor:pointer;font:700 14px/1 var(--sans);border-radius:6px;justify-content:center;gap:8px;min-height:40px;padding:0 12px}button:hover:not(:disabled){background:var(--button-bg-hover)}button:disabled{cursor:not-allowed;opacity:.52}button.primary{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}button.primary:hover:not(:disabled){background:var(--primary-hover)}button.primary:disabled{background:var(--primary-muted);border-color:var(--primary-muted)}button.danger{color:var(--danger)}.wide{width:100%}.phone-stage{background:linear-gradient(90deg, var(--grid-line) 1px, transparent 1px), linear-gradient(var(--grid-line) 1px, transparent 1px), var(--button-bg);border:1px solid var(--border);background-size:28px 28px;border-radius:8px;justify-content:center;align-items:center;min-height:660px;padding:24px;display:flex}.phone-frame{aspect-ratio:9/20;background:var(--phone-screen);border:10px solid var(--phone-shell);border-radius:28px;max-width:100%;max-height:72vh;position:relative;overflow:hidden;box-shadow:0 24px 70px #1720263d}.phone-screenshot-button{cursor:zoom-in;background:0 0;border:0;width:100%;height:100%;padding:0;display:block;position:relative;overflow:hidden}.phone-frame img{object-fit:contain;width:100%;height:100%;display:block}.empty-screen{color:#94a3ad;flex-direction:column;justify-content:center;align-items:center;gap:10px;width:100%;height:100%;min-height:540px;display:flex}.tap-marker,.swipe-marker{border:2px solid var(--on-primary);border-radius:999px;width:18px;height:18px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 0 0 5px #ffc10773}.tap-marker{background:#ffc107}.tap-marker.long_press{background:#c94b32}.tap-marker.double_tap,.swipe-marker.start{background:var(--accent)}.swipe-marker.end{background:var(--primary)}.pending-action{border-top:1px solid var(--border);gap:10px;margin-top:4px;padding-top:14px;display:grid}.pending-header{justify-content:space-between;align-items:center;display:flex}.pending-header span{color:var(--text);font-weight:800}.pending-action p{background:var(--subtle-bg);border:1px solid var(--border);color:var(--text-secondary);border-radius:8px;min-height:46px;margin:0;padding:11px}.conversation-list{background:var(--subtle-bg);border:1px solid var(--border);border-radius:8px;gap:8px;min-height:160px;max-height:260px;padding:10px;display:grid;overflow:auto}.conversation-list .muted{place-self:center;margin:0}.chat-message{border:1px solid var(--border);border-radius:8px;gap:5px;padding:9px 10px;display:grid}.chat-message.user{background:var(--accent-soft);border-color:var(--accent-soft-border)}.chat-message.assistant{background:var(--panel-bg)}.chat-message.observation{background:var(--surface-muted);border-color:var(--surface-muted-border)}.chat-message span{color:var(--text-muted);text-transform:uppercase;font-size:11px;font-weight:800}.chat-message p{color:var(--text);white-space:pre-wrap;word-break:break-word;margin:0}.log-section{max-width:1520px;margin:18px auto 0;padding:16px}.log-list{gap:10px;margin-top:14px;display:grid}.log-entry{border-left:4px solid var(--border-strong);gap:5px;padding:10px 12px;display:grid}.log-entry.with-screenshot{gap:7px}.log-entry-content{gap:5px;min-width:0;display:grid}.log-entry-body{grid-template-columns:minmax(0,1fr) auto;align-items:start;column-gap:12px;display:grid}.log-entry-media{justify-content:flex-end;display:flex}.log-entry.ok{border-color:var(--primary)}.log-entry.warn{border-color:#c18421}.log-entry.error{border-color:#c94b32}.log-entry time{color:var(--text-soft);font-size:12px}.log-entry strong{color:var(--text)}.log-entry pre{background:var(--subtle-bg);color:var(--text-secondary);white-space:pre-wrap;word-break:break-word;border-radius:6px;max-height:170px;margin:2px 0 0;padding:10px;overflow:auto}.log-screenshot-button{background:var(--phone-screen);cursor:zoom-in;border:0;border-radius:6px;width:108px;height:144px;padding:0;position:relative;overflow:hidden}.log-screenshot-button img{object-fit:contain;width:100%;height:100%;display:block}.log-screenshot-overlay{color:var(--on-primary);opacity:0;background:#1720268c;justify-content:center;align-items:center;transition:opacity .12s ease-out;display:flex;position:absolute;inset:0}.log-screenshot-button:hover .log-screenshot-overlay,.log-screenshot-button:focus-visible .log-screenshot-overlay{opacity:1}@media (width<=720px){.log-entry-body{grid-template-columns:1fr;row-gap:8px}.log-entry-media{justify-content:flex-start}}.screenshot-modal{z-index:30;background:#11181db8;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.screenshot-modal-panel{background:var(--phone-screen);border:1px solid #ffffff1f;border-radius:8px;gap:14px;width:100%;max-width:min(92vw,1240px);max-height:92vh;padding:14px;display:grid;box-shadow:0 24px 72px #0006}.screenshot-modal-header{color:var(--modal-text);justify-content:space-between;align-items:center;gap:12px;display:flex}.screenshot-modal-header strong{font-size:14px;display:block}.screenshot-modal-header small{color:#9fb0bc}.screenshot-modal-close{color:var(--modal-text);background:#ffffff14;border-color:#ffffff1f;flex:none;width:36px;height:36px}.screenshot-modal-viewport{text-align:center;height:calc(92vh - 92px);overflow:auto}.screenshot-modal-viewport img{object-fit:contain;background:#0c1115;width:auto;max-width:none;margin:0 auto;transition:height 80ms ease-out;display:block}.spin{animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=1120px){.app-shell{padding:16px}.timing-grid{grid-template-columns:1fr}.phone-stage{min-height:560px}.phone-frame{max-height:68vh}}@media (width<=760px){.topbar{flex-direction:column;align-items:flex-start}.status-strip,.topbar-actions{justify-content:flex-start}}@media (width<=940px){.workspace{grid-template-columns:1fr}}@media (width<=620px){.about-page{padding:12px}.repository-stats{grid-template-columns:1fr}}
