
html,body{margin:0}img{max-width:100%}
a.icon,a.mb-btn,.files a{text-decoration:none;color:inherit}
.files a{width:100%;display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:12px;align-items:center;padding:9px 10px;border-radius:8px;text-align:left}
.files a:hover{background:var(--win-2)}
.win h1{font-family:var(--f-display);font-weight:700;font-size:26px;line-height:1.08;letter-spacing:-.01em;margin:0;text-wrap:balance}

.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.widget .wh{font-family:var(--f-display);font-weight:700;font-size:23px;line-height:1.12;margin:0}
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/figtree-latin-ext-c15953.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/figtree-latin-dab710.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/figtree-latin-ext-c15953.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/figtree-latin-dab710.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/figtree-latin-ext-c15953.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/figtree-latin-dab710.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/fonts/figtree-latin-ext-c15953.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Figtree';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/fonts/figtree-latin-dab710.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/jetbrains-mono-latin-ext-ba1653.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/jetbrains-mono-latin-480c06.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/jetbrains-mono-latin-ext-ba1653.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/jetbrains-mono-latin-480c06.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/unbounded-latin-ext-80da0c.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/unbounded-latin-06f2e4.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/unbounded-latin-ext-80da0c.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/unbounded-latin-06f2e4.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/fonts/unbounded-latin-ext-80da0c.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/fonts/unbounded-latin-06f2e4.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* Layout: the site is a desktop OS. Live wallpapers the visitor can change, app windows with sidebars, dock, spotlight, terminal. Phone: home screen + full-screen sheets. */
:root{
  --acc:#F0A63C; --acc-ink:#1B1204;
  --win:#EEF1EE; --win-2:#E2E7E4; --card:#FFFFFF; --ink:#10181B; --ink-2:#34424A; --muted:#5B676B; --line:#C9D1CE;
  --on-wall:#E6EEEC; --on-wall-dim:#93A9AA; --glass:rgba(12,31,38,.62); --glass-line:rgba(230,238,236,.1);
  --ok:#2E9A63; --dock-tile:46px;
  --f-display:"Unbounded","Arial Black",system-ui,sans-serif;
  --f-body:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,Menlo,monospace;
  color-scheme:dark;
}
:root[data-tone="light"]{--on-wall:#10181B;--on-wall-dim:#4A585D;--glass:rgba(240,243,242,.68);--glass-line:rgba(16,24,27,.12)}
:root[data-win="dark"]{--win:#1A2226;--win-2:#222C31;--card:#26323A;--ink:#E8EEEC;--ink-2:#C2CDCB;--muted:#8FA0A3;--line:#34434B}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{height:100%}
body{background:#0C1F26;color:var(--on-wall);font-family:var(--f-body);font-size:15px;line-height:1.55;overflow:hidden;-webkit-font-smoothing:antialiased}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
#wallpaper{position:fixed;inset:0;width:100%;height:100%;display:block}

/* Menubar */
.menubar{position:fixed;left:0;right:0;top:0;z-index:3000;height:calc(36px + env(safe-area-inset-top,0px));padding:env(safe-area-inset-top,0px) 12px 0;display:flex;align-items:center;gap:6px;background:var(--glass);backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);border-bottom:1px solid var(--glass-line);font-size:13px;color:var(--on-wall)}
.mb-btn{background:none;border:0;padding:4px 9px;border-radius:5px;cursor:pointer;color:var(--on-wall);display:inline-flex;align-items:center;gap:8px}
.mb-btn:hover,.mb-btn.on{background:color-mix(in srgb,var(--on-wall) 12%,transparent)}
.logo svg{height:15px;width:auto;display:block}
.logo svg path{fill:currentColor}
.os{font-family:var(--f-display);font-weight:600;font-size:10.5px;letter-spacing:.08em;color:var(--acc)}
.menubar nav{display:flex;gap:2px}
.menubar .right{margin-left:auto;display:flex;align-items:center;gap:6px;font-family:var(--f-mono);font-size:12px;color:var(--on-wall-dim)}
.lang{display:flex;gap:2px}
.lang button{background:none;border:0;padding:3px 6px;border-radius:4px;cursor:pointer;color:var(--on-wall-dim);font-family:var(--f-mono);font-size:12px}
.lang button[aria-pressed="true"]{background:color-mix(in srgb,var(--on-wall) 14%,transparent);color:var(--on-wall)}
#clock{padding:0 4px;white-space:nowrap}
.mb-btn svg{width:15px;height:15px}
.mb-btn.logo svg{width:auto;height:15px}

/* Dropdown / context menus */
.menu{position:fixed;z-index:3500;min-width:230px;padding:5px;border-radius:10px;background:color-mix(in srgb,var(--win) 92%,transparent);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);color:var(--ink);box-shadow:0 20px 50px rgba(0,0,0,.35),0 0 0 1px rgba(0,0,0,.15);font-size:13.5px}
.menu button{display:flex;justify-content:space-between;gap:24px;width:100%;text-align:left;background:none;border:0;padding:6px 10px;border-radius:6px;cursor:pointer}
.menu button:hover,.menu button:focus-visible{background:var(--acc);color:var(--acc-ink);outline:none}
.menu kbd{font-family:var(--f-mono);font-size:11px;opacity:.6}
.menu hr{border:0;border-top:1px solid var(--line);margin:4px 6px}

/* Desktop */
.desktop{position:fixed;inset:calc(36px + env(safe-area-inset-top,0px)) 0 0 0}
.icons{position:absolute;top:18px;display:grid;gap:10px 6px;grid-auto-rows:min-content}
.icons.left{left:14px}
.icons.right{right:14px}
.icon{width:94px;display:flex;flex-direction:column;align-items:center;gap:6px;padding:7px 4px;border-radius:10px;border:0;background:none;cursor:pointer;text-align:center}
.icon:hover{background:color-mix(in srgb,var(--on-wall) 8%,transparent)}
.icon.sel{background:color-mix(in srgb,var(--acc) 22%,transparent)}
.tile{width:54px;height:54px;border-radius:15px;display:grid;place-items:center;overflow:hidden;box-shadow:0 8px 20px rgba(0,0,0,.3),inset 0 0 0 1px rgba(255,255,255,.12);flex:none}
.tile img{width:100%;height:100%;object-fit:cover;display:block}
.tile svg{width:27px;height:27px}
.icon > span:last-child{font-size:12px;font-weight:500;line-height:1.25;color:var(--on-wall);text-shadow:0 1px 3px rgba(0,0,0,.45)}
:root[data-tone="light"] .icon > span:last-child{text-shadow:none}
.t-auris{background:#111}
.t-omny{background:#D5E6F0}
.t-game{background:#5a3a1e}
.t-haccp{background:#fff}
.t-vx{background:#1C1B1F}
.t-vx svg{width:62%;height:62%}
.t-sp{background:linear-gradient(160deg,#FFFFFF,#E6EEF6)}
.t-sp img{object-fit:contain;padding:14%}
.vx-hero{background:#1C1B1F;border-radius:10px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);align-items:center;gap:20px;padding:26px;color:#F4F1EC;overflow:hidden}
.vx-hero .wm{display:flex;align-items:center;gap:12px;font:700 34px/1 var(--f-body);letter-spacing:-.03em}
.vx-hero .wm svg{width:44px;height:44px}
.vx-hero p{color:#BDB6AA;font-size:14px;margin-top:12px}
.vx-hero img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px;box-shadow:0 20px 40px rgba(0,0,0,.45);display:block;max-width:100%}
@container (max-width:520px){.vx-hero{grid-template-columns:minmax(0,1fr)}}
.sp-duo{display:grid;grid-template-columns:minmax(0,1fr) 130px;gap:12px;align-items:end}
.sp-duo img{width:100%;border-radius:10px;display:block;max-width:100%}
.sp-duo img.ph{border-radius:14px;box-shadow:0 12px 30px rgba(0,0,0,.25)}
.kbd{display:inline-block;font:500 12px var(--f-mono);padding:2px 7px;border:1px solid var(--line);border-bottom-width:2px;border-radius:5px;background:var(--card)}
.t-folder{background:linear-gradient(160deg,#F7C06E,#E4932A);color:#1B1204}
.t-serv{background:#2F7C82;color:#EAF6F5}
.t-about{background:#E6EEEC;color:#10181B}
.t-mail{background:#10181B;color:var(--acc);box-shadow:0 8px 20px rgba(0,0,0,.3),inset 0 0 0 1px color-mix(in srgb,var(--acc) 45%,transparent)}
.t-txt{background:#F5F6F2;color:#10181B}
.t-term{background:#0B0F11;color:#7FE0A8;font-family:var(--f-mono);font-weight:500;font-size:16px}
.t-set{background:linear-gradient(160deg,#9AA7AC,#5E6C72);color:#fff}

/* Windows */
.win{position:absolute;display:flex;flex-direction:column;min-width:320px;min-height:240px;max-width:calc(100vw - 24px);max-height:calc(100% - 100px);background:var(--win);color:var(--ink);border-radius:12px;overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.4),0 0 0 1px rgba(0,0,0,.22);resize:both;animation:open .22s cubic-bezier(.2,.8,.2,1);container-type:inline-size}
.win[hidden]{display:none!important}
.win.focus{box-shadow:0 36px 90px rgba(0,0,0,.5),0 0 0 1px color-mix(in srgb,var(--acc) 60%,transparent)}
@keyframes open{from{transform:scale(.96);opacity:0}to{transform:none;opacity:1}}
.win.closing{animation:shut .16s ease-in forwards}
@keyframes shut{to{transform:scale(.95);opacity:0}}
.bar{display:flex;align-items:center;gap:10px;height:40px;flex:none;padding:0 8px 0 14px;background:var(--win-2);border-bottom:1px solid var(--line);cursor:grab;user-select:none;touch-action:none}
.bar:active{cursor:grabbing}
.bar .ttl{font-family:var(--f-mono);font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bar .ttl b{color:var(--ink);font-weight:500}
.ctl{margin-left:auto;display:flex;gap:4px}
.ctl button{width:28px;height:26px;border:0;border-radius:6px;background:none;cursor:pointer;color:var(--muted);display:grid;place-items:center}
.ctl button:hover{background:color-mix(in srgb,var(--ink) 9%,transparent);color:var(--ink)}
.ctl .x:hover{background:#D9534A;color:#fff}
.body{flex:1;overflow:auto;min-height:0}
.pad{padding:22px 24px 26px}
.win h2{font-family:var(--f-display);font-weight:700;font-size:26px;line-height:1.08;letter-spacing:-.01em;margin:0;text-wrap:balance}
.win h3{font-family:var(--f-display);font-weight:600;font-size:14.5px;margin:0;line-height:1.25}
.win p{margin:0}
.kick{font-family:var(--f-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#24646A}
:root[data-win="dark"] .kick{color:#6FC3C8}
.lead{font-size:16px;color:var(--ink-2)}
.muted{color:var(--muted)}
.stack{display:grid;gap:14px;align-content:start}
.pill{display:inline-flex;align-items:center;gap:7px;font-family:var(--f-mono);font-size:11px;padding:4px 9px;border-radius:99px;border:1px solid var(--line);background:var(--card);color:var(--ink);white-space:nowrap}
.pill i{width:6px;height:6px;border-radius:50%;background:var(--ok)}
.pill.wip i{background:#E4932A}
.hero-img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#111;border-radius:10px;max-width:100%}
.spec{display:grid;grid-template-columns:auto minmax(0,1fr);margin:0;border-top:1px solid var(--line)}
.spec dt,.spec dd{margin:0;padding:9px 0;border-bottom:1px solid var(--line)}
.spec dt{font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding-right:18px;padding-top:11px}
.btns{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.btn{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:8px;border:1px solid var(--line);background:var(--card);color:var(--ink);text-decoration:none;font-weight:600;font-size:13.5px;cursor:pointer}
.btn:hover{border-color:var(--ink)}
.btn.primary{background:var(--ink);color:var(--win);border-color:var(--ink)}
.tags{display:flex;flex-wrap:wrap;gap:6px}
.tag{font-family:var(--f-mono);font-size:11px;padding:3px 8px;border-radius:5px;background:var(--win-2);color:var(--muted)}

/* App layout: sidebar + panes */
.app{display:grid;grid-template-columns:176px minmax(0,1fr);height:100%;min-height:0}
.side{background:var(--win-2);border-right:1px solid var(--line);padding:14px 8px;display:flex;flex-direction:column;gap:2px;overflow:auto}
.side .app-id{display:flex;align-items:center;gap:10px;padding:4px 8px 14px}
.side .app-id .tile{width:34px;height:34px;border-radius:9px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.side .app-id b{font-family:var(--f-display);font-size:12.5px;font-weight:600;line-height:1.2}
.side button{text-align:left;background:none;border:0;padding:7px 10px;border-radius:7px;cursor:pointer;font-size:13.5px;color:var(--ink-2)}
.side button:hover{background:color-mix(in srgb,var(--ink) 6%,transparent)}
.side button[aria-selected="true"]{background:var(--card);color:var(--ink);font-weight:600;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.panes{overflow:auto;min-height:0}
.pane{padding:22px 24px 28px;display:grid;gap:16px;align-content:start}
.pane[hidden]{display:none}
@container (max-width:600px){
  .app{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}
  .side{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--line);padding:8px;gap:4px}
  .side .app-id{display:none}
  .side button{white-space:nowrap;flex:none}
  .pane{padding:18px 18px 24px}
}
.grid2{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.feat{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px 15px;display:grid;gap:6px;align-content:start}
.feat p{font-size:13.5px;color:var(--ink-2)}
.feat .ic{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:color-mix(in srgb,var(--acc) 18%,var(--card));color:var(--ink)}
.feat .ic svg{width:17px;height:17px}
.steps{display:grid;gap:10px;counter-reset:s}
.stepx{display:grid;grid-template-columns:36px minmax(0,1fr);gap:12px;align-items:start;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px}
.stepx::before{counter-increment:s;content:counter(s);width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:var(--win);font-family:var(--f-display);font-weight:600;font-size:14px}
.gallery{display:grid;gap:10px}
.gallery .main{width:100%;aspect-ratio:16/10;object-fit:contain;background:#0d1113;border-radius:10px;display:block;max-width:100%}
.gallery .main.light{background:#fff}
.thumbs{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px}
.thumbs button{flex:none;width:92px;height:62px;border-radius:7px;overflow:hidden;border:2px solid transparent;padding:0;cursor:pointer;background:#0d1113}
.thumbs button[aria-pressed="true"]{border-color:var(--acc)}
.thumbs img{width:100%;height:100%;object-fit:cover;display:block}
.cap{font-family:var(--f-mono);font-size:11.5px;color:var(--muted)}
.tbl-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:10px}
table{border-collapse:collapse;width:100%;font-size:13px;background:var(--card)}
th,td{padding:8px 12px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
th{font-family:var(--f-mono);font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);background:var(--win-2)}
td.y{color:var(--ok);font-weight:600}
td.me{background:color-mix(in srgb,var(--acc) 10%,var(--card))}
tr:last-child td{border-bottom:0}
.timeline{display:grid;gap:0;border-left:2px solid var(--line);margin-left:6px}
.rel{position:relative;padding:0 0 18px 20px}
.rel::before{content:"";position:absolute;left:-7px;top:4px;width:12px;height:12px;border-radius:50%;background:var(--win);border:2px solid var(--muted)}
.rel.latest::before{border-color:var(--acc);background:var(--acc)}
.rel h3{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.rel h3 small{font-family:var(--f-mono);font-weight:400;font-size:11.5px;color:var(--muted)}
.rel ul{margin:6px 0 0;padding-left:18px;font-size:13.5px;color:var(--ink-2)}
blockquote{margin:0;padding:18px 20px;border-radius:10px;background:#1a120b;color:#F3DDBF;font-family:var(--f-display);font-size:16px;line-height:1.45}

/* Folder listing */
.files{list-style:none;margin:0;padding:6px}
.files button{width:100%;display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:12px;align-items:center;padding:9px 10px;border:0;border-radius:8px;background:none;cursor:pointer;text-align:left}
.files button:hover{background:var(--win-2)}
.files .tile{width:40px;height:40px;border-radius:10px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.files b{display:block;font-weight:600}
.files small{color:var(--muted);font-size:12px}

/* Services */
.svc{display:grid;border-top:1px solid var(--line)}
.svc div{padding:14px 0;border-bottom:1px solid var(--line);display:grid;gap:6px}
.svc p{color:var(--ink-2);font-size:14px}

/* Text file */
.txt{font-family:var(--f-mono);font-size:13px;line-height:1.75;padding:18px 22px;background:var(--card);color:var(--ink);white-space:pre-wrap;margin:0;min-height:100%}
.txt .c{color:var(--muted)}
.txt .h{color:#2F7C82;font-weight:500}

/* Terminal */
.term{background:#0B0F11;color:#CFE3DA;font-family:var(--f-mono);font-size:13px;line-height:1.6;padding:14px 16px;min-height:100%;cursor:text}
.term .out{white-space:pre-wrap;word-break:break-word}
.term .p{color:#7FE0A8}
.term .a{color:var(--acc)}
.term .d{color:#6E8A86}
.term .line{display:flex;gap:8px}
.term input{flex:1;min-width:0;background:none;border:0;color:#E8F2EE;font:inherit;padding:0;outline:none;caret-color:var(--acc)}

/* Settings */
.walls{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.wall-opt{border:0;background:none;padding:0;cursor:pointer;text-align:left;display:grid;gap:6px}
.wall-opt canvas{width:100%;aspect-ratio:16/10;border-radius:9px;display:block;box-shadow:0 0 0 1px var(--line);transition:box-shadow .15s}
.wall-opt[aria-pressed="true"] canvas{box-shadow:0 0 0 3px var(--acc)}
.wall-opt span{font-size:13px;font-weight:600}
.wall-opt small{display:block;font-weight:400;color:var(--muted);font-size:12px}
.swatches{display:flex;gap:10px;flex-wrap:wrap}
.sw{width:34px;height:34px;border-radius:50%;border:0;cursor:pointer;box-shadow:inset 0 0 0 1px rgba(0,0,0,.15)}
.sw[aria-pressed="true"]{box-shadow:0 0 0 3px var(--win),0 0 0 5px var(--ink)}
.seg{display:inline-flex;padding:3px;border-radius:9px;background:var(--win-2);gap:2px;flex-wrap:wrap}
.seg button{border:0;background:none;padding:6px 14px;border-radius:7px;cursor:pointer;font-size:13px}
.seg button[aria-pressed="true"]{background:var(--card);box-shadow:0 1px 2px rgba(0,0,0,.12);font-weight:600}
.set-row{display:grid;gap:8px;padding:14px 0;border-bottom:1px solid var(--line)}
.set-row:last-child{border-bottom:0}
.set-row > b{font-size:13.5px}

/* Contact */
form{display:grid;gap:12px}
.f{display:grid;gap:5px}
.f label{font-size:12.5px;font-weight:600}
input,textarea{font:inherit;font-size:14px;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:8px;padding:9px 11px;width:100%}
.win form input:focus,.win form textarea:focus{outline:none;border-color:#2F7C82;box-shadow:0 0 0 3px rgba(47,124,130,.2)}
textarea{min-height:84px;resize:vertical}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mailbox{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 12px;border-radius:8px;background:var(--win-2);font-family:var(--f-mono);font-size:12.5px}
.sent{padding:10px 12px;border-radius:8px;background:#DDEFE5;color:#1B4D33;font-size:13.5px}

/* Dock */
.dock{position:fixed;left:50%;bottom:calc(10px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:2500;display:flex;align-items:flex-end;gap:6px;padding:7px;border-radius:18px;background:var(--glass);backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);border:1px solid var(--glass-line);max-width:calc(100vw - 16px)}
.dock button{position:relative;border:0;background:none;padding:0;cursor:pointer;border-radius:13px;transition:transform .18s cubic-bezier(.2,.8,.2,1)}
.dock .tile{width:var(--dock-tile);height:var(--dock-tile);border-radius:calc(var(--dock-tile) * .27);transition:width .15s,height .15s}
.dock .tile svg{width:50%;height:50%}
.dock.magnify button:hover .tile{width:calc(var(--dock-tile) * 1.35);height:calc(var(--dock-tile) * 1.35)}
.dock:not(.magnify) button:hover{transform:translateY(-4px)}
.dock button.on::after{content:"";position:absolute;left:50%;bottom:-5px;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:var(--on-wall)}
.dock .sep{width:1px;align-self:stretch;background:var(--glass-line);margin:4px 3px}
.dock button .tip{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%);white-space:nowrap;font-size:12px;padding:4px 8px;border-radius:6px;background:rgba(12,20,24,.92);color:#E6EEEC;opacity:0;pointer-events:none;transition:opacity .15s}
.dock button:hover .tip{opacity:1}

/* Spotlight */
.spot-bg{position:fixed;inset:0;z-index:4000;background:rgba(0,0,0,.25);display:flex;justify-content:center;align-items:flex-start;padding:14vh 16px 0}
.spot{width:min(620px,100%);border-radius:14px;background:color-mix(in srgb,var(--win) 94%,transparent);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);color:var(--ink);box-shadow:0 30px 80px rgba(0,0,0,.45),0 0 0 1px rgba(0,0,0,.15);overflow:hidden}
.spot .q{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line)}
.spot .q svg{width:20px;height:20px;color:var(--muted);flex:none}
.spot input{border:0;background:none;font-size:20px;padding:0;outline:none;box-shadow:none}
.spot ul{list-style:none;margin:0;padding:6px;max-height:50vh;overflow:auto}
.spot li button{width:100%;display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:12px;align-items:center;text-align:left;background:none;border:0;padding:7px 10px;border-radius:8px;cursor:pointer}
.spot li button .tile{width:32px;height:32px;border-radius:8px;box-shadow:none}
.spot li button .tile svg{width:17px;height:17px}
.spot li button small{color:var(--muted);font-size:12px;display:block}
.spot li button kbd{font-family:var(--f-mono);font-size:11px;color:var(--muted)}
.spot li button.act{background:var(--acc);color:var(--acc-ink)}
.spot li button.act small,.spot li button.act kbd{color:var(--acc-ink);opacity:.75}
.spot .empty{padding:18px;color:var(--muted);font-size:14px}

/* Toasts */
.toasts{position:fixed;right:224px;top:calc(46px + env(safe-area-inset-top,0px));z-index:3200;display:grid;gap:8px;width:min(340px,calc(100vw - 24px))}
.toast{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:10px;align-items:start;padding:12px;border-radius:12px;background:color-mix(in srgb,var(--win) 92%,transparent);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);color:var(--ink);box-shadow:0 16px 40px rgba(0,0,0,.3),0 0 0 1px rgba(0,0,0,.12);animation:tin .3s cubic-bezier(.2,.8,.2,1);font-size:13.5px}
.toast .tile{width:34px;height:34px;border-radius:9px;box-shadow:none}
.toast .tile svg{width:18px;height:18px}
.toast b{display:block;font-size:13px}
.toast p{margin:0;color:var(--ink-2)}
.toast button{border:0;background:none;cursor:pointer;color:var(--muted);min-width:28px;min-height:28px;margin:-6px -6px 0 0;border-radius:6px;font-size:18px;line-height:1}
.toast button:hover{background:color-mix(in srgb,var(--ink) 8%,transparent)}
@keyframes tin{from{transform:translateX(20px);opacity:0}to{transform:none;opacity:1}}

/* Boot */
#boot{position:fixed;inset:0;z-index:5000;background:#05080A;display:grid;place-items:center;color:#E6EEEC}
#boot[hidden]{display:none}
#boot .in{display:grid;gap:26px;justify-items:center}
#boot svg{height:34px;width:auto}
#boot svg path{fill:#E6EEEC}
#boot .bar2{width:180px;height:3px;border-radius:3px;background:rgba(230,238,236,.15);overflow:hidden}
#boot .bar2 i{display:block;height:100%;width:0;background:var(--acc);transition:width 1.3s cubic-bezier(.4,0,.2,1)}

/* Lock screen */
body.locked .menubar,body.locked .desktop,body.locked .dock,body.locked .toasts{visibility:hidden}
#lock{position:fixed;inset:0;z-index:4500;display:grid;grid-template-rows:auto minmax(0,1fr) auto;justify-items:center;padding:calc(22px + env(safe-area-inset-top,0px)) 16px calc(34px + env(safe-area-inset-bottom,0px));color:#F2F5F4;background:rgba(5,9,11,.34);backdrop-filter:blur(28px) saturate(1.25);-webkit-backdrop-filter:blur(28px) saturate(1.25);cursor:pointer;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;overflow:hidden}
#lock::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(120% 80% at 50% 110%,rgba(0,0,0,.45),transparent 60%)}
#lock > *{position:relative;z-index:1}
.lk-top{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;max-width:1240px}
.lk-logo svg{height:24px;width:auto;display:block}
.lk-logo svg path{fill:#F2F5F4}
.lk-tools{display:flex;gap:6px;align-items:center}
.lk-tools button{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:#F2F5F4;border-radius:99px;padding:6px 11px;font:500 12px var(--f-mono);cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:background .2s}
.lk-tools button:hover{background:rgba(255,255,255,.16)}
.lk-tools button[aria-pressed="true"]{background:#F2F5F4;color:#0B0F11;border-color:#F2F5F4}
.lk-tools svg{width:14px;height:14px}
.lk-center{align-self:center;display:grid;justify-items:center;text-align:center;gap:4px}
.lk-date{font:500 clamp(15px,1.6vw,19px) var(--f-body);letter-spacing:.01em;opacity:.88}
.lk-time{font-family:var(--f-display);font-weight:600;font-size:clamp(78px,15vw,190px);line-height:.95;letter-spacing:-.045em;font-variant-numeric:tabular-nums;text-shadow:0 10px 60px rgba(0,0,0,.25)}
.lk-sub{margin-top:22px;font-size:clamp(15px,1.5vw,17px);opacity:.82;max-width:30em;text-wrap:balance}
.lk-bottom{display:grid;justify-items:center;gap:14px}
.lk-enter{position:relative;display:inline-flex;align-items:center;gap:14px;padding:8px 8px 8px 22px;border-radius:99px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#F2F5F4;font:600 14.5px var(--f-body);cursor:pointer;transition:background .2s,transform .2s cubic-bezier(.2,.8,.2,1)}
.lk-enter:hover{background:rgba(255,255,255,.17);transform:translateY(-1px)}
.lk-enter:active{transform:scale(.97)}
.lk-enter .go{position:relative;width:36px;height:36px;border-radius:50%;background:var(--acc);color:var(--acc-ink);display:grid;place-items:center}
.lk-enter .go::after{content:"";position:absolute;inset:0;border-radius:50%;background:var(--acc);opacity:.5;animation:lkPulse 2.6s infinite;z-index:-1}
.lk-enter .go svg{width:16px;height:16px}
@keyframes lkPulse{0%{transform:scale(1);opacity:.5}70%{transform:scale(1.8);opacity:0}100%{transform:scale(1.8);opacity:0}}
.lk-hint{font:12px var(--f-mono);opacity:.55;letter-spacing:.05em}
.lk-part{transition:transform .55s cubic-bezier(.55,0,.75,.05),opacity .42s ease-in,filter .5s ease-in}
#lock.leaving .lk-part{opacity:0;filter:blur(8px)}
#lock.leaving .lk-top{transform:translateY(-24px)}
#lock.leaving .lk-date{transform:translateY(-30px);transition-delay:.02s}
#lock.leaving .lk-time{transform:translateY(-44px) scale(.97);transition-delay:.05s}
#lock.leaving .lk-sub{transform:translateY(-30px);transition-delay:.08s}
#lock.leaving .lk-bottom{transform:translateY(34px) scale(.96)}
#lockRing{position:fixed;z-index:4600;border-radius:50%;pointer-events:none;border:1.5px solid var(--acc);box-shadow:0 0 50px color-mix(in srgb,var(--acc) 55%,transparent),inset 0 0 40px color-mix(in srgb,var(--acc) 30%,transparent)}
/* Desktop entrance after unlock */
body.entering .menubar{animation:mbIn .7s cubic-bezier(.2,.8,.2,1) both}
@keyframes mbIn{from{transform:translateY(-110%)}to{transform:none}}
body.entering .dock{animation:dockIn .9s cubic-bezier(.34,1.45,.64,1) .18s both}
@keyframes dockIn{from{transform:translate(-50%,160%)}to{transform:translate(-50%,0)}}
body.entering .icon{animation:icIn .55s cubic-bezier(.2,.9,.25,1.2) both;animation-delay:calc(var(--i,0) * 32ms + 240ms)}
@keyframes icIn{from{opacity:0;transform:translateY(10px) scale(.72)}to{opacity:1;transform:none}}
body.entering .widget{animation:icIn .6s cubic-bezier(.2,.8,.2,1) .2s both}

/* Extra tiles */
.icons.right{grid-template-columns:repeat(2,94px)}
.t-quote{background:linear-gradient(160deg,#2E6B73,#163C43);color:#EAF6F5}
.t-cal{background:#FFFFFF;color:#10181B;display:grid;grid-template-rows:auto 1fr;place-items:center;padding-top:5px}
.t-cal b{font:700 8.5px/1 var(--f-body);letter-spacing:.08em;text-transform:uppercase;color:#C42F23}
.t-cal i{font:600 calc(var(--tile-n,54px) * .42)/1 var(--f-display);font-style:normal;margin-top:-2px}
.dock .t-cal{--tile-n:var(--dock-tile)}
.files .t-cal,.side .app-id .t-cal,.spot .t-cal,.toast .t-cal{--tile-n:36px;padding-top:3px}
.files .t-cal b,.side .t-cal b,.spot .t-cal b,.toast .t-cal b{font-size:6px}

/* Preventivo */
.pv-grid{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:20px;align-items:start}
@container (max-width:760px){.pv-grid{grid-template-columns:minmax(0,1fr)}}
.pv-step{display:grid;gap:14px;align-content:start}
.pv-step .n{font-family:var(--f-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.pv-group{display:grid;gap:8px}
.pv-group > b{font-size:13px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:99px;padding:8px 13px;font-size:13.5px;cursor:pointer;transition:background .15s,border-color .15s,transform .1s}
.chip:hover{border-color:var(--ink)}
.chip:active{transform:scale(.97)}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--win);border-color:var(--ink)}
.pv-nav{display:flex;justify-content:space-between;gap:8px;padding-top:6px;border-top:1px solid var(--line)}
.brief{position:sticky;top:0;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px 15px;display:grid;gap:10px;font-size:13px}
.brief .kick{font-size:10.5px}
.brief dl{margin:0;display:grid;gap:7px}
.brief dt{font-family:var(--f-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.brief dd{margin:0;color:var(--ink)}
.meter{display:flex;gap:4px}
.meter i{flex:1;height:6px;border-radius:3px;background:var(--win-2)}
.meter i.on{background:var(--acc)}
.similar{display:grid;grid-template-columns:34px minmax(0,1fr);gap:10px;align-items:center;padding:8px;border-radius:9px;background:var(--win-2);cursor:pointer;border:0;text-align:left;width:100%}
.similar .tile{width:34px;height:34px;border-radius:9px;box-shadow:none}
.similar small{display:block;color:var(--muted);font-size:11.5px}
.pv-done{display:grid;gap:12px;padding:18px;border-radius:12px;background:color-mix(in srgb,var(--ok) 12%,var(--card));border:1px solid color-mix(in srgb,var(--ok) 35%,var(--line))}

/* Calendario */
.cal{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);height:100%;min-height:0}
@container (max-width:640px){.cal{grid-template-columns:minmax(0,1fr);height:auto}}
.cal-l{padding:20px 22px;border-right:1px solid var(--line);display:grid;gap:14px;align-content:start}
.cal-r{padding:20px 22px;display:grid;gap:14px;align-content:start;overflow:auto;background:var(--win-2)}
@container (max-width:640px){.cal-l{border-right:0;border-bottom:1px solid var(--line)}}
.cal-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.cal-head h3{font-size:17px;text-transform:capitalize}
.cal-head button{width:32px;height:32px;border-radius:8px;border:1px solid var(--line);background:var(--card);cursor:pointer;color:var(--ink)}
.cal-head button:disabled{opacity:.35;cursor:default}
.cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;text-align:center}
.cal-grid .wd{font-family:var(--f-mono);font-size:10.5px;color:var(--muted);text-transform:uppercase;padding:4px 0}
.day{aspect-ratio:1;border:0;border-radius:9px;background:none;cursor:pointer;font:500 14px var(--f-body);color:var(--ink);position:relative;font-variant-numeric:tabular-nums}
.day:hover:not(:disabled){background:var(--win-2)}
.day:disabled{color:var(--muted);opacity:.4;cursor:default}
.day.av::after{content:"";position:absolute;left:50%;bottom:6px;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:var(--acc)}
.day.today{box-shadow:inset 0 0 0 1px var(--line)}
.day[aria-pressed="true"]{background:var(--ink);color:var(--win)}
.day[aria-pressed="true"]::after{background:var(--win)}
.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:8px}
.slot{border:1px solid var(--line);background:var(--card);border-radius:9px;padding:9px 0;font:500 13.5px var(--f-mono);cursor:pointer;color:var(--ink)}
.slot:hover{border-color:var(--ink)}
.slot[aria-pressed="true"]{background:var(--acc);border-color:var(--acc);color:var(--acc-ink)}
.cal-sum{display:grid;gap:4px;padding:12px 14px;border-radius:10px;background:var(--card);border:1px solid var(--line);font-size:13.5px}
.cal-sum b{font-family:var(--f-display);font-weight:600;font-size:15px}

/* Easter egg */
body.para .menubar .os{display:inline-block;transform:scaleX(-1)}
#clock.leet{color:var(--acc);font-weight:600}
.icon.fall,.dock button.fall{transition:transform .9s cubic-bezier(.55,0,.9,.4),opacity .9s ease-in;transform:translateY(115vh) rotate(var(--r,20deg));opacity:0;pointer-events:none}
.icon.back,.dock button.back{transition:transform .7s cubic-bezier(.2,.9,.25,1.15),opacity .4s}
#saver{position:fixed;inset:0;z-index:4800;background:#04070A;cursor:none;overflow:hidden;animation:tin .6s ease}
#saver canvas{position:absolute;inset:0;width:100%;height:100%}
#saver .sv-logo{position:absolute;left:0;top:0;width:240px;color:#E6EEEC;will-change:transform;transition:color .3s}
#saver .sv-logo svg{width:100%;height:auto;display:block}
#saver .sv-logo svg path{fill:currentColor}
#saver .sv-hint{position:absolute;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);font:12px var(--f-mono);color:rgba(230,238,236,.35);white-space:nowrap}
#saver .sv-win{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);font:700 clamp(28px,5vw,56px)/1.1 var(--f-display);color:var(--acc);text-align:center;animation:svWin 2.6s ease forwards;pointer-events:none}
@keyframes svWin{0%{opacity:0;transform:translate(-50%,-40%) scale(.8)}15%{opacity:1;transform:translate(-50%,-50%) scale(1)}80%{opacity:1}100%{opacity:0}}
.aboutos{display:grid;justify-items:center;text-align:center;gap:10px}
.ao-mark{width:132px;height:132px;border-radius:30px;background:#0C1F26;display:grid;place-items:center;color:#E6EEEC;box-shadow:0 14px 34px rgba(0,0,0,.28);margin-bottom:6px}
.ao-mark svg{width:104px;height:auto;display:block}
.ao-mark svg path{fill:currentColor}
.aboutos .spec{width:100%;text-align:left}
@media (max-width:760px){#saver .sv-logo{width:150px}
  /* iOS ingrandisce la pagina sui campi sotto i 16px */
  input,textarea,select,.term input{font-size:16px}
  .term{font-size:14px}}
/* Giochi */
.t-games{background:linear-gradient(160deg,#FF8A5C,#E0457B);color:#fff}
.t-snake{background:#0B0F11;color:#7FE0A8}
.snk{display:flex;flex-direction:column;height:100%;min-height:0;background:#0B0F11;color:#CFE3DA;padding:12px 14px 14px;gap:10px}
.snk-hud{display:flex;gap:20px;align-items:center;font-family:var(--f-mono)}
.snk-hud span{display:grid;gap:1px}
.snk-hud small{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#6E8A86}
.snk-hud b{font-size:20px;color:#E8F2EE;font-variant-numeric:tabular-nums;font-weight:500}
.snk-hud .btn{background:#161D20;color:#CFE3DA;border-color:#2A3439}
.snk-hud #snkBoard{margin-left:auto}
.g-top{color:var(--acc)!important;font-family:var(--f-mono);font-size:11.5px!important}
.g-top:empty{display:none}
.snk-msg .card{max-height:100%;overflow:auto}
.lb-form{display:flex;gap:8px;width:100%;flex-wrap:wrap;justify-content:center}
.lb-form input{flex:1;min-width:140px;background:#161D20;border:1px solid #2A3439;color:#E8F2EE;border-radius:8px;padding:9px 11px;font:inherit;font-size:14px}
.lb-form input:focus{outline:none;border-color:var(--acc)}
.lb-err{color:#FF8A7A!important;font-size:12.5px!important}
.lb-err:empty{display:none}
.lb-tabs{display:inline-flex;padding:3px;border-radius:9px;background:#161D20;gap:2px}
.lb-tabs button{border:0;background:none;color:#9FB4AE;padding:6px 12px;border-radius:7px;cursor:pointer;font:500 12.5px var(--f-body)}
.lb-tabs button[aria-pressed="true"]{background:#2A3439;color:#E8F2EE}
.lb-list{list-style:none;margin:0;padding:0;width:100%;min-width:230px;display:grid;gap:3px;font:13px var(--f-mono);text-align:left;counter-reset:lb}
.lb-list li{display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:8px;padding:5px 8px;border-radius:6px;color:#CFE3DA;counter-increment:lb}
.lb-list li::before{content:counter(lb);color:#6E8A86}
.lb-list li:nth-child(1)::before{content:"1";color:#F5C542}
.lb-list li.me{background:rgba(127,224,168,.1);color:var(--acc)}
.lb-list li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb-empty{color:#9FB4AE;font-size:13px}
.lb-links{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.snk-msg .lnk{color:#9FB4AE;font-size:13px}
.snk-hud .btn:disabled{opacity:.4;cursor:default}
.snk-stage{position:relative;flex:1;min-height:0;display:grid;place-items:center}
#snkCv{display:block;border-radius:10px;touch-action:none;box-shadow:0 0 0 1px #1F2A2E}
.snk-msg{position:absolute;inset:0;z-index:20;display:grid;place-items:center;text-align:center;pointer-events:none;padding:16px}
.snk-msg .card{background:rgba(11,15,17,.9);border:1px solid #243035;border-radius:14px;padding:18px 22px;display:grid;gap:8px;justify-items:center;pointer-events:auto;max-width:300px}
.snk-msg h3{font-family:var(--f-display);color:#E8F2EE;font-size:22px;margin:0}
.snk-msg p{color:#9FB4AE;font-size:13.5px;margin:0}
.snk-go{background:var(--acc);color:var(--acc-ink);border-color:var(--acc);margin-top:4px}
.snk-pad{display:none}
.snk-help{font:11px var(--f-mono);color:#6E8A86;text-align:center;margin:0}
@media (pointer:coarse){
  .snk-pad{display:grid;grid-template-columns:repeat(3,68px);grid-template-rows:repeat(2,58px);gap:8px;justify-content:center;padding-bottom:env(safe-area-inset-bottom,0px)}
  .snk-pad [data-d=up]{grid-column:2}
  .snk-pad [data-d=left]{grid-column:1;grid-row:2}
  .snk-pad [data-d=down]{grid-column:2;grid-row:2}
  .snk-pad [data-d=right]{grid-column:3;grid-row:2}
  .snk-pad button{border:1px solid #2A3439;background:#161D20;color:#CFE3DA;border-radius:14px;font-size:18px;touch-action:manipulation;user-select:none;-webkit-user-select:none}
  .snk-pad button:active{background:#22302F}
  .snk-help{display:none}
}
/* Debug e Deploy Runner */
.t-debug{background:linear-gradient(160deg,#F2F4F3,#D5DCD9);color:#C2413A}
.t-runner{background:linear-gradient(160deg,#2E6B73,#0F2E33);color:var(--acc)}
.t-debug svg,.t-runner svg{width:58%;height:58%}
.dbg{display:flex;flex-direction:column;height:100%;min-height:0;padding:12px 14px 12px;gap:10px;background:var(--win)}
.dbg-hud{display:flex;gap:16px;align-items:center;flex-wrap:wrap;font-family:var(--f-mono)}
.dbg-hud > span{display:grid;gap:1px;min-width:42px}
.dbg-hud small{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.dbg-hud b{font-size:20px;font-weight:500;font-variant-numeric:tabular-nums}
.dbg-hud .seg{margin-left:auto}
.dbg-hud .seg button{padding:5px 10px;font-size:12.5px}
.dbg-stage{flex:1;min-height:0;display:grid;place-items:center;overflow:auto}
.dbg-grid{display:grid;gap:2px;grid-template-columns:repeat(var(--w),var(--c));grid-auto-rows:var(--c);user-select:none;-webkit-user-select:none;touch-action:manipulation}
.dbg-grid button{all:unset;box-sizing:border-box;display:grid;place-items:center;border-radius:4px;background:color-mix(in srgb,var(--ink) 13%,var(--win-2));box-shadow:inset 0 -2px 0 color-mix(in srgb,var(--ink) 14%,transparent);cursor:pointer;font:700 calc(var(--c) * .5)/1 var(--f-mono);color:var(--ink)}
.dbg-grid button:hover{background:color-mix(in srgb,var(--ink) 20%,var(--win-2))}
.dbg-grid button:focus-visible{outline:2px solid var(--acc);outline-offset:1px}
.dbg-grid button.o{background:var(--card);box-shadow:none;cursor:default}
.dbg-grid button svg{width:68%;height:68%}
.dbg-grid button.f{color:var(--acc)}
.dbg-grid button.b{color:#C2413A}
.dbg-grid button.x{background:#C2413A;color:#fff}
.dbg-grid button.w{color:var(--muted);text-decoration:line-through}
.dbg-grid .n1{color:#2F6FDB}.dbg-grid .n2{color:#2E9A63}.dbg-grid .n3{color:#D9534A}.dbg-grid .n4{color:#7A4FD0}.dbg-grid .n5{color:#B5651D}.dbg-grid .n6{color:#1B8A8F}.dbg-grid .n7{color:var(--ink)}.dbg-grid .n8{color:var(--muted)}
:root[data-win="dark"] .dbg-grid .n1{color:#7FA8FF}:root[data-win="dark"] .dbg-grid .n4{color:#B49BFF}
.dbg-msg:empty{display:none}
.dbg-msg .card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px 16px;display:grid;gap:8px;justify-items:center;text-align:center}
.dbg-msg h3{font-family:var(--f-display);font-size:19px;margin:0}
.dbg-msg p{margin:0;font-size:13.5px;color:var(--ink-2)}
.dbg-msg .lb-form input{background:var(--win);border:1px solid var(--line);color:var(--ink)}
.dbg-msg .lb-list li{color:var(--ink)}
.dbg-msg .lb-list li.me{background:color-mix(in srgb,var(--acc) 16%,transparent);color:var(--ink);font-weight:600}
.dbg-msg .lb-tabs{background:var(--win-2)}
.dbg-msg .lb-tabs button{color:var(--muted)}
.dbg-msg .lb-tabs button[aria-pressed="true"]{background:var(--card);color:var(--ink)}
.dbg-msg .lb-empty{color:var(--muted)}
.dbg-msg .lnk{color:var(--muted);font-size:13px}
.dbg-foot{display:flex;gap:8px;justify-content:center}
#dbgMode[aria-pressed="true"]{background:var(--acc);color:var(--acc-ink);border-color:var(--acc)}
.dbg-help{margin:0;text-align:center;font:11px var(--f-mono);color:var(--muted)}
.hp-touch{display:none}
@media (pointer:coarse){.hp-fine{display:none}.hp-touch{display:inline}.run-help{display:block}}
.run-stage{touch-action:none;user-select:none;-webkit-user-select:none}
#runCv{display:block;border-radius:10px;box-shadow:0 0 0 1px #1F2A2E}
/* Bug vagante */
#critter{position:fixed;left:0;top:0;width:44px;height:44px;z-index:2950;cursor:crosshair;will-change:transform;touch-action:none}
#critter::before{content:"";position:absolute;inset:-10px}
#critter svg{width:100%;height:100%;color:#C2413A;filter:drop-shadow(0 2px 3px rgba(0,0,0,.35));display:block}
#critter .cr-body{width:100%;height:100%;animation:crWig .2s ease-in-out infinite alternate}
#critter.flee .cr-body{animation-duration:.09s}
#critter.frozen .cr-body{animation:crPlay 1.6s ease-in-out infinite}
#critter.squash .cr-body{animation:crSquash .14s cubic-bezier(.2,.9,.3,1) forwards}
@keyframes crWig{from{transform:rotate(-8deg)}to{transform:rotate(8deg)}}
@keyframes crPlay{0%,100%{transform:scale(.92)}50%{transform:scale(.9) rotate(2deg)}}
@keyframes crSquash{0%{transform:scale(1)}100%{transform:scale(1.35,.4)}}
.cr-splat{position:fixed;z-index:2949;width:0;height:0;pointer-events:none;animation:crFade .9s ease-in 2.1s forwards}
.cr-splat svg.blob{position:absolute;left:0;top:0;overflow:visible;animation:crBlob .16s cubic-bezier(.15,.9,.3,1.3) both}
.cr-splat .drop{position:absolute;left:0;top:0;border-radius:50%;background:radial-gradient(circle at 35% 30%,#C8F58A,#6FCF3B 45%,#3E8E1E);animation:crDrop .32s cubic-bezier(.1,.75,.2,1) both}
.cr-splat .dead{position:absolute;color:#4A1512;transform-origin:center;filter:drop-shadow(0 1px 1px rgba(0,0,0,.35))}
.cr-splat .dead svg{width:100%;height:100%;display:block}
@keyframes crBlob{from{transform:scale(.15)}to{transform:scale(1)}}
@keyframes crDrop{from{transform:translate(-50%,-50%) translate(0,0) scale(.4);opacity:.6}to{transform:translate(-50%,-50%) translate(var(--dx),var(--dy)) rotate(var(--rot)) scale(var(--sx),1);opacity:1}}
@keyframes crFade{to{opacity:0;transform:scale(.96)}}
.cr-pop{position:fixed;z-index:2951;font:700 12px var(--f-mono);color:var(--acc);pointer-events:none;white-space:nowrap;text-shadow:0 1px 3px rgba(0,0,0,.6);animation:crPop .95s ease-out forwards}
@keyframes crPop{to{transform:translateY(-30px);opacity:0}}
.fix-count{cursor:default;gap:5px;color:var(--on-wall)}
.fix-count svg{width:13px;height:13px;color:#FF7A5C}
.fix-count b{font:600 12px var(--f-mono)}
@media (max-width:760px){#critter{width:48px;height:48px}}
@media (prefers-reduced-motion:reduce){#critter .cr-body{animation:none}}
/* Giochi 2: Compila, Versioni, Code Sprint, Firewall, Memory */
.t-compila{background:linear-gradient(160deg,#C792EA,#6E4BB8);color:#fff}
.t-versioni{background:linear-gradient(160deg,#FFCB6B,#E0892A);color:#2A1500}
.t-sprint{background:linear-gradient(160deg,#3A4A52,#151C20);color:#C3E88D}
.t-firewall{background:linear-gradient(160deg,#FF6B5A,#B8282E);color:#fff}
.t-memory{background:linear-gradient(160deg,#5FD3C6,#1F8F84);color:#fff}
.t-compila svg,.t-versioni svg,.t-sprint svg,.t-firewall svg,.t-memory svg{width:58%;height:58%}
.snk-hud .gm-board{margin-left:auto}
.snk-hud canvas{display:block;margin-top:2px}
.snk-stage canvas{display:block;border-radius:10px;box-shadow:0 0 0 1px #1F2A2E;touch-action:none}
.gm-pad{display:none}
@media (pointer:coarse){
  .gm-pad{display:grid;grid-template-columns:repeat(5,minmax(0,62px));gap:8px;justify-content:center;padding-bottom:env(safe-area-inset-bottom,0px)}
  .gm-pad button{height:54px;border:1px solid #2A3439;background:#161D20;color:#CFE3DA;border-radius:14px;font-size:20px;touch-action:manipulation;user-select:none;-webkit-user-select:none}
  .gm-pad button:active{background:#22302F}
}
/* Versioni */
.vgrid{position:relative;width:var(--vs,320px);height:var(--vs,320px);border-radius:12px;background:#161D20;box-shadow:0 0 0 1px #1F2A2E;touch-action:none}
.vgrid .vcell{position:absolute;border-radius:8px;background:#1C2529}
.vtile{position:absolute;left:0;top:0;display:grid;place-items:center;border-radius:8px;font:700 calc(var(--vc) * .2)/1 var(--f-mono);color:#0B0F11;transition:transform .11s ease-out;will-change:transform}
.vtile b{font-weight:700}
.vtile.new{animation:vNew .16s ease-out}
.vtile.pop{animation:vPop .18s ease-out}
.vtile.big{color:#fff;font-size:calc(var(--vc) * .18)}
.vtile.big small{display:block;font:600 calc(var(--vc) * .09)/1.2 var(--f-mono);opacity:.85;text-align:center}
@keyframes vNew{from{transform:var(--t) scale(.2);opacity:0}to{transform:var(--t) scale(1);opacity:1}}
@keyframes vPop{50%{transform:var(--t) scale(1.12)}100%{transform:var(--t) scale(1)}}
/* Code Sprint */
.sprint{width:100%;max-width:640px;align-self:center;font:500 clamp(15px,2.1vw,19px)/1.7 var(--f-mono);color:#6E8A86;padding:0 6px;cursor:text}
.sprint .ln{white-space:pre-wrap;word-break:break-all;margin:0 0 6px}
.sprint .ln.cur{color:#CFE3DA}
.sprint .ln.nx{opacity:.45}
.sprint .ok{color:#7FE0A8}
.sprint .ko{color:#fff;background:#C2413A;border-radius:2px}
.sprint .caret{border-left:2px solid var(--acc);margin-left:-1px;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{border-color:transparent}}
.sprint-in{position:absolute;left:0;bottom:0;width:1px;height:1px;opacity:0;border:0;padding:0;font-size:16px}
/* Memory */
.mgrid{display:grid;grid-template-columns:repeat(4,var(--mc,96px));gap:10px;perspective:800px}
.mcard{all:unset;box-sizing:border-box;width:var(--mc,96px);height:var(--mc,96px);cursor:pointer;position:relative}
.mcard:focus-visible{outline:2px solid var(--acc);outline-offset:3px;border-radius:12px}
.mcard .in{position:absolute;inset:0;transition:transform .32s cubic-bezier(.3,.8,.3,1);transform-style:preserve-3d}
.mcard.up .in,.mcard.ok .in{transform:rotateY(180deg)}
.mcard .bk,.mcard .fr{position:absolute;inset:0;border-radius:12px;backface-visibility:hidden;-webkit-backface-visibility:hidden;display:grid;place-items:center}
.mcard .bk{background:repeating-linear-gradient(135deg,#1C2529 0 8px,#182024 8px 16px);box-shadow:inset 0 0 0 1px #2A3439;color:#3A4A52;font:700 calc(var(--mc) * .3)/1 var(--f-display)}
.mcard .fr{transform:rotateY(180deg);background:#E6EEEC;box-shadow:inset 0 0 0 1px #C9D1CE;gap:4px;align-content:center;color:#10181B}
.mcard .fr .tile{width:calc(var(--mc) * .52);height:calc(var(--mc) * .52);border-radius:calc(var(--mc) * .14);box-shadow:none}
.mcard .fr small{font:600 calc(var(--mc) * .1)/1.1 var(--f-body);text-align:center;padding:0 4px}
.mcard.ok .fr{box-shadow:inset 0 0 0 3px var(--acc)}
.mcard.ok{animation:mOk .4s ease}
@keyframes mOk{50%{transform:scale(1.06)}}
.vtile{transform:var(--t)}
@media (max-width:760px){.snk-hud{flex-wrap:wrap;gap:6px 16px}.snk-hud b{font-size:17px}.snk-hud .btn{padding:7px 10px;font-size:12px}}
/* Pagine di servizio */
.svcp{max-width:760px}
.svcp h2.svh{font-family:var(--f-display);font-size:17px;margin-top:12px;line-height:1.25}
.svcp p{color:var(--ink-2);font-size:15px;line-height:1.65}
.svcp .lead{font-size:16px;color:var(--ink)}
.svcp .feat h3,.svcp .stepx h3,.svcp .svlink h3{font-family:var(--f-display);font-weight:600;font-size:14px;margin:0;line-height:1.3}
.svl{margin:0;padding-left:20px;display:grid;gap:6px;color:var(--ink-2);font-size:15px}
.svlink{all:unset;box-sizing:border-box;cursor:pointer;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px 15px;display:grid;gap:6px;align-content:start}
.svlink:hover{border-color:var(--ink)}
.svlink:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.svgo{font:600 12.5px var(--f-mono);color:var(--acc)}
:root:not([data-win="dark"]) .svgo{color:#2F7C82}
.svproj{display:flex;flex-wrap:wrap;gap:8px}
.faq{display:grid;gap:8px}
.faq details{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.faq summary{cursor:pointer;font-weight:600;font-size:15px;list-style:none;display:flex;justify-content:space-between;gap:12px}
.faq summary::after{content:"+";font:600 18px/1 var(--f-mono);color:var(--muted)}
.faq details[open] summary::after{content:"–"}
.faq summary::-webkit-details-marker{display:none}
.faq details p{margin:10px 0 0;font-size:14.5px}
.svcta{margin-top:8px}
.lazy-ph{display:grid;place-items:center;min-height:200px;color:var(--muted);font:13px var(--f-mono)}
.hp{display:none!important}
.lnk{background:none;border:0;padding:0;color:inherit;text-decoration:underline;text-underline-offset:3px;cursor:pointer;font:inherit}
.ferr{margin:0;color:#C0392B;font-size:13px}
:root[data-win="dark"] .ferr{color:#FF8A7A}
.privacy h3{margin-top:6px}
.privacy p{font-size:14px;color:var(--ink-2);max-width:62ch}
.consent{position:fixed;left:12px;bottom:calc(92px + env(safe-area-inset-bottom,0px));z-index:3300;display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;align-items:start;width:min(420px,calc(100vw - 24px));padding:14px;border-radius:14px;background:color-mix(in srgb,var(--win) 94%,transparent);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);color:var(--ink);box-shadow:0 20px 50px rgba(0,0,0,.35),0 0 0 1px rgba(0,0,0,.12);font-size:13.5px;animation:tin .3s cubic-bezier(.2,.8,.2,1)}
.consent .tile{width:34px;height:34px;border-radius:9px;box-shadow:none}
.consent .tile svg{width:18px;height:18px}
.consent p{margin:0;color:var(--ink-2)}
body.locked .consent{visibility:hidden}
.ts-w{min-height:65px;max-width:100%}
.cap-w{display:flex;align-items:center;gap:6px 12px;flex-wrap:wrap}
.cap-box{display:inline-flex;align-items:center;gap:10px;padding:9px 14px 9px 10px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);cursor:pointer;font:600 13.5px var(--f-body);transition:border-color .15s}
.cap-box:hover:not(:disabled){border-color:var(--ink)}
.cap-box:disabled{cursor:default}
.cap-ic{width:20px;height:20px;border-radius:6px;border:2px solid var(--muted);display:grid;place-items:center;flex:none;transition:background .2s,border-color .2s}
.cap-w[data-state="busy"] .cap-ic{border-radius:50%;border-color:var(--line);border-top-color:var(--acc);animation:capSpin .7s linear infinite}
.cap-w[data-state="ok"] .cap-ic{background:var(--ok);border-color:var(--ok)}
.cap-w[data-state="ok"] .cap-ic::after{content:"";width:9px;height:5px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:translateY(-1px) rotate(-45deg)}
.cap-w[data-state="err"] .cap-ic{border-color:#C0392B}
.cap-note{font:11px var(--f-mono);color:var(--muted)}
@keyframes capSpin{to{transform:rotate(360deg)}}
@media (max-width:760px){.consent{bottom:calc(16px + env(safe-area-inset-bottom,0px))}}
/* Mobile widget (hidden on desktop) */
.widget{display:none}

@media (max-width:760px){
  .toasts{right:12px}
  body{overflow:auto}
  html,body{height:auto;min-height:100%}
  .menubar nav,.menubar .os,.lang{display:none}
  .desktop{position:relative;inset:auto;padding:calc(54px + env(safe-area-inset-top,0px)) 16px calc(32px + env(safe-area-inset-bottom,0px))}
  .widget{display:grid;gap:10px;padding:18px;border-radius:20px;background:var(--glass);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border:1px solid var(--glass-line);margin-bottom:22px}
  .widget .kick{color:var(--acc)}
  .widget h1{font-family:var(--f-display);font-weight:700;font-size:23px;line-height:1.12;margin:0}
  .widget p{color:var(--on-wall-dim);font-size:14.5px;margin:0}
  .icons,.icons.right{position:static;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px 4px}
  .t-cal i{font-size:22px}
  #lock{cursor:default}
  .icons.right{margin-top:16px}
  .icon{width:auto;padding:4px 0}
  .icon > span:last-child{font-size:11.5px}
  .win{position:fixed!important;left:0!important;right:0;top:calc(36px + env(safe-area-inset-top,0px))!important;bottom:0;width:auto!important;height:auto!important;max-width:none;max-height:none;min-width:0;border-radius:16px 16px 0 0;resize:none;animation:sheet .26s cubic-bezier(.2,.8,.2,1)}
  @keyframes sheet{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
  .ctl .mx{display:none}
  .bar{cursor:default}
  .dock{display:none}
  .row2{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
