.trickcal-team-builder-items-container{width:100%;max-width:100%;margin:0 auto;margin-top:3rem}.battlefield-layout{display:flex;justify-content:center;align-items:stretch}.grid-area{display:flex;flex-direction:column;gap:1rem;align-items:center;justify-content:center}.line-indicators{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:100%;max-width:100%}.line-indicator{display:flex;align-items:center;justify-content:center;width:340px}.line-icon{width:48px!important;max-width:48px}.formation-grid-items{display:grid;gap:8px;grid-template-columns:repeat(var(--grid-cols, 1),1fr);grid-template-rows:repeat(var(--grid-rows, 3),1fr)}.grid-cell-items{position:relative;background:linear-gradient(135deg,#1e232de6,#141923f2);padding:8px;transition:all .2s ease;width:340px}.grid-cell-items[data-line="0"]{border:2px solid rgba(59,130,246,.6)}.grid-cell-items[data-line="1"]{border:2px solid rgba(34,197,94,.6)}.grid-cell-items[data-line="2"]{border:2px solid rgba(239,68,68,.6)}.grid-cell-items.drag-over{border-color:#4ade80;background:#4ade8033}.cell-content{width:100%;display:flex;flex-direction:row;gap:6px;align-items:center}.character-slot{width:120px;height:120px;flex-shrink:0;display:flex;align-items:center;justify-content:center;position:relative;cursor:pointer;transition:all .2s ease;border:2px solid rgba(255,255,255,.1);overflow:hidden}.character-slot:hover{border-color:#ebed6366}.character-slot.occupied{border-color:#60a5fa4d}.item-slots{display:flex;flex-direction:row;gap:3px;flex-shrink:0;align-items:center}.item-slot{width:60px;height:60px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;position:relative;overflow:hidden;border-radius:50%;border:2px solid rgba(255,255,255,.15)}.item-slot:hover{border-color:#ebed6366}.add-unit-button,.add-item-button{font-size:1.5rem;color:#ffffff26;font-weight:700;transition:all .2s ease;text-shadow:0 2px 4px rgba(0,0,0,.5)}.character-slot:hover .add-unit-button,.item-slot:hover .add-item-button{color:#ebed63b3;text-shadow:0 0 10px rgba(235,237,99,.5)}.placed-unit{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden;cursor:move}.placed-unit.dragging{opacity:.5}.unit-image{width:100%;height:100%;object-fit:cover;transition:transform .2s ease}.unit-name{font-size:.6rem;color:#fff;text-align:center;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,#000000f2,#000000b3);padding:3px 4px;font-weight:500;text-shadow:0 1px 2px rgba(0,0,0,.8)}.placed-item{width:100%;height:100%;position:relative;overflow:hidden;border-radius:50%;display:flex;align-items:center;justify-content:center}.item-bg{position:absolute;top:0;left:0;width:100%;height:100%;z-index:0;border-radius:50%}.item-bg.ssr{background:radial-gradient(circle at center,#fff457e6,#ffb348b3)}.item-bg.sr{background:radial-gradient(circle at center,#e5b2cae6,#7028e4b3)}.item-bg.r{background:radial-gradient(circle at center,#9acbf0e6,#0090ffb3)}.item-bg.n{background:radial-gradient(circle at center,#9af0aae6,#008202b3)}.item-image{width:90%;height:90%;object-fit:contain;position:relative;z-index:1;border-radius:50%;transition:transform .2s ease}.grid-controls{display:flex;gap:1rem;justify-content:center;margin-top:3rem;margin-bottom:3rem;flex-wrap:wrap}.control-btn{background-color:transparent;border:2px solid #2b323b;color:#fff;font-weight:700;padding:.75rem 1.25rem;cursor:pointer;transition:all .2s ease;display:inline-flex;align-items:center;gap:.5rem}.control-btn:hover{background-color:#2b323b;border-color:#ebed63;color:#ebed63}.control-btn i{font-size:1.2rem}.character-popup{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000c;z-index:10000;align-items:center;justify-content:center;padding:2rem}.character-popup .popup-content{background:#14181d;width:100%;max-width:1400px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column}.character-popup .popup-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 2rem;background:#0d1116}.character-popup .popup-header h2{margin:0;color:#fff;font-weight:300}.character-popup .close-btn{background:none;border:none;font-size:2rem;cursor:pointer;color:#fff;width:40px;height:40px;display:flex;align-items:center;justify-content:center;transition:background-color .2s}.character-popup .close-btn:hover{background-color:#ffffff1a}.character-popup .popup-filters{padding:1rem 2rem 0}.character-popup .popup-filters .filters{margin-bottom:0}.character-popup .search-input{width:100%;padding:.75rem;background:#0a0d10;border:1px solid #22282f;color:#fff;font-size:.9rem}.character-popup .chars-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:.75rem;padding:1.5rem 2rem;overflow-y:auto;flex:1;min-height:0}.character-popup .char-grid-item{display:flex;flex-direction:column;align-items:center;padding:0;cursor:pointer;border:2px solid transparent;transition:all .15s;position:relative;overflow:hidden;min-height:135px}.character-popup .char-grid-item:hover{border-color:#3a3f6a}.character-popup .char-bg{position:absolute;top:0;left:0;width:100%;height:100px;z-index:0}.character-popup .char-bg.vivacious{background-image:linear-gradient(to top,#ffb348cc,#fff457cc)!important}.character-popup .char-bg.depressed{background-image:linear-gradient(to top,#7028e4cc,#e5b2cacc)!important}.character-popup .char-bg.innocence{background-image:linear-gradient(to top,#008202cc,#9af0aacc)!important}.character-popup .char-bg.madness{background-image:linear-gradient(to top,#ba0707cc,#f09a9acc)!important}.character-popup .char-bg.composed{background-image:linear-gradient(to top,#0090ffcc,#9acbf0cc)!important}.character-popup .char-bg.resonance{background:conic-gradient(from 0deg,#ffd12f,#e278ca,#9759fa,#008202,#f01919,#0090ff,#ffd12f 360deg)!important}.character-popup .char-bg.ssr{background-image:linear-gradient(to top,#ffb348cc,#fff457cc)}.character-popup .char-bg.sr{background-image:linear-gradient(to top,#7028e4cc,#e5b2cacc)}.character-popup .char-bg.r{background-image:linear-gradient(to top,#0090ffcc,#9acbf0cc)}.character-popup .char-bg.n{background-image:linear-gradient(to top,#008202cc,#9af0aacc)}.character-popup .char-grid-item img{width:100%;height:100px;object-fit:cover;object-position:center center;display:block;position:relative;z-index:1}.character-popup .char-grid-name{font-size:.7rem;text-align:center;padding:.4rem .25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%;color:#fff;position:relative;z-index:2;min-height:1.5em;background:#0f1419}.selected-items-preview{padding:1rem 2rem;background:#0f1419;border-top:1px solid #22282f;min-height:60px;display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.selected-items-preview .placeholder{color:#6b7280;font-size:.9rem}.selected-item-tag{background:#202442;color:#fff;padding:.4rem .8rem;font-size:.85rem;display:inline-flex;align-items:center;gap:.5rem;cursor:pointer;transition:all .2s ease}.selected-item-tag:hover{background:#2a3050}.selected-item-tag i{font-size:1rem}.selection-count{margin-left:auto;color:#ebed63;font-weight:700;font-size:.9rem}.character-popup .popup-footer{display:flex;justify-content:flex-end;gap:.75rem;padding:1rem 2rem;background:#0d1116;border-top:1px solid #22282f}.character-popup .popup-btn{background-color:#202442;color:#fff;border:none;padding:.5rem 1rem;cursor:pointer;font-size:.9rem;transition:background-color .3s ease}.character-popup .popup-btn:hover{background-color:#14181d}.character-popup .popup-btn.confirm-btn{background-color:transparent;border:2px solid #2b323b;color:#fff;font-weight:700;padding:.75rem 1.25rem}.character-popup .popup-btn.confirm-btn:hover{background-color:#2b323b;border-color:#ebed63;color:#ebed63}.char-grid-item.selected{border:2px solid #ebed63}.selected-check{position:absolute;top:.5rem;right:.5rem;background:#ebed63;color:#0a0d10;border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;font-size:1rem;z-index:10}.selected-check .item-count{font-weight:700;font-size:.9rem}.bottom-info-container{display:flex;align-items:flex-start;gap:1rem;margin-top:.5rem;width:100%}.total-cost-display{display:none;align-items:center;gap:.5rem;padding:.5rem .75rem;background:#ffffff0d;border:2px solid rgba(255,255,255,.1);width:fit-content;height:56px;box-sizing:border-box}.runes-section{display:flex;align-items:center;gap:.5rem;flex:1}.add-runes-btn{background-color:transparent;border:2px solid rgba(255,255,255,.1);color:#fff;padding:.5rem .75rem;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:.25rem;font-size:.85rem;white-space:nowrap;height:56px;font-weight:600;box-sizing:border-box}.add-runes-btn:hover{background-color:#ffffff0d;border-color:#ebed63;color:#ebed63}.runes-display{display:none;align-items:center;gap:.25rem;flex-wrap:wrap}.rune-display-item{width:56px;height:56px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;border:2px solid rgba(255,255,255,.2);cursor:pointer;transition:all .2s ease;box-sizing:border-box}.rune-display-item:hover{border-color:#ebed63}.rune-image{width:100%;height:100%;object-fit:contain;position:relative;z-index:1}.rune-item{cursor:pointer}.cost-badge-large{background-image:url(/guides/trickcal/cost-background.png);background-size:cover;background-position:center;width:40px;height:40px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#000;font-weight:800;font-size:1.4rem;text-shadow:-1px -1px 0 white,1px -1px 0 white,-1px 1px 0 white,1px 1px 0 white,0 2px 4px white,0 0 6px white;paint-order:stroke fill}.cost-label{font-size:.9rem;font-weight:700;color:#ebed63;text-transform:uppercase;letter-spacing:.05em}.team-bonuses{display:none;flex-wrap:wrap;gap:.5rem;width:100%;margin-top:1rem;margin-bottom:2rem}.warning{padding:.75rem 1rem;margin:0;border-left:4px solid;display:inline-block;font-size:.9rem;line-height:1.4}.warning strong{font-weight:700}.personality-warning{background-color:#1a2330;border-left-color:#64b5f6;color:#fff}.personality-warning-vivacious{background-color:#ffb34826;border-left-color:#fff457;color:#fff457}.personality-warning-depressed{background-color:#7028e426;border-left-color:#9759fa;color:#9759fa}.personality-warning-innocence{background-color:#00820226;border-left-color:#008202;color:#008202}.personality-warning-madness{background-color:#ba070726;border-left-color:#f01919;color:#f01919}.personality-warning-composed{background-color:#0090ff26;border-left-color:#0090ff;color:#0090ff}.personality-warning-resonance{background-color:#10b98126;border-left-color:#10b981;color:#10b981}.race-warning{background-color:#2a2500;border-left-color:#ffe97f;color:#ffe97f}@media (max-width: 768px){.bottom-info-container{flex-direction:column;gap:.5rem;margin-top:.25rem}.total-cost-display{width:fit-content;padding:.4rem .5rem;gap:.4rem;height:46px;box-sizing:border-box}.cost-badge-large{width:30px;height:30px;font-size:1.1rem}.cost-label{font-size:.7rem}.add-runes-btn{padding:.4rem .5rem;font-size:.75rem;height:46px;box-sizing:border-box}.rune-display-item{width:46px;height:46px;box-sizing:border-box}.grid-area{gap:.5rem}.line-indicator{width:120px}.grid-cell-items{width:120px;padding:4px}.character-slot{width:70px;height:70px}.item-slot{width:24px;height:24px}.cell-content{gap:3px}.item-slots{gap:2px}.character-popup{padding:0}.character-popup .popup-content{max-height:100vh;height:100vh}.character-popup .popup-header{padding:1rem}.character-popup .popup-filters{padding:.5rem 1rem 0}.character-popup .chars-grid{grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:.5rem;padding:1rem}.character-popup .char-grid-item{min-height:100px}.character-popup .char-grid-item img{height:70px}.character-popup .char-grid-name{font-size:.6rem;padding:.25rem .15rem}.character-popup .popup-footer{padding:1rem}}