/* Hide injected desktop-only application outside the window manager. */
body:not(.desktop-mode) .desktop-portfolio-section {display:none!important}
/* Desktop shell, deliberately scoped: mobile/tablet retain the existing page. */
body.desktop-mode {height:100dvh;overflow:hidden;overscroll-behavior:none}
body.desktop-mode main {position:fixed;inset:var(--header-h) 0 68px;overflow:hidden;isolation:isolate}
body.desktop-mode main > .desktop-window-host {position:absolute;inset:0;width:100%;max-width:none;margin:0;padding:0;min-height:0;display:block;pointer-events:none;transform:none;scroll-margin:0}
body.desktop-mode main > .desktop-window-host.win-hidden {visibility:hidden;pointer-events:none}
body.desktop-mode .desktop-window-host > .aero-window {
  position:absolute;display:flex;flex-direction:column;min-height:0;max-height:none;max-width:none;
  margin:0;pointer-events:auto;overflow:hidden;
  background:linear-gradient(140deg,rgba(32,35,78,.96),rgba(10,11,31,.94));
  backdrop-filter:none;box-shadow:0 28px 100px rgba(0,0,0,.65),0 0 40px rgba(110,109,230,.12),inset 0 1px 0 rgba(255,255,255,.2);
  transition:box-shadow .2s ease,border-color .2s ease;
}
body.desktop-mode .desktop-window-host.window-active > .aero-window {border-color:rgba(189,203,255,.6);box-shadow:0 34px 110px rgba(0,0,0,.72),0 0 45px rgba(115,121,246,.19),inset 0 1px 0 rgba(255,255,255,.24)}
body.desktop-mode .desktop-window-host.is-maximized > .aero-window {left:8px!important;top:8px!important;width:calc(100% - 16px)!important;height:calc(100% - 16px)!important}
body.desktop-mode .desktop-window-host .aero-window.reveal {opacity:1;transform:none}
body.desktop-mode .desktop-window-host .aero-window > .window-titlebar {flex:0 0 41px;height:41px;cursor:grab;touch-action:none;user-select:none}
body.desktop-mode.dragging-window .desktop-window-host .window-titlebar {cursor:grabbing}
body.desktop-mode .window-titlebar .window-caption {position:relative;z-index:2;pointer-events:none}
body.desktop-mode .window-titlebar .window-controls {position:relative;z-index:2;margin-right:7px;align-items:flex-start}
body.desktop-mode .window-controls .window-control {
  display:grid;place-items:center;width:36px;height:25px;padding:0;border:1px solid rgba(255,255,255,.16);border-top:0;
  background:linear-gradient(to bottom,rgba(255,255,255,.16),rgba(255,255,255,.025));
  font-size:12px;line-height:1;cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.1);
}
body.desktop-mode .window-control:focus-visible {outline:2px solid #a6dfff;outline-offset:2px}
body.desktop-mode .window-control:first-child {border-radius:0 0 0 5px}
body.desktop-mode .window-controls .window-control.close {border-radius:0 0 5px 0;background:linear-gradient(to bottom,rgba(255,108,164,.65),rgba(124,31,69,.55))}
body.desktop-mode .window-control:hover {background:rgba(200,209,255,.24)}
body.desktop-mode .window-control.close:hover {background:#c74375}
body.desktop-mode .desktop-window-host .aero-window > :not(.window-titlebar):not(.window-resize-grip) {min-height:0;flex:1 1 auto;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(143,150,222,.45) rgba(7,8,26,.2)}
body.desktop-mode .hero-body {min-height:0;grid-template-columns:minmax(0,1.45fr) minmax(290px,.7fr)}
body.desktop-mode .hero-main {padding:clamp(24px,5vw,60px)}
body.desktop-mode .hero h1 {font-size:clamp(60px,7.8vw,118px)}
body.desktop-mode .hero-stack {padding:23px}
body.desktop-mode .stack-intro {margin:19px 0 16px}
body.desktop-mode .stack-intro h2 {font-size:21px}
body.desktop-mode .stack-grid {gap:6px}
body.desktop-mode .stack-item {min-height:51px;padding:7px}
body.desktop-mode .desktop-window-host .content-window {min-height:0}
body.desktop-mode .desktop-window-host .section-grid {min-height:100%;align-content:start}
body.desktop-mode .desktop-window-host .section-heading {padding:33px clamp(24px,3vw,44px)}
body.desktop-mode .desktop-window-host .copy-column {padding:33px clamp(24px,3vw,50px)}
body.desktop-mode .desktop-window-host .skill-explorer {padding:28px}
body.desktop-mode .desktop-window-host .timeline {padding:34px}
body.desktop-mode .desktop-window-host .photo-section {padding:28px clamp(22px,3vw,42px)}
body.desktop-mode .desktop-window-host .contact-body {padding:40px clamp(22px,4vw,50px)}
body.desktop-mode .window-resize-grip {position:absolute;bottom:0;right:0;z-index:8;width:25px;height:25px;cursor:nwse-resize;touch-action:none;background:linear-gradient(135deg,transparent 53%,rgba(222,225,255,.22) 55% 58%,transparent 59% 67%,rgba(222,225,255,.55) 69% 72%,transparent 73%);border-radius:0 0 13px 0}
body.desktop-mode .is-maximized .window-resize-grip {display:none}
body.desktop-mode .window-interacting {transition:none!important;user-select:none}
body.desktop-mode .site-footer {display:none}
body.desktop-mode .cookie-note {bottom:86px}

/* Refractive glass: backdrop-filter with SVG displacement in Chromium;
   gracefully fall back to translucent frosted glass elsewhere. */
body.desktop-mode .desktop-window-host .window-titlebar {isolation:isolate;background:rgba(45,47,99,.16)}
body.desktop-mode .desktop-window-host .window-titlebar::before {
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(212,222,255,.17),rgba(90,101,196,.04) 70%,rgba(10,12,45,.14));
  backdrop-filter:blur(15px) saturate(175%);
  -webkit-backdrop-filter:blur(15px) saturate(175%);
}
body.desktop-mode .desktop-window-host .window-titlebar::after {
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(ellipse 220px 70px at var(--light-x,24%) -65%,rgba(255,255,255,.24),transparent 80%),linear-gradient(180deg,rgba(255,255,255,.19),transparent 24%,transparent 87%,rgba(139,165,255,.2));
}
.desktop-dock,.desktop-start-menu {font-family:var(--font-ui);color:#e9eaff}
.desktop-dock {position:fixed;z-index:180;left:50%;bottom:14px;transform:translateX(-50%);display:flex;align-items:center;gap:9px;height:53px;max-width:calc(100vw - 38px);padding:6px 11px;border:1px solid rgba(202,211,255,.36);border-radius:20px;background:rgba(28,30,67,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.27),0 14px 48px rgba(0,0,0,.46),0 0 38px rgba(102,107,238,.13);isolation:isolate}
.desktop-dock::before,.desktop-start-menu::before {content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:linear-gradient(140deg,rgba(180,191,255,.19),rgba(40,43,109,.28) 46%,rgba(132,111,255,.12));backdrop-filter:blur(23px) saturate(180%);-webkit-backdrop-filter:blur(23px) saturate(180%)}
.desktop-dock::after {content:"";position:absolute;inset:1px;z-index:-1;border-radius:inherit;pointer-events:none;background:radial-gradient(ellipse 250px 90px at var(--light-x,36%) -90%,rgba(255,255,255,.31),transparent 82%),linear-gradient(180deg,rgba(255,255,255,.18),transparent 37%,transparent 78%,rgba(171,187,255,.12));box-shadow:inset 0 1px 0 rgba(255,255,255,.24),inset 0 -1px 0 rgba(191,169,255,.25)}
.desktop-dock button,.desktop-start-menu button {font:inherit;color:inherit;cursor:pointer}
.dock-start {width:34px;height:34px;flex:0 0 34px;border:1px solid rgba(255,255,255,.22);border-radius:10px;background:linear-gradient(135deg,rgba(147,153,255,.34),rgba(88,75,190,.27));font-size:22px;line-height:1}
.dock-start:hover,.dock-start[aria-expanded=true] {background:rgba(152,160,255,.43)}
.dock-separator {height:24px;width:1px;flex:0 0 1px;background:rgba(220,223,255,.25)}
.dock-apps {display:flex;align-items:center;gap:4px;min-width:0;overflow-x:auto;scrollbar-width:none}
.dock-apps::-webkit-scrollbar {display:none}
.dock-tab {position:relative;display:flex;gap:7px;align-items:center;justify-content:center;height:35px;max-width:155px;min-width:44px;padding:0 12px;border:1px solid transparent;border-radius:10px;background:transparent;white-space:nowrap;font-size:12px;transition:background .15s ease,border-color .15s ease}
.dock-tab:hover {background:rgba(215,221,255,.13)}
.dock-tab.is-active {border-color:rgba(223,231,255,.27);background:rgba(146,159,255,.24);box-shadow:inset 0 1px 0 rgba(255,255,255,.15)}
.dock-symbol {font-family:var(--font-mono);font-size:18px;color:#c7caff}
.dock-indicator {position:absolute;bottom:1px;left:50%;width:4px;height:4px;transform:translateX(-50%);border-radius:50%;background:transparent}
.dock-tab.is-open .dock-indicator {background:var(--cyan);box-shadow:0 0 8px var(--cyan)}
.dock-tab.is-minimized .dock-indicator {background:#757aa8}
.dock-clock {min-width:46px;color:#d4d8fb;white-space:nowrap;text-align:center;font:12px var(--font-mono)}
.desktop-start-menu {position:fixed;z-index:190;left:max(16px,calc(50% - 365px));bottom:78px;min-width:212px;padding:8px;border:1px solid rgba(213,219,255,.35);border-radius:16px;background:rgba(23,25,62,.25);box-shadow:0 22px 66px rgba(0,0,0,.52);isolation:isolate}
.desktop-start-menu[hidden] {display:none}
.start-menu-app {display:flex;align-items:center;gap:13px;width:100%;padding:9px 13px;border:0;border-radius:9px;background:transparent;text-align:left;font-size:13px}
.start-menu-app>span:first-child {display:grid;place-items:center;width:28px;height:28px;border:1px solid rgba(179,189,255,.2);border-radius:8px;background:rgba(130,134,232,.14);font-size:19px;color:#cad1ff}
.start-menu-app:hover {background:rgba(201,210,255,.13)}
.desktop-dock :is(button):focus-visible,.desktop-start-menu button:focus-visible {outline:2px solid #a9f0ff;outline-offset:2px}
html.glass-refraction-supported body.desktop-mode .desktop-dock::before {backdrop-filter:url(#scrmvv-glass-dock) blur(9px) saturate(185%);-webkit-backdrop-filter:url(#scrmvv-glass-dock) blur(9px) saturate(185%)}
html.glass-refraction-supported body.desktop-mode .desktop-window-host .window-titlebar::before {backdrop-filter:url(#scrmvv-glass-title) blur(9px) saturate(170%);-webkit-backdrop-filter:url(#scrmvv-glass-title) blur(9px) saturate(170%)}
html.glass-refraction-supported body.desktop-mode .desktop-start-menu::before {backdrop-filter:url(#scrmvv-glass-dock) blur(11px) saturate(175%);-webkit-backdrop-filter:url(#scrmvv-glass-dock) blur(11px) saturate(175%)}
@media (max-width:1350px) { .dock-tab {padding-inline:9px}.dock-apps {gap:1px}.desktop-dock {gap:6px} }
@media (prefers-reduced-motion:reduce) {.dock-tab,.desktop-window-host>.aero-window {transition:none!important}}

/* scrmvv OS icon refresh — small vector glyphs, subtle identity per app. */
body.desktop-mode .desktop-os-svg {display:block;width:16px;height:16px;flex:none;pointer-events:none}
body.desktop-mode .window-controls .window-control .desktop-os-svg {width:13px;height:13px;stroke-width:1.9}
body.desktop-mode .window-control-max .desktop-os-svg {width:13px;height:13px}
body.desktop-mode .window-titlebar .desktop-os-caption {width:21px;height:21px;border-radius:7px;color:var(--section-accent,#bcc6ff)}
body.desktop-mode .window-titlebar .desktop-os-caption .desktop-os-svg {width:14px;height:14px;stroke-width:1.85}
body.desktop-mode .dock-symbol {display:grid;place-items:center;color:#bac8ff}
body.desktop-mode .dock-symbol .desktop-os-svg {width:18px;height:18px}
body.desktop-mode .dock-tab:nth-child(2) .dock-symbol {color:#d5baff}
body.desktop-mode .dock-tab:nth-child(3) .dock-symbol {color:#9cdfff}
body.desktop-mode .dock-tab:nth-child(4) .dock-symbol {color:#ffcaad}
body.desktop-mode .dock-tab:nth-child(5) .dock-symbol {color:#d7b6ff}
body.desktop-mode .dock-tab:nth-child(6) .dock-symbol {color:#a5e4ee}
body.desktop-mode .dock-start {display:grid;place-items:center}
body.desktop-mode .dock-start .desktop-os-svg {width:17px;height:17px}
body.desktop-mode .start-menu-app>span:first-child .desktop-os-svg {width:17px;height:17px}

/* Window-internal responsiveness, independent of monitor width. */
body.desktop-mode .desktop-window-host.desktop-window-compact .section-grid {grid-template-columns:minmax(0,1fr);min-height:0}
body.desktop-mode .desktop-window-host.desktop-window-compact .section-heading {border-right:0;border-bottom:1px solid rgba(255,255,255,.1);padding:24px 30px 20px}
body.desktop-mode .desktop-window-host.desktop-window-compact .copy-column,
body.desktop-mode .desktop-window-host.desktop-window-compact .skill-explorer,
body.desktop-mode .desktop-window-host.desktop-window-compact .timeline {padding:24px 30px}
body.desktop-mode .desktop-window-host.desktop-window-compact .section-heading h2 {font-size:clamp(28px,3vw,42px)}
body.desktop-mode .desktop-window-host.desktop-window-compact .hero-body {grid-template-columns:minmax(0,1fr);min-height:0}
body.desktop-mode .desktop-window-host.desktop-window-compact .hero-main {padding:30px 36px}
body.desktop-mode .desktop-window-host.desktop-window-compact .hero h1 {font-size:clamp(58px,6vw,94px)}
body.desktop-mode .desktop-window-host.desktop-window-compact .hero-stack {padding:25px 32px}
body.desktop-mode .desktop-window-host.desktop-window-compact .photo-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
body.desktop-mode .desktop-window-host.desktop-window-compact .contact-links {grid-template-columns:repeat(2,minmax(0,1fr))}
body.desktop-mode .desktop-window-host.desktop-window-compact .section-heading,
body.desktop-mode .desktop-window-host.desktop-window-compact .copy-column {min-width:0;overflow-wrap:anywhere}
body.desktop-mode .desktop-window-host.desktop-window-short .hero-main {padding-block:22px}

/* === scrmvv OS v4: restored desktop shell, opaque windows, custom dock === */
@media (min-width:1051px) and (pointer:fine) {
  body.page-home.desktop-mode { padding-top:0 !important; }
  body.page-home.desktop-mode > .site-header { display:none !important; }
  body.page-home.desktop-mode main { inset:0 0 70px !important; }
  body.page-home.desktop-mode main > .desktop-window-host > .aero-window {
    opacity:1!important;
    background:#11152f!important;
    background-image:linear-gradient(145deg,#171c3d 0%,#0b0e27 100%)!important;
    -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
    isolation:isolate;
  }
  /* The pane itself must block the contents of other applications. */
  body.page-home.desktop-mode main > .desktop-window-host > .aero-window > :not(.window-titlebar):not(.window-resize-grip) {
    position:relative;z-index:1;background-color:#11152f;
  }
  body.page-home.desktop-mode .hero-body { background:#141833!important; }
  body.page-home.desktop-mode .content-window { background:#10142d!important; }
  body.page-home.desktop-mode .hero-main { background:linear-gradient(145deg,#1a1d40,#101431); }
  body.page-home.desktop-mode .hero-stack { background:linear-gradient(150deg,#1c2347,#0a0f29)!important; }
  body.page-home.desktop-mode .desktop-window-host .window-titlebar {z-index:4;background:linear-gradient(180deg,#3b416f 0%,#222851 70%,#181b3b 100%);}
  body.page-home.desktop-mode .desktop-window-host .window-titlebar::before {backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:linear-gradient(180deg,rgba(255,255,255,.1),transparent 75%);}
  body.page-home.desktop-mode .desktop-window-host .window-titlebar::after {opacity:.85;}
  .desktop-dock {z-index:250;gap:7px;max-width:calc(100vw - 26px);background:rgba(24,26,63,.92)}
  .desktop-dock::before {background:linear-gradient(135deg,rgba(130,137,236,.16),rgba(18,19,50,.4));backdrop-filter:blur(18px) saturate(145%)!important;-webkit-backdrop-filter:blur(18px) saturate(145%)!important;}
  .desktop-dock .dock-start {width:38px;height:38px;flex:0 0 38px;display:grid;place-items:center;padding:5px;border-radius:12px;background:linear-gradient(145deg,rgba(150,145,248,.35),rgba(66,58,154,.38));}
  .dock-brand-mark {width:28px;height:28px;object-fit:contain;filter:drop-shadow(0 0 6px rgba(146,122,255,.32));}
  .desktop-dock .dock-portfolio {height:37px;display:inline-flex;align-items:center;gap:8px;padding:0 13px;white-space:nowrap;border:1px solid rgba(187,181,255,.42);border-radius:11px;background:linear-gradient(140deg,rgba(120,94,210,.45),rgba(58,51,130,.7));box-shadow:inset 0 1px rgba(255,255,255,.17),0 0 14px rgba(105,83,206,.13);font-size:12px;font-weight:650;color:#f3ecff;text-decoration:none;}
  .desktop-dock .dock-portfolio:hover {background:rgba(125,102,223,.68);border-color:rgba(223,205,255,.7)}
  .desktop-dock .dock-portfolio .desktop-os-svg {width:17px;height:17px;color:#ddc6ff;}
  .desktop-dock .dock-lang {border:1px solid rgba(180,182,249,.22);border-radius:8px;padding:5px 7px;min-width:32px;background:rgba(131,131,221,.15);font-size:10px;font-weight:650;}
  .desktop-dock .dock-lang:hover {background:rgba(156,144,234,.3)}
  .desktop-start-menu {width:320px;min-width:320px;left:calc(50% - 450px);bottom:78px;padding:12px;border-radius:19px;z-index:260;background:#171a3d!important;border:1px solid rgba(186,178,255,.36);box-shadow:0 24px 84px rgba(0,0,0,.72),inset 0 1px rgba(255,255,255,.2);}
  .desktop-start-menu::before {background:linear-gradient(145deg,rgba(132,122,231,.18),rgba(19,20,55,.12));-webkit-backdrop-filter:none!important;backdrop-filter:none!important;}
  .start-menu-heading {display:flex;align-items:center;gap:10px;padding:9px 10px 13px;}
  .start-menu-heading img {width:34px;height:34px;object-fit:contain;}
  .start-menu-heading strong,.start-menu-heading small {display:block;line-height:1.35}
  .start-menu-heading strong {font-size:14px;font-weight:650;letter-spacing:-.015em}
  .start-menu-heading small {font:10px var(--font-mono);color:#a5a6d2;letter-spacing:.05em}
  .desktop-start-menu .start-menu-portfolio {display:flex;align-items:center;gap:12px;width:100%;padding:12px 13px;border:1px solid rgba(197,177,255,.42);border-radius:13px;background:linear-gradient(125deg,rgba(120,92,215,.38),rgba(54,52,124,.55));font-size:13px;font-weight:650;color:#faf5ff;}
  .desktop-start-menu .start-menu-portfolio svg {width:20px;height:20px;color:#ded1ff}
  .start-menu-arrow {margin-left:auto;font-size:18px;color:#c5adff}
  .start-menu-section-label {padding:17px 6px 9px;color:#9fa4d1;font:9px var(--font-mono);letter-spacing:.16em}
  .desktop-start-menu .start-menu-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;}
  .desktop-start-menu .start-menu-app {min-width:0;gap:8px;padding:9px 7px;border-radius:10px;font-size:11px;}
  .desktop-start-menu .start-menu-app-icon {display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;border:1px solid rgba(184,190,254,.25);border-radius:9px;background:rgba(125,121,214,.16);}
  .desktop-start-menu .start-menu-app-icon svg {width:17px;height:17px}
  .desktop-start-menu .start-menu-app>span:last-child {overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .desktop-start-menu .start-menu-app:hover {background:rgba(175,166,254,.17);}
}
@media (min-width:1051px) and (max-width:1250px) and (pointer:fine) {
  .desktop-dock .dock-tab {padding:0 7px;gap:5px;font-size:11px}
  .desktop-dock .dock-portfolio {padding:0 9px}
  .desktop-dock {gap:5px;padding:6px 8px}
  .desktop-start-menu {left:14px}
}
@media (min-width:1051px) and (max-width:1135px) and (pointer:fine) {
  .desktop-dock .dock-tab .dock-label {display:none}
  .desktop-dock .dock-tab {min-width:37px}
}


/* scrmvv OS v5 — restore the original large application launcher with search */
@media (min-width:1051px) and (pointer:fine) {
  body.desktop-mode .desktop-start-menu {box-sizing:border-box;left:50%!important;transform:translateX(-50%);width:min(600px,calc(100vw - 32px))!important;min-width:0!important;max-height:min(720px,calc(100dvh - 98px));bottom:80px!important;padding:0!important;border-radius:25px!important;display:flex;flex-direction:column;overflow:hidden;background:#11173a!important;border:1px solid rgba(165,178,248,.44)!important;box-shadow:0 26px 100px #030416d9,0 0 35px #5f50c323!important;}
  body.desktop-mode .desktop-start-menu[hidden] {display:none!important;}
  body.desktop-mode .desktop-start-menu::before{background:linear-gradient(165deg,#2e346ac9,#11183caa 46%,#0c1032e8);backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}
  .os-start-heading {position:relative;display:flex;align-items:center;gap:12px;padding:24px 27px 14px;flex:none;}
  .os-start-heading>img {width:42px;height:42px;object-fit:contain;}
  .os-start-brand {display:flex;flex-direction:column;gap:3px;}
  .os-start-brand small {font:9px var(--font-mono);letter-spacing:.16em;color:#9fa8d7;}
  .os-start-brand strong {font-size:19px;letter-spacing:-.05em;}
  .os-start-brand strong span {font-weight:400;color:#afb8dd;}
  .desktop-start-menu .os-start-close {margin-left:auto;display:grid;place-items:center;width:33px;height:33px;border:1px solid #8e95d044;border-radius:10px;background:#8994e919;}
  .os-start-close svg {width:15px;height:15px;}
  .os-start-search {height:45px;margin:0 28px 11px;padding:0 13px;display:flex;align-items:center;gap:10px;border:1px solid #8a91cb5a;border-radius:12px;background:#0a1030;color:#9fabdb;flex:none;}
  .os-start-search svg {width:19px;height:19px;flex:none;}
  .os-start-search input {width:100%;min-width:0;border:0;background:transparent;color:#f4f4ff;font:13px var(--font-ui);outline:none;}
  .os-start-search input::placeholder{color:#a7b0d1;}
  .os-start-search kbd {font:10px var(--font-mono);padding:3px 5px;border:1px solid #888dc855;border-radius:5px;color:#9ea7cd;}
  .os-start-scroll {min-height:0;overflow-y:auto;overflow-x:hidden;padding:0 26px 18px;scrollbar-width:thin;scrollbar-color:#777dc0 transparent;}
  .os-start-label {display:flex;align-items:center;justify-content:space-between;gap:15px;margin:14px 4px 11px;}
  .os-start-label strong {font-size:12px;color:#d9ddff;}
  .os-start-label span {font:10px var(--font-mono);color:#a5aedb;letter-spacing:.1em;}
  .desktop-start-menu .start-menu-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}
  .desktop-start-menu .start-menu-app {display:flex;gap:10px;align-items:center;padding:13px 10px;border:1px solid #808bc329;border-radius:14px;background:#1a2152a6;font-size:12px;min-height:64px;}
  .desktop-start-menu .start-menu-app[hidden] {display:none;}
  .desktop-start-menu .start-menu-app:hover,.os-start-project:hover{background:#323878aa;border-color:#b9baff66;}
  .desktop-start-menu .start-menu-app-icon {display:grid;place-items:center;width:39px;height:39px;flex:0 0 39px;border:1px solid #8d9dcd6b;border-radius:12px;background:linear-gradient(145deg,#333e84,#171f50);}
  .desktop-start-menu .start-menu-app-icon svg {width:21px;height:21px;}
  .os-start-project-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
  .os-start-project {display:flex;gap:10px;text-align:left;align-items:center;min-width:0;min-height:69px;padding:9px;border:1px solid #8b92c02c;border-radius:13px;background:#19204d7d;}
  .os-start-project img {width:63px;height:49px;flex:0 0 63px;object-fit:cover;border-radius:7px;background:#141b39;}
  .os-project-text {min-width:0;display:flex;flex-direction:column;gap:5px;}
  .os-project-text strong {display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:12px;line-height:1.25;color:#f0f0ff;}
  .os-project-text small {overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;color:#a4afdb;}
  .os-start-empty {padding:28px;text-align:center;color:#abb2dd;font-size:13px;}
  .os-start-footer {display:flex;align-items:center;gap:9px;flex:none;margin-top:auto;padding:13px 22px;background:#0d1233;border-top:1px solid #868dba33;}
  .os-start-avatar {display:grid;place-items:center;flex:0 0 35px;width:35px;height:35px;border-radius:50%;background:linear-gradient(130deg,#7367c3,#3a3673);font-size:13px;}
  .os-start-person {display:flex;flex-direction:column;gap:2px;}
  .os-start-person strong {font-size:12px;line-height:1;}
  .os-start-person small {font-size:10px;color:#919dc4;}
  .os-start-status {margin-left:auto;font:10px var(--font-mono);letter-spacing:.04em;color:#c7a3bb;white-space:nowrap;}
  .os-start-langs {display:flex;gap:2px;border:1px solid #9e9cc34f;border-radius:8px;padding:3px;}
  .desktop-start-menu .os-start-langs button {min-width:28px;padding:5px 6px;border:0;border-radius:5px;background:transparent;font-size:12px;}
  .desktop-start-menu .os-start-langs .is-selected {background:linear-gradient(140deg,#666ed0,#3b3c94);}
  .desktop-dock .dock-portfolio {cursor:pointer;font-family:var(--font-ui);}
  body:not(.desktop-mode) .desktop-portfolio-section {display:none!important;}
  body.desktop-mode #desktop-portfolio-app .desktop-portfolio-window {min-width:0;}
  body.desktop-mode #desktop-portfolio-app .desktop-portfolio-content {flex:1 1 auto;min-width:0;min-height:0;overflow:auto;padding:29px 32px 40px;background:#111630!important;scrollbar-width:thin;}
  .os-portfolio-top {display:flex;align-items:start;justify-content:space-between;gap:22px;margin-bottom:23px;}
  .os-portfolio-kicker {font:10px var(--font-mono);letter-spacing:.14em;color:#b8a5f8;}
  .os-portfolio-top h2 {font-size:clamp(28px,3.1vw,43px);font-weight:800;margin:7px 0 7px;}
  .os-portfolio-top p {color:#abb4dd;font-size:14px;}
  .os-portfolio-number {font:11px var(--font-mono);color:#b9b2e2;white-space:nowrap;}
  .os-portfolio-search {display:flex;align-items:center;gap:10px;max-width:500px;padding:10px 13px;margin-bottom:21px;border:1px solid #939ec04d;border-radius:12px;background:#090e27;}
  .os-portfolio-search svg {width:18px;height:18px;color:#a2addd;}
  .os-portfolio-search input {width:100%;border:0;outline:0;background:transparent;color:#e9ecff;font:13px var(--font-ui);}
  .os-portfolio-cards {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;}
  .os-portfolio-card {display:flex;flex-direction:column;gap:12px;min-width:0;padding:0 0 15px;overflow:hidden;border:1px solid #a1a1eb3c;border-radius:14px;background:#191d42;text-align:left;cursor:pointer;}
  .os-portfolio-card img {width:100%;height:170px;object-fit:cover;}
  .os-portfolio-card .os-project-text {padding:0 15px;}
  .os-portfolio-card .os-project-text strong {font-size:15px;}
  .os-portfolio-card .os-project-text small {font-size:12px;}
  .os-portfolio-card:hover {border-color:#b5a7f3;transform:translateY(-1px);}
  .os-portfolio-details h3{font-size:27px;margin:17px 0 10px;}
  .os-project-back {color:#c7c0f9;font:13px var(--font-ui);background:#26285a;border:1px solid #797ac855;border-radius:9px;padding:9px 12px;cursor:pointer;}
  .os-project-meta {color:#9dafe2;font:12px var(--font-mono);margin-bottom:20px;}
  .os-project-description {color:#c6cde8;font-size:15px;line-height:1.6;max-width:800px;}
  .os-project-stack {display:flex;gap:6px;flex-wrap:wrap;margin:17px 0;}
  .os-project-stack span{padding:5px 9px;font:12px var(--font-mono);border:1px solid #9697cf54;border-radius:7px;}
  .os-project-gallery {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:22px;}
  .os-project-gallery img {width:100%;border-radius:11px;}
  .os-empty {padding:30px;text-align:center;color:#afb4e0;}
}
@media (min-width:1051px) and (max-width:1280px) and (pointer:fine) {.desktop-start-menu .start-menu-grid {gap:6px;} .desktop-start-menu .start-menu-app {padding:9px 7px;} }
/* Hide the dynamically generated desktop-only portfolio when switching to mobile. */
body:not(.desktop-mode) #desktop-portfolio-app {display:none!important;}
body.desktop-mode .os-portfolio-cards[hidden],body.desktop-mode .os-portfolio-details[hidden],body.desktop-mode .os-start-project-grid[hidden],body.desktop-mode .os-start-projects-head[hidden],body.desktop-mode .os-start-label[hidden],body.desktop-mode .os-start-empty[hidden]{display:none!important;}

/* Portfolio entries without screenshots use a deliberate cover, not a broken image. */
.os-portfolio-card:not(:has(img))::before{content:"CASE STUDY  /  DJANGO";display:flex;align-items:flex-end;padding:20px;box-sizing:border-box;width:100%;height:170px;background:radial-gradient(circle at 70% 30%,rgba(121,96,213,.32),transparent 70%),linear-gradient(135deg,#222a62,#11142b);color:#b8b7f2;font:700 12px var(--font-mono);letter-spacing:.08em}


/* v8 — restored Portfolio Explorer inside the OS window. Layout is scoped to
   this one app, so desktop dock, Start menu and other windows stay untouched. */
@media (min-width:1051px) and (pointer:fine) {
  body.desktop-mode #desktop-portfolio-app .desktop-portfolio-content {
    display:flex;flex-direction:column;flex:1 1 0%;min-height:0;min-width:0;
    padding:0!important;overflow:hidden!important;background:#10142e!important;
  }
  body.desktop-mode #desktop-portfolio-app .os-explorer-toolbar {flex:0 0 auto;min-height:46px;}
  body.desktop-mode #desktop-portfolio-app .os-explorer-layout {
    flex:1 1 0%;min-height:0;height:0;grid-template-columns:minmax(185px,29%) minmax(0,1fr);
  }
  body.desktop-mode #desktop-portfolio-app .project-list-pane {min-width:0;min-height:0;overflow:auto;scrollbar-width:thin;}
  body.desktop-mode #desktop-portfolio-app .os-explorer-preview {min-height:0;min-width:0;padding:18px clamp(14px,2vw,29px);overflow-y:auto;}
  body.desktop-mode #desktop-portfolio-app .explorer-statusbar {flex:0 0 auto;}
  body.desktop-mode #desktop-portfolio-app .os-explorer-search {display:flex;align-items:center;gap:7px;min-width:115px;width:clamp(130px,18vw,225px);padding:7px 9px;border:1px solid #8b92b757;border-radius:6px;background:#0a102a;}
  body.desktop-mode #desktop-portfolio-app .os-explorer-search .desktop-os-svg {width:16px;height:16px;color:#9fa8d8;flex-shrink:0}
  body.desktop-mode #desktop-portfolio-app .os-explorer-search input {min-width:0;width:100%;font:11px var(--font-ui);color:#e9edff;background:transparent;border:0;outline:none}
  body.desktop-mode #desktop-portfolio-app .os-explorer-tags {display:flex;flex-wrap:wrap;gap:5px;align-items:flex-start}
  body.desktop-mode #desktop-portfolio-app .os-project-tag {display:inline-flex;padding:4px 8px;border:1px solid #b2b9e03d;border-radius:7px;background:#1a1d3d;font:10px var(--font-mono);line-height:1.15;color:#e0e3ff;white-space:nowrap}
  body.desktop-mode #desktop-portfolio-app .os-explorer-visual {min-height:160px;}
  body.desktop-mode #desktop-portfolio-app .project-cover-button {min-height:160px;}
  body.desktop-mode #desktop-portfolio-app .os-explorer-visual img {max-height:260px;object-fit:contain}
  body.desktop-mode #desktop-portfolio-app .os-explorer-gallery {display:flex;gap:8px;overflow-x:auto;padding:4px 1px 7px;scrollbar-width:thin;}
  body.desktop-mode #desktop-portfolio-app .os-explorer-gallery .gallery-button {flex:0 0 93px;width:93px;aspect-ratio:16/10;}
  body.desktop-mode #desktop-portfolio-app .project-header {margin-top:17px;}
  body.desktop-mode #desktop-portfolio-app .project-header h2 {font-size:clamp(20px,2.3vw,28px)}
  body.desktop-mode #desktop-portfolio-app .project-description {font-size:13px;line-height:1.55;margin:12px 0 15px}
  body.desktop-mode #desktop-portfolio-app .project-meta {grid-template-columns:repeat(3,minmax(0,1fr))}
  body.desktop-mode #desktop-portfolio-app.desktop-window-compact .os-explorer-layout {grid-template-columns:170px minmax(0,1fr)}
  body.desktop-mode #desktop-portfolio-app.desktop-window-compact .project-header h2 {font-size:21px}
  body.desktop-mode #desktop-portfolio-app.desktop-window-compact .project-meta {grid-template-columns:1fr}
  body.desktop-mode #desktop-portfolio-app.desktop-window-compact .project-meta>div {padding:9px}
  body.desktop-mode #desktop-portfolio-app.desktop-window-compact .os-explorer-search {width:132px}
}