@charset "UTF-8";
@font-face{font-family:Arena;src:url('/assets/fonts/LilitaOne-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
:root{--blue:#1789ef;--deep:#082957;--gold:#ffd551;--ink:#172e55;--muted:#526689;--paper:#dce9ff;--display:Arena,'Arial Black',sans-serif;--body:'Segoe UI',Arial,sans-serif;--max:1240px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;background-color:#081c34;background-image:linear-gradient(90deg,#020c1d66,#04132933 25%,#04132933 75%,#020c1d66),url('/assets/arena-floor-dcd99e6405b0.webp');background-size:auto,100px 100px;color:#fff;font:16px/1.65 var(--body)}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer;border:0}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,video:focus-visible{outline:3px solid #fff9b2;outline-offset:5px}img{display:block;max-width:100%;height:auto}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.15}::selection{background:#ffdd6a;color:#12325a}[hidden]{display:none!important}.wrap{width:min(var(--max),calc(100% - 80px));margin-inline:auto}.ui-icon{display:block;flex-shrink:0;width:34px;height:34px;filter:drop-shadow(0 2px 1px #08214566)}.skip-link{position:fixed;top:-100px;left:20px;z-index:300;background:#ffd64f;color:#112b53;padding:10px 20px;border-radius:8px}.skip-link:focus{top:12px}
/* Lobby navigation */
.site-header{position:sticky;top:0;z-index:80;height:88px;background:linear-gradient(#4cafff 0,#2189ef 8%,#105ccc 82%,#0c48a0);border-top:2px solid #9edbff;border-bottom:3px solid #06376d;box-shadow:0 5px 0 #07284d99,0 8px 20px #03193644}.header-inner{width:min(1400px,calc(100% - 60px));height:100%;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:30px}.brand{display:flex;align-items:center;gap:13px}.brand>svg{width:57px;height:66px;filter:drop-shadow(0 3px 2px #06255888)}.brand>span{font:32px/1 var(--display);text-shadow:0 3px #092857}.brand small{display:block;font:700 9px/1.4 var(--body);letter-spacing:.17em;color:#d6edff;margin-top:7px}#main-nav{display:flex;gap:10px;align-items:center}#main-nav>a{display:flex;align-items:center;gap:8px;padding:9px 13px;border:2px solid transparent;border-radius:9px;font:18px var(--display);text-shadow:0 2px #133665;transition:background .16s,transform .16s}#main-nav .ui-icon{width:28px;height:28px}#main-nav>a:hover{background:#d6ecff12;border-color:transparent;box-shadow:none}#main-nav>.nav-contact{background:linear-gradient(#ffe68b,#ffbc23);color:#432b18;text-shadow:0 1px #fff1a8;border-color:#ffed8c;box-shadow:0 4px 0 #a56b10,0 5px 0 2px #07326a;margin-left:10px}.menu-toggle{display:none}
/* Raised buttons */
.button{min-height:55px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:13px 24px;font:21px/1.2 var(--display);border:2px solid;border-radius:11px;position:relative;transition:transform .15s,filter .15s;isolation:isolate}.button:before{content:'';position:absolute;inset:3px 4px auto;height:40%;border-radius:6px;background:linear-gradient(#ffffff44,#fff0);pointer-events:none;z-index:-1}.button-gold{color:#463019;background:linear-gradient(#ffe16b 0,#ffc02f 54%,#ffb413 55%,#ffc22f);border-color:#fff099 #e99812 #d4890b #ffe186;text-shadow:0 1px #fff4b7;box-shadow:0 5px 0 #a86813,0 6px 0 2px #092b57,0 10px 14px #051c4544}.button-blue,.button-outline{color:white;background:linear-gradient(#55bdff,#1685ed 55%,#0969d5);border-color:#9cdbff #2586e2 #0849a2 #80c5ff;text-shadow:0 2px #123873;box-shadow:0 5px 0 #07408d,0 6px 0 2px #082b59,0 10px 14px #051c4533}.button .ui-icon{width:29px;height:29px}.button:hover{filter:brightness(1.09);transform:translateY(-2px)}.button:active{transform:translateY(4px);box-shadow:0 1px 0 #815815,0 2px 0 2px #092b57}.text-link{display:inline-flex;gap:18px;align-items:center;color:#1250a3;font-weight:750;font-size:14px;border-bottom:2px solid #88aee2;padding-bottom:3px}.text-link:hover{color:#176fde;border-color:currentColor}
/* The featured deck */
.arena-hero{position:relative;overflow:hidden;background:linear-gradient(180deg,#020e2099,transparent 23%,transparent 76%,#04112544);isolation:isolate}.hero-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:15px;align-items:center;min-height:650px;padding-block:62px 76px}.hero-content{position:relative;z-index:5}.hero-kicker{font-size:11px;font-weight:800;letter-spacing:.13em;color:#ccefff;display:flex;align-items:center;gap:10px;margin-bottom:20px}.status-gem{width:10px;height:10px;transform:rotate(45deg);background:#8bf3e6;border:2px solid #d3fff8;box-shadow:0 0 12px #62fff488}.hero-content h1{font-size:clamp(54px,5.7vw,82px);line-height:1.04;color:#fff7dd;paint-order:stroke fill;-webkit-text-stroke:6px #092b60;text-shadow:0 7px 0 #082654,0 12px 18px #031d5766}.hero-content h1>span{display:block;color:#ffd553;font-size:1.17em;letter-spacing:-.015em}.hero-description{font-size:20px;font-weight:700;line-height:1.55;color:#f1f7ff;margin-top:27px;text-shadow:0 2px #073c79}.hero-subtitle{margin-top:12px;color:#c2e5ff;font-size:15px}.hero-actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:30px}.hero-stats{display:flex;gap:28px;margin-top:28px}.hero-stats>span{font-size:11px;color:#bfe0fa;display:flex;align-items:center;gap:9px}.hero-stats b{font:23px var(--display);color:#fff0ad;text-shadow:0 2px #0a335d}.hero-stage{position:relative;min-width:0;height:485px}.deck{position:relative;height:390px;width:540px;max-width:100%;margin:35px auto 0;z-index:3}.deck-card{position:absolute;width:218px;height:303px;border:5px solid #d6e8fc;border-radius:19px 19px 25px 25px;background:#155aaa;padding:4px;box-shadow:inset 0 0 0 2px #7a99c3,0 4px 0 2px #587393,0 7px 0 4px #072d59,0 24px 25px #05224266;transform:rotate(var(--rot));transition:transform .2s,filter .2s}.deck-left{left:4px;top:63px;--rot:-16deg}.deck-right{right:4px;top:70px;--rot:16deg}.deck-center{width:240px;height:350px;left:calc(50% - 120px);top:18px;--rot:-3deg;z-index:3;border-color:#ffe987;box-shadow:inset 0 0 0 2px #c99132,0 4px 0 2px #ba811e,0 7px 0 4px #092d59,0 24px 30px #05224277}.deck-image{height:100%;overflow:hidden;border:2px solid #143258;border-radius:10px 10px 18px 18px;background:#124578}.deck-image img{height:100%;width:100%;object-fit:cover;object-position:center}.deck-left img{object-position:51% center}.deck-right img{object-position:46% center}.deck-title{position:absolute;inset:auto 6px 6px;padding:35px 14px 18px;font:19px/1.05 var(--display);text-align:center;border-radius:0 0 16px 16px;background:linear-gradient(transparent,#092750ee 40%);text-shadow:0 2px #00132c}.deck-center .deck-title{color:#ffe89b;font-size:21px}.deck-card:hover{transform:translateY(-12px) rotate(var(--rot));filter:brightness(1.08);z-index:6}.stage-plinth{position:absolute;bottom:46px;left:5%;width:90%;height:55px;clip-path:polygon(12% 0,88% 0,100% 32%,100% 73%,50% 100%,0 73%,0 32%);background:linear-gradient(#74b9e5 0 30%,#2e6ba9 31% 50%,#143e78 51% 68%,#e9b944 69% 77%,#123663 78%)}.stage-hint{position:absolute;bottom:0;width:100%;text-align:center;color:#c9e6ff;font-size:12px}.castle-divider{height:19px;background:linear-gradient(#ffec87,#d89c31);clip-path:polygon(0 38%,4% 38%,4% 0,8% 0,8% 38%,16% 38%,16% 0,20% 0,20% 38%,28% 38%,28% 0,32% 0,32% 38%,40% 38%,40% 0,44% 0,44% 38%,52% 38%,52% 0,56% 0,56% 38%,64% 38%,64% 0,68% 0,68% 38%,76% 38%,76% 0,80% 0,80% 38%,88% 38%,88% 0,92% 0,92% 38%,100% 38%,100% 100%,0 100%)}
/* Collection banners */
.gallery-section{padding-block:65px 35px}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:35px;margin-bottom:30px}.ribbon{display:flex;gap:18px;align-items:center;position:relative;min-height:90px;padding:16px 35px 17px 20px;background:linear-gradient(#369ef2,#146bd0 53%,#0c4fba);border:3px solid #ffe078;box-shadow:inset 0 2px #ffffff6b,0 5px 0 #0b2d61,0 8px 14px #07294466;isolation:isolate}.ribbon:after{content:'';position:absolute;inset:8px -15px -13px 13px;background:#143f8a;border:3px solid #d5a747;z-index:-2;clip-path:polygon(0 0,100% 0,96% 50%,100% 100%,0 100%)}.ribbon>div{min-width:0}.ribbon-icon{flex-shrink:0;height:58px;width:58px;display:grid;place-items:center;background:linear-gradient(#256ec5,#143e8c);border:2px solid #70b9ff;border-radius:12px;box-shadow:inset 0 -3px #0a2a6188;transform:rotate(-5deg)}.ribbon-icon .ui-icon{width:45px;height:45px}.section-kicker{font-size:10px;letter-spacing:.13em;font-weight:800;line-height:1.5;color:#a2c8ef;margin-bottom:9px}.ribbon .section-kicker{color:#c6e7ff;margin-bottom:4px;font-size:9px}.section-heading h2{font-size:29px;line-height:1.2;letter-spacing:.01em;color:white;paint-order:stroke fill;-webkit-text-stroke:1px #11366f;text-shadow:0 2px #082c61}.section-intro{font-size:14px;color:#d0e7fc;line-height:1.75;max-width:285px}.collection-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:40px 0 27px}.filter-tabs{display:flex;gap:8px;flex-wrap:wrap}.filter-tabs button{display:flex;align-items:center;gap:8px;min-height:43px;padding:9px 18px;border:2px solid #789fd1;border-radius:9px 9px 6px 6px;background:linear-gradient(#a6c8ed,#688dbd);color:#183861;font:17px var(--display);box-shadow:0 3px #183b6d,inset 0 2px #d8ecff;transition:transform .15s}.filter-tabs button span{font:700 10px/18px var(--body);width:19px;height:19px;border-radius:5px;background:#244a7777;color:#f0f8ff}.filter-tabs button[aria-pressed=true]{color:#fff8cf;background:linear-gradient(#246ded,#24419c);border-color:#ffe484;box-shadow:0 3px #092b65,inset 0 2px #70a7fa;text-shadow:0 2px #19396a}.filter-tabs button:hover{transform:translateY(-2px)}.collection-count{font-size:11px;color:#c9def2;white-space:nowrap}.game-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}.project-card{min-width:0;overflow:hidden;border-radius:13px;border:3px solid #8eb7e4;background:#cfdef8;box-shadow:inset 0 0 0 2px #eef5ff,0 5px 0 #44648f,0 8px 0 1px #062a52,0 12px 20px #06254d66;transition:transform .22s,border-color .22s}.project-card:hover{transform:translateY(-6px);border-color:#ffe386}.card-image{position:relative;aspect-ratio:16/9;overflow:hidden;border:3px solid #112e50;border-radius:8px 8px 0 0;margin:4px 4px 0;background:#0d284d}.card-image img{width:100%;height:100%;object-fit:cover;transition:transform .4s}.project-card:hover .card-image img{transform:scale(1.035)}.card-open{position:absolute;right:10px;bottom:10px;background:#083567e8;border:1px solid #a0c6ef;border-radius:6px;padding:5px 9px;font:14px var(--display);display:flex;gap:8px;align-items:center;opacity:0;transform:translateY(6px);transition:.2s}.card-open .ui-icon{width:20px;height:20px}.project-card:hover .card-open,.project-card:focus-visible .card-open{opacity:1;transform:none}.card-body{padding:22px 24px 19px;color:var(--ink);background:linear-gradient(#e0ebff,#becfee);border-top:2px solid #f6fbff}.eyebrow{font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#4d658a}.card-body h3{font-size:28px;margin-top:7px;color:#163967;text-shadow:0 1px #fff}.card-body>p{font-size:14px;color:#51668a;line-height:1.6;margin-top:10px;max-width:450px}.card-link{display:flex;align-items:center;justify-content:space-between;font-weight:750;font-size:12px;color:#1b58a5;margin-top:17px;padding-top:12px;border-top:1px solid #91afd7}.card-link b{font-size:20px;line-height:1}
/* Art and VFX */
.art-section{padding-block:60px 65px;margin-top:30px;background:linear-gradient(#083968bb,#052b50cc);border-block:2px solid #2b719b}.art-showcase{display:grid;grid-template-columns:1.55fr 1fr;gap:28px;margin-top:38px}.illustration-feature,.drawing-feature{position:relative;overflow:hidden;border:5px solid #eac267;border-radius:15px;background:#112947;box-shadow:inset 0 0 0 2px #fff1af,0 5px #936c2e,0 8px #06223f;min-height:490px}.drawing-feature{border-color:#c5d6e7;box-shadow:0 5px #697d95,0 8px #06223f}.portrait-strip{height:490px;display:flex;position:relative}.portrait-strip img{width:38%;height:100%;object-fit:cover;transition:transform .4s}.portrait-strip .portrait-main{width:42%;margin-inline:-9%;position:relative;z-index:2;box-shadow:0 0 30px #001b3766}.illustration-feature:hover .portrait-main{transform:scale(1.04)}.feature-badge{position:absolute;top:16px;left:0;z-index:5;font:12px var(--display);background:linear-gradient(#ffe78c,#e6ad34);border:2px solid #fff0a3;border-left:0;border-radius:0 7px 7px 0;padding:7px 14px;color:#55401d;box-shadow:0 3px #66461977}.feature-badge.silver{background:linear-gradient(#e9f5ff,#b2cce9);border-color:#eef7ff;color:#203c63}.drawing-feature>img{width:100%;height:100%;object-fit:cover;object-position:50% 36%}.art-caption{position:absolute;z-index:4;inset:auto 0 0;padding:65px 24px 25px;background:linear-gradient(transparent,#062443ed 52%);color:#fff}.art-caption .eyebrow{color:#c4ddf7}.art-caption h3{font-size:30px;color:#fff0bc;text-shadow:0 3px #0a1a34;max-width:470px;margin-top:8px}.art-caption .text-link{color:#e8f4ff;border-color:#9bc6e5;margin-top:15px;font-size:12px}.motion-section{padding-block:66px 50px;background:radial-gradient(ellipse at 50% 50%,#6d36b577,transparent 70%),linear-gradient(#281653e8,#25114ae0);border-bottom:3px solid #685098}.motion-section .ribbon{background:linear-gradient(#996ce0,#6534bf 55%,#462391);border-color:#deb4ff}.motion-section .ribbon:after{background:#331567;border-color:#9770b3}.motion-section .ribbon-icon{background:linear-gradient(#6835bd,#3d1778);border-color:#cca4f7}.motion-section .section-heading h2{-webkit-text-stroke-color:#24123f;text-shadow:0 2px #170b2d}.motion-section .section-intro{color:#e4d7f8}.motion-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:40px}.motion-card{border:4px solid #c09cee;border-radius:13px;overflow:hidden;background:#412775;box-shadow:inset 0 0 0 2px #dfc4ff,0 5px #653795,0 8px #1b103f,0 0 28px #bd74ff12}.video-frame{aspect-ratio:16/9;background:#111a28;border-bottom:3px solid #2a164f}.video-frame video{width:100%;height:100%;object-fit:contain;display:block;background:#16202b}.motion-caption{padding:20px;display:flex;gap:14px;align-items:center;background:linear-gradient(#e0d1f7,#bda8e1);color:#372757;border-top:2px solid #eee6ff}.motion-caption h3{font-size:25px}.motion-caption p{font-size:14px;color:#5b4c79;margin-top:5px}.motion-caption>span{margin-left:auto;font-size:11px;font-weight:800;line-height:1.5;color:#403254;text-align:right}.motion-note{text-align:center;color:#ded1f2;font-size:14px;margin-top:28px}
/* Artist panels */
.about-teaser{margin-block:75px;display:grid;grid-template-columns:.85fr 1.4fr;gap:55px;padding:38px;background:linear-gradient(#e7f1ff,#c4d5ef);border:4px solid #96b7df;border-radius:16px;box-shadow:inset 0 0 0 2px #f9fcff,0 6px #5276a5,0 9px #062850;color:var(--ink);align-items:center}.about-art{position:relative;height:340px;border:4px solid #ebd38b;border-radius:12px;overflow:hidden;box-shadow:0 4px #786947,0 7px #163855}.about-art>img{width:100%;height:100%;object-fit:cover;object-position:40% 35%}.portrait-name{position:absolute;inset:auto 0 0;display:flex;align-items:center;justify-content:space-between;padding:10px 17px;background:linear-gradient(#1e74c8,#184c91);border-top:2px solid #baddfa;font:24px var(--display);color:white;text-shadow:0 2px #092653}.portrait-name .ui-icon{width:28px;height:28px}.about-copy .section-kicker{color:#4e72a6}.about-copy h2{font-size:43px;color:#173965;text-shadow:0 2px #fff}.profile-role{font-size:17px;font-weight:750;color:#2563a6;margin-top:12px}.about-copy>p:not(.section-kicker):not(.profile-role){color:#485f82;font-size:15px;line-height:1.9;margin-top:18px}.profile-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:26px}.about-copy .button{font-size:19px;min-height:50px}.site-footer{background:linear-gradient(#0b3970,#06234a);border-top:3px solid #729bc7;padding-block:30px 24px}.footer-inner{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:center}.footer-brand{display:flex;gap:10px;align-items:center}.footer-brand>svg{width:38px;height:45px}.footer-brand>span{font:25px var(--display);text-shadow:0 2px #061c3b}.footer-brand small{display:block;font:8px var(--body);letter-spacing:.2em;color:#a8c7ec;margin-top:4px}.footer-inner>p{font-size:12px;color:#adcae8}.footer-email{display:flex;align-items:center;gap:8px;justify-self:end;font:16px var(--display);color:#e1edfc}.footer-email .ui-icon{width:26px;height:26px}.footer-credit{grid-column:1/-1;text-align:center;color:#b6cee7;font-size:11px}.mobile-dock{display:none}
/* Project galleries */
.project-hero{position:relative;overflow:hidden;background:linear-gradient(115deg,#124985,#0b2d60);min-height:540px;isolation:isolate;border-bottom:4px solid #d8b051}.project-hero-art{position:absolute;inset:0 0 0 35%;z-index:-3}.project-hero-art img{width:100%;height:100%;object-fit:cover;opacity:.9}.project-hero-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#0a3771 5%,#0b3c79f5 30%,#123d78bb 52%,#05214633 78%),linear-gradient(0deg,#082955aa,transparent 40%)}.project-hero-content{padding-block:35px 55px}.back-link{display:inline-flex;align-items:center;min-height:36px;font-size:12px;font-weight:750;color:#d7ebff;padding:5px 13px;border:1px solid #7ba9d2;border-radius:6px;background:#082c5b80;margin-bottom:65px}.back-link:before{content:'←';margin-right:9px}.project-hero .hero-kicker{color:#ffdc78;font-size:10px}.project-hero h1{font-size:clamp(42px,4.4vw,64px);max-width:730px;color:#fff0bd;paint-order:stroke fill;-webkit-text-stroke:3px #082754;text-shadow:0 4px #051e45;margin-bottom:20px}.project-hero-content>p:not(.hero-kicker){font-size:16px;line-height:1.8;max-width:510px;color:#d8ebff}.project-tags{display:flex;gap:9px;flex-wrap:wrap;margin-top:24px}.project-tags span{font-size:11px;font-weight:700;background:linear-gradient(#297ac3,#174e91);border:1px solid #88b7e5;border-radius:6px;padding:5px 11px;box-shadow:0 2px #06234b;color:#eaf5ff}.project-overview{display:grid;grid-template-columns:.65fr 2fr;gap:45px;margin-top:40px;padding:33px;background:linear-gradient(#e0edff,#bfceed);border:3px solid #96b6dc;border-radius:12px;color:var(--ink);box-shadow:inset 0 1px #fff,0 5px #365c8c}.project-overview .section-kicker{color:#2d5d94;margin:7px 0 0}.project-overview h2{font-size:28px;color:#1a3c6b}.project-overview div>p{margin-top:15px;font-size:15px;line-height:1.9;color:#475d7f}.project-section{padding-top:55px}.project-section-heading{display:flex;gap:20px;align-items:center;margin-bottom:24px}.project-section-heading>span{width:52px;height:57px;flex-shrink:0;display:grid;place-items:center;background:linear-gradient(#3f98eb,#164b97);border:3px solid #e7ca78;border-radius:8px 8px 18px 18px;box-shadow:0 3px #082a55;font:27px var(--display);color:#ffe796;text-shadow:0 2px #0c2a4f}.project-section h2{font-size:30px;color:#f6e8bc;text-shadow:0 3px #082a58}.project-section-heading p{color:#c6ddf4;font-size:13px;margin-top:8px;line-height:1.7}.artwork-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}.artwork{margin:0;min-width:0;padding:5px;background:linear-gradient(#d4e7fa,#7b9ecb);border:2px solid #bfd6ee;border-radius:10px;box-shadow:0 4px #3d638a,0 6px #092b4d}.artwork-button{display:block;position:relative;padding:0;width:100%;border:2px solid #173857;border-radius:5px;overflow:hidden;background:#112e49}.artwork img{width:100%;height:auto}.zoom-label{position:absolute;bottom:12px;right:12px;display:flex;align-items:center;gap:9px;padding:5px 11px;background:#0a366adc;border:1px solid #afd6f2;border-radius:6px;font-size:12px;opacity:0;transition:opacity .16s}.zoom-label b{font-size:18px}.artwork-button:hover .zoom-label,.artwork-button:focus-visible .zoom-label{opacity:1}.adaptation-grid{grid-template-columns:1.7fr 1fr;align-items:center}.adaptation-grid .artwork:nth-child(2){max-width:370px;justify-self:center}.next-project{padding-block:65px}.next-project>.section-kicker{color:#bcd7f2}.next-project>a{display:flex;justify-content:space-between;align-items:center;gap:30px;background:linear-gradient(#e6f0ff,#c4d4ef);padding:24px 30px;border:3px solid #91b3d7;border-radius:12px;box-shadow:0 5px #42638f;color:#1c3c68}.next-project h2{font-size:34px;margin:10px 0 15px}.next-project img{width:30%;max-height:180px;object-fit:cover;border:3px solid #738fb6;border-radius:8px}
/* Shared artwork viewer: quiet textured stage with tactile game controls. */
.lightbox{
 --viewer-body:#091d35;--viewer-glow:#245a8045;--viewer-rim:#8fc8ec;
 --viewer-top:#328fde;--viewer-mid:#1e65aa;--viewer-bottom:#123d71;
 --viewer-depth:#04182f;--viewer-line:#a6dfff55;--viewer-counter:#bddcf3;
 width:1500px;max-width:calc(100vw - 36px);height:calc(100dvh - 40px);max-height:calc(100dvh - 40px);
 padding:0;margin:auto;overflow:hidden;border:3px solid var(--viewer-rim);border-bottom-color:#4e87b6;
 border-radius:18px;background:var(--viewer-body);color:#f5fbff;
 box-shadow:inset 0 0 0 2px #061a3180,0 5px 0 var(--viewer-depth),0 16px 45px #0008;
}
.lightbox::backdrop{background:#010b1dea}
.lightbox[open]{display:flex;flex-direction:column}
.lightbox-bar,.lightbox-bottom{
 position:relative;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:18px;
 padding:10px 22px;background:linear-gradient(180deg,var(--viewer-top),var(--viewer-mid) 36%,var(--viewer-bottom));
 box-shadow:inset 0 2px #ddf4ff66,inset 0 -3px #04132b55;
}
.lightbox-bar{min-height:76px;border-bottom:2px solid var(--viewer-line)}
.lightbox-bar>span{min-width:0;font:20px/1.3 var(--display);text-shadow:0 2px 1px #061831;overflow-wrap:anywhere}
.lightbox .lightbox-close{
 display:grid;place-items:center;flex:0 0 54px;width:54px;height:54px;padding:0;background:none;border-radius:13px;
 --press-rest-shadow:inset 0 2px 1px #ffc3b8,inset 0 -4px 0 #ba2734,0 4px 0 #791c29,0 6px 2px #02152899;
 --press-down-shadow:inset 0 2px 1px #ffc3b8,inset 0 -2px 0 #ba2734,0 1px 0 #791c29,0 2px 2px #02152899;
}
.lightbox-close b{
 display:grid;place-items:center;width:48px;height:48px;border:2px solid #5e2636;border-radius:12px;
 background:linear-gradient(180deg,#ffb1a0 0%,#ff706e 13%,#f04d56 54%,#dc3442 100%);
 box-shadow:var(--press-rest-shadow);
}
.lightbox-close svg{display:block;width:32px;height:32px;filter:drop-shadow(0 1px 0 #701e29)}
.lightbox-close path{fill:#fffdf5;stroke:#3c2931;stroke-width:2.1;stroke-linejoin:round}
.lightbox .lightbox-close:focus-visible{outline:none}
.lightbox-close:focus-visible b{outline:3px solid #fff3b0;outline-offset:4px}
.lightbox-stage{
 position:relative;isolation:isolate;min-height:0;flex:1;display:flex;align-items:center;justify-content:center;padding:20px;
 background:radial-gradient(ellipse at 50% 45%,var(--viewer-glow),transparent 75%),var(--viewer-body);
 box-shadow:inset 0 8px 18px #020c1a66,inset 0 -8px 18px #020c1a44;
}
.lightbox-stage:before{
 content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
 background:url('/assets/arena-floor-dcd99e6405b0.webp') center/100px 100px;opacity:.16;
 mask-image:radial-gradient(ellipse,transparent 12%,#000 95%);
}
.lightbox-stage:after{
 content:'';position:absolute;inset:7px;z-index:-1;pointer-events:none;border:1px solid #abd6f218;border-radius:8px;
 background:linear-gradient(135deg,#c1e9ff22 0 9px,transparent 9px) top left,
 linear-gradient(225deg,#c1e9ff22 0 9px,transparent 9px) top right,
 linear-gradient(45deg,#05122588 0 9px,transparent 9px) bottom left,
 linear-gradient(315deg,#05122588 0 9px,transparent 9px) bottom right;
 background-size:20px 20px;background-repeat:no-repeat;
}
.lightbox-stage img{position:relative;max-width:100%;max-height:100%;height:auto;width:auto;object-fit:contain;box-shadow:0 4px 20px #0005}
.lightbox-bottom{min-height:82px;display:grid;grid-template-columns:1fr auto 1fr;border-top:2px solid var(--viewer-line)}
.lightbox .lightbox-bottom button{
 display:flex;align-items:center;justify-content:center;gap:10px;min-width:140px;min-height:48px;padding:6px 18px;
 border:2px solid #fff0a0;border-radius:12px;background:linear-gradient(180deg,#ffed8b,#ffd94e 40%,#ffb719);
 font:18px/1.2 var(--display);color:#67401c;text-shadow:0 1px #fff1ab;
 --press-rest-shadow:inset 0 2px #fff6bb,inset 0 -3px #e49d1a,0 4px #936021,0 6px 1px #071a3580;
 --press-down-shadow:inset 0 2px #fff6bb,inset 0 -1px #e49d1a,0 1px #936021,0 2px 1px #071a3580;
 box-shadow:var(--press-rest-shadow);
}
.lightbox-prev{justify-self:start}.lightbox-next{justify-self:end}
.lightbox-bottom svg{width:19px;height:26px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:5.5;stroke-linecap:round;stroke-linejoin:round}
.lightbox-next svg{transform:rotate(180deg)}
.lightbox .lightbox-bottom button:focus-visible{outline:3px solid #fff3b0;outline-offset:5px}
.lightbox-counter{
 min-width:92px;padding:6px 15px;border:1px solid #020c2480;border-bottom-color:var(--viewer-line);border-radius:20px;
 background:#03142c80;box-shadow:inset 0 2px 4px #0005,0 1px #ffffff0d;
 font:700 14px/1.5 var(--body);font-variant-numeric:tabular-nums;text-align:center;letter-spacing:.04em;color:var(--viewer-counter);
}
@media(max-width:850px){
 .lightbox{max-width:calc(100vw - 18px);height:calc(100dvh - 20px);max-height:calc(100dvh - 20px);z-index:100}
}
@media(max-width:600px){
 .lightbox-bar,.lightbox-bottom{padding:8px 12px;gap:12px}
 .lightbox-bar{min-height:72px}.lightbox-bar>span{font-size:17px}
 .lightbox-stage{padding:12px}.lightbox-bottom{min-height:78px}
 .lightbox .lightbox-bottom button{min-width:62px;width:62px;padding:6px 12px}
 .lightbox-bottom button>span{display:none}.lightbox-counter{min-width:88px;font-size:13px}
}
@media(max-height:500px) and (min-width:601px){
 .lightbox{height:calc(100dvh - 16px);max-height:calc(100dvh - 16px)}
 .lightbox-bar,.lightbox-bottom{min-height:60px;padding:4px 18px}
 .lightbox-stage{padding:8px 18px}
}
.modal-open{overflow:hidden}
/* Profile and contact */
.about-page{padding-block:50px 70px}.about-main{display:grid;grid-template-columns:1.2fr .85fr;gap:50px;align-items:center;padding:40px;background:linear-gradient(#eaf3ff,#c5d6f1);border:4px solid #9bbce3;border-radius:16px;color:var(--ink);box-shadow:inset 0 0 0 2px #fbfdff,0 6px #466995,0 9px #092d54}.about-main .hero-kicker{color:#4772a7}.about-main h1{font-size:54px;color:#163c71;text-shadow:0 2px #fff}.profile-bio{font-size:15px;line-height:1.9;color:#4b6182;margin-top:23px}.profile-bio p+p{margin-top:16px}.about-photo{border:4px solid #e9ca76;border-radius:13px;overflow:hidden;box-shadow:0 4px #876833,0 6px #183759;background:#164b86}.about-photo>img{width:100%;height:380px;object-fit:cover;object-position:39% center}.about-photo>span{display:block;text-align:center;padding:14px 9px;font:11px var(--display);letter-spacing:.04em;color:#e7f4ff;border-top:2px solid #ffedaa;background:linear-gradient(#276cac,#164376)}.profile-details{display:grid;grid-template-columns:1.55fr 1fr;gap:30px;padding-top:45px}.experience-section,.tools-section{padding:30px;background:linear-gradient(#dce9fd,#b8ccea);border:3px solid #9dbce2;border-radius:12px;box-shadow:inset 0 1px #fff,0 5px #3e628f;color:var(--ink)}.profile-details .section-kicker{color:#4f71a0}.profile-details h2{font-size:30px;color:#204574}.experience-list,.tool-list{list-style:none;margin:25px 0 0;padding:0}.experience-list li{display:grid;grid-template-columns:100px 1fr;gap:20px;padding:22px 0;border-top:1px solid #8da9cf;box-shadow:inset 0 1px #eef5ff66}.experience-period{color:#215ca2;font:16px/1.5 var(--display)}.experience-list h3{font-size:21px}.experience-list p{color:#4d6387;font-size:13px;line-height:1.6;margin-top:7px}.experience-list .experience-context{color:#3f6799;font-size:11px;font-weight:700}.tools-section{align-self:start}.tool-list li{display:flex;flex-direction:column;gap:5px;padding:18px 0;border-top:1px solid #8da9cf}.tool-list li>span{font-size:16px;font-weight:750}.tool-list small,.tools-note{font-size:12px;color:#4a648c}.tools-note{padding-top:17px;border-top:1px solid #8da9cf}.career-focus{margin-top:40px;display:grid;grid-template-columns:1fr 1.2fr;gap:40px;align-items:center;padding:32px;border:3px solid #b492e9;border-radius:12px;background:linear-gradient(#563590,#352461);box-shadow:inset 0 2px #d0afff66,0 5px #1e1640}.career-focus .section-kicker{color:#ccb1ee}.career-focus h2{font-size:32px;color:#fff0c1;text-shadow:0 3px #2d144e}.career-focus p:not(.section-kicker){color:#e0d4f6;font-size:14px;line-height:1.85;margin-bottom:18px}.career-focus .text-link{color:#f0dcff;border-color:#a580ce}.contact-panel{margin-top:40px;display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center;padding:35px;border:3px solid #ebc664;border-radius:12px;background:linear-gradient(#e9f1ff,#c7d9f2);box-shadow:0 5px #937636;color:var(--ink)}.contact-panel .section-kicker{color:#3a699f}.contact-panel h2{font-size:34px}.contact-panel p:not(.section-kicker){font-size:14px;color:#4c6385;line-height:1.8;margin-top:14px;max-width:470px}.contact-email{min-width:0;display:flex;flex-direction:column;gap:9px;padding:20px;border:2px solid #98b6db;border-radius:10px;background:#b2c8e766;box-shadow:inset 0 2px #8bafd044}.contact-email>span{font-size:10px;letter-spacing:.12em;font-weight:800;color:#4a6fa0}.contact-email a{font:clamp(19px,1.9vw,25px) var(--display);color:#1f5497;overflow-wrap:anywhere;text-decoration:underline;text-decoration-color:#7c9fc5;text-underline-offset:6px}.contact-email small{font-size:11px;color:#546f92}.not-found{width:min(700px,calc(100% - 40px));margin:15vh auto;padding:45px;text-align:center;border:4px solid #b7d4f3;border-radius:16px;background:linear-gradient(#155dc0,#12386e);box-shadow:0 7px #06294f}.not-found .hero-kicker{justify-content:center}.not-found h1{font-size:48px;color:#ffe897;text-shadow:0 4px #08234d;margin-bottom:35px}
@media(min-width:1500px){.hero-content h1{font-size:85px}.hero-grid{min-height:690px}}
@media(max-width:1100px){.wrap{width:calc(100% - 56px)}.header-inner{width:calc(100% - 40px);gap:15px}#main-nav{gap:2px}#main-nav>a{padding:9px;font-size:16px}#main-nav .ui-icon{width:23px;height:23px}#main-nav>.nav-contact{margin-left:4px}.brand>svg{width:48px}.brand>span{font-size:28px}.brand small{font-size:8px}.hero-grid{grid-template-columns:1fr 1fr;min-height:620px;gap:0}.hero-content h1{font-size:62px}.hero-description{font-size:18px}.hero-actions{gap:12px}.hero-actions .button{font-size:17px;padding:12px 17px}.hero-stage{height:440px}.deck{width:440px;height:345px}.deck-card{width:180px;height:258px}.deck-center{width:207px;height:305px;left:calc(50% - 103px)}.deck-title{font-size:16px}.deck-center .deck-title{font-size:19px}.stage-plinth{bottom:47px}.section-heading{gap:25px}.section-heading h2{font-size:25px}.ribbon{gap:13px;padding-right:25px}.ribbon-icon{width:47px;height:50px}.ribbon-icon .ui-icon{width:37px;height:37px}.section-intro{max-width:240px;font-size:13px}.about-teaser{gap:35px;padding:30px}.about-copy h2{font-size:38px}.about-main{padding:30px;gap:35px}.about-main h1{font-size:46px}.about-photo>img{height:400px}.profile-details{grid-template-columns:1.4fr 1fr;gap:24px}.experience-section,.tools-section{padding:25px}.experience-list li{grid-template-columns:85px 1fr;gap:16px}.contact-panel{gap:25px;padding:28px}.footer-inner>p{max-width:240px;text-align:center}}
@media(max-width:850px){html{scroll-padding-top:92px}.site-header{height:74px}.header-inner{width:calc(100% - 36px)}.brand>svg{width:45px;height:56px}.brand>span{font-size:28px}.menu-toggle{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:42px;height:41px;background:linear-gradient(#4baaf1,#1466be);border:2px solid #84c9fa;border-radius:8px;box-shadow:0 3px #073e86}.menu-toggle span{width:21px;height:3px;border-radius:2px;background:#e7f5ff;transition:transform .15s}.menu-open .menu-toggle span:first-child{transform:translateY(8px) rotate(45deg)}.menu-open .menu-toggle span:nth-child(2){opacity:0}.menu-open .menu-toggle span:last-child{transform:translateY(-8px) rotate(-45deg)}#main-nav{display:none;position:absolute;top:72px;inset-inline:0;padding:15px 20px;background:linear-gradient(#1959ac,#103970);border-bottom:3px solid #79a7d9;box-shadow:0 8px 12px #09274966}.menu-open #main-nav{display:grid;grid-template-columns:1fr 1fr;gap:9px}#main-nav>a{padding:11px 15px;border-color:#568cc5;background:#0b3c8399}#main-nav>.nav-contact{margin:0}body{padding-bottom:80px}.mobile-dock{position:fixed;z-index:85;inset:auto 0 0;display:grid;grid-template-columns:repeat(4,1fr);height:calc(72px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:linear-gradient(#8ba8c6,#597998 10%,#3d5979 90%,#274260);border-top:3px solid #bed9f1;box-shadow:0 -4px 12px #031d4766}.mobile-dock>a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border-right:1px solid #9bb9d255;border-left:1px solid #20395466;position:relative;font:13px var(--display);text-shadow:0 2px #17324d;color:#eaf5ff}.mobile-dock .ui-icon{width:34px;height:34px;transition:transform .2s}.mobile-dock>a[aria-current]{background:linear-gradient(#298acc,#225081);box-shadow:inset 0 3px #ffdc75}.mobile-dock>a[aria-current] .ui-icon{transform:translateY(-2px) scale(1.1)}.hero-grid{grid-template-columns:1fr;min-height:0;padding-block:38px 33px;gap:8px;text-align:center}.hero-content{order:1}.hero-kicker{justify-content:center;margin-bottom:15px}.hero-content h1{font-size:63px}.hero-content h1>span{display:inline;margin-left:12px;font-size:1em}.hero-description{font-size:18px;margin-top:22px}.hero-description br,.hero-subtitle br{display:none}.hero-subtitle{font-size:14px;margin-top:9px}.hero-actions,.hero-stats{justify-content:center}.hero-actions{margin-top:22px}.hero-stats{margin-top:22px}.hero-stage{order:0;width:470px;max-width:100%;height:335px;justify-self:center}.deck{width:415px;max-width:92%;height:280px;margin-top:23px}.deck-card{width:159px;height:217px;top:48px;border-width:4px}.deck-center{width:184px;height:259px;left:calc(50% - 92px);top:10px}.deck-title{font-size:14px;padding:30px 7px 12px}.deck-center .deck-title{font-size:17px}.stage-plinth{bottom:20px;height:42px;width:84%;left:8%}.stage-hint{display:none}.section-heading{display:block}.section-intro{max-width:none;margin:21px 0 0;font-size:14px}.ribbon{width:fit-content;max-width:calc(100% - 13px);min-height:77px}.section-heading h2{font-size:27px}.collection-toolbar{margin-top:29px}.collection-count{display:none}.filter-tabs{gap:7px}.filter-tabs button{font-size:15px;padding:9px 13px}.game-grid{gap:26px}.card-body{padding:19px}.card-body h3{font-size:25px}.card-body>p{font-size:14px}.art-showcase{grid-template-columns:1fr 1fr;gap:22px}.portrait-strip{height:440px}.illustration-feature,.drawing-feature{min-height:440px}.portrait-strip .portrait-side{display:none}.portrait-strip .portrait-main{width:100%;margin:0}.art-caption{padding-inline:19px}.art-caption h3{font-size:27px}.about-teaser{gap:25px;padding:25px;grid-template-columns:.9fr 1.2fr}.about-art{height:340px}.about-copy h2{font-size:34px}.about-copy>p:not(.section-kicker):not(.profile-role){font-size:14px}.about-copy .profile-role{font-size:15px}.profile-actions{gap:19px}.footer-inner{grid-template-columns:1fr auto}.footer-inner>p{grid-column:1/-1;grid-row:2;text-align:left;max-width:none}.footer-credit{text-align:left}.project-hero{min-height:520px}.project-hero-art{left:10%;opacity:.65}.project-hero-shade{background:linear-gradient(90deg,#0b3779ed,#103977aa 45%,#09255355),linear-gradient(0deg,#0c3270,transparent)}.project-hero-content{padding-block:30px 40px}.project-hero h1{font-size:48px}.project-hero-content>p:not(.hero-kicker){max-width:530px}.project-hero .hero-kicker{justify-content:flex-start}.project-overview{grid-template-columns:1fr;gap:15px;padding:25px}.project-overview h2{font-size:27px}.about-main{grid-template-columns:1.2fr .8fr;gap:25px;padding:25px}.about-main h1{font-size:40px}.about-main .hero-kicker{justify-content:flex-start}.about-photo>img{height:370px}.about-photo>span{font-size:9px}.profile-bio{font-size:14px}.profile-details{grid-template-columns:1fr;gap:28px}.tool-list{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.tool-list li>span{font-size:14px}.career-focus,.contact-panel{grid-template-columns:1fr;gap:20px}.contact-email{max-width:100%}.contact-email a{font-size:25px}}
@media(max-width:560px){.wrap{width:calc(100% - 36px)}body{background-size:auto,66px 66px}.header-inner{width:calc(100% - 28px)}.brand{gap:8px}.brand>svg{width:40px;height:52px}.brand>span{font-size:26px}.brand small{font-size:7px}.hero-grid{width:calc(100% - 28px);padding-top:28px;gap:5px}.hero-stage{height:302px;width:355px}.deck{width:330px;max-width:91%;height:261px}.deck-card{width:135px;height:191px;border-radius:14px 14px 19px 19px;top:53px;padding:3px}.deck-left{left:5px}.deck-right{right:5px}.deck-center{width:161px;height:235px;left:calc(50% - 80px);top:8px}.deck-image{border-radius:7px 7px 13px 13px}.deck-title{font-size:12px;padding:27px 4px 11px;border-radius:0 0 10px 10px}.deck-center .deck-title{font-size:15px}.stage-plinth{bottom:11px;left:2%;width:96%;height:43px}.hero-kicker{font-size:9px;letter-spacing:.095em;margin-bottom:12px}.hero-content h1{font-size:48px;-webkit-text-stroke-width:4px;text-shadow:0 5px #092854}.hero-content h1>span{display:block;font-size:1.15em;margin:0}.hero-description{font-size:16px;margin-top:17px;padding-inline:10px;max-width:340px;margin-inline:auto}.hero-subtitle{font-size:12px;max-width:290px;margin-inline:auto}.hero-actions{gap:11px;margin-top:23px}.hero-actions .button{font-size:17px;padding:12px 14px;min-height:49px;gap:7px}.hero-actions .ui-icon{width:23px;height:23px}.hero-stats{gap:26px;margin-top:23px}.hero-stats>span{font-size:9px;gap:6px}.hero-stats b{font-size:20px}.castle-divider{height:15px}.gallery-section{padding-block:44px 25px}.ribbon{padding:12px 17px 12px 11px;gap:12px;min-height:73px;border-width:2px}.ribbon-icon{width:39px;height:44px;border-radius:8px}.ribbon-icon .ui-icon{width:33px;height:33px}.ribbon .section-kicker{font-size:8px;letter-spacing:.1em}.section-heading h2{font-size:24px;-webkit-text-stroke-width:1px}.section-intro{font-size:14px;margin-top:19px}.collection-toolbar{margin:23px 0}.filter-tabs{gap:6px;width:100%;display:grid;grid-template-columns:1fr 1fr}.filter-tabs button{justify-content:center;font-size:15px;min-height:40px;padding:8px 10px}.filter-tabs button span{font-size:9px;width:17px;height:17px;line-height:17px}.game-grid{grid-template-columns:1fr;gap:26px}.project-card{border-radius:11px}.card-body{padding:19px 18px 16px}.card-body h3{font-size:26px}.card-body>p{font-size:14px}.card-link{font-size:12px}.card-open{display:none}.art-section{padding-block:40px 45px;margin-top:15px}.art-showcase{grid-template-columns:1fr;margin-top:29px;gap:28px}.portrait-strip{height:440px}.portrait-strip .portrait-side{display:block;width:38%}.portrait-strip .portrait-main{width:42%;margin-inline:-9%}.illustration-feature{min-height:440px}.drawing-feature{height:420px;min-height:0}.art-caption{padding:60px 20px 23px}.art-caption h3{font-size:28px}.motion-section{padding-block:42px 36px}.motion-grid{grid-template-columns:1fr;gap:28px;margin-top:28px}.motion-caption{padding:16px 14px;gap:10px}.motion-caption h3{font-size:24px}.motion-caption .ui-icon{width:28px;height:28px}.motion-caption p{font-size:14px}.motion-caption>span{font-size:10px}.motion-note{font-size:14px;line-height:1.8;text-align:left}.about-teaser{margin-block:44px;grid-template-columns:1fr;gap:27px;padding:23px 20px;border-width:3px}.about-art{height:270px}.about-copy h2{font-size:36px}.about-copy .section-kicker{font-size:9px}.profile-role{font-size:16px}.about-copy .profile-actions{gap:20px;margin-top:23px}.about-copy .button{font-size:18px;padding:11px 17px}.text-link{font-size:12px;gap:10px}.site-footer{padding-block:24px 22px}.footer-brand>svg{width:33px;height:40px}.footer-brand>span{font-size:23px}.footer-inner>p{font-size:12px}.footer-email{font-size:14px;gap:5px}.footer-email .ui-icon{width:23px;height:23px}.footer-credit{font-size:11px}.project-hero{min-height:540px}.project-hero-art{inset:0;opacity:.68}.project-hero-art img{object-position:58% center}.project-hero-shade{background:linear-gradient(0deg,#092f69 3%,#0c3479ed 33%,#102e6777 70%,#122b6388)}.project-hero-content{padding-top:23px}.back-link{font-size:11px;margin-bottom:115px;padding:4px 10px}.project-hero .hero-kicker{font-size:9px}.project-hero h1{font-size:38px;-webkit-text-stroke-width:2px;line-height:1.12;margin-bottom:15px}.project-hero-content>p:not(.hero-kicker){font-size:13px;line-height:1.75}.project-tags{gap:6px;margin-top:18px}.project-tags span{font-size:10px;padding:4px 8px}.project-overview{margin-top:28px;padding:21px;gap:12px}.project-overview h2{font-size:25px}.project-overview div>p{font-size:13px;line-height:1.9}.project-section{padding-top:38px}.project-section-heading{gap:13px;margin-bottom:20px;align-items:flex-start}.project-section-heading>span{width:40px;height:46px;font-size:22px;border-width:2px}.project-section h2{font-size:25px}.project-section-heading p{font-size:12px;margin-top:7px}.artwork-grid{grid-template-columns:1fr;gap:22px}.adaptation-grid .artwork:nth-child(2){width:80%;max-width:340px}.artwork{padding:4px}.next-project{padding-block:44px}.next-project>a{padding:20px;gap:15px;align-items:flex-start}.next-project h2{font-size:27px;margin:8px 0 14px}.next-project .eyebrow{font-size:8px}.next-project img{width:32%;min-height:110px}.about-page{padding-block:28px 45px}.about-main{display:flex;flex-direction:column-reverse;padding:23px 20px;gap:27px;border-width:3px}.about-main>div{width:100%}.about-photo>img{height:270px;object-position:40% center}.about-photo>span{padding:10px 6px;font-size:10px}.about-main h1{font-size:40px}.about-main .hero-kicker{font-size:9px}.profile-bio{font-size:14px;margin-top:20px}.profile-actions .button{font-size:18px;padding:12px 18px}.profile-details{padding-top:29px;gap:28px}.experience-section,.tools-section{padding:23px 20px}.profile-details h2{font-size:28px}.experience-list{margin-top:20px}.experience-list li{grid-template-columns:1fr;gap:9px;padding:20px 0}.experience-period{font-size:15px}.experience-list h3{font-size:22px}.experience-list p{font-size:12px}.tool-list{display:block;margin-top:20px}.tool-list li>span{font-size:15px}.career-focus,.contact-panel{margin-top:28px;padding:25px 21px;gap:19px}.career-focus h2,.contact-panel h2{font-size:30px}.career-focus p:not(.section-kicker),.contact-panel p:not(.section-kicker){font-size:13px}.contact-email{padding:16px 14px;gap:8px}.contact-email a{font-size:22px}.not-found{margin-block:12vh;padding:35px 20px}.not-found h1{font-size:37px}}
@media(max-width:360px){.hero-actions .button{font-size:15px;padding:11px 12px}.hero-actions .ui-icon{width:20px}.hero-content h1{font-size:44px}.hero-stage{height:280px}.deck{transform:scale(.92);transform-origin:top center}.stage-plinth{bottom:11px}.ribbon-icon{display:none}.section-heading h2{font-size:24px}.contact-email a{font-size:19px}}
/* Swipeable featured deck. Cards retain their project links at every position. */
.carousel-stage{height:auto;display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-content:center;--deck-width:280px;--deck-height:408px;--deck-top:18px;--side-y:48px;--side-scale:.87}
.deck-scene{position:relative;height:490px;min-width:0;isolation:isolate}
.carousel-stage .stage-plinth{bottom:2px;pointer-events:none;z-index:2}

.carousel-stage .deck{touch-action:pan-y pinch-zoom;user-select:none;-webkit-user-select:none;cursor:grab;transform:none;max-width:92%;margin-top:0;z-index:3}
.carousel-stage .deck-card{left:50%;right:auto;top:var(--deck-top);width:var(--deck-width);height:var(--deck-height);transform:translate3d(-50%,0,0) rotate(-3deg);transform-origin:50% 50%;transition:none;cursor:inherit;z-index:3;-webkit-user-drag:none;will-change:transform,opacity;backface-visibility:hidden;-webkit-touch-callout:none}
.carousel-stage .deck-card img{-webkit-user-drag:none;pointer-events:none}
.carousel-stage .deck-card[data-slot=left]{transform:translate3d(-105%,var(--side-y),0) rotate(-16deg) scale(var(--side-scale));z-index:2}
.carousel-stage .deck-card[data-slot=right]{transform:translate3d(5%,var(--side-y),0) rotate(16deg) scale(var(--side-scale));z-index:2}
.carousel-stage .deck-card[data-slot^=off]{opacity:0;visibility:hidden;pointer-events:none;z-index:0}
@media(hover:hover) and (pointer:fine){.carousel-stage .deck-card:hover{filter:brightness(1.06)}}
.carousel-stage .deck-card:focus-visible{outline:3px solid #fff9b2;outline-offset:5px}
.carousel-stage .deck.is-dragging{cursor:grabbing}
.carousel-stage .is-dragging .deck-card{transition:none;filter:none}
.deck-controls{position:relative;z-index:8;display:flex;align-items:center;justify-content:center;gap:22px;min-height:50px;padding-bottom:6px;isolation:isolate}
.deck-controls button{appearance:none;-webkit-appearance:none;flex:0 0 50px;width:50px;height:46px;display:grid;place-items:center;padding:0;border-radius:10px;border:2px solid #fff09a;background:linear-gradient(#ffe572,#ffc32e 55%,#f5aa14);box-shadow:0 4px #a96812,0 5px 0 2px #092e59;transition:transform .15s,filter .15s;touch-action:manipulation}
.deck-controls button:hover{filter:brightness(1.1)}
.deck-controls button:active{transform:translateY(3px)}
.deck-controls svg{width:23px;height:23px;fill:none;stroke:#633e12;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
.deck-counter{display:flex;align-items:center;justify-content:center;gap:9px;min-width:79px;font:20px var(--display);color:#bddcff;text-shadow:0 2px #07264d;font-variant-numeric:tabular-nums}
.deck-counter b{font-weight:400;color:#ffdf79;font-size:25px}.deck-counter>span{opacity:.6}
.carousel-stage .stage-hint{display:block;position:static;bottom:auto;font-size:12px;line-height:1.5;pointer-events:none;margin-top:-4px}
.deck-announcement{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@media(max-width:1100px){.carousel-stage{--deck-width:240px;--deck-height:353px}.deck-scene{height:440px}}
@media(max-width:850px){.carousel-stage{--deck-width:222px;--deck-height:315px;--deck-top:10px;--side-y:35px}.deck-scene{height:374px}.hero-grid{grid-template-columns:minmax(0,1fr);row-gap:24px}.hero-content{min-width:0}}
@media(max-width:560px){.carousel-stage{--deck-width:190px;--deck-height:277px;--deck-top:8px;--side-y:35px;--side-scale:.83;gap:14px}.deck-scene{height:327px}.hero-grid{row-gap:24px}}
@media(max-width:360px){.carousel-stage{--deck-width:172px;--deck-height:251px;--side-y:32px}.deck-scene{height:299px}}
/* The artwork continues beneath the existing translucent display edges.
   The matte casing and corner bevel sit above a separate soft cast shadow. */
:root{--display-bevel-width:11px}
@media(max-width:850px){:root{--display-bevel-width:9px}}
@media(max-width:560px){:root{--display-bevel-width:8px}}
.carousel-stage .deck-card{--frame-inset:5px;--bevel-width:var(--display-bevel-width);--face-radius:16px;--casing-outset:4px;--casing-bevel:4px;--casing-radius:25px;border:0;padding:0;border-radius:21px;background:none;box-shadow:none;isolation:isolate}
/* Build outward from the existing artwork window, preserving its crop and size. */
.carousel-stage .deck-card:before,.carousel-stage .deck-card:after{
 content:'';position:absolute;inset:calc(-1 * var(--casing-outset));border-radius:var(--casing-radius);pointer-events:none
}
.carousel-stage .deck-card:before{
 --corner-light:calc(var(--casing-radius) * .32);--corner-reach:calc(var(--casing-radius) * .5467);z-index:-1;border:var(--casing-bevel) solid transparent;
 background:linear-gradient(135deg,#503480,#39245e 40%,#472d73) padding-box,
  radial-gradient(ellipse var(--corner-reach) var(--corner-reach) at var(--corner-light) var(--corner-light),#decaf7 0% 43%,#b497df 46% 61%,transparent 65%) border-box,
  radial-gradient(ellipse var(--corner-reach) var(--corner-reach) at calc(100% - var(--corner-light)) var(--corner-light),#d4bbed 0% 43%,#a68bd3 46% 61%,transparent 65%) border-box,
  radial-gradient(ellipse var(--corner-reach) var(--corner-reach) at var(--corner-light) calc(100% - var(--corner-light)),#e0cdf9 0% 43%,#b99ae2 46% 61%,transparent 65%) border-box,
  radial-gradient(ellipse var(--corner-reach) var(--corner-reach) at calc(100% - var(--corner-light)) calc(100% - var(--corner-light)),#e0cdf9 0% 43%,#b99ae2 46% 61%,transparent 65%) border-box,
  conic-gradient(from 0deg,#9370cb 0deg,#a585d9 45deg,#b59ae4 90deg,#906bc6 135deg,#674593 180deg,#7956aa 225deg,#8a66bf 270deg,#906ccb 315deg,#9370cb 360deg) border-box
}
.carousel-stage .deck-card:after{
 z-index:-2;
 box-shadow:0 2px 5px #04092599,4px calc(9px + (1 - var(--card-depth)) * 6px) 21px #07133ab3
}
/* A narrow highlight sits on each corner above the broader lit bevel. */
.deck-corner-glints{
 --glint-position:calc(var(--casing-radius) * .32);--glint-reach:calc(var(--casing-radius) * .30);
 position:absolute;inset:calc(.5px - var(--casing-outset));z-index:3;padding:.65px;border-radius:calc(var(--casing-radius) - .5px);pointer-events:none;
 background:
  radial-gradient(ellipse var(--glint-reach) var(--glint-reach) at var(--glint-position) var(--glint-position),#f5ebff 0% 58%,transparent 64%),
  radial-gradient(ellipse var(--glint-reach) var(--glint-reach) at calc(100% - var(--glint-position)) var(--glint-position),#eee2fc 0% 58%,transparent 64%),
  radial-gradient(ellipse var(--glint-reach) var(--glint-reach) at var(--glint-position) calc(100% - var(--glint-position)),#f3e8ff 0% 58%,transparent 64%),
  radial-gradient(ellipse var(--glint-reach) var(--glint-reach) at calc(100% - var(--glint-position)) calc(100% - var(--glint-position)),#f3e8ff 0% 58%,transparent 64%);
 -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude
}
/* The right backing uses the same bevel and highlight shapes in bright blue. */
.carousel-stage .deck-card.deck-right:before{
 background:linear-gradient(135deg,#236bb7,#194f92 40%,#205ea6) padding-box,
  radial-gradient(ellipse var(--corner-reach) var(--corner-reach) at var(--corner-light) var(--corner-light),#d3f2ff 0% 43%,#97d5f7 46% 61%,transparent 65%) border-box,
  radial-gradient(ellipse var(--corner-reach) var(--corner-reach) at calc(100% - var(--corner-light)) var(--corner-light),#c5eaff 0% 43%,#86c7ed 46% 61%,transparent 65%) border-box,
  radial-gradient(ellipse var(--corner-reach) var(--corner-reach) at var(--corner-light) calc(100% - var(--corner-light)),#daf5ff 0% 43%,#a1dcfa 46% 61%,transparent 65%) border-box,
  radial-gradient(ellipse var(--corner-reach) var(--corner-reach) at calc(100% - var(--corner-light)) calc(100% - var(--corner-light)),#daf5ff 0% 43%,#a1dcfa 46% 61%,transparent 65%) border-box,
  conic-gradient(from 0deg,#59b6f4 0deg,#72ccff 45deg,#96e0ff 90deg,#58b1f0 135deg,#3486c8 180deg,#459cdd 225deg,#50aceb 270deg,#57b3f1 315deg,#59b6f4 360deg) border-box
}
.carousel-stage .deck-right .deck-corner-glints{
 background:
  radial-gradient(ellipse var(--glint-reach) var(--glint-reach) at var(--glint-position) var(--glint-position),#f3fcff 0% 58%,transparent 64%),
  radial-gradient(ellipse var(--glint-reach) var(--glint-reach) at calc(100% - var(--glint-position)) var(--glint-position),#eaf8ff 0% 58%,transparent 64%),
  radial-gradient(ellipse var(--glint-reach) var(--glint-reach) at var(--glint-position) calc(100% - var(--glint-position)),#effbff 0% 58%,transparent 64%),
  radial-gradient(ellipse var(--glint-reach) var(--glint-reach) at calc(100% - var(--glint-position)) calc(100% - var(--glint-position)),#effbff 0% 58%,transparent 64%)
}
/* The front card retains its bright gold bevel and darker gold face.
   All gradient stops, corner sizes and casing geometry match the purple backing. */
.carousel-stage .deck-card.deck-center:before{
 background:linear-gradient(135deg,#b48328,#9e701f 40%,#ad7a22) padding-box,
  radial-gradient(ellipse var(--corner-reach) var(--corner-reach) at var(--corner-light) var(--corner-light),#fff0b3 0% 43%,#ebc65d 46% 61%,transparent 65%) border-box,
  radial-gradient(ellipse var(--corner-reach) var(--corner-reach) at calc(100% - var(--corner-light)) var(--corner-light),#ffeaa1 0% 43%,#e4bb51 46% 61%,transparent 65%) border-box,
  radial-gradient(ellipse var(--corner-reach) var(--corner-reach) at var(--corner-light) calc(100% - var(--corner-light)),#fff0ad 0% 43%,#ebc459 46% 61%,transparent 65%) border-box,
  radial-gradient(ellipse var(--corner-reach) var(--corner-reach) at calc(100% - var(--corner-light)) calc(100% - var(--corner-light)),#fff0ad 0% 43%,#ebc459 46% 61%,transparent 65%) border-box,
  conic-gradient(from 0deg,#edc354 0deg,#f4d26f 45deg,#ffdf81 90deg,#ecc659 135deg,#d4a034 180deg,#dfaf3e 225deg,#edbf4e 270deg,#ebc057 315deg,#edc354 360deg) border-box
}
.carousel-stage .deck-center .deck-corner-glints{
 background:
  radial-gradient(ellipse var(--glint-reach) var(--glint-reach) at var(--glint-position) var(--glint-position),#fff9d9 0% 58%,transparent 64%),
  radial-gradient(ellipse var(--glint-reach) var(--glint-reach) at calc(100% - var(--glint-position)) var(--glint-position),#fff6cb 0% 58%,transparent 64%),
  radial-gradient(ellipse var(--glint-reach) var(--glint-reach) at var(--glint-position) calc(100% - var(--glint-position)),#fff8d1 0% 58%,transparent 64%),
  radial-gradient(ellipse var(--glint-reach) var(--glint-reach) at calc(100% - var(--glint-position)) calc(100% - var(--glint-position)),#fff8d1 0% 58%,transparent 64%)
}
.carousel-stage .deck-image{position:absolute;inset:var(--frame-inset);height:auto;border:0;border-radius:var(--face-radius);background:#123955;overflow:hidden}
.carousel-stage .deck-image img{object-position:center;filter:saturate(calc(1 - var(--card-depth) * .25)) contrast(calc(1 - var(--card-depth) * .14)) brightness(calc(1 - var(--card-depth) * .1))}
.carousel-stage .deck-card[href="/projects/drawing/"] .deck-art{object-position:62% center;transform:translateY(var(--bevel-width))}
/* Crisp translucent planes meet the artwork without an inner stroke.
   The left plane is cool grey; NE and SW catch localized reflections. */
.carousel-stage .deck-image:before,
:is(.card-image,.artwork-button,.illustration-feature,.drawing-feature,.video-frame,.vfx-thumb):before{
 content:'';position:absolute;inset:0;z-index:2;padding:var(--bevel-width);border-radius:inherit;pointer-events:none;
 background:
  radial-gradient(ellipse calc(var(--face-radius) + 4px) calc(var(--face-radius) + 6px) at 4px calc(100% - 4px),#f6fbffbf 0,#e7f1ff66 30%,#c8dce51a 64%,transparent 100%),
  radial-gradient(ellipse calc(var(--face-radius) + 4px) calc(var(--face-radius) + 6px) at 4px 4px,#edf5ff73 0,#dae6f033 34%,transparent 100%),
  radial-gradient(ellipse 62% 12px at 0 100%,#e4efff47 0,#cedfe822 36%,transparent 100%),
  var(--deck-bottom-light,linear-gradient(90deg,#c5cbd161 0,#b1bcc352 calc(100% - var(--face-radius) - 8px),#8b98a647 calc(100% - var(--face-radius)),#7885901a 100%)) left bottom/var(--deck-bottom-span,100%) var(--bevel-width) no-repeat,
  var(--deck-left-light,linear-gradient(90deg,#aebdce80 0,#8295a675 20%,#71839670 calc(100% - .25px),transparent 100%)) left/var(--bevel-width) 100% no-repeat,
  var(--deck-top-light,linear-gradient(180deg,#fff 0,#fff 45%,#f7f9fc calc(100% - .7px),transparent 100%)) top/100% var(--bevel-width) no-repeat;
 box-shadow:inset 0 .6px 1px #ffffff59,inset .5px 0 1px #e4eef029;
 -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;transform:translateZ(0);backface-visibility:hidden
}
/* The right plane catches more light than the left. */
.deck-side,:is(.card-image,.artwork-button,.illustration-feature,.drawing-feature,.video-frame,.vfx-thumb):after{
 position:absolute;inset:0;z-index:2;padding:var(--bevel-width);border-radius:inherit;pointer-events:none;
 background:
  var(--deck-facet-nw,linear-gradient(transparent,transparent)) left top/var(--bevel-width) var(--bevel-width) no-repeat,
  var(--deck-facet-ne,linear-gradient(transparent,transparent)) right top/var(--bevel-width) var(--bevel-width) no-repeat,
  var(--deck-facet-sw,linear-gradient(transparent,transparent)) left bottom/var(--bevel-width) var(--bevel-width) no-repeat,
  var(--deck-corner-facet,linear-gradient(transparent,transparent)) right bottom/var(--bevel-width) var(--bevel-width) no-repeat,
  radial-gradient(ellipse calc(var(--face-radius) + 4px) calc(var(--face-radius) + 6px) at calc(100% - 4px) 4px,#f6fbffcc 0,#e7f1ff70 30%,#c8dce522 64%,transparent 100%),
  var(--deck-right-light,linear-gradient(180deg,#d3deeb7a 0,#c6d1df70 calc(100% - var(--face-radius) - 4px),#85929e40 calc(100% - var(--bevel-width)),#68758014 100%)) right top/var(--bevel-width) var(--deck-right-span,100%) no-repeat,
  var(--deck-corner-light,linear-gradient(transparent,transparent)) right bottom/var(--face-radius) var(--face-radius) no-repeat;
 -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;transform:translateZ(0);backface-visibility:hidden
}
/* Shared corner facets for the deck and homepage image/video frames. */
.carousel-stage .deck-card,
.project-card .card-image,
.art-showcase :is(.illustration-feature,.drawing-feature),
.vfx-player .video-frame,
.vfx-choice .vfx-thumb{
 --deck-bottom-span:calc(100% - var(--face-radius));
 --deck-right-span:calc(100% - var(--face-radius));
 --deck-bottom-light:linear-gradient(90deg,#c5cbd161 0,#b1bcc352 calc(100% - 8px));
 --deck-right-light:linear-gradient(180deg,#d3deeb7a 0,#c6d1df70 calc(100% - 4px));
 --deck-corner-light:conic-gradient(from 90deg at 0 0,#c6d1df70 0deg,#b1bcc352 90deg);
 --deck-facet-nw:linear-gradient(135deg,#edf5ff00 0 50%,#edf5ff8c 50%);
 --deck-facet-ne:linear-gradient(45deg,#d8eaff66 0 50%,#d8eaff00 50%);
 --deck-facet-sw:linear-gradient(45deg,#a4c0df00 0 50%,#a4c0df47 50%);
 --deck-corner-facet:linear-gradient(135deg,#32597a33 0 50%,#32597a00 50%)
}
/* Each artwork keeps its own color as it moves through the carousel. */
.carousel-stage .deck-card{
 --tint-rgb:24 192 247;--tint-light-rgb:103 231 255;
 /* Keep the shared translucent bottom edge and corner on matching light values.
    A separate dark strip or facet leaves a visible patch at their junction. */
 --deck-corner-facet:linear-gradient(transparent,transparent);
}
.carousel-stage [data-project="water-margin"]{--tint-rgb:255 198 54;--tint-light-rgb:255 232 125}
.carousel-stage [data-project="dogs"]{--tint-rgb:13 177 163;--tint-light-rgb:100 235 200}
.carousel-stage [data-project="mahjong"]{--tint-rgb:255 209 55;--tint-light-rgb:255 243 137}
.carousel-stage [data-project="table-ui"]{--tint-rgb:199 102 238;--tint-light-rgb:245 176 245}
.carousel-stage [data-project="drawing"]{--tint-rgb:117 76 49;--tint-light-rgb:167 119 81}
.carousel-stage [data-project="pirate"]{--tint-rgb:93 104 245;--tint-light-rgb:165 154 255}
.carousel-stage [data-project="unity-vfx"]{--tint-rgb:93 104 245;--tint-light-rgb:165 154 255;--tint-top:61%}
.carousel-stage .deck-image{isolation:isolate}
.deck-tint{position:absolute;inset:var(--tint-top,64%) 0 0;border-radius:0 0 var(--face-radius) var(--face-radius);pointer-events:none}
.deck-tint:before,.deck-tint:after{content:'';position:absolute;inset:0;z-index:1;border-radius:inherit}
.deck-tint:before{mix-blend-mode:color;background:linear-gradient(180deg,rgb(var(--tint-rgb)/0),rgb(var(--tint-rgb)/.18) 24%,rgb(var(--tint-rgb)/.6) 60%,rgb(var(--tint-rgb)/.9))}
.deck-tint:after{background:linear-gradient(180deg,rgb(var(--tint-rgb)/0),rgb(var(--tint-rgb)/.04) 20%,rgb(var(--tint-rgb)/.25) 45%,rgb(var(--tint-rgb)/.64) 73%,rgb(var(--tint-light-rgb)/.9))}
.carousel-stage [data-project="drawing"] .deck-tint:before{background:none}
.carousel-stage [data-project="drawing"] .deck-tint:after{background:linear-gradient(180deg,rgb(var(--tint-rgb)/0),rgb(var(--tint-rgb)/.04) 22%,rgb(var(--tint-rgb)/.2) 48%,rgb(var(--tint-rgb)/.4) 75%,rgb(var(--tint-light-rgb)/.6))}
.carousel-stage .deck-card .deck-title{inset:auto 0 0;z-index:1;padding:9px 10px 16px;border-radius:0;background:none;color:#fffaf0;font:19px/1.16 var(--display);letter-spacing:.01em;-webkit-text-stroke:.55px #11213dd9;paint-order:stroke fill;text-shadow:0 2px 1px #0a183bba;pointer-events:none}
.carousel-stage .stage-plinth:after{content:'';position:absolute;inset:0 8% auto;height:42%;background:radial-gradient(ellipse at 50% 40%,#03142699, #03142644 42%,transparent 72%);pointer-events:none}
@media(max-width:850px){.carousel-stage .deck-card{--frame-inset:4px;--face-radius:14px;--casing-outset:3px;--casing-bevel:3px;--casing-radius:21px;border-radius:18px}.carousel-stage .deck-card .deck-title{font-size:17px;padding:8px 9px 15px}}
@media(max-width:560px){.carousel-stage .deck-card{--face-radius:12px;--casing-radius:19px;border-radius:16px}.carousel-stage .deck-card .deck-title{font-size:15px;padding:7px 8px 14px}}
/* Cool atmospheric depth, with a separate rim so the artwork stays clear. */
.deck-depth{position:absolute;inset:calc(-1 * var(--casing-outset));z-index:4;border-radius:var(--casing-radius);background:#285b82;opacity:calc(var(--card-depth) * .2);pointer-events:none}
.deck-rim{position:absolute;inset:calc(-1 * var(--casing-outset));z-index:5;border-radius:var(--casing-radius);opacity:var(--rim-strength);pointer-events:none}
.deck-rim *{position:absolute;inset:0;border-radius:inherit;pointer-events:none}
/* The breath adds light only; the casing material remains steady. */
.deck-rim-light{-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.deck-rim-light{padding:1px;background:radial-gradient(ellipse 30px 34px at 0 100%,#d7efff55,transparent),linear-gradient(135deg,#ffffff99 0%,#f5fbff66 20%,#c1dfef33 39%,transparent 68%);opacity:.55;animation:rim-highlight-breathe 3.8s ease-in-out -1.1s infinite}
.deck-rim-aura{inset:-16px;-webkit-mask-image:linear-gradient(135deg,#000 0%,#000 38%,#0008 62%,transparent 83%);mask-image:linear-gradient(135deg,#000 0%,#000 38%,#0008 62%,transparent 83%);opacity:.35;animation:rim-aura-breathe 3.8s ease-in-out -1.1s infinite}
.deck-rim-aura:before{content:'';position:absolute;inset:16px;border-radius:inherit;box-shadow:0 0 3px #f3fcff80,0 0 8px 1px #b4def34d,0 0 14px 2px #80b6d11f;pointer-events:none}
.deck-rim-aura,.deck-rim-light{animation-play-state:paused}
.carousel-stage[data-effects-running=true] .deck-card[data-illuminated=true] :is(.deck-rim-aura,.deck-rim-light){animation-play-state:running}
@keyframes rim-highlight-breathe{0%,100%{opacity:.16}45%,58%{opacity:.95}}
@keyframes rim-aura-breathe{0%,100%{opacity:.08}45%,58%{opacity:.72}}
/* Local, compositor-friendly atmosphere; the controls are outside this layer. */
.deck-atmosphere{position:absolute;inset:0;z-index:1;overflow:hidden;contain:paint;pointer-events:none;--rise:-260px;--rise-mid:-130px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent),linear-gradient(transparent,#000 8%,#000 82%,transparent);mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent),linear-gradient(transparent,#000 8%,#000 82%,transparent);-webkit-mask-composite:source-in;mask-composite:intersect}
.deck-atmosphere *{position:absolute;display:block;pointer-events:none}
.fx-halo{inset:-6% -8% 0;opacity:.76;background:radial-gradient(ellipse 38% 46% at 28% 30%,#6336e899 0,#442bd17a 35%,#343cbd33 65%,transparent 95%),radial-gradient(ellipse 42% 50% at 72% 43%,#4846ee80 0,#2851de44 50%,transparent 95%);transform-origin:50% 60%;animation:deck-breathe 6.4s ease-in-out infinite}
.fx-base-glow{inset:10% -8% 4%;opacity:.68;background:radial-gradient(ellipse 22% 36% at 20% 76%,#a5f6ffcc 0,#41d7ffb3 12%,#078df18c 40%,#2458e83d 65%,transparent 95%),radial-gradient(ellipse 25% 44% at 80% 66%,#82edffb3 0,#33bbffa3 12%,#345af080 40%,#5335db3d 65%,transparent 95%),radial-gradient(ellipse 54% 48% at 50% 76%,#80e9ff66 0,#13bbf970 38%,#3657e526 70%,transparent 100%);transform-origin:50% 72%;animation:deck-base-breathe 6.8s ease-in-out -1.6s infinite}
.fx-shaft{left:var(--beam-x);bottom:14%;width:var(--beam-width);height:var(--beam-height);background:linear-gradient(0deg,transparent,#44dfff80 18%,#4c9cff60 50%,#8169ff22 78%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 48%,transparent);mask-image:linear-gradient(90deg,transparent,#000 48%,transparent);transform-origin:50% 100%;opacity:0;animation:deck-shaft var(--duration) ease-in-out var(--delay) infinite}
.fx-mote{--mote-color:#94edff;--mote-peak:.94;left:var(--x);top:var(--y);width:var(--size);height:var(--size);border-radius:50%;background:radial-gradient(circle,#f1ffff 0 26%,var(--mote-color) 45%,transparent 74%);box-shadow:0 0 2px #94edff,0 0 7px 1px #59cfff80;opacity:0;animation:deck-mote var(--duration) ease-in-out var(--delay) infinite}
.fx-mote-cyan{--mote-color:#41e5ff;--mote-peak:.82;box-shadow:0 0 2px #41e5ff,0 0 8px 1px #1dcfff80}
.fx-mote-violet{--mote-color:#a89bff;--mote-peak:.78;box-shadow:0 0 2px #a89bff,0 0 8px 1px #7957ff80}
.fx-mote-soft{--mote-peak:.58;background:radial-gradient(circle,#a094ffbb 0,#795aff66 32%,transparent 74%);box-shadow:0 0 9px #6751ff44;filter:blur(.45px)}
.fx-star,.fx-burst{width:5px;height:5px;border-radius:50%;background:radial-gradient(circle,#efffff 0 14%,#7cddff 35%,transparent 74%);box-shadow:0 0 6px #48bfff77;opacity:0}
.fx-star-left{left:18%;top:24%;animation:deck-twinkle 6.7s ease-in-out -2s infinite}
.fx-star-right{right:16%;top:19%;width:4px;height:4px;animation:deck-twinkle 8.3s ease-in-out -5.4s infinite}
.fx-selection-glow{inset:8% -6% 4%;opacity:0;background:radial-gradient(ellipse 54% 48% at 50% 70%,#bcf8ff99 0,#52daff99 26%,#238bf077 50%,#166ce822 76%,transparent 100%);transform-origin:50% 72%}
.fx-burst-1{left:10%;top:70%}.fx-burst-2{right:11%;top:64%;width:4px;height:4px}.fx-burst-3{right:21%;top:17%;width:3px;height:3px}
.deck-atmosphere [class^=fx-]{animation-play-state:paused}
.deck-atmosphere[data-running=true] [class^=fx-]{animation-play-state:running}
@keyframes deck-breathe{0%,100%{opacity:.68;transform:scale(.985)}50%{opacity:.84;transform:scale(1.015)}}
@keyframes deck-base-breathe{0%,100%{opacity:.58;transform:scale(.985)}50%{opacity:.78;transform:scale(1.025)}}
@keyframes deck-shaft{0%,100%{opacity:.04;transform:translateX(-50%) rotate(var(--beam-angle)) scaleY(.94)}46%,58%{opacity:.48;transform:translateX(-50%) rotate(var(--beam-angle)) scaleY(1.025)}}
@keyframes deck-mote{0%,14%{opacity:0;transform:translate3d(0,6px,0) scale(.72)}26%{opacity:calc(var(--mote-peak) * .4)}38%{opacity:var(--mote-peak);transform:translate3d(calc(var(--drift) * .4),calc(var(--lift) * -.4),0) scale(1)}49%{opacity:calc(var(--mote-peak) * .3)}60%{opacity:calc(var(--mote-peak) * .65)}78%,100%{opacity:0;transform:translate3d(var(--drift),calc(var(--lift) * -1),0) scale(.8)}}
@keyframes deck-twinkle{0%,58%,77%,100%{opacity:0;transform:scale(.35) rotate(-10deg)}67%{opacity:.85;transform:scale(1) rotate(10deg)}}
@media(max-width:850px){.deck-atmosphere{--rise:-205px;--rise-mid:-103px}}
@media(max-width:560px){.deck-atmosphere{--rise:-180px;--rise-mid:-90px}.deck-atmosphere .fx-extra{display:none}.fx-star{width:4px;height:4px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}.deck-atmosphere .fx-mote,.deck-atmosphere .fx-star,.deck-atmosphere .fx-burst,.deck-atmosphere .fx-selection-glow{display:none}}
/* Keep media save/drag gestures separate from normal page navigation and text. */
img,video,[data-media-surface],[data-full],.lightbox-stage,.video-frame,.about-art,.about-photo{
  -webkit-touch-callout:none;
  -webkit-user-drag:none;
  -webkit-user-select:none;
  user-select:none;
}
video::-webkit-media-controls-download-button{display:none}

/* This landscape thumbnail needs a higher crop than the portrait gallery art. */
.project-card.theme-water .card-image img{object-position:50% 28%}
/* Keep both eyes, the mouth and chin inside the landscape drawing cover. */
.project-card.theme-drawing .card-image img{object-position:50% 32%}
/* Keep the flute player's face above or beside the project title. */
.theme-water .project-hero-art{inset:0 0 0 36%;opacity:1;overflow:hidden}
.theme-water .project-hero-art img{object-position:50% 2%;opacity:.6;transform:scale(1.065)}
.theme-water .project-hero h1{max-width:52%}
.theme-water .project-hero-content>p:not(.hero-kicker){max-width:44%}
.theme-water .project-hero-shade{background:linear-gradient(90deg,#0a3771 0%,#0a3771 37%,#103b78e8 43%,#123d7860 60%,#05214612 82%),linear-gradient(0deg,#082955d9,#0a3771a8 80%)}
@media(max-width:700px){
  .theme-water .project-hero{min-height:590px}
  .theme-water .project-hero-art{inset:0}
  .theme-water .project-hero-shade{background:linear-gradient(180deg,#0a3771ad 0%,#0a3771b3 30%,#0a326acc 50%,#092f69f5 75%,#092f69 100%)}
  .theme-water .back-link{margin-bottom:clamp(200px,42vw,280px)}
  .theme-water .project-hero h1,.theme-water .project-hero-content>p:not(.hero-kicker){max-width:100%}
}

/* The table-interface detail cover uses the purple salon as a background. */
.project-page.theme-table .project-hero{background:#24113d;border-bottom-color:#c6a25c}
.project-page.theme-table .project-hero-art{inset:0;opacity:1}
.project-page.theme-table .project-hero-art img{opacity:1;object-position:50% 48%;transform:scale(1.04)}
.project-page.theme-table .project-hero-shade{background:linear-gradient(90deg,#2b163ff5 0%,#341a4ce8 27%,#442150aa 48%,#431d4138 75%,#31193f38 100%),linear-gradient(0deg,#24113d 0%,#311846cc 15%,#3a204700 62%)}
@media(max-width:850px){
  .project-page.theme-table .project-hero-art img{object-position:68% 48%}
  .project-page.theme-table .project-hero-shade{background:linear-gradient(90deg,#311b4588 0%,#42214a33 50%,#42214a00 80%),linear-gradient(180deg,#37204255 0%,#40204344 20%,#3a2247b3 44%,#2d1745ed 72%,#24113d 100%)}
}
@media(max-width:560px){
  .project-page.theme-table .project-hero-art{top:-70px}
  .project-page.theme-table .project-hero-art img{object-position:76% center}
}

/* Independent portrait windows preserve each face at every breakpoint. */
.illustration-feature .portrait-strip{display:grid;position:absolute;inset:0;grid-template-columns:30% 40% 30%;height:100%}
.portrait-panel{display:block;position:relative;min-width:0;height:100%;overflow:hidden}
.illustration-feature .portrait-strip img{display:block;width:100%;height:100%;margin:0;object-fit:cover;box-shadow:none;transition:filter .25s}
.portrait-left img{object-position:40% center}.portrait-center img{object-position:50% center}.portrait-right img{object-position:40% center}
.illustration-feature:hover .portrait-panel img{transform:none;filter:brightness(1.035)}
.illustration-feature .feature-badge{top:12px;padding:7px 11px;font-size:11px}
@media(max-width:360px){.illustration-feature .feature-badge{font-size:10px;padding:6px 10px}.illustration-feature .art-caption{padding-top:42px}}

/* Effect studies share one full-frame player and a touch-scroll selection rail. */
.carousel-stage .deck-video-label{display:flex;align-items:center;justify-content:center;gap:5px;margin-bottom:7px;color:#f4f6ff;font:700 9px/1.4 var(--body);letter-spacing:.08em;-webkit-text-stroke:0;text-shadow:0 1px 2px #111e49}
.deck-video-label svg{width:19px;height:19px;border:1px solid #e7eaff;border-radius:50%;background:#1b245144}
/* Three representative studies share the existing VFX card and footer. */
.carousel-stage .deck-vfx .deck-image{display:grid;grid-template-rows:minmax(0,1fr) auto;background:#0b111d}
.carousel-stage .deck-card.deck-vfx .deck-title{position:relative;inset:auto}
.deck-vfx-previews{display:grid;grid-template-rows:3.5fr 2.7fr 3.8fr;min-height:0;background:#0b111d;isolation:isolate;filter:saturate(calc(1 - var(--card-depth) * .25)) contrast(calc(1 - var(--card-depth) * .14)) brightness(calc(1 - var(--card-depth) * .1))}
.deck-vfx-preview{--preview-blend:clamp(12px,2vw,20px);display:block;min-height:0;overflow:hidden;mix-blend-mode:screen;-webkit-mask-image:linear-gradient(180deg,var(--preview-top,transparent),#000 var(--preview-blend),#000 calc(100% - var(--preview-blend)),var(--preview-bottom,transparent));mask-image:linear-gradient(180deg,var(--preview-top,transparent),#000 var(--preview-blend),#000 calc(100% - var(--preview-blend)),var(--preview-bottom,transparent))}
.deck-vfx-preview:first-of-type{--preview-top:#000}
.deck-vfx-preview:last-of-type{--preview-bottom:#000}
.deck-vfx .deck-vfx-preview:last-of-type{--preview-bottom:transparent}
.carousel-stage .deck-vfx-preview img{display:block;object-position:50% 50%;filter:var(--preview-matte)}
.carousel-stage .deck-preview-eclipse-slash img{object-position:50% 51%;transform:scale(.9)}
.carousel-stage .deck-preview-flow-of-light img{object-position:50% 70%;transform:translateX(5%) scale(1.12)}
.vfx-gallery{max-width:1040px;margin:40px auto 0}
.vfx-player{border:3px solid #8c9bb9;border-radius:16px;background:#1b2443;box-shadow:inset 0 1px #edf3ff,0 5px #34405e,0 9px 0 #13152e,0 18px 35px #0b102733;overflow:hidden;padding:5px 5px 0}
.vfx-player .video-frame{position:relative;border:2px solid #111728;border-bottom:0;border-radius:10px 10px 0 0;overflow:hidden;background:#0a1220}
.vfx-player video{position:absolute;inset:0;width:100%;height:100%;background:#0a1220;object-fit:contain}
.vfx-start{position:absolute;inset:0;padding:0;width:100%;height:100%;background:#0a1220;text-align:left}
.vfx-start>img{width:100%;height:100%;object-fit:contain}.vfx-start>span{position:absolute;left:18px;bottom:18px;display:flex;align-items:center;gap:8px;padding:9px 15px;min-height:44px;border:1px solid #bfd6e8;border-radius:8px;background:linear-gradient(#425c80eb,#273950ee);box-shadow:inset 0 1px #f2faff55,0 3px 9px #0007;color:#f1f8ff;font:18px var(--display)}
.vfx-start svg{width:20px;height:20px}.vfx-start:hover>span{border-color:#ffe294;color:#ffeab0}.vfx-start:focus-visible{outline-offset:-5px}.vfx-start *{pointer-events:none}
.vfx-caption{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 24px 24px;border-top:1px solid #7286ab77;background:linear-gradient(120deg,#344163,#252d4e);box-shadow:inset 0 1px #d5e7ff19}
.vfx-current{min-width:0}.vfx-eyebrow{color:#b9cde5;font:700 10px/1.5 var(--body);letter-spacing:.14em;margin-bottom:6px}
.vfx-caption h3{color:#fff4d4;font-size:31px;text-shadow:0 2px #101a30}
.vfx-caption #vfx-detail{margin-top:7px;color:#cedcee;font-size:14px;line-height:1.5}
.vfx-rail-heading{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:30px 2px 12px;font:700 10px/1.5 var(--body);letter-spacing:.12em;color:#e3dcf4}
.vfx-rail-heading>span{font-weight:400;letter-spacing:0;color:#c8bbde;font-size:12px}
.vfx-rail{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;padding:5px 4px 12px;margin-inline:-4px}
.vfx-choice{min-width:0;text-align:left;padding:5px 5px 12px;border:2px solid #777398;border-radius:11px;background:linear-gradient(#35334f,#27263f);box-shadow:inset 0 1px #dce4f33b,0 4px #16152e;transition:border-color .18s,background-color .18s}
.vfx-thumb{display:block;position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:5px;border:1px solid #171728;background:#0a1220}
.vfx-thumb img{width:100%;height:100%;object-fit:cover}
.vfx-thumb-play{position:absolute;right:6px;bottom:6px;display:grid;place-items:center;width:23px;height:23px;border:1px solid #b4cce099;border-radius:50%;color:#f3f9ff;background:#17253cc7}
.vfx-thumb-play svg{width:17px;height:17px}
.vfx-choice-title{display:block;margin:10px 5px 0;font:18px/1.18 var(--display);color:#e6eefb;min-height:2.36em}
.vfx-choice-state{display:block;margin:6px 5px 0;font:700 10px/1.4 var(--body);letter-spacing:.05em;color:#bdb8d1}
.vfx-choice:hover{border-color:#c1d7e9}.vfx-choice[aria-pressed=true]{border-color:#ffe294;background:linear-gradient(#465777,#313551);box-shadow:inset 0 1px #fff6d77a,0 4px #171c34,0 0 0 1px #c39f53}
.vfx-choice[aria-pressed=true] .vfx-choice-title,.vfx-choice[aria-pressed=true] .vfx-choice-state{color:#ffebac}
.vfx-choice:focus-visible{outline-offset:1px}.vfx-choice *{pointer-events:none}
@media(max-width:700px){
 .vfx-gallery{margin-top:29px}.vfx-player{padding:3px 3px 0;border-width:2px;border-radius:12px}.vfx-player .video-frame{border-radius:7px 7px 0 0;border-width:1px}
 .vfx-caption{padding:16px 12px 18px;gap:10px}.vfx-caption h3{font-size:25px}.vfx-caption #vfx-detail{font-size:12px}.vfx-eyebrow{font-size:8px}
 .vfx-start>span{left:10px;bottom:10px;padding:7px 10px;font-size:16px}
 .vfx-rail{display:flex;gap:12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#9181b3 #261b40;-webkit-overflow-scrolling:touch}
 .vfx-choice{flex:0 0 145px;scroll-snap-align:start}.vfx-choice-title{font-size:17px}.vfx-rail-heading{margin-top:25px}
}

/* The transparent hit area stays generous while only the painted control shrinks. */
.press-control,[data-press=play],[data-press=close]{--press-scale:.95;--press-drop:2px;--press-rest-scale:1;--press-rest-y:0px;--press-rest-light:1;--press-down-shadow:0 1px 2px #03142655}
.press-control{position:relative;touch-action:manipulation}
.press-control:after{content:'';position:absolute;inset:-6px -4%;border-radius:inherit}
.vfx-choice:after{inset:0}
.button-gold{--press-rest-shadow:0 5px #a86813,0 6px 0 2px #092b57,0 10px 14px #051c4544;--press-down-shadow:0 1px #a86813,0 2px 0 2px #092b57}
.button-blue,.button-outline{--press-rest-shadow:0 5px #07408d,0 6px 0 2px #082b59,0 10px 14px #051c4533;--press-down-shadow:0 1px #07408d,0 2px 0 2px #082b59}
.deck-controls button{--press-scale:.94;--press-rest-shadow:0 4px #a96812,0 5px 0 2px #092e59;--press-down-shadow:0 1px #a96812,0 2px 0 2px #092e59}
.filter-tabs{row-gap:10px}
.filter-tabs button{--press-rest-shadow:0 3px #183b6d,1px 4px 4px -2px #03172f77,3px 8px 10px -4px #03172f80,inset 0 2px #d8ecff;--press-down-shadow:0 1px #183b6d,1px 2px 3px -1px #03172f66,inset 0 1px #d8ecff}
.filter-tabs button[aria-pressed=true]{--press-rest-shadow:0 3px #092b65,1px 4px 4px -2px #03172f77,3px 8px 10px -4px #03172f80,inset 0 2px #70a7fa;--press-down-shadow:0 1px #092b65,1px 2px 3px -1px #03172f66,inset 0 1px #70a7fa}
.menu-toggle{--press-rest-shadow:0 3px #073e86;--press-down-shadow:0 1px #073e86}
.lightbox-bottom button{--press-rest-shadow:0 3px #07396c;--press-down-shadow:0 1px #07396c}
.vfx-choice{--press-scale:.97;--press-drop:1px;--press-rest-shadow:inset 0 1px #dce4f33b,0 4px #16152e;--press-down-shadow:inset 0 1px #dce4f33b,0 1px #16152e}
.vfx-choice[aria-pressed=true]{--press-rest-shadow:inset 0 1px #fff6d77a,0 4px #171c34,0 0 0 1px #c39f53;--press-down-shadow:inset 0 1px #fff6d755,0 1px #171c34,0 0 0 1px #c39f53}
#main-nav>a{--press-drop:1px}
#main-nav>.nav-contact{--press-rest-shadow:0 4px #a56b10,0 5px 0 2px #07326a;--press-down-shadow:0 1px #a56b10,0 2px 0 2px #07326a}
[data-press=play]{--press-rest-shadow:inset 0 1px #f2faff55,0 3px 9px #0007;--press-down-shadow:inset 0 1px #f2faff33,0 1px 3px #0007}
[data-press=close]{--press-scale:.94;--press-rest-shadow:0 3px #7c1328;--press-down-shadow:0 1px #7c1328;min-width:44px;min-height:44px;justify-content:center}
:is(.press-control,#main-nav>.press-control,[data-press=play]>span,[data-press=close]>b){transform-origin:center;transform:translateY(var(--press-rest-y)) scale(var(--press-rest-scale));filter:brightness(var(--press-rest-light));box-shadow:var(--press-rest-shadow,none);transition:transform 200ms ease-out,filter 140ms ease,box-shadow 100ms ease}
@media(hover:hover) and (pointer:fine){
 .press-control:hover,[data-press=play]:hover,[data-press=close]:hover{--press-rest-scale:1.015;--press-rest-y:-1px;--press-rest-light:1.06}
}
:is(.press-control.is-pressed,#main-nav>.press-control.is-pressed,[data-press=play].is-pressed>span,[data-press=close].is-pressed>b){transform:translateY(var(--press-drop)) scale(var(--press-scale));filter:brightness(.97);box-shadow:var(--press-down-shadow);transition-duration:80ms;transition-timing-function:ease-out}
:is(.press-control.is-releasing,#main-nav>.press-control.is-releasing,[data-press=play].is-releasing>span,[data-press=close].is-releasing>b){animation:control-release 220ms ease-out}
@keyframes control-release{0%{transform:translateY(var(--press-drop)) scale(var(--press-scale))}68%{transform:translateY(var(--press-rest-y)) scale(calc(var(--press-rest-scale) + .015))}100%{transform:translateY(var(--press-rest-y)) scale(var(--press-rest-scale))}}
.mobile-dock>[data-press=dock]>:is(svg,span){scale:1;translate:0 0;transition:scale 180ms ease-out,translate 180ms ease-out;pointer-events:none}
.mobile-dock>[data-press=dock].is-pressed>:is(svg,span){scale:.93;translate:0 1px;transition-duration:80ms}
.mobile-dock>[data-press=dock].is-releasing>:is(svg,span){animation:dock-release 220ms ease-out}
@keyframes dock-release{0%{scale:.93;translate:0 1px}68%{scale:1.015;translate:0 0}100%{scale:1;translate:0 0}}
@media(prefers-reduced-motion:reduce){.press-control,[data-press=play]>span,[data-press=close]>b,.mobile-dock>[data-press=dock]>*{animation:none!important;transition:none!important}}

/* Artwork surfaces share the deck's light planes without its dark casing.
   The image fills the surface; only translucent bevel lighting sits over it. */
:is(.card-image,.artwork-button,.illustration-feature,.drawing-feature,.vfx-player .video-frame,.vfx-thumb){
 --bevel-width:var(--display-bevel-width);--face-radius:12px;
 position:relative;isolation:isolate;overflow:hidden;
 padding:0;border:0;border-radius:var(--face-radius);background:transparent;
 box-shadow:none
}
/* Raised displays cast onto their own backing, above the following text surface. */
.project-card .card-image{
 z-index:1;box-shadow:0 3px 5px -1px #122a455c,4px 12px 16px -3px #1029414d
}
.vfx-player .video-frame{
 z-index:1;box-shadow:0 3px 5px -1px #080b2259,4px 10px 16px -3px #080b224d
}
.vfx-choice .vfx-thumb{
 z-index:1;box-shadow:0 2px 3px -.5px #07091d59,2px 6px 8px -1.5px #07091d47
}
:is(.card-image,.artwork-button,.illustration-feature,.drawing-feature,.video-frame,.vfx-thumb):before,
:is(.card-image,.artwork-button,.illustration-feature,.drawing-feature,.video-frame,.vfx-thumb):after{z-index:6}
:is(.card-image,.artwork-button,.illustration-feature,.drawing-feature,.video-frame,.vfx-thumb):after{content:''}
:is(.card-open,.zoom-label,.vfx-thumb-play){z-index:7}
/* Collection labels sit above the display's bevel lighting as flat title plates. */
.art-showcase .feature-badge{z-index:8}
.project-card{border:3px solid #8eb7e4;border-radius:13px}
.card-image{margin:4px 4px 0}
.card-body{border-top:0}
.artwork{padding:0;border:0;border-radius:12px;background:transparent}
.vfx-player{padding:0;border:0;border-radius:12px;background:transparent}
.vfx-caption{
 border-top:0;border-bottom-left-radius:inherit;border-bottom-right-radius:inherit;
 box-shadow:inset 2px 0 2px -1px #91a6ce28,inset -2px 0 2px -1px #788cb820,inset 0 -2px 3px -1px #7389b340
}
/* One contact shadow and one cast shadow follow the complete surface.
   Image/text seams and the translucent bevel retain their own lighting. */
:root{--display-shadow:1px 3px 5px -1px #02142f66,5px 13px 22px -8px #020e2294}
.artwork,.vfx-player{box-shadow:var(--display-shadow)}
/* The VFX backing keeps its colored side beneath the existing display bevel. */
.vfx-player{box-shadow:0 4px #43547d,0 7px #242d50,var(--display-shadow)}
/* Restore the original colored backing beneath the inset display surface.
   The solid offsets describe its edge/thickness; the last shadows fall outside it. */
.project-card{box-shadow:inset 0 0 0 2px #eef5ff,0 5px #44648f,0 8px 0 1px #062a52,var(--display-shadow)}
.art-showcase :is(.illustration-feature,.drawing-feature){
 --face-radius:10px;--backing-edge:#eac267;--backing-light:#fff1af;--backing-side:#936c2e;
 border:5px solid var(--backing-edge);border-radius:15px;background:#112947;
 box-shadow:inset 0 0 0 2px var(--backing-light),0 5px var(--backing-side),0 8px #06223f,var(--display-shadow)
}
.art-showcase .drawing-feature{
 --backing-edge:#cf98a0;--backing-light:#f9dfdf;--backing-side:#895966;
 --deck-top-light:linear-gradient(180deg,#fff1ef 0,#fff1ef 45%,#fae6e3 calc(100% - .7px),transparent 100%);
 --deck-left-light:linear-gradient(90deg,#dfbec580 0,#bc929f75 20%,#a57c8e70 calc(100% - .25px),transparent 100%);
 --deck-bottom-light:linear-gradient(90deg,#e5c4c561 0,#c598a352 calc(100% - 8px));
 --deck-right-light:linear-gradient(180deg,#f6e0e57a 0,#e4b9c270 calc(100% - 4px));
 --deck-corner-light:conic-gradient(from 90deg at 0 0,#e4b9c270 0deg,#c598a352 90deg);
 --deck-facet-nw:linear-gradient(135deg,#fff1ed00 0 50%,#fff1ed8c 50%);
 --deck-facet-ne:linear-gradient(45deg,#f9d7df66 0 50%,#f9d7df00 50%);
 --deck-facet-sw:linear-gradient(45deg,#d6a0b200 0 50%,#d6a0b247 50%);
 --deck-corner-facet:linear-gradient(135deg,#86506533 0 50%,#86506500 50%);
 box-shadow:inset 0 0 0 2px var(--backing-light),0 5px var(--backing-side),0 8px #06223f,var(--display-shadow)
}
.drawing-feature .feature-badge.silver{background:linear-gradient(#f4d5d7,#daa6ae);border-color:#ffe6e6;color:#65414f;box-shadow:0 3px #6f435d66}
.drawing-feature .art-caption h3{color:#fff4ee;text-shadow:0 3px #694554}
.drawing-feature .art-caption .eyebrow{color:#fff1ed}
.drawing-feature .art-caption .text-link{color:#fff6f2;border-color:#f5d5d9}
/* Keep the character cover's portrait proportions independent of its grid row. */
.art-showcase .illustration-feature{aspect-ratio:4/5;height:auto;min-height:0;align-self:start}
/* Tint the artwork's color without flattening its light and texture. The
   caption stays out of a stacking context so its tint blends with the image;
   text and the existing bevel planes remain independently lit above it. */
.art-showcase .art-caption{z-index:auto;background:none;border-radius:0 0 var(--face-radius) var(--face-radius)}
.art-showcase .art-caption:before,
.art-showcase .art-caption:after{content:'';position:absolute;inset:0;z-index:3;border-radius:inherit;pointer-events:none}
.art-showcase .art-caption:before{background:var(--feature-tint);mix-blend-mode:color}
.art-showcase .art-caption:after{background:var(--feature-wash)}
.art-showcase .art-caption>*{position:relative;z-index:4}
.art-showcase .illustration-feature{
 --feature-tint:linear-gradient(180deg,#cf841900 0%,#d4902414 18%,#e2a53980 48%,#efb948db 75%,#ffd66bf2 100%);
 --feature-wash:linear-gradient(180deg,#d4902400 0%,#d4902400 25%,#dca7380d 48%,#e8b84624 75%,#f1c65b40 100%);
 --deck-bottom-light:linear-gradient(180deg,#fff1c226 0%,#ab823747 36%,#63502661 100%);
 --deck-corner-light:conic-gradient(from 90deg at 0 0,#d3deeb70 0deg,#63502661 90deg);
 --deck-facet-sw:linear-gradient(45deg,#f8d99100 0 50%,#f8d99166 50%);
 --deck-corner-facet:linear-gradient(135deg,#56491e59 0 50%,#56491e00 50%);
}
.art-showcase .drawing-feature{
 --feature-tint:linear-gradient(180deg,#b8747f00 0%,#bb818b14 18%,#c88f9980 48%,#d3a0aad4 75%,#e3bac1ed 100%);
 --feature-wash:linear-gradient(180deg,#bb818b00 0%,#bb818b00 25%,#c88f990d 48%,#d3a0aa24 75%,#e3bac13d 100%);
 --deck-bottom-light:linear-gradient(180deg,#fff0e826 0%,#bb899447 36%,#784b5e61 100%);
 --deck-corner-light:conic-gradient(from 90deg at 0 0,#e4b9c270 0deg,#784b5e61 90deg);
 --deck-facet-sw:linear-gradient(45deg,#f4c5d000 0 50%,#f4c5d066 50%);
 --deck-corner-facet:linear-gradient(135deg,#603e5159 0 50%,#603e5100 50%);
}
.art-showcase :is(.illustration-feature,.drawing-feature):before,
.art-showcase :is(.illustration-feature,.drawing-feature):after{border-radius:10px}
.vfx-rail{padding:6px 10px 18px;margin-inline:-10px}
.vfx-choice{
 padding:0 0 12px;border:0;border-radius:8px;
 --vfx-backing-rim:inset 2px 0 2px -1px #91a6ce20,inset -2px 0 2px -1px #8194bf18,inset 0 -2px 2.5px -1px #7185b033;
 --press-rest-shadow:var(--vfx-backing-rim),0 3px #414e76,0 5px #252b4e,1px 2px 3px -1px #070e2866,3px 7px 11px -4px #070e2880;
 --press-down-shadow:var(--vfx-backing-rim),0 1px #414e76,0 2px #252b4e,0 1px 2px #070e284d,1px 2px 4px -2px #070e2866;
 box-shadow:var(--press-rest-shadow)
}
.vfx-choice[aria-pressed=true]{
 --press-rest-shadow:var(--vfx-backing-rim),0 0 0 1px #ffe294b3,0 3px #414e76,0 5px #252b4e,1px 2px 3px -1px #070e2866,3px 7px 11px -4px #070e2880;
 --press-down-shadow:var(--vfx-backing-rim),0 0 0 1px #ffe294b3,0 1px #414e76,0 2px #252b4e,0 1px 2px #070e284d,1px 2px 4px -2px #070e2866;
 box-shadow:var(--press-rest-shadow)
}
@media(max-width:700px){
 :root{--display-shadow:1px 2px 4px -1px #02142f66,3px 8px 13px -5px #020e2285}
 :is(.card-image,.artwork-button,.illustration-feature,.drawing-feature,.vfx-player .video-frame){--face-radius:10px}
 .project-card{border-radius:11px}
 .artwork,.vfx-player{border-radius:10px}
}
/* Short preview images keep the same planes at a smaller optical scale. */
.vfx-choice .vfx-thumb{--bevel-width:clamp(3px,calc(var(--display-bevel-width) * .35),4px);--face-radius:7px}

/* The current mobile destination expands within the existing dock height. */
@media(max-width:850px){
 .mobile-dock{display:flex;background:#3b4b62;border-top-color:#879db6}
 .mobile-dock>a{
  flex:1 1 0;min-width:0;border-right-color:#9bb0c94d;border-left-color:#263a5266;
  background:linear-gradient(180deg,#56677f 0%,#455268 48%,#354153 100%);
  box-shadow:inset 0 1px #c0cfdf40;transition:flex-grow 180ms ease
 }
 .mobile-dock>a[aria-current]{
  flex-grow:2;background:linear-gradient(180deg,#435e7b 0%,#4f7695 52%,#6295b0 100%);
  box-shadow:inset 0 1px #d5e8f052
 }
 .mobile-dock>a[aria-current]:before,.mobile-dock>a[aria-current]:after{
  content:'';position:absolute;top:50%;width:14px;height:21px;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2020%2028%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22a%22%20x2%3D%220%22%20y2%3D%221%22%3E%3Cstop%20stop-color%3D%22%23f4ffff%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%2369cdeb%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Cpath%20d%3D%22M16%203%204%2014l12%2011Z%22%20fill%3D%22url(%23a)%22%20stroke%3D%22%23203b51%22%20stroke-width%3D%223%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;
  filter:drop-shadow(0 1px 0 #15293d66)
 }
 .mobile-dock>a[aria-current]:before{left:6px;transform:translateY(-50%)}
 .mobile-dock>a[aria-current]:after{right:6px;transform:translateY(-50%) scaleX(-1)}
}
@media(max-width:850px) and (prefers-reduced-motion:reduce){.mobile-dock>a{transition:none}}

/* A page-local palette; artwork, geometry and the shared navigation stay intact. */
body.table-palette{
 --gold:#ecd091;--ink:#302039;--muted:#c9b3cf;--paper:#eee1ef;
 --display-shadow:1px 3px 5px -1px #16082466,5px 13px 22px -8px #11051e94;
 color:#fff3f0;background-color:#522485;
 background-image:linear-gradient(90deg,#170c3299,#34205a22 25%,#34205a22 75%,#170c3299),url('/assets/arena-floor-dcd99e6405b0.webp');
 background-blend-mode:normal,luminosity
}
.table-palette ::selection{background:#efd29b;color:#372044}
.table-palette .header-inner{justify-content:flex-end}
.table-palette :is(a,button):focus-visible{outline-color:#ffe2b1}
.table-palette .site-header{background:linear-gradient(#c59be0 0,#8d55b1 8%,#5c2f82 82%,#43215f);border-top-color:#e4c3ea;border-bottom-color:#321842;box-shadow:0 5px 0 #24103099,0 8px 20px #19091f44}
.table-palette :is(.brand>span,.footer-brand>span){color:#fff4ef}
.table-palette .brand>span{text-shadow:0 3px #2a143b}
.table-palette .footer-brand>span{text-shadow:0 2px #2a143b}
.table-palette :is(.brand small,.footer-brand small){color:#ead3e7}
.table-palette .brand>svg{filter:drop-shadow(0 3px 2px #26143588)}
.table-palette .ui-icon{filter:drop-shadow(0 2px 1px #28153466)}
.table-palette #main-nav>a{color:#fff3ef;text-shadow:0 2px #32163f}
.table-palette #main-nav>a:hover{background:#fff0ff12;border-color:transparent;box-shadow:none}
.table-palette #main-nav>.nav-contact{background:linear-gradient(#f9df9d,#dfa340);color:#4b2c35;text-shadow:0 1px #fff1c6;border-color:#fbe7b5;--press-rest-shadow:0 4px #9b642c,0 5px 0 2px #2e153f;--press-down-shadow:0 1px #9b642c,0 2px 0 2px #2e153f}
.table-palette .menu-toggle{background:linear-gradient(#b581c5,#704084);border-color:#dfb5da;--press-rest-shadow:0 3px #3b1c4c;--press-down-shadow:0 1px #3b1c4c}
.table-palette .menu-toggle span{background:#fff1ee}
.table-palette .project-hero .hero-kicker{color:#efd39a}
.table-palette .project-hero h1{color:#fff0d1;-webkit-text-stroke-color:#26123f;text-shadow:0 4px #200c36}
.table-palette .project-hero-content>p:not(.hero-kicker){color:#f3e6ef}
.table-palette .back-link{color:#fff0ee;border-color:#b991b7;background:#3d204b99}
.table-palette .project-tags span{color:#fff2ef;background:linear-gradient(#805277,#543453);border-color:#c39bb5;box-shadow:0 2px #2a132f}
.table-palette :is(.project-overview,.next-project>a){background:linear-gradient(#62516e,#42314f);border-color:#927b99;color:#f3e6ef}
.table-palette .project-overview{box-shadow:inset 0 1px #f4e7f8,0 5px #291c36}
.table-palette .next-project>a{box-shadow:0 5px #291c36}
.table-palette :is(.project-overview h2,.project-section h2,.next-project h2){color:#ffedcb}
.table-palette .project-section h2{text-shadow:0 3px #281337}
.table-palette :is(.project-overview .section-kicker,.next-project>.section-kicker,.next-project .eyebrow){color:#efd0e5}
.table-palette :is(.project-overview div>p,.project-section-heading p){color:#e8d7e7}
.table-palette .project-section-heading>span{background:linear-gradient(#93639e,#593866);border-color:#dec38d;color:#ffebbd;box-shadow:0 3px #291338;text-shadow:0 2px #2e183b}
.table-palette .next-project img{border-color:#a488ac}
.table-palette .text-link{color:#f4d39e;border-color:#bc88aa}
.table-palette .text-link:hover{color:#fff0ca;border-color:currentColor}
.table-palette .artwork-button{
 --deck-top-light:linear-gradient(180deg,#fff7fc 0,#fff7fc 45%,#f5eafa calc(100% - .7px),transparent 100%);
 --deck-left-light:linear-gradient(90deg,#c8b9d080 0,#a698b575 20%,#8f7e9f70 calc(100% - .25px),transparent 100%);
 --deck-bottom-light:linear-gradient(90deg,#d1c2d461 0,#bdaec952 calc(100% - var(--face-radius) - 8px),#a28fac47 calc(100% - var(--face-radius)),#8a78951a 100%);
 --deck-right-light:linear-gradient(180deg,#e6d7ee7a 0,#d3bedf70 calc(100% - var(--face-radius) - 4px),#a993b940 calc(100% - var(--bevel-width)),#88729114 100%)
}
.table-palette .zoom-label{background:#382041dc;border-color:#d2afcf;color:#fff0ed}
.table-palette .site-footer{background:linear-gradient(#46235e,#231332);border-top-color:#917199}
.table-palette :is(.footer-inner>p,.footer-credit){color:#d7bfd9}
.table-palette .footer-email{color:#f6e4ef}
.table-palette .lightbox{
 --viewer-body:#1d142b;--viewer-glow:#75478940;--viewer-rim:#c0a1d0;
 --viewer-top:#9971b6;--viewer-mid:#6d4987;--viewer-bottom:#432959;
 --viewer-depth:#160a22;--viewer-line:#e3bcf055;--viewer-counter:#ead8f3;
 border-bottom-color:#7d5b94;
}
.table-palette .lightbox::backdrop{background:#10081eea}
@media(max-width:850px){
 .table-palette #main-nav{background:linear-gradient(#71428d,#432455);border-bottom-color:#b48dc1;box-shadow:0 8px 12px #230c3266}
 .table-palette #main-nav>a{border-color:#a278ad;background:#40204d99}
 .table-palette #main-nav>.nav-contact{background:linear-gradient(#f9df9d,#dfa340);border-color:#fbe7b5}
 .table-palette .mobile-dock{background:#362840;border-top-color:#b49bbf;box-shadow:0 -4px 12px #1a092d66}
 .table-palette .mobile-dock>a{background:linear-gradient(180deg,#71607f 0%,#51435f 48%,#392c46 100%);border-right-color:#bfa8cb4d;border-left-color:#30203966;color:#f7eaf5;text-shadow:0 2px #2e1c3c;box-shadow:inset 0 1px #dfcde840}
 .table-palette .mobile-dock>a[aria-current]{background:linear-gradient(180deg,#bc8039 0%,#e4ab50 52%,#f5d17b 100%);color:#352036;text-shadow:0 1px #ffe2a8;box-shadow:inset 0 1px #ffe9b899}
 .table-palette .mobile-dock>a[aria-current]:before,.table-palette .mobile-dock>a[aria-current]:after{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2020%2028%22%3E%3Cdefs%3E%3ClinearGradient%20id%3D%22a%22%20x2%3D%220%22%20y2%3D%221%22%3E%3Cstop%20stop-color%3D%22%23fff5d9%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23e7bc6c%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Cpath%20d%3D%22M16%203%204%2014l12%2011Z%22%20fill%3D%22url(%23a)%22%20stroke%3D%22%234a294b%22%20stroke-width%3D%223%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");filter:drop-shadow(0 1px 0 #30193666)}
}
@media(max-width:700px){body.table-palette{--display-shadow:1px 2px 4px -1px #16082466,3px 8px 13px -5px #11051e85}}

/* Shared game-art password panel; the artwork remains separate from this UI. */
.access-page{min-height:70vh;padding:56px 20px 90px;display:grid;justify-items:center;align-content:center;gap:24px}
.access-panel{width:min(100%,460px);padding:0;border:3px solid #9acbf7;border-radius:23px;background:linear-gradient(145deg,#173b69,#0a2142);color:#f6f8ff;box-shadow:0 8px 0 #062245,0 20px 60px #00162a88;overflow:hidden}
.access-dialog{position:fixed;max-height:calc(100dvh - 32px);overflow:auto;margin:auto}
.access-dialog::backdrop{background:#021226d9;backdrop-filter:blur(6px)}
.access-heading{min-height:66px;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 24px;background:linear-gradient(#288cd6,#1a5298);border-bottom:2px solid #7bbbe2;font-size:13px;letter-spacing:.13em;font-weight:800;color:#d9efff}
.access-close{width:38px;height:38px;flex-shrink:0;border:2px solid #ffb8af;border-radius:11px;background:linear-gradient(#ff7c77,#df3141);color:#fff;font:32px/1 Arial,sans-serif;box-shadow:0 3px 0 #841e31;text-shadow:0 2px #921933;cursor:pointer}
.access-body{padding:28px 28px 32px;text-align:center;background:radial-gradient(ellipse at 50% 0,#3279a63d,transparent 65%)}
.access-lock{display:grid;place-items:center;margin:0 auto 18px;width:66px;height:72px;color:#ffe078;filter:drop-shadow(0 4px 0 #684b27)}
.access-lock svg{width:46px;height:54px}
.access-panel h1{font-family:var(--display);font-size:30px;line-height:1.08;color:#fff2c0;margin:0 0 14px;font-weight:400;text-shadow:0 3px #071d38}
.access-intro{font-size:15px;line-height:1.55;margin:0 0 24px;color:#bfd2e9}
.access-form{display:grid;gap:10px;text-align:left}.access-form label{font-size:14px;font-weight:700;color:#dfedff;margin-top:2px}
.access-password{position:relative;display:flex}.access-form input:not([type=hidden]){width:100%;min-width:0;border:2px solid #5c8eb5;border-radius:10px;background:#071c37;color:#fff;padding:13px 15px;font:16px/1.5 system-ui,sans-serif;box-sizing:border-box}
.access-password input{padding-right:66px!important}.access-password button{position:absolute;right:4px;top:4px;bottom:4px;padding:0 10px;border:0;background:none;color:#badeff;font-size:12px;font-weight:700;cursor:pointer}
.access-form input:focus-visible,.access-panel button:focus-visible,.access-panel a:focus-visible{outline:3px solid #ffdc77;outline-offset:3px}
.access-form>.button{justify-content:center;width:100%;margin:4px 0 2px;min-height:52px;font-size:20px;cursor:pointer}.access-form>.button:disabled{opacity:.7;cursor:wait}
.access-message{min-height:0;margin:0;color:#ffd7ac;font-size:14px;line-height:1.45}.access-message:empty{display:none}.access-message[data-success]{color:#9af2d0}
.access-note{font-size:12px;color:#b6cbe4;line-height:1.6;margin:8px 0;text-align:center}.access-contact,.access-back{color:#c6e8ff;font-size:14px;text-decoration:underline;text-underline-offset:4px;text-align:center}.access-contact{display:block;margin-top:12px}
.access-toolbar{display:flex;justify-content:center;gap:20px;align-items:center;background:#0b2442e6;padding:10px 18px;color:#d0e4f8;font-size:13px}.access-toolbar button{font:inherit;color:#fff0a8;background:none;border:0;text-decoration:underline;cursor:pointer}
body.access-expired .project-page,body.access-expired .lightbox{visibility:hidden}
.access-manager{width:min(100%,600px)}.access-manager .access-intro{margin-bottom:20px}
.access-mode-status{display:inline-block;border:1px solid #7492b9;background:#061e3e;padding:5px 12px;border-radius:20px;font-size:12px;font-weight:800;letter-spacing:.04em;color:#cbddf0;margin-bottom:17px}
.access-mode-panel[data-mode=password] .access-mode-status{color:#ffe183;border-color:#b29a5c}.access-mode-panel[data-mode=public] .access-mode-status{color:#9aefdd;border-color:#499b90}
.access-mode-options{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.access-mode-options button{display:flex;position:relative;flex-direction:column;align-items:center;gap:9px;border:2px solid #527da9;border-radius:14px;background:linear-gradient(#184579,#0d2c52);padding:17px 10px 16px;color:#c9e5fd;box-shadow:0 4px #071c37;min-width:0}
.access-mode-options button[aria-pressed=true]{border-color:#ffdc76;background:linear-gradient(#2b6293,#21446b);color:#fff3ba;box-shadow:0 4px #695122,inset 0 0 0 1px #ffeaae44}
.access-mode-options button[data-mode-choice=public][aria-pressed=true]{border-color:#7ee5d2;background:linear-gradient(#235f77,#1b415f);color:#bbfff2;box-shadow:0 4px #205258,inset 0 0 0 1px #b2ffec44}
.access-mode-symbol{display:block;width:28px;height:32px}.access-mode-symbol svg{width:100%;height:100%}.access-mode-options strong{font-family:var(--display);font-size:19px;font-weight:400;line-height:1.15}.access-mode-options small{font-size:12px;line-height:1.5;font-weight:400;color:#c2d6eb}
.access-mode-check{display:none;position:absolute;top:6px;right:9px;font-size:14px;font-weight:800}.access-mode-options [aria-pressed=true] .access-mode-check{display:block}
.access-mode-options button:disabled{opacity:.6;cursor:wait}.access-mode-description{font-size:13px;line-height:1.65;color:#c4d8f0;margin:18px 0 8px}.access-retry{font:inherit;color:#fff0ad;text-decoration:underline;background:none;margin-top:10px}
.access-password-section{border-top:1px solid #719cc057;padding-top:23px;margin-top:24px}.access-password-section h2{font-family:var(--display);font-size:24px;color:#fff0ba}.access-password-section>.access-note{margin:7px 0 20px}
@media(max-width:420px){.access-page{padding:30px 14px 70px}.access-body{padding:24px 21px}.access-panel h1{font-size:28px}.access-heading{padding:12px 20px}}

/* Keep contact choices on the page even when a device has no mail/call handler. */
.contact-panel{grid-template-columns:1fr;gap:25px;scroll-margin-top:115px}
.contact-panel .contact-heading>p:not(.section-kicker){max-width:680px}
.contact-methods{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.contact-method{min-width:0;padding:23px;border:2px solid #9ab9da;border-radius:13px;background:linear-gradient(#f5f9ff,#d6e4f7);box-shadow:inset 0 1px #fff,0 4px #92acca}
.contact-method-heading{display:flex;align-items:center;gap:12px;margin-bottom:15px}
.contact-method-heading h3{font-size:25px;color:#173d70;line-height:1.1}
.contact-method-icon{display:grid;place-items:center;width:40px;height:40px;flex-shrink:0;border-radius:10px;border:1px solid #d5b362;background:linear-gradient(#fff3b3,#ffcd50);box-shadow:0 2px #ad8536}
.contact-method-icon svg{width:26px;height:26px;fill:none;stroke:#174d87;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.contact-value{display:block;width:100%;min-width:0;box-sizing:border-box;padding:10px 0;border:0;border-bottom:1px solid #a7c0dc;background:transparent;color:#164781;font:700 clamp(17px,1.7vw,23px)/1.4 system-ui,sans-serif;user-select:all;-webkit-user-select:all;border-radius:0}
.contact-detail{display:block;font-size:12px;color:#496486;margin-top:10px;line-height:1.5}
.contact-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.contact-action{display:inline-flex;justify-content:center;align-items:center;gap:9px;min-height:44px;padding:9px 14px;border:2px solid #86a8d0;border-radius:9px;background:linear-gradient(#edf5ff,#c4d9f1);box-shadow:0 3px #7f9bbb;color:#1d4e83;font:700 14px/1.25 system-ui,sans-serif;text-decoration:none;cursor:pointer}
.contact-primary{background:linear-gradient(#fff2ac,#ffcf55);border-color:#dbb15b;box-shadow:0 3px #ad843c;color:#60431a}
.contact-action:hover{filter:brightness(1.035)}.contact-action:active{transform:translateY(2px);box-shadow:0 1px #7f9bbb}
.contact-action:disabled{cursor:wait;opacity:.7}.contact-action[hidden]{display:none}
.contact-action:focus-visible,.contact-value:focus-visible{outline:3px solid #236bd5;outline-offset:4px}
.contact-panel .contact-help{font-size:12px!important;line-height:1.65!important;color:#536985!important;margin-top:18px!important}
.contact-panel .contact-feedback{min-height:2.8em;font-size:12px!important;line-height:1.4!important;font-weight:700;color:#19584f!important;margin-top:10px!important}
.contact-feedback[data-fallback]{color:#744f17!important}
@media(max-width:700px){.contact-methods{grid-template-columns:1fr;gap:18px}.contact-panel{padding:23px;scroll-margin-top:94px}.contact-method{padding:20px}.contact-value{font-size:clamp(17px,4.4vw,23px)}}
@media(max-width:380px){.contact-panel{padding:16px}.contact-method{padding:16px}.contact-actions{gap:8px}.contact-action{padding-inline:11px;font-size:13px}.contact-method-heading h3{font-size:23px}}
