/* VEXRA Midnight 2.0 — shared public surfaces, no changes to game logic. */
:root{--pink:#f3a1d7;--muted:#adb6d0;--line:#8d9dd326;--surface:#101a30;--accent:#f3a1d7;color-scheme:dark}
body{background:radial-gradient(ellipse at 90% 0%,#20254d88,transparent 48%),#070e1d;color:#edf0ff}
body>header{background:#0a1224b8;border-color:#8d9dd326;border-radius:0 0 20px 20px}
.brand img,.topbar .brand img{width:60px;height:60px;object-fit:contain!important;border-radius:0!important;margin-right:6px}
.brand{letter-spacing:2px!important;font-weight:750!important}.brand small{display:block;font-size:9px;letter-spacing:2px;color:#a6afca;font-weight:500}
body.midnight-public>header,body.midnight-public>main,body.midnight-public>footer{max-width:1440px}
body.midnight-public>header{padding:18px 30px;min-height:92px}.midnight-public nav{gap:8px;align-items:center}.midnight-public nav a{padding:9px 13px;border-radius:30px;font-size:13px}.midnight-public nav a:hover{background:#ffffff09;text-decoration:none}.midnight-public nav a[aria-current=page]{border:1px solid #cb87d16b;background:linear-gradient(110deg,#362447,#181f38);color:#ffd5f0}
.midnight-public .card,.midnight-pets .card{background:linear-gradient(145deg,#111c33,#0b1427);border-color:#697bab38;box-shadow:0 16px 44px #02071130;border-radius:18px}
.midnight-public .button,.midnight-public button,.midnight-pets button,.midnight-pets .button{background:linear-gradient(100deg,#f1a4d7,#d9b5f6);color:#271a36;border-radius:12px;min-height:44px}.midnight-public .secondary,.midnight-pets .secondary{background:#18223a;color:#e3d8f4;border:1px solid #6a608966}
.midnight-public input,.midnight-public select,.midnight-public textarea,.midnight-pets input,.midnight-pets select{background:#090f20;border-color:#7a86b04d;color:#edf0ff}.midnight-public p,.midnight-pets p{color:#aab5cf}
.midnight-public h1{letter-spacing:-1.8px}.midnight-public .eyebrow{font-size:10px;letter-spacing:2.8px;color:#dab1e6}.midnight-public footer{padding-top:28px;padding-bottom:28px;border-color:#7a86b029}.midnight-public footer a{border:0;background:none;padding:0}
.midnight-public .profile-grid .card{border-top:2px solid #c294d8}.midnight-public .ranking .me{background:#392544}.midnight-public .ranking th,.midnight-public .ranking td{border-color:#7a86b029}.midnight-public .avatar{border:2px solid #d3a3e188;padding:3px}
.midnight-pets .stage{border:1px solid #7989b733;overflow:hidden}.midnight-pets .item{background:#091326;border-color:#6475a439}.midnight-pets .tabs{flex-wrap:wrap}
.midnight-top{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:20px;margin:18px 0 36px}
.midnight-public .midnight-hero{position:relative;isolation:isolate;overflow:hidden;min-height:545px;padding:48px 34px;margin:0;border:1px solid #7486c14f;border-radius:20px;display:flex;flex-direction:column;justify-content:center;background:#0b1429}
.hero-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:65% center;z-index:-2}.midnight-hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#080f23f5 0%,#090f23c9 34%,#090f2338 69%,transparent);z-index:-1}
.midnight-public .midnight-hero h1{font-size:clamp(34px,3.5vw,53px);line-height:1.12;max-width:460px;margin:20px 0}.midnight-hero h1 em{color:#f0a6dc}.midnight-public .midnight-hero p{max-width:340px;color:#c4cbe1;font-size:15px;line-height:1.75}.midnight-hero .actions{margin:18px 0 35px}.hero-foot{display:flex;gap:20px;flex-wrap:wrap;font-size:11px;color:#c3bfd8}.hero-foot span{display:flex;align-items:center;gap:7px}.hero-foot b{color:#e4aedf;font-size:17px}
.midnight-aside{display:flex;flex-direction:column;gap:16px;min-width:0}.midnight-aside .card{padding:21px;margin:0}.panel-title{display:flex;justify-content:space-between;align-items:center;gap:12px}.panel-title h2{font-size:17px;margin:0}.panel-title a{font-size:11px;color:#b8bbd8}.pet-mascot{width:100%;height:180px;object-fit:contain;display:block;margin:8px 0}.pet-summary h3{font-size:19px;margin-bottom:3px}.pet-summary p{font-size:12px;line-height:1.6;margin:5px 0}.pet-summary .pet-numbers{display:flex;gap:12px;padding-top:12px;margin-top:13px;border-top:1px solid #7789bc2b;color:#edc1e6;font-size:12px}.pet-summary .button{display:flex;font-size:12px;margin-top:14px}.pet-caption{display:block;text-align:center;color:#7987a8;font-size:10px;margin-top:-5px}
.lobby-preview{flex:1}.lobby-preview h3{font-size:15px;margin:16px 0 5px}.lobby-preview p{font-size:12px;margin:5px 0}.lobby-preview .button,.lobby-preview button{font-size:12px;width:100%;margin-top:10px}.live-dot{width:7px;height:7px;border-radius:50%;background:#83dab4;box-shadow:0 0 12px #83dab44d}.lobby-count{font-size:11px;color:#a7b3d0}.section-intro{display:flex;align-items:baseline;gap:20px;flex-wrap:wrap}.section-intro h2{font-size:25px}.section-intro p{font-size:13px}
.midnight-public .grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:18px}.midnight-public .game-art{aspect-ratio:1.55;object-fit:cover;min-height:0}.midnight-public .game-copy{padding:19px}.midnight-public .game-copy h3{font-size:18px;line-height:1.35;letter-spacing:-.4px}.midnight-public .game-copy .tag{font-size:8px;letter-spacing:1.1px}.midnight-public .game-copy p{font-size:13px;line-height:1.65;min-height:65px}.midnight-public .game-meta{gap:5px;font-size:10px}.midnight-public .game-meta span{padding:3px 6px}.midnight-public .game-copy .actions{align-items:stretch;flex-direction:column;margin-top:18px;gap:9px}.midnight-public .game-copy .actions button,.midnight-public .game-copy .actions .button{font-size:12px;min-height:39px;background:#ffffff06;color:#ecd9f2;border:1px solid #af8dba70;border-radius:30px}.midnight-public .game-copy .actions button:hover,.midnight-public .game-copy .actions .button:hover{background:#443050}.midnight-public .tile-hint{font-size:10px;text-align:center}.midnight-public .filters{gap:7px;margin:15px 0}.midnight-public .filters button{font-size:11px;padding:6px 13px;min-height:34px;background:#121d32;color:#c6c9dc;border-color:#5d6a903b}.midnight-public .filters button[aria-pressed=true]{background:#3b2949;color:#f7d7f1;border-color:#b47cbe7a}
.midnight-public .signin{background:linear-gradient(115deg,#2c2441,#0e1c32);border-color:#697bab38}.midnight-public .minor{background:#0d182c;border-color:#697bab38}.midnight-public .section-head{padding-top:24px;border-top:1px solid #7382ad26}.midnight-public dialog{background:#0f192d;border-color:#9380ad70;box-shadow:0 24px 120px #000a}.midnight-public .lobby-list{grid-template-columns:repeat(3,minmax(0,1fr))}.midnight-public .lobby-card h3{font-size:17px}
@media(min-width:1700px){.midnight-public .midnight-hero{min-height:580px}}
@media(max-width:1100px){.midnight-top{grid-template-columns:minmax(0,1fr) 260px}.midnight-public .midnight-hero{padding:30px 25px}.midnight-public .grid{grid-template-columns:repeat(2,minmax(0,1fr))}.midnight-public .game-copy p{min-height:42px}.midnight-public nav a{padding:8px}.midnight-public .lobby-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.midnight-top{grid-template-columns:1fr}.midnight-aside{display:grid;grid-template-columns:1fr 1fr}.midnight-public .midnight-hero{min-height:480px}.hero-art{object-position:60% center}.midnight-public>header{padding:14px 18px;align-items:flex-start;gap:12px}.midnight-public nav{gap:3px;flex-wrap:wrap}.midnight-public nav a{font-size:12px}.pet-mascot{height:140px}.midnight-public .midnight-hero h1{font-size:42px}.midnight-public .midnight-hero p{max-width:290px}.midnight-public .section-head{margin-top:24px}.brand img,.topbar .brand img{width:48px;height:48px}}
@media(max-width:480px){.midnight-public .grid,.midnight-public .lobby-list{grid-template-columns:1fr}.midnight-aside{grid-template-columns:1fr}.midnight-public .midnight-hero{min-height:450px;padding:28px 23px}.midnight-public .midnight-hero h1{font-size:38px}.midnight-hero:after{background:linear-gradient(90deg,#080f23f2,#090f2399)}.midnight-public .game-art{aspect-ratio:1.8}.pet-mascot{height:165px}.midnight-public .game-copy p{min-height:0}.midnight-public>header{flex-direction:column}.hero-foot{gap:12px;font-size:10px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* VEXRA Ice / 2026-09 — shared website and control-panel design. */
:root{color-scheme:dark;--ink:#edf4fa;--muted:#a1b4c8;--pink:#8ad8ff;--accent:#8ad8ff;--line:#2b3a48;--surface:#17212b;background:#0d1218;color:var(--ink)}
body{background:radial-gradient(ellipse at 95% 0%,#203b5038,transparent 55%),#0d1218;color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif}
::selection{background:#8ad8ff;color:#0d1218}:focus-visible{outline:3px solid #8ad8ff!important;outline-offset:4px}
a{color:var(--accent)}h1,h2,h3{color:#edf4fa}p,small{color:var(--muted)}
body>header,.topbar{background:#10171f;border-color:var(--line);border-radius:0;border-top:3px solid #8ad8ff}
.brand,.topbar .brand{letter-spacing:1.5px!important}.brand img,.topbar .brand img{width:43px;height:43px}.brand:after{content:'vexra-bot.de';font-size:10px;font-weight:450;letter-spacing:.2px;color:#9aaec2;margin-left:10px}
body.midnight-public>header{padding:20px 26px;min-height:84px}.midnight-public nav a{border-radius:6px;color:#b5c6d6}.midnight-public nav a:hover{background:#1d2b37;color:#fff}.midnight-public nav a[aria-current=page]{background:#20394b;border-color:#3e6c88;color:#b2e7ff}
.card,.midnight-public .card,.midnight-pets .card,.arena,.overlay-card{background:#17212b;border-color:#2b3a48;border-radius:10px;box-shadow:0 12px 32px #0002}
.card h2{letter-spacing:-.4px}.eyebrow,.midnight-public .eyebrow,.tag,.midnight-public .tag{color:#8ad8ff;letter-spacing:1.8px}.midnight-public .card:hover{border-color:#3f566a}
button,.button,.primary,.midnight-public button,.midnight-public .button,.midnight-pets button,.midnight-pets .button{background:#8ad8ff;color:#0b1b26;border:1px solid transparent;border-radius:6px;box-shadow:none;min-height:42px;font-weight:650}
button:hover:not(:disabled),.button:hover,.midnight-public button:hover:not(:disabled),.midnight-public .button:hover,.midnight-pets button:hover:not(:disabled){background:#b8e8ff;color:#0b1b26;text-decoration:none}
button:disabled{opacity:.45;cursor:not-allowed}.secondary,.midnight-public .secondary,.midnight-pets .secondary,button[value=test],button[value=assign]{background:#20303e;color:#c3e6f8;border-color:#395166}
input:not([type=color]):not([type=range]):not([type=checkbox]),select,textarea,.midnight-public input,.midnight-public select,.midnight-public textarea,.midnight-pets input:not([type=color]):not([type=range]),.midnight-pets select,.server-picker select{background:#0f171f;color:#edf4fa;border-color:#354b5e;border-radius:6px}
input::placeholder,textarea::placeholder{color:#94a7b8}input:focus,select:focus,textarea:focus{border-color:#8ad8ff;background:#13212c}input[type=checkbox],input[type=range]{accent-color:#8ad8ff}label{color:#c0d0de}
.midnight-top{grid-template-columns:minmax(0,1fr) 290px;gap:22px;margin:20px 0 36px}.midnight-public .midnight-hero{background:linear-gradient(120deg,#1e3040,#111b25);border:1px solid #354b5e;border-radius:10px;min-height:510px;padding:45px 38px;justify-content:center}
.midnight-public .hero-art{width:45%;height:87%;inset:auto 1% 0 auto;object-fit:contain;object-position:bottom;z-index:-1;opacity:.95}.midnight-hero:after{background:linear-gradient(90deg,#162431 5%,#162431e0 38%,#16243100 75%);z-index:-1}
.midnight-public .midnight-hero h1{font-size:clamp(38px,4.5vw,64px);line-height:1.06;max-width:490px;letter-spacing:-2.3px}.midnight-hero h1 em{color:#8ad8ff}.midnight-public .midnight-hero p{max-width:330px;color:#bacbd9;font-size:15px}.hero-foot{color:#afc1d0}.hero-foot b{color:#8ad8ff}.midnight-hero .actions{margin-top:20px}.midnight-hero .actions .secondary{background:#172a39;color:#c2e4f5}
.pet-summary .pet-numbers,.panel-title a{color:#91d7f7}.pet-caption{color:#9caebb}.midnight-aside .card{padding:21px}.midnight-aside .pet-mascot{height:155px}.pet-summary h3{font-size:18px}.live-dot{background:#79d6b8}
.midnight-public .grid{gap:18px}.midnight-public .game-art{aspect-ratio:1.65}.midnight-public .game-copy{padding:20px}.midnight-public .game-copy h3{font-size:19px}.midnight-public .game-meta span{background:#101922;border-color:#314557;color:#b8cbd9}.midnight-public .game-copy .actions .button,.midnight-public .game-copy .actions button{border-radius:6px;background:#203444;border-color:#3e6078;color:#afe5ff;min-height:42px}.midnight-public .game-copy .actions .button:hover,.midnight-public .game-copy .actions button:hover{background:#2d4a60}
.midnight-public .filters button{border-radius:6px;background:#17212b;color:#aabed0;border-color:#304354;min-height:40px}.midnight-public .filters button[aria-pressed=true]{background:#254257;border-color:#5989a5;color:#c4ecff}
.midnight-public .signin,.midnight-public .minor,.server-picker,.master-link{background:#172733;border-color:#314b60;border-radius:8px}.midnight-public dialog,dialog{background:#141f29;color:#edf4fa;border-color:#496779;border-radius:12px}.midnight-public .section-head{border-color:#2b3a48}.empty{border-color:#3a4f60;color:#a1b4c8}
.midnight-public .profile-grid .card{border-top-color:#8ad8ff}.midnight-public .ranking .me{background:#20394b}.midnight-public .ranking th,.midnight-public .ranking td{border-color:#304252}.midnight-public .avatar{border-color:#8ad8ff}.ranking .me small{color:#8ad8ff}
.midnight-pets .item{background:#101922;border-color:#304354;border-radius:8px}.midnight-pets .tabs button{background:#20303e;color:#bfd5e4}.midnight-pets .tabs button.active{background:#8ad8ff;color:#102332}.midnight-pets .stage{border-color:#3a5064}
.dashboard-layout{gap:28px}.dashboard-layout>.tabs{background:#111a23;border:1px solid #2e4051;border-radius:8px;padding:10px}.dashboard-layout>.tabs a{color:#a6becf;border-radius:5px}.tabs a:hover{background:#1d3040}.tabs a[aria-current=page]{background:#254257;color:#b9e9ff;box-shadow:inset 3px 0 #8ad8ff}.shell .card{padding:26px}.shell h1{letter-spacing:-1.3px}.access-card{box-shadow:0 24px 80px #0005;border-top:3px solid #8ad8ff}.login .access-notes{color:#a1b4c8}.topbar small a{color:#bad8e9}.settings .content>.note,code{background:#1e2c38;color:#c4d8e8}.footer,footer,.midnight-public footer{border-color:#2b3a48;color:#93a9ba}.footer a,footer a{color:#aac3d6}
.ok{background:#173429;color:#a5edc9;border-color:#376b52}.err,.error{color:#ffb6bc}.err{background:#361f28;border-color:#73434d}.badge{color:#8ad8ff}.vexra-maintenance main{background:#15212c;border-color:#365165;border-radius:12px;border-top:3px solid #8ad8ff}.vexra-maintenance a.button{background:#8ad8ff;color:#102332;border-color:#8ad8ff;border-radius:6px}
.vexra-game .card,.vexra-game .panel{background:#17212b;border-color:#304354}.vexra-game button.active{background:#294d65;border-color:#8ad8ff;color:#d2f0ff}.vexra-game #word{color:#8ad8ff}.vexra-game #notice{color:#ffc7ce}.vexra-game #players>div{border-color:#304354}.vexra-game #board{background:white;border-color:#6b8498}.vexra-game .tools input[type=color]{padding:2px;min-height:32px}.vexra-game small{color:#a1b4c8}
@media(max-width:1100px){.midnight-top{grid-template-columns:minmax(0,1fr) 260px}.midnight-public .midnight-hero{padding:30px}.brand:after{display:none}.midnight-public .midnight-hero h1{font-size:44px}}
@media(max-width:800px){.dashboard-layout{grid-template-columns:1fr}.topbar{height:auto;min-height:76px;flex-wrap:wrap;padding:16px 20px}.dashboard-layout>.tabs{position:static}.tabs a[aria-current=page]{box-shadow:inset 0 -2px #8ad8ff}.midnight-top{grid-template-columns:1fr}.midnight-public .midnight-hero{min-height:440px}.midnight-public .hero-art{width:42%}.midnight-public .midnight-hero p{max-width:270px}}
@media(max-width:480px){.midnight-public .midnight-hero{padding:26px 22px;min-height:480px;justify-content:flex-start}.midnight-public .midnight-hero h1{font-size:42px;max-width:290px}.midnight-public .hero-art{width:48%;height:40%;right:0;opacity:.55}.midnight-hero:after{background:linear-gradient(90deg,#162431ef,#16243166)}.midnight-public .midnight-hero p{max-width:260px}.midnight-public .midnight-hero .actions{max-width:220px}.hero-foot{position:relative;z-index:1;gap:10px}.midnight-public>header{padding:18px}.midnight-public nav a{padding:8px 10px}.shell .card{padding:20px}.topbar .brand span{font-size:12px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}