*{box-sizing:border-box}
:root{--bg:#02091b;--panel:#041735;--panel2:#071f4c;--line:#1179ed;--cyan:#20e5ff;--blue:#159cff;--green:#17e2a7;--yellow:#ffd338;--red:#ff694e;--muted:#9bb0d1;--text:#f5f8ff}
html,body{margin:0;min-height:100%;font-family:Inter,Segoe UI,Arial,sans-serif;background:#020817;color:var(--text)}
body{
  overflow-x:hidden;
  background:
    radial-gradient(ellipse at 56% -8%,rgba(0,105,255,.24),transparent 35%),
    radial-gradient(ellipse at 100% 18%,rgba(26,79,255,.16),transparent 31%),
    radial-gradient(ellipse at 82% 92%,rgba(112,0,255,.18),transparent 34%),
    radial-gradient(ellipse at 16% 84%,rgba(0,171,255,.08),transparent 28%),
    linear-gradient(180deg,#020a20 0%,#020817 52%,#010513 100%);
}
body:before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(rgba(31,113,215,.14) 1px,transparent 1px),
    linear-gradient(90deg,rgba(31,113,215,.14) 1px,transparent 1px);
  background-size:42px 42px;
  opacity:.72;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.9),rgba(0,0,0,.35) 70%,transparent);
}
body:after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:1;
  background:
    linear-gradient(135deg,transparent 0 7%,rgba(20,117,255,.42) 7.05%,transparent 7.12%) top left/420px 210px no-repeat,
    linear-gradient(315deg,transparent 0 7%,rgba(17,201,255,.34) 7.05%,transparent 7.12%) top right/420px 210px no-repeat,
    linear-gradient(45deg,transparent 0 7%,rgba(15,104,255,.35) 7.05%,transparent 7.12%) bottom left/420px 210px no-repeat,
    linear-gradient(225deg,transparent 0 7%,rgba(113,42,255,.35) 7.05%,transparent 7.12%) bottom right/420px 210px no-repeat;
}
button,input,select{font:inherit}button{cursor:pointer}
.app{display:flex;min-height:100vh;position:relative;z-index:2}.sidebar{width:264px;flex:0 0 264px;min-height:100vh;padding:24px 18px;position:relative;z-index:5;background:linear-gradient(180deg,#020f2a,#02091a);border-right:1px solid rgba(21,111,226,.4)}
.brand{text-align:center;height:162px}.brand-cards{height:78px;width:110px;margin:auto;position:relative}.brand-card{position:absolute;width:53px;height:70px;border:2px solid;border-radius:9px;display:grid;place-items:center;font-size:29px;font-weight:900;box-shadow:0 0 18px currentColor}.brand-card.t{left:5px;color:#24aaff;background:#073b87;transform:rotate(-16deg)}.brand-card.r{right:5px;top:9px;color:#21e6a5;background:#07513e;transform:rotate(13deg)}.brand-name{font-size:24px;font-weight:950;letter-spacing:-1px}.brand-name span{color:#28ddff}.online-label{font-size:11px;letter-spacing:5px;color:#9bb5dc}
.side-rule{height:1px;margin:3px 8px 20px;background:linear-gradient(90deg,transparent,#169fff,transparent)}.main-nav{display:grid;gap:8px}.nav-link{min-height:50px;border:1px solid transparent;border-radius:11px;background:transparent;color:#b7c7df;text-align:left;padding:0 15px;display:flex;align-items:center;gap:15px}.nav-link span{width:22px;text-align:center;font-size:23px}.nav-link.active{color:white;background:linear-gradient(100deg,#0878ed,#0a63d2);border-color:#18baff;box-shadow:0 0 19px rgba(0,157,255,.5),inset 0 0 15px rgba(255,255,255,.08)}.nav-link:hover{color:white;background:rgba(15,130,245,.1)}.profile{display:flex;align-items:center;gap:13px;padding:0 8px}.avatar{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;color:#e2d5ff;background:radial-gradient(circle at 35% 25%,#a26aff,#4216a4);border:2px solid #a06eff;box-shadow:0 0 20px rgba(126,66,255,.55);font-weight:900;font-size:22px}.avatar.small{width:36px;height:36px;font-size:15px}.avatar.large{margin-top:8px}.profile strong{display:block}.profile small{display:block;color:#8fa8cb;font-size:12px;margin-top:4px}.profile i,.online i{display:inline-block;width:9px;height:9px;border-radius:50%;background:#18e98e;box-shadow:0 0 8px #18e98e;margin-right:7px}.side-links{border-top:1px solid rgba(31,113,208,.3);margin-top:17px;padding-top:14px;display:grid;gap:5px}.slogan{position:absolute;left:32px;bottom:35px;display:grid;gap:2px;font-size:25px;line-height:1.1}.slogan b:nth-child(1){color:#159eff}.slogan b:nth-child(2){color:#2bddec}.slogan b:nth-child(3){color:#1fe2a6}
.main{flex:1;min-width:0;position:relative;padding:34px 42px 70px;overflow:hidden}.decor{position:absolute;width:70px;height:94px;border:2px solid #1db9ff;border-radius:12px;display:grid;place-items:center;font-size:36px;font-weight:900;color:#1db9ff;opacity:.09}.decor-one{right:30%;top:16px;transform:rotate(-22deg)}.decor-two{right:5%;bottom:35px;transform:rotate(19deg);color:#6677ff;border-color:#6677ff}
.topbar{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:flex-start;gap:30px;margin-bottom:28px}.eyebrow,.section-kicker{font-size:12px;font-weight:900;letter-spacing:2px;color:var(--cyan)}.brand-head h1{margin:1px 0 0;font-size:clamp(50px,4.7vw,78px);line-height:1;letter-spacing:-4px;background:linear-gradient(90deg,#f5f8ff,#d6e9ff 35%,#fff16d 65%,#25efa9 83%,#22dfff);-webkit-background-clip:text;color:transparent}.brand-head p{margin:11px 0 0;color:#b4c9e7}.top-actions,.game-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.top-btn{height:43px;padding:0 15px;border-radius:13px;border:1px solid #1762b9;background:#041531;color:#e9f1ff;box-shadow:inset 0 0 14px rgba(35,108,194,.08)}.top-btn:hover{border-color:#1fd0ff;box-shadow:0 0 14px rgba(25,183,255,.2)}.top-btn.online{border-color:#14d7a4}.top-btn.danger{border-color:#ff506e;color:#ffdfe6}
.screen{display:none;position:relative;z-index:2}.screen.active{display:block}.panel{background:linear-gradient(135deg,rgba(5,26,64,.94),rgba(2,13,37,.95));border:1px solid rgba(19,121,240,.9);border-radius:16px;box-shadow:0 20px 55px rgba(0,0,0,.28),inset 0 0 35px rgba(13,111,220,.06)}
.dashboard-grid{display:grid;grid-template-columns:minmax(650px,1fr) 430px;gap:22px}.lobby-panel{padding:24px 26px 25px;box-shadow:0 0 28px rgba(0,117,255,.12),inset 0 0 45px rgba(10,93,200,.06)}.lobby-panel h2{margin:4px 0 5px;font-size:32px}.lead,.subtitle{color:#a9bddc}.lead{font-size:14px;margin:0 0 17px}.mode-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.mode-card{min-height:382px;padding:16px 18px;display:flex;flex-direction:column;border:1px solid #087eff;border-radius:13px;background:linear-gradient(145deg,rgba(7,30,73,.92),rgba(3,17,45,.95))}.green-border{border-color:#0ddca7}.mode-icon{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-size:24px;font-weight:900;margin-bottom:11px}.mode-icon.blue{color:#1eb8ff;background:rgba(19,138,255,.16)}.mode-icon.green{color:#1ce6bb;background:rgba(15,224,165,.12)}.mode-card h3{margin:0 0 9px;font-size:18px}.mode-card p{min-height:53px;margin:0 0 16px;color:#aec1df;font-size:13px;line-height:1.45}.mode-card label{font-size:12px;color:#a8b9d5;margin-bottom:6px}.mode-card input,.settings-card input,.settings-card select{height:44px;width:100%;padding:0 12px;color:#d8e7fb;background:#031331;border:1px solid #0f60c5;border-radius:9px;outline:none}.mode-card small{color:#91a9cc;font-size:12px;margin-bottom:12px}.choices{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:3px 0 12px}.choices button{height:41px;border-radius:9px;border:1px solid #164b8e;color:#e2ebfb;background:#051a3c;font-weight:800}.choices .selected,.choices .selected.green-choice{border-color:#12e1ad;background:rgba(8,199,143,.23);box-shadow:0 0 13px rgba(0,234,169,.28)}.action{width:100%;height:48px;margin-top:auto;border:1px solid;border-radius:13px;color:#fff;font-weight:800}.action.blue{border-color:#16aaff;background:linear-gradient(100deg,#0788ff,#1558e8);box-shadow:0 0 17px rgba(0,150,255,.28)}.action.green{border-color:#0ee0a8;background:linear-gradient(100deg,#08b981,#13d19b);box-shadow:0 0 17px rgba(0,224,164,.25)}.action.large{max-width:360px;height:54px}.current-panel{padding:25px 24px;box-shadow:0 0 26px rgba(0,105,255,.10),inset 0 0 38px rgba(20,88,190,.06)}.current-panel h3{margin:0 0 15px}.muted{color:#96abcb;font-size:13px;line-height:1.5}.mini-steps{display:grid;gap:12px;margin:23px 0}.mini-steps div{display:flex;align-items:center;gap:11px;font-size:13px}.mini-steps b{width:38px;height:38px;border-radius:50%;display:grid;place-items:center}.c1{background:#096ee6}.c2{background:#0dbf8b}.c3{background:#d9a91c}.c4{background:#dc5b3c}.status-box{border:1px solid #1555a2;border-radius:11px;padding:12px;background:rgba(2,14,38,.7);display:grid;gap:10px;font-size:12px}.status-box div{display:flex;justify-content:space-between;align-items:center;color:#9eb2d2}.status-box b{color:#dce7f8}.pill{padding:5px 11px;border-radius:99px;background:rgba(0,120,255,.25);border:1px solid rgba(0,142,255,.45)}.green-pill{color:#a6ffe2!important;border-color:#0de1a8;background:rgba(0,200,150,.15)}.goals-panel{margin-top:24px;padding:15px 28px;min-height:150px}.panel-title{display:flex;align-items:center;gap:10px}.panel-title span{font-size:24px}.panel-title h3{margin:0;font-size:17px}.panel-title b{margin-left:auto;color:#7ca3d0}.goal-preview{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:14px}.mini-goal{height:78px;border-radius:10px;border:1px solid}.mini-goal.blue{border-color:#159cff;background:linear-gradient(145deg,rgba(13,105,215,.3),transparent)}.mini-goal.green{border-color:#16dfaa;background:linear-gradient(145deg,rgba(8,175,130,.25),transparent)}.mini-goal.yellow{border-color:#e5b829;background:linear-gradient(145deg,rgba(190,145,15,.25),transparent)}.mini-goal.red{border-color:#ef5d49;background:linear-gradient(145deg,rgba(170,45,35,.25),transparent)}
.start-panel{min-height:440px;padding:48px;display:flex;justify-content:space-between;overflow:hidden}.start-copy{max-width:560px}.start-copy h2,.simple-screen h2{font-size:42px;margin:5px 0 10px}.start-copy p{color:#aec2e1;line-height:1.7}.start-copy label{display:block;font-size:12px;color:#a7b9d6;margin:25px 0 7px}.start-copy input{height:50px;width:100%;background:#031331;border:1px solid #1167cf;color:white;border-radius:10px;padding:0 15px;margin-bottom:13px}.safe{margin-top:18px;color:#b8cce8;font-size:13px;line-height:1.7}.safe span{color:#8da7ca}.floating-cards{width:410px;position:relative;min-height:300px}.playing-card{position:absolute;width:120px;height:172px;border-radius:15px;border:2px solid;display:grid;place-items:center;font-size:42px;font-weight:900;box-shadow:0 0 35px currentColor}.playing-card.red{color:#ff5e4e;background:#651d27;transform:rotate(-19deg);left:25px;top:70px}.playing-card.blue{color:#24b5ff;background:#073d8a;transform:rotate(-4deg);left:105px;top:35px}.playing-card.green{color:#1ce2a7;background:#07543e;transform:rotate(10deg);left:190px;top:65px}.playing-card.yellow{color:#ffe03d;background:#76570a;transform:rotate(21deg);left:250px;top:25px}
.page-head{padding:25px 30px;display:flex;justify-content:space-between;align-items:center}.page-head h2{font-size:35px;margin:5px 0}.page-head p{color:#a7bddb}.ai-grid{display:grid;grid-template-columns:1fr 1.2fr .9fr;gap:20px;margin-top:24px}.info-card{padding:27px;min-height:360px}.info-card h3{margin:10px 0}.info-card h4{font-size:23px;margin:12px 0}.code-badge{width:65px;height:65px;border-radius:16px;display:grid;place-items:center;color:#b5a4ff;background:rgba(125,73,255,.2);border:1px solid #996cff;font-size:25px;font-weight:900}.rule-list{display:grid;gap:11px;margin:22px 0}.rule-list span{padding:12px;border:1px solid #164f97;border-radius:9px;background:#041a3b}
.game-top{display:grid;grid-template-columns:auto 1fr auto;gap:20px;align-items:center;margin-bottom:14px}.round-title{text-align:center}.round-title strong{display:block;font-size:22px}.round-title span{color:#27ddff;font-size:12px;font-weight:800}.game-layout{display:grid;grid-template-columns:minmax(650px,1fr) 350px;gap:20px}.table{height:475px;position:relative;display:grid;place-items:center;overflow:hidden;background:radial-gradient(ellipse at center,rgba(11,48,106,.7),rgba(2,13,35,.97))}.table:before,.table:after{content:"";position:absolute;border-radius:50%;pointer-events:none}.table:before{width:78%;height:67%;border:2px solid #19dfff;box-shadow:0 0 25px #1bcbff,0 0 65px rgba(27,76,255,.6),inset 0 0 25px rgba(0,201,255,.25)}.table:after{width:70%;height:56%;border:2px solid #a32dff;box-shadow:0 0 30px rgba(157,39,255,.7)}.ai-player{position:absolute;top:17px;display:flex;align-items:center;gap:9px;z-index:2}.ai-player small,.player-tag small{display:block;color:#91a8c9;font-size:11px}.table-rings{display:flex;align-items:center;gap:22px;z-index:2;margin-top:25px}.deck-area{text-align:center}.deck-area strong,.deck-area small{display:block;font-size:10px;margin-top:8px}.deck-area small{color:#8fa6c8}.card-back,.face-card{width:52px;height:72px;border:2px solid #dceaff;border-radius:7px;display:grid;place-items:center;font-size:25px;font-weight:900;margin:auto}.card-back{background:repeating-linear-gradient(135deg,#09265b 0,#09265b 7px,#0d3b85 8px,#09265b 14px)}.face-card{background:#1b75dc;box-shadow:0 0 16px rgba(0,156,255,.6)}.arrow{font-size:40px;color:#19ddff}.player-tag{position:absolute;bottom:18px;z-index:3;display:flex;align-items:center;gap:9px;padding:7px 20px;border-radius:12px;border:1px solid #1268be;background:#041b3c;box-shadow:0 0 15px rgba(0,150,255,.25)}.player-tag>span{margin-left:25px;color:#8ea9cd;font-size:11px}.green-avatar{background:radial-gradient(circle at 35% 25%,#26e09c,#05804f);border-color:#16dfa2;box-shadow:0 0 16px rgba(22,223,162,.4)}.hand{margin-top:15px;padding:15px 18px}.hand-head{display:flex;justify-content:space-between;align-items:center}.cards-hand{display:flex;gap:6px;margin:12px 0}.hand-card{height:57px;flex:1;min-width:42px;border-radius:7px;border:2px solid;display:grid;place-items:center;font-weight:900;font-size:16px;box-shadow:0 5px 12px rgba(0,0,0,.3)}.hand-card.yellow{background:#e2a916;color:white;border-color:#ffe16b}.hand-card.green{background:#0baf79;color:white;border-color:#3bffc4}.hand-card.red{background:#db3846;color:white;border-color:#ff7a7e}.hand-card.blue{background:#167edb;color:white;border-color:#65caff}.hand-card.black{background:#101827;color:white;border-color:#8393aa}.tip{padding:8px 10px;color:#a7bcdc;background:rgba(4,30,67,.7);border-radius:8px;font-size:11px}.hand-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:9px}.hand-actions button{border:1px solid #14559c;background:#061b3c;color:#b9cce7;border-radius:8px;padding:8px 12px;font-size:11px}.hand-actions .primary-small{border-color:#11aaff;background:#0878e8;color:#fff}.game-side{display:grid;gap:15px}.game-info,.last-action{padding:20px}.game-info h3{margin:5px 0}.game-info>strong{font-size:13px}.progress{height:12px;margin:15px 0 7px;border:1px solid #155cae;border-radius:99px;padding:2px;background:#041633}.progress span{display:block;width:80%;height:100%;border-radius:99px;background:linear-gradient(90deg,#15e9ff,#1679ff,#a82dff)}.game-info small{display:block;color:#91a8c9;margin-top:6px}.last-action{min-height:170px}.last-action p{color:#b3c7e4;line-height:1.6}
.simple-screen>h2{margin:3px 0}.subtitle{margin-top:0}.rule-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:24px}.rule-card{padding:23px;min-height:175px}.rule-card>b{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#087ce9;box-shadow:0 0 16px rgba(0,150,255,.4)}.rule-card h3{margin:13px 0 5px}.rule-card p{color:#99aecf;font-size:13px;line-height:1.5}.examples{margin-top:18px;padding:23px}.examples h3{margin-top:0}.examples div{display:flex;gap:12px;flex-wrap:wrap}.examples span{padding:12px 17px;border-radius:9px;border:1px solid #1761b5;background:#061c40;color:#bdd0ed}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:24px}.stat-card{padding:24px}.stat-card small{color:#8fa7c9;font-size:11px}.stat-card strong{display:block;font-size:35px;margin-top:8px;background:linear-gradient(90deg,#fff,#27dfff);-webkit-background-clip:text;color:transparent}.chart-panel{margin-top:18px;padding:24px}.chart{height:180px;display:flex;align-items:end;gap:16px;padding:15px 10px;border-bottom:1px solid #18569c;background:repeating-linear-gradient(to top,transparent 0,transparent 44px,rgba(24,94,165,.16) 45px)}.chart i{flex:1;max-width:75px;background:linear-gradient(to top,#0878e9,#21dfff);border-radius:7px 7px 0 0;box-shadow:0 0 15px rgba(16,190,255,.2)}.history{margin-top:18px;padding:20px}.history-row{display:grid;grid-template-columns:.7fr 2fr 1fr 1fr;padding:13px 4px;border-bottom:1px solid rgba(26,91,157,.3);font-size:13px}.history-row.head{color:#7894ba;font-size:11px}.history-row b{color:#1be0a8}.history-row .loss{color:#ff6b58}
.leaderboard{margin-top:25px;overflow:hidden}.rank{display:grid;grid-template-columns:.5fr 2fr 1fr 1fr 1fr;padding:18px 24px;border-bottom:1px solid rgba(26,91,157,.35);align-items:center}.rank.head{color:#7894ba;font-size:11px}.rank b{color:#31ddff}.rank.own{background:linear-gradient(90deg,rgba(12,129,238,.25),rgba(0,200,170,.08));border-left:3px solid #18dfff}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:24px}.settings-card{padding:23px}.settings-card h3{margin-top:0}.settings-card label:not(.toggle){display:block;color:#91a9cb;font-size:12px;margin:15px 0 6px}.toggle{display:flex;justify-content:space-between;align-items:center;padding:13px 0;color:#c9d8ed;border-bottom:1px solid rgba(30,90,154,.25)}.toggle i{width:38px;height:20px;border-radius:99px;background:#17385f;position:relative}.toggle i:after{content:"";position:absolute;width:16px;height:16px;top:2px;left:20px;border-radius:50%;background:#1ce2a7;box-shadow:0 0 9px #1ce2a7}.setting-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}.setting-actions .save{width:140px;margin:0}.end-screen{display:grid;place-items:center;min-height:650px}.result{width:min(720px,100%);padding:55px;text-align:center;position:relative;overflow:hidden}.result-glow{font-size:70px;color:#20e4ff;text-shadow:0 0 35px #20e4ff}.result h2{font-size:38px;margin:5px 0 20px}.points{font-size:60px;font-weight:950;background:linear-gradient(90deg,#fff,#ffe35c,#20e5ff);-webkit-background-clip:text;color:transparent}.points span{font-size:18px}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:30px 0}.result-stats div{padding:16px;border:1px solid #1557a4;border-radius:10px;background:#041b3c}.result-stats b{display:block;color:#8da5c7;font-size:11px}.result-stats strong{display:block;margin-top:6px}.result-actions{display:flex;justify-content:center;gap:10px}.result-actions .action{width:210px;margin:0}
.menu-overlay{position:fixed;inset:0;background:rgba(0,4,14,.65);backdrop-filter:blur(8px);z-index:20;display:none;align-items:flex-start;justify-content:flex-end;padding:100px 40px}.menu-overlay.open{display:flex}.menu-modal{width:310px;padding:25px;border:1px solid #168df5;border-radius:16px;background:linear-gradient(145deg,#061d47,#020d26);box-shadow:0 0 45px rgba(0,120,255,.3);position:relative}.close-menu{position:absolute;right:14px;top:10px;background:none;border:0;color:#9bb4d7;font-size:27px}.menu-modal h2{margin:4px 0 18px}.menu-modal>button:not(.close-menu){display:block;width:100%;padding:12px;text-align:left;margin:5px 0;border-radius:9px;border:1px solid transparent;background:#061a3b;color:#c7d8ee}.menu-modal>button:not(.close-menu):hover{border-color:#138cff;color:white}.menu-modal hr{border:0;border-top:1px solid #16487d;margin:14px 0}.menu-modal .leave{color:#ff8795}
@media(max-width:1250px){.sidebar{width:220px;flex-basis:220px}.main{padding-left:24px;padding-right:24px}.dashboard-grid,.game-layout{grid-template-columns:1fr}.current-panel,.game-side{grid-column:1}.ai-grid{grid-template-columns:1fr 1fr}.ai-grid aside{grid-column:1/-1}.floating-cards{opacity:.7}}
@media(max-width:850px){.app{display:block}.sidebar{width:100%;min-height:auto;padding:15px 20px}.brand{height:auto}.brand-cards,.online-label,.side-rule,.profile,.side-links,.slogan{display:none}.main-nav{display:flex;overflow:auto;margin-top:10px}.nav-link{white-space:nowrap;min-height:42px}.main{padding:24px 16px 50px}.topbar{flex-direction:column}.top-actions{justify-content:flex-start}.mode-grid,.rule-grid,.stat-grid,.settings-grid,.ai-grid{grid-template-columns:1fr}.ai-grid aside{grid-column:auto}.start-panel{flex-direction:column;padding:30px}.floating-cards{width:100%;height:260px}.goal-preview{grid-template-columns:repeat(2,1fr)}.game-top{grid-template-columns:1fr}.game-actions{justify-content:flex-start}.cards-hand{overflow-x:auto}.hand-card{min-width:42px}.history-row{grid-template-columns:1fr 1.5fr 1fr}.history-row span:nth-child(4){display:none}}

/* --- Neon space background / floating card atmosphere --- */
.space-card{
  position:fixed;
  z-index:1;
  width:72px;height:104px;
  border-radius:10px;
  border:1px solid rgba(35,159,255,.25);
  color:rgba(47,181,255,.28);
  background:linear-gradient(145deg,rgba(9,48,103,.20),rgba(4,17,49,.08));
  box-shadow:0 0 25px rgba(0,123,255,.08),inset 0 0 20px rgba(0,150,255,.06);
  display:grid;place-items:center;
  font-size:30px;font-weight:900;
  pointer-events:none;
  backdrop-filter:blur(1px);
}
.sc1{left:48%;top:4%;transform:rotate(-18deg)}
.sc2{left:62%;top:12%;transform:rotate(-9deg);color:rgba(0,215,255,.18);border-color:rgba(0,215,255,.18)}
.sc3{right:12%;top:12%;transform:rotate(18deg);color:rgba(44,132,255,.20)}
.sc4{right:5%;bottom:12%;transform:rotate(20deg);color:rgba(156,72,255,.18);border-color:rgba(156,72,255,.18)}
.sc5{left:7%;bottom:7%;transform:rotate(-17deg);color:rgba(25,163,255,.14);border-color:rgba(25,163,255,.14)}
.space-glow{position:fixed;z-index:1;pointer-events:none;border-radius:50%;filter:blur(22px);opacity:.45}
.sg1{width:300px;height:120px;left:30%;top:10%;background:rgba(0,144,255,.13)}
.sg2{width:340px;height:150px;right:0;bottom:4%;background:rgba(102,0,255,.11)}

/* Spielraum: Tisch bekommt die volle Breite, Infos folgen darunter. */
#screen-game .game-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:22px;
}

#screen-game .table{
  height:clamp(470px,58vh,620px);
}

#screen-game .game-side{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}

#screen-game .game-info,
#screen-game .last-action{
  min-height:0;
  height:100%;
}

#screen-game .last-action{
  min-height:170px;
}

#screen-game.active{
  padding-bottom:28px;
}

.main:has(#screen-game.active){
  overflow:visible;
}

@media(max-width:980px){
  #screen-game .game-side{
    grid-template-columns:1fr;
  }

  #screen-game .game-top{
    grid-template-columns:1fr;
  }

  #screen-game .game-actions{
    justify-content:flex-start;
  }
}

.main{
  isolation:isolate;
}
.main:before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;height:280px;
  pointer-events:none;
  background:radial-gradient(ellipse at 50% 0%,rgba(0,132,255,.12),transparent 66%);
  z-index:-1;
}
.sidebar:before{
  content:"";
  position:absolute;inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 0%,rgba(0,116,255,.14),transparent 28%),
    linear-gradient(180deg,rgba(0,83,177,.05),transparent 42%,rgba(0,0,0,.18));
}
.sidebar>*{position:relative;z-index:2}

.panel{position:relative;overflow:hidden}
.panel:after{
  content:"";position:absolute;left:8%;right:8%;top:-1px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(30,207,255,.75),transparent);
  opacity:.75;pointer-events:none;
}
.mode-card{box-shadow:inset 0 0 22px rgba(15,91,186,.05)}
.mode-card.green-border{box-shadow:inset 0 0 28px rgba(0,224,164,.06),0 0 20px rgba(0,218,165,.08)}
