.element-chip{display:inline-flex;align-items:center;gap:5px;padding:4px 6px;border:1px solid color-mix(in srgb,var(--element-color) 27%,transparent);background:color-mix(in srgb,var(--element-color) 7%,#172129);border-radius:5px;font-size:9px;color:#c9d5d9;vertical-align:middle;white-space:nowrap}.element-chip img{width:21px;height:21px;image-rendering:pixelated}.element-chip b{font:500 9px 'Space Grotesk',sans-serif;color:var(--element-color)}.matchup-row{padding:10px 0;display:flex;flex-direction:column;gap:8px}.matchup-row>b{font-size:10px}.matchup-row>div{display:flex;gap:5px;flex-wrap:wrap}.matchup-row.weak>b{color:#ff978c}.matchup-row.resist>b{color:#92bfed}.matchup-row.strong>b{color:var(--mint)}.map-edition{font-size:10px;color:var(--muted)}.map-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;margin:24px 0}.map-option{position:relative;background:var(--panel);border:1px solid var(--line);padding:19px 17px;text-align:left;border-radius:8px;overflow:hidden;transition:border-color .2s,background .2s;min-height:112px}.map-option:after{content:'';position:absolute;right:-17px;top:-21px;width:90px;height:90px;border:1px solid var(--map-color);opacity:.1;transform:rotate(35deg);border-radius:30%}.map-option.selected{border-color:var(--map-color);background:color-mix(in srgb,var(--map-color) 10%,var(--panel))}.map-option:not(:disabled):hover{border-color:var(--map-color)}.map-option:disabled{opacity:.4;cursor:not-allowed}.map-marker{display:block;font-size:25px;color:var(--map-color);margin-bottom:9px}.map-option>b{display:block;font:500 15px 'Space Grotesk',sans-serif;margin-bottom:8px}.map-option>small{font-size:9px;color:#a4b3bc}.map-overview{display:grid;grid-template-columns:1.2fr 1fr;gap:26px;border:1px solid color-mix(in srgb,var(--map-color) 40%,var(--line));border-radius:9px;padding:26px;background:linear-gradient(125deg,color-mix(in srgb,var(--map-color) 10%,#172129),#182129 75%)}.map-overview h3{font-size:28px;letter-spacing:-1px;font-weight:500;margin:10px 0}.map-overview p{font-size:12px;color:var(--muted);line-height:1.8;max-width:450px}.map-type-group{margin-top:18px}.map-type-group>b{display:block;margin-bottom:8px;font-size:10px;color:#aab8b3;font-weight:500}.map-type-group>div{display:flex;gap:5px;flex-wrap:wrap}.map-guardians{border-left:1px solid var(--line);padding-left:25px}.map-guardians h4{font-size:10px;letter-spacing:1px;font-weight:500;color:#aab9b2;margin:3px 0 17px}.map-guardians>div{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.map-guardians button{padding:7px 3px;background:#15202870;border:1px solid var(--line);border-radius:6px;color:#bdcbd1;font-size:8px}.map-guardians button:hover{border-color:var(--mint)}.map-guardians img{width:35px;height:35px;image-rendering:pixelated;display:block;margin:auto auto 7px;border-radius:50%}.map-controls{display:flex;flex-wrap:wrap;gap:16px 13px;align-items:center;padding:24px 0 30px}.map-controls>label:not(.map-check){flex:1;min-width:160px;color:#9eafb8;font-size:10px}.map-controls select{display:block;margin-top:7px;padding:11px 9px;width:100%;background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:5px;font-size:11px}.map-check{display:flex;align-items:center;gap:7px;color:#b0c0c5;font-size:10px;cursor:pointer}.map-check input{accent-color:var(--mint);width:14px;height:14px}.map-targets{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin:14px 0 23px}.map-targets>span:first-child{color:var(--muted);font-size:10px;margin-right:4px}.map-recommendations{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.map-rec{background:var(--panel);border:1px solid var(--line);border-radius:9px;padding:20px}.map-rec:first-child{border-color:color-mix(in srgb,var(--map-color) 65%,var(--line))}.rec-heading{display:flex;gap:12px;align-items:center;min-height:70px}.rec-place{font:15px 'Space Grotesk';color:#61756d}.rec-heading>img{width:55px;height:55px;image-rendering:pixelated;border-radius:50%}.rec-heading h3{font-size:18px;font-weight:500;margin:0 0 5px;letter-spacing:-.4px}.rec-heading small{display:block;color:#8fa38f;font-size:9px;margin-bottom:8px}.rec-numbers{display:flex;gap:6px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 0;margin:15px 0}.rec-numbers>div{flex:1}.rec-numbers small{display:block;color:var(--muted);font-size:8px;margin-bottom:7px}.rec-numbers b{font:500 19px 'Space Grotesk';color:var(--map-color)}.rec-numbers>div:first-child b{font-size:25px}.rec-reason{margin:12px 0}.rec-reason>b{display:block;font-size:9px;color:#b2c6ab;margin-bottom:7px;font-weight:500}.rec-reason>span{display:flex;align-items:center;flex-wrap:wrap;gap:5px;font-size:10px;color:var(--muted);line-height:1.6}.rec-reason.danger>b{color:#f1a59b}.rec-reason .element-chip{font-size:8px;padding:3px 5px}.rec-reason .element-chip img{width:17px;height:17px}.rec-actions{display:flex;gap:8px;margin-top:18px;padding-top:15px;border-top:1px solid var(--line)}.rec-actions .btn{flex:1;font-size:9px;padding:10px 7px}.element-method{border:1px solid var(--line);background:#172127;border-radius:8px;padding:18px;margin-top:24px}.element-method summary{cursor:pointer;color:var(--mint);font-size:12px}.element-method p{font-size:11px;color:#a8bac2;line-height:1.9;max-width:940px}.element-method b{color:#d0ddd2}.detail-content>#element-detail{margin-top:0;padding-top:0;border-top:0}.rail .nav{gap:8px}
@media(min-width:1600px){.map-picker{grid-template-columns:repeat(6,1fr)}.map-recommendations{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1000px){.map-overview{grid-template-columns:1fr;gap:20px}.map-guardians{border-left:0;border-top:1px solid var(--line);padding:20px 0 0}.map-guardians>div{grid-template-columns:repeat(6,1fr)}.map-rec{padding:15px}.rec-heading{gap:8px}.rec-heading>img{width:46px;height:46px}.rec-heading h3{font-size:16px}.rec-place{font-size:12px}.rec-numbers b{font-size:17px}.map-picker{grid-template-columns:repeat(2,1fr)}}
@media(max-width:800px){.detail-content>#element-detail,.detail-content>#element-detail+div{grid-column:1/-1}.matchup-row{flex-direction:row;align-items:flex-start}.matchup-row>b{width:78px;flex-shrink:0;padding-top:9px}.rail nav{max-width:calc(100vw - 155px)}.rail .nav{gap:0}.map-overview{padding:20px}.map-guardians>div{grid-template-columns:repeat(4,1fr)}.rec-numbers{gap:8px}}
@media(max-width:600px){.map-recommendations{grid-template-columns:1fr}.map-edition{font-size:9px}.map-option{padding:15px}.map-option>b{font-size:13px}.map-option>small{font-size:8px;line-height:1.6}.map-controls{gap:14px}.map-overview h3{font-size:25px}.map-guardians>div{grid-template-columns:repeat(3,1fr)}.map-controls>label:not(.map-check){min-width:135px}.rec-numbers small{font-size:9px}.rec-numbers b{font-size:21px}.rec-heading>img{width:58px;height:58px}.rec-heading h3{font-size:20px}}
.comparison-elements{display:flex;flex-wrap:wrap;gap:5px;max-width:260px;min-width:180px}.comparison-elements .element-chip{font-size:8px}.comparison-elements .element-chip img{width:18px;height:18px}

/* Collection stamp keeps its own space above the recommendation heading. */
.map-recommendations .map-rec{position:relative;padding-top:48px}
.map-owned-stamp{position:absolute;top:13px;right:17px;display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border:3px double #b6f08b;border-radius:4px;color:#c4f6a0;background:#b6f08b0c;font:700 10px 'Space Grotesk',sans-serif;letter-spacing:1px;line-height:1.2;transform:rotate(-7deg);pointer-events:none}
.map-owned-stamp>span{font-size:13px;line-height:1}