:root{--bg:#0a0e18;--panel:#111829;--panel2:#17213a;--line:#2a385b;--ink:#edf2ff;--muted:#8b9abd;--cyan:#6ee7f2;--violet:#a78bfa;--gold:#f5c56c;--red:#ff7185;--green:#7fe3a1;--shadow:0 18px 45px rgba(0,0,0,.28)}
*{box-sizing:border-box} body{margin:0;background:radial-gradient(circle at 75% 0%,#1d254a 0,#0a0e18 45%),#0a0e18;color:var(--ink);font-family:'Space Grotesk',system-ui,sans-serif;min-width:1060px}button{font:inherit;color:inherit;cursor:pointer;border:0} .app-shell{min-height:100vh;background:linear-gradient(180deg,rgba(11,16,31,.1),rgba(11,16,31,.75));padding-bottom:24px}.topbar{height:78px;border-bottom:1px solid rgba(125,150,210,.2);display:flex;align-items:center;padding:0 30px;justify-content:space-between;background:rgba(8,12,24,.82);backdrop-filter:blur(16px);position:sticky;top:0;z-index:4}.brand{display:flex;gap:11px;align-items:center;letter-spacing:.08em}.brand-mark{width:35px;height:35px;border:1px solid var(--cyan);color:var(--cyan);display:grid;place-items:center;transform:rotate(45deg);font-size:18px;box-shadow:0 0 24px rgba(110,231,242,.25)}.brand-mark::first-letter{transform:rotate(-45deg)}.brand strong{display:block;font-size:13px}.brand small{color:var(--muted);font:10px 'DM Mono',monospace;letter-spacing:.12em}.hud-stats{display:flex;gap:14px}.stat{display:flex;align-items:center;gap:8px;min-width:88px;padding:5px 10px;border-left:1px solid var(--line)}.stat-icon{font-size:18px}.stat-icon.heart{color:var(--red)}.stat-icon.wave{color:var(--violet)}.stat-icon.gold{color:var(--gold)}.stat-icon.action{color:var(--cyan)}.stat small{display:block;color:var(--muted);font:9px 'DM Mono';letter-spacing:.08em}.stat b{font:600 16px 'DM Mono'}.top-actions{display:flex;gap:8px}.ghost-btn,.secondary-btn,.primary-btn{border-radius:6px;padding:9px 13px;transition:.2s}.ghost-btn{background:transparent;border:1px solid var(--line);color:var(--muted)}.ghost-btn:hover{border-color:var(--cyan);color:var(--ink)}.ghost-btn.tiny{padding:3px 7px;font-size:11px}.secondary-btn{background:#202c4a;border:1px solid #3a4a72}.primary-btn{background:linear-gradient(135deg,#4bc9d9,#8b74f7);color:#0b1020;font-weight:700;box-shadow:0 8px 25px rgba(91,173,230,.2)}.primary-btn:hover{filter:brightness(1.12);transform:translateY(-1px)}.primary-btn.small{padding:8px 11px;font-size:12px}.game-layout{width:min(1500px,calc(100% - 56px));margin:22px auto;display:grid;grid-template-columns:minmax(700px,1fr) 360px;gap:18px}.panel{background:linear-gradient(135deg,rgba(22,31,55,.95),rgba(13,20,37,.96));border:1px solid var(--line);box-shadow:var(--shadow);border-radius:11px}.battle-panel{grid-column:1;padding:18px}.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:12px}.panel-heading.compact{margin-bottom:10px}.panel-heading h2,.panel-heading h3{margin:2px 0 0}.panel-heading h2{font-size:23px}.panel-heading h3{font-size:15px}.eyebrow{margin:0;color:var(--cyan);font:10px 'DM Mono';letter-spacing:.16em}.wave-controls{display:flex;gap:10px;align-items:center;font:11px 'DM Mono';color:var(--muted)}.canvas-wrap{position:relative;border:1px solid #31416a;border-radius:8px;background:#0b1223;overflow:hidden}.canvas-wrap canvas{display:block;width:100%;height:auto}.battle-message{position:absolute;left:18px;bottom:14px;background:rgba(5,10,21,.78);border:1px solid rgba(121,146,207,.35);padding:8px 10px;border-radius:5px;color:#c6d1eb;font-size:12px}.legend{height:30px;display:flex;gap:14px;align-items:end;color:var(--muted);font-size:11px}.legend span:last-of-type{margin-left:auto}.dot{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:5px}.player-dot{background:var(--cyan);box-shadow:0 0 7px var(--cyan)}.enemy-dot{background:var(--red)}.tower-dot{background:var(--gold)}.side-panel{grid-column:2;grid-row:1 / span 2;display:flex;flex-direction:column;gap:18px}.side-panel .panel{padding:15px}.deck-counters{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:10px}.deck-counters div{background:#0d1528;border:1px solid #223252;padding:7px 5px;text-align:center;border-radius:5px}.deck-counters b{display:block;font:16px 'DM Mono';color:var(--cyan)}.deck-counters span{font-size:9px;color:var(--muted)}.log{height:135px;overflow:auto;font:10px 'DM Mono';color:#a8b7d7;line-height:1.5}.log div{padding:3px 0;border-bottom:1px solid rgba(86,105,153,.16)}.shop-panel{flex:1}.shop-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.card{position:relative;background:#182442;border:1px solid #3d4f79;border-radius:7px;padding:10px;min-height:117px;cursor:pointer;transition:.18s;overflow:hidden}.card:hover{transform:translateY(-3px);border-color:var(--cyan);box-shadow:0 8px 20px rgba(0,0,0,.24)}.card.disabled{opacity:.52;cursor:not-allowed;filter:saturate(.5)}.card .card-glyph{position:absolute;right:7px;top:5px;font-size:18px;opacity:.55}.card .card-name{font-size:12px;font-weight:700;margin-bottom:4px;max-width:115px}.card .card-cost{font:12px 'DM Mono';color:var(--gold);position:absolute;right:8px;bottom:8px}.card .card-type{font:9px 'DM Mono';letter-spacing:.12em;text-transform:uppercase;color:var(--cyan);margin-bottom:7px}.card .card-text{font-size:10px;line-height:1.35;color:#bac6e0}.card.money{border-top:3px solid var(--gold)}.card.tower{border-top:3px solid var(--red)}.card.support{border-top:3px solid var(--green)}.card.action{border-top:3px solid var(--violet)}.card.one-shot{border-top:3px solid #e18fff}.hand-panel{grid-column:1;padding:18px}.hand{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;min-height:128px}.hand .card{min-height:127px;background:linear-gradient(145deg,#1a2848,#111b33)}.turn-actions{display:flex;align-items:center;gap:12px;border-top:1px solid var(--line);margin-top:15px;padding-top:13px}.turn-actions span{color:var(--muted);font-size:11px}.icon-btn{width:25px;height:25px;border-radius:50%;background:#223050;border:1px solid #40527c;color:var(--cyan)}.modal{position:fixed;inset:0;background:rgba(3,6,15,.78);display:grid;place-items:center;z-index:10}.modal.hidden{display:none}.modal-card{width:min(560px,90vw);background:#131e37;border:1px solid #4d5d88;border-radius:10px;padding:24px;position:relative;box-shadow:var(--shadow)}.modal-close{position:absolute;right:14px;top:10px;background:none;color:var(--muted);font-size:22px}.modal-card h2{margin-top:0}.modal-card p,.modal-card li{color:#bcc8e1;line-height:1.5;font-size:13px}.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%,20px);opacity:0;background:#e7efff;color:#11192e;padding:9px 15px;border-radius:20px;font-size:12px;z-index:12;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}.screen-overlay{position:fixed;inset:0;z-index:20;background:radial-gradient(circle at 50% 20%,rgba(50,55,125,.35),rgba(4,8,17,.96) 60%);display:none;place-items:center}.screen-overlay.visible{display:grid}.title-card{width:min(620px,90vw);text-align:center;padding:44px;border:1px solid #40528b;background:rgba(14,22,43,.92);box-shadow:0 35px 100px rgba(0,0,0,.55);border-radius:14px}.sigil{font-size:42px;color:var(--cyan);text-shadow:0 0 30px var(--cyan);margin-bottom:6px}.title-card h1{font-size:48px;letter-spacing:-.04em;margin:7px 0 12px}.intro{color:#b6c4e4;line-height:1.55}.howto{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:22px 0 30px;text-align:left}.howto span{font-size:11px;color:#adbad8;padding:9px;border:1px solid #2c3a60;border-radius:6px;background:#101a30}.howto b{color:var(--cyan);font:15px 'DM Mono';display:block;margin-bottom:5px}
.card.selected{border-color:var(--cyan);box-shadow:0 0 0 2px rgba(110,231,242,.35),0 8px 22px rgba(0,0,0,.3);transform:translateY(-3px)}.joker-btn{background:linear-gradient(135deg,#3a2a65,#204866);border:1px solid #7c68c5;border-radius:6px;padding:8px 10px;color:#efeaff;font-size:11px;font-weight:600;white-space:nowrap}.joker-btn:hover:not(:disabled){border-color:var(--cyan);box-shadow:0 0 15px rgba(110,231,242,.22)}.joker-btn:disabled{opacity:.48;cursor:not-allowed}.modal-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:18px}
.card,.hand .card{display:grid;grid-template-columns:minmax(0,1fr) 46px;grid-template-rows:auto auto 1fr;column-gap:4px;align-content:start;min-height:130px;padding:9px 10px 23px;border:1px solid #344661;border-top-width:2px;border-radius:9px;background:#111b2d;box-shadow:none}
.card:hover{transform:translateY(-2px);box-shadow:0 5px 13px rgba(0,0,0,.18)}
.card .card-art{grid-column:2;grid-row:1 / 3;width:46px;height:46px;display:block;pointer-events:none}
.card .card-type{grid-column:1;grid-row:1;margin-bottom:4px}
.card .card-name{grid-column:1;grid-row:2;max-width:none;margin:0;line-height:1.18}
.card .card-text{grid-column:1 / -1;grid-row:3;margin-top:5px;color:#b5c4dc}
.card.tower{border-top-color:#e587a0}.card.support{border-top-color:#8cdaad}.card.money{border-top-color:#e4c178}.card.action{border-top-color:#aa9ce7}.card.one-shot{border-top-color:#e6a0d7}
.card.disabled{opacity:.58;filter:saturate(.65)}
.level-select{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px;margin:0 0 22px;text-align:left}.level-choice{min-width:0;display:flex;gap:8px;align-items:center;padding:10px 8px;border:1px solid #2c3a60;border-radius:7px;background:#0d172b;color:#b8c4de}.level-choice:hover{border-color:#6277a6}.level-choice.selected{border-color:var(--cyan);background:#152640;box-shadow:0 0 0 1px rgba(110,231,242,.2)}.level-choice b{font:600 13px 'DM Mono';color:var(--cyan)}.level-choice span{min-width:0;font-size:11px;font-weight:700;line-height:1.25}.level-choice small{display:block;margin-top:3px;color:var(--muted);font-size:9px;font-weight:400;line-height:1.25}.screen-overlay{overflow:auto;padding:20px 0}.title-card{width:min(780px,94vw);margin:auto}.legend #soundBtn{margin-left:0}
@media(max-width:1150px){body{min-width:0}.game-layout{width:calc(100% - 24px);grid-template-columns:1fr}.side-panel{grid-column:1;grid-row:auto;display:grid;grid-template-columns:1fr 1fr}.battle-panel,.hand-panel{grid-column:1}.topbar{padding:0 14px}.hud-stats{gap:2px}.stat{min-width:67px;padding:4px}.top-actions{display:none}}
@media(max-width:800px){
  .game-layout{display:flex;flex-direction:column;gap:12px;margin:12px auto}
  .battle-panel{order:1}.hand-panel{order:2}.side-panel{order:3;display:flex;flex-direction:column;gap:12px}
  .hand{grid-template-columns:repeat(2,minmax(0,1fr))}
  .shop-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hand-panel,.battle-panel{padding:14px}
  .card,.hand .card{grid-template-rows:43px auto 1fr;min-width:0;min-height:148px;padding:9px 10px 27px;overflow:visible}
  .card .card-art{grid-column:2;grid-row:1;width:42px;height:42px;justify-self:end}
  .card .card-type{grid-column:1;grid-row:1;align-self:start}
  .card .card-name{grid-column:1 / -1;grid-row:2;font-size:13px;overflow-wrap:anywhere}
  .card .card-text{grid-column:1 / -1;grid-row:3;font-size:11px;line-height:1.4;overflow-wrap:anywhere}
  .card .card-cost{bottom:8px}
  .hand-panel .panel-heading{flex-wrap:wrap;align-items:center}
  .hand-hint{order:3;flex-basis:100%;font-size:12px;color:var(--muted)}
  .joker-btn{margin-left:auto;white-space:normal;text-align:center}
}
@media(max-width:520px){
  .topbar{height:auto;min-height:92px;display:block;padding:9px 12px 6px;position:relative}
  .brand{margin-bottom:7px}.brand-mark{width:25px;height:25px;font-size:14px}
  .brand strong{font-size:12px}.brand small{font-size:8px}
  .hud-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
  .stat{min-width:0;gap:4px;padding:3px 4px}.stat-icon{font-size:14px}.stat small{font-size:7px}.stat b{font-size:12px}
  .game-layout{width:calc(100% - 16px)}
  .battle-panel,.hand-panel,.side-panel .panel{padding:11px}
  .battle-panel .panel-heading{align-items:flex-start;flex-wrap:wrap;gap:8px}
  .battle-panel .panel-heading h2{font-size:19px}
  .wave-controls{margin-left:auto}.wave-controls span{font-size:10px}
  .battle-message{left:6px;bottom:6px;padding:5px 6px;font-size:9px}
  .legend{gap:6px;font-size:9px;white-space:nowrap}.legend span:nth-of-type(2),.legend span:nth-of-type(3){display:none}
  .shop-grid{grid-template-columns:1fr}
  .shop-grid .card{min-height:108px;grid-template-rows:40px auto 1fr}
  .shop-grid .card .card-art{width:40px;height:40px}
  .turn-actions span{line-height:1.4}
  .title-card{padding:24px}.title-card h1{font-size:34px}.howto{grid-template-columns:1fr;margin:16px 0}.level-select{grid-template-columns:1fr 1fr;margin-bottom:18px}.level-choice:last-child{grid-column:1 / -1}
}
@media(max-width:380px){
  .hand{grid-template-columns:1fr}
  .hand .card{min-height:104px;grid-template-rows:39px auto 1fr}
  .hand .card .card-art{width:39px;height:39px}
  .joker-btn{width:100%;margin-left:0}
}

/* Card selection actions and the clearer four-step onboarding. */
.modal-card{width:min(620px,90vw);max-height:90vh;overflow:auto}
.howto{grid-template-columns:repeat(4,1fr)}
.howto span{padding:10px;line-height:1.4}
.howto b{font-size:13px;margin-bottom:6px}
.action-choice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;max-height:52vh;overflow:auto;padding:2px}
.action-choice{min-width:0;display:grid;grid-template-columns:42px minmax(0,1fr);grid-template-rows:auto auto 1fr;column-gap:8px;text-align:left;padding:8px;border:1px solid #344661;border-radius:8px;background:#0e192c;color:var(--ink)}
.action-choice:hover{border-color:#7187b0}
.action-choice.selected{border-color:var(--cyan);background:#172942;box-shadow:0 0 0 2px rgba(110,231,242,.2)}
.action-choice .card-art{grid-column:1;grid-row:1 / 4;width:42px;height:42px}
.action-choice span{color:var(--cyan);font:8px 'DM Mono';letter-spacing:.1em;text-transform:uppercase}
.action-choice strong{font-size:12px;line-height:1.2}
.action-choice small{margin-top:4px;color:var(--muted);font-size:9px;line-height:1.3}
.modal-actions .primary-btn:disabled{opacity:.45;cursor:not-allowed;filter:none;transform:none}
@media(max-width:800px){.action-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.howto{grid-template-columns:1fr}.action-choice-grid{grid-template-columns:1fr}}

/* Abschluss eines Levels. */
.victory-card{text-align:center;padding:8px 4px 2px}
.victory-mark{width:72px;height:72px;margin:0 auto 14px;display:grid;place-items:center;border:1px solid var(--cyan);border-radius:50%;background:radial-gradient(circle,rgba(110,231,242,.22),rgba(110,231,242,.03) 68%);color:var(--cyan);font-size:35px;box-shadow:0 0 38px rgba(110,231,242,.2)}
.victory-kicker{margin:0 0 7px!important;color:var(--cyan)!important;font:10px 'DM Mono',monospace!important;letter-spacing:.18em}
.victory-card h2{margin:0 0 8px;font-size:32px}
.victory-card>p:not(.victory-kicker){margin:0 auto;max-width:420px}
.victory-summary{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:23px auto;max-width:380px}
.victory-summary span{padding:12px;border:1px solid var(--line);border-radius:8px;background:#0d172b}
.victory-summary small{display:block;margin-bottom:5px;color:var(--muted);font:8px 'DM Mono',monospace;letter-spacing:.08em}
.victory-summary b{color:var(--gold);font:600 22px 'DM Mono',monospace}
.victory-actions{display:flex;flex-direction:column;gap:9px;max-width:380px;margin:0 auto}
.victory-actions .primary-btn,.victory-actions .secondary-btn,.victory-actions .ghost-btn{width:100%}
@media(max-width:520px){.victory-card h2{font-size:27px}.victory-summary{grid-template-columns:1fr}.victory-mark{width:62px;height:62px;font-size:30px}}

/* Direkte Turmauswahl und frei wählbare Zielpriorität. */
.tower-controls{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:9px;padding:8px 10px;border:1px solid rgba(105,216,230,.34);border-radius:8px;background:linear-gradient(90deg,rgba(29,85,105,.2),rgba(15,28,49,.72))}
.tower-controls[hidden]{display:none}.tower-control-label{display:block;color:var(--cyan);font:700 8px 'DM Mono',monospace;letter-spacing:.14em}.tower-controls strong{font-size:12px}.priority-controls{display:flex;align-items:center;gap:5px}.priority-controls>span{margin-right:3px;color:var(--muted);font-size:10px}.priority-controls button{padding:6px 9px;border:1px solid #3b5570;border-radius:5px;background:#13213a;color:#afbdd6;font-size:10px}.priority-controls button:hover{border-color:var(--cyan);color:var(--ink)}.priority-controls button.active{border-color:var(--cyan);background:#24485c;color:#e9fbff;box-shadow:0 0 12px rgba(105,216,230,.15)}
@media(max-width:520px){.tower-controls{align-items:flex-start;flex-direction:column}.priority-controls{display:grid;grid-template-columns:repeat(3,1fr);width:100%}.priority-controls>span{grid-column:1 / -1}.priority-controls button{padding:8px 4px}}

/* Übersicht auf der Levelauswahl. */
.start-actions{display:flex;justify-content:center;gap:9px}.start-actions .secondary-btn{font-weight:600}.modal.codex-open{z-index:30}.modal.codex-open .modal-card{width:min(1040px,94vw)}.codex-view>h2{margin-bottom:5px}.codex-view>h3{margin:24px 0 10px;color:var(--cyan);font-size:15px}.codex-tower-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.codex-tower{min-width:0;display:grid;grid-template-columns:54px minmax(0,1fr);gap:9px;align-items:start;padding:9px;border:1px solid #304363;border-radius:8px;background:#0d1729}.codex-tower .card-art{width:54px;height:54px}.codex-tower strong,.codex-enemy strong{display:block;font-size:12px}.codex-tower span,.codex-enemy span{display:block;margin-top:3px;color:var(--gold);font:8px 'DM Mono',monospace;line-height:1.4}.codex-tower p,.codex-enemy p{margin:5px 0 0!important;color:#aebcd5!important;font-size:9px!important;line-height:1.35!important}.codex-enemy-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.codex-enemy{display:grid;grid-template-columns:58px minmax(0,1fr);gap:9px;align-items:center;padding:8px;border:1px solid #304363;border-radius:8px;background:#0d1729}.codex-enemy .enemy-art{width:58px;height:58px}
@media(max-width:800px){.codex-tower-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.start-actions{flex-direction:column}.start-actions button{width:100%}.codex-tower-grid,.codex-enemy-grid{grid-template-columns:1fr}.codex-tower{grid-template-columns:48px minmax(0,1fr)}.codex-tower .card-art{width:48px;height:48px}}

/* Browser fullscreen mode, including the WordPress iframe variant. */
:fullscreen{background:var(--bg)}
:-webkit-full-screen{background:var(--bg)}
@media(max-width:520px){#fullscreenBtn{padding-inline:6px}}