/* Coastal Retrofuture. Authoritative shell skin; inherited apps keep their behavior. */
:root:root {
  color-scheme: light;
  --shell-glass: rgba(247,252,255,.9); --shell-ink: #163047; --shell-muted: #475e73; --shell-edge: rgba(255,255,255,.8);
  --os-ui: var(--pk-font); --os-text: #163047; --os-text-2: #475e73; --os-text-3: #52697b;
  --text: #163047; --text2: #475e73; --bg: #f5faff; --bg50: rgba(247,252,255,.86); --bg70: rgba(247,252,255,.92);
  --os-line: rgba(45,86,120,.13); --os-line-2: rgba(45,86,120,.19); --os-line-3: rgba(45,86,120,.27);
  --g1-base: #f5faff; --g1-warm: #fffaf4; --g2-rgb: 248,252,255; --g3-rgb: 250,253,255;
  --g2-a: .8; --g3-a: .9; --g2-a-idle: .82;
  --glass-bg: rgba(248,252,255,.8); --glass-bg-lift: rgba(250,253,255,.9);
  --glass-shadow: 0 22px 65px rgba(27,55,80,.2),inset 0 1px 0 rgba(255,255,255,.9);
  --glass-shadow-lift: 0 18px 55px rgba(27,55,80,.22),inset 0 1px 0 #fff;
  --pm-purple: #5956e9; --pm-purple-deep: #423ef3; --pm-lavender: #286c9c; --pm-sky: #289dc4; --pm-teal: #187a79;
  --pd-violet: #5956e9; --pd-violet-light: #267aaf;
  --os-focus: #5956e9; --os-focus-halo: rgba(89,86,233,.14);
  --el-1: rgba(255,255,255,.6); --el-2: rgba(237,246,252,.8); --el-3: #e5f1fc; --el-4: #d9eafe;
  --os-el-1: rgba(255,255,255,.22); --os-el-2: rgba(255,255,255,.35); --os-el-4: rgba(89,86,233,.08);
  --r-window: 16px; --r-card: 14px; --r-control: 10px; --os-r-win: 16px; --os-r-sheet: 16px;
  --dock-lift: 14px; --pk-workarea-top: 38px;
}
body { font-family: var(--pk-font); color: var(--shell-ink); }
/* Brand type roles: Museo operates; Science labels sections; Brigends welcomes. */
body #loginback > .lock-core > .name {
  font-family:var(--pk-font-display); font-weight:400; font-synthesis:none;
  font-size:clamp(21px,4.8vw,28px); line-height:1.2; letter-spacing:0;
  text-wrap:balance;
}
body #loginback .lock-wordmark { display:block; width:124px; height:40px; object-fit:contain; object-position:left center; flex:none; }
body #start-menu :is(.pinned > .title,#startmenu-l > list > .text),
body #loginback .lock-head .lock-preview-badge,
body .pk-unlock-filename {
  font-family:var(--pk-font-subtitle); font-weight:500;
  font-variation-settings:"wdth" 100,"YOPQ" 70; letter-spacing:.015em;
}
body #loginback .pk-phone { padding:0 10px 0 0; gap:10px; }
body #loginback .pk-country { position:relative; align-self:stretch; flex:none; width:96px; min-height:52px; border-right:1px solid #c6d3de; border-radius:9px 0 0 9px; }
body #loginback .pk-country-display { height:100%; display:flex; align-items:center; justify-content:center; gap:7px; color:#163047; font:700 14px/1 var(--pk-font); }
body #loginback .pk-country-display img { width:24px; height:18px; object-fit:cover; border-radius:2px; box-shadow:0 0 0 1px #16304720; }
body #loginback #login-country { position:absolute; inset:0; opacity:0; width:100%; height:100%; cursor:pointer; font:500 16px var(--pk-font); }
body #loginback .pk-country:focus-within { outline:2px solid #5956e9; outline-offset:-3px; }
body #loginback .pk-country:hover { background:rgb(89 86 233 / 6%); }
body #loginback .pk-phone-entry { position:relative; flex:1; min-width:0; height:52px; }
body #loginback #login-phone,
body #loginback #login-phone-mask {
  box-sizing:border-box; position:absolute; inset:0; width:100%; height:100%;
  padding:0; margin:0; font:500 16px/52px var(--pk-font); letter-spacing:.02em;
  font-variant-numeric:tabular-nums; white-space:pre;
}
body #loginback #login-phone { background:transparent; border:0; color:#163047; }
body #loginback #login-phone::placeholder { color:transparent; }
body #loginback #login-phone-mask { color:#607487; pointer-events:none; overflow:hidden; }
body #loginback .pk-phone-filled { visibility:hidden; }
.pk-visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
@media(max-width:400px) {
  body #loginback .lock-wordmark { width:108px; height:35px; }
  body #loginback .pk-country { width:86px; }
  body #loginback .pk-phone { gap:8px; }
  body #loginback #login-phone,body #loginback #login-phone-mask { letter-spacing:0; }
}
@media(max-width:360px) {
  body #loginback .lock-wordmark { width:94px; height:31px; }
  body #loginback .pk-country { width:80px; }
  body #loginback .pk-country-display { gap:5px; }
}
::selection { background: #bcdcff; color:#102f52; }
body :focus-visible { outline: 2px solid #5956e9; outline-offset: 3px; }
body * { scrollbar-color: rgba(49,82,109,.36) transparent; scrollbar-width:thin; }
body input, body textarea { caret-color:#5956e9; }
body button, body [role=button] { touch-action:manipulation; }

/* The black concept SUV sits in white relief with the original pointer surface. */
body.pekan-coastal { background:#f5f4f1 !important; }
body.pekan-coastal #bg-lava { visibility:visible; pointer-events:none; transform:none !important; }
body.pekan-coastal #bg-scrim { background:transparent !important; pointer-events:none; }
body.pekan-coastal #desktop { top:38px; }
body #desktop > div.b, body #desktop.clut-free > div.b.clut { filter:none !important; box-shadow:none !important; border-radius:10px; transition:background 150ms,border-color 150ms; }
body #desktop > div.b > img { object-fit:contain; background:none !important; box-shadow:none !important; filter:drop-shadow(0 3px 3px rgba(25,54,74,.13)) !important; transform:none !important; }
body #desktop > div.b > p, body #desktop.clut-free > div.b.clut > p {
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; box-sizing:border-box;
  min-height:32px; max-height:32px; overflow:hidden; margin-top:6px; padding:0 3px;
  color:#163047 !important; font:500 12px/16px var(--pk-font); text-shadow:0 1px 2px rgba(255,255,255,.9) !important;
  background:transparent !important; box-shadow:none !important; border:0;
}
body #desktop > div.b:hover, body #desktop > div.b.sel { background:rgba(250,253,255,.48) !important; border-color:rgba(255,255,255,.75) !important; }
/* Phone files cross the black vehicle; a compact backing keeps names readable. */
@media(max-width:700px) {
  body #desktop > div.b > p, body #desktop.clut-free > div.b.clut > p {
    width:fit-content; max-width:100%; min-height:0; margin-inline:auto;
    background:rgba(247,252,255,.9) !important; border-radius:5px;
    text-shadow:none !important;
  }
}

/* A single, calm menu bar. */
body #os-menubar, body #dock-box {
  color:var(--shell-ink); background:linear-gradient(180deg,rgba(255,255,255,.42),rgba(255,255,255,.06)),var(--shell-glass);
  border:1px solid var(--shell-edge); backdrop-filter:blur(24px) saturate(140%); -webkit-backdrop-filter:blur(24px) saturate(140%);
  box-shadow:inset 0 1px 0 #fff,0 8px 28px rgba(28,56,78,.16);
}
body #os-menubar { height:38px; padding:0 16px; gap:12px; border-width:0 0 1px; box-sizing:border-box; }
body #os-menubar .mb-mark { align-self:stretch; display:flex; align-items:center; padding:0 7px; margin:3px 0; gap:8px; border:0; border-radius:6px; background:transparent; color:var(--shell-ink); font:600 13px/1 var(--pk-font); cursor:pointer; }
body #os-menubar .mb-mark img { width:22px; height:22px; border-radius:0; box-shadow:none; filter:none; }
body #os-menubar .mb-mark:hover, body #os-menubar .mb-mark[aria-expanded=true] { background:rgba(255,255,255,.6); }
body #os-menubar #os-halo { gap:10px; color:var(--shell-ink); }
body #os-menubar #os-halo :is(.wx,.when-d,.when-mer) { color:var(--shell-muted); }
body #os-menubar #os-halo :is(.sep,.bat) { opacity:.6; }
body #os-menubar #os-sound { width:30px; height:30px; padding:7px; color:var(--shell-ink) !important; background:transparent !important; border:0; border-radius:6px; box-shadow:none; }
body #os-menubar #os-sound svg { width:16px; height:16px; }
#pk-menu-actions { display:flex; gap:2px; }
#pk-menu-actions button { background:none; border:0; border-radius:6px; color:var(--shell-ink); font:400 12px/1 var(--pk-font); padding:8px 10px; cursor:pointer; }
#pk-menu-actions button:hover, #pk-menu-actions button[aria-expanded=true] { background:rgba(255,255,255,.65); }
#pk-shell-menu { position:fixed; top:44px; z-index:10000; width:244px; max-width:calc(100vw - 16px); padding:6px; border:1px solid rgba(255,255,255,.9); border-radius:12px; background:rgba(248,252,255,.94); color:#163047; box-shadow:0 12px 40px #23415b30; backdrop-filter:blur(24px); }
#pk-shell-menu button { display:flex; align-items:center; gap:16px; justify-content:space-between; width:100%; min-height:42px; padding:8px 12px; border:0; border-radius:7px; background:transparent; color:inherit; font:400 13px/1.3 var(--pk-font); cursor:pointer; text-align:left; }
#pk-shell-menu button:hover,#pk-shell-menu button:focus-visible { background:#e2eefb; }
#pk-shell-menu kbd { color:#617386; font:11px var(--pk-font); }

/* App strip may shrink, but Start and Update never disappear. */
body #dock-box { --dock-tile:52px; --dock-icon:43px; display:flex; align-items:center; width:max-content; max-width:calc(100vw - 32px); height:72px; padding:8px; gap:8px; border-radius:22px; box-sizing:border-box; overflow:visible; }
body #dock-box .dock-start { display:flex; align-items:center; flex:0 1 auto; gap:8px; min-width:0; overflow:visible; }
body #dock-box .dock-apps { display:flex; align-items:center; gap:6px; min-width:0; overflow-x:auto; overflow-y:hidden; scrollbar-width:none; }
body #dock-box :is(.dock-btn,.dock-btn.pin,#taskbar > a) { box-sizing:border-box; display:flex; align-items:center; justify-content:center; flex:0 0 var(--dock-tile); width:var(--dock-tile); min-width:var(--dock-tile); height:var(--dock-tile); padding:0; margin:0; border:0; border-radius:12px; background:transparent; box-shadow:none; transform:none; scale:1; transition:background 150ms; }
body #dock-box :is(.dock-btn,#taskbar > a):hover { background:rgba(255,255,255,.45); transform:none; }
body #dock-box :is(.dock-btn,#taskbar > a):focus-visible { outline-offset:-2px; }
body #dock-box :is(.dock-btn,.dock-btn.pin,#taskbar > a) > img { display:block; width:var(--dock-icon); height:var(--dock-icon); margin:auto; padding:0; object-fit:contain; background:none; border-radius:0; box-shadow:none; filter:drop-shadow(0 2px 2px #23445c25); transform:none; scale:1; }
body #dock-box #start-btn.dock-btn { flex:0 0 58px; width:58px; min-width:58px; gap:4px; flex-direction:column; padding:3px; }
body #dock-box #start-btn.dock-btn .pd-mark { width:30px; height:30px; margin:0; border:0; background:none; box-shadow:none; }
body #dock-box #start-btn .start-label { display:block; color:#163047; font:600 10px/1 var(--pk-font); }
body #dock-box .dock-divider { flex:none; width:1px; height:34px; margin:0 2px; background:rgba(42,75,104,.2); }
body #dock-box .dock-key { display:flex !important; align-items:center; justify-content:center; flex:0 0 48px; width:48px; min-width:48px; height:50px; margin:0; padding:0; border:0; border-left:1px solid rgba(44,79,111,.18); border-radius:0 12px 12px 0; color:#234a68; background:rgba(255,255,255,.22); box-shadow:none; }
body #dock-box .dock-key svg { width:23px; height:23px; stroke:currentColor; }
body #dock-box .dock-key > span { display:none; }
body #dock-box .dock-key::after { background:#5956e9; width:7px; height:7px; border:2px solid #ecf7fe; }
body #dock-box .dock-key:hover { background:rgba(255,255,255,.65); }
body #dock-box #taskbar { gap:4px; flex:0 1 auto; max-width:160px; min-width:0; overflow:auto; scrollbar-width:none; }

/* Menu rows share optical slots; one scroll container on a phone. */
body #start-menu { color:var(--shell-ink); background:rgba(249,253,255,.9); border:1px solid rgba(255,255,255,.92); border-radius:20px; backdrop-filter:blur(30px) saturate(140%); -webkit-backdrop-filter:blur(30px) saturate(140%); box-shadow:var(--glass-shadow-lift); padding:12px; width:min(840px,calc(100vw - 40px)); max-width:calc(100vw - 24px); height:min(640px,calc(100dvh - 146px)); max-height:calc(100dvh - 146px); bottom:100px; box-sizing:border-box; }
body #start-menu::before,body #start-menu::after { display:none; }
body #start-menu :is(a,.sm-app) { color:var(--shell-ink); }
body #start-menu :is(p,.text) { color:var(--shell-muted); }
body #start-menu > #startmenu-l { min-width:250px; width:250px; padding:0 12px 0 0; border-right:1px solid rgba(42,76,104,.12); height:100%; overflow:hidden; }
body #startmenu-user { flex:none; margin:0 auto 3px; }
body #startmenu-l > .pk-start-search { display:block; width:100%; min-height:42px; flex:none; box-sizing:border-box; margin:10px 0 6px; padding:8px 12px; border:1px solid #a9becf; background:rgba(255,255,255,.78); color:#163047; border-radius:10px; font:400 13px var(--pk-font); }
body #startmenu-l > list { display:block; flex:1; min-height:0; overflow:auto; margin:0; padding:0 2px 8px; }
body #startmenu-l > list > a { display:flex; align-items:center; gap:12px; min-height:42px; height:auto; padding:6px 8px; margin:1px 0; border:0; border-radius:8px; box-sizing:border-box; }
body #startmenu-l > list > a > :is(img,svg) { flex:0 0 27px; width:27px; height:27px; margin:0 !important; padding:0; object-fit:contain; }
body #startmenu-l > list > a > p { min-width:0; margin:0; font:400 13px/1.3 var(--pk-font); color:#163047; }
body #startmenu-l > list > .text { margin:16px 8px 7px; font:600 10px/1.4 var(--pk-font); letter-spacing:.075em; color:#52697b; }
body #startmenu-l > list > a:hover,body #start-menu .sm-app:hover,body #start-menu .tj-obj:hover { background:rgba(89,86,233,.08); }
body #start-menu > #startmenu-r { flex:1; min-width:0; width:auto; padding:0 0 0 20px; overflow:auto; }
body #startmenu-r .row1 { margin:0 0 14px; }
body #startmenu-r .tool { color:#163047; }
body #startmenu-r .tool .date { opacity:1 !important; color:#52697b; }
body #startmenu-r .pinned .apps { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
body #startmenu-r .pinned .sm-app { width:auto !important; min-width:0; height:84px; padding:8px 4px; display:flex; flex-direction:column; justify-content:flex-start; gap:7px; border:0; border-radius:10px; background:transparent; }
body #startmenu-r .pinned .sm-app > img { width:36px; height:36px; object-fit:contain; margin:0; }
body #startmenu-r .pinned .sm-app > p { margin:0; max-width:100%; font:500 12px/1.3 var(--pk-font); color:#163047; }
body #startmenu-r .title { margin:12px 0 10px; }
body #startmenu-r .title > p { color:#52697b; font-size:10px; font-weight:600; letter-spacing:.06em; }
body #startmenu-r .tuijian .apps { display:flex; flex-direction:column; gap:3px; }
body #startmenu-r .tuijian .tj-obj { width:100%; min-height:50px; padding:7px 10px; border-radius:8px; box-sizing:border-box; gap:12px; }
body #startmenu-r .tuijian .tj-obj > img { width:28px; height:28px; margin:0; }
body #startmenu-r .tuijian .tj-obj p { margin:0; line-height:1.4; font-size:12px; }
body #startmenu-r .tuijian .tj-obj p + p { font-size:10px; color:#52697b; }
body #start-menu [data-search-hidden=true] { display:none !important; }

/* Unified real window chrome; preserve positioning written by windows.js. */
body .window.window,:root.mica body .window.foc,:root.mica body .window:not(.foc),:root.mica body .window.webapp { color:#163047; background:rgba(250,253,255,.9) !important; backdrop-filter:blur(24px) saturate(130%) !important; -webkit-backdrop-filter:blur(24px) saturate(130%) !important; border:1px solid rgba(255,255,255,.9); border-radius:16px; box-shadow:var(--glass-shadow); }
body .window.window > .titbar { min-height:42px; height:42px; box-sizing:border-box; color:#163047; background:rgba(255,255,255,.45); border-bottom:1px solid rgba(45,86,120,.12); box-shadow:inset 0 1px 0 #fff; }
body .window.window > .titbar .title { color:#163047; font:600 12px/1.3 var(--pk-font); }
body .window.window > .titbar .wbtg { --traffic-color:#febc2e; background:var(--traffic-color) !important; transform:none; box-shadow:inset 0 0 0 1px rgba(0,0,0,.14); }
body .window.window > .titbar .wbtg.red { --traffic-color:#ff6058; }
body .window.window > .titbar .wbtg.max { --traffic-color:#29c840; }
body .window.window:not(.foc) > .titbar .wbtg { --traffic-color:#aab7c1; }
body .window.window > .titbar .wbtg[aria-disabled=true] { --traffic-color:#b7c3cc; }
body .window.window.os-positioned:not(.max):not(.min) { left:var(--pk-window-left) !important; top:var(--pk-window-top) !important; width:var(--pk-window-width) !important; height:var(--pk-window-height) !important; }
body .window.window:is(.max,.left,.right):not(.min) { top:var(--pk-workarea-top,38px) !important; height:calc(100% - var(--pk-workarea-top,38px) - 94px) !important; }
body .window.window:not(.max) { max-height:calc(100dvh - 138px); }
body .window :is(.content,.page,.cnt) { color:var(--os-text); }
body .window.explorer :is(.path,.tool,.nav,.bottom),body .window.setting :is(.page,.menu,.cnt) { background:rgba(244,250,255,.72); color:#163047; }
body .window.explorer .content { background:rgba(255,255,255,.9); color:#163047; }
body .window.explorer :is(a,p,span,input),body .window.setting :is(a,p,span,h1,h2,h3) { color:inherit; }
body .window.explorer :is(input,.text) { background:rgba(255,255,255,.72); }
body #win-explorer .path .text { border-color:rgba(39,77,108,.16); }
body .window.terminal > .content { color:#deedfa; background:#132a3b; }
body .window.terminal textarea { color:#deedfa; background:transparent; }
body .window.calc .content,body .window.taskmgr .content,body .window.about .content { background:#f5faff; color:#163047; }
body :is(#cm,#notice,.clut-sheet,.clut-dialog,.pk-toast,#pk-update-toast,#search-win,#control,#datebox) { color:#163047; background:rgba(248,252,255,.94); border-color:rgba(255,255,255,.9); backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px); box-shadow:var(--glass-shadow-lift); }
body #cm :is(a,span),body .clut-dialog :is(h2,h3,p),body .pk-toast :is(h4,p),body #pk-update-toast :is(.pk-up-body,.pk-up-label) { color:#163047; }
body .pk-toast :is(.pk-toast-app,.pk-toast-consent),body #pk-update-toast :is(.pk-up-app,.pk-up-context,.pk-up-fine) { color:#475e73; }
body .pk-toast,body #pk-update-toast { padding:16px; border-radius:16px; }
body .pk-toast :is(button,input),body #pk-update-toast :is(button,input) { font-family:var(--pk-font); }
body .pk-toast .pk-toast-x,body #pk-update-toast .pk-up-x { display:grid; place-items:center; flex:0 0 32px; min-width:32px; width:32px; min-height:32px; height:32px; padding:0; border:0; border-radius:8px; color:#475e73; background:transparent; box-shadow:none; }
body .pk-toast .pk-toast-x::after,body #pk-update-toast .pk-up-x::after { display:none; }
body .pk-toast .pk-toast-x .pk-fa,body #pk-update-toast .pk-up-x .pk-fa { display:none; }
body .pk-toast input,body #pk-update-toast input { color:#163047; background:white; border:1px solid #a9becf; }
body .pk-toast .pk-toast-actions button,body #pk-update-toast .pk-up-btn { min-height:42px; border-radius:9px; }

/* Lock clock, card and footer share a stable centered document flow. */
body.pekan-coastal #loginback {
  gap:20px;
  background:#f3b78e url('../background/coastal/escalade-black-concept.png') 88% bottom/cover no-repeat;
  backdrop-filter:none; -webkit-backdrop-filter:none;
  color:#163047; padding:30px 20px max(22px,env(safe-area-inset-bottom));
}
body.pekan-coastal #loginback > .lock-clock { color:#163047; text-shadow:0 2px 20px #ffffff70; margin-top:auto; }
body.pekan-coastal #loginback :is(.lock-time,.lock-date) { color:#163047; }
body.pekan-coastal #loginback .lock-time { font-size:clamp(56px,7vw,88px); font-weight:400; letter-spacing:-.04em; }
body.pekan-coastal #loginback > .lock-core.pk-spatial-glass { width:min(430px,100%); padding:28px; background:rgba(250,253,255,.9); border:1px solid #ffffffdd; border-radius:20px; box-shadow:0 25px 70px #19395130,inset 0 1px 0 white; backdrop-filter:blur(28px) saturate(130%); -webkit-backdrop-filter:blur(28px) saturate(130%); }
body #loginback > .lock-core > .name { color:#163047; font-size:26px; line-height:1.2; letter-spacing:0; }
body #loginback #os-lock-funnel { color:#475e73; font-size:14px; line-height:1.65; margin-bottom:20px; }
body #loginback .lock-head .lock-preview-badge { color:#52697b; background:rgba(255,255,255,.5); border:1px solid #cedde7; border-radius:5px; font-size:8px; letter-spacing:.06em; }
body #loginback > .lock-core > .lock-head .app,body #loginback #os-lock-phone-label { color:#163047; }
body #loginback #os-lock-secondary { margin-top:0; padding-top:0; border:0; }
body #loginback .pk-phone { border-color:#a9becf; border-radius:10px; background:rgba(255,255,255,.87); }
body #loginback #login-phone { color:#163047; letter-spacing:.02em; }
body #loginback #login-phone::placeholder { color:#607487; }
body #loginback .pk-phone:focus-within { outline-color:#5956e9; }
body #loginback #login { min-height:48px; border:1px solid #5956e9; border-radius:10px; color:white; background:#5956e9; box-shadow:inset 0 1px 0 #ffffff44,0 5px 12px #5956e925; font-size:14px; }
body #loginback #login:hover { background:#423ef3; }
body #loginback #os-lock-guest { color:#314f68; background:transparent; margin-top:12px; border:0; font-size:13px; }
body #loginback #os-lock-guest:hover { background:rgba(255,255,255,.6); }
body #loginback .lock-demo-note { font-size:10px; color:#53697a; }
body #loginback > .langselect.new { background:rgba(248,252,255,.9); backdrop-filter:blur(18px); border:1px solid #ffffff88; border-radius:12px; padding:3px; width:min(430px,100%); }
body #loginback > .langselect.new > .a,body #loginback .langselect .lock-site { color:#163047; }
body #loginback > .langselect.new > .a.selected { background:rgba(255,255,255,.8); }
body #loginback #os-lock-phone-err { color:#a52936; }
body #loginback #os-lock-phone-err:not(:empty) { border:0; padding:0; }
body #login-welc { background:rgba(241,250,255,.95); color:#163047; }
body #desktop-editbar-container:not(.show) { visibility:hidden; pointer-events:none; }
body #desktop-editbar-container.show { top:38px; visibility:visible; pointer-events:auto; z-index:140; }
body #desktop-editbar { max-width:calc(100vw - 16px); box-sizing:border-box; gap:4px; padding:6px; background:rgba(248,252,255,.95); border-radius:0 0 12px 12px; }
body #desktop-editbar > div { display:flex; align-items:center; gap:6px; min-height:44px; min-width:0; padding:4px 6px; color:#163047; font:500 13px/1.25 var(--pk-font); }

@media(max-width:700px) {
  body #os-menubar { height:38px; padding:0 6px; gap:4px; }
  body #os-menubar .mb-mark { font-size:12px; padding:0 5px; }
  body #os-menubar #os-halo { gap:5px; padding:0; }
  body #os-menubar #os-halo :is(.when-d,.wx,.sep) { display:none; }
  #pk-menu-actions { display:none; }
  body #dock-box { --dock-tile:44px; --dock-icon:36px; height:62px; padding:7px 6px; gap:4px; width:max-content; max-width:calc(100vw - 16px); bottom:max(8px,env(safe-area-inset-bottom)); border-radius:18px; }
  body #dock-box .dock-start { gap:4px; }
  body #dock-box .dock-apps { gap:2px; }
  body #dock-box #start-btn.dock-btn { flex:0 0 44px; width:44px; min-width:44px; }
  body #dock-box #start-btn.dock-btn .pd-mark { width:25px; height:25px; }
  body #dock-box #start-btn .start-label { font-size:9px; }
  body #dock-box .dock-divider { display:none; }
  body #dock-box .dock-key { flex:0 0 44px; width:44px; min-width:44px; height:44px; }
  body #dock-box #taskbar { max-width:48px; }
  body #dock-box .dock-phone-more,body #dock-box #copilot-btn { display:none; }
  body #start-menu { left:8px !important; right:8px !important; width:auto !important; max-width:calc(100vw - 16px); height:auto; max-height:calc(100dvh - 124px); bottom:82px; padding:14px; overflow:auto !important; transform:none !important; border-radius:18px; }
  body #start-menu > #startmenu-l { width:100%; min-width:0; height:auto !important; padding:0; overflow:visible !important; border:0; }
  body #startmenu-l > list { overflow:visible; padding:0; }
  body #startmenu-l > list > a { min-height:48px; gap:14px; }
  body #startmenu-l > list > a > p { font-size:14px; }
  body #startmenu-l > list > a > img { width:30px; height:30px; flex-basis:30px; }
  body #start-menu > #startmenu-r,body #start-menu #os-menubar-phone { display:none !important; }
  body #startmenu-user { width:42px; height:42px; }
  body #startmenu-l > .pk-start-search { min-height:46px; font-size:16px; position:sticky; top:0; z-index:1; background:#f7fbff; }
  body .window.window:not(.min),body .window.window.os-positioned:not(.min):not(.max) { left:6px !important; top:44px !important; width:calc(100vw - 12px) !important; height:calc(100dvh - 126px) !important; max-height:calc(100dvh - 126px) !important; border-radius:14px; }
  body .window.window > .titbar .wbtg { width:40px; min-width:40px; height:42px; background:transparent !important; box-shadow:none; border-radius:0; }
  body .window.window > .titbar .wbtg::after { width:13px; height:13px; background:var(--traffic-color) !important; }
  body .window.window > .titbar .title { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  body #desktop:not(.clut-free) { padding-top:48px; padding-bottom:94px; height:calc(100dvh - 38px); box-sizing:border-box; }
  body .pk-toast .pk-toast-x,body #pk-update-toast .pk-up-x { min-width:44px; width:44px; min-height:44px; height:44px; }
  body .pk-toast,body #pk-update-toast { max-width:calc(100vw - 24px); box-sizing:border-box; }
  body.pekan-coastal #loginback { padding:22px 16px max(16px,env(safe-area-inset-bottom)); gap:18px; }
  body.pekan-coastal #loginback > .lock-core.pk-spatial-glass { padding:24px; }
  body #loginback > .lock-core > .name { font-size:26px; }
  body.pekan-coastal #loginback .lock-time { font-size:62px; }
}
@media(max-width:380px) {
  body #dock-box .dock-btn[onclick="openapp('chrome')"] { display:none; }
  body.pekan-coastal #loginback > .lock-core.pk-spatial-glass { padding:20px; }
  body #loginback > .lock-core > .name { font-size:24px; }
  body #loginback .lock-head .lock-preview-badge { font-size:7px; padding:4px; }
}
@media(max-height:650px) {
  body.pekan-coastal #loginback { gap:12px; padding-top:16px; }
  body.pekan-coastal #loginback > .lock-clock { display:none !important; }
  body.pekan-coastal #loginback > .lock-core.pk-spatial-glass { margin-top:auto; padding:22px; }
}
@media(prefers-reduced-motion:reduce),(hover:none) { body #dock-box :is(.dock-btn,#taskbar>a)>img,body #desktop>div.b>img { scale:1 !important; transition:none !important; } }
@media(prefers-reduced-transparency:reduce) { body #os-menubar,body #dock-box,body #start-menu,body .window.window,body #loginback > .lock-core.pk-spatial-glass { background:#f5faff !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; } }
@supports not (backdrop-filter:blur(1px)) { body #os-menubar,body #dock-box,body #start-menu,body .window.window { background:#f5faff !important; } }
/* Integrated review corrections: restore the menu's actual content flow. */
body #start-menu { overflow:hidden; }
body #start-menu #startmenu-user { position:static; inset:auto; transform:none; translate:none; width:40px !important; height:40px !important; min-height:40px; margin:4px 0 0 8px !important; box-shadow:none; background:rgba(255,255,255,.7); color:#163047; border:1px solid #d0e0ea; }
body #start-menu .startmenu-name { position:static; margin:-31px 0 17px 58px; padding:0; text-align:left; font:600 15px/24px var(--pk-font); color:#163047; }
body #startmenu-r > :is(.pinned,.tuijian) { display:block; flex:none; margin:0 0 16px; padding:0; width:100%; height:auto; min-height:0; overflow:visible; background:transparent; border:0; box-shadow:none; border-radius:0; backdrop-filter:none; }
body #startmenu-r .pinned .apps { max-height:none !important; height:auto !important; overflow:visible !important; flex:none; width:100%; }
body #startmenu-r .tuijian .apps { width:100%; max-height:none; height:auto; overflow:visible; }
body #startmenu-r .tuijian .tj-obj { flex:none; max-width:100%; }
body #startmenu-r .tuijian .tj-obj > div { min-width:0; }
body #startmenu-r .tuijian .tj-obj p { white-space:normal; }
body #startmenu-r .row1 > .tool { display:flex; flex-direction:column; align-items:flex-start; padding:4px 0 0; }
body #startmenu-r .more-btn { background:transparent !important; color:#5956e9 !important; box-shadow:none !important; border:0 !important; padding:4px 2px; font:500 11px var(--pk-font); }
body #startmenu-r .title { min-height:24px; }
body #startmenu-r .pinned .sm-app.start > p { font-size:11px; }
#pk-menu-actions button > .pk-fa, #pk-menu-actions button::after { display:none !important; }
@media(max-width:700px){
 body #dock-box .dock-apps > .dock-phone-more, body #dock-box .dock-apps > #copilot-btn { display:none !important; }
 body #os-menubar .mb-mark > span { display:inline !important; }
 body #start-menu { overflow:auto; }
 body #start-menu .startmenu-name { margin-bottom:12px; }
}
@media(max-width:380px){ body #dock-box .dock-apps > .dock-btn[onclick="openapp('chrome')"] { display:none !important; } }
/* Every pinned tile uses the same icon center, including the original brand mark. */
body #startmenu-r .pinned .sm-app > img { align-self:center !important; }
body #win-explorer .menu > .tags { display:none !important; }
/* Explorer is a continuous working surface, with quiet navigation controls. */
body .window.tabs > .titbar > div:not(.tabs) { order:-2; flex:none; margin-right:14px; }
body .window.tabs > .titbar > .tabs { min-width:0; width:auto; margin:0; }
body #win-explorer > .page > .menu { min-width:190px; width:190px; margin:0; padding:12px 8px; box-sizing:border-box; border-right:1px solid #d6e2eb; background:rgba(230,241,248,.5); }
body #win-explorer > .page > .menu > .card { border:0; border-radius:0; box-shadow:none; background:transparent; margin:0; padding:0; backdrop-filter:none; }
body #win-explorer .menu .card > .title { color:#536d80; font-size:11px; text-transform:uppercase; letter-spacing:.05em; padding:8px; }
body #win-explorer .menu .card > list > a { font-size:12px; min-height:40px; padding:4px 8px; gap:6px; text-decoration:none; }
body #win-explorer .menu a > span { text-decoration:none; }
body #win-explorer > .page > .main { padding:0; }
body #win-explorer > .page > .main > .content { border:0; border-radius:0; box-shadow:none; background:rgba(255,255,255,.7); margin:0; width:100%; padding:20px 16px; box-sizing:border-box; }
body #win-explorer > .path { height:48px; min-height:48px; padding:4px 10px; box-sizing:border-box; border-bottom:1px solid #d6e2eb; }
body #win-explorer > .path > .btn { color:#35556e; background:transparent; box-shadow:none; min-width:32px; min-height:34px; height:34px; border:0; margin:0 2px; border-radius:7px; }
body #win-explorer > .path > .btn:hover { background:#dceaf4; }
body #win-explorer > .path > .tit { border:1px solid #cfdde8; box-shadow:none; background:rgba(255,255,255,.75); border-radius:8px; min-height:32px; font-size:12px; }
body #win-explorer > .path > .search input { font-size:12px; box-shadow:none; border:1px solid #cfdde8; border-radius:8px; }
body #win-explorer > .page > .main > .tool { box-sizing:border-box; height:46px; min-height:46px; padding:3px 12px; margin:0; border-bottom:1px solid #d6e2eb; }
body #win-explorer > .page > .main > .tool > .b { font-size:12px; min-height:36px; height:36px; box-shadow:none; background:transparent; }
@media(max-width:700px) {
 body #win-explorer > .page > .menu { display:none !important; }
 body #win-explorer > .path > .btn { min-width:36px; }
 body #win-explorer > .page > .main > .tool { overflow-x:auto; flex:none; }
 body #win-explorer > .page > .main > .tool > .b { flex:none; }
}
body #win-explorer .menu .card > list > a:is(:hover,.check) { color:#174c77 !important; background:#e1edf6 !important; box-shadow:none; }
body #win-explorer .menu .card > list > a:is(:hover,.check) > span { color:#174c77 !important; }
body #start-menu .pk-start-empty { font-size:12px; line-height:1.5; margin:12px 8px; color:#52697b; }
body #start-menu .pk-start-empty[hidden] { display:none; }
/* Utility windows use the same readable light palette as the shell. */
body #win-setting { --text:#163047; --text2:#52697b; --href:#5956e9; color:#163047; }
body #win-setting .page :is(p,span,h1,h2,h3,icon,.s-icon) { color:#163047 !important; }
body #win-setting input.input { background:rgba(255,255,255,.86); color:#163047; border:1px solid #a9becf; box-shadow:none; border-radius:9px; }
body #win-setting .setting-card { background:rgba(255,255,255,.78); border:1px solid #d6e3ed; border-radius:12px; box-shadow:none; }
body #win-setting .menu list > a { color:#314f68; text-decoration:none; }
body #win-setting .menu list > a:is(:hover,.check) { color:#174c77 !important; background:#e1edf6 !important; box-shadow:none; }
body #win-about > .menu { border-right:1px solid #d6e2eb; background:rgba(230,241,248,.45); padding:16px 12px; box-sizing:border-box; }
body #win-about > .menu > list { padding:0 !important; margin:0; height:auto; display:block; }
body #win-about > .menu a { display:block; padding:10px; border-radius:8px; color:#314f68; text-decoration:none; font-size:13px; }
body #win-about > .menu a:is(:hover,.check) { color:#174c77; background:#e1edf6 !important; box-shadow:none; }
body #win-about > .cnt { padding:20px 24px; box-sizing:border-box; }
body #win-about > .cnt h1 { margin-top:0; font-size:28px; line-height:1.2; }
body #win-about > .cnt h2 { font-size:20px; line-height:1.3; }
body #win-about > .cnt p { font-size:14px; line-height:1.7; }
@media(max-width:700px) {
 body #win-setting > .page { padding:16px; }
 body #win-setting .cnt.home > div[style] { margin:18px 0 !important; width:100% !important; align-items:center; }
 body #win-setting .cnt.home .s-icon { font-size:44px !important; margin:0 16px 0 0 !important; }
 body #win-setting .cnt.home > .divider { display:block; }
 body #win-setting .cnt.home > .divider > * { width:100%; }
 body #win-setting .setting-card { padding:16px; }
 body #win-about { flex-direction:column; }
 body #win-about > .menu { width:100% !important; min-width:0; max-width:none; flex:none; padding:8px 12px; border-right:0; border-bottom:1px solid #d6e2eb; }
 body #win-about > .menu > list { display:flex; gap:8px; overflow:auto; }
 body #win-about > .menu a { min-height:44px; display:flex; align-items:center; padding:0 12px; white-space:nowrap; }
 body #win-about > .cnt { width:100%; min-height:0; padding:18px; }
 body #win-about > .cnt:not(.show) { display:none; }
}
/* Legacy centered utility windows must leave room for the menu bar. */
@media(min-width:701px) {
 body .window.window:not(.os-positioned):not(.max):not(.min):not(.left):not(.right) { top:max(50px,calc((100dvh - 720px)/2)) !important; }
}
body #win-setting .setting-card > a.button { width:fit-content !important; max-width:100%; min-height:44px; padding:10px 18px; box-sizing:border-box; }
/* Parody documents and playable tools share the completed glass material. */
body .clut-back { background:rgba(30,56,75,.18); backdrop-filter:blur(10px); }
body .clut-dlg { width:min(520px,calc(100vw - 32px)); color:#163047; background:rgba(249,253,255,.94); border:1px solid #ffffffde; border-radius:20px; box-shadow:0 24px 80px #17364a45,inset 0 1px 0 white; backdrop-filter:blur(28px); }
body .clut-dlg .clut-bar { min-height:52px; padding:8px 18px; background:transparent; border-bottom:1px solid #dce6ee; box-sizing:border-box; }
body .clut-dlg .clut-title { font-size:13px; color:#163047; }
body .clut-dlg .clut-x { width:36px; height:36px; min-width:36px; display:grid; place-items:center; border:0; border-radius:8px; color:#36556c; background:transparent; box-shadow:none; }
body .clut-dlg .clut-in { padding:24px; }
body .clut-dlg :is(.clut-body,.clut-punch,.clut-field,.clut-label,.clut-status) { color:#163047; }
body .clut-dlg .clut-btn { min-height:44px; font:600 13px var(--pk-font); border-radius:10px; border:1px solid #b9cede; background:#f6faff; box-shadow:none; color:#174668; }
body .clut-dlg .clut-btn.clut-pri { color:white; border-color:#5956e9; background:#5956e9; }
body .clut-dlg .clut-input { background:white; color:#163047; border:1px solid #a9becf; border-radius:9px; min-height:44px; font-size:16px; }
body .clut-dlg.pk-game-dialog,body .clut-dlg:has(.pk-play) { width:min(560px,calc(100vw - 32px)); }
body .pk-play-intro { font-size:14px; line-height:1.6; color:#475e73; margin:0 0 24px; }
body .pk-play-count { font-size:12px; color:#536d80; }
body .pk-play-track { height:6px; background:#d9e6ee; border:0; box-shadow:none; border-radius:6px; }
body .pk-play-track span { height:100%; background:#27a9bc; border-radius:6px; }
body .pk-play-q { font-size:23px; line-height:1.4; min-height:64px; margin:22px 0; color:#163047; font-weight:600; }
body .pk-play .clut-row { display:flex; gap:12px; }
body .pk-play .clut-btn[data-pk-play] { flex:1; min-height:48px; color:#174668; background:#e7f2fa; border:1px solid #b9cede; box-shadow:none; }

/* Owner review: the controls are anchored to Start, never to its clock. */
body #start-menu > .pk-start-controls { position:absolute; top:12px; right:12px; z-index:5; display:flex; gap:4px; width:auto; margin:0; }
body #start-menu .pk-start-controls > button { display:grid; place-items:center; width:36px; height:36px; padding:8px; border:0; border-radius:8px; color:#263545; background:transparent; box-shadow:none; cursor:pointer; }
body #start-menu .pk-start-controls > button:hover,
body #start-menu .pk-start-controls > button[aria-expanded=true] { background:rgba(89,86,233,.09); }
body #start-menu .pk-start-controls > button > svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
body #start-menu .pk-start-controls > button[aria-pressed=true] svg { transform:rotate(180deg) scale(.8); }
body #startmenu-r .row1 { padding-right:90px; min-height:64px; }
body #start-menu #startmenu-r .row1 > .tool { width:auto; margin:0; }
body #start-menu #pk-power-menu { position:absolute; top:43px; right:0; width:184px; padding:5px; background:#fff; border:1px solid #dedfea; border-radius:10px; box-shadow:0 12px 28px #27344826; }
body #start-menu #pk-power-menu[hidden] { display:none !important; }
body #start-menu #pk-power-menu > button { display:block; text-align:left; width:100%; min-height:42px; padding:9px 12px; color:#263545; font:500 13px var(--pk-font); border:0; border-radius:6px; background:transparent; box-shadow:none; cursor:pointer; }
body #start-menu #pk-power-menu > button:hover { background:#f0efff; }
body #start-menu.max { top:50px !important; bottom:90px !important; left:20px !important; right:20px !important; transform:none !important; width:auto !important; height:auto !important; max-width:none !important; max-height:none !important; }

/* Compact labeled launchers. Notes and Update are always outside scrolling. */
body #dock-box { --dock-tile:54px; --dock-icon:32px; height:62px; padding:5px 7px; gap:5px; border-radius:18px; }
body #dock-box .dock-start { gap:5px; }
body #dock-box .dock-apps { gap:4px; }
body #dock-box :is(.dock-btn,.dock-btn.pin,#taskbar > a) { flex-direction:column; gap:2px; height:50px; border-radius:9px; position:relative; }
body #dock-box :is(.dock-btn,.dock-btn.pin,#taskbar > a) > img { margin:0; flex:none; }
body #dock-box #start-btn.dock-btn { flex:0 0 44px; width:44px; min-width:44px; height:50px; padding:0; gap:5px; }
body #dock-box #start-btn.dock-btn .pd-mark { width:28px; height:28px; border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; filter:none !important; }
body #dock-box #start-btn .start-label { font-weight:500; }
body #dock-box .pk-dock-label { display:block !important; position:static; width:auto; height:auto; padding:0; margin:0; overflow:visible; clip-path:none; max-width:100%; color:#263545; font:500 10px/12px var(--pk-font); white-space:nowrap; text-align:center; }
body #dock-box .dock-key { flex:0 0 44px; width:44px; min-width:44px; height:50px; flex-direction:column; gap:4px; padding-left:5px; background:transparent; }
body #dock-box .dock-key svg { width:23px; height:26px; }
body #dock-box .dock-key::after { top:4px; right:6px; width:5px; height:5px; }
body #dock-box .dock-btn.run::after { bottom:0; height:3px; width:3px; border:0; background:var(--pk-accent); }
body #dock-box #notes-btn { flex-shrink:0; }
body #os-notes.notes-front { z-index:90; }
@media(min-width:701px) and (max-height:500px){
 body #desktop.clut-free > div.b.clut { display:flex; flex-direction:column; align-items:center; justify-content:flex-start; padding:0; gap:2px; width:84px !important; height:76px !important; min-height:76px !important; }
 body #desktop.clut-free > div.b.clut > img { width:36px !important; height:36px !important; margin:0 !important; }
 body #desktop.clut-free > div.b.clut > p { margin:0 !important; min-height:28px; max-height:28px; font-size:11px; line-height:14px; }
}
body #os-menubar .mb-mark img, body #start-menu .sm-app.start img { background:none !important; border:0 !important; border-radius:0 !important; filter:none !important; box-shadow:none !important; }
@media(min-width:701px) and (max-width:779px) and (max-height:500px){
 body #desktop.clut-free > div.b.clut { width:72px !important; }
}
@media(max-width:700px){
 body #dock-box { --dock-tile:44px; --dock-icon:28px; gap:3px; padding:5px; max-width:calc(100vw - 12px); height:62px; }
 body #dock-box .dock-start, body #dock-box .dock-apps { gap:2px; }
 body #dock-box .pk-dock-label,body #dock-box #start-btn .start-label { font-size:9px; line-height:12px; }
 body #dock-box #start-btn.dock-btn .pd-mark { width:26px; height:26px; }
 body #start-menu > .pk-start-controls { top:12px; right:10px; }
 body #start-menu .pk-start-controls > button { width:44px; height:44px; }
 body #start-menu .startmenu-name { max-width:calc(100% - 146px); }
 body #start-menu.max { top:46px !important; bottom:82px !important; left:8px !important; right:8px !important; }
 body #start-menu #pk-power-menu { top:48px; }
}
body .pk-play .clut-btn[data-pk-play] > .pk-fa { display:none; }
/* Emil design engineering: feedback, fast reversible menus and stable chrome. */
body #os-menubar .mb-mark { flex:none; white-space:nowrap; }
body #os-menubar #pk-menu-actions { flex:none; }
body #os-menubar .mb-spacer { min-width:0; }
body #os-menubar #os-halo { min-width:0; flex:0 1 auto; transition:none; }
body #os-menubar #os-halo > :not(.note) { flex-shrink:0; white-space:nowrap; }
body #os-menubar #os-halo .note { min-width:0; flex:0 1 auto; overflow:hidden; }
body #os-menubar #os-halo .note > div { min-width:0; }
body #start-menu, body #start-menu.max {
  opacity:0; transform-origin:50% 100%;
  transition:transform 180ms var(--pk-ease), opacity 140ms var(--pk-ease);
}
body #start-menu { transform:translateX(-50%) translateY(16px); }
body #start-menu.show { opacity:1; }
body #start-menu:not(.show) { pointer-events:none; }
body #start-menu > :is(#startmenu-l,#startmenu-r) { transition:none; }
#pk-shell-menu, body #start-menu #pk-power-menu {
  opacity:1; transform:none;
  transition:opacity 140ms var(--pk-ease), transform 180ms var(--pk-ease);
}
#pk-shell-menu { transform-origin:18px 0; }
body #start-menu #pk-power-menu { transform-origin:calc(100% - 18px) 0; }
@starting-style {
  #pk-shell-menu, body #start-menu #pk-power-menu { opacity:0; transform:translateY(-3px) scale(.97); }
}
body :is(#pk-menu-actions,#pk-shell-menu,.pk-start-controls) button,
body #dock-box :is(.dock-btn,.dock-key),
.pk-unlock-back :is(.pk-unlock-primary,.pk-unlock-later,.pk-unlock-close) {
  touch-action:manipulation;
  transition:scale 120ms var(--pk-ease), background-color 120ms var(--pk-ease);
}
body :is(#pk-menu-actions,#pk-shell-menu,.pk-start-controls) button:active,
.pk-unlock-back :is(.pk-unlock-later,.pk-unlock-close):active {
  scale:.97; background-color:rgba(89,86,233,.13); transition-duration:0ms;
}
body #dock-box :is(.dock-btn,.dock-key):active { background-color:rgba(89,86,233,.16); transition-duration:0ms; }
body :is(#pk-menu-actions,#pk-shell-menu,.pk-start-controls) button:focus-visible {
  outline:2px solid var(--pk-accent); outline-offset:-2px;
}
@media(max-width:1000px) { body #os-menubar #os-halo :is(.when-d,.wx,.sep) { display:none; } }
@media(max-width:700px) { body #os-menubar #os-halo .note { display:none; } }
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more) {
  body :is(#os-menubar,#dock-box,#start-menu,#pk-shell-menu,#pk-power-menu,.window.window,.clut-dlg,.pk-toast,#pk-update-toast),
  body #loginback > .lock-core.pk-spatial-glass {
    background:#f5faff !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
  }
}
@media(prefers-contrast:more) {
  body :is(#os-menubar,#dock-box,#start-menu,#pk-shell-menu,#pk-power-menu,.window.window,.clut-dlg,.pk-toast,#pk-update-toast) {
    border:1px solid var(--pk-text) !important;
  }
}
html[data-pk-input="keyboard"] :is(#start-menu,#dock-box,#pk-shell-menu,.window),
html[data-pk-input="keyboard"] :is(#start-menu,#dock-box,#pk-shell-menu,.window) * {
  transition:none !important; animation:none !important;
}
@media(prefers-reduced-motion:reduce) {
  #pk-shell-menu,body #start-menu #pk-power-menu { transform:none; transition:none; }
  body :is(#pk-menu-actions,#pk-shell-menu,.pk-start-controls) button:active,
  .pk-unlock-back :is(.pk-unlock-later,.pk-unlock-close,.pk-unlock-primary):active { scale:1; transform:none; }
}
body .pk-play-a { color:#475e73; border-color:#7b9bb0; line-height:1.6; }
body .pk-play-a.pk-play-ok { color:#086351; border-color:#16846a; }
body .pk-game-dialog .clut-punch { font-size:24px; line-height:1.45; margin:4px 0 28px; }
@media(max-width:700px){ body .clut-dlg .clut-in { padding:20px; } body .pk-play-q { font-size:21px; } }

/* Shared role declarations stay after the inherited compact breakpoints. */
body #startmenu-l > list > .text, body #startmenu-r .pinned > .title { font-family:var(--pk-font-subtitle); font-weight:500; }
body #startmenu-r :is(.pinned,.tuijian) > .title > p { font-family:var(--pk-font-subtitle); font-weight:500; }
body #loginback #login-phone,body #loginback #login-phone-mask { letter-spacing:.08em; }
body #loginback > .lock-core > .name { font-family:var(--pk-font-display); font-weight:400; letter-spacing:0; }
@media(max-width:400px) { body #loginback > .lock-core > .name { font-size:22px; } }
@media(max-width:360px) { body #loginback > .lock-core > .name { font-size:20px; } }
/* The menu's single entrance owns motion. Its contents must never stage in
   half a second later or stay blank under the reduced-motion preference. */
body #start-menu.show #startmenu-r > :is(.row1,.pinned,.tuijian) {
  opacity:1; transform:none; transition:none;
}
@media(prefers-reduced-motion:reduce) {
  body #start-menu,body #start-menu * { transition:none !important; animation:none !important; }
}

/* Owner's glass reference: a luminous rim, visible frosting and quiet depth.
   The 90% access material keeps copy opaque; the clock is lighter glass. */
body.pekan-coastal #loginback { gap:18px; padding-top:24px; padding-bottom:max(20px,env(safe-area-inset-bottom)); }
body.pekan-coastal #loginback > .lock-clock {
  display:block !important; width:min(430px,100%); margin:auto 0 0;
  text-shadow:none;
}
body.pekan-coastal #loginback .lock-time {
  width:max-content; max-width:100%; margin:0 auto; padding:6px 28px 10px;
  font:900 clamp(80px,8.5vw,112px)/1.1 var(--pk-font);
  font-variation-settings:normal; font-synthesis:none;
  letter-spacing:-.04em; font-variant-numeric:tabular-nums;
  color:#000; background:rgba(250,253,255,.4);
  border:1px solid rgba(255,255,255,.85); border-radius:28px;
  backdrop-filter:blur(24px) saturate(145%); -webkit-backdrop-filter:blur(24px) saturate(145%);
  box-shadow:inset 0 2px 1px rgba(255,255,255,.92),inset 0 -1px 1px rgba(255,255,255,.45),0 12px 38px -18px rgba(22,48,71,.38);
  text-shadow:0 1px 0 rgba(255,255,255,.7);
}
body.pekan-coastal #loginback .lock-date {
  width:max-content; max-width:100%; margin:10px auto 0; padding:7px 16px;
  color:#000; font:500 11px/1.5 var(--pk-font-subtitle);
  background:rgba(250,253,255,.4); border:1px solid rgba(255,255,255,.85); border-radius:999px;
  backdrop-filter:blur(24px) saturate(145%); -webkit-backdrop-filter:blur(24px) saturate(145%);
  box-shadow:inset 0 2px 1px rgba(255,255,255,.92),inset 0 -1px 1px rgba(255,255,255,.45),0 12px 38px -18px rgba(22,48,71,.38);
}
body.pekan-coastal #loginback > .lock-core.pk-spatial-glass {
  width:min(460px,100%);
  border-color:rgba(255,255,255,.96); border-radius:24px;
  box-shadow:inset 0 2px 1px #fff,inset 0 -1px 1px rgba(255,255,255,.6),0 26px 65px -18px rgba(22,48,71,.33);
}
body #loginback > .lock-core > .lock-head { justify-content:space-between; margin-bottom:18px; }
body #loginback > .lock-core > .name {
  text-align:center; width:100%; font-size:34px; line-height:1.2; text-wrap:initial;
}
body #loginback .lock-title-line { display:block; white-space:nowrap; }
body #loginback .lock-copy-line { display:block; }
html[lang="fr"] body #loginback > .lock-core > .name { font-size:28px; }
body #loginback #os-lock-funnel { text-align:center; max-width:none; width:100%; margin:14px auto 22px; line-height:1.6; }
body #loginback .lock-core > .lock-preview-badge {
  position:static; inset:auto; margin:0 0 9px; text-align:center; text-transform:none;
  color:#5956e9; border:0; border-radius:0; background:none; box-shadow:none; padding:0;
  font-family:var(--pk-font-subtitle); font-size:10px; font-weight:500; line-height:1.5; letter-spacing:0;
}
body #loginback #login {
  min-height:50px; border-radius:999px; letter-spacing:normal; column-gap:0;
  background-color:#5956e9; border-color:#5956e9;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 7px 18px -9px rgba(66,62,243,.45);
  transition:background-color 120ms var(--pk-ease),scale 120ms var(--pk-ease);
}
body #loginback #login:active { scale:.98; background-color:#423ef3; transition-duration:0ms; }
body #loginback #login:disabled { scale:1; }
body #loginback .lock-head button {
  background:rgba(255,255,255,.46) !important; border:1px solid rgba(255,255,255,.88) !important;
  border-radius:50% !important; box-shadow:inset 0 1px 0 #fff !important;
}
body #loginback > .langselect.new { width:min(460px,100%); gap:4px; box-shadow:inset 0 1px 0 #fff,0 12px 28px -16px rgba(22,48,71,.3); }
body #loginback .langselect .lock-site { text-transform:none !important; gap:0; font-size:12px; }
body #loginback #os-lock-phone-err:empty { display:none; }
body #startmenu-l > list > .text,
body #startmenu-r :is(.pinned,.tuijian) > .title > p,
body #win-explorer .menu .card > .title,
body .clut-dlg :is(.clut-kicker,.clut-tagline),
body .pk-unlock-filename {
  color:#5956e9; background:none; border:0; border-radius:0; box-shadow:none;
}
body :is(.pk-toast-actions button,.pk-up-btn,.clut-pri) { letter-spacing:normal; }
body :is(.buttons > .submit,.slider-btn,.tk-btn,.tk-ios-btn) {
  background:#5956e9 !important; color:#fff !important; text-shadow:none;
}
body :is(.buttons > .submit,.tk-btn,.tk-ios-btn):is(:hover,:active) { background-color:#423ef3 !important; }
body :is(#start-menu,#pk-shell-menu,.window.window,.clut-dlg) {
  border-color:rgba(255,255,255,.96);
  box-shadow:inset 0 2px 1px rgba(255,255,255,.94),inset 0 -1px 1px rgba(255,255,255,.38),0 24px 65px -18px rgba(22,48,71,.3);
}
@media(max-width:620px) {
  body.pekan-coastal #loginback { padding:18px 16px max(16px,env(safe-area-inset-bottom)); gap:16px; }
  body.pekan-coastal #loginback .lock-time { font-size:76px; padding:4px 20px 9px; border-radius:24px; }
  body #loginback > .lock-core > .name { font-size:28px; }
  html[lang="fr"] body #loginback > .lock-core > .name { font-size:23px; }
  body #loginback > .lock-core > .lock-head { margin-bottom:16px; }
  body #loginback #os-lock-funnel { font-size:13px; }
  body.pekan-coastal #loginback.lock-typing > .lock-clock { display:none !important; }
}
@media(max-width:360px) {
  body.pekan-coastal #loginback { padding-left:12px; padding-right:12px; }
  body.pekan-coastal #loginback > .lock-core.pk-spatial-glass { padding:20px 16px; }
  body #loginback > .lock-core > .name { font-size:24px; }
  html[lang="fr"] body #loginback > .lock-core > .name { font-size:20px; }
}
@media(max-height:680px) {
  body.pekan-coastal #loginback { gap:10px; padding-top:12px; padding-bottom:12px; }
  body.pekan-coastal #loginback .lock-time { font-size:56px; padding:1px 18px 4px; border-radius:20px; }
  body.pekan-coastal #loginback .lock-date { font-size:9px; margin-top:4px; padding:4px 12px; }
  body.pekan-coastal #loginback > .lock-core.pk-spatial-glass { margin-top:0; padding:12px 22px; }
  body #loginback > .lock-core > .lock-head { margin-bottom:6px; }
  body #loginback > .lock-core > .name { font-size:26px; }
  html[lang="fr"] body #loginback > .lock-core > .name { font-size:23px; }
  body #loginback .lock-core > .lock-preview-badge { margin-bottom:6px; font-size:9px; }
  body #loginback #os-lock-funnel { margin:8px auto 12px; font-size:12px; }
  body #loginback #login-form { gap:8px; }
}
@media(max-height:450px) {
  body.pekan-coastal #loginback > .lock-clock { display:none !important; }
}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more) {
  body.pekan-coastal #loginback :is(.lock-time,.lock-date) { background:#f5faff; backdrop-filter:none; -webkit-backdrop-filter:none; }
}
@supports not (backdrop-filter:blur(1px)) {
  body.pekan-coastal #loginback :is(.lock-time,.lock-date) { background:#f5faff; }
}
@media(prefers-reduced-motion:reduce) { body #loginback #login:active { scale:1; } }

/* ===== Claude final review (September 7, 2026) =====
   Owner request: glassmorphism across the shell (frosted, luminous rim,
   diagonal sheen, soft depth; text and controls stay opaque), the black
   two-tone PD mark, a real avatar with a working account menu, Brigends
   headlines, a normal Browser title bar, a phone Explorer path bar that
   wraps, and captioned running-app tiles. */
:root:root {
  --pk-glass: rgba(247,252,255,.72);
  --pk-glass-strong: rgba(250,253,255,.8);
  --pk-glass-sheen: linear-gradient(135deg,rgba(255,255,255,.58) 0%,rgba(255,255,255,.14) 42%,rgba(255,255,255,.06) 60%,rgba(255,255,255,.3) 100%);
  --pk-glass-edge: rgba(255,255,255,.92);
  --pk-glass-blur: blur(30px) saturate(160%);
  --pk-glass-shadow: inset 0 1.5px 0 rgba(255,255,255,.96),inset 0 -1px 0 rgba(255,255,255,.35),0 26px 60px -24px rgba(22,48,71,.42),0 6px 18px -10px rgba(22,48,71,.18);
}
body #os-menubar, body #dock-box {
  background:var(--pk-glass-sheen),var(--pk-glass); border-color:var(--pk-glass-edge);
  backdrop-filter:var(--pk-glass-blur); -webkit-backdrop-filter:var(--pk-glass-blur);
  box-shadow:var(--pk-glass-shadow);
}
body #os-menubar { box-shadow:inset 0 -1px 0 rgba(255,255,255,.6),0 10px 30px -16px rgba(22,48,71,.3); }
body #start-menu, #pk-shell-menu, body #start-menu #pk-power-menu {
  background:var(--pk-glass-sheen),var(--pk-glass); border:1px solid var(--pk-glass-edge);
  backdrop-filter:var(--pk-glass-blur); -webkit-backdrop-filter:var(--pk-glass-blur);
  box-shadow:var(--pk-glass-shadow);
}
body .window.window,:root.mica body .window.foc,:root.mica body .window:not(.foc),:root.mica body .window.webapp {
  background:var(--pk-glass-sheen),var(--pk-glass) !important; border-color:var(--pk-glass-edge);
  backdrop-filter:var(--pk-glass-blur) !important; -webkit-backdrop-filter:var(--pk-glass-blur) !important;
  box-shadow:var(--pk-glass-shadow);
}
body .window.window > .titbar { background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,.18)); }
body .window.explorer :is(.path,.tool,.nav,.bottom), body .window.setting :is(.page,.menu,.cnt) { background:rgba(244,250,255,.5); }
body .window.explorer .content, body .window.calc .content, body .window.taskmgr .content, body .window.about .content { background:rgba(255,255,255,.55); }
body #win-explorer > .page > .main > .content { background:rgba(255,255,255,.5); }
body #win-explorer > .page > .menu, body #win-about > .menu { background:rgba(230,241,248,.35); }
body :is(#cm,#notice,.clut-sheet,.clut-dialog,.pk-toast,#pk-update-toast,#search-win,#control,#datebox), body .clut-dlg {
  background:var(--pk-glass-sheen),var(--pk-glass-strong); border:1px solid var(--pk-glass-edge);
  backdrop-filter:var(--pk-glass-blur); -webkit-backdrop-filter:var(--pk-glass-blur);
  box-shadow:var(--pk-glass-shadow);
}
.pk-unlock-back .pk-unlock-panel { background:var(--pk-glass-sheen),var(--pk-glass-strong); border:1px solid var(--pk-glass-edge); box-shadow:var(--pk-glass-shadow); }
body.pekan-coastal #loginback > .lock-core.pk-spatial-glass {
  background:var(--pk-glass-sheen),var(--pk-glass-strong); border-color:var(--pk-glass-edge);
  backdrop-filter:var(--pk-glass-blur); -webkit-backdrop-filter:var(--pk-glass-blur);
  box-shadow:var(--pk-glass-shadow);
}
body #loginback > .langselect.new { background:var(--pk-glass-sheen),var(--pk-glass); border-color:var(--pk-glass-edge); backdrop-filter:var(--pk-glass-blur); -webkit-backdrop-filter:var(--pk-glass-blur); }
body.pekan-coastal #loginback :is(.lock-time,.lock-date) { background:var(--pk-glass-sheen),rgba(250,253,255,.4); }
body #loginback .pk-phone, body #startmenu-l > .pk-start-search { background:rgba(255,255,255,.82); }
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more) {
  body :is(#os-menubar,#dock-box,#start-menu,#pk-shell-menu,#pk-power-menu,.window.window,.clut-dlg,.pk-toast,#pk-update-toast),
  .pk-unlock-back .pk-unlock-panel, body #loginback > .langselect.new,
  body #loginback > .lock-core.pk-spatial-glass, body.pekan-coastal #loginback :is(.lock-time,.lock-date) {
    background:#f5faff !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
  }
}
@supports not (backdrop-filter:blur(1px)) {
  body :is(#os-menubar,#dock-box,#start-menu,#pk-shell-menu,.window.window,.clut-dlg,.pk-toast,#pk-update-toast), .pk-unlock-back .pk-unlock-panel,
  body #loginback > .lock-core.pk-spatial-glass, body #loginback > .langselect.new { background:#f5faff !important; }
}

/* Tablets keep the desktop label box but gain the same pale backing where names cross the vehicle. */
@media(min-width:701px) and (max-width:1024px) {
  body #desktop > div.b > p, body #desktop.clut-free > div.b.clut > p { background:rgba(247,252,255,.9) !important; border-radius:5px; text-shadow:none !important; padding:0 4px; }
}

/* The black two-tone PD mark reads on light glass; no tile, filter or border. */
body #dock-box #start-btn.dock-btn .pd-mark, body #os-menubar .mb-mark img { object-fit:contain; }
body #os-menubar .mb-mark img { width:24px; height:24px; }

/* A real avatar in the menu bar and Start; the account control actually opens something. */
body #os-menubar #os-halo .av, body #os-menubar #os-halo button.av {
  appearance:none; -webkit-appearance:none; width:26px; height:26px; min-width:26px; padding:0; margin:0 0 0 2px;
  border:0; border-radius:50%; overflow:hidden; background:#dfe9f3; color:#163047; font-size:0; line-height:0;
  box-shadow:0 0 0 1.5px rgba(255,255,255,.95),0 1px 4px rgba(22,48,71,.28); cursor:pointer; display:grid; place-items:center;
  transition:box-shadow 120ms var(--pk-ease), scale 120ms var(--pk-ease);
}
body #os-menubar #os-halo .av:hover, body #os-menubar #os-halo .av[aria-expanded=true] { box-shadow:0 0 0 2px #5956e9,0 1px 4px rgba(22,48,71,.28); }
body #os-menubar #os-halo .av:active { scale:.94; transition-duration:0ms; }
body #os-menubar #os-halo .av:focus-visible { outline:2px solid #5956e9; outline-offset:2px; }
body .pk-guest-avatar { display:block; width:100%; height:100%; object-fit:cover; }
body #start-menu #startmenu-user { padding:0; overflow:hidden; border-radius:50%; background:#dfe9f3; display:grid; place-items:center; }
body #start-menu #startmenu-user > img { width:100%; height:100%; max-width:none; max-height:none; object-fit:cover; }
#pk-shell-menu .pk-menu-head { margin:0 0 4px; padding:8px 12px 10px; border-bottom:1px solid rgba(45,86,120,.12); color:#163047; font:600 13px/1.3 var(--pk-font); }
#pk-shell-menu .pk-menu-head small { display:block; margin-top:2px; color:#52697b; font:400 11px/1.3 var(--pk-font); }

/* The Browser wears the same title bar as every other window; its tab strip lives in the app. */
body .window.chrome > .titbar, body .window.chrome.webapp > .titbar, body .window.chrome.webapp.foc > .titbar {
  position:relative !important; top:auto; right:auto; left:auto; width:auto !important; z-index:auto;
  min-height:42px; height:42px; padding:0 0 0 10px; box-sizing:border-box; border-bottom:1px solid rgba(45,86,120,.12);
  background:linear-gradient(180deg,rgba(255,255,255,.55),rgba(255,255,255,.18)) !important;
  backdrop-filter:none; -webkit-backdrop-filter:none; box-shadow:inset 0 1px 0 #fff;
}
body .window.chrome > .titbar > p { display:flex; }
body .window.chrome > .titbar > div { margin-left:0; margin-right:auto; }
/* On phones a tap leaves a sticky hover; the old Win12 red hover block must not paint over the traffic dot. */
@media(max-width:700px) {
  body .window.window > .titbar .wbtg:hover, body .window.window > .titbar .wbtg.red:hover { background:transparent !important; color:transparent; transform:none; scale:1; }
}
@media(min-width:701px) {
  body .window.chrome > .titbar .wbtg { height:13px; }
  body .window.chrome > .titbar .wbtg:hover { background-color:var(--traffic-color) !important; }
}

/* Running-app tiles are captioned like the pinned launchers. */
body #dock-box #taskbar { width:auto !important; max-width:none; gap:4px; }
body #dock-box #taskbar > a { overflow:hidden; }
body #dock-box #taskbar > a > .pk-dock-label { max-width:calc(100% - 4px); overflow:hidden; text-overflow:ellipsis; }
body #dock-box #start-btn.dock-btn .pd-mark { width:31px; height:31px; }
@media(max-width:700px) {
  body #dock-box #taskbar { max-width:48px; }
  body #dock-box #taskbar > a > .pk-dock-label { display:none !important; }
  body #dock-box #taskbar > a { height:44px; }
}

/* Brigends on shell headlines. */
body #win-about > .cnt h1, body #win-about > .cnt h2 { font-family:var(--pk-font-display); font-weight:400; font-synthesis:none; letter-spacing:0; text-wrap:balance; }
body #win-about > .cnt h1 { font-size:24px; }
body #win-about > .cnt h2 { font-size:17px; }

/* Phone Explorer: the path bar wraps so the search row no longer lands on the toolbar. */
@media(max-width:700px) {
  body #win-explorer > .path { flex:none; height:auto; min-height:48px; flex-wrap:wrap; padding:6px 8px; gap:6px; }
  body #win-explorer > .path > .tit { flex:1 1 0; min-width:0; overflow-x:auto; overflow-y:hidden; white-space:nowrap; scrollbar-width:none; }
  body #win-explorer > .path > .search { order:4; flex:1 1 100%; width:100%; min-width:0; max-width:none; }
  body #win-explorer > .path > .search > .input { width:100%; float:none; min-height:40px; box-sizing:border-box; }
}

/* ===== Claude mobile audit (September 8, 2026) ===== */
/* Clock ink sat 7-8px lower than centre in its bubble; the line box adds
   descender room below numerals, so the top padding takes the difference. */
body.pekan-coastal #loginback .lock-time { padding:10px 28px 6px; }
@media(max-width:620px) { body.pekan-coastal #loginback .lock-time { padding:8px 20px 5px; } }
@media(max-height:680px) { body.pekan-coastal #loginback .lock-time { padding:4px 18px 2px; } }
/* File labels: the backing box was a fixed two-line height, so one-line names
   left an empty band underneath. The box now hugs its text with even padding. */
@media(max-width:1024px) {
  body #desktop > div.b > p, body #desktop.clut-free > div.b.clut > p {
    min-height:0 !important; max-height:none !important; height:auto; padding:0 5px; line-height:13px;
    /* vertical room comes from a same-colour spread, not padding: padding would reveal a clipped third line */
    box-shadow:0 0 0 3px rgba(247,252,255,.9) !important; margin-top:9px;
  }
}
/* The phone dock is centred, not pinned 10px from the left. */
@media(max-width:700px) {
  body #dock-box { left:0 !important; right:0 !important; margin-inline:auto; width:max-content !important; max-width:calc(100vw - 16px); }
}
/* Calculator: the equals key lost its gradient to the flat-button rule and
   was white on cream. A flat brand fill with white text. */
body #win-calc > .keyb > .b.ans { background:#5956e9 !important; color:#fff !important; box-shadow:none; }
body #win-calc > .keyb > .b.ans:hover { background:#423ef3 !important; backdrop-filter:none; }
/* Phone tab strips: the tab fits the bar, its label ellipsises before the
   close control, and the controls stay 36-40px inside a 48px bar. */
@media(max-width:700px) {
  body .window.window.tabs > .titbar > .tabs { display:flex; align-items:center; gap:4px; flex:1 1 auto; min-width:0; height:auto; padding:0; margin:0 4px 0 2px; }
  body .window.window.tabs > .titbar > .tabs > .tab { display:flex; align-items:center; gap:4px; flex:1 1 auto; min-width:0; max-width:none; height:36px; min-height:36px; padding:0 0 0 10px; border-radius:10px; box-sizing:border-box; }
  body .window.window.tabs > .titbar > .tabs > .tab > img { display:none; }
  body .window.window.tabs > .titbar > .tabs > .tab > :not(.clbtn):not(img) { flex:1 1 auto; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; }
  body .window.window.tabs > .titbar > .tabs > .tab > .clbtn { flex:none; position:static; width:36px; height:36px; min-width:36px; margin:0; }
  body .window.window.tabs > .titbar > .tabs > .tab > .clbtn::before { width:36px; height:36px; }
  body .window.window.tabs > .titbar > .tabs > .new { flex:none; width:40px; height:36px; min-width:40px; margin:0; }
  body .window.window.tabs > .titbar > .tabs > .new::before { width:40px; height:36px; }
}

/* Phone tab strips, second pass: the tab label is a plain block that
   ellipsises, its folder glyph goes, and on narrow phones the three
   traffic lights shrink to 36px so the strip keeps room for a name. */
@media(max-width:700px) {
  body .window.window.tabs > .titbar > .tabs > .tab > p { display:block; flex:1 1 auto; min-width:0; margin:0; padding:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font:500 13px/36px var(--pk-font); background:none; }
  body .window.window.tabs > .titbar > .tabs > .tab > p::before, body .window.window.tabs > .titbar > .tabs > .tab > p > img, body .window.window.tabs > .titbar > .tabs > .tab > img, body .window.window.tabs > .titbar > .tabs > .tab > .icon { display:none !important; }
  body .window.tabs > .titbar > div:not(.tabs) { margin-right:4px; }
  /* the glyphs are icon-font pseudo-elements; they centre in their boxes instead of hugging the top */
  body .window.window.tabs > .titbar > .tabs > .tab > .clbtn::before { position:static; top:auto; left:auto; width:36px; height:36px; line-height:36px; text-align:center; }
  body .window.window.tabs > .titbar > .tabs > .new::before { position:static; top:auto; left:auto; width:40px; height:36px; line-height:36px; text-align:center; }
}
@media(max-width:400px) {
  body .window.window.tabs > .titbar .wbtg { width:36px; min-width:36px; }
}

/* One handoff: BIOS to the existing lockscreen. Skip has no arrival delay. */
html.pk-lock-arrival::after { content:""; position:fixed; inset:0; z-index:2147483646; background:#000; pointer-events:none; animation:pk-lock-arrival 420ms cubic-bezier(.16,1,.3,1) both; }
@keyframes pk-lock-arrival { from { opacity:1; } to { opacity:0; } }
@media(prefers-reduced-motion:reduce) { html.pk-lock-arrival::after { display:none; animation:none; } }