/* Approved cobalt studio: shared desktop materials and portfolio window. */
:root{--mb:28px}
#screen{--win:#f7f3ed;--win-2:#f0ece5;--sidebar:#f3eee7;--titlebar:#eeebe6;--text:#182638;--text-2:#60636b;--text-3:#74767d;--sep:rgba(60,52,42,.14);--hover:rgba(49,66,93,.065);--field:rgba(51,60,75,.055);--menubar:rgba(9,29,76,.72);--menubar-text:#f4f7ff;--glass:rgba(246,242,235,.92);--glass-border:rgba(255,255,255,.36);--shadow:0 20px 60px rgba(5,17,45,.22),0 0 0 1px rgba(34,40,55,.14);--shadow-soft:0 12px 40px rgba(5,17,45,.16),0 0 0 1px rgba(34,40,55,.12)}
#screen.dark{--win:#24262b;--win-2:#2d3036;--sidebar:#282a30;--titlebar:#2e3036;--text:#f1eee8;--text-2:#b7b7bc;--text-3:#aaaab0;--sep:rgba(245,240,230,.13);--hover:rgba(255,255,255,.075);--field:rgba(255,255,255,.07)}
#wallpaper.wp-cobalt,.lbg.wp-cobalt{background:#123371 url('assets/cobalt-wallpaper.jpg') center/cover no-repeat}
#wallpaper.wp-cobalt::after{display:none}
#menubar{height:calc(28px + env(safe-area-inset-top,0px));font-size:13px;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid rgba(255,255,255,.07)}
#menubar .mi{padding-inline:9px}
#menubar .logo{margin-right:3px}
#dock{border-radius:18px;background:rgba(233,237,245,.48);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);border:1px solid rgba(255,255,255,.4);box-shadow:0 8px 25px rgba(5,17,45,.19);padding:8px 10px 10px;gap:3px}
#dockWrap{bottom:12px}
#dock .ditem .ic svg{filter:drop-shadow(0 2px 2px rgba(0,0,0,.16))}
#dock .dsep{margin-inline:5px;background:rgba(57,62,77,.2)}
.win{background:var(--win);border:1px solid rgba(255,255,255,.55);border-radius:16px;box-shadow:var(--shadow);backdrop-filter:none;-webkit-backdrop-filter:none}
.win.inactive{box-shadow:var(--shadow-soft)}
.win .titlebar{background:var(--titlebar);border-bottom:1px solid var(--sep);height:38px;padding-inline:14px;backdrop-filter:none;-webkit-backdrop-filter:none}
.win .titlebar.tall{height:48px}
.win .lights{gap:8px}
.win .lights button{width:12px;height:12px}
.win .wbody{background:var(--win)}
.win .page,.win .main,.win .safari{background:var(--win)}
.win .side{background:var(--sidebar);backdrop-filter:none;-webkit-backdrop-filter:none}
#screen :focus-visible{outline:2px solid var(--accent);outline-offset:3px}
#screen.studio-visible #desktop .dicon,#screen.studio-visible #widget{visibility:hidden;pointer-events:none}
.widget{border-radius:16px;box-shadow:var(--shadow-soft);padding:22px;background:var(--win)}
.widget h2{font-family:Georgia,'Times New Roman',serif;font-size:28px;font-weight:500}
.widget .eyebrow{font-size:10px;letter-spacing:.08em}
.studio-window>.titlebar{height:34px;min-height:34px;background:var(--titlebar)}
.studio-window>.titlebar .title{display:none}
.studio-sidebar{width:225px;flex:none;background:var(--sidebar);border-right:1px solid var(--sep);padding:32px 16px 20px}
.studio-identity{padding:2px 8px 35px}
.studio-identity h2{font:500 31px/1.15 Georgia,'Times New Roman',serif;letter-spacing:-1px;margin:0 0 7px;color:var(--text)}
.studio-identity p{font:13px/1.5 var(--sys);color:var(--text-2);margin:0}
.studio-nav{display:flex;flex-direction:column;gap:5px}
#screen .studio-nav button{display:flex;align-items:center;gap:12px;min-height:42px;padding:9px 14px;border:0;border-radius:8px;background:transparent;text-align:left;font-size:16px;cursor:pointer;color:var(--text-2)}
#screen .studio-nav button:hover{background:var(--hover);color:var(--text)}
#screen .studio-nav button.selected{background:rgba(44,97,214,.12);color:#1446a0;font-weight:600}
#screen.dark .studio-nav button.selected{color:#b3ceff;background:rgba(70,125,235,.22)}
.studio-icon{width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;flex:none;vertical-align:middle}
.studio-icon svg{width:100%;height:100%;display:block}
.studio-content{min-width:0;flex:1;overflow:auto;padding:31px 40px 22px;color:var(--text);background:var(--win);touch-action:pan-y;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(80,80,90,.24) transparent;user-select:text;-webkit-user-select:text}
.studio-header{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:0 0 20px;border-bottom:1px solid var(--sep);margin-bottom:30px}
.studio-heading{display:flex;align-items:baseline;gap:14px;min-width:0}
.studio-heading h1{font:650 32px/1.2 var(--sys);letter-spacing:-1px;margin:0;color:var(--text)}
.studio-year{font-size:15px;color:var(--text-3)}
.studio-actions{display:flex;align-items:center;gap:24px;padding-left:26px;border-left:1px solid var(--sep)}
#screen .studio-actions button{display:inline-flex;align-items:center;gap:8px;background:transparent;border:0;padding:5px 0;min-height:32px;font-size:14px;color:var(--text-2);cursor:pointer;white-space:nowrap}
#screen .studio-actions button:hover{color:var(--accent)}
.studio-actions .studio-icon{width:17px;height:17px}
#screen .studio-media{display:block;width:100%;padding:0;border:0;border-radius:10px;overflow:hidden;background:#153a7b;cursor:pointer;aspect-ratio:1.96;box-shadow:0 0 0 1px rgba(0,0,0,.08)}
.studio-media img{display:block;width:100%;height:100%;object-fit:cover;object-position:top}
#screen .studio-media:hover{box-shadow:0 0 0 2px rgba(var(--accent-rgb),.45)}
#screen .studio-feature-title{display:flex;align-items:flex-start;gap:13px;padding:12px 0 20px;width:100%;border:0;background:transparent;text-align:left;cursor:pointer}
.studio-project-mark{width:38px;height:38px;flex:none;padding-top:4px}.studio-project-mark svg{width:100%;height:100%}
.studio-feature-title h2{font:650 29px/1.2 var(--sys);letter-spacing:-.8px;margin:0 0 3px;color:var(--text)}
.studio-feature-title p{font:16px/1.5 var(--sys);margin:0;color:var(--text-2)}
.studio-project-list{border-top:1px solid var(--sep)}
#screen .studio-project-row{display:flex;align-items:center;gap:18px;min-height:55px;width:100%;border:0;border-bottom:1px solid var(--sep);background:transparent;color:var(--text);padding:12px 0;text-align:left;cursor:pointer}
.studio-project-row>.studio-icon{margin-left:auto;width:15px;height:15px;color:var(--text-2)}
.studio-project-row>span:nth-child(2){display:flex;align-items:baseline;gap:9px;min-width:0;flex-wrap:wrap}
.studio-project-row strong{font-weight:600;font-size:16px}
.studio-project-subtitle{font-size:14px;color:var(--text-2)}
.studio-project-subtitle::before{content:'—';margin-right:8px}
.studio-project-type{padding-left:2px;color:var(--text-2)}
.studio-project-row:hover strong{color:var(--accent)}
.studio-footer{display:flex;align-items:center;gap:10px;padding-top:22px;font-size:13px;color:var(--text-2);line-height:1.5;flex-wrap:wrap}
.studio-status{width:6px;height:6px;border-radius:50%;background:var(--accent);flex:none}
.studio-footer-separator{color:var(--text-3)}
#screen .studio-back{display:inline-flex;align-items:center;gap:8px;border:0;background:none;padding:5px 0;color:var(--text-2);cursor:pointer;font-size:14px}
.studio-prose{max-width:760px;font-size:15px;line-height:1.8;color:var(--text-2)}
.studio-prose p{margin:0 0 18px}.studio-prose h1{font-size:38px;line-height:1.15;letter-spacing:-1px;color:var(--text);margin:10px 0 22px}
.studio-prose h2{font:600 21px/1.3 var(--sys);letter-spacing:-.4px;color:var(--text);margin:32px 0 14px}
.studio-prose .studio-lede{font-size:20px;line-height:1.55;color:var(--text)}
.studio-facts{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:13px;border-block:1px solid var(--sep);padding:14px 0;margin:26px 0}
.studio-job{padding:20px 0;border-bottom:1px solid var(--sep)}
.studio-job>div{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.studio-job h3{font-size:16px;font-weight:600;color:var(--text);margin:0}
.studio-job>div>span{font-size:12px;white-space:nowrap}.studio-job .studio-job-role{font-size:13px;margin:4px 0 10px}.studio-job p:last-child{margin-bottom:0}
.studio-links{display:flex;gap:24px;flex-wrap:wrap;margin:22px 0;font-size:14px}
.studio-links a{color:var(--accent);text-decoration:none;display:inline-flex;align-items:center;gap:6px;min-height:36px}.studio-links a:hover{text-decoration:underline}.studio-links .studio-icon{width:14px;height:14px}
.studio-private,.studio-project-meta{font-size:13px;color:var(--text-3)}
.studio-detail figure{margin:24px 0}.studio-detail figure img{width:100%;height:auto;border-radius:10px}.studio-detail figcaption{font-size:12px;margin-top:8px;color:var(--text-2)}
.studio-detail li{margin-bottom:10px}.studio-detail ul{padding-left:20px}
.studio-metrics{display:flex;gap:40px;margin:25px 0;padding:20px 0;border-block:1px solid var(--sep)}
.studio-metrics strong{display:block;color:var(--text);font-size:26px}.studio-metrics span{font-size:12px}
.studio-section-intro{font-size:15px;line-height:1.7;color:var(--text-2);margin:0 0 24px}
.studio-play-list{display:flex;flex-direction:column}
#screen .studio-play-item{display:flex;gap:18px;align-items:center;background:none;border:0;border-bottom:1px solid var(--sep);padding:20px 0;text-align:left;cursor:pointer;width:100%}
.studio-play-item>.studio-icon{margin-left:auto}.studio-app-icon{width:46px;height:46px;flex:none}.studio-app-icon svg{width:100%;height:100%}.studio-play-item strong{display:block;font-size:16px;color:var(--text)}.studio-play-item>span:nth-child(2)>span{font-size:14px;color:var(--text-2);display:block;margin-top:3px}.studio-play-item:hover strong{color:var(--accent)}
@media(max-width:1100px){.studio-sidebar{width:190px;padding-inline:12px}.studio-content{padding:26px}.studio-actions{gap:16px;padding-left:18px}.studio-heading h1{font-size:29px}.studio-identity h2{font-size:28px}}
@media(max-width:700px){.studio-window{min-width:0!important;border-radius:0;border:0}.studio-window>.titlebar{height:36px;min-height:36px}.studio-window .wbody{flex-direction:column}.studio-sidebar{width:auto;padding:16px 18px 12px;border-right:0;border-bottom:1px solid var(--sep);display:flex;flex-direction:column;gap:15px}.studio-identity{padding:0;display:flex;align-items:baseline;gap:12px}.studio-identity h2{font-size:25px;margin:0}.studio-identity p{font-size:12px}.studio-nav{flex-direction:row;gap:6px}.studio-nav button{flex:1;justify-content:center}#screen .studio-nav button{font-size:13px;min-height:40px;padding:8px 10px;gap:7px}.studio-nav .studio-icon{width:16px;height:16px}.studio-content{padding:22px 20px 28px}.studio-header{gap:10px;margin-bottom:22px;padding-bottom:16px;min-height:45px}.studio-heading h1{font-size:25px;letter-spacing:-.7px}.studio-year{display:none}.studio-actions{gap:14px;padding-left:12px}#screen .studio-actions button{font-size:12px;gap:5px}.studio-actions .studio-icon{width:15px;height:15px}.studio-media{aspect-ratio:1.65}.studio-feature-title h2{font-size:25px}.studio-feature-title p{font-size:14px}.studio-project-mark{width:32px;height:32px}.studio-project-row>span:nth-child(2){display:block}.studio-project-subtitle{display:block;margin-top:3px;font-size:12px}.studio-project-subtitle::before{display:none}.studio-footer{font-size:11px;gap:7px}.studio-prose .studio-lede{font-size:18px}.studio-prose{font-size:14px}.studio-job>div{display:block}.studio-job h3{margin-bottom:3px}.studio-metrics{gap:24px}#dockWrap{bottom:6px}#dock{padding:6px 7px 8px;gap:1px;border-radius:14px}#dock .ditem{width:34px!important;height:34px!important}.studio-sidebar .studio-nav button.selected{background:rgba(44,97,214,.12)}}
@media(max-width:360px){.studio-content{padding:18px 15px}.studio-actions{gap:9px;padding-left:9px}.studio-heading h1{font-size:23px}.studio-identity h2{font-size:23px}.studio-nav button .studio-icon{display:none}.studio-footer-separator{display:none}.studio-footer{column-gap:8px}.studio-footer>span:last-child{display:none}}
@media(prefers-reduced-motion:reduce){.win,.titlebar,#dock,.studio-media{transition:none!important}.win.anim-open,.win.closing{animation:none!important}.studio-content{scroll-behavior:auto}}
/* Keep project choices visible on shorter desktop displays. */
@media(min-width:701px) and (max-height:850px){.studio-content{padding-top:22px;padding-bottom:16px}.studio-header{padding-bottom:14px;margin-bottom:20px;min-height:45px}.studio-heading h1{font-size:28px}#screen .studio-media{aspect-ratio:auto;height:clamp(170px,calc(100dvh - 470px),320px)}.studio-feature-title h2{font-size:25px}.studio-feature-title p{font-size:14px}#screen .studio-feature-title{padding-top:10px;padding-bottom:12px}.studio-footer{padding-top:15px;font-size:12px}#screen .studio-project-row{min-height:47px;padding-block:9px}.studio-project-row strong{font-size:14px}.studio-project-subtitle{font-size:13px}}
.studio-media img{width:calc(100% + 9px);max-width:none}
@media(max-width:700px){.studio-window{height:auto}.studio-media img{width:calc(100% + 6px)}.studio-header{flex-wrap:wrap}.studio-actions{margin-left:auto}.studio-content .studio-header{row-gap:8px}}

@media(min-width:701px) and (max-height:850px){.studio-media img{object-position:center 45%}}

#dock .dsep:last-child{display:none}
/* Keep corner hit targets inside the rounded window clipping region. */
.win .rz.se{right:0;bottom:0;width:22px;height:22px}.win .rz.sw{left:0;bottom:0;width:22px;height:22px}.win .rz.ne{right:0;top:0;width:18px;height:18px}.win .rz.nw{left:0;top:0;width:18px;height:18px}

@media(max-width:700px){.win{min-width:0!important;max-width:100vw}}
/* Project stories use the same warm materials, with diagrams and readable chapters. */
.studio-detail{max-width:800px}.studio-detail .studio-project-meta{display:flex;align-items:center;flex-wrap:wrap;gap:10px;font-size:11px}.studio-project-badge{border:1px solid var(--sep);border-radius:5px;padding:3px 8px;color:var(--text-2)}
.studio-detail h1{font-size:42px;letter-spacing:-1.5px;margin:17px 0 7px}.studio-detail .studio-detail-headline{font-size:23px;line-height:1.35;letter-spacing:-.5px;color:var(--text);margin-bottom:12px}.studio-detail-summary{max-width:620px;font-size:14px;line-height:1.75}
.studio-project-facts{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:24px 0 28px;padding:17px 0;border-block:1px solid var(--sep)}.studio-project-facts dt,.studio-eyebrow{font-size:10px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--text-3)}.studio-project-facts dd{font-size:12px;line-height:1.6;margin:5px 0 0;color:var(--text)}
.studio-detail .studio-project-visual{margin:0 0 34px}.studio-project-visual img{display:block;border:1px solid var(--sep);background:var(--win-2);aspect-ratio:auto;object-fit:contain}.studio-project-visual a{display:block;border-radius:10px;cursor:zoom-in}.studio-project-visual a:hover{box-shadow:0 0 0 2px rgba(var(--accent-rgb),.45)}.studio-detail .studio-project-visual figcaption{display:grid;gap:3px;font-size:12px;line-height:1.6}.studio-project-visual figcaption span:first-child{color:var(--text)}
.studio-story-pair{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin:34px 0}.studio-detail h2{font-size:20px;margin:8px 0 13px}.studio-detail p{line-height:1.75}.studio-story-pair p,.studio-decision-list p,.studio-outcome p{font-size:13px;margin-bottom:0}
.studio-flow-panel{background:var(--win-2);border:1px solid var(--sep);padding:24px;border-radius:10px;margin:32px 0}.studio-flow-panel h2{margin-bottom:26px}.studio-detail .studio-flow{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.studio-flow-feature .studio-flow{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.studio-flow li{position:relative;min-width:0;margin:0}.studio-flow li:not(:last-child)::after{content:'→';position:absolute;right:-16px;top:1px;color:var(--text-3);font-size:15px}.studio-step{display:flex;align-items:center;justify-content:center;width:30px;height:30px;background:var(--win);color:var(--accent);border:1px solid var(--sep);border-radius:7px;font-size:11px;font-weight:600;margin-bottom:13px}.studio-flow h3{font-size:13px;margin:0 0 5px;color:var(--text);font-weight:600}.studio-flow p{font-size:11px;margin:0;line-height:1.65}.studio-flow-panel .studio-flow-note{font-size:11px;margin:22px 0 0;padding-top:15px;border-top:1px solid var(--sep)}
.studio-decisions{margin-top:36px}.studio-decision-list>section{display:flex;gap:20px;padding:19px 0;border-bottom:1px solid var(--sep)}.studio-decision-number{font:12px/1.8 var(--sys);color:var(--text-3);padding-top:2px;flex:none}.studio-decision-list h3{font-size:14px;color:var(--text);margin:0 0 6px;font-weight:600}.studio-outcome{margin:36px 0}.studio-outcome .studio-metrics{margin:18px 0;border:0;padding:0;gap:40px}.studio-metrics strong{font-weight:500;letter-spacing:-1px}.studio-metrics span{font-size:11px}.studio-stack{border-top:1px solid var(--sep);padding-top:20px}.studio-stack h2{font-size:13px}.studio-detail .studio-stack ul{list-style:none;display:flex;flex-wrap:wrap;gap:7px;padding:0;margin:0}.studio-stack li{border:1px solid var(--sep);border-radius:5px;font-size:11px;padding:3px 9px;margin:0}
#screen .studio-next-project{display:flex;align-items:center;justify-content:space-between;width:100%;background:none;border:0;border-block:1px solid var(--sep);padding:20px 0;margin-top:30px;text-align:left;color:var(--text);cursor:pointer}.studio-next-project small{display:block;color:var(--text-3);font-size:10px;margin-bottom:5px}.studio-next-project strong{font-size:20px;font-weight:500}.studio-next-project:hover strong{color:var(--accent)}
@media(max-width:1100px){.studio-flow-feature .studio-flow{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.studio-flow-feature .studio-flow li:nth-child(2)::after{display:none}}
@media(max-width:700px){.studio-detail h1{font-size:35px}.studio-detail .studio-detail-headline{font-size:21px}.studio-project-facts{gap:16px;margin:20px 0 24px}.studio-project-facts dd{font-size:11px}.studio-story-pair{grid-template-columns:1fr;gap:24px}.studio-flow-panel{padding:20px}.studio-detail .studio-flow{grid-template-columns:1fr;gap:20px}.studio-flow li{display:grid;grid-template-columns:30px 1fr;column-gap:13px}.studio-step{grid-row:span 2;margin:0}.studio-flow h3{margin:0 0 3px}.studio-flow p{grid-column:2;font-size:12px}.studio-flow li:not(:last-child)::after{display:none}.studio-project-visual figcaption{gap:3px}.studio-detail h2{font-size:19px}.studio-decision-list>section{gap:15px}}



/* Native window around Spotify's unmodified official embed. */
.spotify-window .wbody{overflow:auto}.spotify-shell{padding:24px;width:100%;min-width:0;box-sizing:border-box;user-select:text}.spotify-shell header{display:flex;gap:13px;align-items:center;margin-bottom:24px}.spotify-app-mark{width:42px;height:42px;flex:none}.spotify-app-mark svg{width:100%;height:100%}.spotify-shell h1{font-size:19px;letter-spacing:-.5px;margin:0 0 5px}.spotify-shell header p{font-size:12px;color:var(--text-2);margin:0}.spotify-playlist-form label{display:block;font-size:11px;color:var(--text-2);margin-bottom:7px}.spotify-playlist-form>div{display:flex;gap:8px}.spotify-playlist-form input{min-width:0;flex:1;font:12px var(--sys);padding:9px 10px;background:var(--field);border:1px solid var(--sep);border-radius:6px;color:var(--text)}.spotify-playlist-form button{white-space:nowrap;font-size:11px}.spotify-message{font-size:11px;color:var(--text-2);line-height:1.6;margin:8px 0 14px}.spotify-player-host iframe{display:block;width:100%;border:0;border-radius:12px}.spotify-player-host>a{display:inline-flex;align-items:center;gap:5px;color:var(--accent);font-size:11px;margin-top:13px;text-decoration:none}.spotify-player-host>a svg{width:12px;height:12px}.spotify-playback-note{font-size:11px;line-height:1.6;color:var(--text-2);margin-top:15px}
@media(max-width:700px){.spotify-shell{padding:20px}.spotify-shell h1{font-size:18px}.spotify-playlist-form>div{flex-wrap:wrap}.spotify-playlist-form input{flex-basis:100%}}
/* Full recordings in a familiar compact album-and-track player. */
.music-player{border-radius:12px;background:#202328;color:#f5f3ee;overflow:hidden;padding:20px 18px 0}.music-album{display:flex;gap:17px;align-items:center;margin-bottom:22px}.music-cover{width:108px;height:108px;flex:none;border-radius:5px;background:linear-gradient(145deg,#597a9c,#263e59 55%,#bba98b);display:grid;place-items:center;overflow:hidden}.music-cover>span{width:88px;height:88px;border-radius:50%;background:repeating-radial-gradient(circle,#18222c 0 2px,#25323f 3px 4px);display:grid;place-items:center}.music-cover>span::after{content:'';width:30px;height:30px;background:#d6bd95;border:9px solid #a78e6d;border-radius:50%;box-shadow:inset 0 0 0 3px #162330}.music-kicker{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#b7bcc5}.music-player h2{font-size:23px;line-height:1.2;letter-spacing:-.7px;margin:7px 0}.music-artist{font-size:12px;color:#b7bcc5;margin:0 0 10px}.music-full{font-size:10px;color:#d0d5dd}.music-progress input{display:block;width:100%;height:18px;margin:0;accent-color:#ded1b7;cursor:pointer}.music-progress>div{display:flex;justify-content:space-between;color:#bbc0c9;font-size:10px;font-variant-numeric:tabular-nums;margin-top:3px}.music-controls{display:flex;justify-content:center;align-items:center;gap:24px;margin:14px 0 19px}#screen .music-controls button{border:0;background:none;color:#c7ccd5;width:36px;height:36px;font-size:24px;cursor:pointer;display:grid;place-items:center}#screen .music-controls .music-toggle{width:48px;height:48px;background:#f4efe4;border-radius:50%;color:#202328;font-size:23px}.music-controls button:hover{filter:brightness(1.2)}.music-toggle span{line-height:1}.music-volume{display:flex;align-items:center;gap:9px;font-size:10px;color:#b7bcc5;margin:0 0 18px}.music-volume input{width:85px;min-width:40px;accent-color:#ded1b7;margin:0}.music-volume>span{margin-left:auto;font-size:9px}.music-tracks{list-style:none;padding:0;margin:0 -18px;background:#181b20}.music-tracks li{border-top:1px solid #ffffff0b}#screen .music-tracks button{display:flex;align-items:center;gap:11px;width:100%;border:0;background:transparent;color:#f5f3ee;cursor:pointer;text-align:left;padding:14px 18px}.music-track-number{color:#878f9e;font-size:11px;width:17px}.music-tracks strong{display:block;font-size:12px;font-weight:500}.music-tracks small{display:block;font-size:10px;color:#9ba3b0;margin-top:4px}.music-tracks time{margin-left:auto;font-size:11px;color:#9ba3b0;font-variant-numeric:tabular-nums}#screen .music-tracks button.selected{background:#ffffff07}.music-tracks button.selected strong{color:#e5d2b0}#screen .music-tracks button:hover{background:#ffffff0c}.music-feedback{font-size:12px;line-height:1.6;color:var(--text-2)}.music-feedback:empty{display:none}.music-credit{font-size:10px;line-height:1.8;color:var(--text-2);margin-top:16px}.music-credit a{color:inherit;text-underline-offset:3px}.music-player.is-playing .music-cover>span{animation:music-record 12s linear infinite}@keyframes music-record{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.music-player.is-playing .music-cover>span{animation:none}}
@media(max-width:360px){.music-cover{width:85px;height:85px}.music-cover>span{width:72px;height:72px}.music-player h2{font-size:21px}.music-album{gap:13px}.music-volume>span{font-size:8px}}
.resume-original.sheet{padding:0!important;width:612px;max-width:none;background:white}.resume-original img{display:block;width:100%;height:auto}.resume-original-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:pre-wrap;border:0}.resume-body .resume-original.sheet{width:100%;max-width:740px;margin:auto}
.win[data-app="preview"]>.titlebar .title{position:static;flex:1;min-width:0;padding:0;text-align:left}.win[data-app="preview"]>.titlebar .tb-tools{flex:none}
@media(max-width:560px){.win[data-app="preview"]>.titlebar .tb-tools a:first-of-type{display:none}.win[data-app="preview"]>.titlebar{gap:5px;padding-inline:10px}.win[data-app="preview"]>.titlebar .btn{font-size:11px;padding-inline:8px}}
/* Show the entire real dashboard capture and allow full-size inspection. */



/* Keep the public case-study action in the same quiet project style. */
#screen .studio-case-study{display:inline-flex;align-items:center;gap:6px;min-height:32px;color:var(--accent);font-size:12px;line-height:1.5;text-decoration:none}.studio-case-study .studio-icon{width:13px;height:13px}#screen .studio-case-study:hover{text-decoration:underline}.studio-project-item>.studio-case-study{margin:0 0 10px}.studio-feature>.studio-case-study{margin:-8px 0 16px}

/* Comfortable, consistent project controls on touch screens. */
@media(max-width:700px){#screen .studio-back,#screen .studio-actions button{min-height:44px}.studio-links a{min-height:44px}.studio-project-facts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:360px){.studio-project-facts{grid-template-columns:1fr}}

/* About and Playground share the project stories' quiet hierarchy and materials. */
.studio-about,.studio-playground{max-width:800px}
.studio-about-intro{max-width:680px}
.studio-about .studio-lede,.studio-playground .studio-lede{font:500 27px/1.4 var(--sys);letter-spacing:-.6px;color:var(--text);margin:12px 0 18px}
.studio-about-intro>p:last-child{font-size:14px;line-height:1.8;margin-bottom:0}
.studio-about .studio-project-facts{margin:28px 0 36px}
.studio-about-section{margin:36px 0}
.studio-about-section h2{font-size:20px;letter-spacing:-.4px;margin:8px 0 20px}
.studio-experience-item{display:grid;grid-template-columns:142px minmax(0,1fr);gap:24px;padding:22px 0;border-bottom:1px solid var(--sep)}
.studio-experience-item:first-child{border-top:1px solid var(--sep)}
.studio-experience-item .studio-experience-date{font-size:11px;line-height:1.8;color:var(--text-3);margin:2px 0 0}
.studio-experience-item h3{font-size:15px;font-weight:600;line-height:1.5;color:var(--text);margin:0 0 5px}
.studio-experience-item .studio-experience-role{font-size:12px;line-height:1.7;margin:0 0 12px;color:var(--text)}
.studio-experience-role span{display:block;color:var(--text-3);font-size:11px;margin-top:2px}
.studio-experience-item .studio-experience-summary{font-size:13px;line-height:1.75;margin:0}
.studio-interests ul{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0}
.studio-interests li{font-size:12px;line-height:1.6;border:1px solid var(--sep);border-radius:6px;padding:6px 11px;background:var(--win-2)}
.studio-about-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--sep);padding-top:14px;margin-top:32px;font-size:12px;color:var(--text-3)}
.studio-about-footer .studio-links{margin:0;gap:20px;font-size:12px}
.studio-play-intro{margin:0 0 28px}
.studio-playground .studio-lede{margin-bottom:10px}
.studio-playground .studio-section-intro{font-size:13px;line-height:1.7;margin:0;color:var(--text-2)}
.studio-playground .studio-play-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
#screen .studio-playground .studio-play-item{min-width:0;min-height:116px;gap:14px;align-items:flex-start;padding:22px 18px;border:1px solid var(--sep);border-radius:10px;background:var(--win-2);transition:background .15s,border-color .15s}
#screen .studio-playground .studio-play-item:hover{background:var(--hover);border-color:rgba(var(--accent-rgb),.35)}
.studio-playground .studio-app-icon{width:38px;height:38px}
.studio-play-copy{min-width:0;flex:1}
.studio-playground .studio-play-item strong{font-size:15px;line-height:1.4;font-weight:600}
.studio-playground .studio-play-copy>span{font-size:12px;line-height:1.65;margin-top:5px;color:var(--text-2)}
.studio-playground .studio-play-item>.studio-icon{width:14px;height:14px;margin-top:3px;color:var(--text-3)}
@media(max-width:1100px){.studio-experience-item{grid-template-columns:115px minmax(0,1fr);gap:20px}.studio-playground .studio-play-list{grid-template-columns:1fr}#screen .studio-playground .studio-play-item{min-height:92px}}
@media(max-width:700px){.studio-about .studio-lede,.studio-playground .studio-lede{font-size:23px;line-height:1.45;letter-spacing:-.4px}.studio-about-intro>p:last-child{font-size:13px}.studio-about .studio-project-facts{margin:24px 0 30px}.studio-about-section{margin:30px 0}.studio-about-section h2{font-size:19px;margin-bottom:17px}.studio-experience-item{grid-template-columns:1fr;gap:8px;padding:20px 0}.studio-experience-item .studio-experience-date{margin:0}.studio-experience-item .studio-experience-summary{font-size:13px}.studio-about-footer{align-items:flex-start;flex-wrap:wrap}.studio-about-footer>span{padding-top:12px}.studio-play-intro{margin-bottom:24px}.studio-play-break{display:none}.studio-playground .studio-play-list{gap:10px}#screen .studio-playground .studio-play-item{padding:18px 16px;min-height:96px}.studio-playground .studio-app-icon{width:36px;height:36px}}
@media(prefers-reduced-motion:reduce){#screen .studio-playground .studio-play-item{transition:none}}
