/* OneDocSpot — phone app for the Omri Dashboard vault (1.14). iOS-native look (iOS 26 era):
   SF Pro, grouped lists, floating glass tab bar, large titles, push navigation, page sheets.
   Rock teal is the app's tint (0.96.0, Skellig). Light + dark follow the iPhone's appearance. */
:root{
  --tint:#245852; --tint-fill:rgba(36,88,82,.12); --on-tint:#FFFFFF;
  --bg:#F2F2F7; --cell:#FFFFFF; --cell-hi:#E3E3E8; --label:#000; --label2:rgba(60,60,67,.6); --label3:rgba(60,60,67,.3);
  --sep:rgba(60,60,67,.22); --fill:rgba(118,118,128,.12); --fill2:rgba(120,120,128,.2);
  --green:#34C759; --red:#FF3B30; --orange:#FF9500; --yellow:#FFCC00;
  --glass:rgba(255,255,255,.72); --glass-line:rgba(255,255,255,.9); --glass-edge:rgba(0,0,0,.06);
  --glass-sh:0 8px 28px rgba(0,0,0,.10),0 1px 2px rgba(0,0,0,.06); --menu:rgba(246,246,248,.9);
  --ink:#16151F;
  --st:env(safe-area-inset-top,0px); --sb:env(safe-area-inset-bottom,0px);
  --ease:cubic-bezier(.32,.72,0,1);
  --r:24px; --nav:52px;
  color-scheme:light dark;
}
@media (prefers-color-scheme:dark){:root{
  --tint:#7FCBB2; --tint-fill:rgba(127,203,178,.16); --on-tint:#0F1724;
  --bg:#000; --cell:#1C1C1E; --cell-hi:#2C2C2E; --label:#fff; --label2:rgba(235,235,245,.6); --label3:rgba(235,235,245,.3);
  --sep:rgba(84,84,88,.55); --fill:rgba(118,118,128,.24); --fill2:rgba(118,118,128,.32);
  --green:#30D158; --red:#FF453A; --orange:#FF9F0A; --yellow:#FFD60A;
  --glass:rgba(37,37,40,.66); --glass-line:rgba(255,255,255,.14); --glass-edge:rgba(0,0,0,.4);
  --glass-sh:0 8px 28px rgba(0,0,0,.45); --menu:rgba(40,40,43,.9);
}}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{background:var(--bg)}
html.g{background:var(--ink)}
html,body{margin:0;color:var(--label);font:17px/1.3 -apple-system,BlinkMacSystemFont,'SF Pro Text','SF Pro',Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;letter-spacing:-.01em}
body{min-height:100vh;background:var(--bg)}
html.g body{background:var(--ink)}
button{font:inherit;color:inherit;letter-spacing:inherit;cursor:pointer;border:0;background:none;padding:0;margin:0}
input{font:inherit;color:var(--label);letter-spacing:inherit}
a{color:var(--tint);text-decoration:none}
svg{display:block}
:focus{outline:none}
:focus-visible{outline:2px solid var(--tint);outline-offset:2px;border-radius:10px}
.vh{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;clip:rect(0 0 0 0);pointer-events:none}
.num{font-variant-numeric:tabular-nums}

/* splash + privacy cover (app-switcher snapshot) */
.splash,#cover{position:fixed;inset:0;background:var(--ink);display:flex;align-items:center;justify-content:center;z-index:5}
#cover{display:none;z-index:2147483000} /* 0.20.0: above every editor (scanner, crop, hide parts) for the app switcher */
body.covered #cover{display:flex}
.splash img,#cover img,.appicon{width:96px;height:96px;border-radius:22px;box-shadow:0 14px 34px rgba(0,0,0,.45),0 0 0 .5px rgba(255,255,255,.08)}

