/* Shared reading surface. Derived from design/browser-mockup/style.css. */
@font-face{font-family:Poppins;src:url("/fonts/Poppins-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Poppins;src:url("/fonts/Poppins-SemiBold.ttf") format("truetype");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:Poppins;src:url("/fonts/Poppins-Italic.ttf") format("truetype");font-weight:400;font-style:italic;font-display:swap}
:root{color-scheme:light;--page:#eef7fc;--text:#273753;--heading:#10214e;--muted:#60708c;--accent:#805b36;--rule:#9e805d35;--code:#dceaf2;--ray:255,255,255;--ray-opacity:.68;--link:var(--accent);--leaf:#42634e;--leaf-wash:#54794b0d;--wood:var(--accent);--wood-wash:#a5703210;--detail-rule:var(--rule)}
:root[data-theme=dark]{color-scheme:dark;--page:#091728;--text:#eef2f8;--heading:#f3e9d6;--muted:#b4c3d5;--accent:#d8b071;--rule:#cfaa6b30;--code:#14283d;--ray:78,127,183;--ray-opacity:.14;--link:var(--accent);--leaf:#adc59a;--leaf-wash:#a5c38b0d;--wood-wash:#d8a05410}
*{box-sizing:border-box}html{min-height:100%;background:var(--page);scroll-padding-top:28px}body{margin:0;color:var(--text);font-family:Poppins,"Segoe UI",Arial,sans-serif;font-size:17px;line-height:1.65;background:radial-gradient(ellipse at 5% 0%,#c9e6fc88,transparent 58%);min-height:100vh;isolation:isolate}
:root[data-theme=dark] body{background:radial-gradient(ellipse at 10% 0%,#132e4d88,transparent 65%)}
body::before{content:"";position:absolute;inset:0 0 auto;height:680px;pointer-events:none;z-index:-1;opacity:var(--ray-opacity);background:linear-gradient(29deg,transparent 46%,rgba(var(--ray),.05) 47%,rgba(var(--ray),.85) 48%,rgba(var(--ray),.35) 49%,transparent 50%,transparent 54%,rgba(var(--ray),.65) 55%,rgba(var(--ray),.12) 57%,transparent 59%,transparent 62%,rgba(var(--ray),.65) 63%,rgba(var(--ray),.05) 65%,transparent 66%);mask-image:linear-gradient(to bottom,#000,transparent 95%)}
.page{max-width:680px;margin:0 auto;padding:30px 0 64px}nav{height:45px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--rule);margin-bottom:30px;color:var(--accent);font-size:14px;line-height:1.3}.back{display:inline-flex;align-items:center;gap:10px;min-height:44px;color:inherit;text-decoration:none}.back svg,footer svg{width:18px;height:18px;flex-shrink:0}.theme-toggle{width:44px;height:44px;display:grid;place-items:center;margin-right:-13px;padding:0;border:0;border-radius:0;background:none;box-shadow:none;color:var(--accent);cursor:pointer}.theme-toggle span{display:flex}.theme-toggle svg{width:18px;height:18px}.theme-toggle .sun{display:none}:root[data-theme=dark] .theme-toggle .moon{display:none}:root[data-theme=dark] .theme-toggle .sun{display:flex}
.theme-toggle:hover{opacity:.8}a:hover{text-decoration:underline;text-underline-offset:4px}:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.skip-link{position:absolute;left:16px;top:-100px;background:var(--page);color:var(--heading);padding:8px 12px;z-index:3}.skip-link:focus{top:8px}
h1,h2,h3,h4{color:var(--heading);font-weight:600;letter-spacing:-.035em;line-height:1.2}h1{font-size:36px;margin:0 0 8px}time{display:block;color:var(--accent);font-size:15px;line-height:1.5}.tags{color:var(--accent);font-size:14px;margin:6px 0 0;line-height:1.5}.article-header{margin-bottom:30px}article p{margin:0 0 22px}article h2,article h3{font-size:25px;margin:34px 0 10px}article img{display:block;width:auto;max-width:100%;height:auto;margin:24px auto 0;border-radius:14px}article p:has(>img){margin-bottom:14px}article img[src$="3c2e6d73-fa28-4a91-8a17-327d4825e2da.png"]{width:100%;max-height:250px;object-fit:contain;background:#fff}article center{font-size:12px;line-height:1.5;color:var(--muted);margin-top:-5px;margin-bottom:30px}article center sup,article center sub{font:inherit;position:static;vertical-align:baseline}article a{color:var(--link);overflow-wrap:anywhere}code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.86em;background:var(--code);border-radius:4px;padding:2px 5px;overflow-wrap:anywhere}pre{overflow:auto;max-width:100%;background:var(--code);padding:18px;border-radius:8px;line-height:1.55}pre code{padding:0;overflow-wrap:normal}li{padding-left:4px;margin:5px 0}li p{margin:0}ul,ol{padding-left:25px;margin:0 0 22px}.table-scroll{overflow-x:auto;margin:24px 0}table{border-collapse:collapse;min-width:560px;width:100%;font-size:14px}th,td{text-align:left;vertical-align:top;padding:12px;border-bottom:1px solid var(--rule)}th{color:var(--heading);font-weight:600}blockquote{margin:30px 0;padding:22px 26px;border-left:3px solid var(--accent);border-radius:0 12px 12px 0;background:rgba(128,91,54,.055);color:var(--text);line-height:1.8}
blockquote p:last-child{margin-bottom:0}blockquote em{font-style:normal}
:root[data-theme=dark] blockquote{background:rgba(216,176,113,.065)}
@media(max-width:760px){blockquote{padding:18px 20px}}footer{border-top:1px solid var(--rule);margin-top:48px;padding-top:22px;font-size:14px}footer a{display:inline-flex;align-items:center;gap:10px;color:var(--accent);text-decoration:none}.post-list{padding:0;list-style:none}.post-list li{padding:24px 0;border-bottom:1px solid var(--rule);margin:0}.post-list a{font-size:22px;color:var(--heading);font-weight:600;line-height:1.3;text-decoration:none;display:block;margin-bottom:8px}.post-list p{margin:10px 0 0;font-size:16px}.nav-name{color:var(--heading)}
@media(min-width:1440px){.page{padding-top:42px}}
@media(max-width:760px){.page{max-width:none;margin:0;padding:18px 24px 48px}nav{margin-bottom:26px}h1{font-size:30px;letter-spacing:-.035em}.article-header{margin-bottom:26px}body{font-size:16px;line-height:1.65}article h2,article h3{font-size:23px}article img[src$="3c2e6d73-fa28-4a91-8a17-327d4825e2da.png"]{max-height:200px}body::before{height:470px}.tags{font-size:13px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

/* Even ambient color continues through the document; soft light repeats without a fixed layer. */
body,body.home-surface{background:linear-gradient(110deg,rgba(181,215,237,.16),rgba(255,255,255,.30) 48%,rgba(241,201,135,.10));background-attachment:scroll}
body::before,body.home-surface::before{position:absolute;inset:0;height:auto;opacity:1;filter:none;mask-image:none;background:radial-gradient(ellipse 85vw 420px at 10% 50%,rgba(255,255,255,.46),transparent 100%),radial-gradient(ellipse 65vw 380px at 95% 50%,rgba(241,201,135,.10),transparent 100%);background-size:100% 1000px;background-repeat:repeat-y}
:root[data-theme=dark] body,:root[data-theme=dark] body.home-surface{background:linear-gradient(110deg,rgba(59,103,157,.12),transparent 48%,rgba(179,110,44,.06));background-attachment:scroll}
:root[data-theme=dark] body::before,:root[data-theme=dark] body.home-surface::before{opacity:1;filter:none;background:radial-gradient(ellipse 85vw 420px at 10% 50%,rgba(59,103,157,.08),transparent 100%),radial-gradient(ellipse 65vw 380px at 95% 50%,rgba(179,110,44,.06),transparent 100%);background-size:100% 1000px;background-repeat:repeat-y}
article figure{margin:24px 0}article figcaption{font-size:12px;line-height:1.5;color:var(--muted);text-align:center;margin-top:8px}

/* Ambient lighting belongs to the document, so it moves with the reading surface. */
body{position:relative}

/* Home, archive and articles share the same content edges. */
.page{max-width:1040px}
@media(min-width:761px) and (max-width:1120px){.page{margin-left:40px;margin-right:40px}}
@media(max-width:760px){.page{margin-left:0;margin-right:0}}
