@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;src:url('/assets/manrope-latin-var.woff2') format('woff2')}
:root{
  --bg:#0d0f14;--surface:#13171e;--bd:#222834;--bds:#1a1f28;--ink:#f4f6f9;--tx:#dee2e8;--mu:#99a1ad;--ft:#7c8593;
  --ac:#79a4fa;--act:rgba(121,164,250,.13);--tgs:#242c3a;--tgb:#3c4554;--tgi:#f5c451;--on-ac:#0a0d12;
}
html[data-theme="light"]{
  --bg:#ffffff;--surface:#f7f8fa;--bd:#e7e9ee;--bds:#eef0f3;--ink:#0b0b0c;--tx:#23272e;--mu:#5f6672;--ft:#878d97;
  --ac:#0057D9;--act:rgba(0,87,217,.08);--tgs:#f3f4f6;--tgb:#d4d8e0;--tgi:#2563eb;--on-ac:#fff;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--tx);font-family:'Manrope','Inter',system-ui,-apple-system,sans-serif;line-height:1.6;transition:background-color .3s,color .2s;-webkit-font-smoothing:antialiased}
.wrap{max-width:760px;margin:0 auto;padding:0 24px}
a{color:inherit}
/* nav */
nav{display:flex;align-items:center;justify-content:space-between;padding:26px 0;max-width:760px;margin:0 auto;padding-left:24px;padding-right:24px}
.brand{font-size:13px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--ink)}
.navright{display:flex;align-items:center;gap:14px}
.loginlink{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--mu);text-decoration:none;padding:6px 13px;border:1px solid var(--bds);border-radius:999px;transition:color .15s,border-color .15s,background-color .15s}
.loginlink:hover{color:var(--ac);border-color:var(--ac);background:var(--act)}
.loginlink .ti{font-size:14px}
.toggle{width:38px;height:38px;padding:0;border-radius:10px;border:1px solid var(--tgb);background:var(--tgs);color:var(--tgi);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background-color .2s,border-color .2s,color .2s}
.toggle:hover{border-color:var(--ac)}.toggle svg{width:19px;height:19px}
/* hero */
.hero{padding:60px 0 30px}
.eyebrow{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ac);background:var(--act);padding:6px 13px;border-radius:999px;margin-bottom:26px}
h1{font-size:46px;line-height:1.08;font-weight:800;letter-spacing:-.035em;color:var(--ink);max-width:18ch}
.hero .lead{font-size:19px;color:var(--mu);margin-top:22px;max-width:54ch}
.hero .lead b{color:var(--tx);font-weight:600}
/* sections */
section{padding:46px 0;border-top:1px solid var(--bds)}
.kicker{font-size:12px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--ft);margin-bottom:22px;display:flex;align-items:center;gap:9px}
.kicker .ti{font-size:15px;color:var(--ac)}
h2{font-size:26px;font-weight:700;letter-spacing:-.02em;color:var(--ink);margin-bottom:6px}
.sub{color:var(--mu);font-size:15px;margin-bottom:22px}
/* now list */
.now{list-style:none;display:flex;flex-direction:column;gap:15px}
.now li{display:flex;gap:13px;font-size:16px;color:var(--tx)}
.now li .ti{color:var(--ac);font-size:18px;margin-top:2px;flex-shrink:0}
.now li b{color:var(--ink);font-weight:600}
.stamp{font-size:12.5px;color:var(--ft);margin-top:20px;font-style:italic}
/* reading */
.books{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.book{background:var(--surface);border:1px solid var(--bd);border-radius:13px;padding:16px 17px}
.book .t{font-size:15px;font-weight:700;color:var(--ink);letter-spacing:-.01em}
.book .a{font-size:13px;color:var(--mu);margin-top:2px}
.book .n{font-size:13px;color:var(--tx);margin-top:9px;line-height:1.5}
.tag{display:inline-block;font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ac);background:var(--act);padding:2px 8px;border-radius:6px;margin-top:11px}
/* writing */
.posts{display:flex;flex-direction:column}
.post{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:15px 0;border-bottom:1px solid var(--bds);text-decoration:none}
.post:last-child{border-bottom:none}
.post .pt{font-size:16.5px;font-weight:600;color:var(--ink);transition:color .15s}
.post:hover .pt{color:var(--ac)}
.post .pd{font-size:12.5px;color:var(--ft);font-variant-numeric:tabular-nums;white-space:nowrap}
/* exploring */
.q{display:flex;flex-direction:column;gap:16px}
.q .item{font-size:17px;color:var(--tx);font-weight:500;padding-left:18px;border-left:2px solid var(--bd);line-height:1.5}
.q .item:hover{border-color:var(--ac)}
/* about */
.about p{font-size:16px;color:var(--tx);margin-bottom:14px;max-width:62ch}
.creds{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.cred{font-size:12.5px;font-weight:600;color:var(--mu);border:1px solid var(--bd);border-radius:8px;padding:6px 11px}
/* footer */
footer{padding:40px 0 60px;border-top:1px solid var(--bds);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px}
.links{display:flex;gap:26px;flex-wrap:wrap}
.slk{font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--mu);text-decoration:none;transition:color .15s}
.slk:hover{color:var(--ac)}
.fnote{font-size:12px;color:var(--ft);font-variant-numeric:tabular-nums}
/* journey globe */
.globe{width:100%;height:600px;margin:6px 0 2px;cursor:grab;position:relative;overflow:hidden}
.globe:active{cursor:grabbing}
/* readable globe pins */
.gpin{position:relative;width:0;height:0;pointer-events:none;font-family:'Manrope',sans-serif;transition:opacity .25s}
.gpin .gd{position:absolute;top:0;left:0;transform:translate(-50%,-50%);width:8px;height:8px;border-radius:50%;background:var(--ac);box-shadow:0 0 0 3px rgba(121,164,250,.16)}
.gpin .gl{position:absolute;top:0;left:0;font-size:11.5px;font-weight:700;color:var(--ink);background:var(--bg);padding:1px 6px;border-radius:5px;letter-spacing:.01em;white-space:nowrap}
.gpin.exp .gd{width:5px;height:5px;background:var(--mu);box-shadow:0 0 0 2.5px var(--bg)}
.gpin.exp .gl{font-size:9.5px;font-weight:600;color:var(--mu);background:var(--bg);padding:1px 5px;border-radius:4px;letter-spacing:.06em;text-transform:uppercase}
.gpin.d-r .gl{transform:translate(9px,-50%)}
.gpin.d-l .gl{transform:translate(calc(-100% - 9px),-50%)}
.gpin.d-t .gl{transform:translate(-50%,calc(-100% - 9px))}
.gpin.d-b .gl{transform:translate(-50%,9px)}
.gpin.d-tr .gl{transform:translate(9px,calc(-100% - 2px))}
.gpin.d-br .gl{transform:translate(9px,2px)}
.gpin.d-tl .gl{transform:translate(calc(-100% - 9px),calc(-100% - 2px))}
.gpin.d-bl .gl{transform:translate(calc(-100% - 9px),2px)}
.legend{display:flex;flex-wrap:wrap;gap:18px;margin-top:10px}
.legend span{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--mu);font-weight:500}
.legend .dot{width:9px;height:9px;border-radius:50%;display:inline-block}
/* transition journal */
.journal{display:flex;flex-direction:column;gap:0}
.entry{display:grid;grid-template-columns:90px 1fr;gap:18px;padding:18px 0;border-bottom:1px solid var(--bds)}
.entry:last-child{border-bottom:none}
.entry .q{font-size:13px;font-weight:700;color:var(--ac);letter-spacing:.02em;padding-top:2px}
.entry .b{font-size:16px;color:var(--tx);line-height:1.55}
.entry .b b{color:var(--ink);font-weight:600}
@media(max-width:560px){h1{font-size:33px}.books{grid-template-columns:1fr}.hero{padding:40px 0 22px}.globe{height:320px}.entry{grid-template-columns:1fr;gap:5px}}
/* legend dots — externalised from inline style for CSP style-src 'self' (2026-06-22) */
.dot-ac{background:var(--ac)}
.dot-mu{background:var(--mu)}
