:root{--sage:#e4eee7;--ink:#193e35;--muted:#557067;--paper:#f9fcf8;--gold:#efb551;--line:#c5d7cb;font-family:"Segoe UI",sans-serif;color:var(--ink);background:var(--sage);font-synthesis:none}
*{box-sizing:border-box}body{margin:0;min-height:100svh}button,a{-webkit-tap-highlight-color:transparent}button{font:600 14px "Segoe UI",sans-serif;border:1px solid #9fb7aa;padding:15px 23px;border-radius:32px;background:transparent;color:var(--ink);cursor:pointer;transition:background .2s,transform .2s}button:hover{background:#d1e2d6;transform:translateY(-2px)}button:focus-visible,a:focus-visible,.character:focus-visible{outline:3px solid var(--ink);outline-offset:6px}button[aria-pressed=true]{background:var(--ink);color:var(--paper)}header{height:104px;margin:0 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:20px}.wordmark{font-size:29px;font-weight:800;letter-spacing:-1.6px;color:inherit;text-decoration:none}.wordmark span{color:var(--gold);font-size:16px;margin-left:5px}.edition{font-size:13px;color:var(--muted)}.live{font-size:12px;display:flex;align-items:center;gap:8px}.live i{width:6px;height:6px;border-radius:50%;background:#40794e}main{max-width:1440px;min-height:650px;margin:auto;padding:30px 5% 20px;display:grid;grid-template-columns:1fr 1.12fr;align-items:center}.intro{position:relative;z-index:2}.eyebrow{font-size:10px;letter-spacing:1.7px;font-weight:700;margin:0 0 26px}h1{font-family:"Trebuchet MS","Segoe UI",sans-serif;font-weight:700;font-size:clamp(52px,5.5vw,84px);line-height:1.04;letter-spacing:-4px;margin:0 0 26px}h1 em{font-style:normal;color:#4a785c}.description{font-size:16px;line-height:1.75;color:var(--muted);margin-bottom:30px}.actions{display:flex;gap:10px;flex-wrap:wrap}.primary{background:var(--ink);color:var(--paper);border-color:var(--ink)}.primary:hover{background:#2a5847}.primary span{padding-left:12px;font-size:18px}.hint{font-size:11px;color:var(--muted);line-height:1.9;margin-top:20px}.playground{position:relative;min-width:0;align-self:stretch;display:flex;align-items:center;justify-content:center;min-height:580px;perspective:1100px}.orbit{position:absolute;width:95%;aspect-ratio:1;border:1px solid #c9dacc;border-radius:50%;background:radial-gradient(ellipse at 50% 50%,#f5f9ed 0%,#eaf2e9 47%,transparent 72%)}.character{position:relative;width:100%;max-width:560px;aspect-ratio:1;transform-origin:50% 74%;will-change:transform;touch-action:none;user-select:none;z-index:1;border-radius:44%;cursor:grab;--gx:0;--gy:0}.character img{display:block;width:100%;height:100%;pointer-events:none}.eye{position:absolute;top:43.65%;width:11.65%;height:15%;border-radius:50%;overflow:hidden;pointer-events:none;transform:rotate(4deg)}.eye-left{left:28.85%;transform:rotate(7deg)}.eye-right{left:59.35%;transform:rotate(-6deg)}.iris{position:absolute;width:66%;aspect-ratio:1;left:17%;top:24%;border-radius:50%;background:radial-gradient(circle at 47% 50%,#15110f 0 38%,#4c2d17 40%,#7d512e 62%,#362316 75%,#211b14 85%);box-shadow:inset 0 0 5px #24170b,0 2px 4px #2e201435;transform:translate(calc(var(--gx)*22%),calc(var(--gy)*31%));will-change:transform}.iris:before{content:"";position:absolute;left:18%;top:12%;width:26%;height:26%;background:#fffef7;border-radius:50%;box-shadow:18px 26px 0 -6px #fff9}.lid{position:absolute;inset:-2px;background:linear-gradient(#d88d47,#eda55d);border-radius:45%;transform:scaleY(0);transform-origin:top;transition:transform .1s}.character.blink .lid{transform:scaleY(1)}.speech{position:absolute;top:4%;right:5%;z-index:3;background:var(--paper);padding:13px 22px;border-radius:24px 24px 24px 5px;transform:rotate(7deg);font-size:14px;box-shadow:0 6px 24px #20443108}.ground-shadow{position:absolute;bottom:6%;width:45%;height:20px;filter:blur(12px);background:#425c5424;border-radius:50%}.caption{position:absolute;bottom:0;left:13%;right:8%;font-size:11px;display:flex;justify-content:space-between;color:var(--muted)}.caption span:first-child:before{content:"↗";margin-right:7px}footer{margin:0 5%;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:23px 0;gap:24px}footer p{font-size:13px;line-height:1.7;margin:0}.technical{font-size:11px;color:var(--muted)}footer button{font-size:12px;padding:10px 18px}@media(min-width:1500px){main{min-height:720px}}@media(max-width:900px){header{height:82px}.edition{display:none}main{grid-template-columns:1fr 1.05fr;min-height:560px}.playground{min-height:470px}h1{font-size:54px;letter-spacing:-2.8px}.description{font-size:14px}.desktop-break{display:none}.actions{gap:8px}button{padding:13px 17px}.eyebrow{font-size:8px;letter-spacing:1.2px}.speech{top:8%}}@media(max-width:640px){header{height:70px;margin:0 6%}.wordmark{font-size:25px}.live{font-size:10px}main{display:flex;flex-direction:column;padding:30px 6% 18px;min-height:0}.intro{width:100%}h1{font-size:49px;letter-spacing:-2.4px;margin-bottom:16px}.eyebrow{margin-bottom:17px}.description{line-height:1.6;margin:0 0 19px;font-size:14px}.hint{font-size:10px;margin-top:13px}.playground{width:100%;min-height:0;height:auto;aspect-ratio:1;align-self:center;margin:15px 0 24px}.character{width:95%}.orbit{width:95%}.speech{top:0%;font-size:12px;padding:10px 16px}.caption{bottom:-25px;left:5%;right:5%}.ground-shadow{bottom:0}footer{margin:0 6%;padding:20px 0;flex-wrap:wrap;gap:15px}footer p{font-size:11px}.technical{order:3;width:100%;font-size:10px}footer button{font-size:11px}}@media(prefers-reduced-motion:reduce){button{transition:none}.character{will-change:auto}.lid{transition:none}}
