:root{--night: #12163a;--plum: #2b1a3f;--silk: #ece6d6;--gold: #f0b840;--dew: #6fc3ff;--ember: #ff6a3d;--ash: #8a86a8;--panel: rgba(20, 22, 58, .96);--line: rgba(236, 230, 214, .14);--dim: rgba(236, 230, 214, .62);--serif: "Bodoni Moda", "Didot", Georgia, serif;--sans: "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;--drawer: 404px}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:radial-gradient(120% 90% at 50% 46%,#33204d 0%,#1d1a4a 34%,var(--night) 66%,#0c0f2e 100%) fixed;color:var(--silk);font-family:var(--sans);font-size:15px;line-height:1.45;font-variant-numeric:tabular-nums;overflow:hidden;overscroll-behavior:none;-webkit-font-smoothing:antialiased}button,input{font:inherit;color:inherit}button{cursor:pointer;background:none;border:0;padding:0}a{color:inherit}:focus-visible{outline:2px solid var(--dew);outline-offset:2px;border-radius:6px}.web{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab}.species{font-family:var(--serif);font-style:italic;font-weight:500;letter-spacing:.005em}.top{position:fixed;top:0;left:0;right:0;display:flex;align-items:flex-start;justify-content:space-between;padding:max(14px,env(safe-area-inset-top)) 18px 0;pointer-events:none;z-index:5}.top>*{pointer-events:auto}.mark{font-family:var(--serif);font-style:italic;font-weight:600;font-size:26px;line-height:1;text-decoration:none;display:block}.mark small{display:block;font-family:var(--sans);font-style:normal;font-weight:400;font-size:12.5px;color:var(--dim);margin-top:6px;max-width:260px}.pill{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 16px;border-radius:999px;border:1px solid rgba(236,230,214,.28);background:#12163ae0;font-weight:500;font-size:14px;white-space:nowrap}.pill:hover{border-color:#ece6d68c}.pill.gold{background:var(--gold);border-color:var(--gold);color:#1c1330;font-weight:600}.pill.gold:hover{background:#ffcb5c}.pill.small{height:32px;padding:0 12px;font-size:13px}.pill:disabled{opacity:.5;cursor:default}.menu{position:absolute;right:18px;top:60px;min-width:220px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:6px}.menu button{display:flex;width:100%;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;text-align:left;font-size:14px}.menu button:hover{background:#ece6d614}.menu img{width:20px;height:20px;border-radius:5px}.menu p{margin:4px 10px 6px;font-size:12.5px;color:var(--dim)}.bottom{position:fixed;left:0;right:0;bottom:0;padding:0 18px max(16px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:10px;pointer-events:none;z-index:4}.bottom>*{pointer-events:auto}.capline{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}.caption{min-width:0;max-width:min(560px,100%);display:flex;align-items:baseline;gap:9px;text-align:left;font-size:15px;text-shadow:0 1px 12px rgba(10,12,34,.95)}.caption .dot{flex:none;width:8px;height:8px;border-radius:50%;background:var(--ember);box-shadow:0 0 #ff6a3d99;animation:pulse 1.6s infinite;transform:translateY(-1px)}.caption .species{font-size:17px}@keyframes pulse{70%{box-shadow:0 0 0 9px #ff6a3d00}to{box-shadow:0 0 #ff6a3d00}}.hello{margin:0;max-width:620px;font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(25px,3.1vw,42px);line-height:1.08;text-shadow:0 2px 24px rgba(10,12,34,.95);animation:hello 9s ease both;pointer-events:none}.hello small{display:block;margin-top:10px;font-family:var(--sans);font-style:normal;font-weight:400;font-size:15px;line-height:1.4;color:var(--dim);max-width:420px}@keyframes hello{0%{opacity:0;transform:translateY(14px)}12%,88%{opacity:1;transform:none}to{opacity:0}}.intro{max-width:430px;font-size:14px;color:var(--dim);text-shadow:0 1px 12px rgba(10,12,34,.95);margin:0}.hatch-main{align-self:center;justify-content:center;width:min(340px,100%);height:56px;font-size:18px;font-weight:700;box-shadow:0 8px 30px #f0b8404d}.rail{display:flex;align-items:center;justify-content:center;gap:10px}.places{display:flex;gap:2px;padding:4px;border-radius:999px;border:1px solid var(--line);background:#12163aeb}.places button{height:34px;padding:0 15px;border-radius:999px;font-size:14px;font-weight:500;color:var(--dim)}.places button:hover{color:var(--silk)}.places button[aria-pressed=true]{background:#ece6d621;color:var(--silk)}.fitbtn{position:fixed;right:18px;bottom:max(20px,env(safe-area-inset-bottom));z-index:4}.drawer{position:fixed;top:66px;right:14px;bottom:14px;width:calc(var(--drawer) - 14px);background:var(--panel);border:1px solid var(--line);border-radius:16px;display:flex;flex-direction:column;z-index:6;animation:slide .28s cubic-bezier(.2,.8,.2,1)}@keyframes slide{0%{transform:translate(24px);opacity:0}}.drawer header{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:18px 20px 12px}.drawer h2{font-family:var(--serif);font-style:italic;font-weight:600;font-size:27px;line-height:1.05;margin:0}.x{font-size:13px;color:var(--dim);padding:4px 6px}.x:hover{color:var(--silk)}.scroll{overflow-y:auto;padding:0 20px 22px;flex:1;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(236,230,214,.2) transparent}.drawer h3{font-size:13px;font-weight:600;color:var(--dim);margin:24px 0 8px}.drawer p{margin:0 0 10px}.lead{font-size:15.5px}.muted{color:var(--dim)}.small{font-size:13px}.big{font-family:var(--serif);font-size:34px;line-height:1.05;font-weight:500}.big em{font-style:normal;font-family:var(--sans);font-size:14px;color:var(--dim);margin-left:6px}.bar{height:6px;border-radius:3px;background:#ece6d61f;overflow:hidden;margin:10px 0 8px}.bar i{display:block;height:100%;background:var(--gold);border-radius:3px}.rows{list-style:none;margin:0;padding:0}.rows li{border-top:1px solid var(--line)}.rows li:first-child{border-top:0}.row{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:baseline;width:100%;padding:9px 0;text-align:left}button.row:hover .species,button.row:hover .ttl{color:var(--gold)}.row .rank{width:22px;color:var(--dim);font-size:13px}.row .species{font-size:17px}.row .sub{display:block;font-size:12.5px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row .ttl{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:500}.row .val{text-align:right;font-size:14px;white-space:nowrap}.row>span:nth-child(2){min-width:0}.knotdot{width:8px;height:8px;border-radius:50%;display:inline-block;background:var(--ash);transform:translateY(-1px)}.knotdot.kept{background:var(--gold);box-shadow:0 0 0 3px #f0b8402e}.knotdot.live{background:var(--ember)}.badge{display:inline-block;font-size:11.5px;padding:1px 7px;border-radius:999px;border:1px solid rgba(236,230,214,.22);color:var(--dim);margin:3px 4px 0 0;white-space:nowrap}.badge.gold{border-color:#f0b84080;color:var(--gold)}.badge.dew{border-color:#6fc3ff80;color:var(--dew)}.ladder{list-style:none;margin:0;padding:0 0 0 14px;border-left:1px solid var(--line)}.ladder li{position:relative;padding:5px 0 5px 10px;display:flex;justify-content:space-between;gap:10px;color:var(--dim);font-size:14px}.ladder li:before{content:"";position:absolute;left:-19px;top:12px;width:9px;height:9px;border-radius:50%;border:1px solid rgba(236,230,214,.4);background:var(--night)}.ladder li.done{color:var(--silk)}.ladder li.done:before{background:var(--gold);border-color:var(--gold)}.ladder li.next:before{border-color:var(--gold)}.ladder li.next{color:var(--silk)}.steps{margin:0;padding-left:20px;color:var(--dim);font-size:14px}.steps li{padding:2px 0}.steps b{color:var(--silk);font-weight:500}.qa button{width:100%;text-align:left;padding:9px 0;font-weight:500}.qa button:hover{color:var(--gold)}.qa p{margin:0 0 12px;padding-left:12px;border-left:2px solid var(--gold);font-family:var(--serif);font-size:16.5px;line-height:1.4}.hash{font-size:12.5px;word-break:break-all;color:var(--dim)}.field{display:flex;align-items:center;gap:8px;height:46px;border-radius:12px;border:1px solid rgba(236,230,214,.24);background:#0a0c2480;padding:0 14px}.field:focus-within{border-color:var(--gold)}.field input{flex:1;min-width:0;background:none;border:0;outline:0;font-size:16px}.field span{color:var(--dim);font-size:13.5px}.chips{display:flex;gap:6px;margin:8px 0 12px;flex-wrap:wrap}.tabs{display:flex;gap:4px;margin:14px 0 10px}.tabs button{flex:1;height:36px;border-radius:10px;border:1px solid var(--line);font-weight:500;color:var(--dim)}.tabs button[aria-pressed=true]{color:var(--silk);border-color:#ece6d680;background:#ece6d614}.cta{width:100%;height:48px;justify-content:center;font-size:15.5px}.stage{font-size:13.5px;color:var(--dew);min-height:20px;margin:8px 0 0}.err{color:#ff9d80}.chart{width:100%;height:170px;display:block;margin:6px 0 2px}.kv{display:flex;justify-content:space-between;gap:12px;padding:5px 0;font-size:14px}.kv span:first-child{color:var(--dim)}.buy{color:var(--gold)}.sell{color:#ff9d80}.copy{text-decoration:underline;text-decoration-color:#ece6d64d;text-underline-offset:3px}.copy:hover{text-decoration-color:var(--silk)}.footage{position:fixed;left:18px;top:96px;width:min(600px,calc(100vw - var(--drawer) - 60px));max-height:calc(100vh - 190px);background:var(--panel);border:1px solid var(--line);border-radius:16px;z-index:7;display:flex;flex-direction:column;overflow:hidden;animation:rise .28s cubic-bezier(.2,.8,.2,1)}@keyframes rise{0%{transform:translateY(14px);opacity:0}}.footage header{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding:14px 16px 10px}.footage h2{margin:0;font-family:var(--serif);font-style:italic;font-weight:600;font-size:25px;line-height:1.1}.footage h2 small{font-family:var(--sans);font-style:normal;font-weight:400;font-size:13px;color:var(--dim);margin-left:8px}.screen{position:relative;aspect-ratio:640 / 425;background:#0a0c22;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.screen canvas,.screen video,.screen img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}.screen .none{position:absolute;inset:0;display:grid;place-items:center;color:var(--dim);padding:20px;text-align:center}.livetag{position:absolute;left:10px;top:10px;font-size:12px;font-weight:600;padding:2px 9px;border-radius:999px;background:var(--ember);color:#230c05;z-index:2}.fbody{padding:12px 16px 16px;overflow-y:auto}.status{font-size:15.5px;margin:0 0 4px}.pagelink{display:block;font-size:13px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.reel{display:flex;gap:8px;overflow-x:auto;margin:12px -16px 0;padding:0 16px 4px;scrollbar-width:none}.reel button{flex:none;width:104px;border-radius:8px;overflow:hidden;border:1px solid var(--line);position:relative}.reel button[aria-pressed=true]{border-color:var(--gold)}.reel img{display:block;width:100%;aspect-ratio:640 / 425;object-fit:cover;background:#0a0c22}.stats{display:flex;flex-wrap:wrap;gap:4px 18px;margin:12px 0 2px;font-size:13.5px;color:var(--dim)}.stats b{color:var(--silk);font-weight:600}.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.veil{position:fixed;inset:0;background:#08091c8c;z-index:9;display:grid;place-items:center;padding:18px}.modal{width:min(430px,100%);background:#171a44;border:1px solid var(--line);border-radius:18px;padding:22px;animation:rise .25s cubic-bezier(.2,.8,.2,1)}.modal h2{font-family:var(--serif);font-style:italic;font-weight:600;font-size:28px;margin:0 0 6px;line-height:1.1}.label{margin:16px 0;padding:14px 16px;border:1px solid rgba(236,230,214,.4);border-radius:4px;background:#ece6d60f}.label .species{font-size:26px;line-height:1.1;min-height:30px}.label small{display:block;color:var(--dim);font-size:12.5px;margin-top:4px}.tip{position:fixed;z-index:8;pointer-events:none;max-width:300px;padding:8px 11px;border-radius:10px;background:#0c0e28f0;border:1px solid var(--line);font-size:13px;line-height:1.35}.tip b{display:block;font-weight:600}.toasts{position:fixed;left:50%;top:70px;transform:translate(-50%);z-index:12;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}.toast{pointer-events:auto;padding:10px 16px;border-radius:12px;background:#1c2052;border:1px solid rgba(236,230,214,.25);font-size:14px;max-width:min(440px,90vw);animation:rise .25s}.toast.bad{border-color:#ff6a3d99}.loading{position:fixed;inset:0;display:grid;place-items:center;color:var(--dim);font-family:var(--serif);font-style:italic;font-size:20px}.howbtn{position:absolute;left:18px;top:calc(max(14px,env(safe-area-inset-top)) + 58px);font-size:13.5px;font-weight:600;color:var(--gold);text-decoration:underline;text-underline-offset:3px;text-decoration-color:#f0b84073}.explain{width:min(560px,100%);max-height:calc(100vh - 36px);overflow-y:auto;padding:20px 22px 18px;border-radius:16px;border:1px solid rgba(240,184,64,.35);background:#101232f5;animation:rise .35s cubic-bezier(.2,.8,.2,1)}.explain h2{margin:0 0 8px;font-family:var(--sans);font-weight:700;font-size:24px;line-height:1.2;color:var(--silk)}.explain-lead{margin:0 0 12px;color:var(--dim);font-size:15px}.explain-steps{margin:0 0 12px;padding-left:22px;font-size:15px}.explain-steps li{padding:4px 0}.explain-steps li::marker{color:var(--gold);font-weight:700}.explain-steps b{color:var(--gold);font-weight:600}.explain-facts{margin:0 0 14px;font-size:13.5px;color:var(--dim)}.explain-go{display:flex;justify-content:center;width:min(340px,100%);height:58px;margin:4px auto 12px;font-size:18px;font-weight:700;box-shadow:0 8px 28px #f0b84047}.explain-actions{display:flex;gap:18px;align-items:center;justify-content:center;flex-wrap:wrap}@media (max-width: 760px){.howbtn{left:14px;top:calc(max(14px,env(safe-area-inset-top)) + 34px)}.explain{padding:18px 16px 14px;max-height:calc(100vh - 24px)}.explain-go{width:100%;height:54px}.explain h2{font-size:20px}.explain-facts{display:none}.explain-lead,.explain-steps{font-size:14px}}@media (max-width: 760px){body{font-size:14.5px}.top{padding-left:14px;padding-right:14px}.mark{font-size:23px}.mark small{display:none}.bottom{padding-left:10px;padding-right:10px;gap:8px}.caption{font-size:14px}.intro{font-size:13px}.rail{gap:6px}.places{flex:1;justify-content:space-between}.places button{padding:0 9px;font-size:13.5px;flex:1}.fitbtn{display:none}.drawer{inset:auto 0 0;width:auto;height:64vh;border-radius:18px 18px 0 0;border-bottom:0;animation-name:rise;z-index:8}.drawer header{padding:14px 16px 10px}.scroll{padding:0 16px 28px}.footage{left:8px;right:8px;top:56px;width:auto;max-height:calc(100vh - 130px)}.footage h2{font-size:22px}.menu{right:14px;top:56px}}@media (prefers-reduced-motion: reduce){.drawer,.footage,.modal,.toast,.caption .dot,.hello{animation:none}}
