:root{--bg:#090b0f;--panel:#11151b;--panel-2:#171c23;--text:#f2f4f5;--muted:#939ca7;--line:#27303a;--orange:#ff7a2f;--amber:#ffc15c;--cyan:#5ed7ff;--font:'Kanit','Noto Sans SC',sans-serif;--cn:'Noto Sans SC',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);overflow-x:hidden}.grain{position:fixed;inset:0;pointer-events:none;z-index:80;opacity:.035;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='3' stitchTiles='stitch'/%3E%3C/filter id='n'/%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.progress{position:fixed;left:0;top:0;height:2px;background:linear-gradient(90deg,var(--orange),var(--cyan));z-index:100;width:0}.topbar{position:fixed;inset:0 0 auto;z-index:70;height:72px;padding:0 5vw;display:flex;align-items:center;background:rgba(9,11,15,.78);border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(18px)}.brand{display:flex;align-items:center;gap:11px;color:var(--text);font-size:11px;letter-spacing:.14em;text-decoration:none}.brand span{width:34px;height:34px;border:1px solid var(--orange);display:grid;place-items:center;color:var(--orange);font-weight:700}.topbar nav{margin-left:auto;display:flex;gap:28px}.topbar nav a{color:var(--muted);text-decoration:none;font:12px var(--cn)}.topbar nav a:hover{color:var(--text)}.section{max-width:1440px;margin:auto;padding:110px 7vw}.hero{min-height:100svh;padding-top:140px;display:grid;grid-template-columns:.92fr 1.08fr;gap:7vw;align-items:center;background:radial-gradient(700px circle at 12% 40%,rgba(68,105,157,.16),transparent 68%)}.eyebrow,.index{margin:0;color:var(--orange);font-size:11px;font-weight:600;letter-spacing:.2em}h1,h2,h3,p{margin-top:0}h1{font:700 clamp(54px,6vw,88px)/1.02 var(--cn);letter-spacing:-.065em;margin:28px 0}h1 em,h2 span{font-style:normal;color:var(--amber)}.lead,.section-copy{color:var(--muted);font:16px/1.85 var(--cn);max-width:720px}.meta{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:48px}.meta div{border-top:1px solid var(--line);padding-top:14px}.meta small,.meta b{display:block}.meta small{color:var(--muted);font:11px var(--cn)}.meta b{margin-top:7px;font:500 13px var(--cn)}.hero-visual{margin:0;position:relative}.hero-visual:before{content:"";position:absolute;inset:-8%;border:1px solid rgba(94,215,255,.16);transform:rotate(3deg);z-index:-1}.hero-visual img{display:block;width:100%;border-radius:4px;box-shadow:0 45px 100px rgba(0,0,0,.55)}.hero-visual figcaption{margin-top:15px;color:var(--muted);font-size:10px;letter-spacing:.16em;text-align:right}.section-head{max-width:1000px}.section-head h2,.reflection h2{font:700 clamp(44px,5vw,70px)/1.12 var(--cn);letter-spacing:-.045em;margin:22px 0 0}.context{border-top:1px solid var(--line)}.context-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:55px}.context-grid article{min-height:250px;padding:32px;background:var(--panel)}.context-grid i{color:var(--orange);font-style:normal;font-size:11px}.context-grid h3{font:600 25px var(--cn);margin:70px 0 14px}.context-grid p,.role-grid p,.decision p,.decision li,.evidence-card p,.reflection p,.learning-list p{color:var(--muted);font:13px/1.75 var(--cn)}.brief{display:grid;grid-template-columns:160px 1fr;gap:40px;border-block:1px solid var(--line);padding:26px 0;margin-top:55px}.brief span{color:var(--orange);font:11px var(--cn)}.brief p{font:500 21px/1.6 var(--cn);margin:0}.role{max-width:none;background:#0d1015}.role-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:55px;border:1px solid var(--line)}.role-grid article{padding:32px;border-right:1px solid var(--line)}.role-grid article:last-child{border:0}.role-grid b{font:600 20px var(--cn)}.role-grid p{margin:18px 0 0}.flow-section{max-width:none;background:linear-gradient(180deg,#11161d,#0b0e13)}.flow{max-width:1240px;margin:55px auto 0;display:grid;grid-template-columns:repeat(4,1fr)}.flow-step{position:relative;text-align:left;padding:26px 22px;background:transparent;color:var(--muted);border:1px solid var(--line);cursor:pointer}.flow-step+button{border-left:0}.flow-step i,.flow-step b,.flow-step span{display:block}.flow-step i{color:var(--orange);font-style:normal;font-size:10px}.flow-step b{font:600 19px var(--cn);margin:26px 0 6px}.flow-step span{font:11px var(--cn)}.flow-step.active{background:var(--text);color:#111}.flow-step.active i{color:#d64d0a}.flow-detail{max-width:1240px;margin:auto;display:grid;grid-template-columns:.75fr 1.25fr;min-height:520px;background:var(--panel)}.flow-detail>div{padding:55px}.flow-detail small{color:var(--cyan);font-size:10px;letter-spacing:.18em}.flow-detail h3{font:600 34px/1.25 var(--cn);margin:24px 0 18px}.flow-detail p,.flow-detail li{color:var(--muted);font:13px/1.8 var(--cn)}.flow-detail ul{padding-left:1.2em;margin-top:28px}.flow-detail img{width:100%;height:100%;object-fit:cover;transition:opacity .18s}.decision-list{margin-top:70px}.decision{display:grid;grid-template-columns:.72fr 1.28fr;gap:6vw;align-items:center;padding:58px 0;border-top:1px solid var(--line)}.decision.reverse{grid-template-columns:1.28fr .72fr}.decision.reverse .decision-copy{order:2}.decision-copy>span,.evidence-card figcaption>span{color:var(--orange);font-size:10px;letter-spacing:.16em}.decision h3{font:600 31px/1.25 var(--cn);margin:20px 0}.decision ul{padding-left:1.2em;margin-top:22px}.decision figure{margin:0}.decision figure img{display:block;width:100%;border:1px solid var(--line)}.decision figcaption{padding:14px 0;color:var(--muted);font:11px/1.6 var(--cn)}.evidence{max-width:none;background:#0d1015}.evidence-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:60px}.evidence-card{margin:0;background:var(--panel);border:1px solid var(--line);overflow:hidden;cursor:zoom-in}.evidence-card.wide{grid-column:1/-1}.evidence-card img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;transition:transform .35s}.evidence-card:hover img{transform:scale(1.012)}.evidence-card figcaption{padding:25px}.evidence-card b{display:block;font:600 21px var(--cn);margin:12px 0 7px}.evidence-card p{margin:0}.reflection{display:grid;grid-template-columns:1.05fr .95fr;gap:9vw}.reflection-copy>p:last-child{font-size:15px;margin-top:28px}.learning-list article{display:flex;gap:22px;padding:24px 0;border-top:1px solid var(--line)}.learning-list i{color:var(--orange);font-style:normal;font-size:10px}.learning-list b{font:600 17px var(--cn)}.learning-list p{margin:6px 0 0}footer{height:150px;padding:0 7vw;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:10px;letter-spacing:.15em}footer a{color:var(--text)}dialog{width:min(94vw,1500px);height:auto;max-height:92vh;padding:0;border:0;background:#080a0e;color:#fff}dialog::backdrop{background:rgba(0,0,0,.9);backdrop-filter:blur(8px)}dialog img{display:block;width:100%}dialog button{position:fixed;right:4vw;top:3vh;padding:12px 18px;border:0;background:#fff;color:#111;cursor:pointer}.reveal{opacity:0;transform:translateY(24px);transition:.7s ease}.reveal.visible{opacity:1;transform:none}@media(max-width:850px){.topbar{height:64px;padding:0 18px}.topbar nav{display:none}.section{padding:78px 20px}.hero{grid-template-columns:1fr;gap:48px;padding-top:110px}.hero h1{font-size:44px}.meta{grid-template-columns:1fr 1fr}.section-head h2,.reflection h2{font-size:38px}.context-grid,.role-grid,.flow,.flow-detail,.decision,.decision.reverse,.evidence-grid,.reflection{grid-template-columns:1fr}.context-grid article{min-height:190px}.context-grid h3{margin-top:35px}.brief{grid-template-columns:1fr;gap:12px}.flow-step+button{border-left:1px solid var(--line);border-top:0}.flow-detail{min-height:0}.flow-detail>div{padding:34px 24px}.flow-detail img{aspect-ratio:16/9}.decision,.decision.reverse{gap:26px}.decision.reverse .decision-copy{order:0}.evidence-card.wide{grid-column:auto}.role-grid article{border-right:0;border-bottom:1px solid var(--line)}.role-grid article:last-child{border-bottom:0}.reflection{gap:50px}}@media(max-width:520px){.meta{grid-template-columns:1fr}.hero h1{font-size:39px}.section-head h2,.reflection h2{font-size:36px}.lead{font-size:14px}.flow-step{padding:20px}.flow-step b{margin-top:14px}.decision h3{font-size:27px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.evidence-card img{transition:none}}
