.visual-character>h2{font-size:22px;margin-bottom:8px}.visual-character .gear-toolbar>label{display:none}.visual-character .gear-toolbar{justify-content:flex-end;margin:0}.fish-portraits{display:flex;gap:8px;margin:16px 0}.fish-portraits button{flex:1;min-width:0;display:grid;justify-items:center;padding:6px;border-radius:14px}.fish-portraits canvas{width:65px;height:45px;background:transparent!important}.fish-portraits span{font-size:12px}.fish-portraits [aria-pressed=true]{background:#b9ddcd!important;color:#173a45!important;border-color:#e2f2d8}.wardrobe-layout{display:grid;grid-template-columns:minmax(300px,.9fr) minmax(320px,1.1fr);gap:20px}.character-sheet,.inventory-sheet{min-width:0;border:1px solid #446c72;border-radius:20px;padding:16px;background:#14343ecc}.character-caption,.inventory-heading{display:flex;justify-content:space-between;align-items:center;gap:8px}.character-caption h3{font-size:22px;margin:0}.character-caption span{font-size:12px;color:#b8d1d1}.paper-doll{position:relative;height:290px;margin:12px 0;background:radial-gradient(ellipse at 50% 45%,#48858066,transparent 65%);border-radius:18px}.paper-doll>canvas{position:absolute;left:15%;top:0;width:70%;height:auto;background:transparent!important;border:0!important}.visual-character .personal-slots{display:contents}.visual-character .personal-slots article{position:absolute;display:grid;justify-items:center;width:78px;padding:5px;background:linear-gradient(145deg,#365964,#1a3c47);border:1px solid #8bafa7;border-radius:14px;box-shadow:0 4px 12px #09212a77;gap:2px}.visual-character .personal-slots article[data-slot=weapon]{left:0;top:72px}.visual-character .personal-slots article[data-slot=armour]{right:0;top:72px}.visual-character .personal-slots article[data-slot=charm]{left:calc(50% - 39px);bottom:0}.visual-character .personal-slots canvas{width:60px;height:45px}.visual-character .personal-slots strong,.visual-character .personal-slots article>button:not(.slot-inspect){display:none}.visual-character .personal-slots h3{font-size:10px;text-align:center;text-transform:capitalize}.visual-character .slot-inspect{position:absolute;inset:0;width:100%;height:100%;font-size:0!important;background:transparent;border:0;border-radius:14px}.fish-stat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:12px 0 0}.fish-stat-grid>div{display:flex;justify-content:space-between;gap:8px;border-radius:10px;background:#234952;padding:10px}.fish-stat-grid dt{font-size:12px;color:#bdd7d4}.fish-stat-grid dd{margin:0;font-size:14px;font-weight:700;color:#def0d6}.inventory-heading h3{margin:0}.visual-character .gear-filters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.visual-character .gear-filters label{min-width:0;font-size:10px}.visual-character .gear-filters select{font-size:12px;padding:8px}.visual-character .personal-bag{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;align-content:start;max-height:480px;overflow:auto;padding:4px}.visual-character .personal-bag article{position:relative;display:block;min-width:0;aspect-ratio:1;padding:3px;background:linear-gradient(145deg,#31515e,#162f3c);border:2px solid #587b87;border-radius:12px;cursor:pointer}.visual-character .personal-bag article>:not(canvas):not(.tile-level):not(.tile-marks){display:none}.visual-character .personal-bag canvas{width:100%;height:auto;background:transparent!important}.personal-bag article[data-rarity=fine]{border-color:#9bceba}.personal-bag article[data-rarity=rare]{border-color:#c1a3df;background:linear-gradient(145deg,#4e496b,#233747)}.personal-bag article[aria-pressed=true]{outline:3px solid #f0d298;outline-offset:1px}.tile-level{position:absolute;right:5px;bottom:3px;font-size:11px;color:#f0e3be}.tile-marks{position:absolute;left:4px;top:2px;font-size:10px;color:#e7d399}.visual-character .bag-hint{font-size:12px;margin:10px 0}.inventory-sheet:not(.smelting) .smelt-selected{display:none}.smelt-protected{opacity:.35;cursor:not-allowed!important}.wardrobe-help{font-size:13px;margin-top:16px}.wardrobe-help summary{cursor:pointer;min-height:30px}.wardrobe-detail article{display:flex;flex-wrap:wrap;gap:10px}.wardrobe-detail article>canvas{width:150px;height:112px;background:transparent!important;margin:auto}.wardrobe-detail article h3,.wardrobe-detail article p{width:100%;margin:4px 0}.wardrobe-detail article button{min-height:44px;flex:1}.wardrobe-detail .tile-level,.wardrobe-detail .tile-marks,.wardrobe-detail article>label{display:none}.wardrobe-detail .gear-comparison{line-height:1.8;font-size:14px;color:#d0e9bf}.gear-placeholder{aspect-ratio:1}.visual-character .gear-result:empty{display:none}.visual-character [role=button]:focus-visible,.visual-character button:focus-visible{outline:3px solid #f0d298;outline-offset:2px}
@media(max-width:760px){.wardrobe-layout{grid-template-columns:1fr}.character-sheet,.inventory-sheet{padding:12px}.visual-character>h2{font-size:18px}.fish-portraits{gap:5px}.fish-portraits canvas{width:48px;height:34px}.fish-portraits span{font-size:10px}.fish-portraits button{padding:5px 1px;min-height:52px}.paper-doll{height:220px}.visual-character .personal-slots article[data-slot=weapon],.visual-character .personal-slots article[data-slot=armour]{top:50px}.visual-character .personal-bag{grid-template-columns:repeat(4,minmax(0,1fr));max-height:none}.wardrobe-detail{margin:auto auto max(8px,env(safe-area-inset-bottom));max-height:85dvh;border-radius:22px 22px 10px 10px}.fish-stat-grid>div{padding:8px}.character-caption h3{font-size:20px}}
.smelt-rarity{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.smelt-rarity button{flex:1 1 110px;min-height:44px;font-size:12px}.inventory-sheet:not(.smelting) .smelt-rarity{display:none}.smelt-list{max-height:30dvh;overflow:auto;line-height:1.6}
.wardrobe-detail .gear-comparison{display:grid;grid-template-columns:1fr;gap:4px}.wardrobe-detail .gear-comparison>span{display:block;padding:5px 8px;background:#264952;border-radius:6px}.visual-character .personal-slots article{font-size:0}.visual-character .personal-slots .empty-slot{border-style:dashed}.visual-character .personal-slots .empty-slot canvas{opacity:.3}.wardrobe-detail .inspection-content>button{margin-top:8px;min-height:44px}
/* Equipped slots and inventory use the same model-driven rarity palette. */
.visual-character .personal-slots article[data-rarity=simple]{border:2px solid #7895a2}
.visual-character .personal-slots article[data-rarity=fine]{border:2px solid #9bceba;background:linear-gradient(145deg,#335e59,#1a3c47)}
.visual-character .personal-slots article[data-rarity=rare]{border:2px solid #c1a3df;background:linear-gradient(145deg,#4e496b,#233747)}
.visual-character .personal-slots article[data-rarity=empty]{border:1px dashed #8bafa7}
.visual-character .personal-slots .slot-tooltip{display:none;position:absolute;z-index:30;top:calc(100% + 8px);left:0;width:220px;max-width:65vw;padding:10px 12px;border:1px solid #8bafa7;border-radius:10px;background:#102c37;color:#eff8f3;font:500 13px/1.5 system-ui;box-shadow:0 6px 20px #071f2faa;pointer-events:none;overflow-wrap:anywhere;text-align:left}
.visual-character .personal-slots article[data-slot=armour] .slot-tooltip{left:auto;right:0}
.visual-character .personal-slots article[data-slot=charm] .slot-tooltip{left:50%;transform:translateX(-50%);top:auto;bottom:calc(100% + 8px)}
.visual-character .personal-slots article:focus-within .slot-tooltip{display:block}
@media(hover:hover){.visual-character .personal-slots article:hover .slot-tooltip{display:block}}
.visual-character .personal-slots article:has(.slot-tooltip){overflow:visible}
.wardrobe-detail article[data-rarity=rare] h3{color:#d8bfee}
.wardrobe-detail article[data-rarity=fine] h3{color:#b9e4d1}
/* The inspection hit area must never paint over the equipment canvas. */
.visual-character .personal-slots .slot-inspect,
.visual-character .personal-slots .slot-inspect:hover:enabled,
.visual-character .personal-slots .slot-inspect:focus,
.visual-character .personal-slots .slot-inspect:active{background:transparent!important;background-image:none!important;box-shadow:none;opacity:1}
.visual-character .personal-slots article:hover{box-shadow:0 0 0 2px #f0d298,0 4px 12px #09212a77}
