:root{--bg:#f8f7f4;--surface:#fff;--border:#0000001f;--border-md:#00000038;--text:#1a1a18;--muted:#6b6b67;--hint:#9b9b97;--green:#1d9e75;--green-bg:#e1f5ee;--green-text:#085041;--amber:#ba7517;--amber-bg:#faeeda;--amber-text:#412402;--red:#a32d2d;--red-bg:#fcebeb;--red-text:#501313;--blue:#185fa5;--blue-bg:#e6f1fb;--blue-text:#042c53;--radius:8px;--radius-lg:12px}@media (prefers-color-scheme:dark){:root{--bg:#1c1c1a;--surface:#242422;--border:#ffffff1a;--border-md:#fff3;--text:#e8e6df;--muted:#9b9b97;--hint:#6b6b67;--green-bg:#04342c;--green-text:#9fe1cb;--amber-bg:#412402;--amber-text:#fac775;--red-bg:#501313;--red-text:#f7c1c1;--blue-bg:#042c53;--blue-text:#b5d4f4}}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:system-ui,sans-serif;font-size:16px;line-height:1.5}.layout{grid-template-columns:360px 1fr 340px;gap:20px;max-width:1480px;margin:0 auto;padding:24px 20px;display:grid}@media (width<=1200px){.layout{grid-template-columns:360px 1fr}}@media (width<=880px){.layout{grid-template-columns:1fr}}.card{background:var(--surface);border:.5px solid var(--border);border-radius:var(--radius-lg);margin-bottom:14px;padding:20px}.card-team{background:#8b6b471a;border-color:#8b6b4759}.card-box{background:#7f77dd1a;border-color:#7f77dd59}h1{margin-bottom:4px;font-size:22px;font-weight:500}.subtitle{color:var(--muted);margin-bottom:18px;font-size:14px}.section-label{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:12px;font-size:13px;font-weight:500}label{color:var(--muted);margin-bottom:5px;font-size:13px;display:block}select,input[type=text],input[type=number]{border-radius:var(--radius);border:.5px solid var(--border-md);background:var(--bg);width:100%;color:var(--text);padding:9px 11px;font-family:inherit;font-size:15px}select:focus,input:focus{border-color:var(--blue);outline:none}.form-grid{gap:8px;display:grid}.form-row{grid-template-columns:1fr 1fr;gap:8px;display:grid}.form-row-3{grid-template-columns:1fr 1fr 1fr;gap:8px;display:grid}button{border-radius:var(--radius);border:.5px solid var(--border-md);color:var(--text);cursor:pointer;background:0 0;padding:9px 16px;font-family:inherit;font-size:15px;transition:background .12s}button:hover{background:var(--bg)}button.primary{background:var(--text);color:var(--bg);border-color:var(--text)}button.primary:hover{opacity:.85}.btn-row{gap:6px;margin-top:8px;display:flex}.btn-row>button{flex:1}.pokemon-list{flex-direction:column;gap:6px;min-height:20px;display:flex}.team-grid{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.box-grid{grid-template-columns:repeat(5,1fr);gap:8px;display:grid}.box-grid .poke-slot{gap:4px;height:180px;padding:16px 4px}.box-grid .poke-slot-sprite-wrap,.box-grid .poke-slot-sprite{width:64px;height:64px}.box-grid .poke-slot-name{font-size:11px}.box-grid .poke-slot-power{font-size:12px}.box-grid .type-tag{padding:1px 5px;font-size:9px}.box-grid .poke-slot-types{flex-direction:column;align-items:center}.box-grid .type-sprite{height:13px;margin-right:0}.poke-slot{background:var(--bg);border:.5px solid var(--border);border-radius:var(--radius);flex-direction:column;align-items:center;gap:6px;height:250px;padding:10px 8px;display:flex;position:relative;overflow:hidden}.poke-slot-empty{opacity:.5;cursor:pointer;border-style:dashed;justify-content:center}.poke-slot-empty:hover{opacity:.85;border-color:var(--border-md)}.poke-slot-adding{z-index:5;overflow:visible}.poke-add-icon{color:var(--hint);pointer-events:none;font-size:36px;line-height:1}.poke-slot-empty:hover .poke-add-icon{color:var(--text)}.add-overlay{background:var(--surface);border-radius:var(--radius);z-index:10;border:1px solid var(--border-md);flex-direction:column;align-items:stretch;gap:6px;padding:28px 8px 8px;display:flex;position:absolute;inset:0;overflow:visible}.add-cancel{cursor:pointer;color:var(--hint);background:0 0;border:none;border-radius:4px;padding:2px 4px;font-size:12px;line-height:1;position:absolute;top:2px;right:4px}.add-cancel:hover{background:var(--danger-bg);color:var(--danger)}.add-autocomplete{position:relative}.add-input{box-sizing:border-box;background:var(--bg);border:.5px solid var(--border-md);border-radius:var(--radius);width:100%;color:var(--text);outline:none;padding:4px 8px;font-size:12px}.add-input:focus{border-color:var(--border-strong,var(--border-md))}.add-suggestions{z-index:20;position:absolute;top:calc(100% + 2px);left:0;right:0;overflow-x:hidden}.add-suggestions .autocomplete-item{grid-template-rows:auto auto;grid-template-columns:auto 1fr;align-items:center;gap:2px 6px;min-width:0;padding:5px 7px;font-size:11px;display:grid}.add-suggestions .autocomplete-item .poke-sprite{grid-area:1/1/3}.add-suggestions .autocomplete-item-name{text-overflow:ellipsis;white-space:nowrap;text-align:center;grid-area:1/2;min-width:0;font-size:13px;font-weight:500;overflow:hidden}.add-suggestions .autocomplete-item-types{flex-direction:row;grid-area:2/2;justify-content:center;gap:4px}.add-suggestions .autocomplete-item .poke-sprite{flex-shrink:0;width:42px;height:42px}.add-suggestions .autocomplete-item .type-sprite{width:auto;height:14px}.add-suggestions .autocomplete-item .poke-id,.add-suggestions .autocomplete-item .poke-meta{display:none}.poke-slot-sprite-wrap{flex-shrink:0;justify-content:center;align-items:center;width:96px;height:96px;display:flex}.poke-slot-sprite{object-fit:contain;width:96px;height:96px;image-rendering:pixelated}.poke-slot-name{text-transform:uppercase;white-space:nowrap;text-overflow:ellipsis;text-align:center;max-width:100%;font-family:"Press Start 2P",monospace;font-size:9px;font-weight:400;overflow:hidden}.poke-slot-types{flex-wrap:nowrap;justify-content:center;gap:3px;display:inline-flex}.team-grid .poke-slot-types{flex-direction:column;align-items:center}.team-grid .type-sprite{height:18px;margin-right:0}.team-grid .poke-slot-sprite-wrap,.team-grid .poke-slot-sprite{width:110px;height:110px}.team-grid .poke-slot-name{font-size:10px}.team-grid .poke-slot-power{font-size:16px}.poke-slot-power{color:var(--muted);font-size:14px;font-weight:500}.poke-slot-remove{color:var(--red);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:2px 5px;font-size:14px;line-height:1;position:absolute;top:2px;right:4px}.poke-slot-move{color:var(--muted);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:2px 5px;font-size:12px;line-height:1;position:absolute;top:2px;left:4px}.poke-slot-move:hover:not(:disabled){background:var(--bg);color:var(--text)}.poke-slot-move:disabled{opacity:.3;cursor:not-allowed}.poke-slot-remove:hover{background:var(--red-bg)}.poke-slot-swap{cursor:pointer;color:var(--hint);background:0 0;border:none;border-radius:4px;padding:2px 4px;font-size:18px;line-height:1;position:absolute;bottom:2px;left:4px}.poke-slot-swap:hover{background:var(--blue-bg,color-mix(in srgb, var(--accent) 15%, transparent));color:var(--accent)}.poke-slot-evolve{cursor:pointer;color:var(--hint);background:0 0;border:none;border-radius:4px;padding:2px 4px;font-size:18px;line-height:1;position:absolute;bottom:2px;right:4px}.poke-slot-evolve:hover{background:var(--green-bg);color:var(--green)}.evolve-overlay{background:var(--surface);border-radius:var(--radius);z-index:10;border:1px solid var(--green);flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:6px 4px;display:flex;position:absolute;inset:0}.evolve-cancel{cursor:pointer;color:var(--hint);background:0 0;border:none;border-radius:4px;padding:2px 4px;font-size:12px;line-height:1;position:absolute;top:2px;right:4px}.evolve-cancel:hover{background:var(--red-bg);color:var(--red)}.evolve-none{color:var(--hint);text-align:center;font-size:11px}.evolve-list{flex-direction:column;gap:4px;width:100%;list-style:none;display:flex;overflow-y:auto}.evolve-option{cursor:pointer;border:.5px solid var(--border);background:var(--bg);border-radius:4px;align-items:center;gap:6px;padding:4px 6px;display:flex}.evolve-option:hover{background:var(--green-bg);border-color:var(--green)}.evolve-option-name{flex:1;font-size:12px;font-weight:500}.poke-row{background:var(--bg);border-radius:var(--radius);border:.5px solid var(--border);align-items:center;gap:10px;padding:9px 12px;display:flex}.poke-name{flex:1;font-size:15px;font-weight:500}.poke-sprite{width:48px;height:48px;image-rendering:pixelated;object-fit:contain;flex-shrink:0}.poke-sprite-empty{display:inline-block}.best-line{flex-direction:row;align-items:flex-start;gap:12px;margin-top:6px;display:flex}.best-poke-row{flex:1;grid-template-rows:auto auto auto;grid-auto-columns:110px;grid-auto-flow:column;justify-content:center;gap:6px 16px;display:grid}.swap-poke{grid-row:span 3;grid-template-rows:subgrid;place-items:start center;display:grid}.swap-poke-info{display:contents}.swap-poke .poke-sprite{width:100px;height:100px}.swap-poke-name{text-transform:uppercase;text-align:center;font-family:"Press Start 2P",monospace;font-size:11px}.swap-poke-types{flex-direction:column;align-items:center;gap:2px;display:flex}.swap-poke .type-sprite{height:18px}.poke-meta{color:var(--muted);text-align:right;flex:1;font-size:12px}.poke-id{color:var(--muted);font-variant-numeric:tabular-nums;flex-shrink:0;min-width:44px;font-size:12px}.poke-remove{color:var(--red);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:3px 8px;font-size:13px}.poke-remove:hover{background:var(--red-bg)}.type-tag{border-radius:99px;margin-right:3px;padding:2px 8px;font-size:11px;font-weight:500;display:inline-block}.type-sprite{vertical-align:middle;width:auto;height:18px;image-rendering:pixelated;margin-right:3px;display:inline-block}.autocomplete{position:relative}.autocomplete-list{z-index:10;background:var(--surface);border:.5px solid var(--border-md);border-radius:var(--radius);max-height:220px;margin-top:2px;list-style:none;position:absolute;top:100%;left:0;right:0;overflow-y:auto;box-shadow:0 4px 12px #00000014}.autocomplete-list[hidden]{display:none}.autocomplete-item{cursor:pointer;border-bottom:.5px solid var(--border);align-items:center;gap:8px;padding:9px 12px;font-size:15px;display:flex}.autocomplete-item:last-child{border-bottom:none}.autocomplete-item:hover,.autocomplete-item.active{background:var(--bg)}.autocomplete-item-name{flex:1;font-weight:500}.autocomplete-item-types{flex-direction:column;flex-shrink:0;align-items:center;gap:3px;display:inline-flex}.autocomplete-item .poke-sprite{width:24px;height:24px}.autocomplete-item .type-sprite{height:13px;margin-right:0}.items-grid{justify-content:center;display:flex}.item-slot{background:var(--bg);border:.5px solid var(--border);border-radius:var(--radius);flex-direction:column;align-items:center;gap:10px;width:100%;padding:16px 12px;transition:background .12s,border-color .12s;display:flex}.item-slot.active{background:var(--blue-bg);border-color:var(--blue)}.item-slot-sprite-wrap{justify-content:center;align-items:center;width:96px;height:96px;display:flex}.item-slot-sprite{object-fit:contain;width:96px;height:96px;image-rendering:pixelated}.item-slot-name{text-transform:uppercase;font-family:"Press Start 2P",monospace;font-size:10px;font-weight:400}.item-slot-stepper{border:.5px solid var(--border-md);background:var(--surface);border-radius:99px;align-items:center;display:inline-flex;overflow:hidden}.item-slot-stepper .stepper-btn{color:var(--text);cursor:pointer;background:0 0;border:none;padding:4px 14px;font-size:18px;font-weight:500;line-height:1}.item-slot-stepper .stepper-btn:hover:not(:disabled){background:#0000000f}.item-slot-stepper .stepper-btn:disabled{cursor:not-allowed;opacity:.35}.item-slot-stepper .stepper-count{text-align:center;min-width:28px;padding:0 4px;font-size:15px;font-weight:600}.metric-grid{grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px;display:grid}.metric{background:var(--bg);border-radius:var(--radius);text-align:center;padding:14px 16px}.metric-yes{background:#1d9e751a}.metric-no{background:#e24b4a1a}.metric-good{background:#1d9e7526}.metric-warn{background:#ef9f2726}.metric-bad{background:#e24b4a26}.metric .val{font-size:28px;font-weight:500}.metric .lbl{color:var(--muted);margin-top:4px;font-size:12px}.bar-bg{background:var(--bg);border:.5px solid var(--border);border-radius:5px;height:10px;margin-bottom:14px;overflow:hidden}.bar-fill{border-radius:4px;height:100%;transition:width .4s,background .4s}#r-advice{text-align:center;margin-bottom:10px}.advice{border-radius:var(--radius);text-align:center;padding:11px 18px;font-size:15px;display:inline-block}.advice.good{background:var(--green-bg);color:var(--green-text)}.advice.warn{background:var(--amber-bg);color:var(--amber-text)}.advice.bad{background:var(--red-bg);color:var(--red-text)}.matchup-info{color:var(--muted);margin-bottom:12px;font-size:13px}.swap-row{border-bottom:.5px solid var(--border);flex-wrap:wrap;align-items:center;gap:8px;padding:9px 0;font-size:15px;display:flex}.swap-row:last-child{border-bottom:none}.swap-arrow{color:var(--green);font-weight:500}.swap-gain{color:var(--green);margin-left:auto;font-size:13px;font-weight:500}.empty-hint{color:var(--hint);font-size:15px}.best-header{border-bottom:.5px solid var(--border);align-items:center;gap:10px;margin-bottom:10px;padding:6px 0 10px;display:flex}.best-size{color:var(--hint);font-size:12px}.best-line{flex-wrap:wrap;align-items:center;gap:8px;padding:6px 0;font-size:15px;display:flex}.best-label{color:var(--hint);min-width:52px;font-size:12px}.opp-card{background:var(--bg);border-radius:var(--radius);margin-bottom:12px;font-size:15px;overflow:hidden}.opp-card-sprite{justify-content:center;align-items:center;min-height:200px;padding:20px;display:flex}.opp-card-info{white-space:nowrap;flex-direction:column;justify-content:center;align-items:center;gap:6px;padding:12px 16px;display:flex}.opp-card-info .type-sprite{height:21px}.opp-sprite-wrap{background:radial-gradient(circle at center, var(--surface) 0%, transparent 70%);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;gap:12px;padding:4px;display:flex}.opp-sprite-wrap:empty{display:none}.opp-sprite{object-fit:contain;width:176px;height:176px;image-rendering:pixelated}.opp-sprite-wrap .opp-sprite:not(:only-child){width:128px;height:128px}.opp-name{letter-spacing:.5px;text-transform:uppercase;font-family:"Press Start 2P",monospace;font-size:15px;font-weight:400;line-height:1.2}.opp-types{align-items:center;gap:4px;display:inline-flex}.retry-note{color:var(--muted);margin-top:8px;font-size:13px}hr{border:none;border-top:.5px solid var(--border);margin:12px 0}
