:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#0f1115;color:#f0ede6;font-synthesis:none;line-height:1.4;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;overflow:hidden;background:linear-gradient(180deg,#1c1f27f2,#0c0d11),#0f1115}button,input,textarea{font:inherit}button{cursor:pointer}.app-shell{display:grid;align-items:center;height:100vh;justify-items:center;min-height:100vh;padding:6px}.team-builder{display:grid;grid-template-columns:164px minmax(600px,630px) 474px;gap:0;align-items:stretch;width:min(100%,1268px);height:min(calc(100vh - 12px),668px);margin:0 auto;overflow:hidden;border:1px solid #323844;background:#13161cf0;box-shadow:0 20px 60px #00000057}.trait-panel,.board-panel,.champion-panel,.item-panel{min-height:0;border:0;background:transparent;box-shadow:none}.trait-panel,.champion-panel,.item-panel{display:flex;flex-direction:column;overflow:hidden}.side-panel{display:grid;grid-template-rows:382px minmax(0,1fr);gap:0;height:100%;min-height:0}.side-panel .champion-panel,.side-panel .item-panel{min-height:0}.board-panel{display:flex;flex-direction:column;justify-content:start;padding:10px;border-right:1px solid #323844;border-left:1px solid #323844}.item-panel{border-top:1px solid #323844}.panel-title,.champion-panel-header,.item-panel-header{padding:10px;border-bottom:1px solid #323844;background:#181c23}.eyebrow{margin:0 0 4px;color:#c8a75a;font-size:.76rem;font-weight:700;letter-spacing:0;text-transform:uppercase}h1,h2,h3{margin:0;letter-spacing:0}h1{font-size:1.28rem}h2{font-size:1rem}.board-header{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-bottom:8px}.board-summary{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-start;color:#d9d0bd;font-size:.88rem}.board-summary span{border:1px solid #3d4554;background:#141820;padding:5px 8px}.board-meta{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px;align-items:center;margin-bottom:8px;min-height:34px}.component-summary{display:flex;min-width:0;align-items:center;justify-content:flex-end;gap:7px}.component-summary-label,.component-empty{color:#b8b0a2;font-size:.66rem;font-weight:600;text-transform:uppercase}.component-tokens{display:flex;min-width:0;gap:4px;justify-content:flex-end}.component-token{position:relative;display:grid;width:28px;height:28px;place-items:center;border:1px solid #5d6878;background:#11151c;color:#f4efe6;overflow:hidden}.component-token img{width:100%;height:100%;object-fit:cover}.component-token strong{position:absolute;right:-1px;bottom:-1px;min-width:13px;padding:0 3px;background:#080a0ee6;color:#f5d57d;font-size:.56rem;font-weight:700;line-height:13px;text-align:center}.board-actions{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}.board-actions button,.team-import-bar button{min-height:28px;border:1px solid #3f4858;background:#11151c;color:#d7c399;padding:4px 7px;font-size:.7rem;font-weight:800}.board-actions button:hover,.board-actions button:focus-visible,.team-import-bar button:hover,.team-import-bar button:focus-visible{border-color:#c8a75a;color:#fff1d2;outline:none}.team-import-bar{display:grid;grid-template-columns:minmax(260px,1fr) auto minmax(92px,auto);gap:6px;align-items:center;margin-bottom:8px}.team-import-input{width:100%;height:30px;min-height:30px;resize:none;border:1px solid #3f4858;background:#0f1218;color:#f4efe6;overflow:hidden;padding:5px 8px;outline:none}.team-import-input:focus{border-color:#c8a75a}.team-status{min-width:0;overflow:hidden;color:#cfc8b9;font-size:.7rem;font-weight:800;text-align:right;text-overflow:ellipsis;white-space:nowrap}.team-status.is-ok{color:#8fd6a5}.team-status.is-error{color:#e09a83}.hex-board{--slot-height: clamp(72px, 6vw, 76px);--slot-width: calc(var(--slot-height) * .866);--hex-column-gap: 3px;--hex-row-gap: 5px;display:grid;grid-template-columns:repeat(7,var(--slot-width));grid-auto-rows:calc(var(--slot-height) * .75 + var(--hex-row-gap));justify-content:center;align-content:center;column-gap:var(--hex-column-gap);row-gap:0;flex:0 0 auto;height:min(486px,calc(100% - 136px));min-height:0;overflow:hidden;padding:18px calc(var(--slot-width) / 2 + 24px) 28px 26px;border:1px solid #3a4250;background:linear-gradient(135deg,#3239446b,#151a23db),#171b23}.board-slot{position:relative;width:var(--slot-width);height:var(--slot-height);border:1px solid #495568;box-shadow:inset 0 0 0 1px #ffffff09;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background:#020305;color:#f5efe2;overflow:hidden;transition:transform .12s ease,border-color .12s ease,background .12s ease}.board-slot.is-offset{transform:translate(calc((var(--slot-width) + var(--hex-column-gap)) / 2))}.board-slot:hover,.board-slot.is-drop-target{border-color:#d1aa52;background:#050608}.board-slot.is-unit-target,.board-slot.is-item-target{border-color:#d1aa52;box-shadow:inset 0 0 0 2px #d1aa523d}.board-slot.is-item-target{background:#07100b}.board-slot.has-unit.cost-1{border-color:#8c919b}.board-slot.has-unit.cost-2{border-color:#4caf70}.board-slot.has-unit.cost-3{border-color:#4aa3d8}.board-slot.has-unit.cost-4{border-color:#b36fe4}.board-slot.has-unit.cost-5{border-color:#d6a647}.board-slot.has-unit:after{position:absolute;z-index:3;inset:0;box-shadow:inset 0 0 0 2px var(--board-unit-outline, rgba(140, 145, 155, .78));content:"";pointer-events:none}.board-slot.has-unit.cost-1{--board-unit-outline: rgba(140, 145, 155, .82)}.board-slot.has-unit.cost-2{--board-unit-outline: rgba(76, 175, 112, .9)}.board-slot.has-unit.cost-3{--board-unit-outline: rgba(74, 163, 216, .92)}.board-slot.has-unit.cost-4{--board-unit-outline: rgba(179, 111, 228, .92)}.board-slot.has-unit.cost-5{--board-unit-outline: rgba(214, 166, 71, .94)}.board-slot.has-unit img{position:absolute;z-index:1;top:4%;left:4%;width:92%;height:92%;object-fit:contain;background:#020305}.board-item-tray{position:absolute;z-index:4;right:12%;bottom:29%;left:12%;display:flex;gap:3px;justify-content:center;pointer-events:auto}.board-item-token{display:grid;width:19px;aspect-ratio:1;min-width:0;place-items:center;border:1px solid rgba(220,199,143,.72);background:#080a0ed1;color:#e8c66d;font-size:.52rem;font-weight:900;overflow:hidden}.board-item-token img{width:100%;height:100%;object-fit:cover}.board-item-token:hover{border-color:#f0d681;box-shadow:0 0 0 1px #f0d68161}.board-unit-name{position:absolute;z-index:4;right:6%;bottom:13%;left:6%;overflow:hidden;padding:0 2px;color:#f5efe2;text-shadow:0 1px 2px rgba(0,0,0,.95),0 0 4px rgba(0,0,0,.8);font-size:.68rem;font-weight:500;text-align:center;text-overflow:ellipsis;white-space:nowrap}.empty-hex{display:block;width:100%;height:100%;background:#020305}.search-field{display:grid;gap:6px;color:#cfc8b9;font-size:.82rem;font-weight:700}.search-field span{display:none;color:#d7c399}.search-field input{width:100%;min-height:32px;border:1px solid #414a5a;background:#0f1218;color:#f4efe6;padding:8px 10px;outline:none}.search-field input:focus{border-color:#c8a75a}.champion-groups,.item-groups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-content:start;gap:6px 9px;flex:1;min-height:0;overflow:hidden;padding:8px 10px}.champion-groups{display:grid;grid-template-columns:1fr;align-content:start;gap:5px}.cost-group{display:grid;padding-bottom:2px}.champion-grid{display:grid;grid-auto-flow:column;grid-auto-columns:26px;grid-template-rows:repeat(2,26px);gap:3px;justify-content:start}.champion-button{position:relative;aspect-ratio:1;min-width:0;border:1px solid #8c919b;background:#161a22;color:#f4efe6;overflow:hidden;padding:0}.champion-button:hover,.champion-button:focus-visible,.champion-button.is-selected{z-index:1;outline:none;transform:translateY(-1px);box-shadow:0 0 0 2px #d1aa5259}.champion-button.is-selected{box-shadow:0 0 0 2px #d1aa5275,0 8px 18px #00000047}.champion-button img{width:100%;height:100%;object-fit:cover}.champion-button.cost-1{border-color:#8c919b}.champion-button.cost-2{border-color:#4caf70}.champion-button.cost-3{border-color:#4aa3d8}.champion-button.cost-4{border-color:#b36fe4}.champion-button.cost-5{border-color:#d6a647}.item-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;margin-bottom:8px}.item-tab{min-height:27px;border:1px solid #3f4858;background:#11151c;color:#cfc8b9;font-size:.68rem;font-weight:800}.item-tab:hover,.item-tab:focus-visible,.item-tab.is-active{border-color:#c8a75a;color:#fff1d2;outline:none}.item-group{display:grid;gap:4px}.item-group h3{color:#d7c399;font-size:.64rem;font-weight:800;text-transform:uppercase}.item-grid{display:grid;grid-template-columns:repeat(auto-fill,24px);gap:3px}.item-button{position:relative;aspect-ratio:1;min-width:0;border:1px solid #667080;background:#141820;color:#f4efe6;overflow:hidden;padding:0}.item-button:hover,.item-button:focus-visible,.item-button.is-selected{z-index:1;border-color:#d1aa52;outline:none;transform:translateY(-1px);box-shadow:0 0 0 2px #d1aa5257}.item-button.is-artifact{border-color:#cf8d4b}.item-button.is-emblem{border-color:#b36fe4}.item-button.is-component{border-color:#8c919b}.item-button img{width:100%;height:100%;object-fit:cover}.trait-list{display:grid;align-content:start;gap:3px;flex:1;min-height:0;overflow:hidden;padding:8px 10px}.trait-summary{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:7px}.trait-summary span{display:grid;min-height:34px;place-items:center;border:1px solid #303845;background:#11151c;color:#aeb5bf;font-size:.62rem;font-weight:600;text-transform:uppercase}.trait-summary strong{color:#f5d57d;font-size:1rem;line-height:1}.trait-row{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:8px;align-items:center;min-height:34px;border:0;background:transparent;padding:2px 0}.trait-icon{display:grid;width:30px;height:30px;place-items:center;clip-path:polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%);border:0;background:#0d1016;color:#d9c78f;font-size:.66rem;font-weight:800;overflow:hidden}.trait-icon img{width:72%;height:72%;object-fit:contain;filter:grayscale(1) brightness(1.4)}.trait-copy{min-width:0}.trait-copy strong,.trait-copy span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.trait-copy strong{color:#f2ebde;font-size:.76rem;font-weight:500}.trait-copy span{color:#b9b1a4;font-size:.62rem}.trait-count{color:#f5d57d;font-size:.72rem;font-weight:600}.trait-row.tier-inactive{background:transparent}.trait-row.tier-inactive .trait-icon{background:linear-gradient(180deg,#59616c,#2f3540)}.trait-row.tier-inactive .trait-count{color:#b6bdc7}.trait-row.tier-bronze{background:transparent}.trait-row.tier-bronze .trait-icon{background:linear-gradient(180deg,#b87948,#5b3424)}.trait-row.tier-silver{background:transparent}.trait-row.tier-silver .trait-icon{background:linear-gradient(180deg,#d7e0ea,#687381)}.trait-row.tier-gold{background:transparent}.trait-row.tier-gold .trait-icon{background:linear-gradient(180deg,#f0cf74,#8f681e)}.trait-row.tier-prismatic{background:transparent}.trait-row.tier-prismatic .trait-icon{background:linear-gradient(180deg,#f2dcff,#8e55bb)}.trait-row.tier-unique{background:transparent}.trait-row.tier-unique .trait-icon{background:linear-gradient(180deg,#e8a65c,#7b3e1d)}.trait-row.is-active .trait-icon img{filter:none}.unit-tooltip{position:fixed;z-index:20;display:grid;grid-template-columns:112px minmax(0,1fr);width:min(430px,calc(100vw - 32px));min-height:178px;border:1px solid #c8a75a;background:#11151c;box-shadow:0 18px 48px #00000075;pointer-events:none}.unit-tooltip[hidden]{display:none}.tooltip-portrait{display:grid;min-height:178px;place-items:center;background:#0a0d12;border-right:1px solid #4a5260;color:#e8c66d;font-weight:900;overflow:hidden}.tooltip-portrait.cost-1{border-color:#8c919b}.tooltip-portrait.cost-2{border-color:#4caf70}.tooltip-portrait.cost-3{border-color:#4aa3d8}.tooltip-portrait.cost-4{border-color:#b36fe4}.tooltip-portrait.cost-5{border-color:#d6a647}.tooltip-portrait img{width:100%;height:100%;object-fit:cover}.item-portrait{padding:18px}.item-portrait img{border:1px solid #526073}.tooltip-copy{display:grid;gap:9px;align-content:start;max-height:min(430px,calc(100vh - 40px));overflow:auto;padding:12px}.tooltip-title{display:flex;gap:8px;align-items:start;justify-content:space-between}.tooltip-title h3{min-width:0;color:#fff4df;font-size:1rem}.tooltip-title span{flex:0 0 auto;color:#f2cd72;font-size:.8rem;font-weight:800}.tooltip-traits{display:flex;gap:5px;flex-wrap:wrap}.tooltip-traits span{display:inline-flex;gap:5px;align-items:center;border:1px solid #445061;background:#1a2029;color:#dcd2bf;padding:3px 6px;font-size:.74rem}.tooltip-traits img{width:16px;height:16px;object-fit:contain}.tooltip-components{display:flex;gap:6px;flex-wrap:wrap}.tooltip-components span{display:inline-flex;gap:5px;align-items:center;border:1px solid #445061;background:#1a2029;color:#dcd2bf;padding:3px 6px;font-size:.72rem}.tooltip-components img{width:18px;height:18px;object-fit:cover}.tooltip-note{margin:0;color:#a9a193;font-size:.76rem}.tooltip-ability{display:grid;gap:6px;border-top:1px solid #303845;padding-top:8px}.tooltip-ability-title{display:flex;gap:7px;align-items:center;color:#fff4df;font-size:.84rem}.tooltip-ability-title img{width:22px;height:22px;border:1px solid #485263;object-fit:cover}.tooltip-ability p{margin:0;color:#c9c0b0;font-size:.76rem;line-height:1.35}.tooltip-stats{display:flex;gap:5px;flex-wrap:wrap}.tooltip-stats span{border:1px solid #35404d;background:#151a22;color:#d9d0bd;padding:2px 5px;font-size:.7rem;font-weight:700}.empty-state,.empty-cost,.load-state,.load-error{color:#b8afa1}.load-state,.load-error{display:grid;min-height:calc(100vh - 36px);place-items:center;border:1px solid #323844;background:#151922}@media(max-width:1120px){body{overflow:auto}.app-shell{display:block;height:auto}.team-builder{grid-template-columns:190px minmax(520px,1fr);width:auto;height:auto}.side-panel{grid-column:1 / -1;grid-template-columns:1fr 1fr;grid-template-rows:minmax(360px,auto);min-height:360px}.champion-groups,.item-groups{height:300px;overflow:auto}.team-import-bar{grid-template-columns:1fr auto}.team-status{grid-column:1 / -1;text-align:left}}@media(max-width:760px){.app-shell{padding:10px}.team-builder{grid-template-columns:1fr}.trait-panel,.board-panel,.champion-panel,.item-panel,.side-panel{min-height:auto}.side-panel{grid-template-columns:1fr;grid-template-rows:auto}.hex-board{--slot-height: min(13.2vw, 64px);min-height:270px;padding:18px calc(var(--slot-width) / 2 + 10px) 34px 10px}.board-header{align-items:start;flex-direction:column}.board-meta,.board-actions{justify-items:start;justify-content:flex-start}.trait-list{max-height:260px;overflow:auto}.team-import-bar{grid-template-columns:1fr}.team-import-bar button{width:100%}.champion-groups,.item-groups{height:340px}}
