
/* 2026 portfolio: original illustrated retro-zine wheel.
   All selectors are scoped: Minimal, Immersive and admin remain unchanged. */
.sgw-page{background:#efede7;color:#171715;font-family:Arial,Helvetica,sans-serif;min-height:100svh;overflow:hidden}
.sgw-page *{box-sizing:border-box}
.sgw-hero{position:relative;height:max(760px,100svh);max-height:1080px;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 53% 43%,#faf8f3 0,#efede7 63%,#dedbd2 100%)}
.sgw-hero::before{content:"";position:absolute;left:-18%;right:-18%;top:29%;height:54%;border:clamp(22px,4vw,56px) solid #d8d5cc;border-top-color:#d8d5cc;border-bottom-color:transparent;border-radius:50% 50% 10% 10%;transform:rotate(-9deg);opacity:.57;pointer-events:none}
.sgw-header{position:absolute;top:clamp(22px,3.6vw,45px);left:clamp(19px,4.2vw,76px);right:clamp(19px,4.2vw,76px);z-index:50;display:flex;align-items:center;justify-content:space-between;gap:18px;font:700 11px 'Courier New',monospace;letter-spacing:.06em}
.sgw-header a,.sgw-header span{display:inline-flex;align-items:center;gap:7px}
.sgw-header a{padding:8px 0;border-bottom:1px solid transparent}
.sgw-header a:hover,.sgw-header a:focus-visible{border-bottom-color:#171715}
.sgw-title{position:absolute;top:clamp(92px,12%,137px);width:100%;text-align:center;padding:0 16px;pointer-events:none;z-index:6}
.sgw-kicker{font:700 11px 'Courier New',monospace;letter-spacing:.16em}
.sgw-title h1{font-size:clamp(29px,4.6vw,57px);font-weight:800;letter-spacing:-.071em;line-height:1.04;margin:12px 0 0}
.sgw-title p{font:11px/1.5 'Courier New',monospace;letter-spacing:.05em;color:#66645f;margin:13px 0 0}
.sgw-wheel{position:absolute;inset:24% 0 18%;perspective:1450px;perspective-origin:50% 50%;touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:grab}
.sgw-wheel[data-dragging=true]{cursor:grabbing}
.sgw-track{position:absolute;inset:0;transform-style:preserve-3d;pointer-events:none}
.sgw-card{--sgw-accent:#f56842;position:absolute;top:50%;left:50%;width:clamp(254px,25vw,386px);height:clamp(375px,53vh,555px);transform-style:preserve-3d;background:#0c0c0d;border:8px solid #121212;box-shadow:10px 15px 2px #1e1b1822,0 18px 30px #0004;display:flex;flex-direction:column;overflow:hidden;pointer-events:auto;cursor:pointer;outline:none;backface-visibility:hidden;will-change:transform;contain:layout style paint}
.sgw-card:focus-visible{outline:4px solid #0b63d1;outline-offset:6px}
.sgw-card:hover .sgw-poster,.sgw-card[data-selected=true] .sgw-poster{filter:saturate(1.09) contrast(1.045)}
.sgw-poster{position:relative;flex:1;min-height:0;overflow:hidden;background:#222;transition:filter .2s}
.sgw-poster svg{display:block;width:100%;height:100%;object-fit:cover}
.sgw-card-bottom{min-height:112px;padding:13px 16px 12px;color:#f4f0e5;display:flex;flex-direction:column;gap:7px;flex-shrink:0;position:relative}
.sgw-card-meta{font:10px 'Courier New',monospace;color:#b3ada7;letter-spacing:.015em}
.sgw-card-name{font-family:Impact,'Arial Narrow',Arial,sans-serif;font-weight:900;letter-spacing:-.025em;line-height:1.0;font-size:clamp(23px,2.4vw,39px);text-transform:uppercase;max-width:90%;transform:rotate(-1.1deg);overflow-wrap:anywhere}
.sgw-card-label{font:700 10px 'Courier New',monospace;color:var(--sgw-accent);margin-top:auto;letter-spacing:.015em;text-transform:uppercase;padding-right:27px}
.sgw-card-arrow{position:absolute;bottom:14px;right:13px;font-size:25px;line-height:1;color:#ede9df}
.sgw-nav{position:absolute;inset:0;z-index:25;pointer-events:none}
.sgw-nav button{position:absolute;top:50%;transform:translateY(-50%);height:48px;width:48px;border:1.5px solid #242424;background:#faf8f2e8;color:#151515;border-radius:50%;font-size:26px;line-height:1;display:grid;place-items:center;pointer-events:auto;transition:background .2s,transform .2s}
.sgw-nav button:hover{background:white;transform:translateY(-50%) scale(1.08)}
.sgw-prev{left:clamp(12px,2.8vw,48px)}.sgw-next{right:clamp(12px,2.8vw,48px)}
.sgw-selection{position:absolute;bottom:clamp(27px,4.6vh,49px);left:clamp(22px,5.4vw,88px);right:clamp(22px,5.4vw,88px);z-index:30;display:flex;align-items:end;justify-content:space-between;gap:20px}
.sgw-selection-info{max-width:620px;min-width:0}
.sgw-selection-kicker{font:700 11px 'Courier New',monospace;letter-spacing:.06em;color:#77716a;margin:0 0 7px}
.sgw-selection h2{font-size:clamp(25px,3.6vw,43px);letter-spacing:-.065em;font-weight:800;margin:0 0 5px}
.sgw-selection-desc{font-size:13px;line-height:1.45;color:#67635d;margin:0;max-width:520px}
.sgw-selection a{display:inline-flex;min-height:48px;align-items:center;justify-content:center;background:#141414;color:#faf9f4;font:700 12px 'Courier New',monospace;white-space:nowrap;padding:13px 20px;transition:transform .18s,background .18s}
.sgw-selection a:hover{transform:translateY(-3px);background:#333}
.sgw-scrawl{position:absolute;z-index:3;font:700 13px 'Courier New',monospace;letter-spacing:-.04em;color:#222;pointer-events:none;opacity:.78}
.sgw-scrawl-left{left:clamp(25px,6vw,120px);top:28%;transform:rotate(-14deg)}
.sgw-scrawl-right{right:clamp(15px,5vw,110px);top:28%;transform:rotate(9deg)}
.sgw-crown{position:absolute;right:clamp(28px,7vw,120px);top:10%;width:48px;height:48px;transform:rotate(9deg);opacity:.65;pointer-events:none}
.sgw-archive{background:#131311;color:#f2f0e9;margin:0;min-height:50vh;padding:clamp(65px,9vw,130px) clamp(20px,5vw,65px) 90px}
.sgw-archive-inner{max-width:1200px;margin:0 auto}
.sgw-archive-head{display:flex;align-items:end;justify-content:space-between;gap:20px;border-bottom:1px solid #41413f;padding-bottom:30px}
.sgw-archive-head h2{font-size:clamp(38px,7vw,83px);font-weight:850;letter-spacing:-.09em;margin:8px 0 0;line-height:1}
.sgw-archive-head p{color:#aaa8a0;max-width:310px;line-height:1.55;font-size:13px}
.sgw-project{scroll-margin-top:20px;display:grid;grid-template-columns:minmax(170px,1fr) minmax(0,2fr);gap:clamp(20px,5vw,64px);padding:42px 0 53px;border-bottom:1px solid #343431}
.sgw-project-count,.sgw-project-type{font:11px/1.6 'Courier New',monospace;color:#a2a199;letter-spacing:.04em}
.sgw-project-heading h3{font-size:clamp(27px,4vw,48px);font-weight:760;letter-spacing:-.06em;margin:16px 0 11px;line-height:1.05}
.sgw-project-status{display:inline-flex;border:1px solid #5b5b56;padding:6px 9px;font:700 10px 'Courier New',monospace;color:#c9c6bd}
.sgw-project-type{margin:15px 0 0}
.sgw-project-content{min-width:0}
.sgw-project-lead{font-size:clamp(17px,2.2vw,23px);line-height:1.5;color:#e4e2dc;margin:0 0 23px}
.sgw-project-block{margin:24px 0}
.sgw-project-block h4{font:700 11px 'Courier New',monospace;color:#aaa79e;letter-spacing:.12em;margin:0 0 10px}
.sgw-project-block p,.sgw-project-block li{font-size:14px;line-height:1.7;color:#bcbab2}
.sgw-project-block p{margin:0}
.sgw-project-block ul{padding-left:20px;margin:0}
.sgw-project-block li+li{margin-top:5px}
.sgw-project-links{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:22px}
.sgw-project-links a{display:inline-flex;align-items:center;min-height:44px;border:1px solid #dedacf;color:#eae7dc;padding:11px 14px;font:700 12px 'Courier New',monospace}
.sgw-project-links a:hover{background:#f7f5ef;color:#171715}
.sgw-no-link{font:11px 'Courier New',monospace;color:#999}
.sgw-footer{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;max-width:1200px;margin:56px auto 0;color:#a09f97;font:11px 'Courier New',monospace}
.sgw-footer a{text-decoration:underline;text-underline-offset:3px;color:#e4e1d7}
.sgw-project:target .sgw-project-heading h3{text-decoration:underline;text-decoration-color:#ec9d57;text-underline-offset:7px}
@media(max-width:780px){
 .sgw-hero{height:max(725px,100svh)}
 .sgw-title{top:110px}.sgw-title h1{font-size:clamp(28px,7.2vw,44px)}
 .sgw-title p{max-width:300px;margin:9px auto 0}
 .sgw-wheel{inset:23% 0 25%;perspective:1050px}
 .sgw-card{width:clamp(213px,56vw,295px);height:clamp(335px,49vh,460px);border-width:6px}
 .sgw-card-bottom{min-height:96px;padding:10px 12px}
 .sgw-card-name{font-size:clamp(23px,6.5vw,33px)}
 .sgw-card-meta{font-size:8px}.sgw-card-label{font-size:9px}
 .sgw-nav button{width:41px;height:41px;font-size:23px}
 .sgw-selection{bottom:24px;align-items:flex-start;flex-direction:column;gap:13px}
 .sgw-selection-kicker{font-size:10px}.sgw-selection h2{font-size:28px}
 .sgw-selection-desc{font-size:12px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
 .sgw-selection a{min-height:43px;font-size:11px;padding:11px 14px}
 .sgw-scrawl,.sgw-crown{display:none}
 .sgw-archive-head{display:block}.sgw-archive-head p{margin:20px 0 0}
 .sgw-project{grid-template-columns:1fr;gap:17px;padding:33px 0 44px}
 .sgw-project-lead{font-size:18px}
}
@media(max-width:450px){
 .sgw-header{font-size:9px;gap:10px}
 .sgw-title{top:94px}.sgw-wheel{inset:23% 0 27%}
 .sgw-selection{bottom:18px}.sgw-selection-desc{display:none}
 .sgw-nav button{top:52%}
}
@media(max-height:700px){
 .sgw-hero{height:max(670px,100svh)}
 .sgw-title{top:75px}.sgw-wheel{inset:22% 0 21%}
 .sgw-selection{bottom:18px}
}
@media(prefers-reduced-motion:reduce){
 .sgw-page *, .sgw-page *::before, .sgw-page *::after{transition:none!important;animation:none!important}
}
