/* Palette source: Wolfox's custom dual-mode Monokai preset.
   new-api-rc48-site-20261107/web/src/styles/theme-presets.css */
:root{color-scheme:dark;--background:#282c34;--foreground:#abb2bf;--strong:#d7dae0;--card:#21252b;--popover:#2b3038;--primary:#61afef;--primary-foreground:#282c34;--secondary:#2c313a;--muted-foreground:#7f848e;--border:#3e4451;--success:#98c379;--warning:#e5c07b;--purple:#c678dd;--destructive:#e06c75;--info:#56b6c2;--shadow:0 22px 55px #0003;--header-bg:rgb(40 44 52 / .9)}
html[data-theme=light]{color-scheme:light;--background:#f8f8f2;--foreground:#49483e;--strong:#34362f;--card:#fff;--popover:#fff;--primary:#2f6fd0;--primary-foreground:#fff;--secondary:#efefe8;--muted-foreground:#6e6a5e;--border:#ddd8ca;--success:#4d9d5d;--warning:#b8862e;--purple:#8f4fc0;--destructive:#c95d63;--info:#3a9ba5;--shadow:0 22px 55px #49483e12;--header-bg:rgb(248 248 242 / .9)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--background);color:var(--foreground);font-family:Inter,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;font-size:16px;line-height:1.8;-webkit-font-smoothing:antialiased}::selection{background:var(--primary);color:var(--primary-foreground)}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button{background:none;border:none}a:focus-visible,button:focus-visible{outline:2px solid var(--primary);outline-offset:6px}img,svg{display:block;max-width:100%}img{height:auto}p,h1,h2,h3{margin:0}button svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.5}strong{font-weight:600;color:var(--strong)}.container{max-width:1220px;margin-inline:auto;padding-inline:28px}.section{padding-block:100px}.eyebrow,.edition,.visual-topline,.visual-bottomline,.hero-footnote,.scroll-note,.interlude,.project-label,.project-number,.art-caption,.work-count,.tags,.contact-label,.site-footer p,.compact-number{font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace}.eyebrow{font-size:11px;font-weight:500;letter-spacing:1.4px;line-height:1.6;color:var(--muted-foreground)}.code-blue{color:var(--primary)}.code-green{color:var(--success)}.code-yellow{color:var(--warning)}.code-purple{color:var(--purple)}.code-muted{color:var(--muted-foreground)}.skip-link{position:fixed;left:20px;top:-100px;z-index:100;background:var(--primary);color:var(--primary-foreground);padding:12px 20px}.skip-link:focus{top:10px}.site-header{height:94px;max-width:1400px;padding:0 60px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:30px;border-bottom:1px solid var(--border)}.brand{display:flex;align-items:center;gap:12px;font-size:15px;font-weight:750;letter-spacing:1.2px;white-space:nowrap;color:var(--strong)}.brand-light{font-weight:400;color:var(--foreground)}.brand-dot{width:5px;height:5px;background:var(--primary);border-radius:50%;margin-left:-3px}.site-header nav{display:flex;gap:34px;font-size:14px}.site-header nav a{position:relative}.site-header nav a:after{content:"";position:absolute;height:1px;background:var(--primary);left:0;right:100%;bottom:-6px;transition:right .2s}.site-header nav a:hover{color:var(--strong)}.site-header nav a:hover:after{right:0}.header-actions{display:flex;align-items:center;gap:22px}.icon-button{width:34px;height:34px;display:grid;place-items:center;border-radius:6px}.icon-button:hover{background:var(--secondary);color:var(--primary)}.github-header{font-size:13px;white-space:nowrap}.github-header span{margin-left:8px;color:var(--primary)}.menu-toggle{display:none}.hero{position:relative;min-height:715px;display:grid;grid-template-columns:1.07fr 1fr;align-items:center;gap:30px;padding-block:60px 95px}.hero .eyebrow{display:flex;align-items:center;gap:10px;color:var(--foreground)}.live-dot{width:6px;height:6px;display:inline-block;background:var(--success);border-radius:50%;flex-shrink:0}.edition{margin-left:15px;color:var(--muted-foreground)}h1{font-size:clamp(54px,6.2vw,83px);line-height:1.24;letter-spacing:-4px;color:var(--strong);font-weight:750;margin:24px 0}h1>span{color:var(--primary)}.hero-intro{font-size:16px;line-height:2;max-width:470px}.hero-actions{display:flex;align-items:center;gap:27px;margin-top:33px}.button{display:inline-flex;align-items:center;justify-content:center;gap:32px;padding:12px 22px;border-radius:5px;font-size:14px;font-weight:600;min-height:49px;transition:transform .2s,filter .2s}.button:hover{transform:translateY(-3px);filter:brightness(1.08)}.primary{background:var(--primary);color:var(--primary-foreground)}.text-link{font-size:14px;padding:0}.text-link:hover{color:var(--primary)}.hero-footnote{font-size:11px;display:flex;gap:15px;align-items:center;margin-top:35px;color:var(--muted-foreground)}.tiny-cross{color:var(--warning)}.lab-visual{height:495px;position:relative;align-self:center;isolation:isolate;overflow:hidden}.visual-topline,.visual-bottomline{font-size:9px;letter-spacing:1px;position:absolute;left:13px;right:13px;display:flex;align-items:center;justify-content:space-between;z-index:2;color:var(--muted-foreground)}.visual-topline{top:13px}.visual-bottomline{bottom:13px}.visual-bottomline>span{display:flex;align-items:center;gap:8px}.visual-bottomline button{font-size:10px;letter-spacing:0;color:var(--foreground);padding:4px 8px;border:1px solid var(--border);border-radius:4px}.visual-bottomline button:hover{border-color:var(--warning);color:var(--warning)}.visual-bottomline button span{color:var(--warning);padding-left:7px}.visual-grid{position:absolute;inset:0;background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px);background-size:35px 35px;opacity:.17;mask-image:radial-gradient(ellipse at center,#000,transparent 75%)}.fox-blueprint{width:100%;height:100%;color:var(--primary);transition:transform .7s}.fox-shape{transform-origin:center;animation:breathe 7s ease-in-out infinite}.lab-visual:hover .fox-blueprint{transform:rotate(-2deg) scale(1.02)}.lab-visual.spark .blueprint-points,.lab-visual.spark .orbit-stars{filter:drop-shadow(0 0 9px var(--primary))}.lab-visual.spark .fox-shape{animation:fox-spark .8s ease-out}.lab-visual.spark .orbit{color:var(--warning)}.scroll-note{position:absolute;bottom:29px;left:28px;display:flex;align-items:center;gap:13px;font-size:9px;letter-spacing:1.8px;color:var(--muted-foreground)}.scroll-line{height:29px;width:1px;background:var(--border);position:relative}.scroll-line:after{content:"";position:absolute;left:0;top:0;width:1px;height:12px;background:var(--primary);animation:scroll 2s infinite}.interlude{border-block:1px solid var(--border);overflow:hidden}.interlude>div{max-width:1220px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:28px;padding:20px 28px;white-space:nowrap;font-size:10px;letter-spacing:1.9px}.interlude i{font-size:20px;font-style:normal;color:var(--warning)}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:25px;margin-bottom:39px}h2{font-size:clamp(30px,3.7vw,43px);line-height:1.5;letter-spacing:-1.3px;color:var(--strong);font-weight:650;margin-top:13px}.serif-accent{color:var(--primary)}.section-aside{font-size:13px;line-height:1.9;color:var(--muted-foreground);padding-bottom:8px}.work-controls{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px}.filters{display:flex;gap:8px;flex-wrap:wrap}.filters button{padding:7px 15px;border:1px solid transparent;border-radius:4px;font-size:12px}.filters button:hover{color:var(--primary)}.filters button[aria-pressed=true]{background:var(--secondary);border-color:var(--border);color:var(--strong)}.filters sup{font-size:9px;color:var(--muted-foreground);margin-left:5px}.work-count{font-size:10px;letter-spacing:1.5px;color:var(--muted-foreground)}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px 28px}.project[hidden]{display:none}.project-art{height:345px;position:relative;display:block;overflow:hidden;border:1px solid var(--border);border-radius:7px;isolation:isolate;transition:border-color .2s}.project-art:hover{border-color:var(--primary)}.art-caption{position:absolute;left:24px;top:19px;font-size:9px;letter-spacing:1.4px;z-index:4;color:var(--foreground)}.terminal-art{background:var(--card)}.terminal-window{position:absolute;top:73px;left:35px;right:72px;border:1px solid var(--border);border-radius:7px;background:var(--background);box-shadow:var(--shadow);transform:rotate(-3deg);transition:transform .35s}.project-art:hover .terminal-window{transform:translateY(-6px) rotate(-1deg)}.terminal-bar{height:31px;background:var(--secondary);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 12px;border-radius:6px 6px 0 0;font-family:monospace;font-size:8px;color:var(--muted-foreground)}.window-dots{display:flex;gap:5px}.window-dots i{width:5px;height:5px;border-radius:50%;background:var(--destructive)}.window-dots i:nth-child(2){background:var(--warning)}.window-dots i:nth-child(3){background:var(--success)}.terminal-body{padding:20px;font-family:monospace;font-size:11px;line-height:1.9;white-space:nowrap;min-height:190px}.terminal-rule{height:1px;background:var(--border);opacity:.5;margin:12px 0}.terminal-cursor{height:13px;width:5px;vertical-align:middle;display:inline-block;background:var(--primary);margin-left:6px;animation:blink 1.2s steps(1) infinite}.phone-window{position:absolute;background:var(--card);width:130px;height:232px;right:22px;bottom:-10px;transform:rotate(8deg);border:4px solid var(--border);border-radius:20px;padding:18px 10px 12px;box-shadow:var(--shadow);font-size:8px;transition:transform .35s}.project-art:hover .phone-window{transform:translateY(-8px) rotate(5deg)}.phone-notch{width:37px;height:6px;background:var(--border);position:absolute;left:50%;top:4px;transform:translateX(-50%);border-radius:0 0 7px 7px}.phone-window>p{color:var(--strong);display:flex;justify-content:space-between;font-weight:700}.phone-message{font-size:10px;color:var(--primary);font-weight:600;margin-top:23px}.phone-file{margin-top:13px;padding:10px 7px;border:1px solid var(--border);border-radius:5px;display:grid;grid-template-columns:14px 1fr;line-height:1.7}.phone-file>span{color:var(--warning);grid-row:span 2;font-size:12px}.phone-file>small{font-size:6px;color:var(--muted-foreground)}.phone-lines{display:grid;gap:5px;margin-top:13px}.phone-lines i{height:3px;background:var(--secondary);width:100%}.phone-lines i:nth-child(2){width:80%}.phone-lines i:nth-child(3){width:65%}.phone-input{position:absolute;bottom:19px;left:10px;right:10px;border:1px solid var(--border);border-radius:4px;padding:6px 4px;color:var(--muted-foreground);font-size:6px}.phone-input span{float:right;color:var(--primary)}.project-art-arrow{position:absolute;bottom:19px;left:23px;font-size:20px;color:var(--muted-foreground);z-index:3}.games-art{background:color-mix(in srgb,var(--success) 7%,var(--card))}.game-art-sprite{position:absolute;width:min(76%,270px);height:auto;max-width:100%;left:50%;top:50%;transform:translate(-50%,-50%);opacity:1;transition:transform .4s}.games-art:hover .game-art-sprite{transform:translate(-50%,-52%)}.game-orbit{position:absolute;inset:25px;border:1px solid color-mix(in srgb,var(--success) 22%,transparent);border-radius:50%;transform:rotate(-25deg)}.game-orbit i:first-child{position:absolute;inset:21px;border:1px dashed color-mix(in srgb,var(--success) 18%,transparent);border-radius:50%}.game-orbit i:last-child{position:absolute;width:8px;height:8px;background:var(--warning);border-radius:50%;right:30px;bottom:45px}.game-badge{position:absolute;bottom:20px;right:20px;background:var(--card);border:1px solid var(--border);padding:5px 10px;border-radius:4px;font:8px monospace;letter-spacing:1px}.game-badge>span{color:var(--success);margin-right:5px}.project-meta{display:grid;grid-template-columns:30px 1fr 30px;gap:13px;margin-top:22px}.project-number{font-size:10px;color:var(--muted-foreground);padding-top:2px}.project-label{font-size:9px;letter-spacing:1px;color:var(--muted-foreground);line-height:1.6}h3{font-size:22px;font-weight:600;color:var(--strong);line-height:1.5;letter-spacing:-.4px;margin-top:3px}.project-meta p:not(.project-label){font-size:13px;line-height:1.9;margin-top:8px;max-width:390px}.tags{display:flex;gap:14px;font-size:9px;margin-top:14px;color:var(--muted-foreground)}.details-button{border:1px solid var(--border);border-radius:50%;width:30px;height:30px;padding:0;line-height:1}.details-button:hover{background:var(--primary);color:var(--primary-foreground);border-color:var(--primary)}.project-compact{padding:30px 0;border-block:1px solid var(--border);display:flex;gap:19px;position:relative}.compact-icon{width:57px;height:57px;display:grid;place-items:center;background:var(--secondary);border:1px solid var(--border);border-radius:7px;flex-shrink:0;margin-top:6px}.compact-icon svg{width:34px;height:34px;fill:none;stroke:var(--primary);stroke-width:1.5}.setup-icon svg{stroke:var(--purple)}.setup-icon circle{fill:var(--secondary)}.compact-copy h3{font-size:18px}.compact-copy>p:not(.project-label){font-size:12px;line-height:1.9;margin:10px 0 13px;max-width:350px}.compact-copy .text-link{font-size:11px;color:var(--primary)}.compact-number{position:absolute;right:0;top:31px;font-size:10px;color:var(--muted-foreground)}.about{background:var(--card);border-block:1px solid var(--border)}.about-layout{display:grid;grid-template-columns:1fr 1.2fr;gap:80px}.about-side h2{font-size:45px;line-height:1.5;margin-top:26px}.about-signature{font:italic 34px Georgia,serif;color:var(--foreground);margin-top:50px}.about-signature span{font:20px monospace;color:var(--warning);margin-left:30px}.about-copy{padding-top:5px}.about-lead{font-size:23px;color:var(--strong);line-height:1.8;margin-bottom:24px}.about-copy>p:not(.about-lead){font-size:14px;line-height:2;margin-bottom:17px;max-width:520px}.principles{margin-top:33px;border-top:1px solid var(--border);padding-top:24px;display:grid;gap:19px}.principles>div{display:grid;grid-template-columns:25px 1fr;gap:0 14px}.principles>div>span{font:11px monospace;grid-row:span 2;padding-top:4px}.principles b{font-size:13px;color:var(--strong);font-weight:500}.principles p{font-size:12px;color:var(--muted-foreground);line-height:1.8}.contact{display:grid;grid-template-columns:1.2fr 1fr;gap:90px;padding-block:110px}.contact h2{font-size:38px;line-height:1.6}.contact>div>p:not(.eyebrow){font-size:13px;margin-top:20px;color:var(--muted-foreground)}.contact-links{align-self:center}.contact-links>a{display:block;padding:20px 0;border-bottom:1px solid var(--border)}.contact-links>a:first-child{border-top:1px solid var(--border)}.contact-label{display:block;font-size:9px;letter-spacing:1.5px;color:var(--muted-foreground)}.contact-links>a>span:last-child{display:flex;justify-content:space-between;font-size:21px;line-height:1.7;color:var(--strong);margin-top:3px}.contact-links i{font-style:normal;color:var(--primary);transition:transform .2s}.contact-links a:hover i{transform:translate(3px,-3px)}.site-footer{display:flex;align-items:center;justify-content:space-between;gap:25px;border-top:1px solid var(--border);padding-block:28px}.site-footer .brand{font-size:11px;letter-spacing:1px}.site-footer p{font-size:9px;letter-spacing:.2px;color:var(--muted-foreground)}.site-footer .text-link{font-size:11px;color:var(--muted-foreground)}dialog{background:var(--card);color:var(--foreground);border:1px solid var(--border);border-radius:10px;padding:42px;max-width:570px;width:calc(100% - 40px);box-shadow:var(--shadow)}dialog::backdrop{background:#14161bbd;backdrop-filter:blur(5px)}dialog h2{font-size:30px;margin:15px 0}dialog>p:not(.eyebrow),dialog li{font-size:14px;line-height:1.9}dialog ul{padding-left:20px;margin:20px 0 28px}dialog li{padding-left:5px;margin-top:8px}dialog li::marker{color:var(--primary)}.dialog-close{position:absolute;right:15px;top:13px;font-size:25px}.dialog-close:hover{background:var(--secondary)}#toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,18px);opacity:0;pointer-events:none;background:var(--popover);color:var(--strong);border:1px solid var(--border);padding:10px 18px;font-size:12px;border-radius:6px;box-shadow:var(--shadow);transition:.2s;z-index:20;white-space:nowrap}#toast.visible{opacity:1;transform:translate(-50%,0)}
@keyframes breathe{50%{transform:translateY(-6px)}}@keyframes blink{50%{opacity:0}}@keyframes scroll{to{transform:translateY(17px);opacity:0}}@keyframes fox-spark{0%,100%{transform:scale(1)}40%{transform:scale(1.035);filter:drop-shadow(0 0 6px #61afef66)}}
@media(min-width:1450px){.hero{min-height:765px}.lab-visual{height:540px}}@media(max-width:1050px){.site-header{padding-inline:30px}.site-header nav{gap:22px}.hero{gap:10px;min-height:640px}.lab-visual{height:420px}h1{letter-spacing:-3px}.edition{margin-left:0}.hero-intro{font-size:14px}.hero-footnote{gap:10px}.project-art{height:310px}.terminal-window{left:20px;right:48px}.phone-window{right:12px}.about-layout{gap:45px}.contact{gap:40px}.contact h2{font-size:32px}.about-side h2{font-size:38px}}
@media(max-width:760px){html{scroll-padding-top:80px}.container{padding-inline:22px}.section{padding-block:65px}.site-header{height:76px;padding-inline:22px;position:relative}.brand{font-size:12px;gap:8px}.brand img{width:29px;height:29px}.header-actions{gap:10px}.github-header{font-size:11px}.menu-toggle{display:grid}.site-header nav{display:none;position:absolute;left:15px;right:15px;top:68px;background:var(--card);border:1px solid var(--border);border-radius:7px;padding:18px 23px;z-index:15;box-shadow:var(--shadow);justify-content:space-between;gap:10px}.site-header nav.open{display:flex}.hero{grid-template-columns:1fr;gap:5px;padding-top:48px;padding-bottom:67px;min-height:auto}.hero .eyebrow{font-size:9px;letter-spacing:1px}.hero-copy{max-width:560px}h1{font-size:clamp(48px,10vw,74px);line-height:1.25;letter-spacing:-2.5px;margin:22px 0}.hero-intro{font-size:14px;line-height:2}.hero-actions{margin-top:25px;gap:25px}.button{font-size:13px;gap:24px;padding:11px 19px;min-height:46px}.hero-footnote{margin-top:25px;font-size:10px;gap:13px}.lab-visual{height:390px;width:100%;max-width:520px;margin:20px auto 0}.visual-topline,.visual-bottomline{font-size:8px}.scroll-note{bottom:20px;left:22px;font-size:8px}.interlude>div{gap:22px;justify-content:flex-start;font-size:9px;padding:15px 22px;overflow:auto;scrollbar-width:none}.interlude i{font-size:17px}.section-heading{margin-bottom:25px}.section-aside{display:none}h2{font-size:30px;letter-spacing:-1px}.eyebrow{font-size:9px}.filters{gap:1px}.filters button{font-size:11px;padding:6px 10px}.filters sup{font-size:8px;margin-left:3px}.work-count{font-size:8px;letter-spacing:.7px}.work-controls{margin-bottom:20px}.project-grid{grid-template-columns:1fr;gap:32px}.project-art{height:340px}.terminal-window{left:30px;right:65px}.terminal-body{font-size:11px;padding:22px}.phone-window{right:25px}.project-meta{grid-template-columns:23px 1fr 30px;gap:10px;margin-top:18px}.project-meta p:not(.project-label){font-size:12px;max-width:none}.project-label{font-size:8px}.project-number{font-size:9px}.project-meta h3{font-size:21px}.tags{font-size:8px;gap:12px}.project-compact{padding-block:25px;gap:15px}.compact-copy h3{font-size:16px;max-width:250px}.compact-number{top:25px}.compact-icon{width:49px;height:49px}.compact-icon svg{width:30px}.compact-copy>p:not(.project-label){font-size:11px}.about-layout{grid-template-columns:1fr;gap:30px}.about-side h2{font-size:36px;line-height:1.45;margin-top:20px}.about-signature{margin-top:22px;font-size:28px}.about-copy{padding-top:0}.about-lead{font-size:21px;margin-bottom:20px}.about-copy>p:not(.about-lead){font-size:13px}.principles{margin-top:25px;gap:17px}.contact{grid-template-columns:1fr;gap:30px}.contact h2{font-size:31px}.contact>div>p:not(.eyebrow){font-size:12px}.contact-links>a{padding:17px 0}.contact-links>a>span:last-child{font-size:21px}.site-footer{padding-block:23px;flex-wrap:wrap;gap:15px}.site-footer .brand{font-size:9px}.site-footer p{order:3;flex-basis:100%;font-size:8px}.site-footer .text-link{font-size:10px}dialog{padding:35px 25px}.dialog-close{top:10px;right:10px}}
@media(max-width:380px){.github-header{display:none}.project-art{height:300px}.terminal-window{left:17px;right:42px}.terminal-body{font-size:9px}.phone-window{right:12px;transform:scale(.9) rotate(8deg);transform-origin:right bottom}.lab-visual{height:330px}.work-count{display:none}.hero-footnote{gap:9px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}

/* Use Wolfox's existing brand artwork at its original aspect ratio. */
.brand-showcase{position:absolute;inset:58px 42px;display:grid;place-items:center}.wolfox-emblem{width:min(100%,350px);height:auto;aspect-ratio:1;object-fit:contain;border-radius:20px;box-shadow:var(--shadow);transition:transform .6s}.lab-visual:hover .wolfox-emblem{transform:translateY(-4px)}.lab-visual.spark .wolfox-emblem{animation:fox-spark .8s ease-out}.brand img{object-fit:contain;flex-shrink:0}.games-art .art-caption{z-index:2}.games-art .game-badge{z-index:2}
@media(max-width:760px){.brand-showcase{inset:54px 32px}.wolfox-emblem{max-width:290px}.game-art-sprite{width:min(76%,260px)}}
@media(max-width:380px){.brand-showcase{inset:47px 25px}.game-art-sprite{width:min(76%,230px)}}

/* One lockup draws full-screen, then docks in the hero without disappearing. */
:root{--logo-frame:#fffffa}html[data-theme=light]{--logo-frame:#233141}
.logo-for-light{display:none!important}html[data-theme=light] .logo-for-light{display:block!important}html[data-theme=light] .logo-for-dark{display:none!important}
.brand-intro{position:relative;width:100%;max-width:420px;aspect-ratio:397/112}
.intro-lockup{position:relative;width:100%;aspect-ratio:397/112;container-type:inline-size;flex:none}
.intro-logo{position:absolute;left:0;top:0;width:28.21%;height:100%;display:grid;place-items:center;z-index:2;background:transparent}
.intro-logo-svg{width:100%;height:100%;overflow:visible;background:transparent}
.intro-logo .logo-part{fill-opacity:1;stroke-width:0;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:0}
.intro-logo .logo-frame{stroke:var(--logo-frame)}.intro-logo .logo-fox{stroke:#ee782a}
.logo-part-1{--draw-delay:.05s}.logo-part-2{--draw-delay:.25s}.logo-part-3{--draw-delay:.5s}
.intro-wordmark-slot{position:absolute;left:34.51%;top:0;width:65.49%;height:100%;display:flex;align-items:center;overflow:visible;z-index:3;background:transparent}
.intro-wordmark{display:block;white-space:nowrap;font-size:10cqw;line-height:1.2;font-weight:650;letter-spacing:-.032em;color:var(--strong)}
.intro-wordmark span{color:var(--primary);font-weight:400}
.brand-opening{overflow:hidden;scrollbar-gutter:stable}
.intro-stage{position:fixed;inset:0;z-index:200;display:grid;place-items:center;isolation:isolate;touch-action:none}
.intro-backdrop{position:absolute;inset:0;background:var(--background);z-index:-1}
.intro-stage>.intro-lockup{width:min(660px,calc(100vw - 44px));will-change:transform;transform-origin:center}
.intro-stage.is-playing .intro-logo{transform:translateX(127.26%);animation:intro-mark-left .8s 1.55s cubic-bezier(.22,.8,.2,1) forwards}
.intro-stage.is-playing .logo-part{stroke-width:6;stroke-dashoffset:1;fill-opacity:0;animation:intro-draw .8s var(--draw-delay) cubic-bezier(.4,0,.25,1) forwards,intro-fill .35s 1.2s ease-out forwards}
.intro-stage.is-playing .intro-wordmark{transform:translateX(-12%);opacity:0;animation:intro-word-slide .8s 1.55s cubic-bezier(.22,.8,.2,1) forwards}
@keyframes intro-draw{to{stroke-dashoffset:0}}@keyframes intro-fill{to{fill-opacity:1;stroke-width:0}}
@keyframes intro-mark-left{to{transform:translateX(0)}}
@keyframes intro-word-slide{from{transform:translateX(-12%);opacity:0}to{transform:translateX(0);opacity:1}}
@media(max-width:760px){.hero{padding-top:28px}.lab-visual{grid-row:1;height:250px;margin:0 auto 20px}.brand-showcase{inset:48px 18px}.visual-topline{top:5px}.visual-bottomline{bottom:5px}}
@media(prefers-reduced-motion:reduce){.intro-stage{display:none}}

/* A quiet crossfade between the cool dark and warm light palettes. */
.theme-transition,.theme-transition body,.theme-transition body *,.theme-transition body *::before,.theme-transition body *::after{transition-property:background-color,color,border-color,box-shadow,fill,stroke;transition-duration:.5s;transition-timing-function:ease}
#theme-toggle svg{transition:transform .5s ease}html[data-theme=light] #theme-toggle svg{transform:rotate(180deg)}
html[data-theme] .intro-logo .intro-logo-svg{display:block!important;position:absolute;inset:0;transition:opacity .45s ease}
html[data-theme] .intro-logo .logo-for-light{opacity:0}html[data-theme] .intro-logo .logo-for-dark{opacity:1}
html[data-theme=light] .intro-logo .logo-for-light{opacity:1}html[data-theme=light] .intro-logo .logo-for-dark{opacity:0}
.theme-transition .intro-logo .intro-logo-svg{transition-property:opacity;transition-duration:.45s}

/* Real project imagery, displayed at its own proportions. */
.catalog-media{position:relative;display:flex;align-items:center;justify-content:center;min-width:0;height:285px;overflow:hidden;border:1px solid var(--border);border-radius:8px;background:var(--card);transition:border-color .2s,transform .2s}
.catalog-media:hover{border-color:var(--primary);transform:translateY(-3px)}
.catalog-shot{width:100%;height:100%;object-fit:contain;transition:transform .5s}
.catalog-media:hover .catalog-shot{transform:scale(1.025)}
.media-caption{position:absolute;left:14px;bottom:12px;background:var(--background);border:1px solid var(--border);border-radius:4px;padding:3px 8px;font-size:9px;color:var(--foreground)}
.media-termdesk-desktop{padding:24px 67px 24px 14px;background:color-mix(in srgb,var(--primary) 8%,var(--card))}
.media-termdesk-desktop>.catalog-shot{border-radius:5px;box-shadow:var(--shadow)}
.termdesk-phone{position:absolute;right:20px;bottom:13px;width:95px;height:220px;object-fit:contain;border-radius:10px;border:3px solid var(--border);background:#f8f8f2;box-shadow:var(--shadow)}
.media-fat-fish{background:#cee9e5}.media-fat-fish>.catalog-shot{padding:10px}
.media-bumper{background:#172b45}.media-survivor{background:#1d4854}.media-tower-defense{background:#879d42}
.catalog-project .project-meta{grid-template-columns:24px minmax(0,1fr) 30px;gap:11px}.catalog-project .project-meta p:not(.project-label){max-width:none}
.catalog-project .tags{flex-wrap:wrap;gap:4px 12px}.catalog-project h3{overflow-wrap:anywhere;font-size:21px}
.work-controls{gap:15px}.filters{gap:3px}.filters button{padding-inline:11px}
.concept-art,.palette-art{width:100%;height:100%;padding:28px 32px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:12px}
.concept-art strong,.palette-art strong{font-size:clamp(24px,3.2vw,33px);letter-spacing:-1.2px;line-height:1.25;color:var(--strong);font-weight:600}
.concept-art>span:last-child,.art-kicker{font:9px Consolas,monospace;letter-spacing:1px;color:var(--muted-foreground)}
.concept-symbol{font-size:38px;line-height:1.2;color:var(--primary)}.pet-symbol{color:var(--purple)}
.bridge-project-icon{width:48px;height:48px;object-fit:contain}
.media-palette{background:#282c34;color:#abb2bf}.palette-art strong{color:#d7dae0}.palette-art .art-kicker{color:#abb2bf}
.palette-swatches{display:flex;gap:9px}.palette-swatches i{width:30px;height:20px;border-radius:4px;background:#61afef}.palette-swatches i:nth-child(2){background:#98c379}.palette-swatches i:nth-child(3){background:#e5c07b}.palette-swatches i:nth-child(4){background:#c678dd}.palette-swatches i:nth-child(5){background:#e06c75}
.palette-art code{font:10px Consolas,monospace;color:#abb2bf}.palette-art code b{color:#c678dd;font-weight:400}.palette-art code em{color:#98c379;font-style:normal}
.media-pet{background:color-mix(in srgb,var(--purple) 7%,var(--card))}.media-town{background:color-mix(in srgb,var(--success) 9%,var(--card))}.town-art .concept-symbol{color:var(--success)}
.dialog-image{width:100%;height:auto;max-height:42vh;object-fit:contain;margin:22px 0;background:var(--background);border:1px solid var(--border);border-radius:6px}.dialog-image[hidden]{display:none}
@media(max-width:760px){.catalog-media{height:270px}.concept-art strong,.palette-art strong{font-size:30px}.filters button{padding-inline:8px}.work-controls{align-items:flex-start}.work-count{padding-top:10px;white-space:nowrap}.termdesk-phone{height:215px;width:95px}.catalog-project .project-meta{grid-template-columns:22px minmax(0,1fr) 30px}.project-grid{gap:35px}}
@media(max-width:380px){.catalog-media{height:220px}.termdesk-phone{height:170px;width:74px;right:12px}.media-termdesk-desktop{padding-right:53px}.concept-art,.palette-art{padding:20px}.concept-art strong,.palette-art strong{font-size:26px}.palette-art code{font-size:8px}.filters button{padding:6px}.catalog-project h3{font-size:19px}.work h2{font-size:25px}}
@media(prefers-reduced-motion:reduce){.theme-transition *,.intro-logo .intro-logo-svg,#theme-toggle svg{transition:none!important}}