/* ---------- gate: lock, set-up, password ---------- */
.gate{min-height:100vh;min-height:100dvh;background:radial-gradient(120% 60% at 50% -10%,#34304F 0%,#1D1B2E 45%,#16151F 100%);color:#fff;display:flex;flex-direction:column;align-items:center;padding:calc(var(--st) + 54px) 24px calc(var(--sb) + 20px);text-align:center}
.gate h1{font-weight:700;font-size:28px;line-height:34px;letter-spacing:.01em;margin:22px 0 6px}
.gate .sub{color:rgba(235,235,245,.6);font-size:17px;line-height:22px;margin:0;max-width:330px}
.gate .grow{flex:1;min-height:24px}
.gate .stack{width:100%;max-width:380px;display:flex;flex-direction:column;gap:12px;align-items:stretch}
.fid{width:112px;height:112px;margin:8px auto 0;border-radius:32px;display:flex;align-items:center;justify-content:center;color:#fff;background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 .5px rgba(255,255,255,.12)}
.fid svg{width:64px;height:64px}
.fid:active{background:rgba(255,255,255,.14)}
.gstate{display:flex;align-items:center;justify-content:center;gap:10px;color:rgba(235,235,245,.75);font-size:15px;min-height:52px}
.cap{display:flex;align-items:center;justify-content:center;gap:8px;height:52px;border-radius:26px;font-size:17px;font-weight:600;width:100%;transition:transform .15s,opacity .15s}
.cap:active{transform:scale(.97);opacity:.85}
.cap.tint{background:var(--tint);color:var(--on-tint,#fff)}
.gate .cap.tint{background:#7FCBB2;color:#0F1724}
.cap.glass{background:rgba(255,255,255,.12);color:#fff;box-shadow:inset 0 0 0 .5px rgba(255,255,255,.14)}
.cap.plain{height:44px;color:rgba(235,235,245,.75);font-weight:500}
.cap.fill{background:var(--fill);color:var(--tint)}
.cap:disabled{opacity:.4}
.cap svg{width:22px;height:22px}
.gform{width:100%;background:rgba(255,255,255,.08);border-radius:16px;overflow:hidden;text-align:left;box-shadow:inset 0 0 0 .5px rgba(255,255,255,.08)}
.gform label{display:flex;align-items:center;min-height:52px;padding:0 16px;position:relative;gap:12px}
.gform label+label:before{content:'';position:absolute;left:16px;right:0;top:0;height:.5px;background:rgba(255,255,255,.14)}
.gform span{flex:0 0 auto;color:rgba(235,235,245,.6);font-size:15px}
.gform input{flex:1;min-width:0;border:0;background:none;color:#fff;font-size:17px;height:50px}
.gform input::placeholder{color:rgba(235,235,245,.3)}
.gnote{font-size:15px;line-height:20px;padding:12px 14px;border-radius:14px;text-align:left;background:rgba(255,204,0,.14);color:#FFE38A}
.gerr{font-size:15px;line-height:20px;padding:12px 14px;border-radius:14px;text-align:left;background:rgba(255,69,58,.16);color:#FF9F99}
.feat{width:100%;max-width:380px;text-align:left;display:flex;flex-direction:column;gap:20px;margin:30px 0 8px}
.feat div{display:flex;gap:16px;align-items:flex-start}
.feat i{flex:0 0 36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:rgba(127,203,178,.16);color:#9AD8C3}
.feat i svg{width:22px;height:22px}
.feat b{display:block;font-size:17px;font-weight:600;line-height:22px}
.feat small{display:block;color:rgba(235,235,245,.6);font-size:15px;line-height:20px;margin-top:2px}
.steps{width:100%;max-width:380px;background:rgba(255,255,255,.08);border-radius:16px;text-align:left;padding:4px 16px;margin:28px 0 0}
.steps div{display:flex;gap:14px;align-items:center;padding:13px 0;font-size:16px;line-height:21px}
.steps div+div{border-top:.5px solid rgba(255,255,255,.14)}
.steps em{font-style:normal;flex:0 0 28px;height:28px;border-radius:14px;background:rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;font-weight:600;font-size:15px}
.steps svg{display:inline-block;width:18px;height:18px;vertical-align:-3px;margin:0 2px}

/* ---------- navigation bar (top) ---------- */
#nav,.pnav{position:fixed;top:0;left:0;right:0;z-index:20;height:calc(var(--st) + var(--nav));padding:var(--st) 16px 0;display:flex;align-items:center;justify-content:space-between;pointer-events:none}
#nav>*,.pnav>*{pointer-events:auto}
#nav:before,.pnav:before{content:'';position:absolute;left:0;right:0;top:0;height:calc(100% + 18px);z-index:-1;opacity:0;transition:opacity .2s;background:linear-gradient(var(--bg) 0%,color-mix(in srgb,var(--bg) 70%,transparent) 55%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);-webkit-mask-image:linear-gradient(#000 55%,transparent);mask-image:linear-gradient(#000 55%,transparent);pointer-events:none}
#nav.sc:before,.pnav.sc:before{opacity:1}
.ntitle{position:absolute;left:96px;right:96px;bottom:0;height:var(--nav);display:flex;align-items:center;justify-content:center;font-weight:600;font-size:17px;opacity:0;transform:translateY(4px);transition:opacity .18s,transform .18s;pointer-events:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#nav.ti .ntitle,.pnav.ti .ntitle{opacity:1;transform:none}
.nslot{display:flex;gap:10px;align-items:center;min-width:44px}
.gbtn{width:44px;height:44px;border-radius:22px;display:flex;align-items:center;justify-content:center;background:var(--glass);-webkit-backdrop-filter:blur(18px) saturate(1.8);backdrop-filter:blur(18px) saturate(1.8);box-shadow:var(--glass-sh),inset 0 0 0 .5px var(--glass-line);color:var(--label);transition:transform .15s}
.gbtn:active{transform:scale(.92)}
.gbtn svg{width:22px;height:22px}
.gbtn.tint{color:var(--tint)}
.gbtn.solid{background:var(--tint);color:var(--on-tint,#fff);box-shadow:0 6px 18px color-mix(in srgb,var(--tint) 40%,transparent)}
.gbtn:disabled{color:var(--label3)}
.gcap{display:flex;height:44px;border-radius:22px;background:var(--glass);-webkit-backdrop-filter:blur(18px) saturate(1.8);backdrop-filter:blur(18px) saturate(1.8);box-shadow:var(--glass-sh),inset 0 0 0 .5px var(--glass-line)}
.gcap button{width:48px;height:44px;display:flex;align-items:center;justify-content:center;position:relative}
.gcap button svg{width:22px;height:22px}
.gcap button+button:before{content:'';position:absolute;left:0;top:12px;bottom:12px;width:.5px;background:var(--sep)}
.gcap button.on{color:var(--tint)}
.gcap button:active{opacity:.5}

/* ---------- tab screens ---------- */
.tabview{padding:calc(var(--st) + var(--nav)) 0 calc(var(--sb) + 120px);min-height:100vh;transition:transform .45s var(--ease),filter .45s var(--ease)}
.under{transform:translateX(-26%);filter:brightness(.92)}
.lt{font-weight:700;font-size:34px;line-height:41px;letter-spacing:.011em;margin:2px 20px 0}
.ltsub{color:var(--label2);font-size:15px;line-height:20px;margin:2px 20px 0;display:flex;flex-wrap:wrap;gap:6px 8px;align-items:center;min-height:20px}
.ltsub button{color:var(--tint);font-weight:600}
.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--green);margin-right:2px;vertical-align:1px}
.dot.off{background:var(--label3)}.dot.warn{background:var(--orange)}
.mini{width:14px;height:14px;border-radius:50%;border:2px solid var(--fill2);border-top-color:var(--tint);animation:sp .8s linear infinite;display:inline-block;vertical-align:-2px}
@keyframes sp{to{transform:rotate(360deg)}}

/* search */
.sbar{display:flex;align-items:center;gap:12px;margin:14px 16px 0}
.sfield{flex:1;position:relative}
.sfield svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--label2);pointer-events:none}
.sfield input{width:100%;height:40px;border-radius:20px;border:0;background:var(--fill);padding:0 36px 0 38px;font-size:17px;-webkit-appearance:none;appearance:none;outline:none}
.sfield input::placeholder{color:var(--label2)}
.sfield input::-webkit-search-cancel-button{display:none}
.sfield .clr{position:absolute;right:9px;top:50%;transform:translateY(-50%);width:20px;height:20px;border-radius:10px;background:var(--label3);color:var(--bg);display:none;align-items:center;justify-content:center}
.sfield .clr svg{position:static;transform:none;width:12px;height:12px;color:var(--cell)}
.sbar.has .clr{display:flex}
.sbar .cancel{color:var(--tint);font-size:17px;display:none}
.sbar.focus .cancel{display:block}

/* chips */
.chips{display:flex;gap:8px;overflow-x:auto;padding:12px 16px 2px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex:0 0 auto;height:34px;padding:0 15px;border-radius:17px;background:var(--cell);font-size:15px;font-weight:500;display:flex;gap:6px;align-items:center;white-space:nowrap;box-shadow:0 0 0 .5px var(--sep)}
.chip.on{background:var(--label);color:var(--bg);box-shadow:none}
.chip.tok{background:var(--tint);color:var(--on-tint,#fff);box-shadow:none}
.chip.tok svg{width:13px;height:13px}
.chip:active{opacity:.6}

/* section headers + grouped lists */
.gh{display:flex;align-items:baseline;justify-content:space-between;margin:28px 20px 9px;font-weight:700;font-size:20px;line-height:25px;letter-spacing:.01em}
.gh small{font-weight:400;font-size:15px;color:var(--label2);letter-spacing:-.01em}
.gh.sm{font-size:13px;line-height:18px;font-weight:400;color:var(--label2);margin:24px 32px 7px;letter-spacing:0}
.grp{margin:0 16px;background:var(--cell);border-radius:var(--r);overflow:hidden}
.foot{color:var(--label2);font-size:13px;line-height:18px;margin:8px 32px 0}
.row{display:flex;align-items:center;gap:14px;min-height:62px;padding:10px 16px;position:relative;width:100%;text-align:left;color:var(--label)}
button.row:active,a.row:active{background:var(--cell-hi)}
.row+.row:before{content:'';position:absolute;top:0;right:0;left:var(--inset,66px);height:.5px;background:var(--sep)}
.row.kv{min-height:50px;--inset:16px}
.row.act{justify-content:center;gap:0;color:var(--tint);min-height:52px;--inset:16px;font-weight:500}
.row.act:disabled{color:var(--label3)}
.row.plain{--inset:16px;min-height:50px}
.row .tx{flex:1;min-width:0}
.row .t1{display:block;font-size:17px;line-height:22px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.row .t2{display:flex;align-items:center;gap:5px;color:var(--label2);font-size:15px;line-height:20px;margin-top:1px;white-space:nowrap;overflow:hidden}
.row .t2 svg{width:14px;height:14px;flex:0 0 14px}
.row .t2>span{min-width:0;overflow:hidden;text-overflow:ellipsis}
.row .t2>.cap-s{flex:0 0 auto;overflow:visible}
.row .t3{display:block;color:var(--label2);font-size:14px;line-height:19px;margin-top:3px;font-style:italic}
.row .acc{display:flex;align-items:center;gap:6px;color:var(--label2);font-size:15px;flex:0 0 auto;max-width:48%;text-align:right}
.row .acc .v{overflow:hidden;text-overflow:ellipsis}
.row .chev{width:9px;height:15px;color:var(--label3);flex:0 0 9px}
.row.kv .k{flex:0 0 auto;font-size:17px}
.row.kv .v{flex:1;text-align:right;color:var(--label2);font-size:17px;word-break:break-word}
.warn-t{color:var(--orange)!important}.bad-t{color:var(--red)!important}.ok-t{color:var(--green)!important}
.tile{flex:0 0 36px;width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:var(--c,#8D99AE);color:#fff}
.tile svg{width:22px;height:22px}
.tile.lg{width:64px;height:64px;flex-basis:64px;border-radius:17px}
.tile.lg svg{width:36px;height:36px}
.tile.ai{background:linear-gradient(135deg,#FFCC00,#FF9500)}
.cap-s{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 10px;border-radius:12px;font-size:13px;font-weight:600;background:var(--fill);color:var(--label2);white-space:nowrap}
.cap-s svg{width:13px;height:13px}
.cap-s.warn{background:rgba(255,149,0,.15);color:var(--orange)}
.cap-s.bad{background:rgba(255,59,48,.14);color:var(--red)}
.cap-s.ok{background:rgba(52,199,89,.15);color:var(--green)}
.cap-s.ai{background:rgba(255,204,0,.2);color:#B07800}
@media (prefers-color-scheme:dark){.cap-s.ai{color:var(--yellow)}}

/* the wallet strip: identity documents kept on this iPhone */
.wscroll{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 16px 10px;scroll-padding:0 16px;scrollbar-width:none}
.wscroll::-webkit-scrollbar{display:none}
.wcard{flex:0 0 min(306px,78vw);aspect-ratio:1.586;border-radius:20px;position:relative;overflow:hidden;color:#fff;text-align:left;scroll-snap-align:start;padding:16px 18px;display:flex;flex-direction:column;background:var(--rose) right bottom/100% 100% no-repeat,linear-gradient(150deg,var(--g1),var(--g2));box-shadow:0 12px 26px -12px var(--g2),inset 0 0 0 .5px rgba(255,255,255,.14);transition:transform .2s var(--ease)}
.wcard:active{transform:scale(.97)}
.wcard:after{content:'';position:absolute;inset:0;background:radial-gradient(120% 80% at 0% 0%,rgba(255,255,255,.2),transparent 55%);pointer-events:none}
.wcard .wt{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:600;color:rgba(255,255,255,.78);letter-spacing:.02em}
.wcard .wt svg{width:18px;height:18px;opacity:.85}
.wcard .wn{font-size:24px;line-height:28px;font-weight:700;margin-top:auto;letter-spacing:.005em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wcard .wb{display:flex;justify-content:space-between;align-items:flex-end;margin-top:10px}
.wcard .wl{font-size:11px;font-weight:600;color:rgba(255,255,255,.62);letter-spacing:.03em}
.wcard .wd{font-size:16px;font-weight:600;font-variant-numeric:tabular-nums}
.wcard .ws{height:26px;padding:0 10px;border-radius:13px;display:flex;align-items:center;gap:5px;font-size:13px;font-weight:600;background:rgba(255,255,255,.2);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.wcard .ws i{width:7px;height:7px;border-radius:50%;background:#FFD60A}
.wcard .ws.bad i{background:#FF6961}

/* countdown tile (Expiring) */
.cd{flex:0 0 52px;width:52px;height:52px;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--fill);color:var(--label)}
.cd b{font-size:20px;line-height:22px;font-weight:700;font-variant-numeric:tabular-nums}
.cd small{font-size:10px;line-height:12px;font-weight:600;color:var(--label2);text-transform:none}
.cd.bad{background:rgba(255,59,48,.14);color:var(--red)}.cd.bad small{color:var(--red)}
.cd.warn{background:rgba(255,149,0,.15);color:var(--orange)}.cd.warn small{color:var(--orange)}
.cd.cal{background:var(--cell);box-shadow:inset 0 0 0 .5px var(--sep);overflow:hidden;justify-content:flex-start}
.cd.cal small{display:block;width:100%;background:var(--red);color:#fff;text-align:center;padding:2px 0;font-size:10px}
.cd.cal b{font-size:17px;margin-top:6px}

/* empty states */
.empty{text-align:center;padding:56px 32px;color:var(--label2);font-size:15px;line-height:20px}
.empty svg{width:56px;height:56px;margin:0 auto 14px;color:var(--label3)}
.empty b{display:block;color:var(--label);font-size:20px;line-height:25px;font-weight:700;margin-bottom:6px}

/* ---------- floating tab bar ---------- */
#tabbar{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(var(--sb) + 8px);z-index:25;width:min(calc(100% - 24px),440px);height:62px;border-radius:31px;display:grid;grid-template-columns:repeat(5,1fr);padding:4px;background:var(--glass);-webkit-backdrop-filter:blur(20px) saturate(1.8);backdrop-filter:blur(20px) saturate(1.8);box-shadow:var(--glass-sh),inset 0 0 0 .5px var(--glass-line)}
#tabbar .tpill{position:absolute;top:4px;bottom:4px;left:4px;width:calc((100% - 8px)/5);border-radius:27px;background:var(--fill);transition:transform .38s var(--ease)}
#tabbar button{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:10.5px;font-weight:600;letter-spacing:0;color:var(--label)}
#tabbar button svg{width:25px;height:25px}
#tabbar button.on{color:var(--tint)}
#tabbar .bdg{position:absolute;top:5px;left:calc(50% + 6px);min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--red);color:#fff;font-size:12px;line-height:18px;font-weight:600;text-align:center}
.bfade{position:fixed;left:0;right:0;bottom:0;height:calc(var(--sb) + 96px);background:linear-gradient(transparent,color-mix(in srgb,var(--bg) 82%,transparent) 60%);pointer-events:none;z-index:24}

/* pull to refresh */
.ptr{position:fixed;left:50%;top:calc(var(--st) + var(--nav) + 2px);z-index:19;width:28px;height:28px;margin-left:-14px;opacity:0;pointer-events:none;color:var(--label2)}
.ptr svg{width:28px;height:28px}
.ptr.run svg{animation:sp8 .8s steps(8) infinite}
@keyframes sp8{to{transform:rotate(360deg)}}

/* ---------- pushed page (document) ---------- */
.push{position:fixed;inset:0;z-index:40;background:var(--bg);transform:translateX(100%);transition:transform .45s var(--ease);box-shadow:-12px 0 32px rgba(0,0,0,.14);will-change:transform}
.push.in{transform:none}
.push.drag{transition:none}
.pscroll{position:absolute;inset:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:calc(var(--st) + var(--nav)) 0 calc(var(--sb) + 40px)}
.pnav{position:absolute;z-index:3}
.pnav .ntitle{left:70px;right:70px}
.shade{position:fixed;inset:0;z-index:39;background:#000;opacity:0;pointer-events:none;transition:opacity .45s var(--ease)}
.shade.on{opacity:.12}
.dh{text-align:center;padding:4px 24px 0;display:flex;flex-direction:column;align-items:center}
.dh h1{font-size:24px;line-height:30px;font-weight:700;margin:14px 0 2px;letter-spacing:.005em}
.dh .ds{color:var(--label2);font-size:15px;line-height:20px}
.dh .caps{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin-top:10px}
.pages{display:flex;flex-direction:column;gap:12px;align-items:center;margin:22px 16px 0}
.pages img{width:100%;height:auto;background:#fff;border-radius:10px;box-shadow:0 1px 2px rgba(0,0,0,.08),0 10px 30px -10px rgba(0,0,0,.25)}
.pages img.photo{border-radius:16px}
.loading{display:flex;align-items:center;justify-content:center;gap:10px;color:var(--label2);padding:48px 0;font-size:15px}
.msg{background:var(--cell);border-radius:var(--r);padding:24px 20px;text-align:center;width:100%}
.msg b{display:block;font-size:17px;margin-bottom:4px}
.msg span{color:var(--label2);font-size:15px;line-height:20px}
.notes{padding:14px 16px;font-size:16px;line-height:22px;color:var(--label);white-space:pre-wrap}

/* iOS switch */
.sw{-webkit-appearance:none;appearance:none;flex:0 0 51px;width:51px;height:31px;border-radius:16px;background:var(--fill2);position:relative;transition:background .25s;margin:0;cursor:pointer}
.sw:before{content:'';position:absolute;top:2px;left:2px;width:27px;height:27px;border-radius:50%;background:#fff;box-shadow:0 3px 8px rgba(0,0,0,.15),0 3px 1px rgba(0,0,0,.06);transition:transform .25s var(--ease)}
.sw:checked{background:var(--green)}
.sw:checked:before{transform:translateX(20px)}
.sw:disabled{opacity:.45}

/* ---------- page sheet (Add documents) ---------- */
.sbg{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.32);opacity:0;transition:opacity .4s var(--ease)}
.sbg.on{opacity:1}
.sheet{position:fixed;left:0;right:0;bottom:0;top:calc(var(--st) + 12px);z-index:61;background:var(--bg);border-radius:34px 34px 0 0;display:flex;flex-direction:column;transform:translateY(105%);transition:transform .45s var(--ease);box-shadow:0 -10px 40px rgba(0,0,0,.18);overflow:hidden}
.sheet.in{transform:none}
.sheet.drag{transition:none}
.shh{position:relative;display:flex;align-items:center;justify-content:space-between;padding:18px 16px 8px;touch-action:none}
.shh:before{content:'';position:absolute;top:6px;left:50%;width:36px;height:5px;margin-left:-18px;border-radius:3px;background:var(--label3)}
.shh h2{position:absolute;left:70px;right:70px;text-align:center;margin:0;font-size:17px;font-weight:600;pointer-events:none}
.shb{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:8px 0 calc(var(--sb) + 30px)}
.pick{margin:8px 16px 0;background:var(--cell);border-radius:var(--r);padding:28px 20px 20px;text-align:center}
.pick .tile{margin:0 auto 14px}
.pick b{display:block;font-size:20px;line-height:25px;font-weight:700}
.pick p{color:var(--label2);font-size:15px;line-height:20px;margin:6px 0 18px}
.ring{width:28px;height:28px;flex:0 0 28px;color:var(--tint)}
.ring circle{fill:none;stroke-width:3}
.ring .bgc{stroke:var(--fill2)}
.ring .fg{stroke:currentColor;stroke-linecap:round;transform:rotate(-90deg);transform-origin:50% 50%;transition:stroke-dasharray .3s}
.ok-ic{width:26px;height:26px;border-radius:13px;background:var(--green);color:#fff;display:flex;align-items:center;justify-content:center;flex:0 0 26px}
.ok-ic svg{width:15px;height:15px}
.ftile{flex:0 0 36px;width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:var(--fill);color:var(--label2)}
.ftile svg{width:20px;height:20px}

/* ---------- pull-down menu (filter) ---------- */
.mbg{position:fixed;inset:0;z-index:70}
.menu{position:fixed;z-index:71;right:16px;top:calc(var(--st) + var(--nav) + 4px);width:260px;max-height:70vh;overflow-y:auto;border-radius:22px;background:var(--menu);-webkit-backdrop-filter:blur(28px) saturate(1.8);backdrop-filter:blur(28px) saturate(1.8);box-shadow:0 18px 50px rgba(0,0,0,.22),inset 0 0 0 .5px var(--glass-line);transform-origin:top right;animation:pop .32s var(--ease);padding:6px 0}
@keyframes pop{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
.menu button{display:flex;align-items:center;gap:12px;width:100%;padding:10px 16px;font-size:17px;text-align:left;min-height:44px}
.menu button:active{background:var(--fill)}
.menu .ck{width:18px;flex:0 0 18px;color:var(--label)}
.menu .ck svg{width:16px;height:16px}
.menu .mt{flex:1}
.menu .mi{width:24px;height:24px;border-radius:7px;flex:0 0 24px;display:flex;align-items:center;justify-content:center;color:#fff;background:var(--c)}
.menu .mi svg{width:15px;height:15px}
.menu hr{border:0;height:6px;background:var(--fill);margin:6px 0}
.menu .mh{font-size:13px;color:var(--label2);padding:6px 16px 2px}
/* 0.93.0: + menu: Read with AI switch and the offline note */
.menu .msw{display:flex;align-items:center;gap:12px;padding:8px 12px 8px 16px;font-size:17px;min-height:44px;border-top:6px solid var(--fill);margin-top:6px;cursor:pointer}
.menu .msw .sw{flex:0 0 51px}
.menu .moff{font-size:13px;line-height:18px;color:var(--label2);padding:8px 16px 10px;border-bottom:6px solid var(--fill);margin-bottom:6px}
.menu .moff b{color:var(--label);font-weight:600}
.ltsub button+button{margin-left:10px}
.sheet #uqw .uhd{margin-top:14px}

/* toast: drops from the top like a system banner */
.toast{position:fixed;left:0;right:0;margin:0 auto;width:fit-content;top:calc(var(--st) + 8px);z-index:300;transform:translateY(-160%);display:flex;align-items:center;gap:10px;max-width:calc(100% - 32px);padding:12px 18px 12px 14px;border-radius:26px;background:var(--glass);-webkit-backdrop-filter:blur(24px) saturate(1.8);backdrop-filter:blur(24px) saturate(1.8);box-shadow:0 12px 34px rgba(0,0,0,.18),inset 0 0 0 .5px var(--glass-line);font-size:15px;line-height:20px;font-weight:500;transition:transform .45s var(--ease)}
.toast.in{transform:none}
.toast{touch-action:none} /* 0.93.0: swipe it up to close */
.toast i{flex:0 0 24px;width:24px;height:24px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:var(--green);color:#fff}
.toast i svg{width:14px;height:14px}
.toast.err i{background:var(--red)}

/* entrance after Face ID: the one orchestrated moment */
.enter .tabview{animation:enter .55s var(--ease)}
.enter #tabbar{animation:enterbar .6s var(--ease)}
@keyframes enter{from{opacity:0;transform:scale(.965)}to{opacity:1;transform:none}}
@keyframes enterbar{from{opacity:0;transform:translate(-50%,24px)}to{opacity:1;transform:translateX(-50%)}}

@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* 1.15.0: pages (front + back in one document) */
.cap.sm{height:38px;border-radius:19px;font-size:15px;width:auto;padding:0 16px}
.pairb{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
/* 0.4.0 unlock sheet */
.lkx{padding:18px 0 30px}.lkx .grp{margin:22px 16px 0}.fpw{flex:1;width:100%;height:48px;border:0;background:none;font-size:17px;outline:none;color:var(--label)}.lkb{padding:18px 16px 0}
/* 0.6.0: Send or Share */
.row .ck{flex:0 0 22px;width:22px;color:var(--tint)}.row .ck svg{width:20px;height:20px}
/* 0.8.0: Ask */
.qa{margin:18px 16px 0}.qq{margin-left:auto;max-width:82%;width:fit-content;background:var(--tint);color:var(--on-tint,#fff);border-radius:18px 18px 4px 18px;padding:9px 14px;font-size:16px;line-height:21px}
.aa{margin-top:8px;max-width:90%;width:fit-content;background:var(--cell);border-radius:18px 18px 18px 4px;padding:11px 15px;font-size:16px;line-height:22px}.aa.err{color:var(--red)}
.cite{display:inline-flex;align-items:center;height:24px;padding:0 10px;margin:2px 2px;border-radius:12px;background:rgba(232,83,47,.14);color:var(--tint);font-size:14px;font-weight:600}
.pill{flex:0 0 auto;margin-left:10px;border:0;border-radius:15px;padding:6px 14px;font-family:inherit;font-weight:600;font-size:15px;line-height:18px;background:color-mix(in srgb,var(--red,#FF3B30) 14%,transparent);color:var(--red,#FF3B30)}.pill:disabled{opacity:.45}

/* 0.13.0 Settings tab */
/* initials on a colour tile (account, emergency contacts) */
.tile.av{font-size:15px;font-weight:600;letter-spacing:.02em}
.row .tile.av[style*="52px"]{font-size:20px}
/* the recovery code, big enough to copy by hand */
.rcode{margin:22px 16px 0;padding:18px 12px;border-radius:14px;background:var(--cell);font:600 clamp(14px,4.3vw,19px)/1.5 ui-monospace,Menlo,monospace;letter-spacing:0;text-align:center;white-space:nowrap;overflow-x:auto;-webkit-user-select:all;user-select:all;color:var(--label)}
.pill.nt{background:color-mix(in srgb,var(--tint,#007AFF) 14%,transparent);color:var(--tint,#007AFF)}
.pill+.pill{margin-left:6px}

/* 0.15.0: edit details, renewal-step edit mode */
[hidden]{display:none!important}
.fv{flex:1;min-width:0;height:48px;border:0;background:none;font:inherit;font-size:17px;text-align:right;color:var(--label2);outline:none;-webkit-appearance:none;appearance:none;margin-left:12px}
select.fv{direction:rtl;text-align-last:right}select.fv option{direction:ltr}
input.fv[type=date]{display:flex;justify-content:flex-end;min-height:48px}input.fv[type=date]::-webkit-date-and-time-value{text-align:right}
.fnote{display:block;width:100%;min-height:104px;border:0;background:none;font:inherit;font-size:17px;line-height:22px;padding:12px 16px;color:var(--label);resize:vertical;outline:none;box-sizing:border-box}
.ghx{display:flex;align-items:baseline;gap:8px}.ghx span{flex:1;min-width:0}.ghb{border:0;background:none;padding:0 2px;font:inherit;font-size:15px;font-weight:500;color:var(--tint);text-transform:none;letter-spacing:0}
.lkx .grp+.grp{margin-top:22px}

/* 0.22.0 Household: small text buttons at the end of a row */
.row .lnk{flex:0 0 auto;background:none;border:0;color:var(--tint);font:inherit;font-size:15px;padding:10px 0 10px 12px;cursor:pointer}
.row .lnk:disabled{color:var(--label3)}
/* 0.26.0: Select (archive, restore, delete, move several) and Move to… */
.ltrow{display:flex;align-items:flex-end;justify-content:space-between;gap:10px}
.ltrow .lt{min-width:0;overflow-wrap:anywhere}
.dhrow{display:flex;align-items:flex-end;justify-content:space-between;gap:10px}.dhrow .gh{flex:1;min-width:0}.dhrow .ltsel{margin-bottom:4px}
.ltsel{flex:0 0 auto;margin:0 20px 5px 0;height:32px;padding:0 15px;border-radius:16px;background:var(--fill);color:var(--tint);font-size:15px;font-weight:600}
.gbtn.txt{width:auto;padding:0 16px;font-size:17px;color:var(--tint);white-space:nowrap}.gbtn.txt.b{font-weight:600}.gbtn.txt:disabled{opacity:.4}
.selmode #nav .ntitle{opacity:1;transform:none}
.row.selrow{--inset:104px}
.row .selck{flex:0 0 24px;width:24px;height:24px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--label3);display:flex;align-items:center;justify-content:center;color:#fff;transition:background .15s}
.row.on .selck{background:var(--tint);box-shadow:none;color:var(--on-tint,#fff)}
.row .selck svg{width:15px;height:15px}
.selmode #tabbar{display:none}
#selbar{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(var(--sb) + 8px);z-index:25;width:min(calc(100% - 40px),370px);height:62px;border-radius:31px;display:grid;grid-template-columns:repeat(3,1fr);padding:4px;background:var(--glass);-webkit-backdrop-filter:blur(20px) saturate(1.8);backdrop-filter:blur(20px) saturate(1.8);box-shadow:var(--glass-sh),inset 0 0 0 .5px var(--glass-line)}
#selbar button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:10.5px;font-weight:600;color:var(--tint);border-radius:27px}
#selbar button svg{width:25px;height:25px}
#selbar button.bad{color:var(--red)}
#selbar button:disabled{opacity:.35}
.mvrow{min-height:54px}.mvind{flex:0 0 auto;display:block;margin-right:-14px}
.mvnote{margin:14px 16px 0;padding:12px 14px;border-radius:14px;background:var(--tint-fill);font-size:15px;line-height:20px}
/* 0.28.0 Essentials */
.ess-n{font-size:13px;font-weight:600;opacity:.6}
.ess-score{display:flex;gap:18px;align-items:center;padding:16px}
.ess-big{display:flex;flex-direction:column;align-items:center;min-width:64px}
.ess-big b{font-size:40px;line-height:1;font-weight:700;letter-spacing:-.02em}
.ess-big span{font-size:13px;color:var(--label2);margin-top:4px}
.ess-r{flex:1;min-width:0}
.ess-t{font-size:17px;font-weight:600}
.ess-bar{height:8px;border-radius:4px;background:var(--fill);margin:10px 0 8px;overflow:hidden}
.ess-bar i{display:block;height:100%;border-radius:4px;background:#34C759}
.ess-s{font-size:14px;color:var(--label2)}
.ess-skip{background:none;border:0;padding:0;font:inherit;color:var(--tint);cursor:pointer}
.chips+.grp{margin-top:12px}

/* 0.31.0 numbers hidden on screen */
.numrow{padding-top:0;padding-bottom:0;gap:0;padding-right:4px}.numrow .numcp{flex:1;display:flex;align-items:center;gap:14px;min-width:0;min-height:50px;border:0;background:none;padding:0;font:inherit;color:inherit;text-align:left;cursor:pointer}.numrow .v{font-variant-numeric:tabular-nums;letter-spacing:.2px;user-select:none;-webkit-user-select:none}.numrow .cpi{display:grid;color:var(--label3)}.numrow .cpi svg{width:17px;height:17px}.numeye{border:0;background:none;width:44px;height:44px;display:grid;place-items:center;color:var(--tint);cursor:pointer;flex:0 0 auto}.numeye svg{width:22px;height:22px}.numrow .numcp:active{opacity:.55}
.fv[data-hn]:not(:focus){-webkit-text-security:disc}

/* 0.33.0 Lighter */
.tile:not(.ai):not(.lg):not(.av):not(.phtile){background:color-mix(in srgb,var(--c,#8D99AE) 14%,transparent);color:var(--c,#8D99AE)}
@media (prefers-color-scheme:dark){.tile:not(.ai):not(.lg):not(.av):not(.phtile){background:color-mix(in srgb,var(--c,#8D99AE) 26%,transparent);color:color-mix(in srgb,var(--c,#8D99AE) 58%,#fff)}}
.tile[style*="#C7C7CC"]:not(.ai):not(.lg):not(.av){color:#8E8E93}
@media (prefers-color-scheme:dark){.tile[style*="#C7C7CC"]:not(.ai):not(.lg):not(.av){color:#AEAEB2}}

/* 0.33.2 document pictures */
.dpic{position:relative;flex:0 0 42px;width:42px;height:54px}
.dpf{display:block;width:100%;height:100%;border-radius:6px;overflow:hidden;box-shadow:0 0 0 .5px rgba(0,0,0,.16),0 1px 3px rgba(0,0,0,.10)}
.dpf svg{display:block;width:100%;height:100%}
.dpb{position:absolute;right:-5px;bottom:-4px;width:20px;height:20px;border-radius:6px;background:var(--c,#8D99AE);background:var(--c,#8D99AE);color:var(--cf,#fff);display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 2px var(--cell)}
.dpb svg{width:13px;height:13px}
button.row:active .dpb{box-shadow:0 0 0 2px var(--cell-hi)}
.dpic.lg{flex:0 0 auto;width:62px;height:80px}
.dpic.lg .dpf{border-radius:8px}
.dpic.lg .dpb{width:28px;height:28px;border-radius:8px;right:-7px;bottom:-6px;box-shadow:0 0 0 3px var(--bg)}
.dpic.lg .dpb svg{width:18px;height:18px}
.row:has(>.dpic){--inset:72px}
.row.selrow:has(>.dpic){--inset:110px}
@media (prefers-color-scheme:dark){.dpf{filter:brightness(.9)}}

/* 0.35.2: the Add Documents sheet — filed rows open the document and have a bin; new documents glow in the list */
.urow{padding:0;gap:0}
.urow .uopen{display:flex;align-items:center;gap:14px;flex:1;min-width:0;min-height:62px;padding:10px 4px 10px 16px;text-align:left;color:var(--label);background:none;border:0;font:inherit}
.urow .uopen:active{background:var(--fill)}
.urow .ubin{flex:0 0 52px;align-self:stretch;display:flex;align-items:center;justify-content:center;color:var(--red);background:none;border:0}
.urow .ubin svg{width:22px;height:22px}
.urow .ubin:active{opacity:.5}
.uhd{padding-bottom:22px}
.row.newdoc{animation:dvnew 4.2s ease-out}
@keyframes dvnew{0%,45%{background:color-mix(in srgb,var(--tint) 18%,transparent)}100%{background:transparent}}
@media (prefers-reduced-motion:reduce){.row.newdoc{animation:none;background:color-mix(in srgb,var(--tint) 12%,transparent)}}

/* 0.38.0 "Same document?": two documents side by side */
.cmp{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:6px 16px 18px}
.cmpc{display:flex;flex-direction:column;align-items:stretch;text-align:center;gap:6px;min-width:0}
.cmpi{height:170px;border-radius:14px;background:var(--bg2,#fff);display:flex;align-items:center;justify-content:center;overflow:hidden;box-shadow:0 0 0 .5px rgba(0,0,0,.08)}
.cmpi img{max-width:100%;max-height:100%;object-fit:contain}
.cmpt{font-weight:600;font-size:15px;line-height:1.25;overflow-wrap:anywhere}
.cmpd{font-size:13px;line-height:1.4;color:var(--label2)}
.cmpc .cap{margin-top:auto}

/* 0.39.0 Show at the Counter */
.ctrbtn{margin-top:12px}
.ctr{position:fixed;inset:0;z-index:5000;background:#fff;color:#000;display:flex;flex-direction:column;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom)}
.ctrh{display:flex;align-items:center;gap:8px;padding:8px 12px}
.ctrt{flex:1;text-align:center;font-weight:600;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ctrb{flex:1;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:8px;min-height:0}
.ctrb img{max-width:100%;max-height:100%;object-fit:contain}
.ctrb.rot img{transform:rotate(90deg)} /* review: its size is set from the box (safe areas, bars) */
body.ctron .toast{z-index:5100} /* review: "Number copied" shows above it */
.ctrf{padding:6px 16px 14px;display:flex;flex-direction:column;gap:10px;align-items:stretch}
.ctrf .cap{align-self:center}
.ctrf .grp{margin:0}

/* 0.41.0 pinned, person card, undo */
.pins{display:flex;gap:10px;overflow-x:auto;padding:2px 16px 6px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
.pin{flex:0 0 92px;display:flex;flex-direction:column;align-items:center;gap:6px;background:var(--bg2,#fff);border:0;border-radius:14px;padding:10px 6px;font:inherit;color:inherit;scroll-snap-align:start;box-shadow:0 0 0 .5px rgba(0,0,0,.06)}
.pint{font-size:12px;line-height:1.25;text-align:center;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;width:100%}
.pav{flex:0 0 40px;width:40px;height:40px;border-radius:20px;background:var(--tint,#245852);color:var(--on-tint,#fff);font-weight:700;font-size:18px;display:flex;align-items:center;justify-content:center;margin-right:12px}
.dsp{background:none;border:0;padding:0;font:inherit;color:var(--tint,#245852)}
.toast.undo ~ .toast{top:calc(var(--st) + 82px)}
.toast.undo .undob{margin-left:10px;background:none;border:0;color:var(--tint,#245852);font:inherit;font-weight:600;padding:4px 6px;min-width:52px}
/* 0.40.0 detail rows copy with a tap */
.row.kvcp{width:100%;text-align:left;font:inherit;color:inherit;background:none;border:0}
.row.kvcp .cpi{margin-left:8px;color:var(--label3,#C7C7CC);display:inline-flex}
.row.kvcp .cpi svg{width:16px;height:16px}
.row.kvcp:active{background:var(--fill,rgba(120,120,128,.12))}

/* 0.44.0: on a wide screen (iPhone Duo open) a card-shaped picture is at most 52% of the screen tall */
@media (min-width:600px){.pages img.wide{width:min(100%,calc(52vh * var(--r,1.586)));height:auto}}

/* 0.45.0: one-time notifications sheet */
.pa-hero{display:flex;justify-content:center;padding-top:6px;color:var(--tint)}.pa-hero svg{width:60px;height:60px}.pa-t{text-align:center;font-size:22px;line-height:28px;font-weight:700;margin:12px 24px 0;color:var(--label)}.pa-x .foot.pa-f{text-align:center;margin:10px 28px 0}.pa-x .cap.plain{color:var(--tint);font-weight:600}

/* 0.50.1: Show at the Counter and Pin to Top side by side under the title, above the picture */
.dact{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:12px}
.dact>div{display:contents}
.dact .ctrbtn{margin-top:0}
.dact:not(:has(button)){display:none}
.pinbtn svg{width:18px;height:18px}
.pinbtn.on{background:var(--tint-fill)}

/* 0.54.0 Usage */
.ustiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:16px 6px 4px}
.ustiles div{display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;min-width:0}
.ustiles b{font-size:26px;line-height:32px;font-weight:700;font-variant-numeric:tabular-nums}
.ustiles span{font-size:12px;line-height:15px;color:var(--label2)}
.usbars{display:flex;align-items:flex-end;gap:3px;height:64px;padding:12px 16px 0}
.usbars i{flex:1;min-width:0;border-radius:3px 3px 1px 1px;background:var(--tint)}
.usbars i.z{background:var(--fill2)}
.uscap{display:flex;justify-content:space-between;gap:8px;font-size:12px;line-height:16px;color:var(--label2);padding:6px 16px 12px;margin:0}
.uscap span:nth-child(2){text-align:center}
.uspc{color:var(--label2);font-weight:400}

/* 0.62.0 C5: Filter inside the search field */
.sfield .sflt{position:absolute;right:5px;top:50%;transform:translateY(-50%);width:32px;height:32px;border:0;border-radius:16px;background:none;color:var(--label2);display:flex;align-items:center;justify-content:center;padding:0}
.sfield .sflt.on{color:var(--tint)}
.sfield .sflt svg{position:static;transform:none;width:19px;height:19px;pointer-events:none}
.sbar.has .sflt{display:none}

/* 0.62.0 review: no filter while selecting */
.selmode .sfield .sflt{display:none}

/* 0.65.0 Settings: the owner's Admin group on a navy tint; states on the right of each row */
.grp.adm{background:color-mix(in srgb,#1B2A4A 9%,var(--cell))}
@media (prefers-color-scheme:dark){.grp.adm{background:color-mix(in srgb,#9DB4E6 12%,var(--cell))}}

/* 0.68.0: Combine in the Select bar (4 buttons) and its sheet */
#selbar.c4{grid-template-columns:repeat(4,1fr)}
.cbr .cbn{width:24px;height:24px;border-radius:12px;flex:none;display:grid;place-items:center;background:var(--tint-fill);color:var(--tint);font-size:13px;font-weight:700}
.cbm{display:flex;gap:6px;flex:none;margin-left:6px}
.cbm button{width:34px;height:34px;border-radius:17px;display:grid;place-items:center;color:var(--tint);background:var(--fill)}
.cbm button:disabled{opacity:.3}
.cbm svg{width:18px;height:18px}
/* 0.88.0 What's New */
.newdot{display:inline-block;width:10px;height:10px;border-radius:5px;background:#FF3B30;vertical-align:middle}
.chgr{align-items:flex-start;padding-top:12px;padding-bottom:12px}.chgl{margin:6px 0 2px;padding-left:18px;color:var(--label2);font-size:15px;line-height:1.4;white-space:normal}.chgl li{margin:4px 0}
/* 0.96.0 Skellig: the light category colours (amber #F59E4C, sand #FFCB7A) take dark ink so the glyph stays readable */
.menu .mi[style*="#FFCB7A" i],.menu .mi[style*="#F59E4C" i]{color:#1C2B44}
@media (prefers-color-scheme:light){.tile:not(.ai):not(.lg):not(.av)[style*="#FFCB7A" i],.tile:not(.ai):not(.lg):not(.av)[style*="#F59E4C" i]{color:#8A4E0F}}

/* 0.99.0: Lock A, the sunset over the rock (lock + password screens); other gate screens in Skellig navy */
.gate{background:radial-gradient(120% 60% at 50% -10%,#2A3D5C 0%,#1C2B44 45%,#15213A 100%)}
.gate.sky{background:linear-gradient(180deg,#E8532F 0%,#F07A3E 22%,#F59E4C 42%,#FFCB7A 62%,#FFE3A3 78%);color:#1C2B44;overflow-x:hidden;padding-bottom:0}
.gate.sky h1{color:#1C2B44;margin-top:30px;font-size:30px;line-height:36px;letter-spacing:-.01em}
.gate.sky .sub{color:#0F1724}
.gscene{flex:1 1 0;min-height:0;width:calc(100% + 48px);margin:16px -24px 0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 390 230'%3E%3Cdefs%3E%3CradialGradient id='g'%3E%3Cstop offset='0' stop-color='%23FFE3A3' stop-opacity='.75'/%3E%3Cstop offset='1' stop-color='%23FFE3A3' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Ccircle cx='290' cy='112' r='96' fill='url(%23g)'/%3E%3Ccircle cx='290' cy='112' r='46' fill='%23FFE3A3'/%3E%3Cg transform='translate(-30.5 -36) scale(3.41)'%3E%3Cpath d='M6 78 L14 71 L19 58 L23 39 L26 37.5 L28.5 41 L34.5 34 L40.5 25.5 L44.5 20 L46.5 21 L48.5 15.5 L51 14 L53.5 17 L57 28.5 L59.5 26 L62 22.5 L64.5 26 L68 35 L73 43 L80 55 L87 66 L94 77 L94 78 Z' fill='%2317393A'/%3E%3Cpath d='M51 14 L53.5 17 L57 28.5 L52 50 L47 34 Z' fill='%232C6B64'/%3E%3Cpath d='M62 22.5 L64.5 26 L68 35 L73 43 L80 55 L66 56 L60 40 L59.5 26 Z' fill='%23245852'/%3E%3Cpath d='M6 78 L14 71 L19 58 L23 39 L26 37.5 L28.5 41 L34.5 34 L40.5 25.5 L44.5 20 L46.5 21 L48.5 15.5 L51 14 L47 34 L52 50 L44 78 Z' fill='%234FA08A'/%3E%3Cpath d='M34.5 34 L40.5 25.5 L44.5 20 L46.5 21 L48.5 15.5 L51 14 L49 22 L44 27 L39 33 Z' fill='%238FD0B3'/%3E%3C/g%3E%3C/svg%3E") left bottom/auto min(100%,250px) no-repeat}
.gate.sky .stack{color:#fff;position:relative;isolation:isolate;max-width:none;padding:30px 0 calc(var(--sb) + 24px)}
.gate.sky .stack>*{width:100%;max-width:380px;align-self:center}
.gate.sky .stack::before{content:'';position:absolute;z-index:-1;top:0;bottom:0;left:-24px;right:-24px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 14'%3E%3Cpath d='M0 7 q8 -6 16 0 t16 0' fill='none' stroke='%23FFFFFF' stroke-opacity='.35' stroke-width='2'/%3E%3C/svg%3E") 0 10px/32px 14px repeat-x,linear-gradient(180deg,#1C2B44 0%,#15213A 100%)}
.gate.sky .fid{width:96px;height:96px;margin:0 auto 10px;border-radius:30px;color:#FFE3A3;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
.gate.sky .stack>.fid{width:96px}
.gate.sky .fid svg{width:56px;height:56px}
.gate.sky .cap.plain{color:#FFFFFF}
html.g,html.g body{background:#15213A}
html.g.sky{background:linear-gradient(#E8532F 50%,#15213A 50%)}html.g.sky body{background:transparent}

/* 0.99.1: Touch 3, the sunset horizon on the Documents home (scrolls away with the page); teal selection */
.tabview.home{padding-top:0}
.hz{position:relative;isolation:isolate;overflow:hidden;min-height:calc(var(--st) + 314px);box-sizing:border-box;padding:calc(var(--st) + var(--nav) + 10px) 0 74px;background:linear-gradient(180deg,#E8532F 0%,#F07A3E 34%,#F59E4C 62%,#FFCB7A 92%);color:#1C2B44}
.hz:after{content:'';position:absolute;z-index:-1;left:0;right:0;bottom:0;height:62px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 12'%3E%3Cpath d='M0 6 q6 -5 12 0 t12 0' fill='none' stroke='%23FFFFFF' stroke-opacity='.4' stroke-width='1.6'/%3E%3C/svg%3E") 0 8px/24px 12px repeat-x,#1C2B44}
.hzsc{position:absolute;z-index:-1;right:0;bottom:56px;width:194px;height:140px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 194 140'%3E%3Cdefs%3E%3CradialGradient id='g'%3E%3Cstop offset='0' stop-color='%23FFE3A3' stop-opacity='.7'/%3E%3Cstop offset='1' stop-color='%23FFE3A3' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Ccircle cx='130' cy='46' r='42' fill='url(%23g)'/%3E%3Ccircle cx='130' cy='46' r='27' fill='%23FFE3A3'/%3E%3Cg transform='translate(-7.4 -10.2) scale(1.848)'%3E%3Cpath d='M6 78 L14 71 L19 58 L23 39 L26 37.5 L28.5 41 L34.5 34 L40.5 25.5 L44.5 20 L46.5 21 L48.5 15.5 L51 14 L53.5 17 L57 28.5 L59.5 26 L62 22.5 L64.5 26 L68 35 L73 43 L80 55 L87 66 L94 77 L94 78 Z' fill='%2317393A'/%3E%3Cpath d='M51 14 L53.5 17 L57 28.5 L52 50 L47 34 Z' fill='%232C6B64'/%3E%3Cpath d='M62 22.5 L64.5 26 L68 35 L73 43 L80 55 L66 56 L60 40 L59.5 26 Z' fill='%23245852'/%3E%3Cpath d='M6 78 L14 71 L19 58 L23 39 L26 37.5 L28.5 41 L34.5 34 L40.5 25.5 L44.5 20 L46.5 21 L48.5 15.5 L51 14 L47 34 L52 50 L44 78 Z' fill='%234FA08A'/%3E%3Cpath d='M34.5 34 L40.5 25.5 L44.5 20 L46.5 21 L48.5 15.5 L51 14 L49 22 L44 27 L39 33 Z' fill='%238FD0B3'/%3E%3C/g%3E%3C/svg%3E") right bottom/contain no-repeat}
.hzg{margin:0 20px 2px;font-size:16px;line-height:20px;font-weight:600;color:#0F1724}
.hz .lt{color:#1C2B44}
.hz .ltsub{color:#0F1724;max-width:calc(100% - 214px);min-width:150px}
.hz .ltsub button{color:#1C2B44;text-decoration:underline;text-underline-offset:2px}
.hz .ltsub .dot{box-shadow:0 0 0 1.5px rgba(255,255,255,.7)}
.hzd:empty{display:none}
.hzsheet{position:relative;height:28px;margin-top:-28px;border-radius:28px 28px 0 0;background:var(--bg)}
.hzsheet+#eaban:empty+.sbar{margin-top:0}
#nav.hzon .gbtn,#nav.hzon .gcap{background:rgba(255,255,255,.82);color:#1C2B44}
#nav.hzon:before{opacity:0}
.chip.on{background:var(--tint);color:var(--on-tint,#fff)}
#tabbar .tpill{background:var(--tint-fill)}
@media (prefers-color-scheme:light){.lt,.gh{color:#1C2B44}}
@media (max-width:359px){.hzsc{width:140px;height:101px}.hz .ltsub{max-width:calc(100% - 160px);min-width:0}}
@media (prefers-color-scheme:dark){
  .hz{background:linear-gradient(180deg,#4A1F2E 0%,#7A3130 36%,#A54A30 66%,#B8643A 92%);color:#fff}
  .hzsc{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 194 140'%3E%3Cdefs%3E%3CradialGradient id='g'%3E%3Cstop offset='0' stop-color='%23FFE3A3' stop-opacity='.35'/%3E%3Cstop offset='1' stop-color='%23FFE3A3' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Ccircle cx='130' cy='46' r='42' fill='url(%23g)'/%3E%3Ccircle cx='130' cy='46' r='27' fill='%23FFCB7A'/%3E%3Cg transform='translate(-7.4 -10.2) scale(1.848)'%3E%3Cpath d='M6 78 L14 71 L19 58 L23 39 L26 37.5 L28.5 41 L34.5 34 L40.5 25.5 L44.5 20 L46.5 21 L48.5 15.5 L51 14 L53.5 17 L57 28.5 L59.5 26 L62 22.5 L64.5 26 L68 35 L73 43 L80 55 L87 66 L94 77 L94 78 Z' fill='%2317393A'/%3E%3Cpath d='M51 14 L53.5 17 L57 28.5 L52 50 L47 34 Z' fill='%232C6B64'/%3E%3Cpath d='M62 22.5 L64.5 26 L68 35 L73 43 L80 55 L66 56 L60 40 L59.5 26 Z' fill='%23245852'/%3E%3Cpath d='M6 78 L14 71 L19 58 L23 39 L26 37.5 L28.5 41 L34.5 34 L40.5 25.5 L44.5 20 L46.5 21 L48.5 15.5 L51 14 L47 34 L52 50 L44 78 Z' fill='%234FA08A'/%3E%3Cpath d='M34.5 34 L40.5 25.5 L44.5 20 L46.5 21 L48.5 15.5 L51 14 L49 22 L44 27 L39 33 Z' fill='%238FD0B3'/%3E%3C/g%3E%3C/svg%3E")}
  .hzg,.hz .lt{color:#fff}
  .hz .ltsub{color:#fff}
  .hz .ltsub button{color:#fff}
  #nav.hzon .gbtn,#nav.hzon .gcap{background:rgba(15,23,36,.55);color:#fff}
}

/* 0.99.2: the tab bar in Atlantic navy (Tab bar 1 on the canvas): light-teal current tab on a soft pill */
#tabbar{background:#1C2B44;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:0 10px 30px rgba(28,43,68,.38),inset 0 0 0 .5px rgba(255,255,255,.08)}
#tabbar button{color:rgba(255,255,255,.78)}
#tabbar button.on{color:#7FCBB2}
#tabbar .tpill{background:rgba(127,203,178,.18)}
#tabbar .bdg{box-shadow:0 0 0 2px #1C2B44}
#tabbar button:focus-visible{outline-color:#7FCBB2}
@media (prefers-color-scheme:dark){#tabbar{box-shadow:0 10px 30px rgba(0,0,0,.5),inset 0 0 0 .5px rgba(255,255,255,.16)}}

/* 0.99.3: Strip C. The app draws under the clock (status bar black-translucent: white clock and battery).
   A navy band sits behind the clock on every screen, except the sign-in screens (their own background)
   and the top of the Documents home, where the sunset runs up behind the clock. */
html::after{content:'';position:fixed;left:0;right:0;top:0;height:var(--st);background:#1C2B44;z-index:2147483001;pointer-events:none}
html.g::after,html.hzt::after{display:none}
html.hzt:has(.push.in)::after{display:block} /* a page slid over the Documents home: the band comes back for the white clock */
html.hzt:not(.g){background:#E8532F} /* pulling down at the top shows sky, not grey */
@media (prefers-color-scheme:dark){html.hzt:not(.g){background:#4A1F2E}}

/* 0.99.4: the other special moments (canvas "Skellig special moments") */
.erock{display:block;width:132px;height:96px;margin:0 auto 18px;border-radius:24px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 132 96'%3E%3Cdefs%3E%3ClinearGradient id='s' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23E8532F'/%3E%3Cstop offset='.6' stop-color='%23F59E4C'/%3E%3Cstop offset='1' stop-color='%23FFCB7A'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect width='132' height='96' fill='url(%23s)'/%3E%3Ccircle cx='98' cy='28' r='12' fill='%23FFE3A3'/%3E%3Cg transform='translate(-2 2) scale(1.12)'%3E%3Cpath d='M6 78 L14 71 L19 58 L23 39 L26 37.5 L28.5 41 L34.5 34 L40.5 25.5 L44.5 20 L46.5 21 L48.5 15.5 L51 14 L53.5 17 L57 28.5 L59.5 26 L62 22.5 L64.5 26 L68 35 L73 43 L80 55 L87 66 L94 77 L94 78 Z' fill='%2317393A'/%3E%3Cpath d='M51 14 L53.5 17 L57 28.5 L52 50 L47 34 Z' fill='%232C6B64'/%3E%3Cpath d='M62 22.5 L64.5 26 L68 35 L73 43 L80 55 L66 56 L60 40 L59.5 26 Z' fill='%23245852'/%3E%3Cpath d='M6 78 L14 71 L19 58 L23 39 L26 37.5 L28.5 41 L34.5 34 L40.5 25.5 L44.5 20 L46.5 21 L48.5 15.5 L51 14 L47 34 L52 50 L44 78 Z' fill='%234FA08A'/%3E%3Cpath d='M34.5 34 L40.5 25.5 L44.5 20 L46.5 21 L48.5 15.5 L51 14 L49 22 L44 27 L39 33 Z' fill='%238FD0B3'/%3E%3C/g%3E%3Crect y='80' width='132' height='16' fill='%231C2B44'/%3E%3C/svg%3E") center/cover no-repeat;box-shadow:0 16px 30px -18px rgba(28,43,68,.6)}
.aclr{position:relative;overflow:hidden;isolation:isolate;margin:16px 16px 4px;min-height:200px;border-radius:22px;padding:16px 18px 0;box-sizing:border-box;background:linear-gradient(180deg,#E8532F 0%,#F59E4C 55%,#FFCB7A 82%);color:#1C2B44}
.aclr:after{content:'';position:absolute;z-index:-1;left:0;right:0;bottom:0;height:36px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 12'%3E%3Cpath d='M0 6 q6 -5 12 0 t12 0' fill='none' stroke='%23FFFFFF' stroke-opacity='.4' stroke-width='1.6'/%3E%3C/svg%3E") 0 6px/24px 12px repeat-x,#1C2B44}
.aclr-sc{position:absolute;z-index:-1;right:0;bottom:30px;width:194px;height:140px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 194 140'%3E%3Cdefs%3E%3CradialGradient id='g'%3E%3Cstop offset='0' stop-color='%23FFE3A3' stop-opacity='.7'/%3E%3Cstop offset='1' stop-color='%23FFE3A3' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Ccircle cx='130' cy='46' r='42' fill='url(%23g)'/%3E%3Ccircle cx='130' cy='46' r='27' fill='%23FFE3A3'/%3E%3Cg transform='translate(-7.4 -10.2) scale(1.848)'%3E%3Cpath d='M6 78 L14 71 L19 58 L23 39 L26 37.5 L28.5 41 L34.5 34 L40.5 25.5 L44.5 20 L46.5 21 L48.5 15.5 L51 14 L53.5 17 L57 28.5 L59.5 26 L62 22.5 L64.5 26 L68 35 L73 43 L80 55 L87 66 L94 77 L94 78 Z' fill='%2317393A'/%3E%3Cpath d='M51 14 L53.5 17 L57 28.5 L52 50 L47 34 Z' fill='%232C6B64'/%3E%3Cpath d='M62 22.5 L64.5 26 L68 35 L73 43 L80 55 L66 56 L60 40 L59.5 26 Z' fill='%23245852'/%3E%3Cpath d='M6 78 L14 71 L19 58 L23 39 L26 37.5 L28.5 41 L34.5 34 L40.5 25.5 L44.5 20 L46.5 21 L48.5 15.5 L51 14 L47 34 L52 50 L44 78 Z' fill='%234FA08A'/%3E%3Cpath d='M34.5 34 L40.5 25.5 L44.5 20 L46.5 21 L48.5 15.5 L51 14 L49 22 L44 27 L39 33 Z' fill='%238FD0B3'/%3E%3C/g%3E%3C/svg%3E") right bottom/contain no-repeat}
.aclr-t{display:flex;align-items:center;gap:10px;margin:0;font-size:22px;line-height:28px;font-weight:700;color:#0F1724}
.aclr-ok{width:30px;height:30px;border-radius:15px;background:#1C2B44;color:#FFE3A3;display:flex;align-items:center;justify-content:center}
.aclr-ok svg{width:18px;height:18px}
.aclr-p{margin:6px 0 0;max-width:calc(100% - 170px);font-size:15px;line-height:20px;color:#0F1724}
@media (prefers-color-scheme:dark){.aclr{background:linear-gradient(180deg,#4A1F2E 0%,#7A3130 40%,#A54A30 72%,#B8643A 92%)}.aclr-t,.aclr-p{color:#fff}}
.lend{display:flex;flex-direction:column;align-items:center;gap:10px;margin:36px 24px 8px;text-align:center}
.lend p{margin:0;font-size:14px;line-height:19px;color:var(--label2)}
.row .t2.sv{display:block;font-size:13px;color:var(--label3);margin-top:1px}
/* 0.99.4 polish: the lines on the Documents sunset break evenly (no word alone on the last line) */
.hz .ltsub{text-wrap:balance}

/* 0.99.4 review fixes */
.row .t2.sv{color:var(--label2)}
.aclr-ok{flex:none}
@media (max-width:359px){.aclr-sc{width:150px;height:108px}.aclr-p{max-width:calc(100% - 130px)}}
@media (prefers-color-scheme:dark){.erock{box-shadow:none}}
/* 0.99.4: the sunset stays put on the Documents home; the list slides up over it on its own sheet */
.tabview.home .hz{position:sticky;top:0;z-index:0}
.hzbody{position:relative;z-index:1;margin-top:-28px;border-radius:28px 28px 0 0;background:var(--bg);min-height:calc(100vh - 60px);min-height:calc(100dvh - 60px);padding-bottom:1px}
.hzbody .hzsheet{height:14px;margin:0;border-radius:0;background:none}
/* 0.99.4: Ask like a chat */
.askw{display:flex;flex-direction:column;min-height:100%;padding-bottom:0}
.asknw{display:flex;justify-content:center;margin:2px 0 4px}
#askthr{flex:1}
.askbar{position:sticky;bottom:calc(-1 * (var(--sb) + 30px));display:flex;gap:10px;align-items:center;margin:16px 0 calc(-1 * (var(--sb) + 30px));padding:10px 16px calc(var(--sb) + 10px);background:color-mix(in srgb,var(--bg) 92%,transparent);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-top:.5px solid var(--sep)}
.askin{flex:1;display:flex;align-items:center;min-height:46px;padding:0 16px;border-radius:23px;background:var(--cell);box-shadow:0 0 0 .5px var(--sep)}
.askin input{flex:1;min-width:0;border:0;background:none;font-size:17px;color:var(--label);height:44px;outline:none}
.askgo{flex:none;width:46px;height:46px;border-radius:23px;background:var(--tint);color:var(--on-tint,#fff);display:flex;align-items:center;justify-content:center}
.askgo svg{width:22px;height:22px}
.aa b{font-weight:700}

/* 0.99.4: Ask while typing: the sheet sits above the keyboard, so no home-bar space under the box */
.sheet.kb .shb{padding-bottom:0}.sheet.kb .askbar{bottom:0;margin-bottom:0;padding-bottom:10px}

/* 0.99.6: Private at night (N3, canvas "Private at night"). On the iPhone, Private has its own night colours:
   the night sky with the rock and the moon reaches the clock and stays put; the page slides up over it in deep navy. */
html.pvn:not(.g){--tint:#7FCBB2;--tint-fill:rgba(127,203,178,.16);--on-tint:#0F1724;--bg:#0E1826;--cell:#18263A;--cell-hi:#22344C;--label:#fff;--label2:rgba(235,235,245,.6);--label3:rgba(235,235,245,.3);--sep:rgba(255,255,255,.1);--fill:rgba(255,255,255,.08);--fill2:rgba(255,255,255,.14);--green:#30D158;--red:#FF453A;--orange:#FF9F0A;--yellow:#FFD60A;--glass:rgba(24,38,58,.72);--glass-line:rgba(255,255,255,.14);--glass-edge:rgba(0,0,0,.4);--glass-sh:0 8px 28px rgba(0,0,0,.45);--menu:rgba(30,44,64,.94);color-scheme:dark}
html.pvn:not(.g)::after{background:#0E1826}
html.pvt:not(.g)::after{display:none}
html.pvt:not(.g):has(.push.in)::after{display:block}
html.pvt:not(.g){background:#0B1424}
html.pvn:not(.g) #nr:empty{display:none}
.tabview:has(.pv.pvn-on){padding-top:0}
.pv.pvn-on{max-width:none;padding:0}
.pvn-sky{position:sticky;top:0;z-index:0;isolation:isolate;overflow:hidden;min-height:calc(var(--st) + 300px);box-sizing:border-box;padding:calc(var(--st) + var(--nav) + 18px) 16px 74px;background:linear-gradient(180deg,#0B1424 0%,#14233A 40%,#1F3A4E 75%,#2C5560 100%);color:#fff}
.pvn-sky:before{content:"";position:absolute;z-index:-2;left:0;right:0;top:0;height:240px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 390 240'%3E%3Ccircle cx='24' cy='70' r='1' fill='%23FFFFFF' fill-opacity='0.8'/%3E%3Ccircle cx='70' cy='112' r='0.75' fill='%23FFFFFF' fill-opacity='0.6'/%3E%3Ccircle cx='118' cy='64' r='1' fill='%23FFFFFF' fill-opacity='0.9'/%3E%3Ccircle cx='150' cy='140' r='0.75' fill='%23FFFFFF' fill-opacity='0.5'/%3E%3Ccircle cx='196' cy='92' r='1' fill='%23FFFFFF' fill-opacity='0.7'/%3E%3Ccircle cx='232' cy='58' r='0.75' fill='%23FFFFFF' fill-opacity='0.6'/%3E%3Ccircle cx='268' cy='128' r='0.75' fill='%23FFFFFF' fill-opacity='0.5'/%3E%3Ccircle cx='350' cy='74' r='1' fill='%23FFFFFF' fill-opacity='0.8'/%3E%3Ccircle cx='30' cy='180' r='0.75' fill='%23FFFFFF' fill-opacity='0.5'/%3E%3Ccircle cx='110' cy='200' r='1' fill='%23FFFFFF' fill-opacity='0.6'/%3E%3Ccircle cx='176' cy='176' r='0.75' fill='%23FFFFFF' fill-opacity='0.5'/%3E%3Ccircle cx='372' cy='150' r='0.75' fill='%23FFFFFF' fill-opacity='0.6'/%3E%3Ccircle cx='312' cy='40' r='0.75' fill='%23FFFFFF' fill-opacity='0.5'/%3E%3Ccircle cx='140' cy='22' r='0.75' fill='%23FFFFFF' fill-opacity='0.45'/%3E%3C/svg%3E") center top/390px 240px no-repeat;pointer-events:none}
.pvn-sky:after{content:"";position:absolute;z-index:-1;left:0;right:0;bottom:0;height:62px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 194 62'%3E%3Crect x='41' y='6' width='38' height='3' rx='1.5' fill='%23F3E9C6' fill-opacity='.5'/%3E%3Crect x='47' y='14' width='26' height='2' rx='1' fill='%23F3E9C6' fill-opacity='.35'/%3E%3C/svg%3E") right top/194px 62px no-repeat,#08111E;pointer-events:none}
.pvn-sc{position:absolute;z-index:-1;right:0;bottom:58px;width:194px;height:200px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 194 200'%3E%3Cdefs%3E%3CradialGradient id='g'%3E%3Cstop offset='0' stop-color='%23F3E9C6' stop-opacity='.34'/%3E%3Cstop offset='1' stop-color='%23F3E9C6' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Ccircle cx='60' cy='40' r='46' fill='url(%23g)'/%3E%3Ccircle cx='60' cy='40' r='20' fill='%23F3E9C6'/%3E%3Cg transform='translate(-7.39 51.8) scale(1.848)'%3E%3Cpath d='M6 78 L14 71 L19 58 L23 39 L26 37.5 L28.5 41 L34.5 34 L40.5 25.5 L44.5 20 L46.5 21 L48.5 15.5 L51 14 L53.5 17 L57 28.5 L59.5 26 L62 22.5 L64.5 26 L68 35 L73 43 L80 55 L87 66 L94 77 L94 78 Z' fill='%230A1A20'/%3E%3Cpath d='M51 14 L53.5 17 L57 28.5 L52 50 L47 34 Z' fill='%2314343A'/%3E%3Cpath d='M62 22.5 L64.5 26 L68 35 L73 43 L80 55 L66 56 L60 40 L59.5 26 Z' fill='%23102A30'/%3E%3Cpath d='M6 78 L14 71 L19 58 L23 39 L26 37.5 L28.5 41 L34.5 34 L40.5 25.5 L44.5 20 L46.5 21 L48.5 15.5 L51 14 L47 34 L52 50 L44 78 Z' fill='%231F4A4C'/%3E%3Cpath d='M34.5 34 L40.5 25.5 L44.5 20 L46.5 21 L48.5 15.5 L51 14 L49 22 L44 27 L39 33 Z' fill='%235E8FA0' fill-opacity='.75'/%3E%3C/g%3E%3C/svg%3E") right bottom/contain no-repeat;pointer-events:none}
.pvn-h{margin:0;font-size:34px;line-height:41px;font-weight:700;letter-spacing:-.02em;color:#fff}
.pvn-sub{margin:6px 0 0;max-width:calc(100% - 190px);min-width:150px;font-size:15px;line-height:20px;color:rgba(255,255,255,.82);text-wrap:balance}
.pvn-sky .pv-acts{position:absolute;top:calc(var(--st) + 4px);right:16px;gap:10px}
.pvn-sky .pv-ib{width:44px;height:44px;border-radius:22px;background:rgba(255,255,255,.14);color:#fff;box-shadow:inset 0 0 0 .5px rgba(255,255,255,.18)}
.pvn-sky .pv-ib svg{width:22px;height:22px}
.pvn-sky .pv-ib.pri{background:#F3E9C6;color:#14233A;box-shadow:none}
.pvn-body{position:relative;z-index:1;margin-top:-28px;border-radius:28px 28px 0 0;background:var(--bg);min-height:calc(100vh - 60px);min-height:calc(100dvh - 60px);padding:18px 16px 0;box-sizing:border-box}
.pvn-body>.pv-tabs:first-child{margin-top:0}
.pvn-lead{margin:2px 4px 6px;color:var(--label2)}
html.pvn:not(.g) .pv-seg button.on{background:#2A3B52}
#nav.pvon:before{opacity:0}
#nav.pvon .ntitle{opacity:0}
#nav.pvon .gbtn{background:rgba(255,255,255,.14);color:#fff;box-shadow:inset 0 0 0 .5px rgba(255,255,255,.18)}
@media (max-width:359px){.pvn-sc{width:150px;height:155px}.pvn-sub{max-width:calc(100% - 150px)}}
/* 0.99.6 review: the invisible bar title must not take taps meant for the buttons on the sky; warnings stay readable on navy */
html.pvn:not(.g) #nav .ntitle{pointer-events:none}
html.pvn:not(.g) .pv-warnt{color:#FF9F0A}

/* 0.99.7 (Omri 04/11, screenshots): iOS 26 and later draw their own frosted strip under the clock and choose the clock colour
   themselves, so our navy band only showed through as a grey-blue (light) or muddy navy (dark) bar on every screen but the
   Documents home. On those iPhones the band goes and the strip takes the colour of the page. Anchor positioning arrived with
   Safari 26, and every iPhone browser runs on WebKit, so it marks iOS 26+. Older iOS keeps the band: their clock is white. */
@supports (anchor-name:--a){html::after{display:none!important}}

/* 0.99.8: Settings → Why Skellig */
.whyc{min-height:176px}.whyt{margin:18px 16px 0;padding:6px 18px;border-radius:22px;background:var(--cell)}.whyt p{margin:12px 0;font-size:17px;line-height:1.5;color:var(--label)}.whyt b{color:var(--label)}

/* 0.99.12: the Photos space: its own card above Spaces, a sunset tile; inside, a grid */
.phsp{margin-top:18px;background:#FFF4EC}.phsp .row{background:transparent}
.tile.phtile{background:linear-gradient(160deg,#E8532F 0%,#F59E4C 100%);color:#fff}
@media (prefers-color-scheme:dark){.phsp{background:#3A2620}}
.phacts{display:flex;gap:10px;margin:14px 16px 12px}
.phbtn{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;height:44px;border:0;border-radius:22px;background:var(--fill);color:var(--tint);font:600 15px/1 -apple-system,Inter,system-ui,sans-serif}
.phbtn svg{width:18px;height:18px}.phbtn.pri{background:var(--tint);color:#fff}
@media (prefers-color-scheme:dark){.phbtn.pri{color:#0F1724}}
.phgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;margin:0 16px}
.phcell{position:relative;aspect-ratio:1;border:0;padding:0;border-radius:4px;overflow:hidden;background:var(--cell);display:flex;align-items:center;justify-content:center}
.phcell .dpic{transform:scale(.8)}
.phcell img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .2s}.phcell img.on{opacity:1}
.phcell[aria-pressed="true"],.phcell.on{outline:3px solid var(--tint);outline-offset:-3px}