@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=Manrope:wght@400;500;600;700&family=Russo+One&display=swap");
:root{color-scheme:dark;--ink:#090b0c;--panel:#121617;--paper:#e8e1d4;--muted:#9b988f;--rust:#d45a2a;--green:#77b875;--line:rgba(232,225,212,.14);--shell:1220px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:var(--paper);font-family:"Manrope",sans-serif;background-image:radial-gradient(circle at 84% 12%,rgba(212,90,42,.12),transparent 32%),linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:auto,48px 48px,48px 48px}.shell{width:min(var(--shell),calc(100% - 48px));margin-inline:auto}main{min-height:calc(100vh - 170px)}.intro{padding:80px 0 46px}.overline{display:flex;align-items:center;gap:12px;margin:0 0 18px;color:#777c78;font:600 12px/1 "IBM Plex Mono",monospace;letter-spacing:.18em;text-transform:uppercase}.overline span{width:34px;height:2px;background:var(--rust)}.intro h1{margin:0;color:var(--paper);font:400 clamp(42px,7vw,78px)/.98 "Russo One",sans-serif;letter-spacing:-.035em;text-transform:uppercase}.intro h1 em{color:var(--rust);font-style:normal}.lead{max-width:730px;margin:24px 0 36px;color:#bcb8af;font-size:18px;line-height:1.7}.search{max-width:760px;padding:24px;border:1px solid var(--line);background:rgba(18,22,23,.92);box-shadow:0 24px 60px #0005}.search label{display:block;margin-bottom:10px;font:600 12px/1 "IBM Plex Mono",monospace;letter-spacing:.1em;text-transform:uppercase;color:#c8c2b7}.search-row{display:grid;grid-template-columns:1fr auto;gap:10px}.search input{min-width:0;height:52px;padding:0 16px;border:1px solid rgba(232,225,212,.22);outline:none;background:#090b0c;color:var(--paper);font:500 18px "IBM Plex Mono",monospace}.search input:focus{border-color:var(--rust);box-shadow:0 0 0 3px rgba(212,90,42,.13)}.search button{height:52px;padding:0 24px;border:0;background:var(--rust);color:#fff;font:700 14px "Manrope",sans-serif;cursor:pointer;transition:background .2s,transform .2s}.search button:hover{background:#e36938;transform:translateY(-1px)}.hint{margin:13px 0 0;color:var(--muted);font-size:13px}.hint code{color:#cfc5ae;font-family:"IBM Plex Mono",monospace}.viewer{margin-bottom:80px;border:1px solid var(--line);background:#0d1011;box-shadow:0 30px 80px #0009;scroll-margin-top:24px}.viewer-head{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:70px;padding:14px 20px;border-bottom:1px solid var(--line);background:#15191a}.viewer-head div{display:flex;align-items:baseline;gap:12px}.viewer-head span{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.12em}.viewer-head strong{font:600 18px "IBM Plex Mono",monospace}.viewer-head p{margin:0;color:var(--muted);font:500 12px "IBM Plex Mono",monospace}.viewer-head .ready{color:var(--green)}.viewer-head .error{color:#e27b62}.stage-scroll{overflow-x:auto;padding:28px 18px;background:radial-gradient(circle at 50% 0,rgba(212,90,42,.07),transparent 42%)}#stage{width:1004px;height:400px;margin:auto;background:#47413a;box-shadow:0 10px 34px #000c}ruffle-player{display:block;width:1004px;height:400px}.viewer-error{display:grid;height:100%;place-items:center;padding:30px;text-align:center;color:#c9c3b8;font-size:15px}footer{border-top:1px solid var(--line);padding:30px 0;color:#77756f;font:12px "IBM Plex Mono",monospace}
@media(max-width:700px){.shell{width:min(100% - 28px,var(--shell))}.intro{padding:54px 0 34px}.lead{font-size:16px}.search{padding:18px}.search-row{grid-template-columns:1fr}.search button{width:100%}.viewer-head{align-items:flex-start;flex-direction:column;gap:6px}.stage-scroll{padding:18px 10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.search button{transition:none}}
