.collection-tabs{display:flex;gap:5px;flex:0 0 auto;align-self:flex-start;padding:4px;border:1px solid #8ec8c8;border-radius:14px;background:#b6e4df}.collection-tabs button{border:0!important;border-radius:10px!important;padding:7px 23px!important;background:transparent!important;box-shadow:none!important;color:#246475!important;font:800 13px/1.25 'Nunito',sans-serif;cursor:pointer}.collection-tabs button[aria-pressed=true]{background:#fff8dd!important;box-shadow:0 2px 0 #8eb5a8!important;color:#244f5d!important}.collection-tabs button:focus-visible{outline:3px solid #174f68;outline-offset:2px}.balloons-view{height:100%;min-height:0;display:flex;flex-direction:column;gap:12px;color:#215970}.balloons-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}.balloons-heading small{font-size:9px;letter-spacing:1.7px;font-weight:900;color:#49858d}.balloons-heading h2{font:800 29px/1.1 'Baloo 2',sans-serif;margin:3px 0}.balloons-heading p{font-size:12px;margin:5px 0 0;color:#467581}.balloons-equipped{flex:0 0 auto;border:2px solid #ffe8a0;border-radius:15px;padding:8px 16px;background:#fff8d9;text-align:right;box-shadow:0 3px 0 #c5b985}.balloons-equipped span{display:block;font-size:8px;letter-spacing:1.7px;font-weight:900;color:#9c7b35}.balloons-equipped strong{font:800 20px/1.2 'Baloo 2',sans-serif;color:#725728}.balloons-grid{overflow:auto;min-height:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-content:start;gap:15px;padding:3px 7px 10px 3px;scrollbar-color:#55afb6 #cfede2;scrollbar-width:thin}.balloon-card{min-width:0;position:relative;display:flex;flex-direction:column;border:2px solid #faffed;border-radius:20px;padding:10px 11px 12px;background:linear-gradient(150deg,#fffee9,#d5f4e9);box-shadow:0 4px 0 #79bcbc}.balloon-card[data-rarity=legendary]{background:linear-gradient(145deg,#fff4cf,#ecdef7 58%,#d6eeed);border-color:#ffe9a6;box-shadow:0 4px 0 #b79b68}.balloon-card[data-selected=true]{outline:3px solid #f5bf4e;outline-offset:0}.balloon-card-art{position:relative;aspect-ratio:1.13;background:radial-gradient(ellipse at 50% 55%,#fff9e6 0,#fffcec65 53%,transparent 72%);border-radius:14px;display:flex;align-items:center;justify-content:center}.balloon-card-art canvas{display:block;width:100%;height:100%;object-fit:contain}.balloon-art-status{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:10px;text-align:center;color:#467d82;font-size:11px;font-weight:800}.balloon-art-status[hidden]{display:none}.balloon-rarity{font-size:8px;font-weight:900;letter-spacing:1.4px;color:#528e91;align-self:flex-start}.balloon-card[data-rarity=legendary]>.balloon-rarity{background:#765b92;color:#fff6d6;border:1px solid #fff0b2;border-radius:6px;padding:3px 6px;font-size:7px}.balloon-card h3{font:800 21px/1.12 'Baloo 2',sans-serif;margin:6px 0 8px;color:#275d70}.balloon-card[data-rarity=legendary] h3{color:#614974}.balloon-hero{display:flex;align-items:center;gap:8px;margin-bottom:11px;min-height:42px}.balloon-hero>.character-card-art{flex:0 0 36px;width:36px;height:45px;border-radius:8px;overflow:hidden;min-height:0}.balloon-hero>.character-card-art .character-card-copy,.balloon-hero>.character-card-art .character-card-stamp{display:none}.balloon-hero .character-card-art img{height:100%;width:100%;object-fit:cover}.balloon-hero span{min-width:0;display:block;color:#745e7e}.balloon-hero strong{display:block;font-size:11px;line-height:1.2}.balloon-hero small{display:block;font-size:9px;line-height:1.25;margin-top:3px;color:#687588}.balloon-normal-note{font-size:11px;line-height:1.4;color:#50828c;margin:0 0 12px;min-height:42px}.balloon-card button{margin-top:auto;min-height:36px;border:2px solid #fffbee;background:linear-gradient(#f8ffe8,#c7eee2);box-shadow:0 3px 0 #80b5b5;border-radius:11px;font-size:11px;font-weight:850;color:#285e6e;cursor:pointer;padding:7px}.balloon-card[data-selected=true]>button{background:#ffe3a0;color:#7d5d26;border-color:#fff8cf;box-shadow:0 3px 0 #c8a362}.balloon-card button:focus-visible{outline:3px solid #1b566d;outline-offset:2px}.balloon-art-status button{font-size:10px;margin:0;background:#fff8e2}.balloons-footnote{flex:0 0 auto;margin:0;color:#467a85;font-size:10px;font-weight:700;line-height:1.4}.skins-view>.collection-tabs{margin-bottom:0}
@media(min-width:1350px){.balloons-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:900px){.balloons-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.balloons-view{gap:8px}.balloons-heading h2{font-size:25px}.balloons-heading p{font-size:10px}.balloons-equipped{padding:7px 10px}.balloons-equipped strong{font-size:16px}.balloon-card h3{font-size:18px}}
@media(max-width:520px){.balloons-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;padding-right:4px}.balloons-heading{align-items:flex-start;gap:8px}.balloons-heading small{font-size:7px;letter-spacing:1px}.balloons-heading h2{font-size:22px}.balloons-heading p{font-size:10px;line-height:1.35}.balloons-equipped{max-width:112px;padding:7px 9px}.balloons-equipped strong{font-size:14px}.balloons-equipped span{font-size:7px}.balloon-card{padding:8px;border-radius:16px}.balloon-card h3{font-size:17px;min-height:36px}.balloon-hero{gap:6px}.balloon-hero strong{font-size:10px}.balloon-hero small{font-size:8px}.balloons-footnote{font-size:9px}.collection-tabs button{padding:6px 20px!important;font-size:12px}}
@media(max-height:500px) and (orientation:landscape){.balloons-view{gap:5px}.collection-tabs{position:absolute;right:27px;top:7px;z-index:2}.balloons-heading{padding-right:5px;min-height:42px}.balloons-heading small,.balloons-heading p{display:none}.balloons-heading h2{font-size:21px}.balloons-equipped{padding:3px 11px}.balloons-equipped span{font-size:7px}.balloons-equipped strong{font-size:15px}.balloons-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}.balloon-card{padding:7px;border-radius:13px}.balloon-card h3{font-size:15px;margin:5px 0 6px}.balloon-hero{min-height:33px;margin-bottom:8px}.balloon-hero>.character-card-art{width:27px;height:35px;flex-basis:27px}.balloon-hero small{font-size:8px}.balloon-normal-note{font-size:9px;min-height:33px}.balloon-card>button{font-size:10px;min-height:30px;padding:5px}.balloons-footnote{font-size:8px}.skins-view>.collection-tabs{position:static;align-self:flex-start;padding:2px}.skins-view>.collection-tabs button{font-size:9px;padding:3px 13px!important}}

