:root{color-scheme:dark;--bg:#111512;--panel:#1a201b;--text:#edf1e8;--muted:#9da99d;--lime:#c7f459;--line:#30392f}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif;margin:0;font-size:15px;line-height:1.55}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}header,main,footer{max-width:1280px;margin:auto}header{height:100px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:5px;font-size:32px;letter-spacing:-2px}.brand>strong{font-weight:800}.brand>span{color:var(--lime)}.brand>sup{letter-spacing:1.5px;font:10px monospace;color:var(--muted);margin:9px 0 0 22px}.header-link{font-size:13px}.header-link span{color:var(--lime);margin-left:30px}section{padding:64px 0;border-bottom:1px solid var(--line)}.hero{display:grid;grid-template-columns:1.1fr 1fr;gap:65px;padding:80px 0 55px;align-items:center}.eyebrow{font:11px monospace;letter-spacing:1.5px;color:var(--lime)}.dot{display:inline-block;width:7px;height:7px;background:var(--lime);border-radius:50%;margin-right:6px}h1{font-size:clamp(38px,4.4vw,65px);line-height:1.08;letter-spacing:-3px;margin:27px 0 22px;font-weight:500}h1 em{color:var(--lime);font-style:normal}.lead{color:var(--muted);font-size:17px;max-width:490px;line-height:1.7}button,a{touch-action:manipulation}.actions{display:flex;flex-wrap:wrap;gap:12px;margin:30px 0}.primary,.secondary{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:13px 18px;font-size:13px;border-radius:5px;border:1px solid var(--line);background:transparent;color:var(--text)}.primary{background:var(--lime);color:var(--bg);border-color:var(--lime);font-weight:bold}.primary:hover{background:#d9ff7c}.secondary:hover{background:var(--panel);border-color:var(--muted)}.stats{display:flex;gap:25px;margin-top:35px;color:var(--muted);font-size:11px}.stats b{display:block;font-size:23px;color:var(--text);font-weight:400;letter-spacing:-.5px}.preview{background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden;transform:rotate(1deg);box-shadow:0 22px 80px #0004}.preview-top{display:flex;justify-content:space-between;padding:14px 18px;font:10px monospace;color:var(--muted);letter-spacing:1px}.preview img{width:100%;height:auto;aspect-ratio:1200/630;object-fit:cover;display:block}.preview-copy{padding:22px}.preview small{color:var(--muted);font-size:11px}.preview h3{font-size:20px;margin:10px 0 8px;line-height:1.3}.preview p{color:var(--muted);font-size:13px;margin:0}.utility{display:flex;align-items:center;gap:18px;padding:25px 0;border-bottom:1px solid var(--line)}.muted{color:var(--muted);font-size:13px}.section-head{display:flex;align-items:center;justify-content:space-between;gap:20px}h2{font-size:32px;letter-spacing:-1px;line-height:1.2;margin:14px 0 20px;font-weight:500}.count{font:12px monospace;color:var(--muted)}.filters{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 28px}.filters button{border:1px solid var(--line);background:transparent;color:var(--muted);padding:8px 16px;border-radius:30px;font-size:12px}.filters button.active{background:var(--lime);border-color:var(--lime);color:var(--bg)}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:17px}.case{padding:17px;border:1px solid var(--line);border-radius:9px;background:var(--panel);transition:transform .18s,border-color .18s}.case:hover{transform:translateY(-4px);border-color:var(--lime)}.case-number{display:flex;justify-content:space-between;font:11px monospace;color:var(--muted);margin-bottom:15px}.case-number>span{color:var(--text)}.mini{position:relative;height:130px;border-radius:4px;overflow:hidden;background:#242d20;color:#c7f459;display:flex;align-items:end;padding:15px}.mini span{font-size:21px;letter-spacing:-1px;font-weight:bold;z-index:1}.mini i{position:absolute;width:100px;height:100px;border:22px solid currentColor;border-radius:50%;right:15px;top:-8px;opacity:.9}.mini.blue{color:#70b0ff;background:#1c283a}.mini.pink{color:#ff8cc2;background:#392532}.mini.orange{color:#ffb062;background:#392c20}.case h3{font-size:17px;margin:16px 0 8px;font-weight:500}.case p{font-size:12px;color:var(--muted);min-height:55px;margin:0 0 20px}.case code{font:10px monospace;background:#111512;padding:5px 7px;color:var(--muted);border-radius:3px}.case[hidden]{display:none}pre{background:#0c100d;border:1px solid var(--line);border-radius:8px;padding:25px;overflow:auto;max-height:440px;color:#b5ce9f;font:12px/1.9 monospace;tab-size:2}.notes{display:grid;grid-template-columns:repeat(3,1fr);gap:45px}.notes h3{font-size:18px;font-weight:500}.notes p{color:var(--muted);font-size:13px}.notice{background:#302b1d;border:1px solid #675a30;border-radius:7px;padding:20px;color:#e7d495}video{width:100%;max-width:900px;border-radius:9px}audio{width:min(100%,600px)}footer{display:flex;align-items:center;justify-content:space-between;padding:35px 0;color:var(--muted);font-size:11px}footer .brand{font-size:25px}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);padding:12px 22px;background:var(--lime);color:#111512;border-radius:6px;opacity:0;pointer-events:none;transition:opacity .15s;max-width:95vw;font-size:13px}#toast.visible{opacity:1}:focus-visible{outline:2px solid var(--lime);outline-offset:5px} @media(min-width:1400px){header,main,footer{max-width:1200px}}@media(max-width:1320px){header,main,footer{margin-left:35px;margin-right:35px}}@media(max-width:1000px){.hero{gap:30px}.grid{grid-template-columns:repeat(3,minmax(0,1fr))}.stats{gap:16px}h1{letter-spacing:-2px}.notes{gap:25px}}@media(max-width:740px){header,main,footer{margin-left:20px;margin-right:20px}header{height:78px}.brand>sup{display:none}.hero{grid-template-columns:1fr;padding-top:45px;gap:35px}h1{font-size:46px}.preview{transform:none}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.case{padding:12px}.case h3{font-size:16px}.case p{min-height:75px}.mini{height:110px}.mini span{font-size:18px}.mini i{right:-15px}.notes{grid-template-columns:1fr;gap:20px}.utility{align-items:flex-start;flex-direction:column;gap:8px}.section-head{align-items:flex-start;flex-wrap:wrap}h2{font-size:28px}section{padding:40px 0}footer{gap:20px;flex-wrap:wrap}pre{padding:15px}.count{display:none}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
