@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600;700;800;900&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--bg:#0d1010;--panel:#151918;--line:#2a302d;--muted:#929b95;--lime:#d4fa63;--pink:#ff7e98}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#f0f3ec;font-family:'Space Grotesk','Noto Sans JP',sans-serif;font-size:14px}button,a,textarea,select,input{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{opacity:.4;cursor:default}header{height:90px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 5%;gap:20px}.brand{color:var(--lime);text-decoration:none;font-size:27px;letter-spacing:-1px}.brand strong{color:#f5f8f0;font-size:21px}.brand small{font-size:10px;display:block;color:var(--muted);letter-spacing:2px;margin-left:34px}.badge{font-size:11px;letter-spacing:1px;display:flex;align-items:center;gap:10px}.badge span{color:var(--muted);border-left:1px solid var(--line);padding-left:15px}i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--lime)}.quiet{border:1px solid var(--line);background:transparent;color:#c4ccc5;padding:10px 15px;border-radius:7px}.quiet:hover{background:#242a24;color:white}main{max-width:1400px;margin:auto;padding:43px 5% 0}.intro{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}.eyebrow{color:var(--lime);font-size:10px;letter-spacing:2.5px;font-weight:700}h1{font-size:32px;margin:10px 0 9px;letter-spacing:-1px}em{font-style:normal;color:var(--lime)}p{color:var(--muted);line-height:1.8;margin:0}.layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:22px}.arena,.spectators,.feed{background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden}.score{display:flex;background:#1b201c;border-bottom:1px solid var(--line);padding:23px 30px;gap:35px}.score>div{flex:1}.score>div+div{border-left:1px solid #363d31;padding-left:28px}.score label{display:block;color:var(--muted);font-size:10px;letter-spacing:1px;margin-bottom:8px}.score strong{font-size:28px;font-weight:600}.score strong small{font-size:14px;color:#737d73}.hearts{color:var(--pink);letter-spacing:4px;white-space:nowrap}.battle{padding:28px 30px 25px;min-height:430px}.phase{display:flex;justify-content:space-between;font-size:10px;font-weight:700;letter-spacing:1.1px;color:#6e786e}.phase span:first-child{color:var(--lime);background:#293220;padding:5px 9px;border-radius:4px}.phase span:last-child{padding:5px 0}h2{font-size:23px;margin:22px 0 8px}.battle>p{font-size:12px}.target{font-size:22px;font-weight:700;line-height:1.8;letter-spacing:1px;margin:24px 0;padding:22px;border:1px dashed #3c4635;border-radius:8px;background:linear-gradient(120deg,#1d2419,#181c17);overflow-wrap:anywhere}.target span{display:block;font-weight:400;letter-spacing:0;font-size:11px;color:var(--muted);margin-top:5px}.target .correct{color:var(--lime);display:inline;font-size:inherit;letter-spacing:inherit;font-weight:inherit}.target .wrong{color:var(--pink);display:inline;font-size:inherit;letter-spacing:inherit;font-weight:inherit;text-decoration:underline}.inputhead{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-bottom:10px}textarea{resize:none;background:#0f1310;border:1px solid #414c36;border-radius:7px;color:white;width:100%;padding:16px;font:16px 'Noto Sans JP',sans-serif;outline:none}textarea:focus{border-color:var(--lime);box-shadow:0 0 0 3px #d4fa630b}textarea:disabled{opacity:.4}.timebar{height:3px;background:#2b3227;margin-top:10px;border-radius:5px;overflow:hidden}.timebar div{height:100%;width:0;background:var(--lime);transition:width .1s linear}.inputfoot{display:flex;align-items:center;justify-content:space-between;margin-top:9px;color:#7d897d;font-size:10px}.inputfoot b{font-size:24px;color:#e9eee5;font-weight:500}.inputfoot b span{font-size:9px;color:var(--muted)}.actions{display:flex;justify-content:space-between;gap:12px;margin-top:25px}.primary{border:0;background:var(--lime);color:#1b2513;font-weight:800;border-radius:7px;padding:14px 24px;box-shadow:0 3px 20px #c8ff510e}.primary:hover{background:#e2ff8d}.primary span{margin-left:20px}.steps{display:flex;border-top:1px solid var(--line);padding:22px 25px;gap:15px;background:#121612}.steps>div{display:flex;align-items:center;flex:1;gap:10px;color:#647061}.steps b{font-size:11px;border:1px solid #35402e;padding:7px;border-radius:6px}.steps span{font-size:11px}.steps small{display:block;font-size:9px;margin-top:5px}.steps .active{color:var(--lime)}.steps .active b{background:#303e20;border-color:#5c7938}.panelhead{display:flex;justify-content:space-between;align-items:center;padding:20px 20px 17px}.panelhead h3{margin:0;font-size:11px;letter-spacing:1px}.panelhead span{font-size:9px;color:var(--lime)}#avatars{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;padding:0 20px 18px}.avatar{height:33px;border-radius:7px;background:#283526;color:#c1da9d;border:1px solid #405037;display:grid;place-items:center;font-size:14px;transition:all .5s}.avatar:nth-child(3n){background:#293333;color:#9dcac9;border-color:#3b4a49}.avatar:nth-child(4n){background:#353024;color:#d6c398;border-color:#4b4231}.avatar.dead{background:#1b201c;color:#4e574d;border-color:#292e28;opacity:.55}.legend{display:flex;justify-content:center;gap:18px;font-size:9px;color:var(--muted);padding:13px;border-top:1px solid var(--line)}.legend span+span i{background:#535d50}.legend i{margin-right:5px}.feed{margin-top:18px}#logs{height:205px;overflow:auto;padding:0 20px 15px}.log{font-size:11px;line-height:1.8;border-left:1px solid #3c4734;padding:0 0 15px 13px;color:#aab5a4}.log time{font-size:9px;color:#65725e;display:block}.log b{color:var(--lime);font-weight:500}.note{display:flex;gap:12px;padding:20px 8px}.note>span{font-size:25px;color:var(--lime)}.note p{font-size:11px;color:#c2cbbd}.note small{display:block;font-size:10px;color:#707d6b}footer{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);margin-top:32px;padding:20px 0;color:#6c7868;font-size:10px}footer b{font-weight:400;font-size:8px;margin-left:12px;color:#525f4d}footer .quiet{font-size:9px;border:0;padding:5px}.candidate{width:100%;text-align:left;border:1px solid #3b4832;border-radius:7px;padding:12px 15px;background:#1c2418;color:#e9efdf;margin-top:8px;display:flex;justify-content:space-between;gap:10px}.candidate small{color:#a1b58e;white-space:nowrap}.candidate:hover{border-color:var(--lime)}dialog{border:1px solid #526342;border-radius:14px;background:#192017;color:white;max-width:500px;width:90%;padding:35px}dialog::backdrop{background:#000b;backdrop-filter:blur(5px)}.close{float:right}dialog h2{margin-top:12px}dialog p{margin-bottom:15px;font-size:13px}dialog label{display:block;margin:15px 0}dialog select{background:#11170f;color:white;padding:9px;border:1px solid #526342;border-radius:5px;margin-left:10px}dialog .primary{margin-top:15px;width:100%}:focus-visible{outline:2px solid var(--lime);outline-offset:3px}@media(min-width:1500px){main{padding-top:55px}.battle{min-height:470px}}@media(max-width:950px){.layout{grid-template-columns:1fr}aside{display:grid;grid-template-columns:1fr 1fr;gap:15px}.feed{margin:0}.note{grid-column:1/-1}.badge span{display:none}main{padding:25px 4%}.intro p{font-size:11px}.intro .quiet{font-size:11px}h1{font-size:26px}}@media(max-width:600px){header{height:75px;padding:0 4%}.brand strong{font-size:17px}.badge{display:none}.intro{display:block}.intro .quiet{margin-top:18px}h1{font-size:24px}.battle{padding:22px 18px}.score{padding:18px 15px;gap:10px}.score>div+div{padding-left:12px}.score strong{font-size:21px}.hearts{letter-spacing:1px}.score label{font-size:8px}.target{font-size:18px;padding:15px}.steps{padding:17px 12px;gap:8px}.steps small{display:none}.steps span{font-size:9px}aside{grid-template-columns:1fr}.note{display:none}footer>span:nth-child(2){display:none}.actions .quiet{font-size:10px;padding:10px}.primary{padding:13px 16px}.inputfoot{font-size:8px}}