*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,system-ui,Segoe UI,Arial,sans-serif;color:#eef5fa;background:#07111a}body:before{content:"";position:fixed;inset:0;z-index:-2;background:linear-gradient(rgba(5,12,18,.83),rgba(5,12,18,.9)),url('/assets/backgrounds/site-bg.png') center/cover fixed no-repeat}a{color:#9fd3ff;text-decoration:none}h1,h2,h3{margin-top:0}.shell{width:min(1460px,calc(100% - 28px));margin:22px auto}.auth-page{display:grid;place-items:center;min-height:100vh}.auth-shell{width:min(560px,calc(100% - 28px));padding:24px}.brand{font-weight:900;letter-spacing:.08em;color:#f1c56d}.topbar{min-height:64px;padding:10px 18px;background:rgba(5,12,18,.92);border-bottom:1px solid #2a4353;display:flex;gap:18px;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:50}.main-nav,.userbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.panel{background:rgba(11,24,34,.9);border:1px solid #315064;border-radius:14px;padding:18px;box-shadow:0 14px 40px rgba(0,0,0,.2)}.hero{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center;padding:38px;border:1px solid #42667c;border-radius:22px;background:linear-gradient(135deg,rgba(16,44,60,.95),rgba(7,18,29,.9))}.hero h1{font-size:clamp(2rem,5vw,4rem);max-width:850px}.eyebrow{font-size:.75rem;text-transform:uppercase;letter-spacing:.18em;color:#d9b15d}.muted{color:#9aacb9}.btn,.ability{border:1px solid #4b7893;background:#1b6387;color:#fff;border-radius:10px;padding:11px 16px;font-weight:700;cursor:pointer}.btn.secondary{background:#172630}.btn.small{padding:7px 10px}.btn:disabled,.ability:disabled{opacity:.45;cursor:not-allowed}.pill{background:#142631;border:1px solid #345369;border-radius:999px;padding:6px 10px}.dashboard-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:16px 0}.mode-grid,.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.mode-grid{grid-template-columns:1fr 1fr}.inline{display:flex;gap:8px}.form-grid{display:grid;gap:13px}.form-grid.two{grid-template-columns:1fr 1fr}.form-grid .full{grid-column:1/-1}label{display:grid;gap:6px;color:#c7d4dc}input,select,textarea{width:100%;background:#08141d;color:#eef5fa;border:1px solid #39566a;border-radius:9px;padding:10px}textarea{min-height:90px}.alert{background:#4a1f27;border:1px solid #a94757;color:#ffdce2;padding:12px;border-radius:10px;margin:12px 0}.success{background:#163d2d;border:1px solid #36865f;padding:12px;border-radius:10px}.page-head{display:flex;justify-content:space-between;align-items:end;gap:18px;margin-bottom:18px}.deck-counter{background:#0c1d28;border:1px solid #35596e;border-radius:14px;padding:16px;font-size:1.3rem}.deck-counter b{font-size:2.2rem}.good{color:#7be28c}.bad{color:#ff8e95}.deck-toolbar{display:grid;grid-template-columns:1fr 220px auto 1fr;gap:10px;align-items:center;margin-bottom:16px}.deck-columns{display:grid;grid-template-columns:1fr 1fr;gap:18px}.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}.card-grid.compact{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}.collection-card,.mini-card,.pack,.board-card{background:rgba(9,22,31,.94);border:1px solid #345469;border-radius:13px;padding:10px;position:relative;overflow:hidden}.collection-card img,.mini-card img{width:100%;display:block;border-radius:8px}.collection-card.locked,.board-card.locked{filter:saturate(.3);opacity:.58}.meta,.stats{color:#a9bac5;font-size:.86rem;margin:6px 0}.placeholder{aspect-ratio:2/3;display:grid;place-items:center;font-size:3rem;background:linear-gradient(145deg,#193748,#0e1d27);border-radius:8px}.qty{display:grid;grid-template-columns:34px 1fr 34px;align-items:center;gap:6px;margin:8px 0}.qty button,.danger-btn,.small-link{background:#132733;color:#fff;border:1px solid #3c6074;border-radius:7px;padding:6px;cursor:pointer}.danger-btn{background:#5d242d}.filters{display:flex;gap:8px}.pack-grid,.board-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}.pack button{margin-top:12px}.premium{border-color:#b78f3f}.premium-tag{display:inline-block;background:#c99f49;color:#161006;border-radius:6px;padding:4px 7px;font-size:.72rem;font-weight:900}.board-card img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:8px}.ability{display:grid;gap:6px;text-align:left;background:#102331}.ability.selected{outline:2px solid #dfb75c}.season-columns{display:grid;grid-template-columns:1fr 1fr;gap:18px}.reward-track{display:grid;gap:8px}.reward-row{display:flex;justify-content:space-between;gap:12px;align-items:center;background:#0d202b;border:1px solid #315164;padding:11px;border-radius:10px}.reward-row>div{display:grid}.daily-panel{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.admin-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}.admin-tabs button{padding:9px 12px;border:1px solid #35566a;background:#112531;color:#fff;border-radius:9px}.admin-tabs button.active{background:#23688b}.tabpane{display:none}.tabpane.active{display:block}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:8px;border-bottom:1px solid #294454}
.match-window{height:100vh;overflow:hidden;background:#071019}.match-window:before{display:none}.match-topbar{height:44px;padding:7px 12px;background:#071018;border-bottom:1px solid #2c4758;display:flex;justify-content:space-between;align-items:center}.icon-btn{width:30px;height:30px;background:#152732;border:1px solid #395b6f;color:#fff;border-radius:8px}.game-layout{height:calc(100vh - 44px);display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:8px;padding:8px}.board-wrap{display:grid;grid-template-rows:56px minmax(0,1fr) 220px;min-height:0}.hud{display:flex;justify-content:space-between;align-items:center;background:rgba(5,13,19,.88);border:1px solid #2c4859;border-radius:9px;padding:6px 10px}.hpbar{height:8px;width:200px;background:#2a171b;border-radius:999px;overflow:hidden;margin-top:4px}.hpbar span{display:block;height:100%;background:#5ec77d}.mini-meta{font-size:.72rem;color:#a9bac5}.bottom-zone{display:grid;grid-template-rows:55px 42px minmax(0,1fr);min-height:0}.controls{display:flex;gap:7px;align-items:center}.hand{display:flex;gap:7px;overflow-x:auto;min-height:0}.game-card{position:relative;flex:0 0 112px;border:1px solid #4d6c7f;border-radius:8px;overflow:hidden;background:#0d1d27;cursor:pointer}.game-card img{width:100%;height:100%;object-fit:cover;display:block}.game-card-overlay{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(transparent,rgba(0,0,0,.92));padding:22px 5px 5px;display:grid;font-size:.6rem}.chat{height:100%;display:grid;grid-template-rows:auto 145px minmax(0,1fr) auto;gap:7px}.game-log,.messages{overflow:auto;background:#07141d;border:1px solid #294655;border-radius:8px;padding:7px;font-size:.74rem}.chat-send{display:flex;gap:5px}
@media(max-width:1000px){.dashboard-grid{grid-template-columns:1fr 1fr}.game-layout{grid-template-columns:minmax(0,1fr) 230px}.main-nav{order:3;width:100%;overflow:auto}.topbar{flex-wrap:wrap}.deck-columns{grid-template-columns:1fr}.form-grid.two{grid-template-columns:1fr}}
@media(max-width:700px){.dashboard-grid,.mode-grid,.season-columns,.grid-3{grid-template-columns:1fr}.hero{grid-template-columns:1fr;padding:22px}.page-head{align-items:stretch;flex-direction:column}.deck-toolbar{grid-template-columns:1fr}.game-layout{height:auto;grid-template-columns:1fr}.match-window{overflow:auto}.board-wrap{height:calc(100vh - 44px)}.chat{height:360px}}
/* SHIELDLINE 1.1 - rozbudowany panel administratora */
.admin-shell{padding-bottom:80px}.admin-summary{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:14px}.summary-card{display:grid;gap:2px;text-align:center;padding:14px;background:rgba(10,26,36,.92);border:1px solid #365c70;border-radius:12px}.summary-card b{font-size:1.8rem;color:#efc76c}.summary-card span{font-size:.78rem;color:#aebcc5;text-transform:uppercase;letter-spacing:.08em}.admin-two{display:grid;grid-template-columns:minmax(360px,.85fr) minmax(0,1.35fr);gap:14px;align-items:start}.sticky-admin-form{position:sticky;top:82px}.admin-form-head,.admin-list-head{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-bottom:12px}.admin-list-head input{max-width:300px}.asset-preview-box{min-height:130px;border:1px dashed #416477;border-radius:10px;background:#07151e;padding:8px;display:grid;gap:8px}.asset-preview-box span{font-size:.78rem;color:#90a7b5}.asset-preview-box img{display:none;width:100%;max-height:340px;object-fit:contain;border-radius:8px;background:#03090d}.asset-preview-box.board-preview img{aspect-ratio:16/9;object-fit:cover}.admin-card-list{display:grid;gap:8px}.admin-card-row{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:10px;align-items:center;background:#0b1d27;border:1px solid #2e4c5f;border-radius:10px;padding:8px}.admin-card-row small,.user-admin-row small{display:block;color:#95aab7;margin-top:2px}.admin-thumb{width:64px;height:80px;border-radius:7px;overflow:hidden;background:#061017;display:grid;place-items:center}.admin-thumb img{width:100%;height:100%;object-fit:cover}.admin-thumb span{font-size:1.6rem}.user-admin-row>span{display:block}.grant-panel{max-width:800px}.admin-tabs{position:sticky;top:64px;z-index:40;background:rgba(7,17,26,.96);padding:8px 0}
@media(max-width:1100px){.admin-summary{grid-template-columns:repeat(3,1fr)}.admin-two{grid-template-columns:1fr}.sticky-admin-form{position:static}}
@media(max-width:700px){.admin-summary{grid-template-columns:1fr 1fr}.admin-card-row{grid-template-columns:52px minmax(0,1fr)}.admin-card-row>.btn{grid-column:1/-1}.admin-tabs{position:static}.admin-list-head{align-items:stretch;flex-direction:column}.admin-list-head input{max-width:none}}
.pack-cover{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:9px;margin-bottom:9px;border:1px solid #35586c}
/* SHIELDLINE 1.2 — 5-starciowy system walki */
.battle-v2{grid-template-columns:minmax(0,1fr) 300px}
.battle-v2-wrap{grid-template-rows:58px minmax(0,1fr) 225px}
.battle-hud{position:relative;z-index:4}
.hud-score{display:grid;text-align:right;font-size:.68rem;color:#9cb1be}
.hud-score b{font-size:1.5rem;color:#f0c86d}
.battle-board-v2{
position:relative;min-height:0;display:grid;
grid-template-rows:minmax(0,1fr) 70px minmax(0,1fr);
background-position:center;background-size:cover;border:1px solid #3a6076;
border-radius:12px;overflow:hidden;box-shadow:inset 0 0 80px rgba(0,0,0,.42)
}
.battle-side{min-height:0;padding:8px 12px;background:linear-gradient(180deg,rgba(7,16,23,.44),rgba(7,16,23,.2))}
.player-side{display:grid;grid-template-rows:minmax(0,1fr) 34px}
.opponent-side{display:grid;grid-template-rows:34px minmax(0,1fr)}
.battle-side-head{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:.75rem}
.player-head{align-self:end}
.battle-totals{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.battle-totals b{background:rgba(4,12,18,.82);border:1px solid rgba(96,135,157,.48);border-radius:7px;padding:4px 7px}
.battle-totals .attack{color:#ffc279}.battle-totals .defense{color:#83cfff}.battle-totals .support{color:#8ff0c5}.battle-totals .shield{color:#e7f7ff}
.battle-slots{display:grid;grid-template-columns:repeat(5,minmax(74px,1fr));gap:7px;min-height:0;align-items:stretch}
.battle-slot{position:relative;min-width:0;min-height:0;border-radius:10px;border:1px solid rgba(139,181,205,.4);background:rgba(5,14,20,.34);display:grid;place-items:center;overflow:hidden;transition:.18s ease}
.battle-slot.empty-slot{border-style:dashed}
.battle-slot.empty-slot>span{opacity:.28;font-weight:900;font-size:1.4rem}
.battle-slot.drag-over{border-color:#f3cd72;box-shadow:0 0 0 2px rgba(243,205,114,.4),0 0 30px rgba(55,177,255,.25);transform:translateY(-2px)}
.board-mini{width:100%;height:100%;min-height:0;flex:none;border:0;border-radius:9px}
.board-mini img{width:100%;height:100%;object-fit:cover}
.board-mini .game-card-overlay{font-size:.62rem;padding:30px 5px 5px}
.card-buff{color:#7ff1c8;font-weight:800}
.battle-center{position:relative;z-index:3;display:flex;align-items:center;justify-content:center;gap:18px;background:rgba(4,11,17,.9);border-top:1px solid #365a70;border-bottom:1px solid #365a70}
.battle-turn-title{display:grid;text-align:center;text-transform:uppercase;font-size:.62rem;letter-spacing:.12em}.battle-turn-title b{font-size:1.25rem;color:#f2ca73}
.combat-equation{font-size:.76rem;color:#c8d9e2;text-align:center}
.damage-overlay{position:absolute;inset:-120px 0;pointer-events:none;display:grid;grid-template-rows:1fr auto 1fr;align-items:center;justify-items:center;z-index:30}
.damage-pop{font-size:clamp(1.2rem,3vw,2.3rem);font-weight:1000;text-shadow:0 2px 18px #000;animation:damagePop 1s ease both;color:#ff7878}
.damage-pop:has(+ .turn-result){}.turn-result{font-size:clamp(1rem,2.4vw,1.8rem);font-weight:1000;padding:8px 16px;border-radius:999px;background:rgba(5,12,18,.94);border:1px solid #657f91;box-shadow:0 10px 35px rgba(0,0,0,.45)}
.turn-result.win{color:#7cf1a0;border-color:#55b77a}.turn-result.lose{color:#ff8991;border-color:#a94b54}.turn-result.draw{color:#d7e3e8}
.battle-v2-bottom{grid-template-rows:58px 46px minmax(0,1fr)}
.play-hint{font-size:.72rem;color:#9fb3bf;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.battle-hand .hand-card{height:100%;aspect-ratio:2/3;flex-basis:112px;transition:.18s ease}
.hand-card.playable:hover{transform:translateY(-7px);border-color:#f1c86c;box-shadow:0 9px 22px rgba(0,0,0,.45)}
.hand-card.selected-card{outline:3px solid #f0c96c;transform:translateY(-7px)}
.disabled-card{opacity:.55;cursor:not-allowed}
.hand-card em{font-size:.52rem;color:#ffd77b;font-style:normal}
.card-destroy{animation:cardDestroy .82s cubic-bezier(.2,.7,.2,1) forwards;pointer-events:none}
@keyframes cardDestroy{0%{transform:scale(1);opacity:1;filter:brightness(1)}40%{transform:scale(1.08) rotate(2deg);filter:brightness(2)}100%{transform:scale(.15) rotate(12deg) translateY(-45px);opacity:0;filter:blur(6px)}}
@keyframes damagePop{0%{transform:scale(.4);opacity:0}25%{transform:scale(1.25);opacity:1}100%{transform:scale(1);opacity:0}}
.card-zoom{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.82);display:grid;place-items:center;padding:20px}
.card-zoom.hidden{display:none}.zoom-card{width:min(430px,90vw);background:#081722;border:1px solid #5b7a8d;border-radius:16px;padding:12px;text-align:center;box-shadow:0 30px 80px #000}
.zoom-card img{max-width:100%;max-height:72vh;border-radius:10px}
@media(max-width:1000px){.battle-v2{grid-template-columns:minmax(0,1fr) 235px}.battle-slots{gap:4px}.battle-side{padding:6px}.battle-totals{gap:3px}.battle-totals b{padding:3px 5px;font-size:.68rem}}
@media(max-width:700px){.battle-v2{grid-template-columns:1fr}.battle-v2-wrap{height:calc(100vh - 44px)}.battle-slots{grid-template-columns:repeat(5,minmax(58px,1fr))}.combat-equation{font-size:.62rem}.play-hint{display:none}}
/* SHIELDLINE 1.3 — ręka 5, specjalne, zakończenie meczu */
.opponent-side{grid-template-rows:34px 58px minmax(0,1fr)}
.player-side{grid-template-rows:minmax(0,1fr) 58px 34px}
.special-zone{
min-height:52px;display:flex;align-items:center;justify-content:center;gap:6px;
padding:4px 8px;border-top:1px dashed rgba(109,213,255,.35);
border-bottom:1px dashed rgba(109,213,255,.35);
background:rgba(7,20,31,.52);overflow-x:auto
}
.special-zone .board-mini{flex:0 0 46px;height:50px}
.special-zone .board-mini .game-card-overlay{display:none}
.special-zone-placeholder{font-size:.66rem;color:#87a5b7;letter-spacing:.04em}
.special-zone.drag-over{outline:2px solid #f1cb70;background:rgba(51,76,91,.72)}
.informational-special{box-shadow:0 0 0 1px #8fe9ff inset,0 0 18px rgba(83,210,255,.22)}
.refill-rule{font-size:.72rem;color:#b9cbd5;margin-right:auto}
.match-end-overlay{
position:fixed;inset:0;z-index:300;display:grid;place-items:center;
background:radial-gradient(circle at center,rgba(18,50,68,.82),rgba(0,0,0,.92));
padding:18px
}
.match-end-overlay.hidden{display:none}
.match-end-card{
width:min(560px,94vw);padding:30px;border-radius:20px;text-align:center;
background:linear-gradient(145deg,#0d2230,#071018);
border:1px solid #52778d;box-shadow:0 30px 100px #000
}
.match-end-card h1{font-size:clamp(2rem,7vw,4.2rem);margin:.2em 0}
.match-reward{margin:18px 0}
.reward-big{
display:grid;gap:5px;font-size:1.8rem;font-weight:900;padding:18px;
border:1px solid #6a8b9e;border-radius:14px;background:#0b1b25
}
.reward-big span{font-size:1rem;color:#a5e1ff}.reward-big small{font-size:.7rem;color:#f2cf7a}
.match-end-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}
/* Tryb płatności testowych */
.test-payment-panel{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:14px}
.switch-row{display:flex;align-items:center;gap:10px;white-space:nowrap}
.switch-row input{width:24px;height:24px}
.test-mode-badge{
display:inline-block;padding:7px 12px;border-radius:999px;font-weight:900;font-size:.72rem;
letter-spacing:.07em;background:#543e0d;border:1px solid #dcb34b;color:#ffe9a3
}
/* Sklep — foliowe paczki SHIELDLINE */
.pack-shelf{display:grid;grid-template-columns:repeat(auto-fill,minmax(245px,1fr));gap:18px;margin-bottom:24px}
.compact-packs{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.shop-pack-card{
border:1px solid #35566a;border-radius:17px;background:rgba(7,18,26,.93);
padding:12px;display:grid;gap:12px;box-shadow:0 16px 38px rgba(0,0,0,.3)
}
.pack-info{display:grid;gap:8px}.pack-info h3,.pack-info p{margin:0}
.foil-pack{
position:relative;width:min(270px,72vw);aspect-ratio:2/3;margin:auto;
display:flex;flex-direction:column;align-items:center;justify-content:center;gap:11px;
overflow:hidden;border-radius:13px;border:2px solid rgba(255,255,255,.5);
box-shadow:0 20px 55px rgba(0,0,0,.55),inset 0 0 60px rgba(255,255,255,.08);
background:
repeating-linear-gradient(115deg,rgba(255,255,255,.16) 0 2px,transparent 2px 11px),
linear-gradient(145deg,#153449,#07131f 45%,#315d70)
}
.foil-pack:before{
content:"";position:absolute;inset:-30%;transform:rotate(20deg);
background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);
animation:foilShine 2.4s linear infinite
}
.mini-foil{width:100%;max-width:220px}
.kind-attack{background:repeating-linear-gradient(120deg,rgba(255,255,255,.1) 0 2px,transparent 2px 12px),linear-gradient(145deg,#67151d,#17090d 58%,#bc5d1c)}
.kind-support{background:repeating-linear-gradient(120deg,rgba(255,255,255,.1) 0 2px,transparent 2px 12px),linear-gradient(145deg,#0b5b63,#081821 55%,#14906c)}
.kind-special{background:repeating-linear-gradient(120deg,rgba(255,255,255,.1) 0 2px,transparent 2px 12px),linear-gradient(145deg,#283a8b,#090c21 58%,#7250a7)}
.kind-random{background:repeating-linear-gradient(120deg,rgba(255,255,255,.1) 0 2px,transparent 2px 12px),linear-gradient(145deg,#17556f,#091721 55%,#6a7a86)}
.kind-collector{background:repeating-linear-gradient(120deg,rgba(255,255,255,.14) 0 2px,transparent 2px 9px),linear-gradient(145deg,#7a5d14,#151006 48%,#a32c6e)}
.kind-collection{background:repeating-linear-gradient(120deg,rgba(255,255,255,.1) 0 2px,transparent 2px 12px),linear-gradient(145deg,#174b7c,#091523 55%,#8b681b)}
.foil-top,.foil-bottom{position:relative;z-index:2;font-weight:1000;letter-spacing:.16em;text-align:center}
.foil-top{font-size:1.15rem;color:#f6d77d}.foil-bottom{font-size:.56rem;color:#c8d8df}
.foil-emblem{
position:relative;z-index:2;width:72px;height:72px;border-radius:50%;display:grid;place-items:center;
font-size:2.6rem;font-weight:1000;border:2px solid #d6eaff;background:rgba(0,0,0,.25);
box-shadow:0 0 35px rgba(100,205,255,.36)
}
.foil-name{position:relative;z-index:2;text-align:center;font-weight:1000;font-size:1.25rem;padding:0 12px}
.foil-kind{position:relative;z-index:2;font-size:.72rem;letter-spacing:.16em;padding:6px 9px;border:1px solid rgba(255,255,255,.4);border-radius:999px}
.foil-tear{position:absolute;left:0;right:0;top:21%;height:4px;background:transparent;z-index:4}
.foil-pack.tear-open .foil-tear{background:#fff;box-shadow:0 0 24px #fff;animation:tearLine .55s ease forwards}
.foil-pack.tear-open{animation:packShake .58s ease both}
.foil-pack.pack-gone{animation:packVanish .42s ease forwards}
.pack-opening{
position:fixed;inset:0;z-index:500;background:radial-gradient(circle,rgba(27,55,74,.94),rgba(0,0,0,.97));
display:grid;place-items:center;padding:18px
}
.pack-opening.hidden{display:none}
.opening-stage{
width:min(1260px,96vw);
max-height:min(92vh,980px);
overflow:auto;
display:grid;
justify-items:center;
align-content:start;
gap:14px;
padding:20px 18px 24px;
border-radius:22px;
border:1px solid rgba(88,128,150,.38);
background:linear-gradient(180deg,rgba(8,20,30,.94),rgba(3,10,16,.96));
box-shadow:0 30px 100px rgba(0,0,0,.55);
}
.opening-stage.cards-focus{
align-content:center;
}
.opening-text{
font-size:1.15rem;
font-weight:900;
letter-spacing:.07em;
text-align:center;
}
.opening-cards{
width:min(1080px,100%);
display:grid;
grid-template-columns:repeat(auto-fit,minmax(150px,170px));
justify-content:center;
gap:14px;
min-height:0;
}
.opening-card-slot{
width:100%;
max-width:170px;
opacity:0;
transform:translateY(35px) scale(.8) rotateY(80deg);
transition:.45s cubic-bezier(.2,.7,.2,1)
}
.opening-card-slot.shown{opacity:1;transform:none}
.opening-card-slot .mini-card{height:100%}
#profileCloseOpening{
margin-top:4px;
min-width:180px;
}
.rarity-collector{box-shadow:0 0 28px rgba(255,210,68,.55)}
.rarity-legendary{box-shadow:0 0 23px rgba(201,109,255,.45)}
.coin-orb{font-size:3rem}
@keyframes foilShine{0%{transform:translateX(-80%) rotate(20deg)}100%{transform:translateX(80%) rotate(20deg)}}
@keyframes packShake{0%,100%{transform:rotate(0)}20%{transform:rotate(-2deg)}40%{transform:rotate(2deg)}60%{transform:rotate(-1deg)}80%{transform:rotate(1deg)}}
@keyframes tearLine{0%{transform:scaleX(0)}100%{transform:scaleX(1)}}
@keyframes packVanish{to{opacity:0;transform:scale(1.25);filter:blur(12px)}}
@media(max-width:700px){
.test-payment-panel{align-items:flex-start;flex-direction:column}
.opening-stage{
width:min(98vw,98vw);
max-height:94vh;
padding:16px 12px 20px;
}
.opening-cards{
grid-template-columns:repeat(auto-fit,minmax(122px,140px));
gap:10px;
}
.opening-card-slot{
width:100%;
max-width:140px;
}
.special-zone{min-height:44px}
.foil-pack{width:min(230px,70vw)}
}
.hidden{display:none!important}
.match-top-actions{display:flex;align-items:center;gap:7px}
.battle-v2-wrap{grid-template-rows:58px minmax(0,1fr) 230px}
.controls .refill-rule{min-width:210px}
/* SHIELDLINE 1.3.1 — ulepszona plansza gry */
.board-refined{grid-template-columns:minmax(0,1fr) 320px}
.refined-board{
grid-template-rows:minmax(0,1fr) 82px minmax(0,1fr);
padding:10px;
gap:10px;
background-size:cover;
background-position:center;
}
.refined-side{
border:1px solid rgba(103,145,167,.34);
border-radius:16px;
background:linear-gradient(180deg,rgba(4,16,24,.44),rgba(4,16,24,.22));
box-shadow:inset 0 0 26px rgba(0,0,0,.18);
padding:10px 12px;
}
.lane-table{
display:grid;
grid-template-columns:96px minmax(0,1fr) 96px;
gap:10px;
align-items:stretch;
min-height:0;
}
.lane-main{
display:grid;
grid-template-rows:auto minmax(130px, 1fr) auto minmax(58px,auto) auto minmax(58px,auto);
gap:6px;
min-height:0;
}
.zone-title{
font-size:.72rem;
font-weight:900;
letter-spacing:.08em;
text-transform:uppercase;
color:#d9e7ee;
}
.zone-title.small{font-size:.62rem;color:#9eb6c4}
.refined-slots{
grid-template-columns:repeat(5, minmax(88px,1fr));
gap:10px;
align-items:center;
}
.battle-slot{
min-height:182px;
background:linear-gradient(180deg,rgba(6,22,33,.36),rgba(6,18,27,.66));
}
.board-mini{
width:100%;
height:100%;
display:flex;
align-items:stretch;
justify-content:center;
border-radius:12px;
overflow:hidden;
}
.board-mini img{
width:100%;
height:100%;
object-fit:cover;
object-position:center;
}
.board-mini .placeholder{
width:100%;
height:100%;
display:grid;
place-items:center;
font-size:2rem;
background:linear-gradient(135deg,#163243,#0b1921);
}
.board-mini .game-card-overlay{
font-size:.69rem;
padding:42px 7px 7px;
background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.18) 18%,rgba(0,0,0,.78) 100%);
}
.table-pile{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:8px;
border:1px solid rgba(123,166,191,.28);
border-radius:14px;
background:linear-gradient(180deg,rgba(8,18,26,.88),rgba(10,24,35,.78));
padding:10px 8px;
}
.pile-caption{
font-size:.68rem;
letter-spacing:.06em;
text-transform:uppercase;
color:#9fb5c2;
text-align:center;
}
.pile-stack{
width:60px;
height:86px;
position:relative;
}
.card-back{
position:absolute;
inset:0;
transform:translate(calc(var(--i)*2px), calc(var(--i)*-2px));
border-radius:10px;
border:1px solid rgba(255,255,255,.2);
box-shadow:0 6px 16px rgba(0,0,0,.35);
background:
linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,0)),
repeating-linear-gradient(135deg,rgba(255,255,255,.06) 0 2px, transparent 2px 9px),
linear-gradient(145deg,#0f2b3b,#081319 58%,#1d566f);
}
.card-back.hand{
background:
linear-gradient(135deg,rgba(255,255,255,.06),rgba(255,255,255,0)),
repeating-linear-gradient(135deg,rgba(255,255,255,.04) 0 2px, transparent 2px 9px),
linear-gradient(145deg,#301850,#160d24 58%,#6530b3);
}
.card-back::after{
content:"S";
position:absolute;
inset:0;
display:grid;
place-items:center;
font-weight:1000;
color:#f1d27a;
font-size:1.45rem;
text-shadow:0 2px 8px rgba(0,0,0,.5);
}
.bonus-zone,
.special-zone{
min-height:64px;
display:flex;
align-items:center;
gap:8px;
overflow-x:auto;
border-radius:12px;
padding:7px 9px;
background:rgba(7,20,31,.52);
border:1px dashed rgba(109,213,255,.25);
}
.bonus-zone .bonus-mini-wrap,
.special-zone .board-mini{
flex:0 0 auto;
}
.bonus-zone .board-mini,
.special-zone .board-mini{
width:52px;
height:72px;
}
.special-zone .board-mini .game-card-overlay,
.bonus-zone .board-mini .game-card-overlay{
display:none;
}
.refined-center{
border-radius:18px;
background:linear-gradient(180deg,rgba(6,18,27,.92),rgba(7,15,22,.94));
border:1px solid rgba(100,135,155,.34);
}
.refined-bottom{
grid-template-rows:58px 48px minmax(0,1fr);
}
.hand-wrap{
display:grid;
grid-template-rows:auto minmax(0,1fr);
gap:6px;
min-height:0;
}
.refined-hand{
align-items:flex-end;
gap:10px;
padding:10px 14px 14px;
background:linear-gradient(180deg,rgba(8,18,26,.72),rgba(6,14,20,.94));
border:1px solid rgba(108,151,175,.28);
border-radius:14px;
}
.refined-hand .hand-card{
flex:0 0 126px;
height:178px;
}
.opponent-side .battle-side-head,
.player-side .battle-side-head{
margin-bottom:8px;
}
@media(max-width:1200px){
.board-refined{grid-template-columns:minmax(0,1fr) 280px}
.lane-table{grid-template-columns:82px minmax(0,1fr) 82px}
.refined-slots{grid-template-columns:repeat(5,minmax(74px,1fr));gap:7px}
.battle-slot{min-height:156px}
.refined-hand .hand-card{flex-basis:108px;height:154px}
}
@media(max-width:900px){
.board-refined{grid-template-columns:1fr}
.lane-table{grid-template-columns:74px minmax(0,1fr) 74px;gap:7px}
.refined-slots{grid-template-columns:repeat(5,minmax(62px,1fr));gap:6px}
.battle-slot{min-height:128px}
.bonus-zone,.special-zone{min-height:56px}
.bonus-zone .board-mini,.special-zone .board-mini{width:42px;height:58px}
.refined-hand .hand-card{flex-basis:96px;height:138px}
}
@media(max-width:700px){
.battle-v2-wrap{grid-template-rows:58px minmax(0,1fr) 255px}
.lane-table{grid-template-columns:62px minmax(0,1fr) 62px}
.pile-stack{width:42px;height:60px}
.card-back::after{font-size:1rem}
.battle-slot{min-height:105px}
.refined-hand{overflow-x:auto}
.refined-hand .hand-card{flex-basis:82px;height:118px}
.zone-title{font-size:.6rem}
}
/* SHIELDLINE 1.3.2 — sklep paczek z grafikami */
.shop-hero{display:grid;grid-template-columns:minmax(260px,420px) minmax(0,1fr);gap:18px;align-items:center;margin-bottom:18px}
.shop-showcase{width:100%;border-radius:18px;border:1px solid rgba(127,176,203,.35);box-shadow:0 18px 50px rgba(0,0,0,.35)}
.collector-coming-panel{display:flex;justify-content:space-between;gap:18px;align-items:center;margin:16px 0 22px}
.collector-price-box{display:grid;grid-template-columns:1fr 1fr;gap:10px;min-width:320px}
.collector-price-box>div{padding:14px;border-radius:14px;border:1px solid rgba(123,166,191,.28);background:linear-gradient(180deg,rgba(8,18,26,.88),rgba(10,24,35,.78))}
.collector-price-box span{display:block;font-size:.75rem;color:#9fb5c2;margin-bottom:6px}.locked-text{color:#f1cd77}
.pack-art-card{position:relative;border-radius:16px;overflow:hidden;border:1px solid rgba(127,176,203,.35);background:#09131a;box-shadow:0 16px 38px rgba(0,0,0,.4)}
.pack-art-img{display:block;width:100%;height:340px;object-fit:cover;object-position:center top}
.compact-packs .pack-art-img{height:280px}
.pack-art-shine{position:absolute;inset:-20%;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.18) 50%,transparent 65%);transform:translateX(-100%);animation:shopShine 2.8s linear infinite;pointer-events:none}
.pack-lock-overlay{position:absolute;inset:auto 12px 12px 12px;padding:8px 10px;border-radius:999px;text-align:center;font-weight:900;letter-spacing:.08em;background:rgba(20,10,5,.9);border:1px solid #d4a93b;color:#ffe9a4;backdrop-filter:blur(4px)}
.locked-pack{opacity:.95}.locked-btn{background:#6b5320!important;color:#ffe39a!important;border-color:#d6ac49!important;cursor:not-allowed}
.pack-meta-row{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 6px}
.season-pill{background:#11212c}
.mini-card{position:relative}.collector-badge{position:absolute;top:8px;right:8px;padding:4px 7px;border-radius:999px;background:rgba(19,12,4,.9);color:#ffd878;border:1px solid #e0b855;font-size:.62rem;font-weight:900;letter-spacing:.06em;z-index:2}
.foil-pack.with-art{position:relative;width:min(320px,78vw);aspect-ratio:2/3;border-radius:16px;overflow:hidden}
.foil-pack-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top}
.foil-pack-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.12),rgba(0,0,0,.32) 45%,rgba(0,0,0,.78));z-index:1}
.foil-pack.with-art .foil-top,.foil-pack.with-art .foil-name,.foil-pack.with-art .foil-kind,.foil-pack.with-art .foil-bottom{position:relative;z-index:2}
.foil-pack.with-art .foil-top{margin-top:20px}
.foil-pack.with-art .foil-name{margin-top:auto;padding:0 12px;text-align:center;font-size:1.3rem;font-weight:1000;text-shadow:0 2px 18px rgba(0,0,0,.75)}
.foil-pack.with-art .foil-kind{margin-bottom:18px}
.opening-cards{align-items:flex-start}
.opening-card-slot .mini-card{height:230px}
.collector-label-admin{display:inline-block;margin:6px 0 4px;padding:4px 8px;border-radius:999px;font-size:.64rem;font-weight:900;letter-spacing:.06em;background:#3a2c0b;color:#ffd66f;border:1px solid #d1a848}
.admin-note.small-note{grid-column:1/-1;padding:10px 12px;border-radius:10px;background:rgba(24,29,34,.78);border:1px dashed rgba(200,170,86,.45);font-size:.82rem;color:#d7dee3}
@keyframes shopShine{0%{transform:translateX(-100%)}100%{transform:translateX(130%)}}
@media(max-width:900px){.shop-hero{grid-template-columns:1fr}.collector-coming-panel{flex-direction:column;align-items:stretch}.collector-price-box{min-width:0;grid-template-columns:1fr}.pack-art-img{height:290px}.compact-packs .pack-art-img{height:250px}}
.pack-sale-state{font-size:.7rem;font-weight:900;letter-spacing:.06em}
.pack-sale-state.on{color:#7ee6a8}.pack-sale-state.off{color:#efc870}
/* SHIELDLINE 1.3.4 — pełne karty na stole + 10 starć */
.refined-board{
overflow:auto;
}
.refined-side{
min-height:0;
}
.lane-main{
min-width:0;
}
.refined-slots{
grid-template-columns:repeat(5,minmax(104px,1fr));
gap:12px;
align-items:center;
justify-items:center;
overflow-x:auto;
overflow-y:hidden;
padding:4px 2px 8px;
}
.refined-slots .battle-slot{
width:100%;
max-width:176px;
min-width:104px;
min-height:0;
height:auto;
aspect-ratio:2/3;
align-self:center;
overflow:hidden;
background:
radial-gradient(circle at 50% 35%,rgba(39,77,99,.28),transparent 58%),
linear-gradient(180deg,rgba(6,22,33,.5),rgba(5,14,21,.86));
}
.refined-slots .battle-slot.empty-slot{
aspect-ratio:2/3;
}
.refined-slots .board-mini{
width:100%;
height:100%;
aspect-ratio:2/3;
padding:3px;
background:#050d12;
}
.refined-slots .board-mini img{
width:100%;
height:100%;
object-fit:contain!important;
object-position:center center!important;
border-radius:9px;
background:#050d12;
}
.refined-slots .board-mini .game-card-overlay{
display:none!important;
}
.refined-slots .board-mini:hover{
transform:translateY(-3px) scale(1.018);
box-shadow:0 10px 28px rgba(0,0,0,.48),0 0 0 1px rgba(241,201,108,.55);
}
.refined-slots .empty-slot>span{
font-size:1.1rem;
opacity:.2;
}
.bonus-zone .board-mini img,
.special-zone .board-mini img{
object-fit:contain!important;
object-position:center!important;
background:#061017;
}
.match-reward-label{
margin-top:18px;
font-size:.78rem;
text-transform:uppercase;
letter-spacing:.16em;
color:#b9cbd6;
font-weight:900;
}
.reward-big.victory-reward{
border-color:#4ba66e;
box-shadow:0 0 32px rgba(77,190,116,.16);
}
.reward-big.consolation-reward{
border-color:#9c7d46;
box-shadow:0 0 26px rgba(214,170,78,.12);
}
.reward-big.draw-reward{
border-color:#66879a;
}
.reward-big b{
color:#f0ca72;
font-size:2rem;
}
@media(max-width:1200px){
.refined-slots{grid-template-columns:repeat(5,minmax(88px,1fr));gap:8px}
.refined-slots .battle-slot{min-width:88px;max-width:148px}
}
@media(max-width:900px){
.refined-slots{
grid-template-columns:repeat(5,98px);
justify-content:start;
overflow-x:auto;
padding-bottom:10px;
}
.refined-slots .battle-slot{
width:98px;
min-width:98px;
max-width:98px;
}
}
@media(max-width:700px){
.refined-slots{
grid-template-columns:repeat(5,86px);
}
.refined-slots .battle-slot{
width:86px;
min-width:86px;
max-width:86px;
}
}
/* SHIELDLINE 1.3.6 — paczki w profilu */
.purchased-packs-info{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:18px 0}
.profile-packs-section{scroll-margin-top:80px;margin:20px 0 28px}
.section-head-row{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:14px}
.section-head-row h2,.section-head-row p{margin:.2rem 0}
.profile-packs-section .shop-pack-card{min-width:0}
.profile-packs-section .pack-art-img{height:310px}
#lastOpenedPanel{margin:18px 0 24px}
@media(max-width:760px){
.purchased-packs-info,.section-head-row{align-items:stretch;flex-direction:column}
.profile-packs-section .pack-art-img{height:270px}
}
/* SHIELDLINE 1.3.7 — działające zakupy paczek */
.shop-buy-intro{margin:20px 0 14px}
.shop-buy-intro h2,.shop-buy-intro p{margin:.25rem 0}
.buy-pack-shelf{
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
align-items:stretch;
}
.shop-buy-product{
height:100%;
display:flex;
flex-direction:column;
}
.shop-buy-product .pack-info{
flex:1;
display:flex;
flex-direction:column;
}
.shop-buy-product .pack-contains{
flex:1;
}
.pack-purchase-row{
display:flex;
align-items:end;
justify-content:space-between;
gap:12px;
margin-top:12px;
padding-top:12px;
border-top:1px solid rgba(116,156,178,.25);
}
.pack-price{
display:grid;
gap:3px;
}
.pack-price small{
color:#91a9b7;
text-transform:uppercase;
letter-spacing:.08em;
font-size:.65rem;
}
.pack-price strong{
font-size:1.05rem;
color:#f1cb75;
}
.pack-buy-btn{
min-width:132px;
font-weight:900;
}
.pack-after-buy{
display:block;
margin-top:9px;
color:#91a9b7;
line-height:1.4;
}
@media(max-width:650px){
.pack-purchase-row{align-items:stretch;flex-direction:column}
.pack-buy-btn{width:100%}
}
/* SHIELDLINE 1.3.8 — server-rendered product tiles */
.shop-page-v138 .server-pack-grid{
display:grid;
grid-template-columns:repeat(5,minmax(210px,1fr));
gap:18px;
align-items:stretch;
}
.shop-page-v138 .shop-pack-card{
display:flex;
flex-direction:column;
min-width:0;
}
.shop-page-v138 .pack-art-card{
aspect-ratio:2/3;
background:#061019;
}
.shop-page-v138 .pack-art-img{
width:100%;
height:100%;
object-fit:contain;
object-position:center;
background:radial-gradient(circle at center,rgba(55,77,91,.18),#050b0f);
}
.shop-page-v138 .pack-info{
display:flex;
flex-direction:column;
flex:1;
}
.pack-category-label{
color:#f0c86e;
text-transform:uppercase;
letter-spacing:.13em;
font-size:.68rem;
font-weight:1000;
}
.pack-pool-preview{
margin:10px 0 4px;
padding:10px;
border-radius:12px;
border:1px solid rgba(103,145,168,.22);
background:rgba(4,13,20,.56);
}
.pack-pool-preview>b{
display:block;
margin-bottom:8px;
font-size:.72rem;
color:#9fb7c5;
}
.pack-card-name-list{
display:flex;
flex-wrap:wrap;
gap:5px;
}
.pack-card-name-list span{
padding:4px 7px;
border-radius:999px;
background:#102733;
border:1px solid rgba(109,159,185,.28);
font-size:.67rem;
}
.pack-buy-form{
margin:0;
}
.shop-alert{
display:flex;
align-items:center;
gap:12px;
flex-wrap:wrap;
padding:13px 15px;
margin-bottom:15px;
border-radius:13px;
}
.shop-alert.success{
background:rgba(22,82,48,.34);
border:1px solid rgba(91,197,128,.48);
}
.shop-alert.error{
background:rgba(102,34,39,.34);
border:1px solid rgba(224,91,99,.48);
}
@media(max-width:1500px){
.shop-page-v138 .server-pack-grid{grid-template-columns:repeat(3,minmax(220px,1fr))}
}
@media(max-width:980px){
.shop-page-v138 .server-pack-grid{grid-template-columns:repeat(2,minmax(210px,1fr))}
}
@media(max-width:620px){
.shop-page-v138 .server-pack-grid{grid-template-columns:1fr}
.shop-page-v138 .pack-art-card{max-height:none}
}
/* SHIELDLINE 1.3.9 — monety + PLN */
.pack-payment-options{
display:grid;
gap:9px;
margin-top:12px;
}
.pack-buy-option{
display:flex;
justify-content:space-between;
align-items:center;
gap:12px;
margin:0;
padding:11px;
border-radius:12px;
background:rgba(5,15,22,.65);
border:1px solid rgba(110,153,178,.26);
}
.pack-buy-option.pln-option{
border-color:rgba(217,176,78,.32);
}
.pack-buy-option>div{
display:grid;
gap:3px;
}
.pack-buy-option small{
color:#8fa9b7;
text-transform:uppercase;
font-size:.62rem;
letter-spacing:.08em;
}
.pack-buy-option strong{
color:#f1cb75;
}
@media(max-width:650px){
.pack-buy-option{
align-items:stretch;
flex-direction:column;
}
.pack-buy-option .btn{
width:100%;
}
}
/* SHIELDLINE 1.3.12 — zarządzanie regułami paczek */
.pack-category-fieldset{
border:1px solid rgba(102,145,169,.32);
border-radius:12px;
padding:12px;
}
.pack-category-fieldset legend{
padding:0 7px;
font-weight:900;
}
.pack-category-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:8px;
}
.pack-category-grid label{
display:flex;
align-items:center;
gap:7px;
padding:8px 10px;
border-radius:9px;
background:rgba(8,20,29,.62);
}
.admin-actions{
display:flex;
gap:6px;
flex-wrap:wrap;
}
.btn.danger{
background:#6f1d26;
border-color:#b74651;
color:#fff;
}
.btn.danger:hover{
background:#8d2531;
}
@media(max-width:760px){
.pack-category-grid{grid-template-columns:1fr 1fr}
}
/* SHIELDLINE 1.3.13 — bonus shop */
.shop-bonuses-section{margin:34px 0}
.bonus-shop-grid{
display:grid;
grid-template-columns:repeat(5,minmax(190px,1fr));
gap:14px;
}
.bonus-shop-card{
display:flex;
flex-direction:column;
min-height:100%;
border:1px solid rgba(110,155,181,.3);
border-radius:16px;
padding:15px;
background:
radial-gradient(circle at 50% 12%,rgba(75,144,180,.18),transparent 35%),
linear-gradient(180deg,rgba(8,22,31,.96),rgba(4,12,18,.96));
box-shadow:0 16px 36px rgba(0,0,0,.26);
}
.bonus-shop-card.locked-bonus{opacity:.7}
.bonus-shop-icon{
width:72px;height:72px;
margin:0 auto 12px;
display:grid;place-items:center;
border-radius:50%;
font-size:2rem;
background:linear-gradient(145deg,#17384a,#08151e);
border:1px solid #4d819d;
box-shadow:0 0 28px rgba(70,170,216,.18);
color:#f1cd72;
}
.bonus-shop-body{
display:flex;
flex-direction:column;
flex:1;
}
.bonus-shop-body h3{margin:.2rem 0 .4rem}
.bonus-shop-body p{color:#b9cbd5;min-height:62px}
.bonus-code{
color:#6db6da;
text-transform:uppercase;
font-size:.62rem;
font-weight:900;
letter-spacing:.09em;
}
.bonus-effect{
display:grid;
gap:3px;
padding:9px;
margin:8px 0 12px;
border-radius:10px;
background:rgba(3,12,18,.55);
}
.bonus-effect small{color:#86a0af}
.bonus-buy-methods{display:grid;gap:8px;margin-top:auto}
.bonus-buy-form{
padding:9px;
border:1px solid rgba(108,151,176,.22);
border-radius:10px;
}
.bonus-buy-form label{
display:flex;
justify-content:space-between;
align-items:center;
gap:8px;
font-size:.72rem;
}
.bonus-buy-form input[type=number]{width:72px}
.bonus-price-line{
display:flex;
justify-content:space-between;
align-items:center;
gap:8px;
margin-top:8px;
}
.bonus-price-line strong{color:#f0cc77;font-size:.8rem}
.profile-bonuses-section{margin:22px 0 28px;scroll-margin-top:80px}
.profile-bonus-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:12px;
}
.profile-bonus-card{
position:relative;
display:grid;
grid-template-columns:56px 1fr;
gap:12px;
padding:13px;
border:1px solid rgba(105,150,176,.28);
border-radius:14px;
background:rgba(6,17,25,.82);
}
.profile-bonus-icon{
width:52px;height:52px;
border-radius:50%;
display:grid;place-items:center;
background:#123040;
font-size:1.5rem;
color:#f0ca70;
}
.profile-bonus-card h3,.profile-bonus-card p{margin:.1rem 0}
.profile-bonus-card p{font-size:.8rem;color:#aebfca}
.profile-bonus-card small{color:#6ba9c8}
.bonus-qty{
position:absolute;
top:10px;right:10px;
color:#f0ca70;
}
@media(max-width:1350px){.bonus-shop-grid{grid-template-columns:repeat(3,minmax(190px,1fr))}}
@media(max-width:800px){.bonus-shop-grid{grid-template-columns:repeat(2,minmax(180px,1fr))}}
@media(max-width:520px){.bonus-shop-grid{grid-template-columns:1fr}}
/* SHIELDLINE 1.3.16 — wyśrodkowany podgląd kart po otwarciu paczki */
.opening-stage.cards-focus .opening-cards{
margin-top:4px;
}
.opening-stage.cards-focus .opening-text{
font-size:1.05rem;
}
.opening-stage.cards-focus .foil-pack.hidden{
display:none!important;
}
/* SHIELDLINE 1.3.17 — aktywna lista paczek w panelu admina */
.admin-empty-list{
min-height:130px;
display:grid;
place-items:center;
align-content:center;
gap:8px;
text-align:center;
color:#aabdc8;
border:1px dashed rgba(89,133,158,.36);
border-radius:12px;
padding:18px;
}
#packsTable .table-wrap{
max-height:680px;
overflow:auto;
}
#packsTable table{
min-width:1050px;
}
#packsTable th{
position:sticky;
top:0;
z-index:2;
background:#0b1b25;
}
/* SHIELDLINE 1.3.18 — Paczka Kolekcjonerska Premium ID 2 */
.premium-pack-card{
border-color:rgba(218,177,67,.58);
box-shadow:0 16px 40px rgba(0,0,0,.34),0 0 24px rgba(210,163,48,.09);
}
.premium-pack-badge,
.premium-inline-tag{
display:inline-block;
background:linear-gradient(145deg,#d7ae45,#775713);
border:1px solid #f3d67f;
color:#130e03;
font-weight:1000;
letter-spacing:.06em;
}
.premium-inline-tag{
margin-left:7px;
padding:3px 6px;
border-radius:6px;
font-size:.58rem;
vertical-align:middle;
}
.premium-lock-overlay{
background:rgba(44,29,5,.86);
color:#ffe394;
border-color:#d8ae49;
}
.premium-required-box{
display:grid;
gap:8px;
}
/* SHIELDLINE 1.3.19 — pełny manager bonusów */
.bonus-manager-layout{
align-items:start;
}
.bonus-list-head{
margin-bottom:10px;
}
.bonus-admin-filters{
display:flex;
gap:7px;
flex-wrap:wrap;
margin-bottom:12px;
}
.bonus-filter span{
display:inline-grid;
min-width:20px;
height:20px;
place-items:center;
padding:0 5px;
margin-left:4px;
border-radius:999px;
background:rgba(255,255,255,.1);
font-size:.7rem;
}
.bonus-admin-table-wrap{
max-height:690px;
overflow:auto;
}
.bonus-admin-table{
min-width:1060px;
}
.bonus-admin-table th{
position:sticky;
top:0;
background:#0b1b25;
z-index:2;
}
.bonus-code-cell{
display:block;
color:#6fa8c5;
margin-top:3px;
}
.deleted-row{
opacity:.63;
}
.status-tag{
display:inline-block;
padding:4px 7px;
border-radius:999px;
font-size:.62rem;
font-weight:900;
letter-spacing:.05em;
}
.status-tag.active{
background:#163d2d;
border:1px solid #36865f;
color:#aef2c8;
}
.status-tag.inactive{
background:#3d3516;
border:1px solid #8b7936;
color:#f0dc99;
}
.status-tag.deleted{
background:#4a1f27;
border:1px solid #a94757;
color:#ffdce2;
}
.bonus-preview img{
max-width:180px;
max-height:180px;
object-fit:contain;
}
.bonus-shop-icon img{
width:100%;
height:100%;
object-fit:cover;
border-radius:50%;
}
.premium-bonus-card{
border-color:rgba(215,174,69,.5);
box-shadow:0 16px 36px rgba(0,0,0,.26),0 0 24px rgba(210,163,48,.08);
}
/* SHIELDLINE 1.3.20 — kompaktowy stół mieszczący się w oknie */
.match-window{
height:100dvh;
overflow:hidden;
}
.match-topbar{
height:40px;
min-height:40px;
padding:5px 10px;
}
.game-layout.board-refined{
height:calc(100dvh - 40px);
grid-template-columns:minmax(0,1fr) minmax(220px,260px);
gap:6px;
padding:6px;
overflow:hidden;
}
.board-refined .battle-v2-wrap{
grid-template-rows:46px minmax(0,1fr) 174px;
min-height:0;
overflow:hidden;
}
.board-refined .battle-hud{
padding:4px 8px;
}
.board-refined .hud-score b{
font-size:1.15rem;
}
.board-refined .hpbar{
height:6px;
width:min(180px,20vw);
}
.board-refined .refined-board{
grid-template-rows:minmax(0,1fr) 50px minmax(0,1fr);
padding:5px;
gap:5px;
overflow:hidden;
}
.board-refined .refined-side{
padding:5px 7px;
border-radius:11px;
overflow:hidden;
}
.board-refined .opponent-side{
grid-template-rows:25px minmax(0,1fr);
}
.board-refined .player-side{
grid-template-rows:minmax(0,1fr) 25px;
}
.board-refined .opponent-side .battle-side-head,
.board-refined .player-side .battle-side-head{
margin-bottom:2px;
font-size:.66rem;
}
.board-refined .battle-totals{
gap:3px;
}
.board-refined .battle-totals b{
padding:2px 5px;
font-size:.62rem;
}
.board-refined .lane-table{
grid-template-columns:64px minmax(0,1fr) 64px;
gap:5px;
min-height:0;
overflow:hidden;
}
.board-refined .lane-main{
grid-template-rows:auto minmax(0,1fr) auto 36px auto 36px;
gap:2px;
min-height:0;
overflow:hidden;
}
.board-refined .zone-title{
font-size:.55rem;
line-height:1;
}
.board-refined .zone-title.small{
font-size:.5rem;
}
.board-refined .refined-slots{
grid-template-columns:repeat(5,minmax(58px,96px));
justify-content:center;
align-items:center;
gap:5px;
padding:2px;
overflow:hidden;
}
.board-refined .refined-slots .battle-slot{
width:100%;
min-width:58px;
max-width:96px;
max-height:144px;
aspect-ratio:2/3;
}
.board-refined .refined-slots .board-mini{
padding:2px;
}
.board-refined .table-pile{
gap:4px;
padding:5px 3px;
border-radius:10px;
min-width:0;
overflow:hidden;
}
.board-refined .pile-stack{
width:40px;
height:57px;
}
.board-refined .pile-caption{
font-size:.52rem;
}
.board-refined .bonus-zone,
.board-refined .special-zone{
min-height:0;
height:36px;
padding:2px 5px;
gap:4px;
border-radius:8px;
overflow-x:auto;
overflow-y:hidden;
}
.board-refined .bonus-zone .board-mini,
.board-refined .special-zone .board-mini{
width:24px;
height:33px;
border-radius:5px;
}
.board-refined .special-zone-placeholder{
font-size:.48rem;
white-space:nowrap;
}
.board-refined .refined-center{
border-radius:10px;
}
.board-refined .battle-turn-title{
font-size:.5rem;
}
.board-refined .battle-turn-title b{
font-size:1rem;
}
.board-refined .combat-equation{
font-size:.64rem;
}
.board-refined .refined-bottom{
grid-template-rows:43px 39px minmax(0,1fr);
}
.board-refined .bottom-zone .hud{
padding:4px 8px;
}
.board-refined .controls{
gap:5px;
min-width:0;
overflow:hidden;
}
.board-refined .controls .btn{
padding:7px 9px;
font-size:.68rem;
white-space:nowrap;
}
.board-refined .controls .refill-rule{
min-width:0;
max-width:190px;
font-size:.58rem;
line-height:1.15;
}
.board-refined .play-hint{
min-width:0;
font-size:.58rem;
}
.board-refined .hand-wrap{
gap:2px;
}
.board-refined .refined-hand{
gap:6px;
padding:5px 8px 7px;
overflow-x:auto;
overflow-y:hidden;
}
.board-refined .refined-hand .hand-card{
flex:0 0 76px;
width:76px;
height:108px;
}
.board-refined .refined-hand .game-card-overlay{
padding:18px 4px 4px;
font-size:.48rem;
}
.board-refined .refined-hand .hand-card em{
font-size:.42rem;
}
.board-refined + .chat,
.game-layout.board-refined .chat{
min-width:0;
}
/* Dodatkowe zmniejszenie dla niższych ekranów laptopowych */
@media (min-width:701px) and (max-height:820px){
.game-layout.board-refined{
grid-template-columns:minmax(0,1fr) 230px;
}
.board-refined .battle-v2-wrap{
grid-template-rows:42px minmax(0,1fr) 150px;
}
.board-refined .refined-board{
grid-template-rows:minmax(0,1fr) 42px minmax(0,1fr);
padding:4px;
gap:3px;
}
.board-refined .lane-table{
grid-template-columns:54px minmax(0,1fr) 54px;
gap:3px;
}
.board-refined .lane-main{
grid-template-rows:auto minmax(0,1fr) auto 30px auto 30px;
}
.board-refined .refined-slots{
grid-template-columns:repeat(5,minmax(50px,82px));
gap:3px;
}
.board-refined .refined-slots .battle-slot{
min-width:50px;
max-width:82px;
max-height:123px;
}
.board-refined .pile-stack{
width:34px;
height:48px;
}
.board-refined .bonus-zone,
.board-refined .special-zone{
height:30px;
}
.board-refined .bonus-zone .board-mini,
.board-refined .special-zone .board-mini{
width:20px;
height:27px;
}
.board-refined .refined-bottom{
grid-template-rows:38px 35px minmax(0,1fr);
}
.board-refined .refined-hand .hand-card{
flex-basis:66px;
width:66px;
height:95px;
}
.board-refined .controls .refill-rule{
display:none;
}
}
/* Mobilnie nadal przewijamy poziomo rękę/karty, ale nie powiększamy stołu */
@media(max-width:700px){
.game-layout.board-refined{
height:auto;
grid-template-columns:1fr;
overflow:visible;
}
.match-window{
height:auto;
overflow:auto;
}
.board-refined .battle-v2-wrap{
height:calc(100dvh - 40px);
min-height:650px;
grid-template-rows:44px minmax(0,1fr) 170px;
}
.board-refined .refined-slots{
grid-template-columns:repeat(5,72px);
justify-content:start;
overflow-x:auto;
}
.board-refined .refined-slots .battle-slot{
width:72px;
min-width:72px;
max-width:72px;
}
}
/* SHIELDLINE 1.3.20 — bonus ekwipunku w meczu */
.game-inventory-bonus-btn{
background:linear-gradient(145deg,#735918,#2f2308);
border-color:#d3aa49;
color:#fff3c1;
}
.game-inventory-bonus-btn:disabled{
filter:saturate(.35);
}
.bonus-count-badge{
display:inline-grid;
place-items:center;
min-width:19px;
height:19px;
margin-left:4px;
padding:0 5px;
border-radius:999px;
background:rgba(0,0,0,.35);
color:#ffe28e;
font-size:.65rem;
}
.bonus-turn-status{
max-width:150px;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
font-size:.56rem;
color:#9eb7c5;
}
.bonus-turn-status.used{
color:#f0ca73;
}
.game-bonus-modal{
position:fixed;
inset:0;
z-index:450;
display:grid;
place-items:center;
padding:18px;
background:rgba(0,0,0,.82);
backdrop-filter:blur(5px);
}
.game-bonus-modal.hidden{
display:none;
}
.game-bonus-picker{
width:min(920px,96vw);
max-height:88vh;
overflow:auto;
background:linear-gradient(180deg,#0c202c,#071018);
}
.game-bonus-picker-head{
display:flex;
justify-content:space-between;
gap:16px;
align-items:start;
margin-bottom:14px;
}
.game-bonus-picker-head h2,
.game-bonus-picker-head p{
margin:.2rem 0;
}
.game-bonus-list{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:10px;
}
.game-bonus-choice{
display:grid;
grid-template-columns:58px minmax(0,1fr) auto;
align-items:center;
gap:10px;
padding:11px;
border-radius:13px;
border:1px solid rgba(105,151,177,.32);
background:rgba(7,20,29,.88);
}
.game-bonus-choice.usable{
border-color:rgba(221,180,75,.46);
}
.game-bonus-choice.disabled-bonus{
opacity:.62;
}
.game-bonus-choice-icon{
width:54px;
height:54px;
display:grid;
place-items:center;
border-radius:50%;
overflow:hidden;
background:linear-gradient(145deg,#173849,#08141d);
border:1px solid #537d94;
color:#f1cc72;
font-size:1.55rem;
}
.game-bonus-choice-icon img{
width:100%;
height:100%;
object-fit:cover;
}
.game-bonus-choice-body{
min-width:0;
}
.game-bonus-choice-body h3,
.game-bonus-choice-body p{
margin:.1rem 0;
}
.game-bonus-choice-body p{
color:#a9bdc8;
font-size:.72rem;
}
.game-bonus-choice-top{
display:flex;
justify-content:space-between;
gap:8px;
}
.game-bonus-choice-top b{
color:#f0ca73;
}
.game-bonus-effect{
display:flex;
align-items:center;
gap:7px;
margin-top:6px;
flex-wrap:wrap;
}
.game-bonus-effect span{
color:#6fb5d8;
font-size:.58rem;
text-transform:uppercase;
}
.game-bonus-effect strong{
font-size:.72rem;
}
@media(max-width:620px){
.game-bonus-list{
grid-template-columns:1fr;
}
.game-bonus-choice{
grid-template-columns:48px minmax(0,1fr);
}
.game-bonus-choice>.btn{
grid-column:1/-1;
}
}
/* SHIELDLINE 1.3.21 — poprawny zakup -> otwieranie paczki */
.pack-purchase-success{
display:grid;
grid-template-columns:78px minmax(0,1fr) auto;
align-items:center;
gap:14px;
padding:12px 14px;
}
.purchased-pack-thumb{
width:72px;
aspect-ratio:2/3;
object-fit:contain;
display:block;
border-radius:9px;
background:#071019;
border:1px solid rgba(109,155,180,.38);
box-shadow:0 8px 24px rgba(0,0,0,.35);
}
.purchased-pack-copy{
display:grid;
gap:4px;
}
.purchased-pack-copy b{
color:#f4d582;
}
.purchased-pack-open{
min-width:150px;
text-align:center;
}
.profile-packs-section .owned-pack-tile{
align-content:start;
}
.profile-packs-section .owned-pack-art{
display:grid;
place-items:center;
background:radial-gradient(circle at center,rgba(34,61,76,.28),rgba(4,12,18,.96));
}
.profile-packs-section .owned-pack-art .pack-art-img{
width:100%;
height:310px;
object-fit:contain;
object-position:center;
}
.owned-pack-open-btn{
width:100%;
margin-top:auto;
font-size:.95rem;
}
#profilePackOpening .foil-pack-art{
object-fit:contain;
object-position:center;
background:#061019;
}
#profilePackOpening .opening-cards{
align-items:start;
}
#profilePackOpening .opening-card-slot .mini-card{
height:auto;
min-height:0;
}
#profilePackOpening .opening-card-slot .mini-card img{
width:100%;
height:auto;
aspect-ratio:2/3;
object-fit:contain;
background:#061019;
}
@media(max-width:650px){
.pack-purchase-success{
grid-template-columns:62px minmax(0,1fr);
}
.purchased-pack-thumb{
width:58px;
}
.purchased-pack-open{
grid-column:1/-1;
width:100%;
}
.profile-packs-section .owned-pack-art .pack-art-img{
height:260px;
}
}
/* SHIELDLINE 1.3.22 — podgląd -> Otwórz -> animacja -> karty */
#profilePackOpening .opening-stage{
width:min(1180px,95vw);
max-height:92vh;
}
#profilePackOpening .foil-pack{
width:min(300px,58vw);
height:auto;
aspect-ratio:2/3;
position:relative;
overflow:hidden;
}
#profilePackOpening .foil-pack.pack-preview{
animation:packPreviewFloat 2.4s ease-in-out infinite;
}
#profilePackOpening .foil-pack-art{
position:absolute;
inset:0;
width:100%;
height:100%;
display:block;
object-fit:contain;
object-position:center;
border-radius:inherit;
background:#050d13;
}
#profilePackOpening .foil-pack-overlay{
pointer-events:none;
}
#profilePackOpening .foil-top,
#profilePackOpening .foil-name,
#profilePackOpening .foil-kind,
#profilePackOpening .foil-bottom{
pointer-events:none;
}
#profilePackOpening .opening-actions{
display:flex;
justify-content:center;
align-items:center;
gap:10px;
flex-wrap:wrap;
margin-top:2px;
}
#profilePackOpening .opening-actions.hidden{
display:none;
}
#profilePackOpening #profileConfirmOpen{
min-width:210px;
padding:12px 22px;
font-size:.95rem;
font-weight:1000;
background:linear-gradient(145deg,#2676a0,#16455e);
border-color:#55a7cf;
}
#profilePackOpening #profileCloseOpening{
min-width:130px;
}
#profilePackOpening .opening-text{
max-width:780px;
color:#d9e6ec;
text-align:center;
}
#profilePackOpening .opening-stage.cards-focus{
justify-content:center;
}
#profilePackOpening .opening-cards{
width:min(1050px,100%);
grid-template-columns:repeat(auto-fit,minmax(145px,170px));
justify-content:center;
align-items:start;
gap:14px;
}
#profilePackOpening .opening-card-slot{
max-width:170px;
}
#profilePackOpening .opening-card-slot .mini-card{
height:auto;
min-height:0;
overflow:visible;
}
#profilePackOpening .opening-card-slot .mini-card img{
width:100%;
height:auto;
aspect-ratio:2/3;
object-fit:contain;
object-position:center;
display:block;
}
#profilePackOpening .opening-stage.opening-done #profileCloseOpening{
margin-top:6px;
}
@keyframes packPreviewFloat{
0%,100%{transform:translateY(0) scale(1)}
50%{transform:translateY(-7px) scale(1.012)}
}
@media(max-width:650px){
#profilePackOpening .foil-pack{
width:min(250px,72vw);
}
#profilePackOpening .opening-actions{
width:100%;
}
#profilePackOpening #profileConfirmOpen,
#profilePackOpening #profileCloseOpening{
width:100%;
}
#profilePackOpening .opening-cards{
grid-template-columns:repeat(2,minmax(120px,145px));
}
}
/* SHIELDLINE 1.3.23 — status paczki w Admin */
#packsTable .pack-row-inactive{
opacity:.62;
}
#packsTable .pack-active-on{
border-color:#3f9168;
background:#173d2c;
color:#b9f3cd;
}
#packsTable .pack-sale-on{
border-color:#4384a5;
background:#16425a;
color:#d8f0fc;
}
#packsTable td:nth-last-child(3),
#packsTable td:nth-last-child(2){
white-space:nowrap;
}
#packForm label small{
display:block;
margin-top:5px;
color:#8fa5b2;
line-height:1.25;
}
/* SHIELDLINE 1.3.24 — pełny podgląd wszystkich kart po otwarciu */
#profilePackOpening{
overflow:hidden;
}
#profilePackOpening .opening-stage{
width:min(1460px,97vw);
max-height:94vh;
box-sizing:border-box;
overflow-y:auto;
overflow-x:hidden;
overscroll-behavior:contain;
overflow-anchor:none;
scroll-behavior:auto;
}
#profilePackOpening .opening-stage.cards-focus{
width:min(1460px,97vw);
max-height:94vh;
align-content:start;
justify-content:center;
padding-top:18px;
padding-bottom:20px;
overflow-y:auto;
overflow-x:hidden;
overflow-anchor:none;
}
#profilePackOpening .opening-stage.cards-focus .opening-text{
position:sticky;
top:0;
z-index:5;
width:100%;
margin:0;
padding:8px 10px 12px;
background:linear-gradient(180deg,rgba(7,18,27,.98) 72%,rgba(7,18,27,0));
}
#profilePackOpening .opening-cards{
--reveal-card-w:clamp(118px,10.8vw,172px);
width:100%;
max-width:1180px;
display:grid!important;
grid-template-columns:repeat(var(--reveal-cols,5),minmax(0,var(--reveal-card-w)))!important;
justify-content:center!important;
align-items:start!important;
align-content:start!important;
gap:12px!important;
margin:0 auto;
padding:2px 4px 12px;
box-sizing:border-box;
overflow:visible!important;
overflow-anchor:none;
}
#profilePackOpening .opening-card-slot{
width:var(--reveal-card-w)!important;
max-width:var(--reveal-card-w)!important;
min-width:0!important;
height:auto!important;
max-height:none!important;
overflow:visible!important;
box-sizing:border-box;
}
#profilePackOpening .opening-card-slot.shown{
height:auto!important;
max-height:none!important;
}
#profilePackOpening .opening-card-slot .mini-card{
width:100%!important;
height:auto!important;
min-height:0!important;
max-height:none!important;
display:flex!important;
flex-direction:column!important;
box-sizing:border-box!important;
overflow:visible!important;
padding:7px!important;
}
#profilePackOpening .opening-card-slot .mini-card img{
flex:0 0 auto;
width:100%!important;
height:auto!important;
min-height:0!important;
max-height:none!important;
aspect-ratio:2/3;
object-fit:contain!important;
object-position:center!important;
display:block!important;
border-radius:7px;
}
#profilePackOpening .opening-card-slot .mini-card h3{
margin:7px 2px 3px!important;
font-size:.83rem!important;
line-height:1.18!important;
min-height:0!important;
white-space:normal!important;
overflow:visible!important;
}
#profilePackOpening .opening-card-slot .mini-card .meta,
#profilePackOpening .opening-card-slot .mini-card .stats{
margin:3px 2px!important;
font-size:.68rem!important;
line-height:1.2!important;
white-space:normal!important;
overflow:visible!important;
}
#profilePackOpening .opening-stage.opening-done #profileCloseOpening{
position:sticky;
bottom:0;
z-index:6;
margin:8px auto 0;
box-shadow:0 -8px 24px rgba(3,10,16,.7);
}
/* Typowe paczki pięciokartowe mieszczą się w jednym rzędzie. */
@media(min-width:901px){
#profilePackOpening .opening-cards[data-card-count="5"]{
--reveal-cols:5!important;
}
}
/* Średnie ekrany: nadal pokazujemy pełne karty, ewentualnie w 3 kolumnach. */
@media(min-width:651px) and (max-width:900px){
#profilePackOpening .opening-cards{
--reveal-card-w:clamp(125px,18vw,155px);
grid-template-columns:repeat(min(var(--reveal-cols,3),3),minmax(0,var(--reveal-card-w)))!important;
}
}
/* Telefon: pełne karty po 2 w rzędzie, przewijanie dotyczy całych rzędów, nie samych kart. */
@media(max-width:650px){
#profilePackOpening .opening-stage.cards-focus{
width:98vw;
max-height:95vh;
padding:12px 8px 18px;
}
#profilePackOpening .opening-cards{
--reveal-card-w:min(42vw,142px);
grid-template-columns:repeat(2,minmax(0,var(--reveal-card-w)))!important;
gap:9px!important;
}
#profilePackOpening .opening-card-slot{
width:var(--reveal-card-w)!important;
max-width:var(--reveal-card-w)!important;
}
}
/* Bardzo niski desktop/laptop: zmniejszamy całe karty zamiast je obcinać. */
@media(min-width:901px) and (max-height:760px){
#profilePackOpening .opening-cards{
--reveal-card-w:clamp(105px,9vw,138px);
gap:9px!important;
}
#profilePackOpening .opening-card-slot .mini-card h3{
font-size:.72rem!important;
}
#profilePackOpening .opening-card-slot .mini-card .meta,
#profilePackOpening .opening-card-slot .mini-card .stats{
font-size:.6rem!important;
}
}
/* SHIELDLINE 1.3.25 — Album kart kolekcjonerskich */
.profile-tabs{
position:sticky;
top:54px;
z-index:40;
display:flex;
gap:7px;
flex-wrap:wrap;
margin:0 0 18px;
padding:8px;
border:1px solid rgba(87,132,156,.28);
border-radius:13px;
background:rgba(5,16,24,.92);
backdrop-filter:blur(8px);
}
.profile-tabs a{
padding:8px 12px;
border:1px solid #355a70;
border-radius:9px;
color:#d7e6ed;
text-decoration:none;
font-weight:800;
font-size:.8rem;
}
.profile-tabs a:hover,
.profile-tabs a.active{
background:#1d5e7f;
border-color:#3f91b8;
color:#fff;
}
.profile-tabs .album-tab-link{
border-color:#9b7b2e;
color:#f0d17a;
}
.profile-tabs .album-tab-link.active,
.profile-tabs .album-tab-link:hover{
background:#5a4311;
border-color:#d6ae49;
color:#fff0b9;
}
.collector-album-section{
scroll-margin-top:120px;
margin:22px 0 30px;
padding:18px;
border:1px solid rgba(210,169,66,.34);
border-radius:18px;
background:
radial-gradient(circle at 50% 0,rgba(191,145,39,.12),transparent 34%),
linear-gradient(180deg,rgba(9,22,31,.96),rgba(5,14,21,.96));
box-shadow:0 18px 50px rgba(0,0,0,.24);
}
.album-heading-row{
margin-bottom:13px;
}
.album-stats{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:10px;
margin-bottom:18px;
}
.album-stat{
display:grid;
gap:4px;
padding:11px 13px;
border:1px solid rgba(209,169,70,.26);
border-radius:11px;
background:rgba(16,24,28,.72);
}
.album-stat small{
color:#9eb0ba;
font-size:.68rem;
text-transform:uppercase;
letter-spacing:.06em;
}
.album-stat b{
color:#f0d17a;
font-size:1.05rem;
}
.album-subsection{
margin-top:18px;
}
.album-subhead{
display:flex;
justify-content:space-between;
align-items:end;
gap:12px;
margin-bottom:10px;
}
.album-subhead h3,
.album-subhead p{
margin:.2rem 0;
}
.album-subhead p{
color:#9db0bb;
font-size:.82rem;
}
.album-card-grid{
display:grid;
grid-template-columns:repeat(auto-fill,minmax(190px,1fr));
gap:12px;
}
.album-card{
min-width:0;
padding:10px;
border:1px solid rgba(88,132,155,.3);
border-radius:14px;
background:rgba(7,18,26,.9);
overflow:hidden;
}
.album-card-art{
position:relative;
display:grid;
place-items:center;
min-height:240px;
border-radius:10px;
overflow:hidden;
background:radial-gradient(circle,rgba(54,84,101,.24),rgba(4,12,18,.9));
}
.album-card-art img{
width:100%;
height:270px;
display:block;
object-fit:contain;
object-position:center;
}
.album-card-qty{
position:absolute;
top:8px;
right:8px;
min-width:30px;
height:30px;
display:grid;
place-items:center;
padding:0 7px;
border-radius:999px;
background:#0a1a24;
border:1px solid #d8ae49;
color:#f6d983;
font-weight:1000;
}
.album-card-info{
display:grid;
gap:6px;
padding:8px 2px 1px;
}
.album-card-info h4,
.album-card-info p{
margin:0;
}
.album-card-info h4{
font-size:.96rem;
}
.album-card-info small{
color:#91a9b6;
}
.album-card-info p{
min-height:38px;
color:#aebfc8;
font-size:.76rem;
}
.album-mini-stats{
color:#d6e2e7;
font-size:.75rem;
}
.album-book{
margin-top:26px;
padding-top:18px;
border-top:1px solid rgba(210,169,66,.2);
}
.album-book-card.in-album{
border-color:#b78e32;
box-shadow:0 0 24px rgba(196,147,38,.1);
}
.album-book-card.owned-outside{
border-color:#3c7998;
}
.album-book-card.missing{
opacity:.48;
filter:saturate(.28);
}
.album-book-card.missing .album-card-art img{
filter:grayscale(1) brightness(.42) blur(.5px);
}
.album-collected-mark,
.album-awaiting-mark,
.album-missing-mark{
position:absolute;
left:8px;
bottom:8px;
padding:5px 8px;
border-radius:7px;
font-size:.6rem;
font-weight:1000;
letter-spacing:.06em;
}
.album-collected-mark{
background:#5c4410;
border:1px solid #dfb74e;
color:#ffebaa;
}
.album-awaiting-mark{
background:#123f57;
border:1px solid #4f9cc1;
color:#d5f1ff;
}
.album-missing-mark{
background:#2b3236;
border:1px solid #66747b;
color:#c1cbd0;
}
.album-empty{
grid-column:1/-1;
display:grid;
place-items:center;
gap:6px;
min-height:110px;
padding:18px;
text-align:center;
border:1px dashed rgba(96,137,158,.34);
border-radius:12px;
color:#9db0bb;
}
#album,
#my-packs,
#my-bonuses,
#hero-profile,
#my-boards{
scroll-margin-top:120px;
}
@media(max-width:850px){
.album-stats{
grid-template-columns:repeat(2,minmax(0,1fr));
}
}
@media(max-width:600px){
.profile-tabs{
top:44px;
overflow-x:auto;
flex-wrap:nowrap;
}
.profile-tabs a{
white-space:nowrap;
}
.album-stats{
grid-template-columns:1fr 1fr;
}
.album-card-grid{
grid-template-columns:repeat(2,minmax(0,1fr));
}
.album-card-art{
min-height:190px;
}
.album-card-art img{
height:210px;
}
}
/* SHIELDLINE 1.3.26 — rozdzielone zakładki Profilu */
.profile-tabs{
position:sticky;
top:54px;
z-index:40;
display:flex;
gap:7px;
flex-wrap:wrap;
margin:0 0 18px;
padding:8px;
border:1px solid rgba(87,132,156,.28);
border-radius:13px;
background:rgba(5,16,24,.94);
backdrop-filter:blur(8px);
}
.profile-tab-btn{
border:1px solid #355a70;
background:#10232f;
color:#d7e6ed;
border-radius:9px;
padding:8px 12px;
font-weight:800;
font-size:.8rem;
cursor:pointer;
}
.profile-tab-btn:hover,
.profile-tab-btn.active{
background:#1d5e7f;
border-color:#3f91b8;
color:#fff;
}
.profile-tab-btn.album-tab-link{
border-color:#9b7b2e;
color:#f0d17a;
}
.profile-tab-btn.album-tab-link:hover,
.profile-tab-btn.album-tab-link.active{
background:#5a4311;
border-color:#d6ae49;
color:#fff0b9;
}
.profile-tab-pane{
display:none;
}
.profile-tab-pane.active{
display:block;
animation:profilePaneIn .18s ease both;
}
@keyframes profilePaneIn{
from{opacity:.35;transform:translateY(4px)}
to{opacity:1;transform:none}
}
/* Paczki: tylko paczki + wynik ostatniego otwarcia. */
#profile-pane-packs .profile-packs-section{
margin-top:0;
}
#profile-pane-packs #lastOpenedPanel{
margin-top:18px;
}
/* Bonusy: tylko user_bonuses. */
#profile-pane-bonuses .profile-bonuses-section{
margin-top:0;
}
/* Bohater: osobna przestrzeń, bez kart i bez listy bonusów. */
.hero-profile-section{
margin:0;
padding:18px;
border:1px solid rgba(92,139,164,.3);
border-radius:16px;
background:
radial-gradient(circle at 20% 0,rgba(57,115,148,.14),transparent 34%),
rgba(6,17,25,.88);
}
.hero-coming-panel{
display:grid;
grid-template-columns:74px minmax(0,1fr);
gap:16px;
align-items:center;
min-height:120px;
padding:16px;
border:1px dashed rgba(100,151,179,.42);
border-radius:13px;
background:rgba(7,20,29,.72);
}
.hero-coming-icon{
width:66px;
height:66px;
display:grid;
place-items:center;
border-radius:50%;
border:1px solid #638aa0;
background:linear-gradient(145deg,#173648,#08131b);
color:#f0cd75;
font-size:1.8rem;
}
.hero-coming-panel h3,
.hero-coming-panel p{
margin:.2rem 0;
}
.hero-coming-panel p{
color:#a9bdc8;
}
/* Plansze: tylko plansze z możliwością podmiany aktywnej. */
.profile-boards-section{
padding:18px;
border:1px solid rgba(82,129,153,.32);
border-radius:16px;
background:rgba(7,19,27,.88);
}
.selected-board-summary{
margin:12px 0 16px;
}
.selected-board-mini{
display:flex;
align-items:center;
gap:12px;
padding:10px;
border:1px solid #4f839d;
border-radius:12px;
background:rgba(10,31,43,.82);
}
.selected-board-mini img{
width:120px;
height:68px;
object-fit:cover;
border-radius:8px;
border:1px solid #4d7488;
}
.selected-board-mini div{
display:grid;
gap:3px;
}
.selected-board-mini small{
color:#78b7d6;
font-size:.64rem;
letter-spacing:.08em;
}
.selected-board-mini b{
font-size:1rem;
}
.profile-board-grid{
display:grid;
grid-template-columns:repeat(auto-fill,minmax(250px,1fr));
gap:13px;
}
.profile-board-card{
overflow:hidden;
}
.profile-board-card.selected-board-card{
border-color:#4f9ec4;
box-shadow:0 0 0 1px rgba(79,158,196,.25),0 12px 28px rgba(0,0,0,.25);
}
.profile-board-card>img{
width:100%;
aspect-ratio:16/9;
object-fit:cover;
display:block;
}
.profile-board-card-body{
display:grid;
gap:7px;
padding-top:9px;
}
.profile-board-card-body h3,
.profile-board-card-body p{
margin:0;
}
.profile-board-card-body p{
color:#9fb2bd;
min-height:38px;
font-size:.78rem;
}
@media(max-width:600px){
.profile-tabs{
top:44px;
flex-wrap:nowrap;
overflow-x:auto;
}
.profile-tab-btn{
white-space:nowrap;
}
.hero-coming-panel{
grid-template-columns:1fr;
text-align:center;
}
.hero-coming-icon{
margin:auto;
}
.profile-board-grid{
grid-template-columns:1fr;
}
}
/* SHIELDLINE 1.3.27 — manager wielu talii */
.deck-manager-shell{
padding-bottom:60px;
}
.deck-page-head{
align-items:center;
}
.deck-counter{
min-width:150px;
text-align:center;
}
.deck-counter small{
display:block;
color:#8fa7b5;
font-size:.65rem;
text-transform:uppercase;
letter-spacing:.06em;
}
.deck-library-panel{
margin-bottom:18px;
}
.deck-create-form{
display:grid;
grid-template-columns:minmax(220px,1fr) auto auto;
gap:8px;
margin:12px 0 15px;
padding:10px;
border:1px solid #365b70;
border-radius:11px;
background:#081821;
}
.deck-library{
display:grid;
grid-template-columns:repeat(auto-fill,minmax(290px,1fr));
gap:11px;
}
.deck-library-card{
min-width:0;
display:grid;
grid-template-columns:88px minmax(0,1fr);
grid-template-areas:
"preview copy"
"preview actions";
gap:8px 11px;
padding:11px;
border:1px solid #315266;
border-radius:13px;
background:linear-gradient(145deg,rgba(10,27,38,.96),rgba(6,17,25,.96));
}
.deck-library-card.active-deck-card{
border-color:#4e9a70;
box-shadow:0 0 0 1px rgba(78,154,112,.16);
}
.deck-library-card.selected-deck-library-card{
outline:2px solid rgba(67,143,182,.68);
outline-offset:1px;
}
.deck-preview-stack{
grid-area:preview;
position:relative;
width:82px;
height:104px;
}
.deck-preview-card{
position:absolute;
left:calc(var(--preview-i) * 8px);
top:calc(var(--preview-i) * 2px);
width:57px;
height:84px;
overflow:hidden;
border:1px solid #52778b;
border-radius:6px;
background:#0a1922;
box-shadow:3px 5px 10px rgba(0,0,0,.28);
}
.deck-preview-card img{
width:100%;
height:100%;
object-fit:cover;
}
.deck-preview-card span{
width:100%;
height:100%;
display:grid;
place-items:center;
font-size:1.4rem;
}
.deck-preview-empty{
grid-area:preview;
width:82px;
height:104px;
display:grid;
place-items:center;
text-align:center;
padding:6px;
border:1px dashed #3a5b6e;
border-radius:8px;
color:#7893a2;
font-size:.67rem;
}
.deck-library-copy{
grid-area:copy;
min-width:0;
}
.deck-library-title{
display:flex;
align-items:center;
gap:6px;
flex-wrap:wrap;
}
.deck-library-title h3{
margin:0;
min-width:0;
font-size:.96rem;
}
.deck-library-copy small{
color:#91a8b5;
}
.deck-active-badge,
.deck-ready-badge,
.deck-draft-badge{
display:inline-block;
padding:3px 6px;
border-radius:999px;
font-size:.56rem;
font-weight:1000;
letter-spacing:.05em;
}
.deck-active-badge{
background:#16432f;
border:1px solid #4c9c70;
color:#b9f0cc;
}
.deck-ready-badge{
background:#16384a;
border:1px solid #4d8eae;
color:#c9edff;
}
.deck-draft-badge{
background:#453a18;
border:1px solid #8e7937;
color:#f0db98;
}
.deck-library-actions{
grid-area:actions;
align-self:end;
display:flex;
gap:6px;
flex-wrap:wrap;
}
.deck-editor-head{
margin-bottom:16px;
}
.deck-selected-title{
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
}
.deck-selected-title h2{
margin:.15rem 0 0;
}
.deck-selected-actions{
display:flex;
gap:7px;
flex-wrap:wrap;
}
.deck-progress-wrap{
display:grid;
grid-template-columns:minmax(140px,1fr) minmax(260px,auto);
align-items:center;
gap:12px;
margin-top:13px;
}
.deck-progress-track{
height:9px;
overflow:hidden;
border-radius:999px;
background:#14252e;
border:1px solid #314e5d;
}
.deck-progress-track span{
display:block;
width:0;
height:100%;
background:linear-gradient(90deg,#2d728f,#54a6c9);
transition:width .18s ease;
}
.deck-progress-track span.ready{
background:linear-gradient(90deg,#267647,#60bd7d);
}
.deck-ready-text{
color:#9eb1bb;
font-size:.76rem;
text-align:right;
}
.deck-active-section{
margin:18px 0 25px;
padding:16px;
border:1px solid #365f74;
border-radius:16px;
background:
radial-gradient(circle at 50% 0,rgba(43,112,146,.12),transparent 32%),
rgba(5,15,22,.92);
}
.deck-message{
min-height:22px;
margin-bottom:5px;
font-size:.8rem;
}
.active-deck-strip{
display:flex;
gap:9px;
width:100%;
min-height:252px;
padding:7px 3px 11px;
overflow-x:auto;
overflow-y:hidden;
scrollbar-gutter:stable;
}
.deck-strip-card{
flex:0 0 150px;
width:150px;
display:flex;
flex-direction:column;
padding:7px;
border:1px solid #385e72;
border-radius:11px;
background:#081821;
}
.deck-strip-art{
position:relative;
width:100%;
height:176px;
overflow:hidden;
border-radius:7px;
background:#0b1b25;
}
.deck-strip-art img,
.deck-strip-art .placeholder{
width:100%;
height:100%;
object-fit:contain;
}
.deck-strip-art .placeholder{
aspect-ratio:auto;
}
.deck-strip-qty{
position:absolute;
top:6px;
right:6px;
min-width:27px;
height:27px;
display:grid;
place-items:center;
padding:0 5px;
border:1px solid #6aa1bd;
border-radius:999px;
background:rgba(4,15,22,.9);
color:#d9f1fd;
font-weight:1000;
}
.deck-strip-info{
display:grid;
gap:3px;
padding:7px 1px 5px;
}
.deck-strip-info b{
font-size:.78rem;
line-height:1.15;
}
.deck-strip-info small,
.deck-strip-stats{
color:#94aab6;
font-size:.61rem;
}
.deck-strip-actions{
display:grid;
grid-template-columns:1fr 1fr;
gap:5px;
margin-top:auto;
}
.deck-strip-actions button{
padding:6px 5px;
border:1px solid #395e73;
border-radius:7px;
background:#102733;
color:#fff;
cursor:pointer;
font-size:.64rem;
}
.deck-empty-strip{
flex:1;
min-height:190px;
display:grid;
place-items:center;
align-content:center;
gap:6px;
border:1px dashed #36596d;
border-radius:12px;
color:#91a8b4;
text-align:center;
}
.deck-owned-section{
margin-top:18px;
}
.deck-owned-section .deck-toolbar{
grid-template-columns:minmax(180px,1fr) 170px 190px auto;
margin:12px 0 15px;
}
.deck-only-unused{
display:flex;
grid-template-columns:none;
flex-direction:row;
align-items:center;
gap:7px;
white-space:nowrap;
font-size:.76rem;
}
.deck-only-unused input{
width:auto;
}
.owned-card-grid{
display:grid;
grid-template-columns:repeat(auto-fill,minmax(205px,1fr));
gap:12px;
}
.deck-owned-card{
display:flex;
flex-direction:column;
}
.deck-owned-art{
position:relative;
}
.deck-owned-art img,
.deck-owned-art .placeholder{
width:100%;
aspect-ratio:2/3;
height:auto;
object-fit:contain;
}
.deck-in-badge{
position:absolute;
left:7px;
bottom:7px;
padding:4px 7px;
border-radius:7px;
background:#17465e;
border:1px solid #55a3c8;
color:#d7f2ff;
font-size:.58rem;
font-weight:1000;
}
.deck-owned-counts{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:4px;
margin:7px 0;
}
.deck-owned-counts span{
display:grid;
gap:1px;
padding:5px;
border:1px solid #2f4f60;
border-radius:7px;
color:#91a8b5;
font-size:.58rem;
text-align:center;
}
.deck-owned-counts b{
color:#e0edf3;
font-size:.72rem;
}
.deck-owned-actions{
display:grid;
grid-template-columns:1fr 1fr;
gap:6px;
margin-top:auto;
}
.deck-modal{
position:fixed;
inset:0;
z-index:500;
display:grid;
place-items:center;
padding:18px;
background:rgba(0,0,0,.78);
backdrop-filter:blur(4px);
}
.deck-modal-card{
width:min(470px,94vw);
}
.deck-modal-card h2{
margin-top:0;
}
.deck-modal-actions{
display:flex;
justify-content:flex-end;
gap:7px;
margin-top:12px;
}
@media(max-width:850px){
.deck-progress-wrap{
grid-template-columns:1fr;
}
.deck-ready-text{
text-align:left;
}
.deck-selected-title{
align-items:flex-start;
flex-direction:column;
}
.deck-owned-section .deck-toolbar{
grid-template-columns:1fr 1fr;
}
}
@media(max-width:600px){
.deck-create-form{
grid-template-columns:1fr;
}
.deck-library{
grid-template-columns:1fr;
}
.deck-owned-section .deck-toolbar{
grid-template-columns:1fr;
}
.owned-card-grid{
grid-template-columns:repeat(2,minmax(0,1fr));
}
.deck-strip-card{
flex-basis:125px;
width:125px;
}
.deck-strip-art{
height:150px;
}
}
/* SHIELDLINE 1.3.28 — pełne karty, pusta nowa talia, działające akcje */
.deck-active-section{
overflow:visible;
}
/* Karty w talii: każda fizyczna kopia jako osobna pełna karta. */
.active-deck-strip{
display:grid!important;
grid-template-columns:repeat(auto-fill,minmax(132px,160px))!important;
justify-content:start!important;
align-items:start!important;
gap:10px!important;
width:100%!important;
min-height:240px!important;
padding:8px 2px 12px!important;
overflow:visible!important;
}
.deck-full-card{
width:100%;
min-width:0;
max-width:160px;
display:flex;
flex-direction:column;
gap:7px;
padding:7px;
box-sizing:border-box;
border:1px solid #375f74;
border-radius:12px;
background:#071720;
}
.deck-full-card-art{
position:relative;
width:100%;
aspect-ratio:2/3;
overflow:hidden;
border-radius:8px;
background:#061018;
}
.deck-full-card-art>img{
width:100%!important;
height:100%!important;
display:block!important;
object-fit:contain!important;
object-position:center!important;
border-radius:8px;
}
.deck-full-card-art>.placeholder{
width:100%;
height:100%;
aspect-ratio:auto;
border-radius:8px;
}
/* Nie pokazujemy pod kartami nazw, statystyk i opisów. */
.deck-strip-info,
.deck-strip-stats,
.deck-owned-counts,
.deck-owned-card>h3,
.deck-owned-card>.meta,
.deck-owned-card>.stats,
.deck-owned-actions{
display:none!important;
}
.deck-copy-index{
position:absolute;
top:6px;
right:6px;
width:25px;
height:25px;
display:grid;
place-items:center;
border-radius:999px;
border:1px solid #5a92ae;
background:rgba(4,15,22,.92);
color:#d9f2ff;
font-size:.62rem;
font-weight:1000;
}
.deck-card-action{
width:100%;
min-height:36px;
margin:0!important;
padding:7px 6px!important;
font-size:.69rem!important;
line-height:1.1;
white-space:normal;
}
/* Posiadane karty również tylko jako pełna grafika + Dodaj do talii. */
.owned-card-grid{
display:grid!important;
grid-template-columns:repeat(auto-fill,minmax(132px,160px))!important;
justify-content:start;
align-items:start;
gap:10px!important;
}
.deck-full-card-owned{
max-width:160px;
}
.deck-card-badges{
position:absolute;
left:6px;
right:6px;
bottom:6px;
display:flex;
justify-content:space-between;
align-items:end;
gap:4px;
pointer-events:none;
}
.deck-card-badges span{
padding:4px 6px;
border-radius:6px;
border:1px solid #50778a;
background:rgba(4,15,22,.9);
color:#dcecf4;
font-size:.54rem;
font-weight:900;
}
.deck-card-badges .in-deck{
border-color:#4f9cbe;
color:#d8f4ff;
}
/* Stare wąskie kafelki z 1.3.27 nie mogą nadpisywać nowego widoku. */
.active-deck-strip .deck-strip-card,
.owned-card-grid .collection-card.deck-owned-card{
display:none!important;
}
.deck-empty-strip{
grid-column:1/-1;
min-height:190px;
}
/* Czytelniejsze przyciski operacji na talii. */
.deck-selected-actions .btn{
min-width:126px;
}
#renameDeckBtn{
border-color:#50758a;
}
#setActiveDeckBtn{
border-color:#4d9b70;
background:#1c6942;
}
#deleteDeckBtn{
border-color:#a94757;
background:#7d202d;
}
/* Przycisk aktywacji jest wizualnie dostępny przy szkicu,
ale JS pokaże wymaganie 50/50. */
#setActiveDeckBtn:disabled{
opacity:.48;
}
@media(max-width:700px){
.active-deck-strip,
.owned-card-grid{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
.deck-full-card,
.deck-full-card-owned{
max-width:none;
}
.deck-selected-actions{
width:100%;
}
.deck-selected-actions .btn{
flex:1 1 140px;
}
}
/* SHIELDLINE 1.3.29 — sprzedaż nadmiarowych kart za punkty sezonu */
.collection-page-head{align-items:center}
.collection-season-wallet{min-width:155px;display:grid;gap:3px;padding:12px 16px;border:1px solid #8e7837;border-radius:13px;background:#201b0c;text-align:center}
.collection-season-wallet small{color:#c7ac68;font-size:.66rem;text-transform:uppercase;letter-spacing:.07em}
.collection-season-wallet b{color:#ffe08b;font-size:1.5rem}
.collection-sale-panel{margin-bottom:14px;border-color:rgba(173,137,48,.38);background:radial-gradient(circle at 90% 0,rgba(194,151,44,.1),transparent 30%),rgba(8,20,28,.94)}
.collection-sale-head{display:flex;justify-content:space-between;align-items:center;gap:18px}
.collection-sale-head h2,.collection-sale-head p{margin:.2rem 0}.collection-sale-head p{color:#9dafb9}
.collection-sell-summary{display:grid;grid-template-columns:repeat(2,minmax(0,220px));gap:9px;margin-top:12px}
.collection-sell-summary>div{display:grid;gap:2px;padding:9px 11px;border:1px solid #40596a;border-radius:9px;background:#091822}
.collection-sell-summary small{color:#8da4b1;font-size:.65rem;text-transform:uppercase}.collection-sell-summary b{color:#e8d18a}
.collection-sell-rates{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.sell-rate{padding:5px 8px;border:1px solid #3e5b6b;border-radius:999px;background:#0b1b24;font-size:.68rem;color:#adbec7}.sell-rate b{color:#e4eff4}
.collection-filters-panel{margin-bottom:14px}.collection-filters{display:grid;grid-template-columns:repeat(3,minmax(180px,1fr))}
.collection-sale-grid{align-items:start}.collection-sale-card{display:flex;flex-direction:column;min-width:0}.collection-sale-art{position:relative}
.collection-sale-art img,.collection-sale-art .placeholder{width:100%;aspect-ratio:2/3;height:auto;object-fit:contain}
.collection-owned-badge,.collection-protected-badge{position:absolute;top:7px;padding:4px 7px;border-radius:7px;font-size:.6rem;font-weight:1000}
.collection-owned-badge{right:7px;border:1px solid #5b8fa9;background:rgba(5,18,27,.9);color:#d7effa}
.collection-protected-badge{left:7px;border:1px solid #8b7438;background:rgba(41,33,10,.92);color:#f0d688}
.collection-sale-info{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin:8px 0}
.collection-sale-info span{display:grid;gap:2px;padding:6px 4px;border:1px solid #304c5c;border-radius:7px;text-align:center;color:#8fa5b2;font-size:.6rem}
.collection-sale-info b{color:#e1edf2;font-size:.72rem}.collection-sale-actions{display:grid;gap:6px;margin-top:auto}.collection-sale-actions .btn{width:100%;white-space:normal}
.collection-sale-locked-note{margin-top:auto;padding:8px;border:1px dashed #475965;border-radius:8px;color:#8da0aa;font-size:.68rem;line-height:1.35}
@media(max-width:760px){.collection-sale-head{align-items:stretch;flex-direction:column}.collection-sell-summary{grid-template-columns:1fr 1fr}.collection-filters{grid-template-columns:1fr}}
/* SHIELDLINE 1.3.30 — katalog kolekcjonerski #C001–#C100 */
.album-book-grid{
grid-template-columns:repeat(auto-fill,minmax(170px,1fr));
}
.album-book-card .album-card-art,
.album-inventory-card .album-card-art{
min-height:0;
aspect-ratio:2/3;
background:#040b10;
}
.album-book-card .album-card-art img,
.album-inventory-card .album-card-art img{
width:100%;
height:100%;
object-fit:contain;
}
.album-book-card.missing{
opacity:.72;
filter:none;
}
.album-book-card.missing .album-card-art img{
filter:grayscale(1) brightness(.34) contrast(.9);
opacity:.8;
}
.album-book-card.missing .album-card-info{
opacity:.68;
}
.album-code-chip{
position:absolute;
top:7px;
left:7px;
padding:4px 7px;
border-radius:7px;
border:1px solid rgba(226,184,78,.68);
background:rgba(4,10,14,.9);
color:#f5d77e;
font-size:.62rem;
font-weight:1000;
letter-spacing:.05em;
}
.album-missing-mark{
background:rgba(24,28,31,.94);
border-color:#737b80;
color:#d6dde0;
}
.album-awaiting-mark{
max-width:calc(100% - 16px);
}
.album-card-info small{
line-height:1.35;
}
/* Collector pack: rewers -> obrót -> zdobyta karta. */
.collector-opening-slot{
perspective:1200px;
aspect-ratio:2/3;
max-width:190px;
}
.collector-flip-card{
position:relative;
width:100%;
height:100%;
min-height:270px;
transform-style:preserve-3d;
transition:transform .62s cubic-bezier(.2,.72,.2,1);
}
.collector-opening-slot.flipped .collector-flip-card{
transform:rotateY(180deg);
}
.collector-flip-face{
position:absolute;
inset:0;
backface-visibility:hidden;
-webkit-backface-visibility:hidden;
border-radius:12px;
overflow:hidden;
}
.collector-flip-back{
display:grid;
place-items:center;
background:#03080c;
box-shadow:0 0 34px rgba(232,187,64,.28);
}
.collector-flip-back img{
width:100%;
height:100%;
object-fit:contain;
}
.collector-flip-front{
transform:rotateY(180deg);
background:#061017;
}
.collector-flip-front .collector-reveal-card{
height:100%;
}
.collector-reveal-card{
position:relative;
display:flex;
flex-direction:column;
overflow:hidden;
padding:6px;
border-color:#c69c34;
background:#080d10;
}
.collector-reveal-art{
position:relative;
flex:1;
min-height:0;
}
.collector-reveal-art img{
width:100%;
height:100%;
display:block;
object-fit:contain;
}
.collector-reveal-card h4{
margin:5px 2px 1px;
font-size:.76rem;
text-align:center;
}
.collector-reveal-card small{
display:block;
color:#e1c36b;
font-size:.53rem;
text-align:center;
}
.collector-code-badge{
position:absolute;
left:6px;
bottom:6px;
padding:3px 6px;
border-radius:6px;
border:1px solid #d1a943;
background:rgba(4,10,13,.9);
color:#ffe08a;
font-size:.56rem;
font-weight:1000;
}
@media(max-width:700px){
.album-book-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
.collector-flip-card{min-height:220px;}
}
/* SHIELDLINE 1.3.32 — pełny podgląd kart w Talii i Albumie */
.modal-open{overflow:hidden!important;}
.deck-card-preview-trigger,
.album-card-preview-trigger{
cursor:zoom-in;
transition:transform .16s ease,box-shadow .16s ease,filter .16s ease;
}
.deck-card-preview-trigger:hover,
.album-card-preview-trigger:hover{
transform:translateY(-3px) scale(1.018);
box-shadow:0 10px 28px rgba(0,0,0,.38),0 0 0 1px rgba(103,177,211,.32);
}
.card-preview-overlay{
position:fixed;
inset:0;
z-index:1200;
display:grid;
place-items:center;
padding:18px;
background:rgba(0,6,10,.88);
backdrop-filter:blur(8px);
}
.card-preview-overlay.hidden{display:none!important;}
.card-preview-dialog{
position:relative;
display:grid;
gap:12px;
width:min(94vw,610px);
max-height:94vh;
padding:14px;
border:1px solid #476f84;
border-radius:16px;
background:linear-gradient(180deg,#091923,#050d13);
box-shadow:0 28px 80px rgba(0,0,0,.62);
overflow:auto;
}
.deck-card-preview-dialog{width:min(94vw,590px);}
.album-card-preview-dialog{width:min(94vw,650px);}
.card-preview-close-x{
position:absolute;
z-index:4;
top:8px;
right:8px;
width:38px;
height:38px;
display:grid;
place-items:center;
padding:0;
border:1px solid rgba(255,255,255,.28);
border-radius:999px;
background:rgba(3,10,14,.9);
color:#fff;
font-size:1.6rem;
line-height:1;
cursor:pointer;
}
.card-preview-close-x:hover{background:#1a3442;}
.card-preview-image-wrap{
display:grid;
place-items:center;
min-height:0;
padding:4px;
}
.card-preview-image-wrap img{
display:block;
width:auto;
max-width:100%;
height:auto;
max-height:calc(94vh - 105px);
object-fit:contain;
border-radius:11px;
box-shadow:0 15px 40px rgba(0,0,0,.45);
}
.deck-card-preview-dialog .card-preview-image-wrap img{
max-height:calc(94vh - 125px);
}
.card-preview-image-wrap .placeholder{
width:min(70vw,420px);
aspect-ratio:2/3;
display:grid;
place-items:center;
font-size:4rem;
}
.card-preview-actions{
display:flex;
justify-content:center;
gap:8px;
}
.card-preview-actions .btn{
min-width:180px;
}
.album-preview-missing{
filter:grayscale(1) brightness(.34) contrast(.9);
opacity:.82;
}
@media(max-width:600px){
.card-preview-overlay{padding:8px;}
.card-preview-dialog{padding:10px;width:min(98vw,610px);max-height:98vh;}
.card-preview-image-wrap img{max-height:calc(98vh - 92px);}
.deck-card-preview-dialog .card-preview-image-wrap img{max-height:calc(98vh - 115px);}
.card-preview-close-x{top:6px;right:6px;width:34px;height:34px;}
}
/* SHIELDLINE 1.3.33 — zakup wielu paczek w jednej operacji */
.pack-qty-control{
display:grid;
gap:4px;
min-width:72px;
color:#8fa9b7;
text-transform:uppercase;
font-size:.62rem;
letter-spacing:.08em;
}
.pack-qty-control input[type=number]{
width:72px;
min-height:38px;
padding:7px 9px;
border-radius:9px;
border:1px solid rgba(110,153,178,.36);
background:rgba(4,12,18,.92);
color:#fff;
font:inherit;
font-size:.9rem;
text-transform:none;
letter-spacing:normal;
}
@media(max-width:650px){
.pack-qty-control,
.pack-qty-control input[type=number]{width:100%}
}