@font-face{font-family:Inter;src:url(../fonts/inter.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:Orbitron;src:url(../fonts/orbitron.woff2) format("woff2");font-weight:400 900;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(../fonts/jetbrains-mono.woff2) format("woff2");font-weight:100 800;font-display:swap}
:root{--navy:#0a1224;--teal:#20c9b4;--gold:#f0be46;--r:16px;
--bg:#0a1224;--bg2:#0f1a33;--bg3:#13213f;--line:#1c2a4a;--tx:#dbe3f0;--hd:#fff;--mut:#8e9bb5;--acc:#20c9b4;--acc2:#f0be46;--hdr:rgba(10,18,36,.78);--shadow:0 20px 40px -24px rgba(0,0,0,.7);--grid:rgba(255,255,255,.035);--code:#0b1020;color-scheme:dark}
[data-theme=light]{--bg:#f8f9fc;--bg2:#fff;--bg3:#eef2f8;--line:#e2e7f0;--tx:#26324a;--hd:#0a1224;--mut:#5d6a82;--acc:#0e9e8c;--acc2:#c48d12;--hdr:rgba(248,249,252,.82);--shadow:0 20px 40px -24px rgba(10,18,36,.25);--grid:rgba(10,18,36,.045);color-scheme:light}
*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--tx);font:17px/1.7 Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased;transition:background .3s,color .3s}
a{color:var(--acc);text-decoration:none}img{max-width:100%;display:block}
:focus-visible{outline:2px solid var(--acc2);outline-offset:3px;border-radius:6px}
.wrap{max-width:1180px;margin:0 auto;padding:0 1.5rem}.narrow{max-width:720px}
.skip{position:absolute;left:-999px;top:0;background:var(--gold);color:var(--navy);padding:.5rem 1rem;z-index:99}.skip:focus{left:1rem}
.sig{font-family:Orbitron,sans-serif;font-weight:700;letter-spacing:.06em;color:var(--hd)}.sig b{color:var(--acc)}
.sample{display:inline-block;font:600 .7rem/1 Inter;letter-spacing:.1em;text-transform:uppercase;padding:.35rem .6rem;border-radius:6px;background:rgba(240,190,70,.15);color:var(--acc2);border:1px dashed var(--acc2)}
/* header */
.hdr{position:sticky;top:0;z-index:50;background:var(--hdr);backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--line)}
.hdr-in{display:flex;align-items:center;gap:1rem;height:68px}.hdr .sig{font-size:1.2rem;margin-right:auto}
.menu{display:none;list-style:none;gap:.4rem}.menu a{display:block;padding:.45rem .85rem;border-radius:8px;color:var(--mut);font-size:.93rem;font-weight:500;transition:color .2s,background .2s}
.menu a:hover,.menu .cur a{color:var(--hd);background:var(--bg3)}
.ibtn{width:40px;height:40px;display:grid;place-items:center;border-radius:10px;border:1px solid var(--line);background:var(--bg2);color:var(--hd);cursor:pointer;transition:border-color .2s,transform .2s}
.ibtn:hover{border-color:var(--acc);transform:translateY(-1px)}.ibtn svg{width:18px;height:18px}
.ic-sun{display:none}[data-theme=dark] .ic-sun{display:block}[data-theme=dark] .ic-moon{display:none}
.mnav{display:none;border-top:1px solid var(--line);padding:1rem 1.5rem 1.5rem}.mnav.open{display:block}.mnav ul{list-style:none}.mnav a{display:block;padding:.75rem 0;color:var(--hd);font-weight:500;border-bottom:1px solid var(--line)}
/* buttons */
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 1.5rem;border-radius:12px;font-weight:600;font-size:.97rem;transition:transform .2s,box-shadow .2s,border-color .2s,color .2s}
.btn.p{background:var(--teal);color:var(--navy)}.btn.p:hover{transform:translateY(-2px);box-shadow:0 12px 28px -10px rgba(32,201,180,.7)}
.btn.g{border:1px solid var(--line);color:var(--hd);background:var(--bg2)}.btn.g:hover{border-color:var(--acc2);color:var(--acc2);transform:translateY(-2px)}
/* hero: always dark navy */
.hero{position:relative;overflow:hidden;background:#0a1224;color:#dbe3f0;padding:7rem 0 6rem;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:56px 56px;mask-image:radial-gradient(ellipse 70% 70% at 60% 40%,#000 30%,transparent 80%)}
.hero::after{content:"";position:absolute;z-index:-1;inset:0;background:radial-gradient(520px 380px at 82% 22%,rgba(32,201,180,.22),transparent 70%),radial-gradient(460px 320px at 8% 95%,rgba(240,190,70,.13),transparent 70%)}
.hero-g{display:grid;gap:3rem;align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:.55rem;color:#20c9b4;font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:.78rem}
.eyebrow::before{content:"";width:8px;height:8px;border-radius:50%;background:#20c9b4;box-shadow:0 0 0 4px rgba(32,201,180,.2)}
.hero h1{font-size:clamp(2.8rem,8vw,5.4rem);line-height:1.02;color:#fff;margin:1rem 0 1.1rem;font-weight:800;letter-spacing:-.035em}
.role{font-size:clamp(1.05rem,2.2vw,1.3rem);color:#fff;font-weight:500}.role i{font-style:normal;color:#f0be46}
.intro{color:#8e9bb5;max-width:36rem;margin-top:1rem}
.hero .btns{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2.2rem}.hero .btn.g{background:rgba(255,255,255,.04);border-color:#24365c;color:#fff}
.sigcard{position:relative;border:1px solid #1c2a4a;border-radius:24px;padding:2.2rem;background:linear-gradient(160deg,rgba(19,33,63,.9),rgba(10,18,36,.6));box-shadow:0 30px 60px -30px #000}
.sigcard .sig{color:#fff;font-size:clamp(1.8rem,4vw,2.6rem);display:block;text-shadow:0 0 30px rgba(32,201,180,.35)}
.sigcard .line{height:2px;margin:1.2rem 0;background:linear-gradient(90deg,#20c9b4,#f0be46,transparent)}
.term{font:500 .85rem/1.9 "JetBrains Mono",monospace;color:#8e9bb5}.term b{color:#20c9b4;font-weight:500}.term em{color:#f0be46;font-style:normal}
/* sections */
.sec{padding:6rem 0}.sec.alt{background:var(--bg3)}
.sh{display:flex;align-items:end;justify-content:space-between;gap:1rem;margin-bottom:2.5rem;flex-wrap:wrap}
.kick{font:600 .78rem Inter;letter-spacing:.14em;text-transform:uppercase;color:var(--acc2)}
h2{font-size:clamp(1.7rem,3.5vw,2.4rem);line-height:1.2;color:var(--hd);letter-spacing:-.02em;margin-top:.3rem}
.more{font-weight:600;font-size:.95rem}.more:hover{color:var(--acc2)}
.cards{display:grid;gap:1.5rem}
.card{display:flex;flex-direction:column;background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:transform .3s,border-color .3s,box-shadow .3s}
.card:hover{transform:translateY(-5px);border-color:color-mix(in srgb,var(--acc) 55%,transparent);box-shadow:var(--shadow)}
.thumb{aspect-ratio:16/9;position:relative;overflow:hidden;background:#0f1a33}
.thumb .art{position:absolute;inset:0;transition:transform .5s}.card:hover .art{transform:scale(1.05)}
.thumb .sample{position:absolute;top:.8rem;right:.8rem;background:rgba(10,18,36,.75)}
.cb{padding:1.4rem 1.4rem 1.5rem;display:flex;flex-direction:column;flex:1}
.cat{font:600 .75rem Inter;letter-spacing:.1em;text-transform:uppercase;color:var(--acc)}
.card h3{font-size:1.15rem;line-height:1.4;margin:.5rem 0 .6rem;color:var(--hd)}.card h3 a{color:inherit}.card h3 a:hover{color:var(--acc)}
.card p{color:var(--mut);font-size:.95rem;flex:1}
.meta{display:flex;gap:.6rem;align-items:center;color:var(--mut);font-size:.84rem;margin-top:1.1rem}.meta .dot{width:3px;height:3px;border-radius:50%;background:currentColor}
.topics{display:grid;gap:1rem}
.topic{padding:1.6rem;border-radius:var(--r);background:var(--bg2);border:1px solid var(--line);transition:border-color .3s,transform .3s}.topic:hover{border-color:var(--acc2);transform:translateY(-3px)}
.topic .ti{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--acc) 12%,transparent);color:var(--acc);margin-bottom:1rem}.topic .ti svg{width:22px;height:22px}
.topic h3{color:var(--hd);font-size:1.05rem}.topic p{color:var(--mut);font-size:.92rem;margin-top:.35rem}
.about-g{display:grid;gap:3rem}.about-g p{color:var(--mut);margin-bottom:1rem}.about-g p strong{color:var(--hd)}
.facts{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-top:1.8rem}
.fact{padding:1.1rem 1.2rem;border-radius:14px;background:var(--bg2);border:1px solid var(--line)}.fact b{display:block;font-size:1.7rem;color:var(--acc2);line-height:1.2}.fact span{color:var(--mut);font-size:.85rem}
.skills h3{font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mut);margin:1.4rem 0 .6rem}.skills h3:first-child{margin-top:0}
.chips{display:flex;flex-wrap:wrap;gap:.5rem}.chips span{font-size:.86rem;padding:.35rem .8rem;border-radius:99px;background:var(--bg2);border:1px solid var(--line);color:var(--tx)}
.contact{text-align:center;position:relative}
.cbox{border:1px solid var(--line);border-radius:28px;padding:4rem 1.5rem;background:radial-gradient(500px 240px at 50% 0,color-mix(in srgb,var(--acc) 14%,transparent),transparent 70%),var(--bg2)}
.cbox p{color:var(--mut);max-width:34rem;margin:1rem auto 0}.cbox .btns{display:flex;flex-wrap:wrap;justify-content:center;gap:.8rem;margin-top:2rem}
/* footer */
.ftr{border-top:1px solid var(--line);padding:3.5rem 0 2rem}.ftr-g{display:grid;gap:2rem}
.ftr .sig{font-size:1.5rem}.ftr p{color:var(--mut);font-size:.92rem;margin-top:.6rem;max-width:22rem}
.ftr ul{list-style:none;display:flex;flex-wrap:wrap;gap:1.4rem}.ftr ul a{color:var(--mut);font-size:.93rem}.ftr ul a:hover{color:var(--acc)}
.soc{display:flex;gap:.6rem}.copy{border-top:1px solid var(--line);margin-top:2.5rem;padding-top:1.5rem;color:var(--mut);font-size:.85rem;display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem}
/* single */
.phead{padding:4.5rem 0 2.5rem;text-align:left}.phead h1{font-size:clamp(2rem,5vw,3.1rem);line-height:1.15;letter-spacing:-.03em;color:var(--hd);margin:.8rem 0 1.2rem}
.byline{display:flex;align-items:center;gap:.8rem;color:var(--mut);font-size:.9rem}.av{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font:700 .9rem Orbitron;background:linear-gradient(135deg,#20c9b4,#f0be46);color:#0a1224}
.byline strong{color:var(--hd);display:block;font-weight:600}
.hero-img{max-width:1000px;margin:0 auto 3rem;aspect-ratio:21/9;border-radius:20px;overflow:hidden;position:relative;border:1px solid var(--line)}
.toc{border:1px solid var(--line);border-left:3px solid var(--acc);border-radius:12px;background:var(--bg2);padding:1.2rem 1.4rem;margin-bottom:2.5rem}
.toc b{font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--hd)}.toc ol{margin:.6rem 0 0 1.1rem;color:var(--mut)}.toc li{margin:.25rem 0;font-size:.95rem}.toc ol ol{list-style:lower-alpha}.toc a{color:var(--mut)}.toc a:hover{color:var(--acc)}
.prose{font-size:1.08rem;line-height:1.8}.prose>*+*{margin-top:1.3rem}
.prose h2{font-size:1.75rem;margin-top:3rem;scroll-margin-top:90px}.prose h3{font-size:1.3rem;color:var(--hd);margin-top:2.2rem;scroll-margin-top:90px}
.prose a{border-bottom:1px solid color-mix(in srgb,var(--acc) 40%,transparent)}.prose ul{padding-left:1.3rem}.prose li+li{margin-top:.4rem}.prose strong{color:var(--hd)}
.prose blockquote{border-left:3px solid var(--acc2);padding:.6rem 0 .6rem 1.4rem;font-size:1.2rem;color:var(--hd);font-style:italic}
.prose :not(pre)>code{font:.88em "JetBrains Mono",monospace;padding:.15em .4em;border-radius:6px;background:var(--bg3);color:var(--acc2)}
.prose table{width:100%;border-collapse:collapse;font-size:.95rem}.prose th,.prose td{text-align:left;padding:.7rem .8rem;border-bottom:1px solid var(--line)}.prose th{color:var(--hd)}
.code{position:relative;border-radius:14px;background:var(--code);border:1px solid #1c2a4a;overflow:hidden}
.code-h{display:flex;align-items:center;justify-content:space-between;padding:.55rem .9rem;border-bottom:1px solid #1c2a4a;font:500 .78rem "JetBrains Mono";color:#8e9bb5}
.copybtn{font:600 .75rem Inter;color:#dbe3f0;background:#13213f;border:1px solid #24365c;border-radius:7px;padding:.3rem .7rem;cursor:pointer}.copybtn:hover{border-color:#20c9b4;color:#20c9b4}
.code pre{margin:0;padding:1.1rem 1.2rem;overflow:auto;font:400 .9rem/1.7 "JetBrains Mono",monospace;color:#dbe3f0}
.token.comment{color:#62739a;font-style:italic}.token.keyword,.token.boolean{color:#20c9b4}.token.string{color:#f0be46}.token.number{color:#f59e7a}.token.class-name,.token.function{color:#7cc4ff}.token.punctuation,.token.operator{color:#93a1bd}
.share{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin:3rem 0;padding:1.4rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.share span{font-weight:600;color:var(--hd);margin-right:.4rem}
.share a,.share button{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem .9rem;border-radius:10px;border:1px solid var(--line);background:var(--bg2);color:var(--tx);font:500 .88rem Inter;cursor:pointer;transition:border-color .2s,color .2s}.share a:hover,.share button:hover{border-color:var(--acc);color:var(--acc)}
.author{display:flex;gap:1.2rem;padding:1.6rem;border-radius:var(--r);background:var(--bg2);border:1px solid var(--line)}.author .av{width:64px;height:64px;flex:none;font-size:1.1rem}.author h3{color:var(--hd)}.author p{color:var(--mut);font-size:.95rem;margin-top:.3rem}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media(min-width:720px){.cards{grid-template-columns:repeat(2,1fr)}.topics{grid-template-columns:repeat(2,1fr)}.ftr-g{grid-template-columns:1.4fr 1fr auto;align-items:start}.facts{grid-template-columns:repeat(4,1fr)}}
@media(min-width:900px){.menu{display:flex}.mtog{display:none}.hero-g{grid-template-columns:1.35fr 1fr}.about-g{grid-template-columns:1.2fr 1fr}}
@media(min-width:1080px){.cards{grid-template-columns:repeat(3,1fr)}.topics{grid-template-columns:repeat(4,1fr)}}
@media(max-width:719px){.sec{padding:4rem 0}.hero{padding:4.5rem 0 4rem}.facts{grid-template-columns:repeat(2,1fr)}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
/* WordPress extras */
.art-fb{position:absolute;inset:0;display:flex;align-items:flex-end;padding:1.2rem;background:radial-gradient(260px 160px at 85% 15%,rgba(32,201,180,.35),transparent 70%),linear-gradient(135deg,#0a1224,#13213f 60%,#123b4a)}
.art-fb span{font:600 1rem/1.35 Inter;color:#fff;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.hero-img .art-fb span{font-size:clamp(1.3rem,3vw,2rem);max-width:80%}
.thumb img,.hero-img img{width:100%;height:100%;object-fit:cover}
.pager{margin-top:3rem}.pager .nav-links{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center}.pager .page-numbers{min-width:42px;height:42px;padding:0 .8rem;display:grid;place-items:center;border-radius:10px;border:1px solid var(--line);background:var(--bg2);color:var(--tx);font-weight:600}.pager .current,.pager a:hover{border-color:var(--acc);color:var(--acc)}
.arch-h{padding:4.5rem 0 1rem}.arch-h h1{font-size:clamp(2rem,5vw,3rem);color:var(--hd);letter-spacing:-.03em;margin-top:.3rem}.arch-h p{color:var(--mut);margin-top:.6rem;max-width:40rem}
.sform{display:flex;gap:.5rem;max-width:520px;margin-top:1.4rem}.sform input{flex:1;padding:.8rem 1rem;border-radius:12px;border:1px solid var(--line);background:var(--bg2);color:var(--tx);font:inherit}.sform input:focus{outline:2px solid var(--acc);border-color:transparent}.sform .btn{border:0;cursor:pointer}
.e404{text-align:center;padding:7rem 0}.e404 .big{font:800 clamp(5rem,18vw,10rem)/1 Orbitron;background:linear-gradient(135deg,#20c9b4,#f0be46);-webkit-background-clip:text;background-clip:text;color:transparent}.e404 .sform{margin:1.5rem auto}
.empty{color:var(--mut);padding:2rem 0}
.prose img{border-radius:12px;height:auto}.prose figcaption{color:var(--mut);font-size:.88rem;text-align:center;margin-top:.5rem}
.prose pre{border-radius:14px;background:var(--code);border:1px solid #1c2a4a;padding:1.1rem 1.2rem;overflow:auto;font:400 .9rem/1.7 "JetBrains Mono",monospace;color:#dbe3f0}
.prose .code pre{border:0;border-radius:0}.prose pre code{font:inherit;background:none;color:inherit;padding:0}
.alignwide{max-width:1000px;margin-left:auto;margin-right:auto}.alignfull{width:100vw;margin-left:calc(50% - 50vw)}.aligncenter{margin-left:auto;margin-right:auto}
.wp-block-embed iframe,.prose iframe{max-width:100%}.prose .wp-block-button__link{background:var(--teal);color:var(--navy);border-radius:12px;border:0;padding:.8rem 1.4rem;font-weight:600}
.page-links,.tags-row{margin-top:2rem;display:flex;gap:.5rem;flex-wrap:wrap}.tags-row a{font-size:.85rem;padding:.3rem .8rem;border-radius:99px;border:1px solid var(--line);color:var(--tx)}
.comments{margin-top:3rem}.comments h2{font-size:1.4rem}.comment-list{list-style:none;margin:1.5rem 0}.comment-list li{padding:1rem 0;border-bottom:1px solid var(--line)}.comment-form input,.comment-form textarea{width:100%;padding:.7rem;border:1px solid var(--line);border-radius:10px;background:var(--bg2);color:var(--tx);font:inherit}.comment-form p{margin-top:1rem}.comment-form .submit{width:auto;background:var(--teal);color:var(--navy);border:0;font-weight:600;padding:.8rem 1.4rem;cursor:pointer}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.custom-logo{max-height:40px;width:auto}
.menu .current-menu-item a,.menu .current_page_parent a{color:var(--hd);background:var(--bg3)}

/* 1.0.1: explicit section/footer surfaces for both modes (beats core/global-styles backgrounds) */
html[data-theme] body{background-color:var(--bg);color:var(--tx)}
html[data-theme] .sec{background-color:var(--bg);color:var(--tx)}
html[data-theme] .sec.alt{background-color:var(--bg3)}
html[data-theme] .sec.about{background-color:var(--bg2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
html[data-theme] .sec.about .fact,html[data-theme] .sec.about .chips span{background-color:var(--bg)}
html[data-theme] .ftr{background-color:var(--bg2);color:var(--mut)}
html[data-theme] .ftr .sig{color:var(--hd)}
html[data-theme] .about-g h2,html[data-theme] .skills h3{color:var(--hd)}
[data-theme=dark] .sec.about{background-image:radial-gradient(500px 300px at 90% 10%,rgba(32,201,180,.07),transparent 70%)}
.empty{text-align:center;padding:3rem 1rem;border:1px dashed var(--line);border-radius:var(--r);background:var(--bg2)}.empty h2{font-size:1.4rem}.empty p{color:var(--mut);margin-top:.5rem}
/* 1.0.2: logo B */
:root{--lfg:#fff;--lteal:#20c9b4;--lgold:#f0be46}
[data-theme=light]{--lfg:#0a1224;--lteal:#0e9e8c;--lgold:#c48d12}
.logo{display:inline-flex;align-items:center;line-height:0}.logo-hdr{margin-right:auto}
.logo-svg{display:block;width:auto;height:38px}.logo-ftr .logo-svg{height:40px}
.logo:hover .logo-svg{filter:drop-shadow(0 0 10px color-mix(in srgb,var(--lteal) 45%,transparent))}
.logo-svg path,.logo-svg rect{transition:fill .3s,stroke .3s}
@media(max-width:400px){.logo-svg{height:28px}}
/* 1.0.3: featured image uncropped at 16:9; card thumbs 16:9 cover, centred */
.hero-img{aspect-ratio:16/9;background:#0a1224;margin:0 auto 3rem;padding:0}
.hero-img img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;border-radius:inherit}
.thumb{display:block;aspect-ratio:16/9}
.thumb img{display:block;width:100%;height:100%;object-fit:cover;object-position:center center;transition:transform .5s}
.card:hover .thumb img{transform:scale(1.03)}
@media(max-width:719px){.hero-img{border-radius:14px;margin-bottom:2rem}}
/* 1.0.4: every card frame (incl. first/sticky/featured variants) is a 16:9 box showing the whole image */
.cards>*,.cards>.card:first-child,.cards>.sticky{grid-column:auto!important;grid-row:auto!important}
.card .thumb,.card:first-child .thumb,.sticky .thumb{display:block!important;flex:none!important;width:100%!important;height:auto!important;max-height:none!important;min-height:0!important;aspect-ratio:16/9!important;background:#0a1224;overflow:hidden}
.card .thumb img{position:static!important;width:100%!important;height:100%!important;max-height:none!important;aspect-ratio:16/9;object-fit:contain!important;object-position:center!important}
.card:hover .thumb img{transform:scale(1.02)}
