:root{color-scheme:dark;--bg:#0a0a0a;--text:#e8e8e5;--muted:#929294;--line:#28282c;--accent:#b4c9ff}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.6 Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}a,button{touch-action:manipulation}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:5px}header,main,footer{max-width:1280px;margin:auto;padding-inline:44px}header{height:112px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px;font-size:29px;letter-spacing:-1.8px;font-weight:700}.mark{width:28px;height:34px;background:var(--text);color:#0a0a0a;font-size:30px;line-height:38px;text-align:center;border-radius:2px}.edition{font:10px/1.4 monospace;letter-spacing:1px;color:var(--muted);margin-left:18px;max-width:120px}nav{display:flex;gap:28px;font-size:13px}nav a:hover,footer a:hover,.card-meta a:hover{color:var(--accent)}.hero{padding-top:64px}.eyebrow{font:11px/1.5 monospace;letter-spacing:1.8px;color:var(--muted)}.dot{display:inline-block;width:6px;height:6px;background:#bfd0ff;border-radius:50%;margin-right:9px}.hero-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:center;min-height:480px}h1{font-size:clamp(42px,5.1vw,72px);font-weight:400;line-height:1.04;letter-spacing:-3.3px;margin:30px 0}h1 span{color:#aabce4}.intro{max-width:370px;color:var(--muted);font-size:17px;line-height:1.7}.button{display:inline-flex;gap:35px;justify-content:space-between;align-items:center;background:#e6e7e8;color:#121215;border:1px solid transparent;padding:13px 20px;font-size:13px;border-radius:4px;margin-top:22px;transition:transform .18s,background .18s}.button:hover{background:#c4d3fc}.button:active{transform:scale(.98)}.stage{position:relative;min-width:0;height:400px;perspective:1100px;isolation:isolate}.stage:before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse,#172238 0%,transparent 67%);opacity:.7}.sheet{position:absolute;width:75%;aspect-ratio:4/3;border:1px solid #4d5363;border-radius:6px;box-shadow:0 35px 70px #0009;overflow:hidden;animation:drift 9s ease-in-out infinite}.sheet img{width:100%;height:100%;object-fit:cover}.sheet-back{left:2%;top:20px;transform:rotate(-13deg) rotateY(12deg);animation-delay:-4s}.sheet-front{right:0;top:105px;transform:rotate(9deg) rotateY(-14deg);animation-name:drift2}.stage-caption{position:absolute;bottom:4px;left:0;font:10px monospace;letter-spacing:1px;color:var(--muted)}#motion{position:absolute;bottom:0;right:0;background:transparent;border:0;border-bottom:1px solid var(--line);padding:5px 0;font:10px monospace;color:var(--muted)}.paused .sheet{animation-play-state:paused}.hero-foot{display:flex;justify-content:space-between;border-block:1px solid var(--line);padding:18px 0;font:11px monospace;color:var(--muted)}.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;padding:88px 0 36px}.section-head p{color:var(--muted);font-size:13px}h2{font-size:clamp(29px,3.2vw,43px);font-weight:400;line-height:1.15;letter-spacing:-1.5px;margin:18px 0 0}.filters{display:flex;gap:10px;margin:0 0 30px}.filters button{border:1px solid var(--line);background:transparent;padding:7px 16px;border-radius:30px;font-size:12px;transition:background .2s}.filters button.selected{background:#e8e8e5;color:#111;border-color:#e8e8e5}.filters span{font-size:10px;opacity:.6;margin-left:8px}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px 22px}.art{display:block;aspect-ratio:4/3;overflow:hidden;background:#15151a;border-radius:4px}.art img,.art video{display:block;width:100%;height:100%;object-fit:cover}.art img{transition:transform .5s}.art:hover img{transform:scale(1.035)}.card-meta{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:14px}.card-meta h3{font-weight:400;font-size:14px;margin:0}.card-meta a{font:11px monospace;color:var(--muted)}article p{color:var(--muted);font-size:12px;margin:6px 0}article[hidden]{display:none}.readme{display:grid;grid-template-columns:1fr 1fr;gap:60px;margin:95px 0 80px;padding-top:55px;border-top:1px solid var(--line)}.readme-body{font-size:14px;color:var(--muted)}.readme-body>p{margin-top:0;max-width:460px}.readme details{border-bottom:1px solid var(--line);padding:17px 0}.readme summary{cursor:pointer;color:var(--text)}.readme details p{font-size:13px}.readme details a{text-decoration:underline}.secondary{background:transparent;border-color:#55555b;color:var(--text)}.secondary:hover{background:#20232b}footer{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--line);min-height:110px;color:var(--muted);font-size:11px}footer .brand{color:var(--text);font-size:24px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}@keyframes drift{50%{transform:translateY(-12px) rotate(-9deg) rotateY(4deg)}}@keyframes drift2{50%{transform:translateY(12px) rotate(5deg) rotateY(-6deg)}}@media(max-width:800px){header,main,footer{padding-inline:24px}.edition{display:none}.hero-grid{gap:15px}h1{letter-spacing:-2px}.stage{height:330px}.sheet{width:88%}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.quiet{display:none}.readme{gap:35px}}@media(max-width:540px){header{height:85px}nav{gap:20px}.hero{padding-top:35px}.hero-grid{grid-template-columns:1fr;gap:18px}h1{font-size:47px;margin-top:20px}.intro{font-size:15px}.stage{height:330px;max-width:420px;width:100%;margin:auto}.sheet{width:74%}.sheet-front{top:86px}.hero-foot{font-size:9px;gap:12px}.hero-foot span:first-child{max-width:100px}.section-head{display:block;padding-top:60px}.section-head p{margin-top:24px}.grid{gap:30px 14px}.card-meta{align-items:start}.card-meta h3{font-size:12px}.card-meta a{font-size:9px}article p{font-size:11px}.filters{gap:6px;flex-wrap:wrap}.filters button{padding:7px 13px}.readme{grid-template-columns:1fr;margin-top:65px;gap:30px}footer{flex-wrap:wrap;padding-block:24px}footer span{max-width:160px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
