:root{--nikke-element-water:#06c;--nikke-element-wind:#22c55e;--nikke-element-iron:#f59e0b;--nikke-element-electric:#a855f7;--nikke-element-fire:#ef4444;--nikke-element-water-bg:rgba(0,102,204,.15);--nikke-element-wind-bg:rgba(34,197,94,.15);--nikke-element-iron-bg:rgba(245,158,11,.15);--nikke-element-electric-bg:rgba(168,85,247,.15);--nikke-element-fire-bg:rgba(239,68,68,.15)}.element-badge{border:1px solid;border-radius:var(--radius-sm);display:inline-block;font-size:.85rem;font-weight:600;letter-spacing:.5px;padding:var(--spacing-xs) var(--spacing-sm);text-transform:uppercase;white-space:nowrap}.element-water{background-color:var(--nikke-element-water-bg);border-color:var(--nikke-element-water);color:var(--nikke-element-water)}.element-wind{background-color:var(--nikke-element-wind-bg);border-color:var(--nikke-element-wind);color:var(--nikke-element-wind)}.element-iron{background-color:var(--nikke-element-iron-bg);border-color:var(--nikke-element-iron);color:var(--nikke-element-iron)}.element-electric{background-color:var(--nikke-element-electric-bg);border-color:var(--nikke-element-electric);color:var(--nikke-element-electric)}.element-fire{background-color:var(--nikke-element-fire-bg);border-color:var(--nikke-element-fire);color:var(--nikke-element-fire)}.element-badge.solid{border:none;color:#fff}.element-water.solid{background-color:var(--nikke-element-water)}.element-wind.solid{background-color:var(--nikke-element-wind)}.element-iron.solid{background-color:var(--nikke-element-iron)}.element-electric.solid{background-color:var(--nikke-element-electric)}.element-fire.solid{background-color:var(--nikke-element-fire)}.element-badge.outline{background-color:transparent;border:2px solid}.element-pills{display:flex;flex-wrap:wrap;gap:var(--spacing-md)}.element-pill{background-color:transparent;border:2px solid;border-radius:var(--radius-lg);cursor:pointer;font-size:.9rem;font-weight:600;letter-spacing:.5px;padding:var(--spacing-sm) var(--spacing-md);text-transform:uppercase;transition:all var(--transition-normal)}.element-pill:hover{box-shadow:0 4px 12px rgba(0,0,0,.15);transform:translateY(-2px)}.element-pill.water{border-color:var(--nikke-element-water);color:var(--nikke-element-water)}.element-pill.water:hover{background-color:var(--nikke-element-water-bg)}.element-pill.water.active{background-color:var(--nikke-element-water);border-color:var(--nikke-element-water);color:#fff}.element-pill.wind{border-color:var(--nikke-element-wind);color:var(--nikke-element-wind)}.element-pill.wind:hover{background-color:var(--nikke-element-wind-bg)}.element-pill.wind.active{background-color:var(--nikke-element-wind);border-color:var(--nikke-element-wind);color:#fff}.element-pill.iron{border-color:var(--nikke-element-iron);color:var(--nikke-element-iron)}.element-pill.iron:hover{background-color:var(--nikke-element-iron-bg)}.element-pill.iron.active{background-color:var(--nikke-element-iron);border-color:var(--nikke-element-iron);color:#fff}.element-pill.electric{border-color:var(--nikke-element-electric);color:var(--nikke-element-electric)}.element-pill.electric:hover{background-color:var(--nikke-element-electric-bg)}.element-pill.electric.active{background-color:var(--nikke-element-electric);border-color:var(--nikke-element-electric);color:#fff}.element-pill.fire{border-color:var(--nikke-element-fire);color:var(--nikke-element-fire)}.element-pill.fire:hover{background-color:var(--nikke-element-fire-bg)}.element-pill.fire.active{background-color:var(--nikke-element-fire);border-color:var(--nikke-element-fire);color:#fff}.team-position-cards{display:grid;gap:var(--spacing-md);grid-template-columns:repeat(5,1fr);margin-bottom:var(--spacing-lg)}.position-card{background:var(--glass);border:1px solid var(--border);border-radius:var(--radius-lg);display:flex;flex-direction:column;min-height:120px;overflow:hidden;transition:all var(--transition-normal)}.position-card:hover{border-color:var(--accent);box-shadow:0 4px 12px rgba(217,79,144,.15)}.position-card.filled{background:rgba(16,185,129,.1);border-color:var(--color-success)}.position-card.filled:hover{border-color:#15803d;box-shadow:0 4px 12px rgba(16,185,129,.2)}.position-card.selected{background:rgba(217,79,144,.1);border-color:var(--accent);box-shadow:0 4px 12px rgba(217,79,144,.2)}.position-card.selected:hover{border-color:#c41e3a;box-shadow:0 6px 16px rgba(217,79,144,.3)}.position-header{background:linear-gradient(135deg,var(--accent) 0,#c41e3a 100%);color:#fff;font-size:.9rem;font-weight:600;justify-content:space-between;padding:var(--spacing-sm)}.position-header,.position-number{align-items:center;display:flex;flex-shrink:0}.position-number{background:hsla(0,0%,100%,.2);border-radius:50%;font-size:.8rem;font-weight:700;height:24px;justify-content:center;width:24px}.position-label{flex:1;font-size:.8rem;text-align:center}.position-content{flex:1;flex-direction:column;padding:var(--spacing-md);position:relative}.position-content,.unit-display{align-items:center;display:flex;justify-content:center}.unit-display{min-height:40px;text-align:center;width:100%}.empty-slot{color:var(--text-secondary);font-size:.9rem;font-style:italic}.unit-name{color:var(--text);font-size:.9rem;font-weight:600;line-height:1.2;word-break:break-word}.remove-unit{align-items:center;background:transparent;border:1px solid var(--border);border-radius:50%;color:var(--text-secondary);cursor:pointer;display:flex;font-size:.7rem;height:24px;justify-content:center;padding:0;position:absolute;right:var(--spacing-xs);top:var(--spacing-xs);transition:all var(--transition-normal);width:24px}.remove-unit:hover{background-color:var(--color-error);border-color:var(--color-error);color:#fff}.team-unit{cursor:move;position:relative;transition:all var(--transition-normal);user-select:none}.team-unit:hover{box-shadow:0 4px 8px rgba(0,0,0,.2);transform:scale(1.05)}.team-unit.dragging{opacity:.5;transform:rotate(5deg) scale(.95);z-index:1000}.team-unit.drag-over{background:rgba(217,79,144,.1);border-color:var(--accent)}.drop-zone{align-items:center;background:transparent;border:2px dashed var(--border);border-radius:var(--radius-md);color:var(--text-secondary);display:flex;font-size:.9rem;justify-content:center;min-height:40px;padding:var(--spacing-md);transition:all var(--transition-normal)}.drop-zone:hover{background:rgba(139,92,246,.05);border-color:var(--border-light)}.drop-zone.drag-over{background:rgba(217,79,144,.1);border-color:var(--accent);color:var(--text)}.drop-zone.has-units{background:rgba(217,79,144,.05);border-color:var(--accent);border-style:solid}.unit-btn{background:var(--glass);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text);cursor:pointer;font-size:.8rem;font-weight:500;margin:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm);transition:all var(--transition-normal)}.unit-btn:hover:not(:disabled){border-color:var(--accent);box-shadow:0 2px 4px rgba(217,79,144,.2);transform:translateY(-1px)}.unit-btn.selected{background:var(--accent);border-color:var(--accent);box-shadow:0 4px 8px rgba(217,79,144,.3);color:#fff}.unit-btn:disabled{cursor:not-allowed;opacity:.6}.available-units{background:var(--glass);border:1px solid var(--border);border-radius:var(--radius-md);max-height:200px;overflow-y:auto;padding:var(--spacing-md)}@media (max-width:1024px){.team-position-cards{gap:var(--spacing-sm);grid-template-columns:repeat(4,1fr)}.position-card{min-height:100px}}@media (max-width:768px){.team-position-cards{gap:var(--spacing-sm);grid-template-columns:repeat(3,1fr)}.position-card{min-height:90px}.position-header{font-size:.8rem;padding:var(--spacing-xs)}.position-content{padding:var(--spacing-sm)}.element-pills{gap:var(--spacing-sm)}.element-pill{font-size:.8rem;padding:var(--spacing-xs) var(--spacing-sm)}}@media (max-width:480px){.team-position-cards{gap:var(--spacing-xs);grid-template-columns:repeat(2,1fr)}.position-card{min-height:80px}.element-pills{flex-direction:column}.element-pill{text-align:center;width:100%}}