@media(max-height:500px) and (orientation:landscape){.balloon-card-art{aspect-ratio:auto;height:68px;flex:0 0 68px}.balloon-card h3{line-height:16px;margin:4px 0 5px}.balloon-hero{min-height:28px;height:28px;margin-bottom:6px}.balloon-hero>.character-card-art{height:28px;width:23px;flex-basis:23px}.balloon-hero strong{font-size:9px}.balloon-hero small{font-size:7px;line-height:9px;margin-top:2px}.balloon-normal-note{font-size:8px;min-height:28px;margin-bottom:6px}.balloon-card>button{min-height:28px;padding:4px}.balloon-card[data-rarity=legendary]>.balloon-rarity{font-size:6px;padding:2px 5px}.balloon-card{padding:6px}.balloons-heading{min-height:38px}.collection-tabs{right:68px}}

/* The portrait balloon catalogue is a contained screen; the existing island
   toolbar and its wider home layout resume when the catalogue closes. */
@media(max-width:520px) and (orientation:portrait){body:has(.profile-dialog[open] .balloons-view){overflow:hidden}body:has(.profile-dialog[open] .balloons-view) .app-shell{height:100dvh;min-height:0;padding:0;overflow:hidden}body:has(.profile-dialog[open] .balloons-view) .topbar{display:none}body:has(.profile-dialog[open] .balloons-view) .app-shell>main{height:calc(100dvh - 24px);min-height:0;margin:12px;width:auto}body:has(.profile-dialog[open] .balloons-view) #main-screen{height:100%;min-height:0}}