/* Original pixel-fantasy direction. Continuous banners; no project card frames. */
:root{--paper:#fff0c4;--gold:#e8c46c;color:#172b39;background:#aac5cb}
body{position:relative;isolation:isolate;background:#aac5cb}
body::before{content:'';position:fixed;inset:0;z-index:-1;background:url('/assets/castle-courtyard-pixel.png') center center/cover no-repeat;image-rendering:pixelated;pointer-events:none}
.site-shell{gap:0 38px;margin-bottom:84px}
.name-panel{padding:22px 0 28px}
.name{font-family:'Pixelify Sans',monospace;font-size:27px;font-weight:600;letter-spacing:0;color:#172b39;text-shadow:2px 2px #eef0d5}
.name span{color:#233d4d;text-shadow:1px 1px #eef0d5}
h1,h2,h3,.sample-stats dd,.command-head h2{font-family:'Pixelify Sans',monospace;font-weight:500;letter-spacing:0}
.banner{--cloth:#28513e;--edge:#162f2c;border:0;border-inline:4px solid var(--edge);padding-top:24px;background:repeating-linear-gradient(0deg,#fff3bd05 0 2px,transparent 2px 6px),repeating-linear-gradient(90deg,#12233108 0 2px,transparent 2px 6px),linear-gradient(90deg,#00000018 0 6px,transparent 6px calc(100% - 6px),#00000018 calc(100% - 6px)),var(--cloth);box-shadow:inset 3px 0 #c6a86585,inset -3px 0 #c6a86585;filter:drop-shadow(7px 7px 0 #18233150)}
.banner::before{top:-8px;left:-16px;width:calc(100% + 32px);height:12px;border:0;border-radius:0;background:linear-gradient(90deg,#403725 0 4px,#e9c67c 4px 8px,transparent 8px calc(100% - 8px),#e9c67c calc(100% - 8px) calc(100% - 4px),#403725 calc(100% - 4px)),linear-gradient(#f0ce86 0 3px,#ae8043 3px 7px,#6b492d 7px 10px,#342b24 10px);box-shadow:0 4px 0 #16253470}
.banner::after{left:-4px;width:calc(100% + 8px);bottom:-35px;height:36px;background:repeating-linear-gradient(0deg,#fff3bd05 0 2px,transparent 2px 6px),var(--cloth);clip-path:polygon(0 0,100% 0,100% 8px,90% 8px,90% 14px,80% 14px,80% 20px,70% 20px,70% 26px,60% 26px,60% 32px,40% 32px,40% 26px,30% 26px,30% 20px,20% 20px,20% 14px,10% 14px,10% 8px,0 8px)}
.about-panel{--cloth:#2b533d;--edge:#16372d;gap:24px}
.middle-column{--cloth:#883e32;--edge:#4c282a}
.project-rail{--cloth:#2b526e;--edge:#192f4a}
/* Decorative crests are embroidered fixtures, removed from layout flow. */
.banner-crest,.about-panel .banner-crest{position:absolute;right:12px;top:13px;width:25px;height:28px;margin:0;opacity:.38;color:#ffe6a2;pointer-events:none;z-index:-1}
.banner-crest svg{shape-rendering:crispEdges}
.banner h2{font-size:24px;line-height:1.15;text-shadow:2px 2px #14233566}
.banner h3{font-size:23px}
.about-panel h1{font-family:'Pixelify Sans',monospace;font-size:clamp(52px,5vw,68px);line-height:1.04;letter-spacing:-1px;margin:17px 0 21px;font-weight:500;text-shadow:3px 3px #152f29}
.about-panel .eyebrow{font-size:12px;letter-spacing:.08em;padding-right:20px}
.about-copy{font-size:17px}.school h2{font-family:'Nunito Sans',sans-serif;font-size:17px;text-shadow:none}
.work-section h2,.recent-section h2,.roblox-panel>h2,.notes h2{font-style:normal;font-size:23px}
.work-section,.recent-section,.roblox-panel,.notes,.project-entry+.project-entry{border-top:2px solid #edcd892b}
.demo-heading h2,.rail-heading h2{font-size:25px;letter-spacing:-.5px}
.rail-heading{margin-bottom:18px}
.project-caption h3{font-size:23px;letter-spacing:0}
.project-caption .company-logo,.demo-heading .company-logo{width:28px;height:28px;border-radius:0}
.group-item h3{font-family:'Nunito Sans',sans-serif;font-size:16px;text-shadow:none}
.group-item>img,.work-logo,.inline-brand img{border-radius:0}
.work-logo{box-shadow:3px 3px #152f2966}
.group-item:hover>img{transform:translateY(-2px)}
.project-art{image-rendering:pixelated;clip-path:polygon(4px 0,calc(100% - 4px) 0,calc(100% - 4px) 4px,100% 4px,100% calc(100% - 4px),calc(100% - 4px) calc(100% - 4px),calc(100% - 4px) 100%,4px 100%,4px calc(100% - 4px),0 calc(100% - 4px),0 4px,4px 4px)}
.project-image{image-rendering:pixelated;opacity:.88;transition:opacity .15s}
.project-entry:hover .project-image{transform:none;opacity:1}
.project-art::after{background:linear-gradient(135deg,#fff1c414 0 24%,transparent 24% 70%,#172a3912 70%)}
.sample-stats dd{font-family:'Pixelify Sans',monospace;font-size:26px}
.forest-vignette{image-rendering:pixelated;mask-image:none;opacity:.15;min-height:45px;max-height:85px;margin-top:auto}
.command-trigger,.social-key,.close-command{border:2px solid #35403b;border-radius:0;background:#e1c68d;color:#293932;box-shadow:inset 2px 2px #fff0bb,inset -2px -2px #ac844c,0 4px 0 #35403b;transition:transform .1s,box-shadow .1s}
.command-trigger{min-height:40px;padding:6px 11px}
.command-trigger:hover,.social-key:hover,.close-command:hover{background:#f1d69d}
.command-trigger:active,.social-key:active,.close-command:active{transform:translateY(4px);box-shadow:inset 2px 2px #ac844c,inset -2px -2px #f7dda2,0 0 0 #35403b}
.command-trigger span{font-family:'Pixelify Sans',monospace;font-size:17px}
.command-trigger kbd{color:#62533b}
.social-key{width:42px;height:42px;background:#f7e4b7}
.social-key:hover{transform:translateY(-2px)}
.social-tooltip{background:#ffedbe;color:#263732;border:2px solid #35403b}
.detail{background:#f3e3be;padding:23px;box-shadow:4px 4px 0 #293b3a70;border-top:4px solid #ddc083}
.detail-heading h1{font-family:'Pixelify Sans',monospace;letter-spacing:-1px;font-weight:500}
.detail article>section h2{font-family:'Pixelify Sans',monospace;font-size:27px}
.detail .sample-stats dd{font-family:'Pixelify Sans',monospace}
dialog{border:3px solid #293b3a;border-radius:0;box-shadow:8px 8px 0 #16273480;background:#f3e3be}
dialog::backdrop{backdrop-filter:none;background:#13263a99}
.command-head h2{font-family:'Pixelify Sans',monospace;font-size:29px}
#command-search{border:2px solid #a28b63;background:#fff1d3}
.command-option.selected,.command-option:hover{background:#d7c18b}
@media(min-width:1500px){.site-shell{gap:0 42px}}
@media(max-width:1050px) and (min-width:761px){.site-shell{gap:0 24px}.banner::before{left:-12px;width:calc(100% + 24px)}.demo-heading h2,.rail-heading h2{font-size:22px}.project-caption h3{font-size:21px}.banner-crest{right:8px;top:10px;width:20px;height:24px}}
@media(max-width:760px){.site-shell{gap:68px;margin-bottom:72px}.name-panel{padding:18px 0 8px;margin-bottom:-42px}.name{font-size:25px}.banner{padding-top:24px}.about-panel h1{font-size:64px}.banner-crest{margin:0}.forest-vignette{height:60px}.site-shell:has(.detail){gap:62px}.detail{padding:20px}.detail-heading h1{font-size:39px}}
@media(max-width:359px){.name{font-size:22px}.name span{font-size:15px}.about-panel h1{font-size:57px}.demo-heading h2{font-size:23px}.detail{padding:15px}}
