:root{color-scheme:dark;--blue:#44cbff;--orange:#ff9b38;--gold:#ffd57a}*{box-sizing:border-box}body{margin:0;font-family:Arial,sans-serif;color:#e5f0ff;background:#050c20 url('/assets/world.png') center top/cover fixed}body:before{content:'';position:fixed;inset:0;background:linear-gradient(#050c20cc,#050c20e8);z-index:-1}main{max-width:1100px;margin:auto;padding:20px 24px}header{display:flex;align-items:center;gap:18px;padding:0 0 20px;border-bottom:1px solid #6e9dcc30}.brand{font-size:28px;font-weight:900;color:var(--gold);letter-spacing:1px}.brand b{color:var(--blue)}.badge{font-size:10px;letter-spacing:2px;color:#95abc8;margin-right:auto}button,a{touch-action:manipulation}button{font:700 12px Arial;letter-spacing:1px;padding:11px 15px;background:#162847;border:1px solid #6387ac66;border-radius:10px;color:#e5f0ff;cursor:pointer}button:hover:enabled{filter:brightness(1.22)}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible{outline:3px solid white;outline-offset:3px}.gold{background:linear-gradient(#ffe3a0,#f2ac36);color:#322009;border:1px solid #ffedbb;box-shadow:0 5px 30px #f8b94630;font-size:17px;padding:16px 42px}.lobby{padding:90px 0 110px;max-width:620px}.lobby h1{font-size:clamp(44px,7vw,76px);line-height:1.05;margin:0 0 25px;letter-spacing:-3px}.lobby em{font-style:normal;color:var(--blue)}p{line-height:1.7;color:#b1c4df}.small{font-size:12px}.room-bar{display:flex;gap:12px;align-items:center;margin:18px 0;font-size:12px}.room-bar span{margin-right:auto;color:#96b7dd}.room-bar a{color:#b1c4df}.scoreboard{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;gap:18px}.player{padding:14px 20px;border:1px solid #44cbff66;border-radius:16px;background:linear-gradient(140deg,#123456cc,#08182acc);display:flex;flex-direction:column;gap:5px}.player>span{font-size:11px;letter-spacing:1px;color:var(--blue)}.player strong{font-size:28px;font-variant-numeric:tabular-nums}.player small{color:#a7bedb;font-size:11px}.orange{border-color:#ff9b3866;background:linear-gradient(220deg,#57301dcc,#08182acc);text-align:right}.orange>span{color:var(--orange)}.pot{text-align:center}.pot small{letter-spacing:2px;font-size:10px;color:#b6c8e0}.pot strong{display:block;font-size:35px;color:var(--gold);margin-top:7px}.pot strong span{font-size:12px}#arena{width:100%;max-width:920px;margin:8px auto 0}#arena canvas{display:block}.battle-status{text-align:center;font-size:15px;color:var(--gold);min-height:30px}.line-header{display:flex;align-items:center;justify-content:space-between;margin-top:16px}.line-header h2{font-size:11px;letter-spacing:2px}.line-header span{font-size:11px;color:#b1c4df}.lines{display:grid;grid-template-columns:repeat(10,1fr);gap:8px}.line{padding:8px 3px;background:#0e203ae8;border-radius:9px;min-width:0}.line svg{width:100%;height:27px;display:block;color:#8094b2}.line span{font-size:12px}.line.blue-owned{border-color:var(--blue);background:#0c3e59}.line.orange-owned{border-color:var(--orange);background:#59341a}.line.blue-owned svg{color:var(--blue)}.line.orange-owned svg{color:var(--orange)}.line.winner{box-shadow:0 0 15px #ffd57a99;border-color:var(--gold)}.line:disabled{opacity:1}.line:disabled:not(.blue-owned):not(.orange-owned){opacity:.4}.actions{text-align:center;margin:22px 0}.result{padding:16px;border:1px solid #ffd57a66;border-radius:12px;background:#102039;text-align:center;line-height:1.7;font-size:13px}.result button{margin:4px;font-size:11px}#notice{min-height:22px;text-align:center;color:#ffbb9b;font-size:13px}details{font-size:12px;color:#9bb4d1;max-width:800px;margin:20px auto}summary{cursor:pointer}footer{text-align:center;font-size:9px;letter-spacing:2px;color:#667e9b;padding:18px}body.blue-seat #your-side{color:var(--blue)}body.orange-seat #your-side{color:var(--orange)}@media(max-width:600px){main{padding:12px}header{gap:10px}.brand{font-size:21px}.badge{font-size:8px;letter-spacing:1px}#sound{padding:8px;font-size:9px}.scoreboard{gap:8px}.player{padding:10px}.player strong{font-size:23px}.player>span{font-size:9px}.pot strong{font-size:28px}.pot small{font-size:8px;letter-spacing:1px}.lines{grid-template-columns:repeat(5,1fr);gap:6px}.line svg{height:24px}.room-bar{gap:8px}.room-bar button{font-size:9px;padding:9px}.line-header span{max-width:50%;text-align:right}.lobby{padding:70px 0}.battle-status{font-size:12px}}
#arena{aspect-ratio:680 / 410;position:relative;min-height:1px}#arena canvas{max-width:100%;max-height:100%}
#rotate-device{display:none}
#arena-logo{position:absolute;top:1.5%;left:50%;transform:translateX(-50%);height:19%;width:auto;max-width:24%;object-fit:contain;z-index:3;pointer-events:none}
#game-content #arena{aspect-ratio:900 / 410;max-width:1100px}
main{max-width:1280px}.room-bar{margin:10px 0}.scoreboard{grid-template-columns:1fr 1fr 1fr}.actions{margin:10px 0}.line-header{margin-top:6px}
@media(orientation:portrait) and (max-width:1100px) and (any-pointer:coarse){#rotate-device{position:fixed;inset:0;z-index:1000;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;background:#050c20;color:#e5f0ff}#game-content{visibility:hidden;pointer-events:none}.rotate-icon{font-size:100px;color:#ffd57a}#rotate-device h1{font-size:28px;color:#44cbff}#rotate-device small{color:#a7bedb}}
@media(orientation:landscape) and (max-height:600px){main{padding:8px 14px}header{padding-bottom:6px}.brand{font-size:19px}.badge{font-size:8px}.room-bar{margin:6px 0}.room-bar button,button{padding:6px 10px;font-size:10px}.player{padding:5px 10px;gap:2px}.player strong{font-size:20px}.pot strong{font-size:23px;margin-top:2px}#arena{width:min(100%,calc(50dvh * 900 / 410));margin-top:0}.battle-status{min-height:20px;font-size:12px}.line-header h2{margin:4px 0}.lines{grid-template-columns:repeat(10,1fr);gap:4px}.line{padding:3px}.line svg{height:16px}.line span{font-size:10px}.gold{padding:8px 24px;font-size:13px}.actions{margin:6px 0}footer{padding:8px}.lobby{padding:25px 0}}
.login{font-size:10px;letter-spacing:1px;color:#d9e7ff;border:1px solid #6387ac66;border-radius:8px;padding:9px 11px;text-decoration:none;background:#162847}
.profile-chip{display:flex;align-items:center;gap:10px;padding:4px 10px 4px 4px;text-align:left;letter-spacing:0;font-size:12px}.profile-chip[hidden]{display:none}.profile-chip img{width:40px;height:40px;border-radius:50%;object-fit:cover;background:#102039;border:2px solid var(--gold)}
#profile-dialog{color:#e5f0ff;background:radial-gradient(ellipse at top right,#17405d,#091426 65%);border:1px solid #44cbff66;border-radius:24px;width:min(480px,94vw);max-height:92dvh;padding:28px;box-shadow:0 18px 100px #000b;overflow:auto}#profile-dialog::backdrop{background:#020818dd;backdrop-filter:blur(7px)}.profile-heading{display:flex;justify-content:space-between;align-items:center}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--blue)}#profile-title{color:var(--gold);font-size:32px;margin:10px 0;letter-spacing:1px}.profile-intro{font-size:13px;margin:0 0 22px}.profile-summary{display:flex;align-items:center;gap:22px;margin-bottom:20px}.profile-summary img{width:112px;height:112px;object-fit:cover;border-radius:50%;border:3px solid var(--gold);background:#102039;box-shadow:0 0 30px #44cbff22}.profile-summary strong{display:block;font-size:30px;margin:6px 0}.profile-summary small{color:#a7bedb;font-size:11px}.upload-photo{position:relative;display:inline-block;overflow:hidden;border:1px solid #44cbff99;background:#123654;border-radius:10px;padding:12px;font-size:11px;font-weight:700;cursor:pointer}.upload-photo:focus-within{outline:3px solid white}.upload-photo input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}.quiet{background:transparent;font-size:10px;padding:10px;border:0;color:#b1c4df}.profile-help{font-size:11px;line-height:1.5;color:#a7bedb}.profile-label{display:block;margin:18px 0 8px;font-size:10px;letter-spacing:2px;color:#b1c4df}#profile-name,#profile-email{width:100%;padding:13px;border-radius:10px;background:#08182a;border:1px solid #6387ac66;color:#e5f0ff;font:15px Arial}#profile-name:focus{outline:2px solid var(--blue)}#profile-email{color:#95abc8}#profile-message{min-height:20px;font-size:12px;color:var(--gold)}#profile-save{width:100%;font-size:14px}#profile-close{padding:7px 10px}
@media(max-width:700px){header{gap:8px;flex-wrap:wrap}.profile-chip img{width:32px;height:32px}.profile-chip{font-size:10px}.badge{letter-spacing:1px}#logout{font-size:9px;padding:8px}#profile-dialog{padding:20px}}