:root {
  --paper:#e9ece6;
  --ink:#171914;
  --muted:#676b63;
  --line:rgba(23,25,20,.18);
}
*{box-sizing:border-box}
html{background:var(--paper);color:var(--ink);scroll-behavior:smooth}
body{margin:0;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;background:var(--paper)}
a,button{font:inherit}
a{color:inherit}
button{color:inherit}
.shell{width:min(100%,1040px);margin:0 auto;padding:env(safe-area-inset-top) 18px calc(36px + env(safe-area-inset-bottom))}
.topbar{height:72px;display:flex;align-items:center;justify-content:space-between}
.brand{text-decoration:none;font-size:15px;font-weight:800;letter-spacing:.21em}
.topnav{display:flex;gap:18px}
.topnav a,.back{font-size:10px;letter-spacing:.12em;text-decoration:none}
.visual-frame{position:relative;overflow:hidden;width:100%;height:min(66vh,680px);min-height:470px;background:linear-gradient(145deg,#87968d 0%,#c8cec7 42%,#6f7a73 100%);border-radius:2px;isolation:isolate}
.visual-frame::after{content:"";position:absolute;inset:-20%;background:radial-gradient(circle at 70% 36%,rgba(250,241,217,.38),transparent 24%),linear-gradient(122deg,transparent 35%,rgba(255,255,255,.08) 54%,transparent 70%);animation:drift 14s ease-in-out infinite alternate;z-index:2}
@keyframes drift{from{transform:translate3d(-2%,1%,0) scale(1)}to{transform:translate3d(3%,-2%,0) scale(1.06)}}
.noise{position:absolute;inset:0;z-index:3;opacity:.20;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.28'/%3E%3C/svg%3E");mix-blend-mode:soft-light}
.ghost{position:absolute;border-radius:50%;filter:blur(2px);opacity:.62;transition:transform 1.1s ease}
.ghost-a{width:68%;aspect-ratio:1/1.25;right:-7%;bottom:-30%;background:rgba(232,222,202,.62);transform:rotate(-7deg)}
.ghost-b{width:34%;aspect-ratio:1/1.2;left:12%;top:8%;background:rgba(72,89,78,.32);transform:rotate(9deg)}
.visual-frame.shift .ghost-a{transform:translate3d(12px,-9px,0) rotate(-3deg) scale(1.04)}
.visual-frame.shift .ghost-b{transform:translate3d(-12px,8px,0) rotate(5deg) scale(.98)}
.visual-copy{position:absolute;z-index:4;left:24px;right:24px;bottom:54px;color:#f6f7f2;text-shadow:0 1px 14px rgba(0,0,0,.22)}
.eyebrow{font:10px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.18em;opacity:.82}
.visual-copy h1{margin:10px 0 8px;max-width:760px;font:500 clamp(30px,6vw,64px)/1.08 "Yu Mincho","Hiragino Mincho ProN",serif;letter-spacing:.02em}
.visual-copy p{margin:0;font-size:12px;opacity:.88}
.progress{position:absolute;z-index:5;left:0;right:0;bottom:0;height:2px;background:rgba(255,255,255,.24)}
.progress span{display:block;width:20%;height:100%;background:#fff;transition:width .45s ease}
.meta{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding:16px 1px 18px;border-bottom:1px solid var(--line)}
.counter{margin:0 0 5px;font:11px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.15em}
.micro{margin:0;font-size:9px;line-height:1.55;color:var(--muted)}
.more{border-bottom:1px solid currentColor;text-decoration:none;padding:2px 0 4px;font-size:11px;white-space:nowrap}
.actions{display:grid;grid-template-columns:1.45fr 1fr;gap:10px;padding-top:12px}
.next,.outline{min-height:62px;display:flex;align-items:center;justify-content:space-between;border:1px solid var(--ink);padding:0 18px;text-decoration:none;cursor:pointer}
.next{background:var(--ink);color:var(--paper)}
.outline{background:transparent;color:var(--ink);font-size:13px}
.manifesto,.policy{padding:92px 3px 72px;border-bottom:1px solid var(--line)}
.section-label{margin:0 0 18px;font:10px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.16em;color:var(--muted)}
.manifesto h2,.policy h2{margin:0 0 32px;font:400 clamp(30px,5vw,52px)/1.28 "Yu Mincho","Hiragino Mincho ProN",serif;letter-spacing:.02em}
.bodycopy{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.bodycopy p,.policy li{font-size:13px;line-height:2;color:#42463f}
.themes{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);margin-top:1px}
.themes article{background:var(--paper);padding:34px 24px 38px;min-height:190px}
.themes span{font:10px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--muted)}
.themes h3{margin:34px 0 12px;font:400 25px "Yu Mincho","Hiragino Mincho ProN",serif}
.themes p{margin:0;color:var(--muted);font-size:12px;line-height:1.8}
.policy ul{margin:0;padding-left:1.3em;max-width:780px}
.policy li+li{margin-top:12px}
.footer{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:end;padding:46px 3px 10px}
.footer nav{display:flex;gap:18px;flex-wrap:wrap;justify-content:flex-end}
.footer nav a,.footer>p,.footer.compact a{font-size:10px;color:var(--muted);text-decoration:none}
.footer>p{grid-column:1/-1;margin:18px 0 0}
.subpage{min-height:100vh}
.legal{max-width:760px;padding:72px 2px 90px}
.legal h1{margin:0 0 46px;font:400 clamp(34px,6vw,58px)/1.2 "Yu Mincho","Hiragino Mincho ProN",serif}
.legal h2{margin:48px 0 14px;font:500 18px "Yu Mincho","Hiragino Mincho ProN",serif}
.legal p{font-size:13px;line-height:2.05;color:#3f433d}
.footer.compact{display:flex;justify-content:flex-start;gap:18px;border-top:1px solid var(--line)}
@media(max-width:640px){
  .shell{padding-left:12px;padding-right:12px}
  .topbar{height:58px}
  .visual-frame{height:63vh;min-height:480px}
  .visual-copy{left:18px;right:18px;bottom:42px}
  .actions{grid-template-columns:1fr}
  .outline{min-height:52px}
  .meta{align-items:center}
  .micro{max-width:230px}
  .bodycopy,.themes{grid-template-columns:1fr}
  .manifesto,.policy{padding-top:70px}
  .footer{grid-template-columns:1fr}
  .footer nav{justify-content:flex-start}
}
