html, body { background:#c4edff; }
.desktop-wallpaper { position:fixed; inset:-18px; pointer-events:none; background:url('./assets/desktop-wallpaper.png') center / cover no-repeat; transform:translate3d(var(--wall-x,0px),var(--wall-y,0px),0); will-change:transform; }
.desktop-light { position:fixed; inset:0; pointer-events:none; background:radial-gradient(450px circle at var(--light-x,50%) var(--light-y,40%),rgba(255,255,255,.22),transparent); }
.desktop-menubar { position:fixed; z-index:90; top:0; left:0; right:0; height:34px; display:flex; align-items:center; gap:24px; padding:0 22px; color:#173b65; background:#ffffff70; border-bottom:1px solid #ffffff80; backdrop-filter:blur(24px); font-size:13px; }
.desktop-menubar a { text-decoration:none; color:inherit; }.desktop-menubar button { border:0; background:none; color:inherit; cursor:pointer; font:inherit; }.desktop-menubar time { margin-left:auto; }
.hero,.folder-scene { background:transparent; }.hero .ambient,.hero .fluid-stage,.hero::after { display:none; }
.hero { pointer-events:none; }.hero .dock { pointer-events:auto; }
.portfolio-discipline { margin-left:auto; font-size:11px; letter-spacing:.08em; opacity:.65; }
.portfolio-explore { position:absolute; bottom:110px; left:50%; transform:translateX(-50%); pointer-events:auto; text-decoration:none; color:#154897; font-size:12px; letter-spacing:.15em; padding:10px 18px; border-radius:24px; background:#ffffff75; backdrop-filter:blur(12px); }.portfolio-explore span { margin-left:12px; }
.folder-scene { backdrop-filter:blur(14px); background:#d3edff65; }
.dock,.second-dock { position:fixed; z-index:91; bottom:18px; padding:10px 14px; gap:12px; border-radius:24px; background:#ffffff70; border:1px solid #ffffffb0; box-shadow:0 8px 28px #285d8526,inset 0 1px #fff; backdrop-filter:blur(28px) saturate(1.4); }
.second-dock { display:none; }.dock a { position:relative; width:56px; transform:translateY(calc(var(--dock-scale,0) * -9px)) scale(calc(1 + var(--dock-scale,0) * .32)); transition:transform .12s ease-out; }.dock a::after { content:attr(aria-label); position:absolute; bottom:calc(100% + 16px); left:50%; transform:translateX(-50%); white-space:nowrap; padding:5px 9px; border-radius:7px; background:#f5fbffeb; color:#23476b; font-size:11px; opacity:0; }.dock a:hover::after,.dock a:focus-visible::after { opacity:1; }
.folder-label,.folder-open-label { color:#153d70; text-shadow:0 1px 2px #fff; }
.project-modal { background:#133f6a22; backdrop-filter:blur(5px); padding:48px 22px 100px; }.project-modal__window { height:min(780px,calc(100svh - 160px)); transform:translate(var(--window-x,0px),var(--window-y,0px)) scale(.97); }.project-modal.is-open .project-modal__window { transform:translate(var(--window-x,0px),var(--window-y,0px)) scale(1); }.project-modal__bar { cursor:grab; touch-action:none; user-select:none; }.window-controls { display:flex; gap:7px; }.window-controls button { width:13px; height:13px; padding:0; border:1px solid #0001; border-radius:50%; cursor:pointer; background:#ff6058; }.window-controls button:nth-child(2) { background:#ffbd2e; }.window-controls button:nth-child(3) { background:#28c840; }
.project-modal.is-maximized .project-modal__window { width:100%; height:100%; transform:none; }.project-modal.is-maximized { padding:42px 10px 96px; }
@media(max-width:700px) { .desktop-menubar { gap:14px; padding:0 12px; font-size:11px; }.dock a { width:46px; }.desktop-wallpaper { background-size:auto 100%; }.project-modal { padding:42px 8px 90px; }.project-modal__window { height:100%; } }
@media(prefers-reduced-motion:reduce) { .desktop-wallpaper { transform:none; }.dock a { transition:none; } }