:root{color:#f3f0e8;font-synthesis:none;text-rendering:optimizelegibility;--acid:#caff2f;--orange:#ff5b2e;--cyan:#53e6ff;--panel:#111512;--line:#f3f0e824;--muted:#8e968d;background:#080a09;font-family:Arial Narrow,Roboto Condensed,Yu Gothic,sans-serif}*{box-sizing:border-box}html{background:#080a09;min-width:320px}body{background:radial-gradient(circle at 82% 0,#caff2f17,#0000 27rem),linear-gradient(145deg,#070908,#0d110e 58%,#070908);min-height:100vh;margin:0}button{font:inherit}.app{width:min(1180px,100% - 32px);margin:0 auto;padding:48px 0 34px}.hero{justify-content:space-between;align-items:end;gap:32px;padding-bottom:35px;display:flex}.kicker,.panel-head p{color:var(--acid);letter-spacing:.2em;margin:0 0 10px;font-size:.7rem;font-weight:900}h1,h2,p{margin-top:0}h1{letter-spacing:-.08em;text-transform:uppercase;margin-bottom:0;font-family:Arial Black,Yu Gothic,sans-serif;font-size:clamp(3.3rem,9vw,7.6rem);line-height:.78}h1 span{color:#0000;-webkit-text-stroke:2px #f3f0e8}.generation{border-left:5px solid var(--acid);background:#caff2f12;min-width:180px;padding:17px 20px}.generation span,.generation small{color:var(--muted);letter-spacing:.17em;font-size:.63rem;font-weight:800;display:block}.generation strong{color:var(--acid);font-family:Arial Black,sans-serif;font-size:3rem;line-height:1.1;display:block}.console,.panel{border:1px solid var(--line);background:#111512f0;box-shadow:0 24px 70px #00000061}.mode-bar{border:1px solid var(--line);background:#0c100d;grid-template-columns:repeat(3,auto) 1fr;align-items:stretch;margin-bottom:10px;display:grid}.mode-bar button{min-height:48px;color:var(--muted);border:0;border-right:1px solid var(--line);cursor:pointer;letter-spacing:.12em;background:0 0;padding:0 20px;font-size:.68rem;font-weight:900}.mode-bar button:hover,.mode-bar button.active{color:#0b0d0b;background:var(--acid)}.mode-bar span{color:var(--muted);text-align:right;text-overflow:ellipsis;white-space:nowrap;align-self:center;padding:0 18px;font-size:.68rem;overflow:hidden}.mode-dj{border-color:#53e6ff73;box-shadow:0 24px 80px #53e6ff14}.mode-battle{border-color:#ff5b2e85}.status-row{border-bottom:1px solid var(--line);color:var(--muted);letter-spacing:.12em;justify-content:space-between;gap:20px;padding:14px 20px;font-size:.65rem;font-weight:800;display:flex}.status-light{background:#495048;border-radius:50%;width:8px;height:8px;margin-right:8px;display:inline-block}.status-light.live{background:var(--acid);box-shadow:0 0 14px var(--acid)}.battle-switcher{background:var(--line);border-bottom:1px solid var(--line);grid-template-columns:1fr 1fr;gap:1px;display:grid}.battle-switcher button{color:var(--muted);cursor:pointer;text-align:left;background:#111512;border:0;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:17px 20px;display:grid}.battle-switcher button.active{color:#fff;background:linear-gradient(100deg,#ff5b2e47,#151a16)}.battle-switcher button>span{color:#0c0e0c;background:var(--orange);place-content:center;width:36px;height:36px;font-family:Arial Black,sans-serif;display:grid}.battle-switcher strong,.battle-switcher small{display:block}.battle-switcher small{font-size:.6rem}.sequencer{gap:12px;padding:28px 20px;display:grid;overflow-x:auto}.track{grid-template-columns:52px minmax(760px,1fr);align-items:center;gap:12px;display:grid}.track-label{color:var(--muted);letter-spacing:.08em;font-size:.65rem;font-weight:900}.steps{grid-template-columns:repeat(64,minmax(6px,1fr));gap:3px;display:grid}.step{background:#171c18;border:1px solid #2b322c;height:24px}.step.bar-start{margin-left:5px}.step-on{background:var(--acid);border-color:#caff2f8f;box-shadow:0 0 7px #caff2f38}.track:nth-child(2) .step-on{background:var(--orange);border-color:#ff875f}.track:nth-child(3) .step-on{background:var(--cyan);border-color:#a4efff}.track:nth-child(4) .step-on{background:#8f4ee7;border-color:#c59aff}.track:nth-child(5) .step-on{background:#f4b942;border-color:#ffd97b}.step-active{outline-offset:1px;filter:brightness(1.5);outline:2px solid #fff}.transport{border-top:1px solid var(--line);grid-template-columns:200px minmax(280px,1fr) 170px 200px;align-items:stretch;display:grid}.play-button,.next-button,.mutation-button,.like-button,.keep-button,.dj-evolve-button,.battle-vote button,.reset-button{cursor:pointer;letter-spacing:.07em;border:0;font-weight:900}.play-button{color:#0d100c;background:var(--acid);justify-content:center;align-items:center;gap:12px;min-height:92px;display:flex}.play-button span{font-size:1.3rem}.rating{align-content:center;gap:10px;padding:15px 22px;display:grid}.rating p{color:var(--muted);letter-spacing:.14em;margin-bottom:0;font-size:.65rem;font-weight:900}.rating-buttons{grid-template-columns:repeat(10,1fr);gap:5px;display:grid}.rating-buttons button{color:#dadfd8;cursor:pointer;background:#191e1a;border:1px solid #333a34;min-height:36px;font-weight:900}.rating-buttons button:hover,.rating-buttons button.selected{color:#0b0d0b;border-color:var(--acid);background:var(--acid)}.like-button{color:#0c0e0c;background:var(--cyan);cursor:pointer;border:0;min-height:42px;font-size:.8rem}.dj-actions{grid-template-columns:.7fr .7fr 1.6fr;gap:6px;display:grid}.keep-button,.dj-evolve-button{cursor:pointer;border:0;min-height:42px}.keep-button{color:#0c0e0c;background:#ffd43b}.dj-evolve-button{color:#fff;background:#5136b8}.dj-evolve-button:hover{background:#6e4df0}.battle-vote{grid-template-columns:1fr 1fr;align-content:center;gap:8px;padding:15px 20px;display:grid}.battle-vote button{color:#fff;cursor:pointer;background:#ff5b2e29;border:1px solid #ff5b2e73;min-height:46px}.battle-vote button:hover{color:#0b0d0b;background:var(--orange)}.mutation-button{color:#ffe9a9;border:0;border-left:1px solid var(--line);cursor:pointer;background:repeating-linear-gradient(-45deg,#0000 0 8px,#ffc10714 8px 16px),#272116;place-content:center;gap:2px;display:grid}.mutation-button span{color:#ffd43b;font-size:1.55rem;line-height:1}.mutation-button:hover{color:#121006;background:#ffd43b}.next-button{color:#fff;border-left:1px solid var(--line);background:#242a25;justify-content:space-between;align-items:center;gap:10px;padding:0 22px;display:flex}.next-button span{color:var(--acid);font-size:1.5rem}.experiment-grid{grid-template-columns:.85fr 1.15fr .9fr;gap:16px;margin-top:16px;display:grid}.panel{min-width:0}.panel-head{border-bottom:1px solid var(--line);justify-content:space-between;align-items:end;gap:20px;padding:20px 22px;display:flex}.panel-head p{margin-bottom:5px}.panel-head h2{margin-bottom:0;font-size:1.15rem}.panel-head>span{color:var(--orange);letter-spacing:.1em;font-size:.66rem;font-weight:900}.gene-list{gap:15px;padding:22px;display:grid}.gene>div:first-child{color:var(--muted);letter-spacing:.06em;justify-content:space-between;align-items:center;gap:12px;margin-bottom:6px;font-size:.68rem;font-weight:900;display:flex}.gene b{color:#fff}.gene-meter{background:#252b26;height:7px;overflow:hidden}.gene-meter span{background:linear-gradient(90deg, var(--cyan), var(--acid) 64%, var(--orange));height:100%;display:block;box-shadow:0 0 10px #caff2f59}.json-panel pre{color:#b5dfaa;background:#080b09;height:360px;margin:0;padding:22px;font:.72rem/1.65 Consolas,monospace;overflow:auto}.empty-ranking{min-height:280px;color:var(--muted);text-align:center;place-content:center;padding:30px;line-height:1.8;display:grid}.ranking-list{min-height:280px;margin:0;padding:8px 22px;list-style:none}.ranking-list li{border-bottom:1px solid var(--line);grid-template-columns:38px 1fr 42px;align-items:center;gap:12px;padding:14px 0;display:grid}.rank{color:var(--muted);font-family:Arial Black,sans-serif}.ranking-list strong,.ranking-list small{display:block}.ranking-list small{color:var(--muted);margin-top:4px;font-size:.62rem}.ranking-list b{color:var(--acid);text-align:right;font-family:Arial Black,sans-serif;font-size:1.5rem}.reset-button{width:calc(100% - 44px);color:var(--muted);background:0 0;border:1px solid #363d37;margin:0 22px 22px;padding:12px}.reset-button:hover{color:#fff;border-color:var(--orange)}footer{color:#737b72;justify-content:space-between;gap:30px;padding:26px 2px 0;font-size:.7rem;line-height:1.7;display:flex}footer p{max-width:680px;margin-bottom:0}footer span{color:var(--acid);letter-spacing:.1em;flex:none;font-weight:900}@media (width<=1050px){.transport{grid-template-columns:190px 1fr 160px}.next-button{border-top:1px solid var(--line);border-left:0;grid-column:1/-1;min-height:58px}.experiment-grid{grid-template-columns:.8fr 1.2fr}.ranking-panel{grid-column:1/-1}}@media (width<=800px){.app{width:min(100% - 20px,1180px);padding-top:30px}.hero{flex-direction:column;align-items:stretch}h1{font-size:clamp(3rem,17vw,5.8rem)}.generation{grid-template-columns:1fr auto;align-items:center;display:grid}.generation strong{grid-area:1/2/span 2}.transport{grid-template-columns:1fr}.mode-bar{grid-template-columns:repeat(3,1fr)}.mode-bar button{padding:0 8px;font-size:.58rem}.mode-bar span{border-top:1px solid var(--line);text-align:left;grid-column:1/-1;min-height:38px;padding:11px}.battle-switcher{grid-template-columns:1fr}.battle-switcher button{grid-template-columns:auto 1fr}.battle-switcher small{grid-column:2}.rating{padding:20px 12px}.dj-actions{grid-template-columns:1fr 1fr}.dj-evolve-button{grid-column:1/-1}.mutation-button{border-top:1px solid var(--line);border-left:0;min-height:66px}.next-button{border-top:1px solid var(--line);border-left:0;min-height:64px}.experiment-grid{grid-template-columns:1fr}.ranking-panel{grid-column:auto}.status-row,footer{flex-direction:column;align-items:flex-start}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}