:root{
  --ink:#123b43;
  --ink-soft:#315c65;
  --muted:#61797d;
  --paper:#f5fbf9;
  --paper-2:#eaf7f5;
  --white:#fff;
  --line:rgba(18,59,67,.13);
  --teal:#1aa6a5;
  --blue:#527fc7;
  --yellow:#f2c84b;
  --coral:#ee806e;
  --green:#3e7865;
  --shadow:0 22px 60px rgba(18,59,67,.10);
  --serif:Georgia,"Times New Roman",serif;
  --sans:Arial,Helvetica,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);overflow-x:hidden}
a{color:inherit}
button,input{font:inherit}
a:focus-visible,button:focus-visible{outline:3px solid var(--yellow);outline-offset:4px}
.site-nav{position:sticky;top:0;z-index:60;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px 5%;background:rgba(245,251,249,.89);border-bottom:1px solid var(--line);backdrop-filter:blur(18px)}
.brand{font-weight:800;letter-spacing:3px;text-decoration:none;font-size:14px}
.nav-links{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.nav-links a{text-decoration:none;font-size:10px;letter-spacing:1.7px;text-transform:uppercase}
.magazine-hero{position:relative;isolation:isolate;padding:72px 6% 48px;overflow:hidden;background:
radial-gradient(circle at 10% 5%,rgba(69,202,191,.30),transparent 31%),
radial-gradient(circle at 88% 12%,rgba(87,133,210,.22),transparent 28%),
linear-gradient(180deg,#e9f8f5 0%,#f8fcfb 100%)}
.magazine-hero::after{content:"";position:absolute;inset:0;z-index:-1;opacity:.18;background-image:radial-gradient(rgba(18,59,67,.35) .7px,transparent .7px);background-size:14px 14px;mask-image:linear-gradient(to bottom,#000,transparent 76%)}
.hero-kicker,.micro-label{font-size:10px;letter-spacing:3.4px;text-transform:uppercase;font-weight:700}
.hero-kicker{opacity:.58;margin-bottom:18px}
.magazine-hero h1{font:normal clamp(58px,10vw,118px)/.86 var(--serif);letter-spacing:-6px;margin:0;max-width:980px}
.hero-intro{font:21px/1.62 var(--serif);max-width:760px;color:var(--ink-soft);margin:30px 0 0}
.featured-wrap{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(330px,.95fr);gap:36px;align-items:center;max-width:1180px;margin:58px auto 0}
.cover-shell{position:relative;aspect-ratio:4/5;border-radius:30px;overflow:hidden;box-shadow:var(--shadow);border:1px solid rgba(18,59,67,.10);background:#dff4ef}
.cover-shell.compact{aspect-ratio:4/5;border-radius:22px}
.cover-art{position:absolute;inset:0;overflow:hidden}
.cover-art.reality{background:linear-gradient(145deg,#dff7f2 0 44%,#cbdff4 44% 68%,#f2cb54 68%)}
.cover-art.human{background:linear-gradient(145deg,#d9f4f0 0 42%,#8ab2df 42% 72%,#ef8c75 72%)}
.cover-title{position:absolute;left:7%;right:7%;bottom:8%;font:normal clamp(28px,4.8vw,60px)/.92 var(--serif);letter-spacing:-2px;z-index:4}
.cover-shell.compact .cover-title{font-size:clamp(25px,3vw,39px)}
.cover-issue{position:absolute;top:6%;left:7%;z-index:4;font-size:9px;letter-spacing:2.6px;font-weight:800}
.cover-source{position:absolute;top:6%;right:7%;z-index:4;font-size:9px;letter-spacing:1.4px;padding:8px 10px;border-radius:999px;background:rgba(255,255,255,.72);border:1px solid rgba(18,59,67,.12)}
.reality .shape-circle{position:absolute;width:42%;aspect-ratio:1;border:13px solid rgba(18,59,67,.82);border-right-color:transparent;border-radius:50%;left:13%;top:18%;transform:rotate(-22deg)}
.reality .shape-head{position:absolute;width:25%;height:43%;border-radius:50% 50% 40% 40%;background:rgba(18,59,67,.88);right:14%;top:19%}
.reality .shape-wave{position:absolute;left:-10%;right:-10%;top:55%;height:60px;background:repeating-radial-gradient(ellipse at center,transparent 0 12px,rgba(255,255,255,.85) 13px 15px,transparent 16px 26px);transform:rotate(-7deg);opacity:.75}
.reality .shape-atom{position:absolute;width:120px;height:120px;left:18%;bottom:18%;border:2px solid rgba(18,59,67,.45);border-radius:50%;transform:scaleY(.38) rotate(28deg)}
.reality .shape-atom::before,.reality .shape-atom::after{content:"";position:absolute;inset:0;border:2px solid rgba(18,59,67,.45);border-radius:50%}
.reality .shape-atom::before{transform:rotate(60deg)}
.reality .shape-atom::after{transform:rotate(-60deg)}
.human .face-a,.human .face-b{position:absolute;top:18%;width:31%;height:38%;border-radius:48% 48% 44% 44%;border:3px solid rgba(18,59,67,.74)}
.human .face-a{left:10%;background:rgba(255,255,255,.22)}
.human .face-b{right:10%;background:rgba(18,59,67,.10)}
.human .bio-line{position:absolute;left:22%;right:22%;top:38%;height:3px;background:var(--ink);transform:rotate(-9deg)}
.human .chess{position:absolute;left:15%;bottom:24%;width:38px;height:52px;background:var(--ink);clip-path:polygon(30% 0,70% 0,77% 16%,66% 33%,75% 75%,90% 100%,10% 100%,25% 75%,34% 33%,23% 16%)}
.human .empathy{position:absolute;right:16%;bottom:22%;width:72px;height:72px;border:9px solid rgba(255,255,255,.82);border-radius:50%}
.human .dopamine{position:absolute;right:40%;bottom:31%;width:9px;height:9px;border-radius:50%;background:var(--coral);box-shadow:18px -13px 0 #fff,36px 4px 0 var(--yellow),56px -9px 0 #fff}
.featured-copy{padding:20px 4px}
.featured-copy h2{font:normal clamp(40px,5.7vw,72px)/.98 var(--serif);letter-spacing:-3px;margin:14px 0 18px}
.featured-hook{font:20px/1.55 var(--serif);color:var(--ink-soft);margin:0 0 23px}
.meta-row,.tag-row,.badge-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.meta-row{font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:var(--muted);margin-bottom:16px}
.tag,.filter-chip,.idea-node{border:1px solid var(--line);background:rgba(255,255,255,.66);border-radius:999px;padding:8px 11px;font-size:9px;letter-spacing:1.1px;text-transform:uppercase;text-decoration:none;cursor:pointer}
.tag:hover,.filter-chip:hover,.filter-chip.active,.idea-node:hover{background:var(--ink);color:#fff}
.badge{font-size:9px;letter-spacing:1px;text-transform:uppercase;border-radius:999px;padding:7px 9px;background:#fff6cd;border:1px solid rgba(177,137,25,.2)}
.cta-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}
.button{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border-radius:999px;padding:14px 18px;font-size:10px;letter-spacing:1.7px;text-transform:uppercase;border:1px solid var(--ink)}
.button.primary{background:var(--ink);color:white}
.button.secondary{background:transparent}
.button:hover{transform:translateY(-2px)}
.discovery{max-width:1180px;margin:auto;padding:76px 6% 110px}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:27px}
.section-head h2{font:normal clamp(36px,5vw,62px)/1 var(--serif);letter-spacing:-2px;margin:10px 0 0}
.section-note{max-width:510px;color:var(--muted);line-height:1.65;font-size:14px}
.filter-bar{display:flex;gap:9px;overflow-x:auto;padding:5px 2px 19px;scrollbar-width:thin}
.shelf-wrap{position:relative}
.shelf-controls{display:flex;gap:8px;justify-content:flex-end;margin-bottom:11px}
.shelf-control{width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.75);cursor:pointer;color:var(--ink)}
.shelf{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(310px,380px);gap:22px;overflow-x:auto;padding:8px 6px 25px 2px;scroll-snap-type:x mandatory;scroll-padding-left:2px;overscroll-behavior-inline:contain;cursor:grab}
.shelf.dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.article-card{scroll-snap-align:start;background:white;border:1px solid var(--line);border-radius:28px;overflow:hidden;box-shadow:0 14px 36px rgba(18,59,67,.06);display:flex;flex-direction:column;min-height:610px;text-decoration:none;transition:transform .25s ease,box-shadow .25s ease}
.article-card:hover{transform:translateY(-7px);box-shadow:var(--shadow)}
.card-copy{padding:24px;display:flex;flex-direction:column;gap:14px;flex:1}
.card-copy h3{font:normal 31px/1.02 var(--serif);letter-spacing:-1px;margin:0}
.card-hook{font:16px/1.52 var(--serif);color:var(--ink-soft);margin:0}
.card-footer{margin-top:auto;padding-top:6px;display:flex;justify-content:space-between;gap:15px;font-size:9px;letter-spacing:1.2px;text-transform:uppercase}
.card-description{font-size:13px;line-height:1.55;color:var(--muted);max-height:0;opacity:0;overflow:hidden;transition:.25s ease}
.article-card:hover .card-description,.article-card:focus-visible .card-description{max-height:80px;opacity:1}
.connections{margin-top:70px;padding:34px;border-radius:30px;background:#e0f1ed;border:1px solid var(--line)}
.connections h3{font:normal 30px var(--serif);margin:0 0 17px}
.idea-cloud{display:flex;flex-wrap:wrap;gap:9px}
.empty-state{padding:28px;border-radius:22px;border:1px dashed var(--line);color:var(--muted);display:none}
.media-footer{padding:45px 6%;border-top:1px solid var(--line);font-size:10px;letter-spacing:2px;text-align:center;color:var(--muted)}
.progress{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--teal),var(--yellow),var(--coral));z-index:100}
.reader-hero{padding:60px 6% 45px;background:
radial-gradient(circle at 8% 10%,rgba(69,202,191,.22),transparent 31%),
linear-gradient(180deg,#eaf8f5,#f8fcfb)}
.reader-hero-inner{max-width:1130px;margin:auto;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(300px,.72fr);gap:50px;align-items:center}
.reader-hero h1{font:normal clamp(52px,8vw,94px)/.92 var(--serif);letter-spacing:-5px;margin:18px 0}
.reader-subtitle{font:20px/1.58 var(--serif);color:var(--ink-soft);max-width:760px}
.reader-main{max-width:1130px;margin:auto;padding:52px 6% 110px;display:grid;grid-template-columns:230px minmax(0,720px);gap:65px;align-items:start}
.toc{position:sticky;top:95px;border-left:1px solid var(--line);padding-left:18px}
.toc-title{font-size:9px;letter-spacing:2px;text-transform:uppercase;font-weight:800;margin-bottom:12px}
.toc a{display:block;text-decoration:none;font-size:12px;line-height:1.35;color:var(--muted);padding:7px 0}
.toc a:hover{color:var(--ink)}
.article-body{font:19px/1.84 var(--serif);color:#244e56}
.article-lead{font:23px/1.62 var(--serif);color:var(--ink);margin:0 0 46px}
.article-section{scroll-margin-top:100px;margin-bottom:54px}
.article-section h2{font:normal clamp(32px,4.5vw,48px)/1.08 var(--serif);letter-spacing:-1.5px;color:var(--ink);margin:0 0 24px}
.article-section p{margin:0 0 21px}
.section-label{display:inline-block;margin-bottom:13px;font:800 9px var(--sans);letter-spacing:1.7px;text-transform:uppercase;padding:7px 9px;border-radius:999px;background:#dfeee9}
.scientific-note{margin:28px 0;padding:23px 25px;border-radius:20px;background:#fff6cf;border-left:5px solid var(--yellow);font:16px/1.7 var(--sans)}
.scientific-note strong{display:block;font-size:9px;letter-spacing:1.7px;text-transform:uppercase;margin-bottom:10px}
.pullquote{margin:44px 0;padding:10px 0 10px 27px;border-left:5px solid var(--teal);font:italic 28px/1.4 var(--serif);color:var(--ink)}
.source-panel{margin-top:70px;padding:30px;border-radius:28px;background:#e2f2ef;border:1px solid var(--line)}
.source-panel h2{font:normal 32px var(--serif);margin:0 0 14px}
.transparency-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:23px 0}
.transparency-card{background:rgba(255,255,255,.7);border-radius:18px;padding:16px;border:1px solid var(--line)}
.transparency-card strong{font-size:9px;letter-spacing:1.4px;text-transform:uppercase;display:block;margin-bottom:8px}
.transparency-card span{font-size:12px;line-height:1.45;color:var(--muted)}
.source-link{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-top:10px;padding:14px 0;border-top:1px solid var(--line);text-decoration:none;font-size:13px}
.article-connections{margin-top:55px}
.article-connections h2{font:normal 32px var(--serif)}
.next-reading{margin-top:58px;border-top:1px solid var(--line);padding-top:35px}
.next-card{display:grid;grid-template-columns:150px 1fr;gap:25px;align-items:center;text-decoration:none}
.next-card .cover-shell{border-radius:18px}
.next-card h3{font:normal 29px/1.08 var(--serif);margin:5px 0 9px}
@media(max-width:880px){
  .featured-wrap,.reader-hero-inner{grid-template-columns:1fr}
  .featured-wrap .cover-shell{max-width:560px}
  .reader-main{grid-template-columns:1fr}
  .toc{position:relative;top:auto;border-left:0;border-bottom:1px solid var(--line);padding:0 0 20px;display:flex;gap:10px;overflow-x:auto}
  .toc-title{min-width:max-content;padding-top:7px}
  .toc a{min-width:180px;border:1px solid var(--line);border-radius:999px;padding:9px 12px}
  .transparency-grid{grid-template-columns:1fr}
}
@media(max-width:620px){
  .site-nav{align-items:flex-start}
  .nav-links{justify-content:flex-end}
  .magazine-hero{padding-top:50px}
  .magazine-hero h1,.reader-hero h1{letter-spacing:-3px}
  .hero-intro{font-size:18px}
  .featured-copy h2{letter-spacing:-2px}
  .shelf{grid-auto-columns:86vw}
  .article-card{min-height:560px}
  .reader-main{padding-left:5%;padding-right:5%}
  .article-body{font-size:18px}
  .next-card{grid-template-columns:110px 1fr}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}