:root { --ink:#111; --gold:#f9d104; --blue:#1f789c; --panel:#f8f9fa; --border:#dfe5eb; }
html { min-height:100%; overflow-x:hidden; }
/* Phone layout ($isPhoneLayout, see DetectLayout middleware) reused the desktop type scale just
   narrowed down — every rem-based heading/label/stat kept its desktop size on a screen a third
   the width, reading as oversized rather than "mobile". Scaling the root font-size shrinks every
   rem value (almost all sizing in this file) proportionally in one place instead of hunting down
   each component. Button/control dimensions are px-based (immune to this) and get their own
   reduction further down (search "Phone layout — compact controls"). */
html.is-phone { font-size:87.5%; }
body { min-height:100vh; background:#160d08 url('../uploads/backgrounds/game-body-bg.png') center/cover fixed no-repeat; font-family:"Trebuchet MS",Arial,sans-serif; color:#242a30; }
.game-navbar {
min-height:65px;
padding:0;
/* Bootstrap's .fixed-top sizes this via left:0;right:0, which some browsers resolve against the
   full layout viewport (scrollbar included) rather than the visibly scrollable width — the box
   ends up a few pixels wider than the screen, so the right-edge corner art (background-position
   100% 0%) renders partly off-screen instead of flush with the real edge. Pinning width:100%
   ties it to the same reference normal in-flow content uses. */
width:100%;
background-color:#080706;
background-image:url('../uploads/ui-prototypes/navbar/navbar_start.png'),url('../uploads/ui-prototypes/navbar/navbar_end.png'),url('../uploads/ui-prototypes/navbar/navbar_center.png');
background-position:left top,right top,28px top;
background-repeat:no-repeat,no-repeat,no-repeat;
background-size:28px 65px,28px 65px,calc(100% - 56px) 65px;
box-shadow:0 5px 20px rgba(0,0,0,.5);
}
.game-navbar>.container{position:relative;min-height:65px}
.navbar-brand { font-weight:800; letter-spacing:.04em; text-shadow:0 2px 3px rgba(0,0,0,.9); }
.navbar-dark .navbar-nav .active>.nav-link,.navbar-dark .navbar-nav .nav-link:hover { color:var(--gold); }
.nav-menu-icons{display:flex;flex-direction:row;align-items:center;gap:2px}
.nav-menu-item{position:relative}
.nav-menu-link{display:flex!important;align-items:center;justify-content:center;padding:8px 11px!important;border-radius:8px;transition:background .12s}
.nav-menu-link .web-icon{width:30px;height:30px;object-fit:contain;vertical-align:middle}
.nav-menu-link:hover,.nav-menu-link:focus{background:rgba(255,255,255,.1)}
.nav-menu-item.active .nav-menu-link{background:rgba(249,209,4,.16)}
.nav-menu-item.quest-locked .nav-menu-link{opacity:.4;filter:grayscale(.6);cursor:not-allowed}
.nav-menu-item.quest-locked .nav-menu-link:hover,.nav-menu-item.quest-locked .nav-menu-link:focus{background:transparent}
.nav-menu-tooltip{position:absolute;left:50%;top:100%;z-index:20;margin-top:6px;padding:4px 10px;color:#fff;background:#111;border:1px solid rgba(249,209,4,.5);border-radius:6px;font-size:.74rem;font-weight:700;white-space:nowrap;text-transform:none;letter-spacing:0;opacity:0;pointer-events:none;transform:translate(-50%,4px);transition:opacity .12s,transform .12s;box-shadow:0 6px 16px rgba(0,0,0,.4)}
.nav-menu-link:hover .nav-menu-tooltip,.nav-menu-link:focus .nav-menu-tooltip{opacity:1;transform:translate(-50%,0)}
.nav-tooltip-item{position:relative}
.nav-tooltip-item:hover .nav-menu-tooltip,.nav-tooltip-item:focus-within .nav-menu-tooltip{opacity:1;transform:translate(-50%,0)}
.nav-currency.nav-tooltip-item .nav-menu-tooltip,.nav-inbox.nav-tooltip-item .nav-menu-tooltip{top:calc(100% + 6px)}
@media(max-width:767px){
.game-navbar>.container{padding-right:28px;padding-left:28px}
.nav-menu-icons{flex-direction:column;align-items:stretch;gap:0}
.nav-menu-link{justify-content:flex-start;gap:10px;padding:9px 6px!important;border-radius:0}
.nav-menu-link .nav-menu-tooltip{position:static;margin:0;padding:0;color:inherit;background:none;border:0;font-size:.95rem;font-weight:400;opacity:1;transform:none;box-shadow:none;pointer-events:auto}
.nav-currency.nav-tooltip-item,.nav-inbox.nav-tooltip-item,form.nav-tooltip-item{position:relative}
.nav-currency.nav-tooltip-item .nav-menu-tooltip,.nav-inbox.nav-tooltip-item .nav-menu-tooltip,form.nav-tooltip-item .nav-menu-tooltip{display:none}
.game-navbar .navbar-collapse.show,.game-navbar .navbar-collapse.collapsing{margin:0 8px 8px;padding:8px 12px 12px;background:rgba(8,7,6,.97);border:1px solid #65513a;border-top:0;box-shadow:0 10px 20px rgba(0,0,0,.42)}
}
.game-shell { padding-top:78px; }
.game-panel { min-height:120px; background:rgba(248,249,250,.96); border:8px solid rgba(222,226,230,.95); box-shadow:0 12px 35px rgba(20,30,40,.22); }
.game-loader{position:fixed;z-index:9999;left:18px;bottom:18px;width:54px;height:54px;display:grid;place-items:center;padding:7px;border:1px solid #333;border-radius:8px;background:rgba(255,255,255,.94);box-shadow:0 5px 18px rgba(0,0,0,.28)}.game-loader[hidden]{display:none}.game-loader img{width:40px;height:40px;object-fit:contain;filter:none}
.game-panel h2 { margin:0; padding:8px 15px; color:var(--gold); background:#050505; font-size:1.55rem; }
.game-panel h3 { color:#aa8800; }
.content { padding:18px; }
.game-button { background:#111; color:var(--gold); border:1px solid #111; font-weight:700; }
.game-button:hover { color:#111; background:var(--gold); }
.hero-copy { min-height:150px; font-size:1.1rem; }
.feature-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.feature-grid article { display:grid; grid-template-columns:46px 1fr; padding:15px; background:#fff; border:1px solid var(--border); }
.feature-grid article>span { grid-row:1/3; font-size:2rem; color:#a98700; }
.feature-grid small { color:#667; }
.sidebar-name-row{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.sidebar-level{color:var(--gold);font-size:.95rem;font-weight:700;white-space:nowrap}
.stat-bar { position:relative; height:22px; margin-bottom:8px; background:#e4e7ea; border:1px solid #222; overflow:hidden; }
.stat-bar.nav-tooltip-item { overflow:visible; }
.stat-bar-clip { position:absolute; inset:0; overflow:hidden; }
.stat-bar span:not(.nav-menu-tooltip) { display:block; height:100%; background:var(--gold); }
.stat-bar--energy span:not(.nav-menu-tooltip){background:linear-gradient(90deg,#173e63,#2f78a8 62%,#4b9bc5);box-shadow:inset 0 1px rgba(255,255,255,.18);transition:width .25s ease}
.stat-bar.stat-bar--energy b{color:#eaf5fb;text-shadow:0 1px 2px #000}
.stat-bar--energy.is-low span:not(.nav-menu-tooltip){background:linear-gradient(90deg,#a02c20,#d47722 72%,#e29b34)}
.stat-bar--energy.is-critical span:not(.nav-menu-tooltip){background:linear-gradient(90deg,#751b1b,#b92c20 68%,#d45d24);animation:energy-critical-pulse 1.5s ease-in-out infinite alternate}
@keyframes energy-critical-pulse{to{filter:brightness(1.2);box-shadow:inset 0 1px rgba(255,255,255,.2),0 0 7px rgba(185,44,32,.48)}}
.stat-bar b { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:.72rem; font-weight:700; color:#111; text-shadow:0 1px 1px rgba(255,255,255,.5); }
.nav-currency { display:inline-flex; flex:0 0 auto; align-items:center; gap:5px; margin-right:14px; color:#fff; font-weight:700; font-size:.9rem; white-space:nowrap; }
.nav-currency .web-icon { width:18px; height:18px; }
.active-effects { display:flex; flex-wrap:wrap; gap:6px; padding:9px 14px; border-top:1px solid var(--border); }.effect-icon { position:relative; width:34px; height:34px; padding:3px; background:#171717; border:2px solid #b99400; border-radius:4px; cursor:help; }.effect-icon>img { width:100%; height:100%; object-fit:contain; }.effect-popover { display:none; position:absolute; z-index:40; right:-6px; bottom:calc(100% + 8px); width:190px; padding:9px; color:#eee; background:#101010; border:1px solid var(--gold); box-shadow:0 6px 18px rgba(0,0,0,.4); text-align:left; }.effect-popover b,.effect-popover em,.effect-popover time { display:block; }.effect-popover em { color:var(--gold); font-style:normal; }.effect-popover time { color:#adb5bd; font-variant-numeric:tabular-nums; }.effect-icon:hover .effect-popover,.effect-icon:focus .effect-popover,.effect-icon:focus-within .effect-popover { display:block; }
.avatar-options { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }.avatar-options label{position:relative;text-align:center}.avatar-options input { position:absolute; opacity:0; }.avatar-options img { width:100%; height:180px; object-fit:contain; background:#151515; border:3px solid transparent; cursor:pointer; }.avatar-options span{display:block;color:#ddd;font-size:.8rem}.avatar-options input:checked+img { border-color:var(--gold); box-shadow:0 0 0 2px #111; }
.character-inventory-board { display:grid; grid-template-columns:repeat(9,minmax(0,1fr)); grid-auto-flow:row dense; gap:1px; align-items:stretch; padding:0; background:#000; }.character-inventory-board>.equipment-column { grid-column:1/span 4; grid-row:1/span 4; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); grid-template-rows:repeat(4,minmax(0,1fr)); grid-template-areas:"back head neck ." "weapon torso off_hand ." "hands belt ring ." "special1 feet special2 ."; gap:1px; aspect-ratio:1/1; }.equipment-slot,.equipment-placeholder { position:relative; min-width:0; min-height:0; aspect-ratio:1/1; padding:4px; display:flex; flex-direction:column; align-items:center; justify-content:center; overflow:visible; border:1px solid transparent; }
.equipment-slot::before,.equipment-placeholder::before { content:''; position:absolute; inset:0; z-index:0; background-image:var(--slot-bg); background-position:center; background-repeat:no-repeat; background-size:cover; pointer-events:none; }
.equipment-slot.is-occupied::before { background-image:var(--inv-empty-bg); }
.equipment-slot small,.equipment-placeholder small,.equipment-slot>span { position:relative; z-index:1; color:#d8d3c4; text-shadow:0 1px 2px rgba(0,0,0,.9); }.equipment-slot--head{grid-area:head}.equipment-slot--neck{grid-area:neck}.equipment-slot--torso{grid-area:torso}.equipment-slot--weapon{grid-area:weapon}.equipment-slot--off_hand{grid-area:off_hand}.equipment-slot--hands{grid-area:hands}.equipment-slot--belt{grid-area:belt}.equipment-slot--feet{grid-area:feet}.equipment-slot--ring{grid-area:ring}.equipment-slot--back{grid-area:back}.equipment-placeholder--special1{grid-area:special1}.equipment-placeholder--special2{grid-area:special2}.equipment-placeholder{border-style:dashed;border-color:rgba(34,34,34,.3);cursor:default}.equipment-slot small,.equipment-placeholder small { display:block; max-width:100%; overflow:hidden; color:#68717b; font-size:.58rem; line-height:1.1; text-overflow:ellipsis; white-space:nowrap; }.equipment-placeholder small{color:rgba(104,113,123,.55)}.equipment-slot span { color:#aaa; font-size:.64rem; line-height:1.1; }.character-inventory-board>.inventory-item{width:100%;min-height:0;aspect-ratio:1/1;border-color:transparent;box-shadow:none}.character-inventory-board>.inventory-item>img{width:100%;height:100%}.inventory-locked{pointer-events:none;border-color:transparent!important;box-shadow:none!important;background-image:var(--inv-lock-bg)!important;background-position:center;background-size:cover}.inventory-locked .inventory-slot-number{position:relative;z-index:1;color:rgba(255,255,255,.55);font-size:.56rem;text-shadow:0 1px 2px rgba(0,0,0,.9)}
.inventory-column .inventory-heading{justify-content:flex-end;padding:0 0 8px;background:none}.inventory-grid--narrow{grid-template-columns:repeat(4,minmax(50px,1fr))!important}.inventory-grid--narrow .inventory-item{aspect-ratio:1/1;min-height:0}.inventory-grid--narrow .inventory-item>img{width:100%;height:100%}
.inventory-grid { display:grid; grid-template-columns:repeat(8,minmax(58px,1fr)); gap:1px; background:#000; padding:0; }.inventory-item { min-height:70px; padding:5px; background-image:var(--inv-empty-bg); background-position:center; background-size:cover; border:1px solid transparent; text-align:center; cursor:grab; }.inventory-item>img,.equipped-item>img { width:46px; height:46px; object-fit:contain; }.inventory-item>small { display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }.equipped-item { position:relative; z-index:1; width:100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; cursor:grab; }.item-presenter { position:relative; }.item-presenter:focus,.item-presenter:focus-within { z-index:1055; }.item-presenter:hover { z-index:1070; }.item-popover { display:none; position:absolute; z-index:1060; bottom:calc(100% + 6px); left:50%; width:max-content; min-width:150px; max-width:250px; padding:12px; transform:translateX(-50%); color:#222; background:#fff; border:2px solid #111; box-shadow:0 8px 24px rgba(0,0,0,.3); text-align:left; }.equipment-slot>.item-popover { top:calc(100% + 6px); bottom:auto; }.item-popover header { padding-bottom:7px; border-bottom:1px solid #ddd; }.item-popover header small { display:block; color:#68717b; }.item-popover p { margin:8px 0; }.item-detail-stats { margin:6px 0; }.item-detail-stats div { display:flex; justify-content:space-between; border-bottom:1px dotted #ccc; }.item-detail-stats dd { margin:0; font-weight:700; }.item-presenter:hover>.item-popover,.item-presenter:focus>.item-popover,.item-presenter:focus-within>.item-popover { display:block; }.item-actions { display:flex; gap:5px; }.item-action { padding:1px 5px; color:#777; background:none; border:0; text-decoration:underline; cursor:pointer; }.is-dragging { opacity:.35; }.equipment-slot.drag-over,.inventory-grid.drag-over { outline:4px solid var(--gold); outline-offset:-4px; background:rgba(249,209,4,.18); }
.slot-cell{position:relative;box-sizing:border-box;background-image:var(--inv-empty-bg);background-position:center;background-size:cover;border:1px solid transparent;text-align:center;-webkit-user-select:none;user-select:none}.slot-cell[draggable="true"]{cursor:grab}.slot-cell.rarity-rare{background-image:var(--inv-empty-rare-bg)}.slot-cell.rarity-epic{background-image:var(--inv-empty-epic-bg)}.slot-cell.damaged-item{background-image:var(--inv-empty-damaged-bg)!important}.slot-cell.inventory-locked{pointer-events:none;border-color:transparent!important;box-shadow:none!important;background-image:var(--inv-lock-bg)!important;background-position:center;background-size:cover}.slot-cell .inventory-slot-number{position:relative;z-index:1;color:rgba(255,255,255,.55);font-size:.56rem;text-shadow:0 1px 2px rgba(0,0,0,.9)}
.upgrade-action { color:#9b7500; }
.repair-action { color:#b52222; font-weight:700; }.damage-badge { display:inline-block; margin:3px; padding:2px; background:none; border:none; cursor:pointer; }
.bot-equipment-row{display:flex;flex-wrap:wrap;gap:4px}
.bot-equipment-slot{width:52px;height:52px}
.bot-equipment-slot img{width:100%;height:100%;object-fit:contain;padding:6px;box-sizing:border-box}
.bot-equipment-slot .damage-badge{position:absolute;top:0;right:0;z-index:2;width:20px;height:20px;border-radius:50%;color:#fff;background:#b52222;line-height:20px;text-align:center}
.item-damaged-note{display:block;color:#b52222;font-weight:700}
.item-rarity-pill{display:block;font-weight:700}
.item-rarity-pill--rare{color:#2876c8}
.item-rarity-pill--epic{color:#8a42c2}
.item-popover-debug{display:block;margin-top:6px;padding-top:5px;border-top:1px dashed #ccc;color:#9a9a9a;font-size:.65rem;font-style:italic}
.shop-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }.shop-item { display:flex; flex-direction:column; padding:13px; text-align:center; }.shop-item>img { width:88px; height:88px; margin:auto auto 10px; object-fit:contain; }.shop-item h3 { font-size:1.1rem; margin:7px 0; }.shop-item p { flex:1; font-size:.9rem; color:#59616a; }.shop-item small { margin-bottom:10px; }.shop-item button img { width:20px; height:20px; object-fit:contain; }
.shop-lock-reason{display:block;min-height:1.2em;margin:5px 0 0!important;color:#8a5a00;font-size:.76rem}
body.modal-open .item-popover{display:none!important}
body.modal-open .modal.show .item-presenter:hover>.item-popover,body.modal-open .modal.show .item-presenter:focus>.item-popover,body.modal-open .modal.show .item-presenter:focus-within>.item-popover{display:block!important}
body.item-dnd-active .item-popover{display:none!important}
.shop-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:15px; }.shop-heading p { margin:0; }.shop-heading-text { padding-left:8px; }
.merchant-inventory { display:grid; gap:7px; }.merchant-owned { display:grid; grid-template-columns:58px minmax(0,1fr) auto; align-items:center; gap:10px; min-height:68px; padding:7px 10px; background:#fff; border:1px solid var(--border); }.merchant-owned>img { width:54px; height:54px; object-fit:contain; }.merchant-owned strong,.merchant-owned small { display:block; }.merchant-owned small { color:#68717b; }.merchant-owned form { margin:0; }.merchant-owned .item-popover { left:auto; right:0; transform:none; }
.item-popover.cursor-positioned { position:fixed; z-index:1060; right:auto; bottom:auto; transform:none; }
.training-group-heading { margin:18px 0 8px; color:#9b7900; font-size:.95rem; }.training-group-heading:first-of-type { margin-top:0; }.training-group-heading small { font-weight:400; color:#72808e; font-size:.8rem; }
.training-list { display:grid; gap:8px; margin-bottom:8px; }.training-row { padding:12px 16px; background:#fff; border-left:5px solid var(--blue); }.training-row h3 { margin:0; }.training-row-head { display:flex; align-items:center; justify-content:space-between; gap:15px; }.training-row-info { flex:1; min-width:0; }.training-progress { height:6px; background:#eee; margin-top:6px; overflow:hidden; }.training-progress span { display:block; height:100%; background:#7459bb; }.training-max-badge { padding:6px 14px; background:#eee8ff; color:#6245a0; font-weight:700; font-size:.82rem; white-space:nowrap; }
.training-row-foot { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:8px; width:100%; }.training-description { flex:1; height:22px!important; margin:0; color:#68717b; font-size:.82rem; font-style:italic; }.training-price-preview { margin-left:auto; color:var(--gold); font-weight:700; font-size:.85rem; white-space:nowrap; text-align:right; }
.training-actions { display:flex; flex-wrap:wrap; gap:5px; }.training-actions form { margin:0; }.training-actions button { min-width:50px; padding:5px 8px; }
/* .training-amount-price je skryta na desktopu — tam se cena porad ukazuje pres stavajici
   hover .training-price-preview (pointerover/pointerout, viz game-navigation.js). Na mobilu
   (media query nize) je to naopak, protoze tam hover neexistuje. */
.training-amount-btn{display:flex;flex-direction:column;align-items:center;gap:1px;line-height:1.15}
.training-amount-price{display:none}
@media(max-width:575px){.training-row-head{flex-wrap:wrap}.training-actions{width:100%}.training-actions form{flex:1 1 auto}.training-actions button{width:100%}}
.training-list .training-row:has(.training-max-badge) { border-left-color:#7459bb; }
.potion-inventory { display:grid; gap:7px; }.potion-inventory article { display:grid; grid-template-columns:55px 1fr auto auto; align-items:center; gap:8px; padding:8px; background:#fff; border:1px solid var(--border); }.potion-inventory img { width:50px; height:50px; object-fit:contain; }.potion-inventory small { display:block; color:#68717b; }
.quest-list { display:grid; gap:10px; }.quest-card { display:flex; justify-content:space-between; align-items:center; gap:15px; padding:15px; background:#fff; border-left:5px solid var(--gold); box-shadow:0 2px 8px rgba(0,0,0,.08); }.quest-card h3 { margin:0 0 5px; }.quest-card p { margin-bottom:4px; }.quest-card.locked { opacity:.55; filter:grayscale(1); }
.enemy-list { display:grid; gap:10px; }.enemy-card { display:grid; grid-template-columns:92px 1fr auto; align-items:center; gap:15px; padding:12px; background:#fff; border:1px solid var(--border); }.enemy-card>img { width:88px; height:88px; object-fit:contain; }.enemy-card h3 { margin:0; }.enemy-card.locked { opacity:.5; filter:grayscale(1); }
.enemy-encounter{display:flex;flex-direction:column;align-items:center;gap:6px;padding:28px 20px;background:#fff;border:1px solid var(--border);text-align:center}.enemy-encounter>img{width:150px;height:150px;object-fit:contain;margin-bottom:6px}.enemy-encounter h3{margin:0;font-size:1.2rem}.enemy-encounter>p{margin:0;color:#454f58}.enemy-encounter>small{margin-bottom:10px;color:#72808e}.enemy-encounter form{margin-top:6px}
.arena-ladder-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:18px 0 9px;padding:10px 14px;background:#fff;border:1px solid var(--border)}.arena-ladder-head>div{display:flex;align-items:center;gap:8px}.arena-ladder-head small{color:#68717b}.arena-ladder-head strong{font-size:1.35rem}.arena-ladder-head p{margin:0}.arena-pinned-target{margin:0 0 14px;padding:9px;border:1px dashed #b74e32}.arena-pinned-target>b{display:block;margin:0 0 7px;color:#b74e32}.arena-list{display:grid;gap:8px}.arena-player{display:grid;grid-template-columns:48px 64px minmax(0,1fr) minmax(190px,auto);align-items:center;gap:12px;padding:9px 12px;background:#fff;border-left:4px solid #222}.arena-rank{font-size:1.05rem;text-align:center}.arena-player>img{width:58px;height:70px;object-fit:cover;object-position:top}.arena-player h3{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin:0}.arena-player-info>small{display:flex;flex-wrap:wrap;gap:0}.arena-player-info>small span:not(:last-child)::after{content:" · "}.arena-player-action{display:grid;justify-items:end;gap:3px;min-width:190px}.arena-player-action form{margin:0}.arena-quote{display:flex;align-items:center;justify-content:flex-end;gap:10px;font-weight:700}.arena-quote span{display:inline-flex;align-items:center;gap:3px;white-space:nowrap}.arena-quote .web-icon{width:18px;height:18px;border:0;box-shadow:none;object-fit:contain}.arena-quote-note,.arena-unavailable{display:block;color:#68717b}.arena-unavailable{color:#a15c2d}.arena-difficulty{display:block;font-weight:700;letter-spacing:.02em}.arena-difficulty--weaker{color:#1d643a}.arena-difficulty--balanced{color:#68717b}.arena-difficulty--dangerous{color:#a15c2d}.arena-difficulty--overwhelming{color:#b74e32}.arena-self-badge{padding:2px 5px;color:#1d643a;border:1px solid #3b8b59;font-size:.65em;font-style:normal;letter-spacing:.08em}.arena-own-position{color:#a17d00}.arena-player--self{border-left-color:#c9a400}.arena-player--questing{opacity:.72}.arena-pagination{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;margin-top:14px;text-align:center}.arena-pagination a,.arena-pagination span{padding:7px 10px}.arena-pagination a:last-child,.arena-pagination span:last-child{text-align:right}.arena-pagination a:first-child,.arena-pagination span:first-child{text-align:left}.arena-pagination span{color:#8a8a8a}.arena-history{display:grid;gap:5px}.arena-history a{padding:7px 10px;color:#333;background:#fff;border-bottom:1px solid var(--border)}.arena-history b{float:right;color:#a17d00}
@media(max-width:700px){.arena-player{grid-template-columns:42px 56px 1fr;grid-template-areas:"rank img info" "rank img action";row-gap:6px}.arena-rank{grid-area:rank}.arena-player>img{grid-area:img;width:52px;height:64px}.arena-player-info{grid-area:info}.arena-player-action{grid-area:action;justify-items:start;min-width:0;width:100%}.arena-quote{justify-content:flex-start}.arena-player .game-button{width:100px}.arena-ladder-head{align-items:flex-start;flex-direction:column}.arena-pagination{grid-template-columns:1fr 1fr}.arena-pagination strong{grid-column:1/-1;grid-row:1}}
.guild-summary { display:grid; grid-template-columns:repeat(3,1fr); text-align:center; }.guild-summary strong { display:block; font-size:1.5rem; color:#a17d00; }.guild-summary small { color:#68717b; }.guild-members { display:grid; gap:6px; }.guild-members>div,.guild-members>a,.guild-invite { display:flex; justify-content:space-between; padding:8px; background:#fff; border-bottom:1px solid var(--border); }.guild-members>a{color:inherit;text-decoration:none}.guild-inline { display:flex; gap:7px; margin-top:8px; }.guild-messages { max-height:330px; overflow:auto; background:#fff; border:1px solid var(--border); }.guild-messages p { margin:0; padding:7px 10px; border-bottom:1px solid #eee; }.guild-messages small { color:#999; }
.guild-bonuses { display:grid; gap:7px; }.guild-bonuses article { display:flex; align-items:center; justify-content:space-between; padding:10px; background:#fff; border-left:4px solid var(--gold); }.guild-bonuses small { display:block; color:#68717b; }
.guild-wars { display:grid; gap:7px; }.guild-war-quest-pref { display:flex; align-items:center; gap:8px; margin:8px 0; }
.guild-section-toolbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:8px}
.guild-action-card{padding:12px;margin-bottom:10px;background:#fff;border:1px solid var(--border);border-left:4px solid var(--gold)}.guild-action-card p{margin:0 0 8px}
.guild-battle-list{display:grid;gap:8px}
.guild-battle-card{background:#fff;border:1px solid var(--border);border-left:4px solid #9aa1a8;overflow:hidden}
.guild-battle-card--won{border-left-color:#2f8f4e}.guild-battle-card--lost{border-left-color:#b52222}.guild-battle-card--scheduled{border-left-color:var(--gold)}.guild-battle-card--walkover{border-left-color:#9aa1a8}
.guild-battle-card>header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;background:rgba(0,0,0,.03)}
.guild-battle-matchup b{color:#9b7500}
.guild-battle-card-body{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:8px 10px}
.guild-status-pill{display:inline-block;padding:2px 9px;border-radius:10px;color:#fff;background:#9aa1a8;font-size:.72rem;font-weight:700;white-space:nowrap}
.guild-status-pill--won{background:#2f8f4e}.guild-status-pill--lost{background:#b52222}.guild-status-pill--scheduled{background:#a17d00}.guild-status-pill--walkover{background:#9aa1a8}
.guild-raid-active header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.guild-raid-roster{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.guild-raid-chip{display:inline-block;padding:2px 9px;border-radius:10px;background:#eef1f4;font-size:.78rem}
.admin-stats { display:grid; grid-template-columns:repeat(4,1fr); text-align:center; }.admin-stats strong { display:block; font-size:1.6rem; color:#a17d00; }.admin-stats small { text-transform:uppercase; }.admin-list { display:grid; gap:8px; }.admin-list form { display:flex; align-items:end; gap:7px; padding:9px; background:#fff; border:1px solid var(--border); }.admin-list header { flex:1; min-width:150px; }.admin-list header span,.admin-list header label { display:block; color:#68717b; font-size:.8rem; }.admin-list label { margin:0; font-size:.72rem; }.admin-list input.form-control { width:90px; height:32px; padding:3px 6px; }.admin-audit p { margin:0; padding:6px; border-bottom:1px solid var(--border); }.admin-audit small { float:right; color:#888; }
.admin-quickbar { position:fixed; z-index:1040; right:0; bottom:0; left:0; width:100%; min-height:46px; gap:8px; padding:5px 14px; background:#111; box-shadow:0 -3px 16px rgba(0,0,0,.4); }.admin-quickbar .navbar-brand { margin-right:10px; font-size:1rem; }.admin-quick-log { position:fixed; z-index:1039; right:12px; bottom:46px; width:min(520px,calc(100% - 24px)); max-height:280px; overflow:auto; padding:10px; color:#eee; background:rgba(12,12,12,.96); border:1px solid #555; box-shadow:0 -8px 28px rgba(0,0,0,.4); }.admin-quick-log header { display:flex; justify-content:space-between; border-bottom:1px solid #555; }.admin-quick-log .close { color:#fff; text-shadow:none; }.admin-quick-log p { display:flex; justify-content:space-between; margin:0; padding:6px; border-bottom:1px solid #333; }.admin-quick-log small { color:#aaa; }.admin-footer-space { padding-bottom:58px; }
.admin-quickbar-admin-nav{display:inline-flex;align-items:center;gap:0}
.admin-quickbar-admin-nav>.btn{border-top-right-radius:0;border-bottom-right-radius:0}
.admin-quickbar-admin-nav>.btn-group>.btn{border-top-left-radius:0;border-bottom-left-radius:0;border-left:0}
.admin-quickbar-admin-menu{max-height:62vh;overflow:auto}
/* Ingame admin lišta zatím nemá mobilní verzi (hodně husté ovládací prvky, fixed-bottom bar by se
   navíc bil s .mobile-tabbar) — pro admina na telefonu radši úplně schovat, než ji nechat rozbitou. */
html.is-phone .admin-quickbar,html.is-phone .admin-quick-log{display:none}
html.is-phone .admin-footer-space{padding-bottom:0}
.modal-admin-ingame .modal-dialog{width:100vw;max-width:100vw;height:100vh;margin:0;padding:0}
.modal-admin-ingame .modal-content{height:100%;border-radius:0;border:0}
.modal-admin-ingame .modal-header{padding:8px 12px}
.modal-admin-ingame .modal-body{height:calc(100% - 52px)}
.modal-admin-ingame iframe{display:block;width:100%;height:100%;border:0;background:#0c0c0c}
.dungeon-test-preview{display:flex;gap:14px}.dungeon-test-preview-item{display:flex;flex-direction:column;align-items:center;gap:4px;flex:1;padding:8px;background:rgba(0,0,0,.35);border:1px solid #3a3226;border-radius:4px}.dungeon-test-preview-item img{width:56px;height:56px;object-fit:contain}.dungeon-test-preview-item span{font-size:.72rem;text-align:center;color:var(--game-cream,#ded8ca)}
.guild-war-test-sides{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.guild-war-test-side h6{margin-bottom:6px;color:var(--gold)}
.guild-war-test-members{max-height:180px;overflow-y:auto;padding:6px;background:rgba(0,0,0,.35);border:1px solid #3a3226;border-radius:4px}
.guild-war-test-member{display:flex;align-items:center;gap:6px;margin:0;padding:3px 2px;font-weight:400}
.guild-war-test-bonus{display:flex;gap:6px}
.guild-war-test-bonus input{max-width:70px}
@media(max-width:640px){.guild-war-test-sides{grid-template-columns:1fr}}
.combat-wrap { overflow:hidden; }.combat-stage { display:grid; grid-template-columns:1fr 58px 1fr; align-items:center; gap:10px; min-height:320px; background:linear-gradient(rgba(255,255,255,.76),rgba(255,255,255,.9)),url('../legacy/img/battle.png') center/cover; border:1px solid #aab2bb; }.fighter { position:relative; min-width:0; padding:12px; text-align:center; transition:filter .2s; }.fighter h3 { min-height:48px; }.fighter img { width:min(190px,80%); height:210px; object-fit:contain; filter:drop-shadow(0 10px 8px rgba(0,0,0,.35)); }.fighter-defender>img:not(.combat-weapon):not(.combat-shield) { transform:scaleX(-1); }.versus { color:#111; font-size:2rem; font-weight:900; text-align:center; }.health { position:relative; height:23px; overflow:hidden; background:#3d1010; border:2px solid #111; }.health span { display:block; height:100%; background:linear-gradient(#5de65d,#159a28); transition:width .6s ease; }.health b { position:absolute; inset:0; color:#fff; font-size:.78rem; line-height:19px; text-shadow:0 1px 2px #000; }.damage-number { position:absolute; z-index:3; top:40%; left:50%; color:#e00000; font-size:2rem; opacity:0; text-shadow:0 1px #fff; }.damage-number.show { animation:damage-float .8s ease-out; }.fighter.hit>img:not(.combat-weapon):not(.combat-shield):not(.combat-projectile) { animation:fighter-hit .35s ease; }.round-title { padding:8px; color:var(--gold); background:#111; text-align:center; font-size:1.2rem; font-weight:700; }.combat-log { max-height:185px; overflow:auto; padding:8px 15px; background:#f2f4f5; }.combat-log p { margin:0; padding:5px; border-bottom:1px solid #ddd; }.combat-log em { color:#b68d00; }.combat-result { padding:20px; text-align:center; border-top:4px solid var(--gold); }.combat-result h3 { font-size:2rem; }
.fighter img.combat-weapon { --weapon-scale-x:1;--weapon-flip-y:1;--weapon-duration:1050ms; --strike-x:0px; --strike-y:0px; --strike-rotation:0deg; position:absolute; z-index:5; top:48%; width:58px; height:58px; opacity:0; pointer-events:none; transform:scaleX(var(--weapon-scale-x)) scaleY(var(--weapon-flip-y)); filter:drop-shadow(0 3px 3px rgba(0,0,0,.65)); }.weapon-attacker { --weapon-scale-x:-1; right:10%; }.weapon-defender { --weapon-scale-x:1; left:10%; }.combat-weapon.strike { animation:weapon-strike var(--weapon-duration) ease-in-out; }.combat-weapon[data-animation-style="projectile"].strike,.combat-weapon[data-animation-style="magic"].strike{animation-timing-function:linear}
.fighter img.combat-projectile{--projectile-x:0px;--projectile-y:0px;--projectile-rotation:0deg;position:absolute;z-index:6;top:48%;width:26px;height:26px;opacity:0;pointer-events:none;filter:drop-shadow(0 3px 3px rgba(0,0,0,.65))}
.combat-projectile.fly{animation:projectile-flight var(--weapon-duration,1050ms) linear}
@keyframes projectile-flight{0%{opacity:1;transform:translate(0,0) rotate(var(--projectile-rotation))}90%{opacity:1;transform:translate(var(--projectile-x),var(--projectile-y)) rotate(var(--projectile-rotation))}100%{opacity:0;transform:translate(var(--projectile-x),var(--projectile-y)) rotate(var(--projectile-rotation))}}
.fighter img.combat-shield{--shield-scale-x:1;position:absolute;z-index:5;top:calc(60% - 35px);width:46px;height:46px;opacity:0;pointer-events:none;transform:scaleX(var(--shield-scale-x));filter:drop-shadow(0 3px 3px rgba(0,0,0,.65))}.shield-attacker{--shield-scale-x:-1;right:22%}.shield-defender{--shield-scale-x:1;left:22%}
.combat-shield.block{animation:shield-block .5s ease-out}
@keyframes shield-block{0%{opacity:0;transform:scaleX(var(--shield-scale-x)) scale(.4)}30%{opacity:1;transform:scaleX(var(--shield-scale-x)) scale(1.15)}70%{opacity:1;transform:scaleX(var(--shield-scale-x)) scale(1)}100%{opacity:0;transform:scaleX(var(--shield-scale-x)) scale(1)}}
@keyframes fighter-hit{25%{transform:translateX(-12px);filter:brightness(1.8) sepia(1)}70%{transform:translateX(6px)}}@keyframes damage-float{0%{opacity:0;transform:translate(-50%,15px) scale(.7)}25%{opacity:1}100%{opacity:0;transform:translate(-50%,-55px) scale(1.2)}}
@keyframes weapon-strike{0%,100%{opacity:0;transform:translate(0,0) scaleX(var(--weapon-scale-x)) scaleY(var(--weapon-flip-y)) rotate(0)}35%,60%{opacity:1;transform:translate(var(--strike-x),var(--strike-y)) scaleX(var(--weapon-scale-x)) scaleY(var(--weapon-flip-y)) rotate(var(--strike-rotation))}}
.fighter-visual{position:relative;width:min(190px,80%);height:210px;margin:0 auto;overflow:visible}.fighter-visual>.combat-character{--fighter-facing:1;width:100%;height:100%;object-fit:contain;transform:scaleX(var(--fighter-facing));filter:drop-shadow(0 10px 8px rgba(0,0,0,.35))}.fighter-visual>.combat-pet{--pet-facing:1;position:absolute;z-index:3;bottom:1px;left:50%;width:60px;height:60px;object-fit:contain;pointer-events:none;transform:translateX(-50%) scaleX(var(--pet-facing));transform-origin:center bottom;filter:drop-shadow(0 5px 5px #000b);transition:opacity .18s}.fighter-visual>.pet-attacker{margin-left:58px}.fighter-visual>.pet-defender{margin-left:-58px}
.fighter .combat-character.pose-swap{animation:pose-swap .22s ease}@keyframes pose-swap{0%{opacity:.32}100%{opacity:1}}
.critical-glow{position:absolute;z-index:4;inset:10% 6%;border-radius:50%;opacity:0;pointer-events:none;mix-blend-mode:screen}.critical-glow.crit{background:radial-gradient(circle,rgba(255,50,25,.95) 0%,rgba(255,64,20,.55) 45%,transparent 75%)}.critical-glow.miss{background:radial-gradient(circle,rgba(60,150,255,.9) 0%,rgba(70,160,255,.5) 45%,transparent 75%)}.critical-glow.show{animation:critical-boom .55s ease-out}
@keyframes critical-boom{0%{opacity:0;transform:scale(.5)}30%{opacity:1;transform:scale(1.05)}100%{opacity:0;transform:scale(1.4)}}
footer { padding:12px; text-align:center; color:#e6e9ed; text-shadow:0 1px 2px #000; }
.scroll-symbol{color:#7459bb;font-size:1.3rem}.enchant-action{color:#6446ac;font-weight:700}.item-enchants{display:grid;gap:2px;margin:7px 0;padding:6px;background:#eee8ff;border-left:3px solid #7459bb}.item-enchants span{font-size:.82rem}
.gem-wallet{display:grid;grid-template-columns:180px 1fr;gap:20px;align-items:center}.gem-balance{text-align:center;color:#2394bf;font-size:3rem}.gem-balance strong,.gem-balance small{display:block}.gem-balance small{color:#667;font-size:.9rem}.gem-exchange{display:flex;gap:8px;margin-bottom:10px}.gem-exchange input{max-width:140px}
.touch-selected { outline:4px solid #1f789c!important; outline-offset:-4px; }
/* The outline itself stays a fixed 3px the whole time — only the glow (box-shadow) breathes.
   Animating the outline/background directly used to read as the border itself growing, since the
   dashed gold outline sat close in colour to the cell's own frame artwork. */
.touch-target { position:relative; z-index:1; outline:2px solid rgba(249,209,4,.6)!important; outline-offset:-2px; animation:touch-target-pulse 1.8s ease-in-out infinite; }
@keyframes touch-target-pulse { 0%,100% { box-shadow:inset 0 0 0 2px rgba(249,209,4,.55),0 0 3px 0 rgba(249,209,4,.15); } 50% { box-shadow:inset 0 0 0 2px rgba(249,209,4,.55),0 0 8px 2px rgba(249,209,4,.4); } }
/* Hold-in-progress: an outward-growing glow timed to TOUCH_HOLD_MS (480ms in inventory-dnd.js) so
   the gesture gives visible feedback while the finger is down, without covering the item icon the
   way a filling circle would. */
.touch-holding { position:relative; z-index:1; outline:3px solid var(--gold)!important; outline-offset:-3px; animation:touch-holding-fill .48s linear forwards; }
@keyframes touch-holding-fill { from { box-shadow:0 0 0 0 rgba(249,209,4,.85); } to { box-shadow:0 0 0 7px rgba(249,209,4,.85); } }
/* "Dvojklikem"/"Klepnutím" hint pairs — same copy slot, only one half shown depending on
   whether the device actually has a mouse (pointer:fine) or not (pointer:coarse). */
.pointer-fine-hint,.pointer-coarse-hint{display:none}
@media(pointer:fine){.pointer-fine-hint{display:inline}}
@media(pointer:coarse){.pointer-coarse-hint{display:inline}}
.reward-history { display:grid; gap:8px; }.reward-event { display:grid; grid-template-columns:44px 1fr auto; align-items:center; gap:12px; padding:12px; background:#fff; border-left:4px solid #68717b; }.reward-event.has-loot { border-left-color:var(--gold); box-shadow:0 2px 10px rgba(169,135,0,.16); }.reward-icon { font-size:1.7rem; text-align:center; }.reward-event small { display:block; color:#77808a; }.reward-event p { margin:4px 0 0; color:#8d7000; }.reward-values { display:grid; text-align:right; font-weight:700; }.reward-values span:first-child { color:#9b7500; }.reward-memory-end { display:block; margin-top:10px; color:#8a919a; text-align:center; font-style:italic; }
.loot-icon{position:relative;display:inline-flex;width:52px;height:52px;margin:5px;align-items:center;justify-content:center;background-image:var(--inv-empty-bg);background-position:center;background-size:cover;vertical-align:middle}.loot-icon>img{max-width:46px;max-height:46px;object-fit:contain}.combat-loot{display:flex;align-items:center;justify-content:center;gap:8px}.timeline-notification{background:#fff;border-left:4px solid #68717b}.repair-station>div{display:grid;gap:6px;margin-top:8px}.repair-station form{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px;border-top:1px solid var(--border)}.repair-station button img{display:inline;width:16px;height:16px}
.expedition-page { display:grid; place-items:center; background:#26313e url('../legacy/img/bg22.png') center/cover fixed; color:#fff; }.expedition-card { width:min(620px,calc(100% - 32px)); padding:40px; text-align:center; background:rgba(8,12,17,.9); border:8px solid rgba(255,255,255,.13); box-shadow:0 20px 70px #000; }.expedition-icon { width:72px; height:72px; object-fit:contain; }.expedition-card h1 { color:var(--gold); }.countdown { margin:28px 0 12px; font-size:clamp(2rem,8vw,4rem); font-variant-numeric:tabular-nums; color:var(--gold); }.expedition-rewards { color:#bdc7d3; }
@media(max-width:991px){body{background-attachment:scroll}.game-shell{padding-top:65px}.character-inventory-board{grid-template-columns:repeat(4,minmax(0,1fr))}.character-inventory-board>.equipment-column{grid-column:1/span 4;grid-row:1/span 4}.inventory-grid{grid-template-columns:repeat(4,1fr)}.shop-grid{grid-template-columns:repeat(2,1fr)}}
.stackable-inventory-item{position:relative;cursor:default!important;border-color:#7459bb!important;background:#faf8ff!important}.stack-quantity{position:absolute;right:3px;bottom:3px;min-width:24px;padding:2px 5px;border-radius:10px;color:#fff;background:#6245a0;font-size:.72rem}.stackable-popover>small{display:block;color:#6245a0}.reroll-action{color:#7650b5;font-weight:700}
.game-action-toast{position:fixed;z-index:2000;display:flex;align-items:center;gap:10px;max-width:320px;padding:10px 14px;color:#ded8ca;background:#0d0d0d url('../uploads/ui-prototypes/tall/content_tall_middle_center.png') center/100% 100% no-repeat;border:1px solid #62583f;border-radius:3px;box-shadow:inset 0 0 0 1px rgba(215,198,145,.08),0 12px 32px rgba(0,0,0,.75);font-weight:600;opacity:0;transform:translateY(6px);pointer-events:auto;transition:opacity .2s ease,transform .2s ease}.game-action-toast.is-visible{opacity:1;transform:none}.game-action-toast.is-leaving{opacity:0;transform:translateY(-22px);transition:opacity .65s ease,transform .65s ease}.game-action-toast--success{border-color:#3f7d4a}.game-action-toast--warning{border-color:#8a6c1c}.game-action-toast--danger{border-color:#8a3030;color:#e2b0ac}.game-action-toast-action{flex-shrink:0;padding:4px 9px;border:1px solid #62583f;border-radius:4px;background:#1d1d1d;color:var(--gold);font-size:.78rem;font-weight:700;cursor:pointer}.game-action-toast-action:hover{background:#29230f}
/* Na rozdíl od .game-action-toast (kotvený u posledního kliknutí/akce) tenhle vyjíždí vždy
   ve stejném fixním rohu - je pro pasivní upozornění z pollu (game-status-poll.js), ne pro
   reakci na akci hráče, takže žádný "point"/kurzor u kterého by dávalo smysl se objevit. */
#game-notify-stack{position:fixed;z-index:2050;top:64px;right:14px;display:flex;flex-direction:column;gap:8px;max-width:340px;pointer-events:none}
.game-notify-toast{display:block;padding:10px 14px;color:#ded8ca;background:#0d0d0d url('../uploads/ui-prototypes/tall/content_tall_middle_center.png') center/100% 100% no-repeat;border:1px solid #62583f;border-radius:3px;box-shadow:inset 0 0 0 1px rgba(215,198,145,.08),0 12px 32px rgba(0,0,0,.75);text-decoration:none;opacity:0;transform:translateX(36px) scale(.85);pointer-events:auto}
.game-notify-toast.is-visible{animation:game-notify-pop .45s cubic-bezier(.34,1.56,.64,1) forwards}
.game-notify-toast.is-leaving{opacity:0;transform:translateX(24px) scale(.9);transition:opacity .4s ease,transform .4s ease}
@keyframes game-notify-pop{0%{opacity:0;transform:translateX(36px) scale(.85);box-shadow:inset 0 0 0 1px rgba(215,198,145,.08),0 12px 32px rgba(0,0,0,.75)}55%{opacity:1;transform:translateX(-4px) scale(1.04);box-shadow:inset 0 0 0 1px rgba(215,198,145,.3),0 0 24px rgba(215,198,145,.35),0 12px 32px rgba(0,0,0,.75)}100%{opacity:1;transform:none;box-shadow:inset 0 0 0 1px rgba(215,198,145,.08),0 12px 32px rgba(0,0,0,.75)}}
.game-notify-toast b{display:block;margin-bottom:2px;color:var(--gold);font-size:.85rem}
.game-notify-toast span{display:block;color:#d8d2c4;font-size:.78rem;line-height:1.4}
.onboarding-highlight-box{position:fixed;z-index:1600;outline:2px solid var(--gold);outline-offset:3px;border-radius:4px;box-shadow:0 0 0 4000px rgba(0,0,0,.55);pointer-events:none}
.onboarding-overlay{position:fixed;inset:0;z-index:1620;background:transparent;cursor:default}
.onboarding-bubble{position:fixed;z-index:1650;max-width:280px;padding:12px 14px;color:#ded8ca;background:#0d0d0d url('../uploads/ui-prototypes/tall/content_tall_middle_center.png') center/100% 100% no-repeat;border:1px solid #62583f;border-radius:3px;box-shadow:inset 0 0 0 1px rgba(215,198,145,.08),0 12px 32px rgba(0,0,0,.75)}
.onboarding-bubble b{display:block;margin-bottom:4px;color:var(--gold);font-size:.9rem}
.onboarding-bubble p{margin:0 0 10px;color:#d8d2c4;font-size:.82rem;line-height:1.4}
.onboarding-bubble-actions{display:flex;gap:8px}
.player-directory-head{display:flex;align-items:center;justify-content:space-between;gap:18px}.player-directory-head strong,.player-directory-head small{display:block}.player-directory-head small{color:#68717b}.player-directory-head form{display:flex;gap:6px}.player-ranking{padding:0!important;overflow-x:auto}.player-row{display:grid;grid-template-columns:38px minmax(180px,1.6fr) 90px 70px 125px 120px 70px;align-items:center;gap:8px;min-width:790px;padding:9px 12px;border-bottom:1px solid var(--border)}.player-row-head{color:#fff;background:#111;font-size:.78rem;font-weight:700}.player-row.is-bot{background:#faf8ff}
.player-row.is-me{background:#fff8cf}
.player-row.is-me.is-bot{background:linear-gradient(90deg,#fff8cf,#faf8ff)}.player-identity{display:flex;align-items:center;gap:7px}.player-identity img{width:36px;height:36px;object-fit:cover;border-radius:50%}.player-identity i,.bot-badge{padding:2px 5px;border-radius:8px;color:#fff;background:#7459bb;font-size:.58rem;font-style:normal}.player-identity i:not(.bot-badge){background:#9b7900}.activity-badge{font-size:.75rem;color:#36732d}.activity-badge.away{color:#9b7900}.player-profile-title{display:flex;align-items:center;justify-content:space-between;background:#000}.player-profile-title h2{margin:0}.public-profile{display:grid;grid-template-columns:1.2fr 1fr;gap:20px}.profile-hero{display:flex;align-items:center;gap:16px}.profile-hero>img{width:130px;height:170px;object-fit:cover;border:4px solid #111}.rank-mark{color:#9b7900;font-size:1.8rem;font-weight:800}.profile-stats dl{margin:0}.profile-stats dl div{display:flex;justify-content:space-between;padding:8px;border-bottom:1px solid var(--border)}.profile-stats p.profile-combat-stats{margin:0;padding:8px}@media(max-width:700px){.player-directory-head{align-items:stretch;flex-direction:column}.public-profile{grid-template-columns:1fr}}
/* Generický slot-grid engine drží pro .slot-grid--public-equipment pevných --slot-size:82px
   sloupců (viz <x-inventory-grid preset="public-equipment" :cell-size="82">) — na úzkém telefonu
   to tlačilo 2 z 5 slotů mimo obrazovku. Tady proto přepínáme na fluidní režim (sloupce 1fr,
   čtvercové buňky přes aspect-ratio) — jde o výjimku popsanou v komentáři generického enginu.
   .profile-hero stayed a fixed-width side-by-side row too, clipping the level/guild text. */
@media(max-width:480px){
    .profile-hero{flex-direction:column;align-items:center;text-align:center}
    .slot-grid--public-equipment{grid-template-columns:repeat(5,minmax(0,1fr))!important;width:100%}
    .slot-grid.slot-grid--public-equipment>.slot-cell{width:auto!important;height:auto!important;aspect-ratio:1/1}
}
.game-pagination{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;margin:18px 0}
.game-pagination-btn{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:34px;padding:0 8px;color:var(--gold);background:#111;border:1px solid #111;border-radius:4px;font-weight:700;text-decoration:none}
.game-pagination-btn:hover{color:#111;background:var(--gold);text-decoration:none}
.game-pagination-btn.is-active{color:#111;background:var(--gold);cursor:default}
.game-pagination-btn.is-disabled{color:#888;background:#eee;border-color:var(--border);cursor:default}
.game-pagination-dots{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:34px;color:#68717b}
.pill-banned{display:inline-block;padding:4px 10px;border-radius:20px;color:#fff;background:#b52222;font-size:.78rem;font-weight:700}
@media(max-width:575px){.feature-grid{grid-template-columns:1fr}.avatar-options{grid-template-columns:repeat(3,1fr)}.quest-card{align-items:flex-start;flex-direction:column}.shop-grid{grid-template-columns:1fr}.enemy-card{grid-template-columns:70px 1fr}.enemy-card>img{width:68px;height:68px}.enemy-card form{grid-column:1/3}.combat-stage{grid-template-columns:1fr 28px 1fr;min-height:270px}.fighter{padding:5px}.fighter h3{font-size:1rem}.fighter img{height:150px}.fighter-visual{height:150px}.versus{font-size:1rem}.game-panel{border-width:5px}.content{padding:12px}}
/* Clickable, compact player ranking rows. */
.player-row{grid-template-columns:38px minmax(170px,1.6fr) 80px 55px 110px minmax(105px,1fr);min-width:650px;position:relative}
.player-row-link{position:absolute;inset:0;z-index:1}
.guild-tag-link{position:relative;z-index:2;color:inherit;text-decoration:underline}
.guild-tag-link:hover{color:var(--gold)}
.guild-row,.guild-row-head{grid-template-columns:38px minmax(180px,1.6fr) 100px 140px 120px;min-width:550px}
a.player-row{color:inherit;text-decoration:none;transition:background-color .15s,box-shadow .15s}
a.player-row:hover,a.player-row:focus{color:inherit;text-decoration:none;background:#fff5bf;box-shadow:inset 4px 0 #d4ad00;outline:0}
.equipment-slot.is-occupied{position:relative}.equipment-slot.is-occupied>small{position:absolute;top:4px;left:6px;z-index:1;max-width:calc(100% - 12px);overflow:hidden;color:#111;opacity:.16;font-size:.62rem;white-space:nowrap}.equipment-slot.is-occupied .equipped-item>img{width:100%;height:100%}.equipment-slot.damaged-item{box-shadow:inset 0 0 0 2px rgba(179,33,33,.15)}.equipment-slot .damage-badge{position:absolute;top:0px;right:0px;z-index:2;width:20px;height:20px;border-radius:50%;color:#fff;line-height:20px;text-align:center;text-transform:none}
.inventory-item.damaged-item .damage-badge{position:absolute;top:3px;right:3px;z-index:2;width:18px;height:18px;margin:0;padding:0;border-radius:50%;line-height:18px;text-align:center;text-transform:none;overflow:hidden}
.equipment-slot.is-occupied.rarity-rare::before{background-image:var(--inv-empty-rare-bg)}.equipment-slot.is-occupied.rarity-epic::before{background-image:var(--inv-empty-epic-bg)}
.item-popover--rare{border-color:#2876c8}.item-popover--epic{border-color:#8a42c2;box-shadow:0 8px 24px rgba(91,35,139,.42)}.item-popover--damaged{border-color:#b52222;background:#fff8f8}.upgrade-preview-items{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;text-align:center}.upgrade-preview-items>div{display:flex;flex-direction:column;align-items:center}.upgrade-preview-items img{width:92px;height:92px;object-fit:contain}.upgrade-preview-items small{color:#68717b}.upgrade-preview-arrow{color:var(--gold);font-size:2rem}.upgrade-preview-arrow .web-icon{width:32px;height:32px}.upgrade-preview-stats{margin:18px 0 10px}.upgrade-preview-stats div{display:flex;justify-content:space-between;padding:5px 0;border-bottom:1px dotted #ccd1d6}.upgrade-preview-stats dd{margin:0}.upgrade-preview-stats dd span{color:#8a42c2}.upgrade-preserved{padding:9px;background:#edf5ff;border-left:3px solid #2876c8}.upgrade-preview-cost{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-start;gap:8px;margin-top:12px;padding:10px;background:#f5f5f5}.upgrade-preview-cost>span:last-child{margin-left:auto}.upgrade-material-icon{width:36px;height:36px;margin:0}.upgrade-material-icon>img{max-width:30px;max-height:30px}.upgrade-material-icon .stack-quantity{font-size:.62rem;min-width:auto;padding:1px 4px}.upgrade-material-missing{border-color:#b52222!important;box-shadow:0 0 0 1px #b52222}.upgrade-preview-modal .modal-content{border:3px solid var(--gold)}
.upgrade-preview-handbooks{display:flex;flex-direction:column;gap:6px;margin-top:12px;padding:10px;background:#fff8e6;border:1px dashed #c39c16}.upgrade-preview-handbooks>b{font-size:.82rem}.upgrade-preview-handbooks>.btn{white-space:normal;text-align:left}
.quick-items,.storage-grid{display:grid;grid-template-columns:repeat(8,minmax(58px,1fr));gap:1px;background:#000}.inventory-empty{display:flex;align-items:center;justify-content:center;cursor:default}.inventory-empty span{position:relative;z-index:1;color:rgba(255,255,255,.5);font-size:.7rem;text-shadow:0 1px 2px rgba(0,0,0,.9)}
.inventory-grid,.equipment-layout,.warehouse-grid,.inventory-item,.equipment-slot,.warehouse-item{-webkit-user-select:none;user-select:none}.item-popover,.item-popover *{-webkit-user-select:text;user-select:text}
.nav-inbox{position:relative;display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;border:0!important;background:transparent!important;padding:4px 7px!important;border-radius:6px}.nav-inbox:hover,.nav-inbox:focus{background:rgba(255,255,255,.14)!important}.nav-inbox .web-icon{width:32px;height:32px;vertical-align:middle}.nav-inbox b{position:absolute;right:-5px;top:-7px;min-width:17px;padding:1px 4px;border-radius:10px;color:#111;background:var(--gold);font-size:.65rem}.notification-toolbar{display:flex;align-items:center;justify-content:space-between}.notification-row{margin:0}.notification-row button{display:grid;grid-template-columns:34px 1fr auto;align-items:center;width:100%;padding:11px;border:0;border-bottom:1px solid var(--border);color:inherit;background:transparent;text-align:left}.notification-row.unread button{background:#fff8cf}.notification-row small,.notification-row b{display:block}.notification-row time{font-size:.72rem;color:#68717b}.notification-icon{font-size:1.25rem}.message-thread-row{display:flex;align-items:center;gap:12px;padding:10px;border-bottom:1px solid var(--border);color:inherit}.message-thread-row:hover{color:inherit;background:#fff8cf;text-decoration:none}.message-thread-row img{width:44px;height:44px;border-radius:50%;object-fit:cover}.message-thread-row span{flex:1}.message-thread-row small,.message-thread-row b{display:block}.message-thread-row i{padding:2px 7px;border-radius:12px;color:#111;background:var(--gold);font-style:normal}.message-thread-row.unread{font-weight:700}.message-stream{display:flex;flex-direction:column;gap:8px;max-height:520px;overflow-y:auto}.message-bubble{align-self:flex-start;max-width:78%;padding:9px 12px;border-radius:12px;background:#e7ebef}.message-bubble.mine{align-self:flex-end;background:#fff1a8}.message-bubble p{margin:3px 0;white-space:pre-wrap}.message-bubble time{font-size:.68rem;color:#68717b}.message-compose{display:flex;align-items:flex-start;gap:8px}.message-compose textarea{flex:1}.message-compose>button{flex:0 0 auto}.message-compose textarea{min-height:70px}.equipment-popover-actions{margin-top:9px;flex-wrap:wrap}.equipment-popover-actions form{flex:1}.equipment-popover-actions button{width:100%}
.inventory-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 15px;background:#050505}.inventory-heading h2{flex:1;margin:0;padding:0;background:none}.storage-list{display:grid;gap:8px}.storage-entry{display:grid;grid-template-columns:72px 1fr auto;align-items:center;gap:12px;padding:10px;border:1px solid #cbd0d4;background:#fff}.storage-entry img{width:64px;height:64px;object-fit:contain}.storage-entry div{display:flex;flex-direction:column}.storage-entry time{color:#9b2c2c;font-size:.85rem}.storage-entry-actions{display:flex;flex-direction:column;gap:6px}.storage-entry-actions form{width:130px}.storage-entry-actions .btn{width:100%}
.merchant-grid .inventory-item{position:relative;padding-bottom:27px}.merchant-sell{position:absolute;left:3px;right:3px;bottom:3px;width:calc(100% - 6px);padding:2px 3px;border:1px solid #565c62;border-radius:3px;color:#f4d54a;background:#202326;font-size:.68rem;cursor:pointer}.merchant-sell:hover{color:#ffe66a;background:#34393e;border-color:#c39c16}.merchant-sell>img{width:14px!important;height:14px!important;object-fit:contain;vertical-align:-2px}
.merchant-inventory{display:none!important}
.game-action-confirm{position:fixed;z-index:2100;width:min(340px,calc(100vw - 24px));padding:14px;color:#ded8ca;background:#0d0d0d url('../uploads/ui-prototypes/tall/content_tall_middle_center.png') center/100% 100% no-repeat;border:1px solid #62583f;border-radius:3px;box-shadow:inset 0 0 0 1px rgba(215,198,145,.08),0 12px 32px rgba(0,0,0,.75);opacity:0;transform:translateY(5px);transition:.15s ease}.game-action-confirm.is-visible{opacity:1;transform:none}.game-action-confirm p{margin:0 0 9px;color:#ded8ca;font-weight:600;white-space:pre-line}.game-action-confirm .confirm-gold{color:var(--gold)}.game-action-confirm .confirm-danger{color:#e2726a}.game-action-confirm>div{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:6px}.pet-treat-bonus-list{display:flex;flex-direction:column;gap:5px;margin:8px 0;padding:8px 10px;background:#1a1a1a;border:1px solid #443b29;border-radius:3px}.pet-treat-bonus-row{display:inline-flex;align-items:center;gap:6px;color:#72d99b;font-weight:700}.pet-treat-bonus-row .web-icon{width:18px;height:18px;flex:0 0 auto}.game-action-quantity input[type="number"]{width:100%;margin-bottom:8px}.warehouse-tab{margin-top:15px;border:1px solid #aeb4ba;background:transparent}.warehouse-tab>summary{padding:10px 14px;cursor:pointer;font-weight:700}.warehouse-empty{cursor:default}.warehouse-empty span{position:relative;z-index:1;color:rgba(255,255,255,.5);font-size:.7rem;text-shadow:0 1px 2px rgba(0,0,0,.9)}
.web-icon{width:18px;height:18px;object-fit:contain;vertical-align:-3px}
.reward-icon .web-icon,.notification-icon .web-icon{width:24px;height:24px;vertical-align:-5px}

.sidebar-stats dl{margin:0}
.sidebar-stats dl>div{display:flex;align-items:center;justify-content:space-between;padding:6px 0;border-bottom:1px dotted #ccc}
.sidebar-stats dt{display:flex;align-items:center;gap:6px}
.sidebar-stats dd{margin:0;font-weight:700}
.sidebar-stats-combat{margin-bottom:10px;padding-bottom:6px;border-bottom:2px solid var(--gold)}
.sidebar-stats-combat dd{color:#9b7900}

.item-carry-active,.item-carry-active *{cursor:none!important}
body.modal-open.item-carry-active,body.modal-open.item-carry-active *{cursor:auto!important}
body.modal-open .item-carry-preview{display:none!important}
.is-carried>.item-popover{display:none!important}
.carry-popover-suppressed>.item-popover{display:none!important}
.touch-selected>.item-popover{display:none!important}
.is-carried{opacity:.45}
.item-carry-preview{position:fixed;z-index:2200;width:38px;height:38px;pointer-events:none;transform:translate(-50%,-50%)}
.item-carry-preview img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 3px 3px rgba(0,0,0,.55))}
.carry-target{outline:2px dashed rgba(249,209,4,.8);outline-offset:-3px}
.carry-target.carry-over{outline:4px solid var(--gold);background:rgba(249,209,4,.2)}

/* Dark slot artwork belongs to real cells only, never to their full-width layout wrappers.
   .inventory-grid/.warehouse-grid geometrii i pozadi uz resi generic ".slot-grid" engine vyse —
   character-inventory-board (paperdoll) je z nej ale zamerne vynechany, takze si transparentni
   pozadi drzi tady zvlast. */
.character-inventory-board{background:transparent}

/* Slot art is edge-to-edge; only the actual carried/equipped item icon gets breathing room. */
.character-inventory-board,.character-inventory-board>.equipment-column,.quick-items,.storage-grid{gap:0}
.inventory-item>img,.equipment-slot.is-occupied .equipped-item>img,.warehouse-item>img{box-sizing:border-box;padding:6px}
.equipment-slot.is-occupied.damaged-item::before{background-image:var(--inv-empty-damaged-bg)!important}

/* Merchant prototype: the offer and the sell inventory share the same slot language as inventory/storage.
   Geometrii (sloupce/velikost bunky) uz dava <x-inventory-grid :columns :cell-size> + generic
   ".slot-grid" engine vyse — tady uz jen dekorativni vyjimky specificke pro tento typ bunky.
   Selektory .slot-grid.{trida}>.slot-cell davaji STEJNOU specificitu (3 tridy) jako generic
   pravidlo pro .slot-cell/img, takze vyhraji poradim v souboru bez potreby !important. */
.merchant-offer-grid{overflow:visible}
.slot-grid.merchant-offer-grid>.slot-cell>img{padding:8px 8px 27px}
.merchant-offer-item form{position:absolute;right:3px;bottom:3px;left:3px;margin:0}
.merchant-offer-buy{display:flex;width:100%;height:22px;padding:1px 3px;align-items:center;justify-content:center;gap:3px;border:1px solid #565c62;border-radius:3px;color:#f4d54a;background:#202326;font-size:.68rem;font-weight:700;line-height:1;cursor:pointer}
.merchant-offer-buy:hover{color:#ffe66a;background:#34393e;border-color:#c39c16}
.merchant-offer-buy:disabled{color:#8f8f8f;cursor:not-allowed;filter:grayscale(1)}
.merchant-offer-buy .web-icon{width:14px;height:14px;vertical-align:0}
/* padding:0 potlacuje .content{padding:18px} — tenhle grid ma i tridu "content" kvuli spolecnemu
   obalu se zbytkem stranky. */
.merchant-grid--shop{justify-content:start;overflow:visible;padding:0}
.merchant-grid--shop .inventory-item{padding:4px 4px 23px}
.slot-grid.merchant-grid--shop .inventory-item>img{padding:0}
.merchant-grid--shop .merchant-sell{right:3px;bottom:3px;left:3px;width:calc(100% - 6px);height:19px;padding:0 2px;overflow:hidden;font-size:.62rem;line-height:17px;white-space:nowrap}
.merchant-grid--shop .merchant-sell .web-icon{width:12px!important;height:12px!important;vertical-align:-2px}
.merchant-grid--shop .stack-quantity{top:3px;right:3px;bottom:auto;z-index:2;min-width:20px;padding:1px 4px;font-size:.62rem}
.merchant-grid--shop .inventory-empty{padding:0}
.merchant-grid-replacement{padding-bottom:18px}
.slot-titlebar--merchant-inventory{width:620px;max-width:100%;margin:0 auto}
@media(max-width:575px){.merchant-offer-grid{--slot-size:78px!important;overflow-x:auto}.merchant-grid--shop{overflow-x:auto}
/* Fades the right edge of horizontally-scrollable slot strips so a phone user can tell there's
   more to swipe to — a plain overflow-x:auto gives no visual hint on touch (no visible scrollbar). */
.merchant-offer-grid,.merchant-grid--shop{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent)}}

/* Three-piece, non-deforming headers for slot-based interfaces. */
.slot-titlebar{--slot-title-end-width:24px;--slot-title-start:var(--slot-title-full-start);--slot-title-center:var(--slot-title-full-center);--slot-title-end:var(--slot-title-full-end);position:relative;z-index:2;display:grid;grid-template-columns:var(--slot-title-end-width) minmax(0,1fr) var(--slot-title-end-width);height:44px;min-width:0;color:var(--gold);filter:drop-shadow(0 3px 3px rgba(0,0,0,.45));user-select:none}
.slot-titlebar--half,.warehouse-tab[open] .slot-titlebar--warehouse{--slot-title-end-width:25px;--slot-title-start:var(--slot-title-half-start);--slot-title-center:var(--slot-title-half-center);--slot-title-end:var(--slot-title-half-end)}
.slot-titlebar__part{min-width:0;background-repeat:no-repeat;background-position:center;background-size:100% 100%;pointer-events:none}
.slot-titlebar__part--start{background-image:var(--slot-title-start)}
.slot-titlebar__part--center{background-image:var(--slot-title-center)}
.slot-titlebar__part--end{background-image:var(--slot-title-end)}
.slot-titlebar__label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:7px;padding:0 25px 2px;text-align:center;text-shadow:0 2px 2px #000;pointer-events:none}
.slot-titlebar__label strong{overflow:hidden;font-size:1rem;line-height:1;white-space:nowrap;text-overflow:ellipsis}
.slot-titlebar__label small{color:#c7b987;font-size:.65rem;font-weight:700;white-space:nowrap}
.character-inventory-board>.slot-titlebar--equipment{grid-column:1/span 4;grid-row:1;width:75%;align-self:end}
.character-inventory-board>.slot-titlebar--inventory{grid-column:5/span 5;grid-row:1;align-self:end}
.character-inventory-board>.equipment-column{grid-row:2/span 4}
.warehouse-tab>summary{padding:8px 0;list-style:none}
.warehouse-tab[open]>summary{padding-bottom:0}
.warehouse-tab[open]>.warehouse-grid{border-top:0}
.warehouse-tab>summary::-webkit-details-marker{display:none}
.slot-titlebar--warehouse{width:620px;max-width:100%;margin:0 auto}
@media(max-width:991px){.character-inventory-board>.slot-titlebar--equipment{grid-column:1/span 4;grid-row:1;width:75%}.character-inventory-board>.equipment-column{grid-row:2/span 4}.character-inventory-board>.slot-titlebar--inventory{grid-column:1/span 4;grid-row:6}.slot-titlebar--warehouse{width:min(620px,100%)}}

/* Temporary global experiment: header + nine-slice content frame (wide-v2). */
.game-panel--wide-frame-test{min-height:0;background:transparent;border:0;box-shadow:none}
.main-content-wide-test{width:100%;color:#d7d0c4}
.main-content-wide-test__row{position:relative;display:grid;width:100%;min-width:0}
.main-content-wide-test__part{display:block;min-width:0;background-position:center;background-repeat:no-repeat;background-size:100% 100%;pointer-events:none}
.main-content-wide-test__top{grid-template-columns:5.125% minmax(0,1fr) 5.125%;aspect-ratio:800/70}
.main-content-wide-test__top-start{background-image:url('../uploads/ui-prototypes/wide-v2/header_top_start.png')}
.main-content-wide-test__top-center{background-image:url('../uploads/ui-prototypes/wide-v2/header_top_middle.png')}
.main-content-wide-test__top-end{background-image:url('../uploads/ui-prototypes/wide-v2/header_top_end.png')}
.main-content-wide-test__top h2{position:absolute;inset:0;display:flex;margin:0;padding:12px 6% 3px;align-items:center;color:var(--gold);background:transparent;font-size:clamp(1rem,2.2vw,1.45rem);text-shadow:0 2px 3px #000}
.main-content-wide-test__actions{position:absolute;z-index:2;top:50%;right:5.5%;display:flex;align-items:center;gap:6px;transform:translateY(-42%)}
.main-content-wide-test__middle{grid-template-columns:2.25% minmax(0,1fr) 2.25%}
.main-content-wide-test__middle-start{background-image:url('../uploads/ui-prototypes/wide-v2/content_middle_start.png')}
.main-content-wide-test__middle-center{min-width:0;padding:8px;background:#090909 url('../uploads/ui-prototypes/wide-v2/content_middle_middle.png') center/100% 100% no-repeat}
.main-content-wide-test__body>h2:first-child{display:none}
.main-content-wide-test__middle-end{background-image:url('../uploads/ui-prototypes/wide-v2/content_middle_end.png')}
.main-content-wide-test__bottom{grid-template-columns:2.25% minmax(0,1fr) 2.25%;aspect-ratio:800/18;padding:0;color:inherit;text-align:initial;text-shadow:none}
.main-content-wide-test__bottom-start{background-image:url('../uploads/ui-prototypes/wide-v2/content_bottom_start.png')}
.main-content-wide-test__bottom-center{background-image:url('../uploads/ui-prototypes/wide-v2/content_bottom_middle.png')}
.main-content-wide-test__bottom-end{background-image:url('../uploads/ui-prototypes/wide-v2/content_bottom_end.png')}
.main-content-wide-test .warehouse-tab{margin-top:14px;margin-bottom:0;border:0;background:transparent}
@media(max-width:575px){.main-content-wide-test__top h2{padding-top:8px;font-size:1rem}.main-content-wide-test__middle-center{padding-right:3px;padding-left:3px}}

/* Temporary global sidebar experiment: header + content middle/bottom (tall). */
.sidebar-panel--tall-frame-test{min-height:0;background:transparent;border:0;box-shadow:none}
.sidebar-tall-test{width:100%;color:#d7d0c4}
.sidebar-tall-test__row{position:relative;display:grid;width:100%;min-width:0}
.sidebar-tall-test__part{display:block;min-width:0;background-position:center;background-repeat:no-repeat;background-size:100% 100%;pointer-events:none}
.sidebar-tall-test__top{grid-template-columns:25px minmax(0,1fr) 25px;height:65px}
.sidebar-tall-test__top-start{background-image:url('../uploads/ui-prototypes/tall/header_top_start.png')}
.sidebar-tall-test__top-center{background-image:url('../uploads/ui-prototypes/tall/header_top_middle.png')}
.sidebar-tall-test__top-end{background-image:url('../uploads/ui-prototypes/tall/header_top_end.png')}
.sidebar-tall-test__top h2{position:absolute;inset:0;display:flex;margin:0;padding:7px 10% 1px;align-items:center;color:var(--gold);background:transparent;font-size:clamp(.95rem,1.8vw,1.2rem);text-shadow:0 2px 3px #000}
.sidebar-tall-test__top .sidebar-name-row{justify-content:space-between}
.sidebar-tall-test__content-top{grid-template-columns:2.8572% minmax(0,1fr) 2.8572%;aspect-ratio:420/12;padding:0}
.sidebar-tall-test__content-top-start{background-image:url('../uploads/ui-prototypes/tall/content_tall_top_start.png')}
.sidebar-tall-test__content-top-center{background-image:url('../uploads/ui-prototypes/tall/content_tall_top_middle.png')}
.sidebar-tall-test__content-top-end{background-image:url('../uploads/ui-prototypes/tall/content_tall_top_end.png')}
.sidebar-tall-test__middle{grid-template-columns:2.8572% minmax(0,1fr) 2.8572%}
.sidebar-tall-test__middle-start{background-image:url('../uploads/ui-prototypes/tall/content_tall_middle_start.png')}
.sidebar-tall-test__middle-center{min-width:0;padding:0;background:#090909 url('../uploads/ui-prototypes/tall/content_tall_middle_center.png') center/100% 100% no-repeat}
.sidebar-tall-test__middle-end{background-image:url('../uploads/ui-prototypes/tall/content_tall_middle_end.png')}
.sidebar-tall-test__bottom{grid-template-columns:2.8572% minmax(0,1fr) 2.8572%;aspect-ratio:420/12;padding:0;color:inherit;text-align:initial;text-shadow:none}
.sidebar-tall-test__bottom-start{background-image:url('../uploads/ui-prototypes/tall/content_tall_bottom_start.png')}
.sidebar-tall-test__bottom-center{background-image:url('../uploads/ui-prototypes/tall/content_tall_bottom_middle.png')}
.sidebar-tall-test__bottom-end{background-image:url('../uploads/ui-prototypes/tall/content_tall_bottom_end.png')}
.sidebar-tall-test__body .content{color:#d7d0c4;background:transparent}
.sidebar-tall-test__body .sidebar-stats dl>div{border-bottom-color:rgba(215,208,196,.24)}
.sidebar-tall-test__body .sidebar-stats-combat{border-bottom-color:#9b7900}
.sidebar-tall-test__body .active-effects{border-top-color:rgba(215,208,196,.24)}
@media(max-width:575px){.sidebar-tall-test__top{grid-template-columns:25px minmax(0,1fr) 25px;height:65px}.sidebar-tall-test__top h2{padding-top:6px;font-size:.95rem}.sidebar-tall-test__middle-center{padding:0}}

/* Shared dark surface language for non-slot game screens. Keep selectors component-scoped. */
:root{--game-surface:#151515;--game-surface-2:#1d1d1d;--game-surface-hover:#29230f;--game-line:#4b4434;--game-muted:#aaa394;--game-cream:#ded8ca}

/* ---------- CUSTOM CHECKBOX (global) ---------- */

input[type="checkbox"]{
    appearance:none;
    -webkit-appearance:none;
    width:18px;
    height:18px;
    margin:0;
    display:inline-grid;
    place-content:center;
    background:var(--game-surface);
    border:1px solid var(--game-line);
    border-radius:3px;
    flex-shrink:0;
    cursor:pointer;
    vertical-align:middle;
}

input[type="checkbox"]::before{
    content:"";
    width:10px;
    height:10px;
    transform:scale(0);
    transition:transform .1s ease-in;
    background:var(--gold);
    clip-path:polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
}

input[type="checkbox"]:checked::before{
    transform:scale(1);
}

input[type="checkbox"]:focus-visible{
    outline:2px solid var(--gold);
    outline-offset:2px;
}

input[type="checkbox"]:disabled{
    cursor:not-allowed;
    opacity:.5;
}
.quest-card,.training-row,.enemy-encounter,.arena-player,.arena-history a,.guild-members>div,.guild-members>a,.guild-invite,.guild-bonuses article,.guild-battle-card,.guild-action-card,.guild-messages,.reward-event,.timeline-notification,.message-thread-row,.trade-list-row,.trade-offer-row{color:var(--game-cream);background:linear-gradient(180deg,var(--game-surface-2),var(--game-surface));border-color:var(--game-line);box-shadow:inset 0 1px rgba(255,255,255,.035),0 3px 9px rgba(0,0,0,.28)}
.guild-battle-card>header{background:rgba(255,255,255,.03)}.guild-raid-chip{background:#2a2718;color:var(--game-cream)}
.quest-card p,.quest-card small,.training-description,.enemy-encounter>p,.enemy-encounter>small,.arena-player small,.guild-summary small,.guild-bonuses small,.reward-event small,.notification-row small,.notification-row time,.message-thread-row small,.gem-balance small{color:var(--game-muted)}
.quest-card{border-left-color:var(--gold)}.quest-card:hover{background:linear-gradient(180deg,#242116,#171717);box-shadow:inset 0 0 0 1px rgba(249,209,4,.2),0 5px 14px rgba(0,0,0,.35)}.quest-card.locked{opacity:.42;filter:grayscale(.75)}
.training-row{border-left-color:#7d6820}.training-list .training-row:has(.training-max-badge){border-left-color:#7459bb;background:linear-gradient(180deg,#211b29,#151515)}.training-progress{background:#080808;border:1px solid #3c382d}.training-progress span{background:linear-gradient(90deg,#7d6410,var(--gold))}.training-max-badge{color:#c8b5ed;background:#302442;border:1px solid #624a83}
.enemy-encounter{position:relative;overflow:hidden;border:1px solid #5c4b24;background:radial-gradient(circle at 50% 28%,#302919 0,#171717 44%,#0d0d0d 100%)}.enemy-encounter::before{content:'';position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 45px #000}.enemy-encounter>*{position:relative}.enemy-encounter>img{filter:drop-shadow(0 10px 13px rgba(0,0,0,.8))}.enemy-encounter h3{color:var(--gold)}
.arena-ladder-head{color:var(--game-cream);background:#111;border-color:#51472b}.arena-ladder-head small,.arena-quote-note{color:var(--game-muted)}.arena-ladder-head strong,.arena-rank,.arena-own-position{color:var(--gold)}.arena-pinned-target{background:#130d0b}.arena-pinned-target>b{color:#ff7653}.arena-player{border-left-color:#665a3a}.arena-player:hover{background:linear-gradient(90deg,#2b250f,#181818);border-left-color:var(--gold)}.arena-player--self{background:linear-gradient(90deg,#28230d,#171717);border-left-color:var(--gold)}.arena-player>img{border:1px solid #6a5a30;box-shadow:0 3px 9px #000}.arena-self-badge{color:#72d99b;border-color:#397455}.arena-unavailable{color:#e39a61}.arena-pagination a{color:var(--gold)}.arena-pagination span{color:#6e6a61}.arena-history a{color:var(--game-cream);border-bottom-color:#39352b}.arena-history a:hover{color:var(--gold);background:var(--game-surface-hover);text-decoration:none}.arena-history b{color:var(--gold)}
.player-directory-head .form-control,.guild-inline .form-control,.guild-inline select,.gem-exchange .form-control,.message-compose .form-control,.market-filters select{color:var(--game-cream);background:#0d0d0d;border-color:#514a38}.player-directory-head .form-control:focus,.guild-inline .form-control:focus,.gem-exchange .form-control:focus,.message-compose .form-control:focus,.market-filters select:focus{color:#fff;background:#111;border-color:var(--gold);box-shadow:0 0 0 .12rem rgba(249,209,4,.16)}
.player-row{color:var(--game-cream);background:#151515;border-bottom-color:#383329}.player-row:nth-child(odd){background:#1b1b1b}.player-row-head{color:var(--gold);background:#080808;border-top:1px solid #51472b;border-bottom-color:#6c5922}.player-row.is-bot{background:#1c1822}.player-row.is-me,.player-row.is-me.is-bot{background:linear-gradient(90deg,#312a0d,#1a1814)}.player-row:hover,a.player-row:focus{color:#fff;background:var(--game-surface-hover);box-shadow:inset 4px 0 var(--gold)}
.player-row-link:focus{outline:none}
.player-row:focus-within{color:#fff;background:var(--game-surface-hover);box-shadow:inset 4px 0 var(--gold)}
.activity-badge{color:#75b86e}.activity-badge.away{color:#d2aa31}
.guild-summary{padding:14px!important;background:linear-gradient(180deg,#1d1a12,#111);border:1px solid #51472b}.guild-summary strong{color:var(--gold)}.guild-members>div,.guild-members>a,.guild-invite{border-bottom-color:#39352b}.guild-members>a:hover{background:var(--game-surface-hover);color:#fff}.guild-bonuses article{border-left-color:var(--gold)}.guild-messages{border-color:#4a4332}.guild-messages p{border-bottom-color:#343029}.guild-messages p:nth-child(even){background:rgba(255,255,255,.025)}
.reward-event{border-left-color:#5f5a4e}.reward-event.has-loot{border-left-color:var(--gold);box-shadow:inset 0 0 0 1px rgba(249,209,4,.1),0 4px 12px rgba(0,0,0,.34)}.reward-event p{color:#d5b342}.reward-source{color:var(--gold)}.timeline-notification{border-left-color:#5f5a4e}.notification-row button{color:var(--game-cream);border-bottom-color:#39352b}.notification-row.unread button{background:linear-gradient(90deg,#30270b,#181818)}.notification-row button:hover{background:var(--game-surface-hover)}
.message-thread-row{border-bottom-color:#39352b}.message-thread-row:hover{color:#fff;background:var(--game-surface-hover)}.message-thread-row.unread{border-left:3px solid var(--gold);background:linear-gradient(90deg,#30270b,#181818)}.message-thread-row img{border:1px solid #6a5a30}
.gem-wallet{padding:20px!important;background:radial-gradient(circle at 90px 50%,rgba(116,61,171,.22),transparent 230px),linear-gradient(180deg,#1d1d1d,#111);border:1px solid #554268}.gem-balance{color:#b36cf0;text-shadow:0 0 18px rgba(166,89,230,.35)}.gem-wallet h3{color:var(--gold)}
.gem-exchange-preview{display:block;margin:2px 0 10px;color:var(--gold);font-size:.85rem;font-weight:700}
/* ===== Generický slot-grid engine =====
   Jediny zdroj pravdy pro KAZDY mriz kovy vyber slotu (sklad, tržnice, NPC nabidky, prodej,
   verejna vybava). Geometrie (pocet sloupcu, velikost bunky, mezera) rika VYHRADNE
   --slot-columns/--slot-rows/--slot-size/--slot-gap, ktere nastavuje <x-inventory-grid
   :columns :cell-size :gap>. Preset (napr. slot-grid--market-picker) uz dnes slouzi jen
   dekorativnim/rezimovym vyjimkam (fluidni sloupce na uzkem mobilu apod.), ne poctu sloupcu.
   character-inventory-board (paperdoll + inventar na desktopu) ma vlastni named-area layout a je
   ZAMERNE vyloucen pres :not() — viz "paperdoll se muze vynechat" v zadani sjednoceni. */
.slot-grid{--slot-columns:1;--slot-rows:auto;--slot-size:62px;--slot-gap:0}
.slot-grid:not(.character-inventory-board){display:grid;grid-template-columns:repeat(var(--slot-columns),var(--slot-size));grid-auto-rows:var(--slot-size);gap:var(--slot-gap);width:max-content;max-width:100%;margin:0 auto;background:transparent}
.slot-grid:not(.character-inventory-board).drag-over{outline:3px solid var(--gold);outline-offset:-3px;background:rgba(249,209,4,.18)}
.slot-grid:not(.character-inventory-board)>.slot-cell{width:var(--slot-size);height:var(--slot-size);min-height:0;margin:0;box-sizing:border-box}
.slot-grid:not(.character-inventory-board)>.slot-cell>img{width:100%;height:100%;box-sizing:border-box;padding:6px;object-fit:contain}
/* Bunky MIMO grid (loot v questu, uschova, radkove seznamy trznice) — velikost jim dava primo
   cellSize prop na <x-item-cell>, ktery prida tuto tridu + inline --slot-size. */
.slot-cell--standalone{width:var(--slot-size,62px);height:var(--slot-size,62px)}
/* Bez tohoto by <img> uvnitr samostatne (mimo grid) bunky nemel zadne omezeni rozmeru a
   vykreslil by se ve sve prirozene velikosti assetu (nalezeno jako skutecny bug u .trade-offer-row,
   kde tento radek chybel) — kontexty smi jen prebit padding, ne width/height. */
.slot-cell--standalone>img{width:100%;height:100%;box-sizing:border-box;object-fit:contain}
.public-profile{color:var(--game-cream);background:linear-gradient(180deg,var(--game-surface-2),var(--game-surface));border:1px solid var(--game-line)}.profile-stats dl div{border-bottom-color:#39352b}.profile-hero>img{border-color:#6a5a30;box-shadow:0 4px 14px #000}
.storage-entry{color:var(--game-cream);background:linear-gradient(180deg,var(--game-surface-2),var(--game-surface));border-color:var(--game-line)}.storage-entry-cell{padding:6px}.storage-entry-cell>img{width:100%;height:100%;object-fit:contain}.storage-entry time{color:#df786f}.warehouse-source-grid .inventory-item{position:relative;padding-bottom:27px}
.message-bubble{color:var(--game-cream);background:#202020;border:1px solid #494235}.message-bubble.mine{background:#30270b;border-color:#6e5a24}.message-bubble time{color:var(--game-muted)}
.item-enchants{color:#d9cceb;background:#20182a;border-left-color:#8c5fc1}.item-enchants span{color:#d9cceb}
.combat-wrap{color:var(--game-cream);background:#0b0b0b}.combat-stage{color:var(--game-cream);background:linear-gradient(rgba(4,4,4,.58),rgba(7,7,7,.82)),url('../legacy/img/battle.png') center/cover;border-color:#66583b;box-shadow:inset 0 0 55px #000}.fighter h3{color:var(--gold);text-shadow:0 2px 4px #000}.fighter h3 small{color:var(--game-muted)}.versus{color:var(--gold);text-shadow:0 2px 6px #000}.combat-log{color:var(--game-cream);background:#111}.combat-log p{border-bottom-color:#39352b}.combat-log p.combat-log-result{color:var(--gold);font-weight:700}.combat-log p.combat-log-knowledge{color:#b9cee8;font-style:italic}.combat-result{color:var(--game-cream);background:linear-gradient(180deg,#1a1812,#0c0c0c)}.combat-result h3{color:var(--gold)}
.fighter>img:not(.combat-weapon):not(.combat-projectile):not(.combat-shield){position:relative;z-index:1}.fighter.winner::after{content:"";position:absolute;z-index:0;left:17%;right:17%;bottom:6px;height:34px;border-radius:50%;background:radial-gradient(ellipse at center,rgba(255,215,73,.92) 0%,rgba(231,166,19,.52) 38%,rgba(173,94,0,.16) 65%,transparent 76%);filter:blur(3px);animation:winner-glow 1.55s ease-in-out infinite;pointer-events:none}
@keyframes winner-glow{0%,100%{opacity:.55;transform:scaleX(.88)}50%{opacity:1;transform:scaleX(1.08)}}
.game-shell .alert{color:var(--game-cream);background:#171717;border-color:#5b5138}.game-shell .alert-info{border-left:4px solid #397fc5}.game-shell .alert-warning{border-left:4px solid #d29b00}.game-shell .alert-success{border-left:4px solid #248a45}.game-shell .alert-danger{border-left:4px solid #b52222}
.storage-banner{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-top:14px;margin-bottom:0}.storage-banner strong{color:var(--gold)}
.daily-reward-trigger:not(.nav-inbox){margin-top:10px;display:flex;align-items:center;justify-content:center;gap:6px}.daily-reward-trigger .web-icon{width:22px;height:22px}.daily-reward-trigger b{color:#ff5252;font-size:.65rem}
.daily-reward-trigger--claimable{animation:daily-reward-pulse 1.6s ease-in-out infinite}
@keyframes daily-reward-pulse{0%,100%{box-shadow:0 0 0 0 rgba(249,209,4,.55)}50%{box-shadow:0 0 0 6px rgba(249,209,4,0)}}
.daily-reward-body{text-align:center}.daily-reward-icon{margin:0 auto 14px}.daily-reward-icon .web-icon{width:160px;height:160px;object-fit:contain;filter:drop-shadow(0 8px 18px rgba(0,0,0,.5))}
.daily-reward-strip{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;margin-bottom:16px}
.daily-reward-day{flex:1 0 76px;min-width:76px;display:flex;flex-direction:column;align-items:center;gap:3px;padding:10px 6px;border-radius:6px;background:#151515;border:1px solid var(--game-line,#4b4434);color:var(--game-muted,#aaa394)}
.daily-reward-day small{font-weight:600;letter-spacing:.02em}
.daily-reward-day strong{color:var(--game-cream,#ded8ca);font-size:.82rem}
.daily-reward-day span{font-size:.76rem}
.daily-reward-day em{font-style:normal;color:#7ec8ff;font-size:.76rem}
.daily-reward-day--past{opacity:.55}
.daily-reward-day--current{background:linear-gradient(180deg,#312a0d,#1a1814);border-color:var(--gold);box-shadow:0 0 0 1px rgba(249,209,4,.35),0 4px 14px rgba(0,0,0,.4);color:var(--game-cream,#ded8ca)}
.daily-reward-day--current small{color:var(--gold)}
.daily-reward-day.is-milestone{border-color:#7ec8ff}
.daily-reward-day.is-milestone small{color:#7ec8ff}
.daily-reward-tagline{color:var(--game-muted,#aaa394);margin-bottom:14px}
.daily-reward-wait{color:var(--game-cream,#ded8ca)}
.daily-reward-wait time{color:var(--gold);font-weight:600}
.daily-reward-claim{min-width:180px}
.guild-public-motto{font-style:italic;color:var(--game-cream,#ded8ca)}.guild-public-motto p{margin:0}
.guild-motto-form{display:flex;gap:7px;margin-top:8px}
.player-tabs{display:inline-flex;gap:2px;margin:12px 0;padding:4px;background:#0d0d0d;border:1px solid #4b4434;border-radius:6px}
.player-tab{padding:7px 20px;color:var(--game-muted,#aaa394);font-weight:600;font-size:.85rem;text-decoration:none;border-radius:4px;transition:background-color .15s,color .15s}
.player-tab:hover{color:#fff;text-decoration:none}
.player-tab.is-active{color:#111;background:var(--gold);box-shadow:0 2px 6px rgba(0,0,0,.4)}
@media(max-width:700px){.reward-event{grid-template-columns:36px 1fr}.reward-values{grid-column:2;text-align:left}.guild-summary{grid-template-columns:1fr}.gem-wallet{grid-template-columns:1fr}}

/* All Bootstrap modals in the game shell share one dark leather/brass skin. */
.modal-content{color:var(--game-cream);background:#090909 url('../uploads/ui-prototypes/tall/content_tall_middle_center.png') center/100% 100% no-repeat;border:2px solid #75633e;border-radius:3px;box-shadow:inset 0 0 0 1px rgba(215,198,145,.1),0 18px 60px rgba(0,0,0,.82)}
.modal-header,.modal-footer{border-color:rgba(199,185,135,.28)}.modal-title{color:var(--gold);text-shadow:0 2px 3px #000}.modal-header .close{color:#d7d0c4;text-shadow:0 1px 2px #000;opacity:.82}.modal-header .close:hover,.modal-header .close:focus{color:var(--gold);opacity:1}.modal-body{color:var(--game-cream)}.modal-body .text-muted{color:var(--game-muted)!important}.modal-backdrop.show{opacity:.76}.upgrade-preview-stats div{border-bottom-color:rgba(199,185,135,.24)}.upgrade-preview-items small{color:var(--game-muted)}.upgrade-preserved{color:#b9cee8;background:#131d28;border-left-color:#397fc5}.upgrade-preview-cost{color:var(--game-cream);background:#17140d;border:1px solid #51472b}.upgrade-preview-modal .modal-content{border-color:#75633e}.upgrade-preview-handbooks{color:var(--game-cream);background:#20190a;border-color:#8a6c1c}

/* Item details use the same dark leather-and-brass language as the sidebar, without a title header. */
.item-popover{
    isolation:isolate;
    color:#d7d0c4;
    background:#090909 url('../uploads/ui-prototypes/tall/content_tall_middle_center.png') center/100% 100% no-repeat;
    border:1px solid #62583f;
    border-radius:3px;
    box-shadow:inset 0 0 0 1px rgba(215,198,145,.08),0 10px 26px rgba(0,0,0,.72);
    text-shadow:0 1px 1px #000;
}
.item-popover::before{
    content:'';
    position:absolute;
    inset:3px;
    z-index:-1;
    border:1px solid rgba(166,145,91,.2);
    border-radius:1px;
    pointer-events:none;
}
.item-popover header{border-bottom-color:rgba(199,185,135,.3)}
.item-popover header strong{color:#f0e9db}
.item-popover header small:not(.item-rarity-pill):not(.item-damaged-note),.item-popover>small:not(.item-rarity-pill):not(.item-damaged-note),.stackable-popover>small{color:#aaa394}
.item-popover .item-damaged-note{color:#b52222}
.item-popover p{color:#c9c0af}
.item-detail-stats div{border-bottom-color:rgba(199,185,135,.24)}
.item-detail-stats dt{color:#c1b8a7}
.item-detail-stats dd{color:#f0d352}
.item-detail-stats .item-detail-stat-small{flex-direction:column;gap:1px}
.item-detail-stats .item-detail-stat-small dt,.item-detail-stats .item-detail-stat-small dd{font-size:.72rem;font-weight:400}
.item-race-bonus{font-weight:700}
.item-race-bonus--mismatch{color:#b52222}
.item-popover .item-actions{padding-top:5px;border-top:1px solid rgba(199,185,135,.2)}
.item-popover .item-action{color:#d6bd55}
.item-popover .item-action:hover,.item-popover .item-action:focus{color:#fff2a7}
.item-popover-debug{border-top-color:rgba(199,185,135,.25);color:#716c63}
.item-popover--rare{border-color:#397fc5;box-shadow:inset 0 0 0 1px rgba(57,127,197,.18),0 10px 26px rgba(0,0,0,.72)}
.item-popover--epic{border-color:#9557c7;box-shadow:inset 0 0 0 1px rgba(149,87,199,.22),0 10px 28px rgba(74,28,108,.58)}
.item-popover--damaged{color:#dfd3cb;background:#100909 url('../uploads/ui-prototypes/tall/content_tall_middle_center.png') center/100% 100% no-repeat;border-color:#b52222;box-shadow:inset 0 0 0 1px rgba(181,34,34,.18),0 10px 26px rgba(0,0,0,.72)}
.item-damaged-note{color:#b52222}
.item-popover .item-rarity-pill--rare{color:#63a8ed}.item-popover .item-rarity-pill--epic{color:#c281ed}
.fighter .health.is-unknown span{width:100%!important;background:repeating-linear-gradient(135deg,#443d2c,#443d2c 8px,#655936 8px,#655936 16px);animation:unknown-health-pulse 1.5s ease-in-out infinite alternate}.fighter .health.is-unknown b{color:#e5dcbf}@keyframes unknown-health-pulse{to{filter:brightness(1.18)}}

@keyframes effect-expiry-pulse{0%,100%{color:inherit;filter:none;opacity:1}50%{color:#53c878;filter:drop-shadow(0 0 6px rgba(83,200,120,.72));opacity:.72}}
.effect-icon.is-expiring,.sidebar-stat-with-effect.is-expiring>dd{animation:effect-expiry-pulse 1.15s ease-in-out infinite}.effect-icon.is-expiring{border-color:#53c878}
@media(prefers-reduced-motion:reduce){.effect-icon.is-expiring,.sidebar-stat-with-effect.is-expiring>dd{animation:none;color:#53c878;filter:none}}

/* Shared three-piece controls. Source artwork stays undistorted at the caps; only its center stretches. */
.game-shell .btn:not(.nav-inbox):not(.merchant-sell){
    --control-cap:15px;
    min-height:42px;
    padding:7px 20px 8px;
    color:#e2d7c4;
    background-color:transparent;
    background-image:url('../uploads/ui-controls/btn_normal/btn_normal_start.png'),url('../uploads/ui-controls/btn_normal/btn_normal_end.png'),url('../uploads/ui-controls/btn_normal/btn_normal_center.png');
    background-position:left center,right center,center;
    background-repeat:no-repeat,no-repeat,no-repeat;
    background-size:var(--control-cap) 100%,var(--control-cap) 100%,calc(100% - 28px) 100%;
    border:0!important;
    border-radius:0;
    box-shadow:none;
    font-weight:700;
    line-height:1.25;
    text-shadow:0 2px 2px #000;
}

.btn.game-button.daily-reward-claim{
    --control-cap:15px;
    min-height:42px;
    padding:7px 20px 8px;
    color:#e2d7c4;
    background-color:transparent;
    background-image:url('../uploads/ui-controls/btn_normal/btn_normal_start.png'),url('../uploads/ui-controls/btn_normal/btn_normal_end.png'),url('../uploads/ui-controls/btn_normal/btn_normal_center.png');
    background-position:left center,right center,center;
    background-repeat:no-repeat,no-repeat,no-repeat;
    background-size:var(--control-cap) 100%,var(--control-cap) 100%,calc(100% - 28px) 100%;
    border:0!important;
    border-radius:0;
    box-shadow:none;
    font-weight:700;
    line-height:1.25;
    text-shadow:0 2px 2px #000;
}
.game-shell .btn-sm:not(.nav-inbox){--control-cap:12px;min-height:34px;padding:5px 15px 6px;background-size:var(--control-cap) 100%,var(--control-cap) 100%,calc(100% - 22px) 100%;font-size:.78rem}
.game-shell .btn-lg:not(.nav-inbox){--control-cap:18px;min-height:50px;padding:10px 24px 11px;background-size:var(--control-cap) 100%,var(--control-cap) 100%,calc(100% - 34px) 100%}
.game-shell .btn:not(.nav-inbox):not(.merchant-sell):hover,.game-shell .btn:not(.nav-inbox):not(.merchant-sell):focus{
    color:#fff1a1;
    background-color:transparent;
    background-image:url('../uploads/ui-controls/btn_normal/btn_hover_start.png'),url('../uploads/ui-controls/btn_normal/btn_hover_end.png'),url('../uploads/ui-controls/btn_normal/btn_hover_center.png');
    box-shadow:none;
    outline:none;
}
.game-shell .btn:not(.nav-inbox):not(.merchant-sell):active,.game-shell .btn:not(.nav-inbox):not(.merchant-sell).active{
    color:#d6c99f;
    background-image:url('../uploads/ui-controls/btn_normal/btn_pressed_start.png'),url('../uploads/ui-controls/btn_normal/btn_pressed_end.png'),url('../uploads/ui-controls/btn_normal/btn_pressed_center.png');
    transform:translateY(1px);
}
.game-shell .btn:not(.nav-inbox):not(.merchant-sell):disabled,.game-shell .btn:not(.nav-inbox):not(.merchant-sell).disabled{
    color:#77736b;
    background-image:url('../uploads/ui-controls/btn_disabled/btn_disabled_start.png'),url('../uploads/ui-controls/btn_disabled/btn_disabled_end.png'),url('../uploads/ui-controls/btn_disabled/btn_disabled_center.png');
    opacity:.72;
    text-shadow:0 1px #000;
}
/* Colored variants (danger/success/warning) reuse the same three-piece technique with their own
   artwork — same selector shape/specificity as the base .btn rule above so these consistently win
   over it regardless of source order, and each only needs normal/hover/disabled (no separate
   "pressed" art was authored for these three, unlike the plain button). */
.game-shell .btn-danger:not(.nav-inbox):not(.merchant-sell){background-image:url('../uploads/ui-controls/btn_danger/btn_normal_start.png'),url('../uploads/ui-controls/btn_danger/btn_normal_end.png'),url('../uploads/ui-controls/btn_danger/btn_normal_center.png')}
.game-shell .btn-danger:not(.nav-inbox):not(.merchant-sell):hover,.game-shell .btn-danger:not(.nav-inbox):not(.merchant-sell):focus,.game-shell .btn-danger:not(.nav-inbox):not(.merchant-sell):active{background-image:url('../uploads/ui-controls/btn_danger/btn_hover_start.png'),url('../uploads/ui-controls/btn_danger/btn_hover_end.png'),url('../uploads/ui-controls/btn_danger/btn_hover_center.png');transform:none}
.game-shell .btn-danger:not(.nav-inbox):not(.merchant-sell):disabled,.game-shell .btn-danger:not(.nav-inbox):not(.merchant-sell).disabled{background-image:url('../uploads/ui-controls/btn_danger/btn_disabled_start.png'),url('../uploads/ui-controls/btn_danger/btn_disabled_end.png'),url('../uploads/ui-controls/btn_danger/btn_disabled_center.png')}
.game-shell .btn-success:not(.nav-inbox):not(.merchant-sell){background-image:url('../uploads/ui-controls/btn_success/btn_normal_start.png'),url('../uploads/ui-controls/btn_success/btn_normal_end.png'),url('../uploads/ui-controls/btn_success/btn_normal_center.png')}
.game-shell .btn-success:not(.nav-inbox):not(.merchant-sell):hover,.game-shell .btn-success:not(.nav-inbox):not(.merchant-sell):focus,.game-shell .btn-success:not(.nav-inbox):not(.merchant-sell):active{background-image:url('../uploads/ui-controls/btn_success/btn_hover_start.png'),url('../uploads/ui-controls/btn_success/btn_hover_end.png'),url('../uploads/ui-controls/btn_success/btn_hover_center.png');transform:none}
.game-shell .btn-success:not(.nav-inbox):not(.merchant-sell):disabled,.game-shell .btn-success:not(.nav-inbox):not(.merchant-sell).disabled{background-image:url('../uploads/ui-controls/btn_success/btn_disabled_start.png'),url('../uploads/ui-controls/btn_success/btn_disabled_end.png'),url('../uploads/ui-controls/btn_success/btn_disabled_center.png')}
.game-shell .btn-warning:not(.nav-inbox):not(.merchant-sell){background-image:url('../uploads/ui-controls/btn_warning/btn_normal_start.png'),url('../uploads/ui-controls/btn_warning/btn_normal_end.png'),url('../uploads/ui-controls/btn_warning/btn_normal_center.png')}
.game-shell .btn-warning:not(.nav-inbox):not(.merchant-sell):hover,.game-shell .btn-warning:not(.nav-inbox):not(.merchant-sell):focus,.game-shell .btn-warning:not(.nav-inbox):not(.merchant-sell):active{background-image:url('../uploads/ui-controls/btn_warning/btn_hover_start.png'),url('../uploads/ui-controls/btn_warning/btn_hover_end.png'),url('../uploads/ui-controls/btn_warning/btn_hover_center.png');transform:none}
.game-shell .btn-warning:not(.nav-inbox):not(.merchant-sell):disabled,.game-shell .btn-warning:not(.nav-inbox):not(.merchant-sell).disabled{background-image:url('../uploads/ui-controls/btn_warning/btn_disabled_start.png'),url('../uploads/ui-controls/btn_warning/btn_disabled_end.png'),url('../uploads/ui-controls/btn_warning/btn_disabled_center.png')}
.game-shell .form-control:not(select):not(textarea){
    min-height:42px;
    padding:7px 23px 8px;
    color:#ded7ca;
    caret-color:var(--gold);
    background-color:transparent;
    background-image:url('../uploads/ui-controls/type_text/input_text_start.png'),url('../uploads/ui-controls/type_text/input_text_end.png'),url('../uploads/ui-controls/type_text/input_text_center.png');
    background-position:left center,right center,center;
    background-repeat:no-repeat,no-repeat,no-repeat;
    background-size:23px 100%,23px 100%,calc(100% - 44px) 100%;
    border:0;
    border-radius:0;
    box-shadow:none;
    text-shadow:0 1px 1px #000;
}
.game-shell .form-control:not(select):not(textarea)::placeholder{color:#8f8a81;opacity:1}
.game-shell .form-control:not(select):not(textarea):hover,.game-shell .form-control:not(select):not(textarea):focus,.game-shell .form-control:not(select):not(textarea):active{
    background-color:transparent!important;
    background-image:url('../uploads/ui-controls/type_text/input_text_start.png'),url('../uploads/ui-controls/type_text/input_text_end.png'),url('../uploads/ui-controls/type_text/input_text_center.png')!important;
    background-position:left center,right center,center!important;
    background-repeat:no-repeat,no-repeat,no-repeat!important;
    background-size:23px 100%,23px 100%,calc(100% - 44px) 100%!important;
}
.game-shell .form-control:not(select):not(textarea):focus,.game-shell .form-control:not(select):not(textarea):active{color:#fff;border:0;box-shadow:0 0 0 1px rgba(249,209,4,.22),0 0 12px rgba(249,209,4,.12);outline:none}

/* Textarea: obyčejný tmavý styl, žádný nine-slice asset */
.game-shell textarea.form-control,.game-shell textarea{
    min-height:120px;
    padding:10px 12px;
    color:#ded7ca;
    caret-color:var(--gold);
    background-color:var(--game-surface);
    border:1px solid var(--game-line);
    border-radius:2px;
    box-shadow:none;
    text-shadow:none;
}
.game-shell textarea.form-control::placeholder,.game-shell textarea::placeholder{color:#8f8a81;opacity:1}
.game-shell textarea.form-control:focus,.game-shell textarea:focus,.game-shell textarea.form-control:active,.game-shell textarea:active{color:#fff;border-color:var(--gold);box-shadow:0 0 0 1px rgba(249,209,4,.22),0 0 12px rgba(249,209,4,.12);outline:none}

/* Tržnice (player marketplace) */
.market-tabs{display:flex;gap:4px;margin:14px 0;border-bottom:2px solid var(--gold)}
.market-tabs a{padding:8px 16px;color:#68717b;font-weight:700;text-decoration:none;border-bottom:3px solid transparent}
.market-tabs a.active{color:var(--gold);border-bottom-color:var(--gold)}
.market-tabs a:hover{color:var(--gold);text-decoration:none}
.market-filters-toggle{margin-bottom:14px;background:var(--game-surface);border:1px solid var(--game-line)}
.market-filters-toggle>summary{padding:10px;color:var(--gold);font-weight:700;cursor:pointer;list-style:none}
.market-filters-toggle>summary::-webkit-details-marker{display:none}
.market-filters-toggle>summary::after{content:'▾';float:right}
.market-filters-toggle[open]>summary::after{content:'▴'}
.market-filters-toggle[open]>summary{border-bottom:1px solid var(--game-line)}
.market-filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:0;padding:10px;border:0}
.market-filters select{min-height:42px;padding:7px 12px;border-radius:2px}
.market-grid{display:flex;flex-wrap:wrap;width:max-content;max-width:100%;gap:1px;padding:0}
.market-offer-item{position:relative;display:block;width:86px;height:86px;min-height:0;padding:0;overflow:visible;border:1px solid transparent;background-image:var(--inv-empty-bg);background-position:center;background-size:cover}
.market-offer-item>img{box-sizing:border-box;width:100%;height:100%;margin:0;padding:8px 8px 27px;object-fit:contain}
.market-offer-item .stack-quantity{position:absolute;top:3px;right:3px;bottom:auto}
.market-offer-seller{position:absolute;top:2px;left:3px;right:3px;overflow:hidden;padding:0 3px;color:#cfd3d7;font-size:.56rem;text-align:center;white-space:nowrap;text-overflow:ellipsis;border-radius:3px}
.market-offer-price{padding:0 3px;color:var(--gold);font-size:.68rem;font-weight:700;text-align:center}
.market-offer-expires{padding:0 3px 2px;color:#9aa0a6;font-size:.58rem;text-align:center}
.market-offer-item form{position:absolute;right:3px;bottom:3px;left:3px;margin:0}
.market-offer-item .merchant-offer-buy,.market-offer-item form .btn{width:100%;height:22px;padding:1px 3px;font-size:.62rem}
.market-grid--history{display:flex;flex-direction:column;gap:0;background:transparent}
.market-offer-item--history{position:relative;display:grid;grid-template-columns:52px 1fr;align-items:center;gap:12px;padding:10px 10px 9px;color:var(--game-cream);background:linear-gradient(180deg,var(--game-surface-2),var(--game-surface));border-bottom:1px solid var(--game-line);transition:filter .14s ease,box-shadow .14s ease}
.market-offer-item--history:hover,.market-offer-item--history:focus,.market-offer-item--history:focus-within{filter:brightness(1.04);box-shadow:inset 0 0 0 1px rgba(243,207,58,.2)}
.market-offer-item--history img{width:48px;height:48px;object-fit:contain}
.market-history-item-thumb{position:relative;display:block;outline:none}
.market-offer-history-info b{display:block;color:var(--game-cream);line-height:1.2}
.market-offer-history-info small{color:var(--game-muted)}
.market-offer-history-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:3px}
.market-history-meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;line-height:1.25}
.market-history-price{display:inline-flex;align-items:center;gap:5px;color:var(--gold);font-weight:700}
.market-history-price .web-icon{width:14px;height:14px}
.market-history-tax{color:var(--game-muted);font-size:.7rem}
.market-status-badge{display:inline-block;padding:3px 9px;color:#d7d0c4;background:linear-gradient(180deg,#211f1b,#0d0d0c);border:1px solid #75633e;box-shadow:inset 0 0 0 1px rgba(0,0,0,.65),0 1px 4px rgba(0,0,0,.45);font-size:.68rem;font-weight:700;letter-spacing:.02em}
.market-status-badge--sold-sale{color:#78cf91;border-color:#39794c}
.market-status-badge--sold-buy{color:#79aee8;border-color:#426e9d}
.market-status-badge--expired{color:#ddbd57;border-color:#8a6d23}
.market-status-badge--withdrawn{color:#aaa394;border-color:#5d5951}
.market-history-item-thumb>.item-popover{left:0;right:auto;transform:none;bottom:calc(100% + 2px)}
.market-history-item-thumb[data-popover-hover-only]:not(:hover)>.item-popover{display:none!important}
.market-own-offer{display:inline-flex;align-items:center;justify-content:center;min-height:30px;padding:4px 7px;color:#d6bd55;background:rgba(214,189,85,.07);border:1px solid #75633e;font-size:.68rem;font-weight:700;text-align:center}
.game-action-listing label{display:block;margin-bottom:6px;font-size:.75rem;font-weight:700}
.game-action-listing input[type="number"]{width:100%;margin-top:2px}
/* Tržnice — Nabídky: kategorie + řádkový seznam */
.market-browse{display:flex;align-items:flex-start;gap:16px}
.market-categories{display:flex;flex:0 0 180px;flex-direction:column;gap:2px;padding:8px;background:var(--game-surface);border:1px solid var(--game-line)}
.market-categories a{padding:8px 10px;color:#c7c2b4;font-weight:600;font-size:.84rem;text-decoration:none;border-left:3px solid transparent}
.market-categories a:hover{color:var(--gold);text-decoration:none}
.market-categories a.active{color:var(--gold);background:rgba(243,207,58,.08);border-left-color:var(--gold)}
.market-list{flex:1;min-width:0;background:var(--game-surface);border:1px solid var(--game-line)}
.market-list-row,.market-list-head{display:grid;grid-template-columns:44px minmax(0,1fr) 68px 96px;gap:8px;align-items:center;padding:8px 10px}
.market-list-head{color:var(--game-muted);font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;border-bottom:1px solid var(--game-line)}
.market-list-row{border-bottom:1px solid var(--game-line)}
.market-list-row:hover{background:rgba(255,255,255,.03)}
.market-list-row:last-child{border-bottom:0}
.market-list-thumb img{width:100%;height:100%;padding:5px;box-sizing:border-box;object-fit:contain}
.market-list-name b{display:block;color:var(--game-cream);line-height:1.2}
.market-list-name small{color:var(--game-muted)}
.market-item-name--potion{color:#5cb85c}
.market-item-name--material{color:#cbb26a}
.market-item-name--enchant{color:#b07de0}
.market-item-name--consumable,.market-item-name--other{color:var(--game-cream)}
.market-list-time{overflow:hidden;color:#b9b3a3;font-size:.74rem;text-overflow:ellipsis;white-space:nowrap}
.market-list-row form{margin:0}
.market-list-row .game-button{display:inline-flex;align-items:center;justify-content:center;gap:4px;width:100%;padding:5px 4px;font-size:.72rem}
.market-list-row .game-button .web-icon{width:14px;height:14px}
.market-list-empty{padding:16px}
@media(max-width:900px){.market-browse{flex-direction:column}.market-categories{flex-direction:row;flex-wrap:wrap;width:100%}}
/* Mobil (vedle pevneho postranniho sloupce se staty, realna sirka jen ~220-240px): misto jednoho
   siroke radku na nabidku dve kompaktni karty vedle sebe - o dost lip vyuzije uzky prostor. */
@media(max-width:700px){
.market-tabs{justify-content:center;gap:0}
.market-tabs a{padding:6px 8px;font-size:.8rem}
.market-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;background:transparent;border:0}
.market-list-head{display:none}
.market-list-row{display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px;text-align:center;background:var(--game-surface);border:1px solid var(--game-line)}
.market-list-name{width:100%}
.market-list-name b{overflow:hidden;font-size:.74rem;text-overflow:ellipsis;white-space:nowrap}
.market-list-name small{font-size:.62rem}
.market-list-time{overflow:visible;width:100%;font-size:.62rem;white-space:normal}
.market-list-row form,.market-list-row>.market-own-offer{align-self:stretch}
.market-list-row .game-button{width:100%;font-size:.66rem}
.market-own-offer{width:100%}

/* Moje prodeje — inventarni vyber: --slot-columns/--slot-size prijdou inline z komponenty
   (:columns na desktopu), takze mobilni prebiti potrebuje !important — ale uz jen na SAMOTNYCH
   promennych, geometrii (grid-template-columns, rozmer .slot-cell) uz pak generickym pravidlem
   dopocita .slot-grid engine vyse sam, viz "Generický slot-grid engine". */
.market-listing-picker{--slot-columns:4!important;--slot-size:52px!important}
}

/* Tržnice — Moje prodeje: dvoupanelové rozložení */
.market-my-offers{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:18px}
.market-panel{padding:14px;background:var(--game-surface);border:1px solid var(--game-line)}
.market-panel h3{display:flex;align-items:center;justify-content:space-between;margin:0 0 12px;color:var(--gold);font-size:1rem}
.market-offer-nav-inline{display:flex;align-items:center;gap:8px;font-size:.78rem;color:var(--game-muted);font-weight:400}
.market-offer-nav-inline button{width:24px;height:24px;padding:0;color:var(--gold);background:transparent;border:1px solid var(--game-line);cursor:pointer;line-height:1}
.market-offer-nav-inline button:hover{border-color:var(--gold)}
.market-offer-card{display:flex;gap:14px;align-items:flex-start}
.market-offer-card-thumb{flex:0 0 64px}
.market-offer-card-thumb img{width:100%;height:100%;padding:8px;box-sizing:border-box;object-fit:contain}
.market-offer-card-info b{display:block;margin-bottom:8px;color:var(--game-cream);font-size:1.05rem}
.market-offer-card-row{display:flex;align-items:center;gap:6px;margin-bottom:5px;color:#cfd3d7;font-size:.85rem}
.market-offer-card-row strong{display:inline-flex;align-items:center;gap:4px;color:var(--gold)}
.market-offer-card-row .web-icon{width:16px;height:16px}
.market-listing-heading{text-align:center}
.market-offer-card-info form{margin-top:8px}
.market-list-form-info{display:flex;flex-direction:column;gap:5px;margin-top:12px;color:#cfd3d7;font-size:.8rem}
.market-list-form-info b{color:var(--gold)}
.market-drop-slot-wrap{display:flex;flex-direction:column;align-items:center;gap:6px;margin-bottom:10px}
.market-drop-hint{color:#9aa0a6;font-size:.78rem;text-align:center}
@media(max-width:900px){.market-my-offers{grid-template-columns:1fr}}
.sidebar-stat-with-effect{position:relative;outline:none}.sidebar-stat-boosted{color:#53c878!important;text-shadow:0 0 8px rgba(83,200,120,.2)}.sidebar-stat-effect-tooltip{display:none;position:absolute;z-index:2200;right:0;bottom:calc(100% + 5px);min-width:160px;max-width:250px;padding:8px 10px;color:#ded8ca;background:#10100f;border:1px solid #62583f;border-radius:3px;box-shadow:0 8px 22px rgba(0,0,0,.75);font-size:.7rem;font-weight:600;text-align:left;white-space:nowrap}.sidebar-stat-effect-tooltip span{display:block;color:#53c878}.sidebar-stat-with-effect:hover>.sidebar-stat-effect-tooltip,.sidebar-stat-with-effect:focus>.sidebar-stat-effect-tooltip,.sidebar-stat-with-effect:focus-within>.sidebar-stat-effect-tooltip{display:block}
.game-shell .form-control:not(select):not(textarea):disabled,.game-shell .form-control:not(select):not(textarea)[readonly]{color:#77736b;filter:grayscale(.65);opacity:.7}
.public-profile .profile-hero>img{width:180px;height:260px;box-sizing:border-box;padding:8px;object-fit:contain;object-position:center bottom;background:radial-gradient(ellipse at 50% 72%,#302b20 0,#171717 55%,#0d0d0d 100%)}
.character-filter-step{margin:12px 0}.character-filter-step>strong,.character-variants-title{display:block;margin-bottom:7px;color:var(--gold);font-size:1rem}.character-filter-options{display:flex;flex-wrap:wrap;gap:8px}.character-filter-button{display:grid;grid-template-columns:58px auto;align-items:center;gap:8px;min-width:155px;padding:5px 12px 5px 6px;color:#d7d0bc;background:linear-gradient(#262626,#111);border:1px solid #62573d;box-shadow:inset 0 0 0 1px #090909;cursor:pointer}.character-filter-button img{width:58px;height:58px;object-fit:contain}.character-filter-button span{font-weight:700}.character-filter-button:hover{color:var(--gold);border-color:#a98a2a}.character-filter-button.is-selected{color:var(--gold);border-color:#e0bd31;box-shadow:inset 0 0 0 1px #090909,0 0 9px rgba(255,215,0,.42)}.avatar-picker .avatar-options{display:flex;flex-wrap:wrap;gap:12px}.avatar-picker .avatar-options label{position:relative;width:220px;box-sizing:border-box;padding:15px 15px 10px;background-image:var(--character-frame);background-repeat:no-repeat;background-position:center;background-size:100% 100%;text-align:center;cursor:pointer;transition:filter .18s,transform .18s}.avatar-picker .avatar-options label[hidden]{display:none}.avatar-picker .avatar-options img{width:190px;height:250px;box-sizing:border-box;padding:7px;object-fit:contain;object-position:center bottom;background:transparent;border:0}.avatar-picker .avatar-options span{min-height:24px;color:#d7d0bc;font-weight:700}.avatar-picker .avatar-options label:hover{filter:brightness(1.15);transform:translateY(-2px)}.avatar-picker .avatar-options label:has(input:checked){background-image:var(--character-frame-selected);filter:drop-shadow(0 0 7px rgba(255,210,0,.65))}.avatar-picker .avatar-options label:has(input:checked) span{color:var(--gold)}.avatar-picker .avatar-options input:checked+img{border:0;box-shadow:none}.character-filter-empty{color:#c7b987;font-style:italic}@media(max-width:575px){.character-filter-button{min-width:calc(50% - 4px);grid-template-columns:45px auto}.character-filter-button img{width:45px;height:45px}.avatar-picker .avatar-options label{width:calc(50% - 6px);padding:10px}.avatar-picker .avatar-options img{width:100%;height:190px}}
.character-filter-options .character-filter-button{position:relative;display:block;min-width:0;width:88px;height:82px;padding:3px;color:inherit;background:transparent;border:0;box-shadow:none;cursor:pointer;isolation:isolate}.character-filter-options .character-filter-button::after{position:absolute;z-index:-1;right:8px;bottom:2px;left:8px;height:16px;background:radial-gradient(ellipse,rgba(255,205,40,.9) 0,rgba(222,148,0,.42) 38%,transparent 72%);border-radius:50%;content:"";opacity:0;filter:blur(4px);transform:scale(.65);transition:opacity .18s,transform .18s}.character-filter-options .character-filter-button img{position:relative;z-index:1;width:76px;height:76px;object-fit:contain;transition:filter .18s,transform .18s}.character-filter-options .character-filter-button span{display:none}.character-filter-options .character-filter-button:hover{color:inherit;background:transparent;border:0;filter:none}.character-filter-options .character-filter-button:hover img{filter:brightness(1.12);transform:translateY(-1px)}.character-filter-options .character-filter-button.is-selected{color:inherit;background:transparent;border:0;box-shadow:none;filter:none}.character-filter-options .character-filter-button.is-selected::after{opacity:1;transform:scale(1)}.character-filter-options .character-filter-button.is-selected img{filter:brightness(1.08) drop-shadow(0 3px 5px rgba(255,190,0,.28))}
.avatar-picker{text-align:center}.avatar-picker .character-filter-step{display:flex;justify-content:center;margin:5px 0}.avatar-picker .character-filter-options{justify-content:center}.avatar-picker .avatar-options{justify-content:center}.character-filter-options .character-filter-button{width:118px;height:112px}.character-filter-options .character-filter-button img{width:106px;height:106px}.character-filter-options .character-filter-button::after{right:12px;bottom:0;left:12px;height:20px}
.character-filter-options .character-filter-button{width:98px;height:96px}.character-filter-options .character-filter-button img{width:86px;height:86px}.character-filter-options .character-filter-button.is-selected::after{opacity:0}.character-filter-options .character-filter-button.is-selected img{filter:brightness(1.08) drop-shadow(0 0 5px rgba(255,220,70,.95)) drop-shadow(0 0 11px rgba(222,148,0,.7))}
.avatar-picker .character-filter-options--gender{margin-bottom:32px}
.character-filter-options .character-filter-button>.nav-menu-tooltip{display:block;top:calc(100% + 2px);z-index:40;color:#fff;font-size:.74rem;font-weight:700}
.avatar-picker [data-character-card]:not([hidden]){animation:character-card-enter .22s ease-out both}.avatar-picker [data-character-card]>img{transition:opacity .18s ease,transform .22s ease}@keyframes character-card-enter{from{opacity:0;transform:translateY(3px) scale(.975)}to{opacity:1;transform:translateY(0) scale(1)}}@media(prefers-reduced-motion:reduce){.avatar-picker [data-character-card]:not([hidden]){animation:none}.avatar-picker [data-character-card]>img{transition:none}}
.avatar-picker [data-character-card]:not([hidden]){animation:none}.avatar-picker [data-character-card]:not([hidden])>img{animation:character-image-enter .22s ease-out both}@keyframes character-image-enter{from{opacity:0;transform:translateY(3px) scale(.975)}to{opacity:1;transform:translateY(0) scale(1)}}@media(prefers-reduced-motion:reduce){.avatar-picker [data-character-card]:not([hidden])>img{animation:none}}
.registration-wizard [hidden]{display:none!important}.registration-progress{display:flex;align-items:center;justify-content:center;width:min(260px,80%);margin:0 auto 18px}.registration-progress span{display:grid;place-items:center;width:34px;height:34px;color:#8d8778;background:#121212;border:1px solid #514a3a;border-radius:50%;font-weight:800;transition:color .18s,border-color .18s,box-shadow .18s}.registration-progress span.is-active{color:var(--gold);border-color:var(--gold);box-shadow:0 0 9px rgba(255,210,0,.38)}.registration-progress i{flex:1;height:1px;background:#514a3a}.registration-actions{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:18px}.registration-wizard.is-second-step{max-width:620px;margin-right:auto;margin-left:auto}
.fighter.hit .combat-character{animation:fighter-hit-oriented .35s ease}@keyframes fighter-hit-oriented{25%{transform:translateX(-12px) scaleX(var(--fighter-facing));filter:brightness(1.8) sepia(1)}70%{transform:translateX(6px) scaleX(var(--fighter-facing))}100%{transform:translateX(0) scaleX(var(--fighter-facing))}}


/*
 * GUILD PAGE
 */

.guild-page{
    --guild-gold:#f4d51f;
    --guild-gold-soft:#c69c21;
    --guild-text:#ddd6c7;
    --guild-muted:#918d83;
    --guild-surface:#151513;
    --guild-surface-dark:#0c0c0b;
    --guild-line:#403823;
    --guild-line-soft:#2a2821;
    color:var(--guild-text);
    font-size:.84rem;
}

.guild-page *,
.guild-page *::before,
.guild-page *::after{
    box-sizing:border-box;
}

.guild-page .form-control{
    min-width:0;
    color:#ded7ca;
    background:#080808;
    border:1px solid #4a402a;
}

.guild-page .form-control:focus{
    color:#fff;
    background:#0d0d0c;
    border-color:var(--guild-gold);
    box-shadow:0 0 0 .12rem rgba(244,213,31,.13);
}

.guild-page .guild-inline{
    display:flex;
    align-items:stretch;
    gap:8px;
    margin:0;
}

.guild-page .text-muted{
    color:#858d91!important;
}

/* ---------- HERO ---------- */

.guild-hero{
    margin:0;
    padding:14px;
    background:
        radial-gradient(circle at 30% 0,rgba(245,203,40,.035),transparent 38%),
        linear-gradient(180deg,rgba(12,12,11,.96),rgba(7,7,7,.98));
    border-bottom:1px solid #242118;
}

.guild-hero__top{
    display:grid;
    grid-template-columns:84px minmax(0,1fr);
    gap:14px;
}

.guild-emblem{
    position:relative;
    width:76px;
    height:94px;
    display:grid;
    place-items:center;
    margin-top:2px;
    color:#f5d43b;
    background:
        linear-gradient(135deg,rgba(255,255,255,.07),transparent 35%),
        linear-gradient(#641b1b,#2c0d0d);
    border:1px solid #73512a;
    box-shadow:
        inset 0 0 0 3px #27120e,
        inset 0 0 18px rgba(0,0,0,.55),
        0 6px 14px rgba(0,0,0,.65);
    font-family:Georgia,serif;
    font-size:2rem;
    font-weight:700;
}

.guild-emblem::after{
    content:"";
    position:absolute;
    left:11px;
    right:11px;
    bottom:-15px;
    height:24px;
    background:
        linear-gradient(140deg,transparent 49%,#3a1111 50%) left/50% 100% no-repeat,
        linear-gradient(220deg,transparent 49%,#3a1111 50%) right/50% 100% no-repeat;
    filter:drop-shadow(0 2px 0 #694820);
}

.guild-emblem img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.guild-emblem-upload{
    position:absolute;
    right:-6px;
    bottom:4px;
    width:20px;
    height:20px;
}

.guild-emblem-upload label{
    display:grid;
    place-items:center;
    width:100%;
    height:100%;
    margin:0;
    color:#f5d43b;
    background:#000;
    border:1px solid #73512a;
    border-radius:50%;
    font-size:.68rem;
    cursor:pointer;
}

.guild-hero__main{
    min-width:0;
}

.guild-title-row h2{
    margin:0 0 6px!important;
    padding:7px 11px!important;
    color:var(--guild-gold)!important;
    background:#030303!important;
    border:0!important;
    font-size:1.35rem!important;
    font-weight:500!important;
}

.guild-meta-row{
    display:flex;
    flex-wrap:wrap;
    gap:4px 18px;
    padding:0 11px;
    color:#cac3b5;
}

.guild-xp{
    margin-top:8px;
    padding:0 11px;
}

.guild-xp__label{
    display:flex;
    gap:6px;
    align-items:baseline;
}

.guild-xp__label strong{
    color:#e7dfcd;
}

.guild-progress{
    height:5px;
    margin-top:5px;
    overflow:hidden;
    background:#050505;
    border:1px solid #44381c;
    box-shadow:inset 0 1px 3px #000;
}

.guild-progress>span{
    display:block;
    height:100%;
    background:linear-gradient(90deg,#9c7000,#f7d91d);
}

.guild-motto{
    margin-top:13px;
    padding-top:11px;
    border-top:1px solid #28251d;
}

.guild-motto p{
    margin:0;
    padding:4px 10px;
    color:#d0c297;
    font-family:Georgia,serif;
    font-style:italic;
}

.guild-motto__form{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:9px;
}

.guild-motto__form button{
    min-width:92px;
}

.guild-stat-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    margin-top:14px;
    border:1px solid var(--guild-line);
}

.guild-stat-grid article{
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:9px;
    align-items:center;
    min-height:84px;
    padding:10px;
    background:linear-gradient(180deg,#17160f,#0e0e0c);
    border-right:1px solid var(--guild-line);
}

.guild-stat-grid article:last-child{
    border-right:0;
}

.guild-stat-icon{
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    color:#e6c451;
    font-size:1.45rem;
    filter:sepia(.35);
}

.guild-stat-grid small,
.guild-stat-grid strong,
.guild-stat-grid em,
.guild-stat-grid b{
    display:block;
}

.guild-stat-grid small{
    color:#aaa497;
    font-size:.62rem;
    text-transform:uppercase;
}

.guild-stat-grid strong{
    margin:2px 0;
    color:var(--guild-gold);
    font-size:1.15rem;
    line-height:1.1;
}

.guild-stat-grid em{
    color:#a39e93;
    font-size:.67rem;
    font-style:normal;
}

.guild-stat-grid b{
    color:#59bd45;
    font-size:.67rem;
    font-weight:500;
}

/* ---------- SECTIONS ---------- */

.guild-section{
    margin:0;
    border-bottom:1px solid #232019;
}

.guild-section__header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    min-height:42px;
    padding:7px 12px;
    background:linear-gradient(180deg,#050505,#090909);
    border-top:1px solid #1a1915;
    border-bottom:1px solid #171611;
}

.guild-section__header--sub{
    margin-top:14px;
}

.guild-section__header h2{
    margin:0!important;
    padding:0!important;
    color:var(--guild-gold)!important;
    background:none!important;
    border:0!important;
    font-size:1.18rem!important;
    font-weight:500!important;
}

.guild-section__header>div,
.guild-section__header>span{
    color:#bbb5a8;
    font-size:.75rem;
}

.guild-section__header b{
    color:#57c747;
}

/* ---------- MEMBERS ---------- */

.guild-member-table{
    margin:12px 14px 0;
    background:#0b0b0a;
    border:1px solid var(--guild-line-soft);
}

.guild-member-row{
    display:grid;
    grid-template-columns:minmax(145px,1.35fr) minmax(75px,.8fr) 56px minmax(100px,.9fr) minmax(95px,.85fr) 28px;
    gap:8px;
    align-items:center;
    min-height:44px;
    padding:7px 10px;
    background:linear-gradient(180deg,#1a1a18,#121210);
    border-bottom:1px solid #282720;
}

.guild-member-row:nth-child(odd):not(.guild-member-row--head){
    background:linear-gradient(180deg,#171715,#10100f);
}

.guild-member-row:last-child{
    border-bottom:0;
}

/* The 6-column grid needs ~499px min (145+75+56+100+95+28) and .guild-member-table clips
   overflow — on the narrow mobile main column (~198-241px, after the persistent sidebar) the
   last columns, including the ⋮ actions menu, were silently squeezed to 0 width and became
   completely untappable. Level/contribution/last-seen move to the member's own profile page;
   name, rank and the actions menu (always reachable) are what a roster glance actually needs. */
@media(max-width:900px){
    .guild-member-row--head{display:none}
    .guild-member-row:not(.guild-member-row--head){grid-template-columns:1fr auto!important;grid-template-rows:auto auto;row-gap:2px;column-gap:8px}
    .guild-member-row:not(.guild-member-row--head)>:nth-child(1){grid-column:1;grid-row:1}
    .guild-member-row:not(.guild-member-row--head)>:nth-child(2){grid-column:1;grid-row:2;color:var(--guild-muted);font-size:.68rem}
    .guild-member-row:not(.guild-member-row--head)>:nth-child(3),
    .guild-member-row:not(.guild-member-row--head)>:nth-child(4),
    .guild-member-row:not(.guild-member-row--head)>:nth-child(5){display:none!important}
    .guild-member-row:not(.guild-member-row--head)>:nth-child(6){display:flex!important;grid-column:2;grid-row:1/span 2;align-self:center;justify-self:end}
}

.guild-member-row--head{
    min-height:30px;
    color:#aaa59b;
    background:#0a0a09!important;
    font-size:.58rem;
    text-transform:uppercase;
}

.guild-member-name{
    display:flex;
    align-items:center;
    gap:8px;
    min-width:0;
}

.guild-member-name strong{
    overflow:hidden;
    color:var(--guild-gold);
    text-overflow:ellipsis;
    white-space:nowrap;
}

.guild-avatar{
    flex:0 0 29px;
    width:29px;
    height:29px;
    display:grid;
    place-items:center;
    color:#d8bb58;
    background:radial-gradient(circle at 50% 35%,#493829,#17110d);
    border:1px solid #6e552e;
    border-radius:50%;
    font-style:normal;
    font-size:.7rem;
}

.guild-avatar--small{
    flex-basis:30px;
    width:30px;
    height:30px;
}

.guild-crown{
    color:#edcd30;
}

.guild-role{
    color:#5aa8df;
}

.guild-rank-assign select{
    max-width:150px;
}

.guild-member-status{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:6px;
}

.guild-member-status form button{
    padding:0 6px;
    line-height:1.6;
}

.guild-presence{
    display:inline-block;
    width:9px;
    height:9px;
    border-radius:50%;
}

.guild-rank-list{
    display:grid;
    gap:10px;
    margin:8px 14px;
}

.guild-rank-card{
    padding:10px 12px;
    background:#10100e;
    border:1px solid var(--guild-line);
}

.guild-rank-card__head{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:8px;
}

.guild-rank-card__head input[name="name"]{
    max-width:220px;
}

.guild-rank-default{
    display:flex;
    align-items:center;
    gap:4px;
    color:var(--guild-muted);
    font-size:.78rem;
    white-space:nowrap;
}

.guild-rank-permissions{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
    gap:4px 12px;
    margin-bottom:8px;
    color:var(--guild-cream,#ded8ca);
    font-size:.8rem;
}

.guild-rank-permissions label{
    display:flex;
    align-items:center;
    gap:6px;
    margin:0;
    font-weight:400;
}

.guild-presence--online{
    background:#2bce3a;
    box-shadow:0 0 6px rgba(43,206,58,.45);
}

.guild-presence--offline{
    background:#6b7280;
}

.guild-avatar{
    object-fit:cover;
}

.guild-member-tools{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
    margin:8px 14px 0;
}

.guild-member-tools section{
    padding:10px 12px;
    background:linear-gradient(180deg,#171714,#10100e);
    border:1px solid var(--guild-line);
}

.guild-member-tools h3{
    margin:0 0 8px;
    color:var(--guild-gold);
    font-size:.83rem;
    font-weight:600;
    text-transform:uppercase;
}

.guild-member-tools small{
    display:block;
    margin-top:6px;
    color:var(--guild-muted);
    font-size:.67rem;
}

.guild-danger-zone{
    display:grid;
    grid-template-columns:minmax(170px,1fr) minmax(280px,1.4fr);
    gap:12px;
    align-items:center;
    margin:8px 14px 14px;
    padding:9px 12px;
    background:#10100e;
    border:1px solid var(--guild-line);
}

.guild-danger-zone strong,
.guild-danger-zone small{
    display:block;
}

.guild-danger-zone strong{
    color:var(--guild-gold);
    text-transform:uppercase;
}

.guild-danger-zone small{
    color:var(--guild-muted);
}

.guild-member-menu{
    position:relative;
}

.guild-member-menu>.dropdown-toggle{
    min-width:26px;
    padding:0 4px;
    color:var(--guild-muted);
    background:transparent;
    border:0;
    box-shadow:none;
    line-height:1.5;
    font-size:1.1rem;
    appearance:none;
}

.guild-member-menu>.dropdown-toggle::after{
    display:none;
}

.guild-member-menu>.dropdown-toggle:hover,
.guild-member-menu>.dropdown-toggle:focus{
    color:var(--guild-gold);
    border-color:var(--guild-gold-soft);
}

.guild-member-menu .dropdown-menu{
    min-width:190px;
    padding:5px;
    background:var(--guild-surface-dark);
    border:1px solid var(--guild-line);
    box-shadow:0 8px 24px rgba(0,0,0,.55);
}

.guild-member-menu .dropdown-item,
.guild-member-menu .dropdown-item-label{
    display:block;
    padding:7px 9px;
    color:var(--guild-text);
    font-size:.78rem;
    border-radius:2px;
}

.guild-member-menu form{
    margin:0;
}

.guild-member-menu .dropdown-item:hover,
.guild-member-menu .dropdown-item:focus{
    color:var(--guild-gold);
    background:var(--guild-surface);
}

.guild-member-menu .dropdown-item--danger{
    color:#e08a8a;
}

.guild-member-menu .dropdown-item--danger:hover{
    color:#ff9d9d;
    background:#2a1414;
}

.guild-member-menu .dropdown-divider{
    margin:4px 0;
    border-top:1px solid var(--guild-line-soft);
}

.guild-member-menu .dropdown-item-label select{
    width:100%;
    margin-top:4px;
}

/* ---------- BONUSES ---------- */

.guild-bonus-list{
    display:grid;
    gap:4px;
    padding:12px 14px 14px;
}

.guild-bonus-row{
    display:grid;
    grid-template-columns:42px minmax(145px,1.3fr) minmax(120px,.85fr) 82px auto;
    gap:11px;
    align-items:center;
    min-height:62px;
    padding:8px 10px;
    background:linear-gradient(180deg,#1a1a18,#11110f);
    border:1px solid #292820;
}

.guild-bonus-icon{
    display:grid;
    place-items:center;
    width:38px;
    height:38px;
    font-size:1.45rem;
}

.guild-bonus-icon--health{color:#d74343}
.guild-bonus-icon--attack{color:#d6c7a5}
.guild-bonus-icon--defense{color:#6da8cc}

.guild-bonus-copy strong,
.guild-bonus-copy small,
.guild-bonus-effect strong,
.guild-bonus-effect small{
    display:block;
}

.guild-bonus-copy strong{
    color:#eee6d6;
}

.guild-bonus-copy small,
.guild-bonus-effect small{
    color:var(--guild-muted);
    font-size:.66rem;
}

.guild-bonus-level>span{
    font-size:.74rem;
}

.guild-progress--thin{
    height:4px;
}

.guild-bonus-effect strong{
    color:#5cd63c;
}

.guild-max{
    padding:5px 9px;
    color:#bfa9e7;
    background:#2b213a;
    border:1px solid #5d4878;
    font-weight:700;
}

/* ---------- WAR BONUS ---------- */

.guild-war-bonus{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    min-height:70px;
    padding:12px 14px;
    background:linear-gradient(180deg,#121210,#0c0c0b);
}

.guild-war-bonus strong,
.guild-war-bonus small{
    display:block;
}

.guild-war-bonus small{
    color:var(--guild-muted);
}

.guild-timer{
    min-width:150px;
    padding:8px 12px;
    text-align:center;
    background:#11110f;
    border:1px solid var(--guild-line);
}

.guild-timer strong{
    color:var(--guild-gold);
}

/* ---------- WARS ---------- */

.guild-war-capacity{
    padding:6px 10px;
    color:#d7c79d!important;
    background:#11110f;
    border:1px solid var(--guild-line);
}

.guild-war-panel{
    display:grid;
    gap:9px;
    padding:12px 14px 14px;
}

.guild-war-layout{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
}

.guild-war-layout:has(>:only-child)>*{
    grid-column:1 / -1;
}

.guild-war-card{
    padding:12px;
    background:linear-gradient(180deg,#1b1a18,#121210);
    border:1px solid var(--guild-line);
}

.guild-war-card h3{
    margin:0 0 8px;
    color:var(--guild-gold);
    font-size:.83rem;
    font-weight:600;
    text-transform:uppercase;
}

.guild-war-card--declare p{
    margin:0 0 8px;
    color:var(--guild-muted);
    font-size:.78rem;
}

.guild-war-settings-bar{
    padding:10px 12px;
    background:#101010;
    border:1px solid var(--guild-line-soft);
}

.guild-war-upgrade{
    display:flex;
    align-items:center;
    gap:10px;
}

.guild-war-rewards{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:8px;
    color:var(--guild-muted);
    font-size:.72rem;
}

.guild-war-rewards label{
    display:flex;
    align-items:center;
    gap:5px;
    margin:0;
}

.guild-war-rewards select{
    min-width:150px;
}

.guild-war-rewards small{
    color:var(--guild-muted);
    font-size:.66rem;
}

.guild-war-declare{
    padding:10px 12px;
    background:linear-gradient(180deg,#1b1a18,#121210);
    border:1px solid var(--guild-line);
}

.guild-war-declare p{
    margin:0 0 8px;
}

.guild-battle-list{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
    gap:5px!important;
}

.guild-battle-card{
    color:var(--guild-text)!important;
    background:linear-gradient(180deg,#191917,#11110f)!important;
    border:1px solid var(--guild-line)!important;
    border-left-width:3px!important;
    box-shadow:none!important;
}

.guild-battle-card>header{
    background:rgba(255,255,255,.025)!important;
}

.guild-battle-card-body{
    color:#b9b3a8;
}

.guild-status-pill{
    font-size:.62rem!important;
}

/* ---------- RAID ---------- */

.guild-raid{
    padding:12px 14px 14px!important;
}

.guild-raid-status{
    margin-top:10px;
}

.guild-action-card{
    color:var(--guild-text)!important;
    background:linear-gradient(180deg,#1b1a18,#121210)!important;
    border:1px solid var(--guild-line)!important;
    border-left:1px solid var(--guild-line)!important;
}

.guild-raid-chip{
    color:#ddd7ca;
    background:#24221c!important;
    border:1px solid #3b372b;
}

.guild-subheading{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin:13px 0 7px;
}

.guild-subheading h3{
    margin:0;
    color:var(--guild-gold);
    font-size:1.05rem;
}

.guild-subheading span{
    color:var(--guild-muted);
    font-size:.7rem;
}

.guild-raid-history{
    display:grid;
    gap:4px;
}

.guild-raid-row{
    display:grid;
    grid-template-columns:85px 64px minmax(120px,1fr) minmax(135px,1.1fr) 78px auto;
    gap:8px;
    align-items:center;
    min-height:42px;
    padding:7px 9px;
    background:linear-gradient(180deg,#191917,#11110f);
    border:1px solid var(--guild-line);
}

/* ---------- CHAT ---------- */

.guild-chat{
    padding:12px 14px 15px!important;
}

.guild-messages{
    max-height:300px;
    overflow:auto;
    color:var(--guild-text)!important;
    background:#10100f!important;
    border:1px solid var(--guild-line)!important;
}

.guild-messages p{
    display:flex;
    gap:9px;
    margin:0;
    padding:8px 10px!important;
    border-bottom:1px solid #29271f!important;
}

.guild-messages p:last-child{
    border-bottom:0!important;
}

.guild-messages p>span:last-child{
    min-width:0;
}

.guild-messages b{
    color:#e4dbca;
}

.guild-messages small{
    margin-left:5px;
    color:#8f8a80!important;
}

.guild-messages em{
    display:block;
    color:#ddd6c7;
    font-style:normal;
}

.guild-chat-form{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:9px;
    margin-top:8px;
}

.guild-bonus-icon .web-icon{
    width:42px;
    height:42px;
    object-fit:contain;
}

.guild-stat-icon .web-icon{
    width:42px;
    height:42px;
    object-fit:contain;
}

/* ---------- RESPONSIVE ---------- */

@media(max-width:900px){
    .guild-stat-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .guild-stat-grid article:nth-child(2){
        border-right:0;
    }

    .guild-stat-grid article:nth-child(-n+2){
        border-bottom:1px solid var(--guild-line);
    }

    /* Superseded by the .guild-member-row rule at ~line 978 (also covers max-width:900px, and
       repositions the actions menu instead of hiding it). */

    .guild-bonus-row{
        grid-template-columns:38px minmax(135px,1.2fr) minmax(110px,.8fr) auto;
    }

    .guild-bonus-effect{
        display:none;
    }

    .guild-raid-row{
        grid-template-columns:80px 62px minmax(120px,1fr) auto;
    }

    .guild-raid-row>span:nth-child(4),
    .guild-raid-row>span:nth-child(5){
        display:none;
    }
}

@media(max-width:700px){
    .guild-hero__top{
        grid-template-columns:58px minmax(0,1fr);
    }

    .guild-emblem{
        width:54px;
        height:70px;
        font-size:1.45rem;
    }

    .guild-motto__form,
    .guild-chat-form{
        grid-template-columns:1fr;
    }

    .guild-member-tools{
        grid-template-columns:1fr;
    }

    .guild-danger-zone{
        grid-template-columns:1fr;
    }

    .guild-war-info,
    .guild-war-bonus{
        align-items:flex-start;
        flex-direction:column;
    }

    .guild-bonus-row{
        grid-template-columns:34px minmax(120px,1fr) auto;
    }

    .guild-bonus-level{
        grid-column:2 / -1;
    }
}

@media(max-width:520px){
    html:not(.is-phone) .guild-stat-grid{
        grid-template-columns:1fr;
    }

    html:not(.is-phone) .guild-stat-grid article{
        border-right:0;
        border-bottom:1px solid var(--guild-line);
    }

    html:not(.is-phone) .guild-stat-grid article:last-child{
        border-bottom:0;
    }

    .guild-war-declare .guild-inline,
    .guild-member-tools .guild-inline,
    .guild-danger-zone .guild-inline{
        flex-direction:column;
    }

    .guild-raid-row{
        grid-template-columns:75px 62px 1fr;
    }

    .guild-raid-row a{
        grid-column:1 / -1;
    }
}

.guild-replay-progress{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-bottom:10px;
    padding:6px 11px;
    color:#ded8ca;
    background:linear-gradient(180deg,#201c13,#131313);
    border:1px solid #4b4434;
    border-radius:4px;
    font-weight:700;
}

.guild-replay-progress-icon .web-icon{
    width:20px;
    height:20px;
    vertical-align:-4px;
}

.guild-replay-progress.is-finished{
    border-color:#9b7900;
    box-shadow:inset 0 0 0 1px rgba(249,209,4,.12);
}

.notification-tabs{
    display:inline-flex;
    gap:4px;
    padding:4px;
    background:#0d0d0d;
    border:1px solid #4b4434;
    border-radius:6px;
}

.notification-tab{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:40px;
    height:40px;
    padding:0 8px;
    color:var(--game-muted,#aaa394);
    border-radius:4px;
    text-decoration:none;
    transition:background-color .15s,color .15s;
}

.notification-tab .web-icon{
    width:36px;
    height:36px;
    vertical-align:middle;
}

.notification-tab:hover,
.notification-tab:focus{
    color:#fff;
    background:#272114;
    outline:none;
    text-decoration:none;
}

.notification-tab.is-active{
    color:#111;
    background: rgba(249,209,4,.16);
    box-shadow:0 2px 6px rgba(0,0,0,.35);
}

/* Questy — karty + detail (výběr obtížnosti) */
.quest-intro p{margin:0 0 6px}
.quest-cards{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:16px}
.quest-card{position:relative;flex:1 1 220px;min-width:200px;height:250px;padding:0;overflow:hidden;color:#fff;text-align:left;background-color:#1a1a1a;background-position:center;background-size:cover;border:2px solid var(--game-line);cursor:pointer}
.quest-cards .quest-card:hover,.quest-cards .quest-card:focus{background-position:center center;background-size:cover}
.quest-card::before{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.1) 0%,rgba(0,0,0,.55) 55%,rgba(0,0,0,.92) 100%);content:""}
.quest-card.is-selected{border-color:var(--gold);box-shadow:0 0 0 2px rgba(249,209,4,.35)}
.quest-card.is-locked{filter:grayscale(.5)}
.quest-card-body{position:relative;z-index:1;display:flex;height:100%;flex-direction:column;justify-content:flex-end;padding:12px;gap:2px}
.quest-card-type{color:var(--gold);font-size:.7rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.quest-card-body h3{margin:2px 0;color:#fff;font-size:1.05rem}
.quest-card-stars{color:var(--gold);font-size:.85rem;letter-spacing:1px}
.quest-card-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px;color:#e4e0d2;font-size:.72rem}
.quest-card-locked-note{margin-top:4px;color:#e08a8a;font-size:.7rem;font-weight:700}
.quest-detail-panel{padding:16px;background:var(--game-surface);border:1px solid var(--game-line)}
.quest-detail-panel.is-hidden{display:none}
.quest-detail-level{margin:2px 0 0;color:var(--game-muted);font-size:.8rem}
.quest-drop-hint{display:flex;align-items:center;gap:6px;margin:6px 0 0}
.quest-drop-hint-icon{width:20px;height:20px;object-fit:contain}
.quest-approach-options{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0}
.quest-approach-option{flex:1 1 160px;padding:10px;text-align:center;background:rgba(255,255,255,.02);border:1px solid var(--game-line);cursor:pointer}
.quest-approach-option input{position:absolute;opacity:0;pointer-events:none}
.quest-approach-icon{display:block;width:36px;height:36px;margin:0 auto 4px;object-fit:contain}
.quest-approach-option b{display:block;margin-bottom:4px;color:var(--game-cream)}
.quest-approach-option small{color:var(--game-muted)}
.quest-approach-option.is-selected{border-color:var(--gold);background:rgba(249,209,4,.08)}
.quest-war-preference{display:flex;align-items:center;gap:8px;margin:0 0 10px;color:var(--game-muted);font-size:.78rem;font-weight:400;cursor:pointer}
.quest-approach-option.is-selected b{color:var(--gold)}
.quest-preview-grid{margin:10px 0 14px}
.quest-preview-values{display:flex;flex-wrap:wrap;align-items:center;gap:14px;padding:10px 12px;background:rgba(255,255,255,.03);border:1px solid var(--game-line);font-weight:700}
.quest-preview-time{display:inline-flex;align-items:center;gap:5px;flex-wrap:wrap}.quest-preview-time small{flex-basis:100%;color:#7fb4dc;font-size:.68rem;font-weight:600}
.quest-preview-risk{color:#e08a8a}
@media(max-width:700px){
/* Mobilni "vejir": karty se prekryvaji v jedne rade, aktivni (vybrana) je vzdy navrch — DOM i JS
   (quests.js) jsou pro desktop i mobil stejne, meni se jen vzhled pres tuto media query. */
/* Na mobilu stoji hlavni obsah vedle pevneho 96px postranniho sloupce se staty (viz
   .mobile-dashboard-sidebar, layouts/app.blade.php) — realna sirka pro obsah je jen cca
   200-250px, ne cela sirka displeje. Karty i tlacitka jsou proto vyrazne uzsi nez na desktopu. */
/* .quest-card ma na desktopu min-width:200px jako SAMOSTATNOU vlastnost (mimo "flex" zkratku) —
   bez explicitniho prebiti by tahle podlaha vyhrala nad nizsim width tady a karty by pretekaly
   mimo uzky mobilni obsah (viz .mobile-dashboard-sidebar vedle, realna sirka jen ~220-250px). */
.quest-cards{flex-wrap:nowrap;justify-content:center;padding:6px 0 10px}
.quest-cards .quest-card{flex:0 0 auto;width:80px;min-width:0;height:142px;margin-left:-28px;box-shadow:0 4px 10px rgba(0,0,0,.55)}
.quest-cards .quest-card:first-child{margin-left:0}
.quest-cards .quest-card.is-selected{z-index:5;transform:translateY(-8px) scale(1.12);box-shadow:0 8px 18px rgba(0,0,0,.7)}
.quest-card-meta{display:none}
.quest-card-body{padding:5px}
.quest-card-type{font-size:.5rem}
.quest-card-body h3{margin:1px 0;font-size:.62rem;line-height:1.08}
.quest-card-stars{font-size:.55rem}
.quest-card-locked-note{font-size:.52rem}

/* Detail panelu: "1 radek = 1 radek" — cas/cena hned pod kartami, pak vyber pristupu jako 3 uzka
   tlacitka v jedne rade, popis+nalez, start dole. Hlavicka s typem/nazvem/hvezdickami je na mobilu
   redundantni (uz je videt na aktivni karte nahore), takze se skryje. */
.quest-detail-panel{display:flex;flex-direction:column;padding:10px}
.quest-detail-head{display:none}
.quest-detail-panel>p{order:3}
.quest-preview-grid{order:1;margin:0 0 10px}
.quest-preview-values{gap:6px;padding:6px 8px;font-size:.72rem}
.quest-approach-options{order:2;flex-wrap:nowrap;gap:4px;margin:0 0 10px}
.quest-approach-option{flex:1 1 0;min-width:0;padding:6px 2px;border:0;background:rgba(255,255,255,.03)}
.quest-approach-option.is-selected{border:0;background:rgba(249,209,4,.18);box-shadow:inset 0 0 0 1px rgba(249,209,4,.35),0 0 10px rgba(249,209,4,.45)}
.quest-approach-option small{display:none}
.quest-approach-icon{width:22px;height:22px}
.quest-approach-option b{font-size:.68rem}
.quest-detail-panel>form{order:4;text-align:center;margin-top:.5rem}
}

/* Questy — aktivní výprava (trasa + deník) */
.quest-active-hero{position:relative;overflow:hidden;min-height:180px;margin-bottom:14px;background-position:center;background-size:cover;border:1px solid var(--game-line)}
.quest-active-hero::before{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.15),rgba(0,0,0,.85));content:""}
.quest-active-hero-body{position:relative;z-index:1;padding:16px;color:#fff}
.quest-active-hero-body h2{margin:0 0 4px}
.quest-active-countdown{font-size:1.6rem;font-weight:800;color:var(--gold)}
.quest-active-meta{display:flex;flex-wrap:wrap;gap:14px;margin-top:6px;color:#e4e0d2;font-size:.82rem}
.quest-route{position:relative;display:flex;justify-content:space-between;margin:18px 0;padding:14px 6px 26px;background:linear-gradient(rgba(9,9,9,.6),rgba(9,9,9,.6)),url('../uploads/quests/pergamen.jpg') center/cover no-repeat;border:1px solid var(--game-line)}
.quest-route::before{position:absolute;top:28px;right:6%;left:6%;height:2px;background:var(--game-line);content:""}
.quest-route-stop{position:relative;z-index:1;display:flex;flex:1;flex-direction:column;align-items:center;text-align:center}
.quest-route-dot{position:relative;display:flex;width:28px;height:28px;align-items:center;justify-content:center}
.quest-route-icon{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 2px 3px rgba(0,0,0,.6))}
.quest-route-icon--done{opacity:0}
.quest-route-stop.is-done .quest-route-icon--locked,.quest-route-stop.is-current .quest-route-icon--locked{opacity:0}
.quest-route-stop.is-done .quest-route-icon--done,.quest-route-stop.is-current .quest-route-icon--done{opacity:1}
.quest-route-stop.is-current .quest-route-dot{filter:drop-shadow(0 0 6px rgba(249,209,4,.85))}
.quest-route-label{margin-top:6px;color:var(--game-muted);font-size:.72rem;font-weight:700}
.quest-route-stop.is-done .quest-route-label,.quest-route-stop.is-current .quest-route-label{color:var(--gold)}
.quest-route-marker{position:absolute;top:-6px;width:26px;height:26px;object-fit:contain;filter:drop-shadow(0 0 6px rgba(249,209,4,.75));transition:left .4s linear;transform:translateX(-50%)}
.quest-journal{display:flex;flex-direction:column;gap:0;margin-bottom:14px;background:linear-gradient(rgba(9,9,9,.7),rgba(9,9,9,.7)),url('../uploads/quests/pergamen.jpg') center/cover no-repeat;border:1px solid var(--game-line)}
.quest-journal-entry{display:none;padding:9px 12px;border-bottom:1px solid var(--game-line);font-size:.85rem}
.quest-journal-entry:last-child{border-bottom:0}
.quest-journal-entry.is-revealed{display:flex;gap:10px}
.quest-journal-entry time{flex:0 0 52px;color:var(--game-muted);font-size:.75rem}
.quest-journal-entry b{color:var(--gold)}
.quest-recall-box{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:12px;background:rgba(255,255,255,.02);border:1px solid var(--game-line)}

/* Questy — návratová obrazovka */
.quest-return{position:relative;z-index:0;padding:24px 0 0;color:#fff;background-position:center;background-size:cover;border:2px solid var(--game-line)}
.quest-return::before{position:absolute;z-index:-1;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.3) 0%,rgba(0,0,0,.5) 60%,rgba(0,0,0,.85) 100%);content:""}
.quest-return-hero{text-align:center;padding:0 16px 16px}
.quest-return-badge{display:inline-block;margin-bottom:10px;padding:3px 10px;color:var(--gold);font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:rgba(20,16,4,.55);border:1px solid var(--game-line)}
.quest-return-badge.is-failed{color:#e0836f;background:rgba(30,10,6,.55);border-color:#6a4030}
.quest-return h2{margin:0;color:var(--game-cream);font-size:1.2rem;text-shadow:0 2px 4px rgba(0,0,0,.85)}
.quest-return-card{padding:14px 16px 20px;text-align:center;background:rgba(10,12,16,.82);border-top:1px solid var(--game-line)}
.quest-return-card>p{text-shadow:0 1px 3px rgba(0,0,0,.85)}
.quest-return-rewards{display:flex;flex-wrap:wrap;justify-content:center;gap:24px;margin:18px 0}
.quest-return-rewards div{min-width:90px;font-weight:800;font-size:1.2rem}
.quest-return-rewards small{display:block;margin-top:2px;color:var(--game-muted);font-size:.7rem;font-weight:400}
.quest-return-levelup{color:#53c878}
.quest-return-loot{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:18px 0}
.quest-return-loot img{width:100%;height:100%;padding:8px;box-sizing:border-box;object-fit:contain}
.sidebar-pet-panel{position:relative;margin-top:12px;min-height:92px;padding:8px 10px;display:flex;align-items:center;gap:10px;color:#ddd;background:linear-gradient(135deg,rgba(19,19,19,.96),rgba(46,39,27,.96));border:1px solid #6f5b32;box-shadow:inset 0 0 0 2px #17130d,0 3px 10px #0008;cursor:pointer}.sidebar-pet-panel>img{width:76px;height:76px;object-fit:contain;filter:drop-shadow(0 5px 6px #000)}.sidebar-pet-panel>div{display:flex;min-width:0;flex:1;flex-direction:column}.sidebar-pet-panel strong{color:#f2ce39;font-size:1.08rem}.sidebar-pet-panel small{color:#9f9b92}.sidebar-pet-panel b{color:#72d99b}.sidebar-pet-panel .btn{padding:3px 6px;font-size:.72rem}.sidebar-pet-panel:hover,.sidebar-pet-panel:focus{border-color:#d1a923;outline:none;box-shadow:inset 0 0 12px #d1a92322,0 3px 10px #0008}.pet-name-preview{display:block;width:120px;height:120px;object-fit:contain;margin:0 auto 10px}.pet-popover .popover-stat{margin-top:8px}
.sidebar-pet-panel .sidebar-pet-actions{flex:0 0 auto;gap:5px}.pet-skin-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}.pet-skin-card{padding:12px;text-align:center;background:#111;border:1px solid #51472b;box-shadow:inset 0 0 12px #000}.pet-skin-card.is-selected{border-color:var(--gold);box-shadow:inset 0 0 18px #d1a92324,0 0 10px #d1a92333}.pet-skin-main{display:block;width:130px;height:130px;margin:0 auto 5px;object-fit:contain;filter:drop-shadow(0 7px 6px #000)}.pet-skin-card>strong{display:block;color:var(--gold);margin-bottom:8px}.pet-skin-states{display:grid;grid-template-columns:repeat(5,1fr);gap:3px;margin-bottom:10px}.pet-skin-states img{width:100%;aspect-ratio:1;object-fit:contain;background:#080808;border:1px solid #312a1a}.pet-skin-active{display:inline-block;padding:6px 10px;color:#72d99b;border:1px solid #397455}.pet-skins-empty{margin:16px 0 0;padding:12px;text-align:center;color:var(--game-muted);background:#15120c;border:1px dashed #66562f}
.pet-manage-button{display:grid;width:36px;height:36px;padding:0;place-items:center;color:var(--gold);background:#111;border:1px solid #6f5b32;border-radius:50%;font-size:1.25rem;line-height:1;cursor:pointer}.pet-manage-button:hover,.pet-manage-button:focus{color:#fff;border-color:var(--gold);box-shadow:0 0 10px #d1a92355;outline:none}.pet-training-panel{display:grid;grid-template-columns:150px 1fr;gap:18px;margin-bottom:18px;padding:14px;background:#101010;border:1px solid #594b34}.pet-training-panel>img{width:150px;height:150px;object-fit:contain;filter:drop-shadow(0 8px 8px #000)}.pet-training-panel h3,.pet-manage-section-title{color:var(--gold)}.pet-current-bonuses{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}.pet-current-bonuses b{padding:5px 8px;color:#ddd;background:#191919;border:1px solid #443b29}.pet-current-bonuses span{color:#72d99b}.pet-training-max{display:inline-block;padding:7px 10px;color:#72d99b;border:1px solid #397455}.pet-inline-name{display:grid;grid-template-columns:1fr auto;gap:8px;margin-bottom:18px;padding:12px;background:#15120c;border:1px solid #51472b}.pet-inline-name label{margin:0}.pet-inline-name small{grid-column:1/-1;color:var(--game-muted)}@media(max-width:600px){.pet-training-panel{grid-template-columns:1fr}.pet-training-panel>img{margin:auto}}
.pet-treat-targets{display:grid;gap:8px}.pet-treat-targets form{display:flex;align-items:center;gap:12px;padding:8px;background:#111;border:1px solid #51472b}.pet-treat-targets img{width:64px;height:64px;object-fit:contain}.pet-treat-targets span{display:flex;flex:1;flex-direction:column}.pet-treat-targets strong{color:var(--gold)}.pet-treat-targets small{color:#72d99b}
.pet-inventory-item>img{filter:drop-shadow(0 4px 4px #000)}
.arena-hunted-card{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;padding:12px 16px;border:1px solid #b74e32;background:linear-gradient(100deg,#24110e,#141414);box-shadow:inset 4px 0 #da633e}.arena-hunted-card>div{display:flex;flex-direction:column}.arena-hunted-card b,.hunted-badge{color:#ff7653;letter-spacing:.12em}.arena-hunted-card strong{color:#f3cf3d;font-size:1.25rem}.arena-hunted-card small{color:#bdb6ad}.arena-aggression{margin-bottom:14px;padding:8px 12px;border:1px solid #594b34;background:#151515}.arena-aggression summary{cursor:pointer;color:#d4b65b}.arena-aggression ol{margin:8px 0 0;padding-left:22px}.arena-aggression li{display:flex;justify-content:space-between}.arena-player--hunted{border-color:#cb5638!important;box-shadow:inset 0 0 15px #a72d1d55}.hunted-badge{font-style:normal;font-size:.65em;border:1px solid #a93f29;padding:2px 5px}
.pet-summon-modal .modal-body{text-align:center}.pet-summon-modal .modal-body>img{width:150px;height:150px;object-fit:contain;filter:drop-shadow(0 7px 8px #000)}.pet-summon-modal .modal-body>strong,.pet-summon-modal .modal-body>small{display:block}.pet-summon-modal .modal-body>strong{color:#70d59a;font-size:1.1rem}.pet-summon-modal .modal-body>small{margin-top:8px;color:#aaa}

/* Mobilní hlavní stránka (/hra) — taby Postava|Inventář|Sklad, viz CONCEPT.md "Mobilní kompatibilita".
   Vykreslí se jen na phone layoutu (DetectLayout middleware), nikdy současně s desktop markupem
   — žádné dvojí ID formulářů, jen jiný strom místo dvou v jednom. */
.mobile-dashboard-row{display:flex;align-items:flex-start;gap:8px}
.mobile-dashboard-main{flex:1 1 auto;min-width:0}
.mobile-card--pinned{margin-bottom:8px}
.mobile-card{display:none}
.mobile-card.is-active{display:block}
.mobile-equipment-wrap{max-width:420px;margin:0 auto}
/* Base .equipment-column grid reserves a 4th, always-empty grid column (trailing "." in every
   grid-template-areas row) — on desktop that gap blends into the space before the inventory grid
   next to it, but standing alone on mobile it just shifts the visible 3 real columns off-center.
   Scoped to the mobile wrap only: drop to 3 real columns so the block has no phantom gutter. */
.mobile-equipment-wrap .equipment-column{width:min(340px,100%);aspect-ratio:3/4;margin:0 auto;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-areas:"back head neck" "weapon torso off_hand" "hands belt ring" "special1 feet special2"}

/* Karty i postranní sloupec sdílejí stejný rámovaný panel jako desktopový sidebar
   (viz layouts/app.blade.php #game-sidebar-panel) — <x-tall-frame-panel>, sidebar-tall-test
   9-slice assety. Řeší jak vizuální jednotu s mockupem (tmp/redesign/mobile.png), tak čitelnost
   textu (middle-center má vlastní tmavé pozadí místo přímo na busy pozadí stránky). */
.mobile-card .sidebar-tall-test,.mobile-dashboard-sidebar .sidebar-tall-test,.mobile-dashboard-main>.sidebar-tall-test{width:100%}
.mobile-card .sidebar-tall-test__body,.mobile-dashboard-main>.sidebar-tall-test .sidebar-tall-test__body{color:#d7d0c4;background:transparent}
.tall-frame-title{margin:10px 0 8px;color:var(--gold);font-size:calc(1.05rem + 3px);text-align:center}
.mobile-content-actions{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}

/* Mobilni "Zobrazit vice/mene" (viz public/js/intro-toggle.js) - full text je skryty dokud
   .intro-text nema .is-expanded. Na desktopu skript vubec nebezi (html.is-phone check), takze
   tahle pravidla tam nic neovlivni. */
.intro-text-full{display:none}
.intro-text.is-expanded .intro-text-full{display:inline}
.intro-text.is-expanded .intro-text-more{display:none}
.intro-text-toggle{color:var(--gold);font-weight:700;text-decoration:none;white-space:nowrap}
.intro-text-toggle:hover,.intro-text-toggle:focus{text-decoration:underline}

/* Persistentní postranní sloupec se staty (viz tmp/redesign/mobile.png) — vidět na všech
   kartách, ne jen na Postavě, protože je mimo .mobile-card přepínání. */
.mobile-dashboard-sidebar{flex:0 0 96px;width:96px}
/* Mimo /hra sidebar neni postranni sloupec, ale tenky pruh mena/notifikaci nad plnou sirkou
   hlavniho obsahu - viz layouts/app.blade.php $isMobileDashboard. Bez tohohle by hlavni obsah
   na kazde jine strance zustal natrvalo stlaceny na ~240px vedle 96px sloupce. Tridy sedi na
   #game-main-panel/#game-sidebar-panel (ne na .mobile-dashboard-row), aby fungovaly i po AJAX
   navigaci - viz komentar v layouts/app.blade.php. flex-wrap:wrap na radku dovoli oběma
   full-width potomkum spadnout na dalsi radek bez nutnosti flex-direction:column. */
/* flex-wrap jen kdyz je sidebar v kompaktnim rezimu - napevno by na /hra dovolil radku
   zalamovat misto aby se .mobile-dashboard-main (min-width:0) prirozene smrstil na sirku vedle
   96px sloupce, protoze pripnuta Vybava/inventar maji vlastni min-sirku vetsi nez ~240px. */
.mobile-dashboard-row:has(.mobile-dashboard-sidebar--compact){flex-wrap:wrap}
.mobile-dashboard-main--full{flex:1 1 100%;width:100%}
.mobile-dashboard-sidebar--compact{order:-1;flex:1 1 100%;width:100%;margin-bottom:8px}
html.is-phone .mobile-dashboard-sidebar--compact .mobile-sidebar-topline{flex-direction:row;align-items:center;justify-content:space-between;padding:8px 14px;margin-bottom:0;border:1px solid var(--game-line,#4b4434);background:#151515}
html.is-phone .mobile-dashboard-sidebar--compact .mobile-sidebar-currency{flex-direction:column;align-items:flex-start;gap:2px}
html.is-phone .mobile-dashboard-sidebar--compact .mobile-sidebar-utility{padding:0 0 0 14px;border-top:0;border-left:1px solid var(--game-line,#4b4434);width:auto}
/* Zkusi se vejit na jeden radek (jmeno + Lv.), a pokud ne, flex-wrap ho rozdeli na dva
   radky - justify-content:center pak centruje oba radky zvlast. */
.mobile-dashboard-sidebar .sidebar-name-row{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:center;gap:4px;margin:0 0 6px;text-align:center}
.mobile-dashboard-sidebar .sidebar-name-row{color:#d8d3c4;font-size:.72rem;font-weight:700}
.mobile-dashboard-sidebar .sidebar-level{color:var(--gold);font-size:.62rem}
.mobile-sidebar-avatar{width:44px;height:44px;margin:2px auto 6px;overflow:hidden;border:2px solid var(--gold);border-radius:50%}
.mobile-sidebar-avatar img{width:100%;height:100%;object-fit:cover}
.mobile-dashboard-sidebar .content{padding:0;margin-bottom:6px}
.mobile-dashboard-sidebar .stat-bar{margin-bottom:4px}
.mobile-dashboard-sidebar .stat-bar b{font-size:.55rem}
.mobile-dashboard-sidebar .sidebar-stats{display:block}
.mobile-dashboard-sidebar .sidebar-stats-combat,.mobile-dashboard-sidebar .sidebar-stats-raw{margin:0}
.mobile-dashboard-sidebar .sidebar-stats dl>div{justify-content:center;padding:3px 0}
.mobile-dashboard-sidebar .sidebar-stats dt{font-size:0}
.mobile-dashboard-sidebar .sidebar-stats dt .web-icon{width:16px;height:16px}
.mobile-dashboard-sidebar .sidebar-stats dd{font-size:.68rem}
/* Mobilni inventar (preset="inventory-only") chce sloupce vyplnujici sirku karty, ne pevnou
   --slot-size v px — jinak by na uzkem telefonu bud pretekaly, nebo nechavaly mezery.
   .slot-grid.mobile-inventory-grid[>.slot-cell] ma stejnou specificitu jako generic pravidlo
   ".slot-grid:not(.character-inventory-board)[>.slot-cell]" a je v souboru pozdeji, takze vyhraje. */
.slot-grid.mobile-inventory-grid{grid-template-columns:repeat(var(--slot-columns),minmax(0,1fr))}
.slot-grid.mobile-inventory-grid>.slot-cell{width:auto;height:auto;aspect-ratio:1/1;min-height:0}
/* Přepínač Inventář|Sklad|Úschovna žije v běžném toku stránky (ne fixed-bottom) hned pod
   natrvalo zobrazenou kartou Výbava — žádné mobilní viewport/toolbar komplikace. */
.mobile-tabbar{display:flex;margin-bottom:8px;background:#0d0d0d;border:1px solid var(--game-line)}
.mobile-tabbar-btn{position:relative;display:flex;flex:1;flex-direction:column;align-items:center;gap:2px;padding:8px 4px 6px;color:#9a948a;background:none;border:0;text-decoration:none;font-size:.68rem}
.mobile-tabbar-btn .web-icon{width:22px;height:22px}
.mobile-tabbar-btn.is-active{color:var(--gold)}
/* Behem Click & Carry / touch-selectu ma platny cil i skryta karta (Inventar<->Sklad sdili
   jeden DOM, viz inventory-dnd.js markTabTargets) — rozsviti tlacitko te karty jemnym pulzem,
   aby hrac vedel, ze tam ma prepnout dokoncit presun. */
.mobile-tabbar-btn.tab-has-target{color:var(--gold);animation:tab-target-pulse 1.8s ease-in-out infinite}
@keyframes tab-target-pulse{0%,100%{box-shadow:inset 0 0 0 1px rgba(249,209,4,.35)}50%{box-shadow:inset 0 0 0 1px rgba(249,209,4,.75)}}

/* Phone layout — compact controls. Buttons size themselves in px (min-height/padding), so the
   html.is-phone root font-size scale above doesn't touch their footprint, only the text inside.
   Leaves --control-cap/background-size alone (the ornate corner art proportions), only tightens
   the box around it. */
html.is-phone .game-shell .btn:not(.nav-inbox):not(.merchant-sell),
html.is-phone .btn.game-button.daily-reward-claim{
    min-height:32px;
    padding:5px 12px 6px;
    font-size:.85rem;
}
html.is-phone .game-shell .btn-sm:not(.nav-inbox){
    min-height:26px;
    padding:3px 9px 4px;
    font-size:.7rem;
}
html.is-phone .game-shell .btn-lg:not(.nav-inbox){
    min-height:38px;
    padding:6px 15px 7px;
}

/* Cvičitel: .training-description ma height:22px!important, ale delsi popisky se lamou na 2
   radky a s overflow:visible pak jednoduse prekryvaly patičku pod sebou — na uzkem mobilnim
   sloupci (vedle .mobile-dashboard-sidebar) to bylo nejvic vidět. Patička jde na mobilu pod sebe
   misto vedle sebe, popis smí byt vysoký kolik potrebuje. */
@media(max-width:700px){
.training-list{gap:6px}
.training-row{padding:6px 8px}
.training-row-head{gap:6px}
.training-row h3{font-size:.85rem}
.training-row-foot{flex-direction:column;align-items:flex-start;gap:2px;margin-top:4px}
.training-description{height:auto!important;font-size:.7rem}
.training-price-preview{margin-left:0;font-size:.7rem}
.training-actions{gap:3px;justify-content:space-between;width:100%}
/* Existujici @media(max-width:575px) o par radku vyse (flex:1 1 auto na formu + width:100% na
   tlacitko) je z doby pred timto sloupcem — na aktualnim uzkem mobilu z toho vzniklo 4 mala
   tlacitka + 1 osamele natazene na celou sirku. Vratit na prirozenou sirku podle obsahu a
   zmensit, aby se vsech 5 (+1/+5/+10/+20/+50) veslo do jedne rady. */
.training-actions form{flex:0 0 auto}
/* !important nutne — html.is-phone .game-shell .btn... ma vyssi specificitu (2x :not()) nez
   .training-actions button a bez toho by pretlacil font-size/min-height/padding zpatky nahoru. */
.training-actions button{width:auto!important;min-width:0!important;min-height:34px!important;padding:3px 7px!important;font-size:.66rem!important}
.training-group-heading{font-size:.85rem;margin:14px 0 6px}
/* Cena tlacitka se na desktopu ukazuje jen pres hover (pointerover/pointerout) — na dotykovem
   zarizeni hover neexistuje (tuknuti = rovnou klik), takze misto skryte hover-preview zobrazime
   cenu natrvalo jako druhy radek primo v tlacitku. */
.training-price-preview{display:none!important}
.training-amount-price{display:flex;align-items:center;gap:2px;color:var(--gold);font-size:.56rem;font-weight:400}
.training-amount-price .web-icon{width:9px;height:9px}
/* Tlacitka uz s cenou (druhy radek) na mobilu nevejde vsech 5 do jedne rady — skryje se
   nejvetsi/posledni moznost kazde skupiny (+50 u bojovych atributu, +5 u ostatnich s
   [1,2,3,4,5], viz TrainerController::index). */
.training-actions form:last-child{display:none}
}

/* Mobilni tabbar (Inventar|Sklad|Uschovna): pocet predmetu v uschovne misto samostatneho
   alertu s tlacitkem "Otevrit uschovu" (ten na mobilu zabiral misto navic, kdyz uschovna uz
   je jeden z tabu). */
html.is-phone .mobile-tabbar-btn{position:relative}
html.is-phone .mobile-tabbar-badge{position:absolute;top:2px;right:calc(50% - 26px);display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;padding:0 3px;color:#1a1a1a;background:var(--gold);border-radius:8px;font-size:.6rem;font-weight:700;line-height:1}

/* Skladiste na mobilu: stejny 4-sloupcovy fluidni layout jako .mobile-inventory-grid a Trznice ->
   Moje prodeje -> inventarni vyber (misto puvodnich pevnych 10 sloupcu po 62px, ktere na
   uzkem mobilu pretekaly mimo obrazovku). Sklad se pouziva na desktopu i mobilu (stejny partial),
   proto je vyjimka za html.is-phone, ne trvale jako u mobile-inventory-grid. */
html.is-phone .warehouse-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
html.is-phone .warehouse-grid>.slot-cell{width:auto;height:auto;aspect-ratio:1/1;min-height:0}

/* Arena — hunted karta na mobilu: cas nahoru, pod nim puvodni poradi (HUNTED, jmeno, popis). */
html.is-phone .arena-hunted-card{flex-direction:column;align-items:stretch;gap:6px}
html.is-phone .arena-hunted-card time{order:-1;align-self:flex-start}

/* Arena — vypis hracu na mobilu: "Level X" a "Y vyher / Z porazek" na dva radky misto jednoho
   spojeneho pres " · ", jmeno vyrazneji velke, HUNTED odznak nad jmenem, tlacitko Zautocit uz
   nema smysl roztahovat na celou sirku radku. */
html.is-phone .arena-player-name{display:block;font-size:18px}
html.is-phone .arena-player h3{display:flex;flex-direction:column;align-items:flex-start;gap:2px}
html.is-phone .arena-player h3 .hunted-badge{order:-1}
html.is-phone .arena-player small{display:flex;flex-direction:column;gap:0}
html.is-phone .arena-stat-level::after{content:none}
html.is-phone .arena-player .game-button{width:100px!important}

/* Arena — "Dnesni nejagresivnejsi bojovnici": na uzkem mobilu se #poradi · jmeno a pocty
   utoku/vyher pri display:flex;justify-content:space-between lamaly uprostred slov. Misto
   jednoho radku dva kratke radky pod sebou. */
html.is-phone .arena-aggression ol{padding-left:0;list-style:none}
html.is-phone .arena-aggression li{flex-direction:column;align-items:flex-start;gap:1px;padding:5px 0}
html.is-phone .arena-aggression li:not(:last-child){border-bottom:1px solid #2a2416}
html.is-phone .arena-aggression li>b{color:#bdb6ad;font-size:.72rem;font-weight:400}

/* Mazlicek pod mobilnim sidebarem (misto ve sklad tabu): jmeno / obrazek / staty pod sebou,
   cely dlazdice otevira "Muj mazlik" modal (viz data-toggle na sekci, jen pri $isPhoneLayout)
   misto puvodniho maleho ozubeneho tlacitka. display:contents na obalovaci div necha jeho
   deti (jmeno, typ, bonusy) chovat se jako primi flex potomci sekce, takze je lze poradim
   (order) presunout bez zasahu do desktop markupu/CSS. */
html.is-phone .sidebar-pet-panel{flex-direction:column;align-items:center;gap:4px;text-align:center;padding:10px}
html.is-phone .sidebar-pet-panel>div{display:contents}
html.is-phone .sidebar-pet-panel strong{order:1;font-size:.95rem}
html.is-phone .sidebar-pet-panel small{order:1}
html.is-phone .sidebar-pet-panel img{order:2;width:84px;height:84px;margin:2px 0}
html.is-phone .sidebar-pet-panel b.nav-tooltip-item{order:3}
html.is-phone .sidebar-pet-panel .sidebar-pet-actions{display:none}
html.is-phone .sidebar-pet-panel b.nav-tooltip-item .web-icon{width:16px;height:16px}

/* Uschovna modal na mobilu: tlacitka Vyzvednout/Zahodit uzsi a zarovnana doprava (misto
   130px na celou sirku sloupce), aby zbylo misto pro cely text countdownu "Zmizi: X dni a Y h." */
html.is-phone .storage-entry-actions{align-items:flex-end}
html.is-phone .storage-entry-actions form{width:100px}

/* Mobilni topbar: vodorovne posuvna lista ikon (.nav-menu-icons/.nav-menu-item/.nav-menu-link
   jsou stejne tridy jako na desktopu, jen misto Bootstrap collapse-hamburger menu jedou v radku
   s prekryvem overflow-x. @media(max-width:767px) o par set radku vyse je preklopi na sloupec
   (puvodne pro rozbaleny mobilni hamburger) - tady to natvrdo vracime zpatky do radku. Sipky
   jsou skryte (hidden atribut), dokud je nezobrazi mobile-topbar.js podle toho, jestli je kam
   scrollovat (funkce updateArrows, reaguje i na rucni scroll uzivatele). */
html.is-phone .mobile-topbar-inner{display:flex;align-items:center;gap:2px;height:65px}
html.is-phone .mobile-topbar-scroller.nav-menu-icons{flex:1 1 0;min-width:0;flex-direction:row!important;flex-wrap:nowrap;align-items:stretch!important;gap:2px!important;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
html.is-phone .mobile-topbar-scroller.nav-menu-icons::-webkit-scrollbar{display:none}
html.is-phone .mobile-topbar-scroller .nav-menu-link{flex-direction:column;gap:2px!important;padding:8px 10px!important;font-size:.6rem;color:var(--game-muted,#aaa394)}
html.is-phone .mobile-topbar-scroller .nav-menu-item.active .nav-menu-link{color:var(--gold)}
html.is-phone .mobile-topbar-scroller .nav-menu-link .web-icon{width:26px;height:26px}
html.is-phone .mobile-topbar-scroller .nav-menu-tooltip{display:none}
/* visibility (ne display:none) na [hidden] - box zustava porad rezervovany, takze se
   sousedni tri tecky (.mobile-topbar-more) neposouvaly kazdou chvili kus sem a tam podle
   toho, jestli je zrovna vpravo kam scrollovat. [hidden] musi zustat silnejsi nez
   display:flex nize, jinak by mobile-topbar.js prepinal atribut bez vizualniho efektu. */
html.is-phone .mobile-topbar-arrow[hidden]{display:flex;visibility:hidden;pointer-events:none}
html.is-phone .mobile-topbar-arrow{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:24px;height:40px;color:var(--gold);background:rgba(0,0,0,.35);border:1px solid #4b4434;border-radius:6px;font-size:1.2rem;line-height:1;cursor:pointer}
html.is-phone .mobile-topbar-arrow:active{background:rgba(249,209,4,.16)}
html.is-phone .game-shell{padding-top:90px}

/* Cvicitel na mobilu: o trochu vetsi L&R padding na +1/+5/... tlacitkach (predchozi 7px
   pusobilo stlacene), jen pro is-phone - .training-actions button vyse je plain
   @media(max-width:700px), tedy i pro uzke desktop okno, tam se nesaha. */
html.is-phone .training-actions button{padding-left:8px!important;padding-right:8px!important}

/* Mini sidebar nad XP: zlataky/dia a zpravy/oznameni/ucet/odhlaseni presunute sem z topbaru,
   kde uz na mobilu neni na tyto ikony misto. */
/* Mini sidebar je tady jen ~96px siroka (viz mobile-dashboard-sidebar) - zlataky/dia a 5-6
   utility ikon se do jednoho radku nevejdou, obe skupiny proto smi lamat na vic radku a
   centrovat se, misto aby pretekaly mimo sidebar (a tim cely stranku do strany). */
html.is-phone .mobile-sidebar-topline{display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 6px 10px;margin-bottom:2px;border-bottom:1px solid var(--game-line,#4b4434)}
html.is-phone .mobile-sidebar-currency{display:flex;flex-direction:column;align-items:center;gap:2px}
html.is-phone .mobile-sidebar-currency .nav-currency{margin-right:0;display:flex;align-items:center;gap:4px;color:var(--game-cream,#ded8ca);font-size:.7rem}
html.is-phone .mobile-sidebar-currency .web-icon{width:14px;height:14px}
html.is-phone .mobile-sidebar-utility{display:flex;align-items:center;justify-content:center;gap:2px;width:100%;padding-top:6px;border-top:1px solid var(--game-line,#4b4434)}
html.is-phone .mobile-sidebar-utility .nav-inbox{padding:3px 4px!important}
html.is-phone .mobile-sidebar-utility .web-icon{width:18px;height:18px}

/* Tri tecky: dalsi akce (Nastaveni/Odhlasit), ktere uz v topbaru/mini sidebaru nemaji misto,
   presunute do maleho modalu. Zije jako posledni polozka primo uvnitr .mobile-topbar-scroller
   (bezny nav-menu-item), ne jako samostatny prvek za sipkou - takze se posouva/scrolluje
   spolecne s ostatnimi ikonami a na konec menu se k ni doscrolluje stejne jako ke Spolku. */
html.is-phone .mobile-topbar-more-link{font-size:1.4rem;color:var(--game-muted,#aaa394)}
html.is-phone .mobile-topbar-more-link:active{color:var(--gold)}
.mobile-topbar-more-actions{display:flex;flex-direction:column;gap:8px}

/* Kobka na mobilu: jmeno/stupen/staty/dalsi postup/odmeny/cena kazde na svem radku misto
   jedne spojene vety - lip citelne na uzkem sloupci. */
html.is-phone .enemy-encounter .enemy-stage{margin:-4px 0 2px;color:var(--gold)}
html.is-phone .enemy-encounter .enemy-progress{margin-top:2px;color:var(--game-muted,#aaa394);font-size:.8rem}
html.is-phone .enemy-encounter .enemy-rewards{margin-top:10px}
html.is-phone .enemy-encounter .enemy-rewards-title{margin:0 0 3px;color:var(--game-muted,#aaa394);font-size:.72rem;font-weight:400;text-transform:uppercase;letter-spacing:.04em}
html.is-phone .enemy-encounter .enemy-rewards-values{color:var(--gold);font-size:.9rem}
html.is-phone .enemy-encounter .enemy-energy-cost{margin-top:4px;color:var(--game-muted,#aaa394);font-size:.8rem}

/* Genericky tab prepinac pro dlouhe stranky (zatim /spolek) - stejny vizualni jazyk jako
   .mobile-tabbar na /hra (ikona nad malym labelem, flex:1 sloupce), ale globalne (desktop
   i mobil), ne jen html.is-phone. Panely skryte/zobrazene pres page-tabs.js. */
.guild-tabbar{display:flex;margin:14px 0;background:#0d0d0d;border:1px solid var(--game-line)}
.guild-tabbar-btn{display:flex;flex:1;flex-direction:column;align-items:center;gap:2px;padding:9px 6px 7px;color:#9a948a;background:none;border:0;font-size:.72rem;cursor:pointer}
.guild-tabbar-btn .web-icon{width:24px;height:24px}
.guild-tabbar-btn.is-active{color:var(--gold)}
.guild-tab-panel{display:none}
.guild-tab-panel.is-active{display:block}

/* Hraci na mobilu: karta misto 6-sloupcove .player-row tabulky (min-width:650px, nutila
   horizontalni scroll). Cely radek zustava klikatelny stejne jako drive (.player-row-link
   absolutni overlay - trida i CSS sdilene s desktop variantou). */
html.is-phone .player-ranking{padding:0!important;overflow-x:visible}
html.is-phone .player-row-card{position:relative;display:flex;align-items:center;gap:10px;padding:8px 10px;margin-bottom:6px;background:var(--game-surface-2,#1d1d1d);border:1px solid var(--game-line,#4b4434);color:var(--game-cream,#ded8ca);text-decoration:none}
html.is-phone a.player-row-card:hover,html.is-phone a.player-row-card:focus{color:var(--game-cream,#ded8ca);text-decoration:none;border-color:var(--gold)}
html.is-phone .player-row-card.is-me{border-color:var(--gold);box-shadow:inset 0 0 0 1px rgba(249,209,4,.25)}
html.is-phone .player-row-card.is-bot{background:#1c1822}
html.is-phone .player-row-card-rank{flex:0 0 auto;width:18px;text-align:center;color:var(--game-muted,#aaa394);font-size:.7rem}
html.is-phone .player-row-card-avatar{flex:0 0 auto;width:36px;height:36px;object-fit:cover;border-radius:50%}
html.is-phone .player-row-card-body{position:relative;z-index:2;flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
html.is-phone .player-row-card-body strong{display:flex;align-items:center;gap:5px;color:var(--game-cream,#ded8ca);font-size:.85rem;font-weight:700}
html.is-phone .player-row-card-body strong i{padding:1px 5px;border-radius:3px;color:#111;background:var(--gold);font-size:.6rem;font-style:normal}
html.is-phone .player-row-card-body strong i.bot-badge{background:#9b7de0}
html.is-phone .player-row-card-body small{color:var(--game-muted,#aaa394);font-size:.7rem}
html.is-phone .player-row-card .activity-badge{flex:0 0 auto;padding:3px 8px;border-radius:10px;background:rgba(114,217,155,.12);font-size:.62rem;color:#75b86e}
html.is-phone .player-row-card .activity-badge.away{background:rgba(210,170,49,.15);color:#d2aa31}

/* ===== Obchod mezi hráči ===== */
.trade-offer-picker-wrap{display:grid;gap:14px;max-width:820px}
.trade-slots-heading{margin:0}
/* Pevny 5-slotovy drop cil pro Click & Carry z .trade-picker nize (viz inventory-dnd.js
   handleDrop [data-trade-drop] a public/js/trade.js window.tradeAddOffer). */
.trade-drop-grid{padding:6px}
.trade-slot.is-filled{border-color:var(--gold)}
.trade-slot-remove{position:absolute;top:2px;right:2px;z-index:2;width:18px;height:18px;padding:0;color:#b52222;background:rgba(255,255,255,.9);border:1px solid var(--game-line);border-radius:50%;font-size:.7rem;line-height:1;cursor:pointer}
.trade-slot-remove:hover{background:#fdeaea}
.trade-slot-qty{position:absolute;left:2px;right:2px;bottom:2px;z-index:2;width:calc(100% - 4px);height:18px;padding:0 3px;font-size:.68rem}
.trade-offer-row{display:flex;align-items:center;gap:10px;padding:7px 10px}
.trade-offer-row span{flex:1;min-width:0}
.trade-offer-row .slot-cell--standalone>img{width:100%;height:100%;padding:5px;box-sizing:border-box;object-fit:contain}
.trade-currency-inputs{display:flex;flex-wrap:wrap;gap:14px}
.trade-currency-inputs label{display:flex;flex-direction:column;gap:4px;font-size:.85rem;font-weight:700}
.trade-currency-inputs input{width:140px}
.trade-note-label{display:flex;flex-direction:column;gap:4px;font-size:.85rem;font-weight:700}
.trade-picker-heading{margin-top:4px}
@media(max-width:700px){html.is-phone .trade-picker{--slot-columns:4!important;--slot-size:52px!important}}
.trade-summary-side{display:grid;gap:6px}
.trade-summary-heading{margin:0 0 4px;color:#9b7900}
.trade-summary-empty{color:#68717b;font-style:italic}
.trade-summary-currency{display:flex;gap:14px;font-weight:700;color:#a17d00}
.trade-panels{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
@media(max-width:700px){.trade-panels{grid-template-columns:1fr}}
.trade-status-pill{display:inline-block;padding:2px 9px;border-radius:10px;color:#fff;background:#9aa1a8;font-size:.72rem;font-weight:700}
.trade-status-pill--pending{background:var(--gold);color:#111}
.trade-status-pill--accepted{background:#2f8f4e}
.trade-status-pill--declined,.trade-status-pill--cancelled{background:#b52222}
.trade-status-pill--expired{background:#9aa1a8}
.trade-list-row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:10px 12px;background:#fff;border:1px solid var(--border);margin-bottom:6px;text-decoration:none;color:inherit}
.trade-list-row:hover{color:inherit;background:#fafafa;text-decoration:none}
.trade-list-row small{display:block;color:#68717b}
.trade-list-row-items{display:flex;gap:4px;align-items:center;flex-shrink:0}
.trade-list-row-more{display:grid;place-items:center;width:32px;height:32px;color:var(--game-muted);background:var(--game-surface);border:1px solid var(--game-line);border-radius:2px;font-size:.7rem;font-weight:700}
.trade-nav-badge{position:relative;top:-1px;margin-left:4px;padding:1px 6px;border-radius:10px;background:var(--gold);color:#111;font-size:.62rem;font-weight:700}

.badge-boss{display:inline-block;padding:1px 6px;background:#c0392b;color:#fff;font-size:.65rem;font-weight:700;letter-spacing:.03em;border-radius:3px;vertical-align:middle}