/* Arena illustration and dark translucent panels share the same stadium palette. */
:root{background:#103768}
body{isolation:isolate;position:relative;min-height:100vh}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background-color:#103768;background-image:linear-gradient(180deg,#06234926 0%,#09295012 43%,#051d3a80 100%),url('/arena-background.png');background-size:cover;background-position:center;background-repeat:no-repeat}
.topbar{background:#0623466b;border-color:#b4e1ff26;backdrop-filter:blur(12px);border-radius:0 0 18px 18px;box-shadow:0 8px 30px #041d3520}
.brand{color:#fff}.brand-icon{box-shadow:0 0 16px #2adbd550}.top-note{color:#c0d7e9}.tag{color:#9ec9e5}
.hero{padding-top:56px;padding-bottom:42px}
.hero h1{color:#fff;text-shadow:0 3px 0 #082752,0 10px 28px #031a4266}
.hero h1 em{color:#6de3ff;text-shadow:0 3px 0 #123e6d,0 0 26px #42b7ef44}
.hero p{color:#d2e6f3;text-shadow:0 2px 10px #041c42}
.eyebrow{color:#83f1dc}.eyebrow:before{background:#83f1dc;box-shadow:0 0 12px #83f1dc}
.hero .eyebrow{width:fit-content;padding:7px 10px;background:#06244899;border:1px solid #83f1dc33;border-radius:20px}
.hero-logo{filter:drop-shadow(0 4px 0 #ffffff38) drop-shadow(0 15px 24px #04173388)}
.hero-art:before{background:#4ad5ff;opacity:.12;filter:blur(40px)}
.scribble{color:#b8e4fc;text-shadow:0 2px 6px #072550}
.step{color:#c0d7e9}.step span{background:#b3d7f022;color:#c0d7e9;border:1px solid #b9e2ff33}
.step.active{color:#fff}.step.active span{background:#22b7cb;border-color:#74e8ef;color:#fff;box-shadow:0 0 15px #15c7df38}.step-line{background:#9bcce44d}
.card{background:linear-gradient(140deg,#123c65ed,#081f3aeb);color:#ecf7ff;box-shadow:inset 0 1px 0 #bceeff1a,0 18px 45px #020e294a;border-color:#6fc9f340;border-radius:20px;backdrop-filter:blur(18px)}
.intro-card{background:linear-gradient(140deg,#104c6cde,#0b344bdb);border-color:#66e7df45}
.intro-card:after{color:#8ceff410}
.create-grid>.card:not(.intro-card){background:linear-gradient(140deg,#143f68f2,#09243fee)}
.section-head p,.intro-card p,.subtitle,.fineprint,.field small,.start-note{color:#b0cada}
.intro-card p{color:#b6d9e8}.section-code{color:#7be7ec}.feature-icon{background:#6de8ef18;color:#8ef4eb;border:1px solid #8ef4eb2b}
.field{color:#d5eaf6}.field input,.field select{background:#061b34a8;border-color:#8abed54d;color:#f0faff;box-shadow:inset 0 2px 6px #020d211f}
.field input::placeholder{color:#90adc4;opacity:1}.field input:focus,.field select:focus{outline:2px solid #6be1ed55;border-color:#6be1ed;background:#0b2d4c}
.field select option{background:#0e365a;color:#f0faff}
.primary{background:linear-gradient(110deg,#22d4cc,#35b9f0);color:#062c45;border:1px solid #8cf5ed88;box-shadow:0 4px 0 #04273e44,0 7px 22px #22c4dd24}.primary:hover{background:linear-gradient(110deg,#5aeee0,#65d3ff);color:#062c45}
.primary.teal{background:linear-gradient(110deg,#22d4cc,#35b9f0)}
.secondary{background:#78bbdc12;color:#d6edfb;border-color:#86c4e84d}.secondary:hover{background:#78bbdc26}
.ghost{color:#83dff5}.danger{background:#ff98751c;color:#ffba9e;border-color:#ff987533}
.pill{background:#43dfc51a;color:#8bf1d9;border:1px solid #7aecd62b}.pill.blue{background:#68cfff17;color:#98dfff}.pill.orange{background:#ff9e6f1a;color:#ffbd98}
.rule-note{background:#75c9ed0d;color:#b2cfdf;border:1px solid #89d9ee1f}.rule-note strong{color:#d2edf8}.divider{border-color:#8abed52b}
.back-link{color:#b4d3e5}.member{background:#06213a40;border-color:#7ec6e62b}.member-gender,.member-actions button{color:#a5c6d9}
.avatar{background:#54bce925;color:#a1e7ff}.avatar.female{background:#ff9d7c20;color:#ffc1a6}.avatar.unknown{background:#6ee6cc20;color:#9cf1df}
.empty-seat{border-color:#81bed348;color:#a3c4d6}.statusline{color:#accfdf}
.invite p{color:#b0cada}.invite-qr{background:#fff;border-color:#9bdff055}
.match-card{background:linear-gradient(130deg,#10375bee,#0a2442ee);border-color:#75bde53d;color:#edf7ff;box-shadow:inset 0 1px 0 #b9edff0d,0 8px 22px #02182f24}
.match-top{color:#a4c8dd}.match-bottom{border-color:#7cbad42b}.match-score small{color:#a8c6d8}.vs{color:#8eb9d0}
.mini-table th{color:#a5c4d7}.mini-table td{border-color:#8abed524}.rank-no{background:#a2d5f21a;color:#b0d9ee}.rank-no.first{background:#ffca681f;color:#ffdb93}
.progress-numbers small{color:#a6c5d8}.settle-panel{background:#0b4947e8;border-color:#7ae5d34a;color:#edfffa}.settle-panel p{color:#a9ddcf}
.stat{background:#0b2c4de8;border-color:#7ec4e13d;color:#e8f8ff}.stat span{color:#a8c9dd}
.mvp-card{background:linear-gradient(120deg,#0b5266ee,#123c5aed);border-color:#73e9eb55}.mvp-caption{color:#8cebf1}.mvp-card p{color:#b3d9e4}
.report-table th{background:#76c7ed0c;color:#a9c9dc}.report-table td{border-color:#8abed524}.report-table .winner-row{color:#86ece0}
dialog{background:linear-gradient(145deg,#143d60,#0b2541);color:#edf8ff;border:1px solid #8fd7f14d}.dialog-close{color:#bad9e9}
.recovery-code{background:#041b32a3;border-color:#7fd3ec66;color:#bcefff}.score-team-labels{background:#68c6e511;color:#c4e4f6}
.score-game input{background:#061e35;border-color:#7eb7d04d;color:#f0faff}.score-game span{color:#abcbdc}.form-error{color:#ffb7a5}
.export-link{color:#93e8ff}
/* Ten locally generated bird portraits, one stable random assignment per player. */
.bird-avatar{display:inline-block;flex-shrink:0;width:44px;height:44px;background-image:url('/bird-avatars.png');background-size:500% 200%;background-repeat:no-repeat;vertical-align:middle;filter:drop-shadow(0 2px 3px #04162a44)}
.bird-0{background-position:0% 0%}.bird-1{background-position:25% 0%}.bird-2{background-position:50% 0%}.bird-3{background-position:75% 0%}.bird-4{background-position:100% 0%}
.bird-5{background-position:0% 100%}.bird-6{background-position:25% 100%}.bird-7{background-position:50% 100%}.bird-8{background-position:75% 100%}.bird-9{background-position:100% 100%}
.bird-avatar-small,.team .bird-avatar{display:inline-block;width:25px;height:25px;margin-right:3px}.member .bird-avatar{width:48px;height:48px}.member{padding-left:8px;gap:8px}
.mvp-players{display:flex;justify-content:center;align-items:flex-start;gap:25px;flex-wrap:wrap;width:100%;margin:18px auto}
.mvp-player{min-width:0;flex:0 1 200px;text-align:center}
.mvp-avatar-frame{position:relative;display:grid;place-items:center;width:154px;height:154px;margin:0 auto;background:radial-gradient(circle,#8df1ed29,#8df1ed00 72%)}
.bird-avatar-award{width:144px;height:144px;filter:drop-shadow(0 8px 12px #04162a66)}
.avatar-crown{position:absolute;top:-14px;left:50%;transform:translateX(-50%) rotate(-8deg);font-size:38px;color:#ffdb84;text-shadow:0 3px 0 #995f2c}
.mvp-player-name{font-size:25px;line-height:1.5;color:#f2fbff;margin:10px 0 6px;font-weight:900;overflow-wrap:anywhere}
.mvp-player-stat{font-size:11px;color:#b6dae8;line-height:1.8;display:block}
.mvp-duo .mvp-player{flex-basis:calc(50% - 15px);max-width:220px}.mvp-group .mvp-player{flex-basis:125px}
.mvp-group .mvp-avatar-frame{width:95px;height:95px}.mvp-group .bird-avatar-award{width:88px;height:88px}.mvp-group .mvp-player-name{font-size:18px}
.mvp-compact{justify-content:flex-start;gap:18px;margin:25px 0 18px;max-width:100%}.mvp-compact .mvp-player{flex-basis:150px;max-width:210px}
.mvp-compact .mvp-avatar-frame{width:100px;height:100px}.mvp-compact .bird-avatar-award{width:94px;height:94px}.mvp-compact .avatar-crown{font-size:28px;top:-12px}
.mvp-compact .mvp-player-name{font-size:21px;margin:7px 0}.mvp-card .mvp-trophy{font-size:42px;top:24px;right:22px}
.reveal-content>.trophy{font-size:48px;margin:12px 0 15px}.reveal-content .mvp-players{max-width:680px;margin:12px 0 24px}
.reveal-content .mvp-player h2{font-size:28px;margin:12px 0 7px;letter-spacing:1px;animation:fade-up .7s 1.2s both}
.reveal-content .mvp-avatar-frame{animation:bird-in .8s .35s cubic-bezier(.16,1.6,.5,1) both}
.reveal-content .mvp-duo .mvp-player:nth-child(2) .mvp-avatar-frame{animation-delay:.6s}
.reveal-content .mvp-group h2{font-size:20px}.reveal-content .mvp-player-stat{animation:fade-up .7s 1.4s both}
.reveal-content .mvp-player{overflow:visible}.reveal-content .reveal-eyebrow{line-height:1.8;letter-spacing:4px}
.reveal-content{justify-content:flex-start;justify-content:safe center}
.report-table .bird-avatar{width:25px;height:25px;margin-right:4px}
.match-body{grid-template-columns:minmax(0,1fr) 80px minmax(0,1fr)}
.team{min-width:0;max-width:100%}.team>span{display:flex;min-width:0;max-width:100%}
.team .player-name{display:block;min-width:0;overflow-wrap:anywhere;word-break:break-word;line-height:1.6}
.team .gender-symbol{flex-shrink:0}
.room-title h1{color:#fff;text-shadow:0 4px 20px #041b38}.room-head .back-link{color:#b6d8eb}
.room-meta{color:#c7deee}.room-code{color:#9ccae3}.room-head .room-logo{filter:drop-shadow(0 8px 15px #04173388)}
.main-column>section:not(.card)>.section-head h2,.round-header h3{color:#f0faff}
.main-column>section:not(.card)>.section-head p,.round-header .subtitle,.rest-note{color:#bad9ec;text-shadow:0 1px 4px #05264a}
.main-column>section:not(.card)>.section-head{border-bottom:1px solid #c4e7ff26;padding-bottom:16px}
.side-note{background:#082c57c9;border-color:#91cce866;color:#c8e1f1;backdrop-filter:blur(8px)}.side-note strong{color:#8ae5ef}
.side-column>.statusline{color:#b7dce9}.side-column>.ghost,main>.ghost{color:#9be8fb}
.footer{border-color:#b5dbef33;color:#c1dced;text-shadow:0 1px 4px #05264a}.footer .tiny-shuttle{color:#80f0dc}
.loading{color:#d2e8f8}.error-state{box-shadow:0 15px 45px #041d3d44}
.reveal{background-image:linear-gradient(#052345ab,#071e3cef),url('/arena-background.png');background-size:cover;background-position:center}
/* Manga lettering: display treatment on headings, calm typography on editable content. */
body{font-family:var(--font-body);-webkit-font-smoothing:antialiased}
.field{font-size:13px;font-weight:600;letter-spacing:.6px;gap:11px}
.field input,.field select{font-family:var(--font-body);font-size:14px;font-weight:500;letter-spacing:.3px;height:49px}
.field input::placeholder{font-size:12px;font-weight:400;letter-spacing:.4px}
.section-head p,.intro-card p{font-size:13px;line-height:1.9;letter-spacing:.35px}
.fineprint{font-size:11px;line-height:1.9;letter-spacing:.25px}
.primary,.secondary{letter-spacing:.8px;font-weight:800}
.hero h1,.intro-card h2,.create-grid .section-head h2,.room-title h1{
  font-family:var(--font-display);font-weight:900;font-style:italic;letter-spacing:1px;
  transform:skewX(-6deg);transform-origin:left center;paint-order:stroke fill;
  -webkit-text-stroke:.65px currentColor;
}
.hero h1{line-height:1.38;text-shadow:2px 3px 0 #072749,4px 5px 0 #ff9966,0 12px 26px #031a4266}
.hero h1 em{font-style:inherit;text-shadow:2px 3px 0 #072749,4px 5px 0 #159fc8,0 0 25px #42b7ef44}
.intro-card h2{font-size:32px;line-height:1.5;text-shadow:2px 3px 0 #082d46,3px 4px 0 #45c8d5;max-width:95%}
.create-grid .section-head{align-items:flex-start}
.create-grid .section-head h2{position:relative;display:inline-block;font-size:26px;line-height:1.5;color:#f0fcff;text-shadow:2px 2px 0 #082844,3px 3px 0 #34b6d2;padding-bottom:10px;margin-bottom:4px}
.create-grid .section-head h2::after{content:"";position:absolute;left:1px;bottom:0;width:53px;height:4px;background:linear-gradient(90deg,#ffae78,#ff815b);transform:skewX(-25deg);box-shadow:5px 2px 0 #ff9d6030;border-radius:1px}
.create-grid .section-head .pill{margin-top:7px;flex-shrink:0}
.room-title h1{text-shadow:2px 2px 0 #082844,3px 3px 0 #349fc0}
.settings h3,dialog h2{font-family:var(--font-display);font-weight:900;letter-spacing:.6px}
@media(max-width:900px){.hero{padding-top:40px;padding-bottom:30px}}
@media(max-width:650px){
  body::before{background-image:linear-gradient(90deg,#061e4ec9 0%,#061e4e80 45%,#061e4e00 85%),linear-gradient(180deg,#08265010 0%,#08265026 45%,#082650e8 90%),url('/arena-background.png');background-size:auto 790px;background-position:right top}
  .topbar{border-radius:0;background:#062346a6}.topbar:after{color:#b9e2f6}
  .hero{padding-top:30px;padding-bottom:17px}.hero h1{font-size:36px}.hero p{color:#d6ebf7}
  .hero-art{padding-top:22px;padding-bottom:7px}.hero-logo{filter:drop-shadow(0 3px 0 #ffffff35) drop-shadow(0 12px 16px #04173388)}
  .scribble{color:#d2ecfc}.card{border-radius:18px}.steps{margin-bottom:24px}
  .room-head{padding-top:26px}.room-title h1{max-width:100%}.room-meta{color:#c7e1f3}
  .footer{color:#b7d4e8}.room-layout:not(.lobby-layout) .side-column{margin-top:3px}
  .create-grid .section-head h2{font-size:23px;letter-spacing:.5px;transform:skewX(-4deg)}
  .hero h1{letter-spacing:.5px;transform:skewX(-4deg)}
  .field input,.field select{font-size:16px}
  .room-title h1{font-size:25px;letter-spacing:.5px}
  .mvp-players{gap:15px}.mvp-avatar-frame{width:144px;height:144px}.bird-avatar-award{width:134px;height:134px}
  .mvp-duo .mvp-avatar-frame{width:120px;height:120px}.mvp-duo .bird-avatar-award{width:112px;height:112px}
  .reveal-content .mvp-player h2{font-size:24px}.reveal-content .mvp-duo h2{font-size:21px}
  .mvp-compact .mvp-player{flex-basis:calc(50% - 10px);max-width:100%}.mvp-compact .mvp-avatar-frame{width:92px;height:92px}.mvp-compact .bird-avatar-award{width:86px;height:86px}
  .mvp-compact .mvp-player-name{font-size:19px}.mvp-compact .mvp-player-stat{font-size:10px}
  .mvp-solo.mvp-compact{justify-content:flex-start}.mvp-solo.mvp-compact .mvp-player{flex-basis:180px}
  .report-table .bird-avatar{width:22px;height:22px}.team .bird-avatar{width:23px;height:23px}
  .match-body{grid-template-columns:minmax(0,1fr) 67px minmax(0,1fr)}
}