:root{--ink:#17241f;--muted:#68736e;--paper:#f6f1e7;--card:#fffdf8;--line:#dcd5c6;--green:#0d604c;--lime:#bad65c;--violet:#7656a7;--red:#b94c3e;--blue:#3c6f8c;--gold:#d89d36;--shadow:0 20px 55px rgba(38,45,38,.08)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"IBM Plex Sans Thai",sans-serif;line-height:1.55}button,textarea{font:inherit;color:inherit}button,a{transition:transform .18s ease,background .18s ease,color .18s ease,border-color .18s ease}button:active,.button:active{transform:translateY(2px)}a{color:inherit;text-decoration:none}.site-head{position:sticky;top:0;z-index:10;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:14px max(24px,calc((100vw - 1180px)/2));border-bottom:1px solid rgba(23,36,31,.1);background:rgba(246,241,231,.88);backdrop-filter:blur(16px)}.brand{display:flex;align-items:center;gap:10px;font-weight:700}.brand i{display:grid;place-items:center;width:35px;height:35px;border-radius:50%;background:var(--ink);color:var(--paper);font-family:Newsreader,serif;font-style:normal}.site-head nav{display:flex;gap:28px;font-size:.86rem;font-weight:600}.site-head nav a:hover{color:var(--green)}.quiet{justify-self:end;border:0;background:transparent;font-size:.78rem;font-weight:700}.hero{width:min(1180px,calc(100% - 48px));min-height:660px;margin:auto;display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:70px;padding:78px 0}.kicker{margin:0 0 13px;color:var(--green);font-size:.72rem;font-weight:700;letter-spacing:.14em}.hero h1{margin:0;font:700 clamp(4rem,8vw,7.7rem)/.82 Newsreader,serif;letter-spacing:-.065em}.hero h1 em{color:var(--green);font-style:italic}.lead{max-width:650px;margin:30px 0;color:#53605a;font-size:1.08rem}.hero-actions{display:flex;gap:10px;flex-wrap:wrap}.button{display:inline-flex;justify-content:center;align-items:center;min-height:46px;padding:0 18px;border:1px solid var(--line);border-radius:12px;background:var(--card);font-size:.84rem;font-weight:700;cursor:pointer}.button:hover{border-color:var(--ink)}.button.primary{border-color:var(--ink);background:var(--ink);color:#fff}.button.primary:hover{background:var(--green);border-color:var(--green)}.button.full{width:100%}.gene-orbit{position:relative;aspect-ratio:1;max-width:490px;margin:auto;border:1px solid #cfc7b7;border-radius:50%;background:radial-gradient(circle,rgba(186,214,92,.24),transparent 42%)}.gene-orbit:before,.gene-orbit:after{content:"";position:absolute;inset:14%;border:1px dashed #beb6a7;border-radius:50%}.gene-orbit:after{inset:29%}.orbit-core{position:absolute;inset:37%;z-index:2;display:grid;place-content:center;text-align:center;border-radius:50%;background:var(--ink);color:#fff;box-shadow:var(--shadow)}.orbit-core strong{font:700 3.2rem/1 Newsreader,serif}.orbit-core span{font-size:.67rem;color:#c7d1cc}.gene-orbit>span{--angle:calc(var(--i)*60deg - 90deg);position:absolute;left:50%;top:50%;transform:rotate(var(--angle)) translateX(205px) rotate(calc(-1*var(--angle))) translate(-50%,-50%);padding:7px 10px;border:1px solid var(--line);border-radius:999px;background:var(--card);font-size:.73rem;font-weight:600;white-space:nowrap}.metrics{display:grid;grid-template-columns:repeat(4,1fr);width:min(1180px,calc(100% - 48px));margin:0 auto 110px;border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}.metrics article{padding:22px;border-right:1px solid var(--line)}.metrics article:last-child{border:0}.metrics small,.card-title small{display:block;color:var(--muted);font-size:.65rem;font-weight:700;letter-spacing:.11em}.metrics strong{display:block;margin:7px 0;font:700 2rem/1 Newsreader,serif}.metrics span{font-size:.73rem;color:var(--muted)}.section{width:min(1180px,calc(100% - 48px));margin:0 auto 120px}.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:30px}.section h2{margin:0;font:700 clamp(2.3rem,5vw,4.5rem)/.95 Newsreader,serif;letter-spacing:-.045em}.filters{display:flex;gap:7px;flex-wrap:wrap}.chip{padding:8px 13px;border:1px solid var(--line);border-radius:999px;background:transparent;font-size:.76rem;font-weight:600;cursor:pointer}.chip:hover,.chip.active{background:var(--ink);border-color:var(--ink);color:#fff}.book-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:17px}.book{overflow:hidden;border:1px solid var(--line);border-radius:18px;background:var(--card);box-shadow:0 12px 30px rgba(37,42,37,.04)}.book-cover{position:relative;aspect-ratio:4/3;padding:18px;background:var(--cover);color:#fff}.book-cover:after{content:"";position:absolute;inset:0;background:linear-gradient(150deg,transparent,rgba(0,0,0,.28))}.book-cover span,.book-cover strong{position:relative;z-index:1}.book-cover span{font-size:.65rem;letter-spacing:.1em}.book-cover strong{display:block;max-width:12ch;margin-top:33px;font:700 1.75rem/1 Newsreader,serif}.book-body{padding:16px}.book-body h3{margin:0 0 2px;font-size:.96rem}.book-body p{margin:0;color:var(--muted);font-size:.73rem}.mini-gene{display:flex;height:6px;margin-top:14px;overflow:hidden;border-radius:999px;background:#eee}.mini-gene i{width:calc(var(--score)*1%);background:var(--color)}.lab{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;padding:62px;border-radius:32px;background:var(--ink);color:#f6f1e7}.lab .kicker{color:var(--lime)}.lab h2{font-size:clamp(3rem,6vw,5.8rem)}.lab-copy>p:not(.kicker){color:#b9c4bf}.principle{display:grid;grid-template-columns:36px 1fr;gap:12px;padding:16px 0;border-top:1px solid #384740}.principle>span{color:var(--lime);font:700 1.3rem Newsreader,serif}.principle p{margin:2px 0 0;color:#9daba5;font-size:.74rem}.lab-card{align-self:center;padding:24px;border-radius:22px;background:#f8f3e9;color:var(--ink);box-shadow:0 30px 70px rgba(0,0,0,.22)}.lab-card label{display:block;margin-bottom:8px;font-size:.75rem;font-weight:700}.lab-card textarea{width:100%;resize:vertical;padding:15px;border:1px solid var(--line);border-radius:12px;background:#fffdf8;line-height:1.65}.lab-card textarea:focus{outline:2px solid var(--lime);outline-offset:2px}.input-meta{display:flex;justify-content:space-between;margin:7px 0 16px;color:var(--muted);font-size:.68rem}.text-button{padding:0;border:0;background:transparent;color:var(--green);font-weight:700;cursor:pointer}.result{display:none;margin-top:18px;padding-top:18px;border-top:1px solid var(--line)}.result.visible{display:block}.result-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:13px}.result-head strong{font:700 1.7rem Newsreader,serif}.result-head span{color:var(--muted);font-size:.7rem}.genre-row{display:grid;grid-template-columns:105px 1fr 48px;gap:10px;align-items:center;margin:8px 0;font-size:.72rem}.bar{height:8px;overflow:hidden;border-radius:999px;background:#e6e1d6}.bar i{display:block;height:100%;width:var(--value);background:var(--color);border-radius:inherit;animation:grow .55s ease both}@keyframes grow{from{width:0}}.evidence{display:flex;gap:5px;flex-wrap:wrap;margin-top:14px}.evidence span{padding:5px 8px;border-radius:999px;background:#e6ebd5;color:#405414;font-size:.67rem}.timeline-section{padding-top:10px}.section-note{max-width:370px;color:var(--muted);font-size:.8rem}.timeline-grid{display:grid;grid-template-columns:1.45fr .55fr;gap:18px}.dna-card,.events-card{padding:24px;border:1px solid var(--line);border-radius:22px;background:var(--card)}.card-title{display:flex;justify-content:space-between;align-items:start;margin-bottom:20px}.card-title h3{margin:4px 0 0;font:700 1.6rem Newsreader,serif}.card-title>span{font-size:.7rem;color:var(--muted)}#dnaChart{display:block;width:100%;height:300px}.legend{display:flex;gap:12px;flex-wrap:wrap;margin-top:14px}.legend span{display:flex;align-items:center;gap:5px;color:var(--muted);font-size:.65rem}.legend i{width:8px;height:8px;border-radius:50%;background:var(--color)}.live{display:flex;align-items:center;gap:6px}.live i{width:7px;height:7px;border-radius:50%;background:#55a66b;box-shadow:0 0 0 4px #dcecdf}.event-list{padding:0;margin:0 0 18px;list-style:none}.event-list li{display:grid;grid-template-columns:56px 1fr;gap:12px;padding:15px 0;border-top:1px solid var(--line)}.event-list b{align-self:start;padding:4px 6px;border-radius:6px;background:#e8eed1;color:#53651b;font-size:.62rem;text-align:center}.event-list strong,.event-list span{display:block}.event-list strong{font-size:.77rem}.event-list span{margin-top:3px;color:var(--muted);font-size:.65rem}footer{display:grid;grid-template-columns:1fr 2fr 1fr;gap:30px;padding:48px max(24px,calc((100vw - 1180px)/2));border-top:1px solid var(--line);background:#eee7da}footer strong{font:700 1.5rem Newsreader,serif}footer p{margin:0;color:var(--muted);font-size:.76rem}footer a{justify-self:end;color:var(--green);font-weight:700;font-size:.8rem}@media(max-width:900px){.site-head{grid-template-columns:1fr auto}.site-head nav{display:none}.hero{grid-template-columns:1fr;padding-top:58px}.gene-orbit{width:min(100%,440px)}.metrics{grid-template-columns:1fr 1fr}.book-grid{grid-template-columns:1fr 1fr}.lab{grid-template-columns:1fr;padding:38px}.timeline-grid{grid-template-columns:1fr}.section-head{align-items:start;flex-direction:column}}@media(max-width:560px){.hero,.section,.metrics{width:min(100% - 28px,1180px)}.hero h1{font-size:3.8rem}.gene-orbit>span{transform:rotate(var(--angle)) translateX(145px) rotate(calc(-1*var(--angle))) translate(-50%,-50%)}.metrics{grid-template-columns:1fr}.metrics article{border-right:0;border-bottom:1px solid var(--line)}.book-grid{grid-template-columns:1fr}.lab{padding:25px;border-radius:22px}.section h2{font-size:2.55rem}.genre-row{grid-template-columns:82px 1fr 40px}footer{grid-template-columns:1fr}footer a{justify-self:start}}
