:root{color:#f5f7fb;background:#090d14;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;--bg-top: #121a2e;--bg-mid: #090d14;--bg-bottom: #140f24;--card-bg: rgba(255, 255, 255, .9);--card-bg-strong: rgba(255, 255, 255, .94);--card-stroke: rgba(255, 255, 255, .24);--card-shadow: 0 18px 40px rgba(3, 6, 16, .36);--text-main: #111827;--text-strong: #0f172a;--text-soft: #667085;--text-muted: #98a2b3;--accent: #0a84ff;--accent-strong: #2f95ff;--accent-glow: rgba(10, 132, 255, .3);--success: #12b76a;--warning: #f79009;--danger: #ef5da8}*{box-sizing:border-box}html{min-height:100%;background:#090d14;touch-action:manipulation;overscroll-behavior:none}body{min-width:320px;min-height:100vh;margin:0;touch-action:manipulation;overscroll-behavior:none;background:radial-gradient(circle at 12% 8%,rgba(64,118,255,.24) 0,transparent 28%),radial-gradient(circle at 88% 14%,rgba(8,132,255,.14) 0,transparent 24%),radial-gradient(circle at 50% 100%,rgba(133,76,255,.12) 0,transparent 34%),linear-gradient(180deg,var(--bg-top) 0%,var(--bg-mid) 48%,var(--bg-bottom) 100%);color:var(--text-strong)}body:before,body:after{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;content:"";pointer-events:none}body:before{background:radial-gradient(circle at 24% 24%,rgba(110,170,255,.18) 0,transparent 18%),radial-gradient(circle at 76% 40%,rgba(10,132,255,.18) 0,transparent 20%);filter:blur(18px)}body:after{background:linear-gradient(180deg,rgba(255,255,255,.03),transparent 18%)}button,input{font:inherit;touch-action:manipulation}button{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}input{width:100%;min-height:52px;border:1px solid rgba(255,255,255,.38);border-radius:18px;padding:0 16px;color:var(--text-strong);background:#ffffffc2;box-shadow:inset 0 1px #ffffffad,0 10px 24px #0f172a14}input::placeholder{color:var(--text-muted)}input:focus{border-color:#0a84ff6b;outline:3px solid rgba(10,132,255,.12)}.boot-fallback{display:grid;min-height:100vh;place-items:center;padding:24px}.boot-card{display:grid;gap:10px;width:min(100%,360px);border:1px solid rgba(255,255,255,.16);border-radius:24px;padding:20px;color:#f4f7ff;text-align:center;background:#ffffff14;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.boot-card strong{font-size:20px}.dashboard-shell{width:min(100% - 20px,430px);min-height:100vh;margin:0 auto;padding:12px 0 32px}.app-screen{overflow:hidden;border:1px solid rgba(255,255,255,.08);border-radius:42px;background:linear-gradient(180deg,rgba(255,255,255,.02),transparent 16%),linear-gradient(180deg,var(--bg-top) 0%,var(--bg-mid) 54%,var(--bg-bottom) 100%);box-shadow:0 22px 60px #0306107a,inset 0 1px #ffffff0d}.app-header{padding:10px 18px 12px;background:radial-gradient(circle at 78% -10%,rgba(66,148,255,.26),transparent 38%),linear-gradient(180deg,#192339fa,#0f141ffa)}.status-bar,.header-row,.section-header,.status-card-main,.record-meta-strip{display:flex;align-items:center}.status-bar{justify-content:space-between;color:#ffffffd1;font-size:12px;font-weight:700}.dynamic-island{width:88px;height:18px;border-radius:999px;background:#090d12}.header-row{justify-content:center;margin-top:8px}.header-copy-wrap{flex:1;min-width:0;text-align:center}.app-header h1,.section-title{margin:0}.app-header h1{color:#fff;font-size:28px;line-height:1.08;letter-spacing:0}.dashboard-content{display:grid;gap:10px;padding:10px 14px 22px}.alert-stack,.surface-stack{display:grid;gap:8px}.glass-card{border:1px solid var(--card-stroke);border-radius:24px;padding:14px;color:var(--text-main);background:linear-gradient(180deg,#ffffffeb,#edf4ffe0),var(--card-bg);box-shadow:inset 0 1px #ffffffc7,var(--card-shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.action-button-row,.record-action-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.glass-button,.pill-button,.tag-tile,.record-progress-button{position:relative;overflow:hidden;min-height:52px;border:1px solid rgba(255,255,255,.34);border-radius:20px;color:var(--text-strong);background:linear-gradient(180deg,#fffffffa,#f1f6ffeb),#ffffffe6;box-shadow:inset 0 1px #ffffffc2,0 12px 24px #0c12201f;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease,color .16s ease}.glass-button:hover:not(:disabled),.pill-button:hover:not(:disabled),.tag-tile:hover:not(:disabled){transform:translateY(-1px);box-shadow:inset 0 1px #ffffffc7,0 16px 28px #0c122029}.glass-button{padding:0 18px;font-size:16px;font-weight:700}.compact-button{min-height:38px;padding:0 14px;border-radius:999px;font-size:12px}.save-profile-button{min-width:0;padding:0 14px}.pill-button{min-width:0;padding:0 8px;font-size:15px;font-weight:700}.pill-button.is-active,.tag-tile.is-active{border-color:#0a84ffeb;color:#fff;background:linear-gradient(180deg,var(--accent-strong),var(--accent));box-shadow:inset 0 1px #ffffff29,0 16px 26px #0a84ff4d}.card-kicker{margin:0 0 6px;color:var(--text-soft);font-size:12px;font-weight:700}.section-header{justify-content:space-between;gap:12px}.section-header.compact{margin-bottom:8px}.section-title{color:var(--text-strong);font-size:30px;line-height:1.1;letter-spacing:0}.status-card .section-title,.profile-card .section-title,.metrics-panel .section-title,.recording-panel .section-title{font-size:22px}.section-note,.device-meta,.tag-summary,.record-stage-caption,.record-meta-strip,.upload-feedback p,.app-alert{font-size:13px}.section-note,.device-meta,.tag-summary,.record-stage-caption,.upload-feedback p{margin:0;color:var(--text-soft);line-height:1.45}.status-card-main{justify-content:space-between;gap:10px}.status-card{padding-block:10px}.connection-line{margin:0;color:var(--text-strong);font-size:15px;font-weight:800;line-height:1.25}.status-chip{display:inline-flex;align-items:center;justify-content:center;min-width:72px;min-height:30px;padding:0 12px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap}.status-chip.is-online,.status-chip.is-live{color:#fff;background:linear-gradient(180deg,var(--accent-strong),var(--accent));box-shadow:0 10px 22px var(--accent-glow)}.status-chip.is-pending{color:#7a4b00;background:#f790092e}.status-chip.is-error{color:#a13062;background:#ef5da82e}.status-chip.is-idle{color:var(--text-soft);background:#11182714}.device-meta{margin-top:8px}.profile-row{display:grid;grid-template-columns:minmax(0,1fr) 52px 52px 86px;gap:10px}.metrics-panel .section-title,.recording-panel .section-title{font-size:21px}.metric-log{min-height:54px;border:1px solid rgba(255,255,255,.28);border-radius:20px;padding:10px 12px;background:#fff6;box-shadow:inset 0 1px #ffffffc2}.metric-row,.metric-empty{margin:0}.metric-row{overflow:hidden;color:var(--text-strong);font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:10px;line-height:1.9;text-overflow:ellipsis;white-space:nowrap}.metric-empty{display:grid;min-height:32px;place-items:center;color:var(--text-muted);font-size:13px}.metric-name{color:var(--accent);font-weight:800}.metric-value{color:var(--text-strong);font-weight:700}.metric-sep{padding:0 3px;color:var(--text-muted)}.recording-panel{display:grid;gap:14px}.record-stage{display:grid;gap:10px}.record-stage-caption{color:var(--text-soft);font-weight:600}.record-start-button{min-height:60px;font-size:20px;font-weight:800}.record-progress-button{min-height:60px;padding:0 18px;box-shadow:inset 0 1px #ffffffc2,0 14px 30px #0c122029}.record-progress-button.is-live{cursor:pointer}.record-progress-button.is-paused{display:flex;align-items:center;cursor:default}.record-progress-fill{position:absolute;inset:0 auto 0 0;width:0;min-width:82px;border-radius:inherit;background:linear-gradient(90deg,var(--accent-strong),var(--accent));box-shadow:0 12px 24px #0a84ff3d}.record-progress-label{position:relative;z-index:1;color:var(--text-strong);font-size:18px;font-weight:800}.record-meta-strip{justify-content:space-between;gap:12px;color:var(--text-soft);font-size:12px;font-weight:700}.tag-board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.tag-column{display:grid;gap:8px;min-width:0}.tag-column-title{margin:0;color:var(--text-soft);font-size:12px;font-weight:700}.tag-tile{min-height:46px;padding:0 8px;font-size:14px;font-weight:700}.upload-feedback{display:grid;gap:6px;border:1px solid rgba(255,255,255,.28);border-radius:20px;padding:12px 14px;background:#fff6}.upload-feedback strong{color:var(--text-strong);font-size:13px}.upload-feedback.uploading{border-color:#f7900957}.upload-feedback.success{border-color:#12b76a52}.upload-feedback.error{border-color:#ef5da85c}.app-alert{border:1px solid rgba(255,255,255,.16);border-radius:18px;padding:12px 14px;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.app-alert.error{color:#ffd6ea;background:#ef5da82e}.app-alert.success{color:#d7eeff;background:#0a84ff2e}.app-alert.info{color:#e6f1ff;background:#ffffff14}@media (max-width: 420px){.dashboard-shell{width:min(100%,430px);padding:0}.app-screen{min-height:100vh;border-width:0;border-radius:0}.dashboard-content{padding-bottom:36px}.profile-row{grid-template-columns:minmax(0,1fr) 48px 48px 82px}.section-title{font-size:27px}.status-card .section-title,.profile-card .section-title,.metrics-panel .section-title,.recording-panel .section-title{font-size:20px}}
