:root{color-scheme:dark;--bg:#090e1a;--surface:#111a2b;--panel:#151f32;--line:rgba(197,225,255,.12);--text:#eaf3ff;--muted:#94a7bc;--accent:#79e8eb;--accent-rgb:121,232,235;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;font-synthesis:none}
:root[data-accent=violet]{--accent:#c5a1ff;--accent-rgb:197,161,255}
:root[data-accent=amber]{--accent:#ffcf7c;--accent-rgb:255,207,124}
*{box-sizing:border-box}html{background:#060b14}body{margin:0;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--text);background:radial-gradient(ellipse at 20% 15%,#26395880,transparent 45%),radial-gradient(ellipse at 85% 85%,#222f5480,transparent 48%),#060b14}
button,input,textarea{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:3px}a{color:var(--accent)}[hidden]{display:none!important}
.background-grid{position:fixed;inset:0;pointer-events:none;opacity:.25;background-image:linear-gradient(#a5dafa12 1px,transparent 1px),linear-gradient(90deg,#a5dafa12 1px,transparent 1px);background-size:46px 46px;mask-image:radial-gradient(circle,#000,transparent 72%)}
.device{position:relative;width:min(420px,100%);height:min(850px,calc(100dvh - 52px));min-height:575px;flex:none;border:1px solid #53728b80;border-radius:39px;padding:8px;background:linear-gradient(145deg,#213a56,#07101c 46%,#19283b);box-shadow:0 24px 90px #000a,0 0 120px #4f83bb20;z-index:1}
.device-inner{background:radial-gradient(circle at 50% 21%,rgba(var(--accent-rgb),.075),transparent 48%),var(--bg);height:100%;display:flex;flex-direction:column;position:relative;overflow:hidden;border-radius:32px}
.statusbar{height:36px;flex:none;display:flex;justify-content:space-between;align-items:center;padding:0 22px;font-size:10px;font-weight:750;letter-spacing:.08em;color:#b9d2e8}.status-time{font-variant-numeric:tabular-nums}.status-caption{font-size:8px;opacity:.6}.status-network{font-size:9px;color:var(--accent)}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:16px 24px 13px}.brand{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:850;letter-spacing:.13em;line-height:1}.brand-mark{color:var(--accent);font-size:32px;font-family:Georgia,serif}.brand-light{font-weight:300;color:#b1c5db}.brand small{display:block;margin-top:6px;font-size:8px;letter-spacing:.17em;color:#748da7;font-weight:650}.circle-action{width:40px;height:40px;border:1px solid var(--line);border-radius:50%;background:linear-gradient(140deg,#25374d,#121e30);color:var(--accent);font-size:23px;box-shadow:0 0 0 3px #ffffff04}
.screens{flex:1;overflow:auto;scrollbar-width:thin;scrollbar-color:#446076 transparent;overscroll-behavior:contain}.screen{padding:7px 24px 32px;animation:rise .26s ease both}.screen h1{font-size:32px;letter-spacing:-.055em;margin:16px 0 7px;line-height:1.1}.eyebrow{font-size:9px;letter-spacing:.2em;font-weight:800;color:var(--accent);display:flex;gap:8px;align-items:center}.live-dot{width:6px;height:6px;background:var(--accent);border-radius:50%;box-shadow:0 0 8px var(--accent)}.clock-block{padding-top:6px;margin-bottom:18px}.hero-time{font-size:67px!important;font-weight:300!important;line-height:1!important;letter-spacing:-.07em!important;margin:4px 0 5px!important;font-variant-numeric:tabular-nums}.hero-date{font-size:12px;margin:0;color:var(--muted);letter-spacing:.03em}
.hero-card{position:relative;isolation:isolate;overflow:hidden;padding:18px 19px 20px;min-height:220px;border:1px solid rgba(var(--accent-rgb),.24);border-radius:20px;background:linear-gradient(135deg,rgba(var(--accent-rgb),.13),#172a3a 35%,#101a2f);box-shadow:0 9px 28px #0004}.card-glow{position:absolute;z-index:-1;width:160px;height:160px;right:-15px;top:25px;border:1px solid rgba(var(--accent-rgb),.35);border-radius:50%;box-shadow:0 0 0 18px rgba(var(--accent-rgb),.035),0 0 0 39px rgba(var(--accent-rgb),.03),0 0 60px rgba(var(--accent-rgb),.17)}.hero-top{display:flex;justify-content:space-between}.micro-label{font-size:9px;font-weight:750;letter-spacing:.12em;color:#afc4d8}.phi-emblem{position:absolute;right:25px;top:53px;font:86px Georgia,serif;color:var(--accent);text-shadow:0 0 24px rgba(var(--accent-rgb),.45);opacity:.9}.hero-card h2{max-width:210px;position:relative;font-size:23px;line-height:1.09;letter-spacing:-.04em;margin:55px 0 7px}.hero-card p{max-width:230px;font-size:11px;line-height:1.55;margin:0 0 14px;color:#adc3d8;position:relative}.text-action{border:0;background:none;padding:0;color:var(--accent);font-weight:800;letter-spacing:.02em;font-size:11px}.text-action span{margin-left:8px}
.section-label{display:flex;justify-content:space-between;align-items:center;margin:24px 0 12px;font-size:10px;font-weight:800;letter-spacing:.17em}.section-label span:last-child{font-size:9px;color:var(--muted);letter-spacing:.06em}
.app-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.app-tile{min-height:98px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:4px;text-align:left;background:linear-gradient(140deg,#1b2a40,#101c2d);border:1px solid var(--line);color:var(--text);border-radius:15px;padding:12px;transition:transform .16s,border-color .16s}.app-tile:hover{transform:translateY(-3px);border-color:rgba(var(--accent-rgb),.5)}.app-icon{font-size:24px;font-weight:400;line-height:1;color:var(--accent);margin-bottom:7px}.app-tile>span:nth-child(2){font-size:12px;font-weight:800}.app-tile small{font-size:10px;color:var(--muted)}:root.compact .app-tile{min-height:78px;padding:9px}:root.compact .app-icon{margin-bottom:0}
.foot-note{font-size:10px;line-height:1.55;color:#8299ae;margin:18px 0 0}.dock{height:78px;display:flex;justify-content:space-around;align-items:center;flex:none;padding:6px 13px max(10px,env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#0a1323e8;backdrop-filter:blur(10px)}.dock button{background:transparent;border:0;min-width:56px;display:flex;align-items:center;flex-direction:column;gap:5px;color:#8ea5b9}.dock button span{font-size:22px;height:25px}.dock button small{font-size:9px;font-weight:800;letter-spacing:.1em}.dock button[aria-current=page]{color:var(--accent)}.dock .surf-trigger{width:51px;height:57px;border:1px solid rgba(var(--accent-rgb),.36);background:rgba(var(--accent-rgb),.11);color:var(--accent);border-radius:16px;justify-content:center}
.subhead{font-size:13px;line-height:1.65;color:var(--muted);margin:8px 0 24px}.field-label{font-size:10px;font-weight:800;letter-spacing:.13em;color:#d0dfec;display:flex;justify-content:space-between;margin:15px 0 10px}textarea{width:100%;min-height:300px;resize:vertical;padding:18px;outline:0;border:1px solid #4c647990;border-radius:15px;background:#0e1928;color:var(--text);font-size:14px;line-height:1.7}textarea::placeholder{color:#687d91}.inline-status{font-size:11px;color:var(--accent);margin:10px 0 22px}
.info-panel{border:1px solid var(--line);background:var(--panel);border-radius:17px;padding:19px;margin:14px 0 18px}.info-panel strong{display:block;margin:10px 0;font-size:18px;letter-spacing:-.025em}.info-panel p,.micro-copy{color:var(--muted);font-size:11px;line-height:1.7}.primary-button,.ghost-button{padding:14px 18px;border-radius:12px;font-weight:800;font-size:12px;width:100%;margin-bottom:14px}.primary-button{border:1px solid var(--accent);color:#09111a;background:var(--accent)}.ghost-button{border:1px solid #3b566a;background:#122238;color:var(--text)}.danger{border-color:#8b4657;color:#fcb8c0;margin-top:23px}input[type=file]{display:block;width:100%;font-size:11px;background:#111f30;padding:13px;border:1px dashed #577184;border-radius:12px;color:var(--muted)}input[type=file]::file-selector-button{background:#233e52;color:var(--text);border:0;padding:8px;margin-right:10px;border-radius:7px}.stat-list{border:1px solid var(--line);border-radius:14px;overflow:hidden;margin:20px 0}.stat-list>div{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 14px;border-bottom:1px solid var(--line);font-size:11px;color:var(--muted)}.stat-list>div:last-child{border-bottom:0}.stat-list strong{font-size:11px;color:var(--accent);text-align:right}.settings-group{border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin:17px 0 22px}.settings-group legend{padding:0 8px;font-size:10px;color:var(--muted);font-weight:800;letter-spacing:.12em}.accent-choice{display:flex;align-items:center;gap:12px;padding:10px 0;font-size:13px}.accent-choice input{accent-color:var(--accent)}.color-chip{width:20px;height:20px;border-radius:50%;display:inline-block}.color-chip.cyan{background:#79e8eb}.color-chip.violet{background:#c5a1ff}.color-chip.amber{background:#ffcf7c}.setting-line{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;border-bottom:1px solid var(--line)}.setting-line strong{font-size:13px;font-weight:700}.setting-line small{display:block;font-size:11px;color:var(--muted);margin-top:5px}.setting-line input{width:20px;height:20px;accent-color:var(--accent)}.about-emblem{text-align:center;margin:25px auto;color:var(--accent);font:100px Georgia,serif;text-shadow:0 0 45px rgba(var(--accent-rgb),.28)}.external-link{display:inline-block;margin:15px 0 26px;font-size:13px;font-weight:800}
.surf-overlay{position:absolute;inset:0;background:radial-gradient(circle at center,#1b3247f2,#071120fa 60%);z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px;backdrop-filter:blur(22px)}.surf-close{position:absolute;right:23px;top:51px;border:1px solid #577184;background:#162c42;color:var(--text);border-radius:50%;width:40px;height:40px;font-size:23px}.surf-heading{text-align:center}.surf-heading .eyebrow{justify-content:center}.surf-heading h2{margin:10px 0 0;font-size:45px;letter-spacing:.08em;font-weight:300;color:var(--accent)}.surf-heading p:last-child{font-size:12px;color:var(--muted)}.surf-wheel{width:min(320px,95%);aspect-ratio:1;position:relative;margin:30px 0 16px;border-radius:50%;background:radial-gradient(circle,rgba(var(--accent-rgb),.07) 0 24%,transparent 25%)}.wheel-rim{position:absolute;inset:16%;border:1px dashed rgba(var(--accent-rgb),.45);border-radius:50%;box-shadow:0 0 0 20px rgba(var(--accent-rgb),.023),inset 0 0 28px #5aa6ba14}.wheel-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:var(--accent);font:66px Georgia,serif;text-shadow:0 0 22px rgba(var(--accent-rgb),.4)}.wheel-app{position:absolute;top:50%;left:50%;width:80px;height:80px;border:1px solid rgba(var(--accent-rgb),.48);background:linear-gradient(140deg,#243d50,#102033);border-radius:50%;color:var(--text);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;box-shadow:0 5px 18px #0005;transform:translate(-50%,-50%) translate(var(--tx),var(--ty))}.wheel-app span{font-size:27px;color:var(--accent);line-height:1}.wheel-app small{font-size:9px;letter-spacing:.1em}.wheel-app:hover{background:#30495c;border-color:var(--accent)}.w1{--tx:0px;--ty:-125px}.w2{--tx:108px;--ty:-62px}.w3{--tx:108px;--ty:62px}.w4{--tx:0px;--ty:125px}.w5{--tx:-108px;--ty:62px}.w6{--tx:-108px;--ty:-62px}.surf-hint{font-size:10px;line-height:1.6;text-align:center;color:var(--muted)}.toast{position:absolute;z-index:8;bottom:90px;left:20px;right:20px;background:#264357;border:1px solid rgba(var(--accent-rgb),.5);color:var(--text);font-size:12px;padding:12px 16px;border-radius:12px;box-shadow:0 10px 25px #0008}.desktop-caption{position:relative;color:#8ea5b7;font-size:10px;letter-spacing:.19em;margin:15px}
@keyframes rise{from{opacity:.6;transform:translateY(7px)}to{opacity:1;transform:none}}:root.reduce-motion *, :root.reduce-motion *::before,:root.reduce-motion *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(max-width:480px){body{display:block}.background-grid,.desktop-caption{display:none}.device{width:100%;height:100dvh;min-height:0;border:0;border-radius:0;padding:0;box-shadow:none}.device-inner{border-radius:0}.statusbar{padding-top:env(safe-area-inset-top);height:calc(36px + env(safe-area-inset-top))}.dock{height:calc(78px + env(safe-area-inset-bottom))}.surf-close{top:calc(50px + env(safe-area-inset-top))}}
@media(max-height:680px){.surf-wheel{width:min(270px,85%);margin:10px 0}.w1{--ty:-104px}.w2{--tx:90px;--ty:-52px}.w3{--tx:90px;--ty:52px}.w4{--ty:104px}.w5{--tx:-90px;--ty:52px}.w6{--tx:-90px;--ty:-52px}.wheel-app{width:68px;height:68px}.wheel-app span{font-size:22px}.surf-heading h2{font-size:32px}}

/* Rung 1.1: living shell, accessibility, and mobile viewport polish */
.device-inner,.screens{min-height:0}
.screens{scrollbar-width:none;scroll-padding-bottom:38px;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch}
.screens::-webkit-scrollbar{display:none}
.screen{padding-bottom:48px}
.screens[data-direction=forward] .screen:not([hidden]){animation:screenForward .24s cubic-bezier(.2,.75,.2,1) both}
.screens[data-direction=back] .screen:not([hidden]){animation:screenBack .24s cubic-bezier(.2,.75,.2,1) both}
@keyframes screenForward{from{opacity:0;transform:translateX(15px)}to{opacity:1;transform:translateX(0)}}
@keyframes screenBack{from{opacity:0;transform:translateX(-15px)}to{opacity:1;transform:translateX(0)}}
.top-actions{display:flex;align-items:center;gap:8px}
.top-actions .circle-action{flex:0 0 40px}
.quick-action{font-size:24px}
.section-actions{display:flex;gap:12px;align-items:center;justify-content:flex-end}
.section-actions button{background:transparent;border:0;padding:7px 0;color:var(--accent);font-size:9px;font-weight:800;letter-spacing:.09em}
.section-actions span{color:var(--muted);font-size:9px;letter-spacing:.04em}
.app-grid.layout-list{grid-template-columns:1fr}
.app-grid.layout-list .app-tile{min-height:58px;flex-direction:row;align-items:center;justify-content:flex-start;gap:14px}
.app-grid.layout-list .app-icon{min-width:30px;margin:0}
.app-grid.layout-list .app-tile small{margin-left:auto}
.home-editor{margin-top:17px;padding:17px;background:var(--panel);border:1px solid rgba(var(--accent-rgb),.24);border-radius:16px}
.home-editor h2{margin:0 0 7px;font-size:21px;letter-spacing:-.03em}
.home-editor p{font-size:11px;color:var(--muted);line-height:1.5}
.home-shortcuts-list{padding:0;margin:14px 0;list-style:none;display:grid;gap:7px}
.edit-shortcut{display:flex;align-items:center;gap:8px;background:#101b2a;border:1px solid var(--line);border-radius:10px;padding:7px}
.edit-shortcut span{flex:1;font-size:12px;font-weight:700}
.edit-shortcut button{width:38px;height:38px;border-radius:9px;border:1px solid #4a6880;color:var(--text);background:#24374e;font-size:18px}
.edit-shortcut button:disabled{opacity:.3;cursor:not-allowed}
.editor-actions{display:flex;gap:8px}
.editor-actions button{margin:0}
.quick-panel{position:absolute;inset:0;z-index:6;display:flex;flex-direction:column;background:linear-gradient(175deg,#182d43,#091321 55%);padding:54px 22px max(26px,env(safe-area-inset-bottom));overflow:auto;animation:quickDown .24s ease both}
@keyframes quickDown{from{opacity:.7;transform:translateY(-22px)}to{opacity:1;transform:translateY(0)}}
.quick-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.quick-header h2{font-size:32px;letter-spacing:-.05em;margin:8px 0 0}
.quick-header .circle-action{font-size:28px;flex:none}
.quick-content{padding-top:22px}
.quick-notice{border:1px solid rgba(var(--accent-rgb),.25);background:rgba(var(--accent-rgb),.07);border-radius:16px;padding:18px;display:flex;flex-direction:column;gap:9px}
.quick-notice strong{color:var(--accent);font-size:15px}
.quick-notice span{font-size:12px;color:var(--text)}
.quick-notice small{font-size:11px;line-height:1.5;color:var(--muted)}
.quick-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0 8px}
.quick-tile{display:flex;align-items:flex-start;flex-direction:column;justify-content:center;gap:8px;min-height:97px;border:1px solid var(--line);border-radius:14px;background:#15263b;color:var(--text);font-size:12px;font-weight:750;padding:14px;text-align:left}
.quick-tile span{font-size:24px;color:var(--accent)}
.quick-tile strong{font-weight:750;color:var(--accent)}
.quick-tile:nth-child(3){grid-column:span 2;min-height:72px;flex-direction:row;align-items:center;justify-content:flex-start}
.surf-wheel{touch-action:none;user-select:none;-webkit-user-select:none}
.wheel-app{transition:background .13s,border-color .13s,box-shadow .13s,filter .13s}
.wheel-app.dial-active{border-color:var(--accent);background:#30546c;box-shadow:0 0 0 4px rgba(var(--accent-rgb),.16),0 0 32px rgba(var(--accent-rgb),.35);filter:brightness(1.25);transform:translate(-50%,-50%) translate(var(--tx),var(--ty)) scale(1.13)}
.dial-selection{color:var(--accent);font-size:11px;font-weight:800;margin:4px 0 0;letter-spacing:.08em;min-height:17px}
.surf-hint{max-width:295px}
:root.reduce-motion .screens .screen,:root.reduce-motion .quick-panel{animation:none!important}
@media (prefers-reduced-motion:reduce){.screens .screen,.quick-panel{animation:none!important}}
@media(max-width:360px){.section-actions{gap:6px}.section-actions span{display:none}.top-actions{gap:4px}.app-tile{padding:9px}.brand{font-size:14px}.quick-panel{padding-inline:16px}}
@media(max-width:480px){.quick-panel{padding-top:calc(54px + env(safe-area-inset-top))}}
@media(max-height:620px){.quick-panel{padding-top:20px}.surf-hint{margin:2px 0}.surf-heading p:last-child{margin-bottom:5px}}

/* Operator Passport Rung 4: optional decoration, never system capability. */
.operator-home-label { display:inline-block;margin:14px 0 4px;color:var(--accent);font-size:10px;letter-spacing:.11em;font-weight:800 }
.operator-mobile {padding:20px 0 12px;margin-top:20px;border-top:1px solid var(--line)}
.operator-mobile h2 {font-size:21px;margin:9px 0}
.operator-mobile .subhead {font-size:12px;line-height:1.65}
.operator-mobile input[type=file] {max-width:100%;font-size:12px}
.operator-mobile-actions {display:flex;flex-wrap:wrap;gap:9px;margin:14px 0}
.operator-mobile-actions button {margin:0}
.operator-mobile-actions button:disabled {opacity:.38;cursor:not-allowed}
.operator-mobile .external-link {display:inline-block;margin-top:6px}
html.operator-halo .phi-emblem {text-shadow:0 0 18px var(--accent),0 0 45px var(--accent);filter:brightness(1.24)}
html.operator-halo .hero-card {box-shadow:0 0 0 2px rgba(var(--accent-rgb),.5),0 0 38px rgba(var(--accent-rgb),.25)}
html.operator-halo .brand-mark {text-shadow:0 0 18px var(--accent)}
html.reduce-motion.operator-halo .hero-card {animation:none}


/* Native Android progress is a separate track from the live web shell. */
.native-track {
  margin:18px 0 4px;padding:17px 17px 18px;border:1px solid rgba(var(--accent-rgb),.35);
  border-radius:18px;background:linear-gradient(140deg,rgba(var(--accent-rgb),.13),#1b263e 56%,#131f32);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 12px 30px rgba(0,0,0,.17);
}
.native-track-head,.track-detail-heading{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.native-track-head>.micro-label{font-size:8px}
.native-track-chip,.track-tag{display:inline-flex;align-items:center;border:1px solid rgba(var(--accent-rgb),.45);
  border-radius:99px;color:var(--accent);background:rgba(var(--accent-rgb),.1);font-size:8px;
  font-weight:800;letter-spacing:.06em;padding:6px 9px;white-space:nowrap}
.native-track h2{font-size:21px;line-height:1.15;letter-spacing:-.035em;margin:16px 0 8px}
.native-track p,.track-detail p{font-size:11px;line-height:1.65;color:var(--muted);margin:8px 0 13px}
.native-track-steps{display:flex;flex-wrap:wrap;gap:6px;margin:15px 0}
.native-track-steps span{font-size:9px;color:#c6dbee;line-height:1.45;border:1px solid var(--line);
  background:rgba(9,17,30,.56);border-radius:8px;padding:7px 8px}
.native-track-more{background:none;border:0;padding:8px 0;color:var(--accent);
  font-size:11px;font-weight:800;text-align:left}
.native-track-more span{padding-left:5px}
.track-detail{border:1px solid var(--line);border-radius:16px;padding:17px 16px;margin:17px 0;
  background:linear-gradient(160deg,#18263d,#101a2b)}
.track-detail.native-detail{border-color:rgba(var(--accent-rgb),.3);
  background:linear-gradient(135deg,rgba(var(--accent-rgb),.1),#121d31 64%)}
.track-detail-heading .micro-label{color:var(--accent)}
.track-detail h3{font-size:17px;letter-spacing:-.025em;margin:15px 0 7px}
.track-detail .track-warning{color:#e0bd9d;border-left:2px solid #dba66f;padding:3px 0 3px 11px}
.track-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}
.track-link{color:var(--accent);border:1px solid rgba(var(--accent-rgb),.35);border-radius:10px;
  text-decoration:none;padding:10px 11px;font-size:10px;font-weight:800;line-height:1.5}
.track-link:hover,.track-link:focus-visible{background:rgba(var(--accent-rgb),.12)}
@media(max-width:380px){.native-track-head>.micro-label{width:100%}.track-link{flex:1 1 100%}}
