/* Career uses the same quiet panel treatment as Help and Rankings. */
.career-dialog{width:min(94vw,740px);max-width:calc(100vw - var(--left) - var(--right));height:min(90dvh,840px);max-height:calc(100dvh - var(--top) - var(--bottom) - 16px);padding:0;overflow:hidden;border:1px solid #7198bd;border-radius:14px;background:#0b1b30;color:#edf6ff}
.career-dialog[open]{display:flex;flex-direction:column}
.career-dialog::backdrop{background:#040c20d9}
.career-header{display:flex;justify-content:space-between;gap:14px;align-items:start;flex:none;padding:18px 22px;background:linear-gradient(125deg,#23476c,#102440);border-bottom:1px solid #8cb6e23d}
.career-header h2{font-size:clamp(22px,4vw,28px);line-height:1.15;letter-spacing:-.035em;margin:0}
.career-eyebrow{margin:0 0 7px;font:700 11px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.06em;color:#b4ddff}
.career-dialog button{min-height:44px;border:1px solid #81aed463;background:#193752;color:#edf6ff;padding:8px 13px;border-radius:8px;font:650 13px var(--sans);cursor:pointer}
.career-dialog button:hover{background:#2a5175}
.career-dialog button:focus-visible,.career-dialog summary:focus-visible{outline:2px solid #c6e6ff;outline-offset:3px}
.career-dialog .career-close{width:44px;flex:0 0 44px;padding:0;font-size:20px}
.career-content{min-height:0;flex:1;overflow:auto;overscroll-behavior:contain;padding:20px 22px;scrollbar-color:#5c85b3 #0b1b30;overflow-wrap:anywhere}
.career-rank{display:grid;grid-template-columns:68px minmax(0,1fr);gap:16px;align-items:center}
.career-emblem{width:68px;height:76px;display:grid;place-items:center;background:linear-gradient(140deg,#285d87,#193552);border:1px solid #7cc8ff80;border-radius:20px;color:#bce6ff}
.career-emblem svg{width:42px;height:42px}
.career-rank h3{font-size:22px;margin:0}
.career-rank p:not(.career-eyebrow){font-size:13px;color:#c3d9ed;margin:6px 0}
.career-dialog progress{display:block;width:100%;height:7px;border:0;border-radius:8px;overflow:hidden;background:#071326;accent-color:#8ed1ff}
.career-dialog progress::-webkit-progress-bar{background:#071326}
.career-dialog progress::-webkit-progress-value{background:linear-gradient(90deg,#538fdd,#a6dfff);border-radius:8px}
.career-dialog progress::-moz-progress-bar{background:#8ed1ff}
.career-totals,.career-last-round,.career-milestone{font:550 12px/1.5 var(--sans);color:#c3d9ed;margin:8px 0 0}
.career-milestone{color:#b4ddff}
.career-goal{margin-top:16px;border:1px solid #82cfff75;background:#183b59;padding:14px;border-radius:10px}
.career-goal h3{font-size:17px;margin:0}
.career-goal p:not(.career-eyebrow){font-size:13px;line-height:1.5;color:#d1e3f3;margin:5px 0}
.career-goal-meter{display:grid;grid-template-columns:minmax(32px,1fr) auto;gap:12px;align-items:center;margin-top:10px}
#career-goal-count{font:600 12px var(--mono)}
.career-collection-heading{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin:22px 0 6px}
.career-collection-heading h3{font-size:16px;margin:0}
.career-collection-heading span{font:600 12px var(--mono);color:#abd8ff;text-align:right}
.career-intro{font-size:13px;line-height:1.5;color:#bfd4e8;margin:0 0 14px}
.career-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.career-badge{display:flex;flex-direction:column;align-items:start;padding:14px;border:1px solid #6689ab45;background:#10263e;border-radius:10px;min-width:0}
.career-badge.is-earned{background:linear-gradient(140deg,#22476a,#142e49);border-color:#80bce28a}
.career-badge.is-goal{border-color:#b2e3ff}
.badge-emblem{display:grid;place-items:center;width:36px;height:36px;border:1px solid #82b5d577;background:#1c3c59;border-radius:50%;font-size:20px;color:#bcdbf1;margin-bottom:9px}
.is-earned .badge-emblem{background:#a1d9ff;color:#112b48}
.career-badge h4{font-size:14px;margin:0 0 6px}
.career-badge p{font-size:12px;line-height:1.45;color:#c2d6e8;margin:0 0 12px;flex:1}
.badge-count{font:600 11px var(--mono);color:#bfdcf3;margin:7px 0 0}
.career-badge .badge-track{width:100%;font-size:12px;margin-top:9px}
.badge-track[aria-pressed=true]{background:#2a5577;color:#e5f6ff}
.badge-track[aria-pressed=true]::before{content:'✓' / '';margin-right:5px}
.career-about{border-top:1px solid #6389ae50;margin-top:18px}
.career-about summary{padding:13px 0;cursor:pointer;font-size:13px;min-height:44px}
.career-about p,.career-storage,.career-storage-alert{font-size:12px;line-height:1.5;color:#bfd4e8}
.career-storage,.career-storage-alert{margin:8px 0 0}
.career-storage-alert:empty{margin:0;padding:0;border:0}
.career-storage-alert{margin:0 0 10px;padding:7px 9px;border-left:2px solid #d0b97c;color:#f1e3bf;background:#372f2380}
.career-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;flex:none;padding:10px 22px;border-top:1px solid #8cb6e23d;background:#11273f}
.career-footer span{font-size:12px;color:#bcd3e8}
.career-dialog .career-resume{background:#a4d9ff;color:#102348}
.career-dialog .career-resume:hover{background:#d2edff}
.career-open{position:relative}
.career-open.has-milestone::after{content:'';position:absolute;top:5px;right:5px;width:6px;height:6px;border-radius:50%;background:#b8e5ff;box-shadow:0 0 0 1px #102c47}
.career-notice{position:absolute;z-index:4;bottom:calc(var(--deck-bottom) + var(--bottom) + var(--deck-height) + 62px);left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - var(--left) - var(--right));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:5px 9px;border:1px solid #9edbff;background:#102c47f5;border-radius:6px;color:#e6f6ff;font:650 12px/1.35 var(--sans);pointer-events:none}
.wrap:has(.round-cue:not([hidden])) .career-notice{visibility:hidden}
@media(max-width:1100px){.has-career .top-actions button{width:44px;padding:0}.has-career .top-actions button span{display:none}}
@media(max-width:680px){.career-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:540px){.career-header{padding:14px 16px}.career-content{padding:16px}.career-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.career-badge{padding:12px}.career-rank{grid-template-columns:52px minmax(0,1fr);gap:12px}.career-emblem{width:52px;height:62px}.career-rank h3{font-size:19px}.career-footer{padding:8px 14px}.career-footer span{display:none}.career-footer button{width:100%}}
@media(max-width:440px){.has-career .top-actions{gap:3px}}
@media(max-width:365px){.has-career .brand-wordmark{display:none}.has-career .brand-mark{display:grid}.has-career .brand{flex:0 0 28px}.career-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-height:520px){.career-header{padding-block:9px}.career-content{padding-block:12px}.career-footer{padding-block:6px}}
@media(max-width:850px) and (orientation:portrait),(max-width:760px) and (min-height:521px),(max-width:539px){
 .career-notice{left:calc(var(--left) + 72px);right:var(--right);transform:none;width:auto;max-width:none}
}
@media(max-height:520px) and (min-width:540px){.career-notice{max-width:calc(100% - 224px)}}
@media(forced-colors:active){.career-open.has-milestone::after{background:Highlight;border:1px solid ButtonText}}

/* Collectible insignias: color, silhouette and illustration distinguish families. */
.career-dialog{--accent:#9bc6ff;--shine:#e1f0ff;--tone:#427ae0;--tint:85,145,244;background:#0c172b;border-color:#6889be}
.career-dialog[data-rank="2"]{--accent:#7ee3ef;--shine:#d5fbff;--tone:#2986c9;--tint:75,194,224}
.career-dialog[data-rank="3"]{--accent:#b0a5ff;--shine:#eee7ff;--tone:#7961de;--tint:154,122,240}
.career-dialog[data-rank="4"]{--accent:#efa7e0;--shine:#ffe3f9;--tone:#ba5ba9;--tint:214,118,194}
.career-dialog[data-rank="5"]{--accent:#ffb28c;--shine:#ffebcd;--tone:#d87b4d;--tint:239,149,94}
.career-dialog[data-rank="6"],.career-dialog[data-rank="7"]{--accent:#ffda86;--shine:#fff3c5;--tone:#c29642;--tint:236,187,91}
.career-header{background:radial-gradient(ellipse at 85% 0,rgba(var(--tint),.24),transparent 65%),linear-gradient(120deg,#192c4a,#111e35)}
.career-rank{padding:16px;border:1px solid rgba(var(--tint),.4);border-radius:16px;background:radial-gradient(ellipse at 5% 15%,rgba(var(--tint),.2),transparent 65%),#10213a;grid-template-columns:84px minmax(0,1fr);gap:18px;position:relative}
.career-rank .career-eyebrow{color:var(--accent)}
.career-rank h3{color:var(--shine)}
.career-emblem{position:relative;width:84px;height:84px;isolation:isolate;flex:none;border:0;border-radius:50%;padding:10px;background:conic-gradient(from -90deg,var(--accent) var(--rank-progress,0%),rgba(var(--tint),.18) 0);box-shadow:0 0 25px rgba(var(--tint),.1);color:var(--accent)}
.career-emblem::before{content:'';position:absolute;inset:5px;border-radius:50%;background:radial-gradient(circle at 35% 25%,rgba(var(--tint),.3),#0b1a31 80%),#0b1a31;border:1px solid rgba(var(--tint),.4);z-index:-1}
.career-emblem svg{width:52px;height:52px;filter:drop-shadow(0 2px 3px #0005)}
.career-dialog #career-rank-progress{height:10px;border-radius:3px;margin-top:9px}
.career-dialog progress{background:#080f21;accent-color:var(--accent)}
.career-dialog progress::-webkit-progress-bar{background:#080f21}
.career-dialog progress::-webkit-progress-value{background:linear-gradient(90deg,var(--tone),var(--accent));border-radius:inherit}
.career-dialog progress::-moz-progress-bar{background:linear-gradient(90deg,var(--tone),var(--accent));border-radius:inherit}
.career-dialog #career-rank-progress::-webkit-progress-value{background:repeating-linear-gradient(90deg,transparent 0,transparent 17px,#07122380 17px,#07122380 19px),linear-gradient(90deg,var(--tone),var(--accent))}
.career-dialog #career-rank-progress::-moz-progress-bar{background:repeating-linear-gradient(90deg,transparent 0,transparent 17px,#07122380 17px,#07122380 19px),linear-gradient(90deg,var(--tone),var(--accent))}
.career-dialog[data-rank="7"] #career-rank-progress::-webkit-progress-value{background:linear-gradient(90deg,#78bcff,#a698ff,#f0a1de,#ffb793,#ffda86,#93e9bc)}
.career-dialog[data-rank="7"] .career-emblem{background:conic-gradient(#ffda86,#ffb793,#f0a1de,#a698ff,#78bcff,#93e9bc,#ffda86)}
.career-totals{padding:10px 2px 0;color:#d3e0f2}.career-last-round{display:inline-block;padding:4px 9px;border-radius:20px;color:#d6efff;background:#1b3854;font-size:11px}
.career-milestone{color:var(--accent)}
[data-family="clean"]{--accent:#9bc6ff;--shine:#e1f0ff;--tone:#427ae0;--tint:85,145,244}
[data-family="streak"]{--accent:#ffb197;--shine:#ffe6d5;--tone:#e17858;--tint:245,136,103}
[data-family="water"]{--accent:#84dffc;--shine:#d7f7ff;--tone:#358dc6;--tint:83,195,239}
[data-family="air"]{--accent:#c8b0ff;--shine:#f0e5ff;--tone:#9470de;--tint:175,138,240}
[data-family="explore"]{--accent:#f4a9dd;--shine:#ffe2f4;--tone:#c56ca9;--tint:225,129,194}
[data-family="care"],[data-badge="clean-5"]{--accent:#8ce6b6;--shine:#d9ffe9;--tone:#40a77c;--tint:89,201,148}
[data-badge="clean-25"]{--accent:#b7abff;--shine:#eae5ff;--tone:#8373da;--tint:157,139,237}
[data-badge="clean-100"]{--accent:#ffda86;--shine:#fff3c5;--tone:#c29642;--tint:236,187,91}
[data-badge="clean-500"]{--accent:#ffae94;--shine:#ffe5ce;--tone:#d77958;--tint:235,145,103}
[data-badge="clean-1000"]{--accent:#f5b5ef;--shine:#fff0fc;--tone:#a982db;--tint:209,157,235}
.career-goal{position:relative;overflow:hidden;border-color:rgba(var(--tint),.6);border-left:3px solid var(--accent);background:linear-gradient(110deg,rgba(var(--tint),.19),rgba(var(--tint),.04)),#102039;padding:15px}
.career-goal::after{content:'';position:absolute;right:-12px;top:-30px;width:130px;height:130px;border:18px solid rgba(var(--tint),.045);border-radius:50%;pointer-events:none}
.career-goal .career-eyebrow{color:var(--accent)}
.career-goal h3{color:var(--shine)}
.career-goal-meter{position:relative;z-index:1}.career-goal-meter progress{height:10px;border-radius:20px}
#career-goal-count{border:1px solid rgba(var(--tint),.4);border-radius:20px;padding:4px 9px;background:#0b1a30;color:var(--shine);font-size:11px}
.career-grid{gap:12px}
.career-badge{padding:16px;border-color:rgba(var(--tint),.3);border-radius:13px;background:linear-gradient(155deg,rgba(var(--tint),.11),transparent 70%),#102039;position:relative;overflow:hidden}
.career-badge::before{content:'';position:absolute;top:0;left:16px;right:16px;height:2px;background:linear-gradient(90deg,var(--accent),transparent);opacity:.65}
.career-badge.is-earned{border-color:rgba(var(--tint),.65);background:radial-gradient(ellipse at 15% 0,rgba(var(--tint),.26),transparent 70%),#12223a}
.career-badge.is-goal{border-color:var(--accent);box-shadow:inset 0 0 0 1px rgba(var(--tint),.25)}
.badge-top{display:flex;flex-wrap:wrap;align-items:center;gap:10px;width:100%;margin-bottom:13px}
.badge-family{font:650 9px/1.4 var(--mono);letter-spacing:.065em;text-transform:uppercase;color:var(--accent);max-width:90px;overflow-wrap:normal}
.badge-emblem{width:54px;height:58px;margin:0;flex:none;border:1px solid rgba(var(--tint),.55);border-radius:50% 50% 45% 45%;background:linear-gradient(145deg,rgba(var(--tint),.25),#101e34);color:var(--accent);box-shadow:inset 0 0 0 3px #09182e80,0 3px 8px #03091544}
.badge-emblem svg{display:block;width:39px;height:39px}
.is-earned .badge-emblem{color:#142036;border-color:var(--shine);background:linear-gradient(135deg,var(--shine),var(--accent) 55%,var(--tone));box-shadow:inset 0 0 0 3px #ffffff30,0 4px 14px rgba(var(--tint),.16)}
[data-family="streak"] .badge-emblem{border-radius:9px 9px 24px 24px}
[data-family="water"] .badge-emblem{border-radius:40% 60% 50% 50%;transform:rotate(-8deg)}
[data-family="water"] .badge-emblem svg{transform:rotate(8deg)}
[data-family="air"] .badge-emblem{border-radius:18px 5px 18px 5px}
[data-family="explore"] .badge-emblem{border-radius:12px;transform:rotate(-6deg)}
[data-family="explore"] .badge-emblem svg{transform:rotate(6deg)}
[data-family="care"] .badge-emblem{border-radius:50%;border-style:dashed}
[data-badge="clean-100" ] .badge-emblem,[data-badge="clean-500"] .badge-emblem{border-radius:10px 10px 22px 22px}
[data-badge="clean-1000"] .badge-emblem{border-radius:15px;background:linear-gradient(135deg,#bdcfff44,#edb8f340,#ffc48733)}
[data-badge="clean-1000"].is-earned .badge-emblem{background:linear-gradient(135deg,#c5e7ff,#d6c2ff 30%,#ffd0e8 60%,#ffe0a5)}
.career-badge h4{color:var(--shine);font-size:14px}
.career-badge progress{height:5px;border-radius:2px}
[data-family="streak"] progress::-webkit-progress-value{background:repeating-linear-gradient(110deg,transparent 0 7px,#ffffff35 7px 10px),linear-gradient(90deg,var(--tone),var(--accent))}
[data-family="streak"] progress::-moz-progress-bar{background:repeating-linear-gradient(110deg,transparent 0 7px,#ffffff35 7px 10px),linear-gradient(90deg,var(--tone),var(--accent))}
[data-family="water"] progress,[data-family="care"] progress{height:8px;border-radius:10px}
[data-family="explore"] progress{height:6px;border-radius:0}
.badge-count{color:var(--accent)}.is-earned .badge-count{border:1px solid rgba(var(--tint),.35);padding:4px 8px;border-radius:20px;background:rgba(var(--tint),.12)}
.career-badge .badge-track{background:rgba(var(--tint),.07);border-color:rgba(var(--tint),.35);color:var(--shine)}
.career-badge .badge-track:hover{background:rgba(var(--tint),.2)}
.career-badge .badge-track[aria-pressed=true]{background:rgba(var(--tint),.23);border-color:var(--accent);color:var(--shine)}
@media(max-width:540px){.career-rank{padding:12px;grid-template-columns:64px minmax(0,1fr);gap:12px}.career-emblem{width:64px;height:64px;padding:9px}.career-emblem svg{width:40px;height:40px}.career-rank h3{font-size:18px}.career-grid{gap:9px}.career-badge{padding:12px}.badge-top{gap:7px;flex-wrap:wrap}.badge-emblem{width:47px;height:51px}.badge-emblem svg{width:34px;height:34px}.badge-family{font-size:9px}.career-badge h4{font-size:14px}}
@media(max-width:365px){.badge-top{flex-wrap:nowrap}.badge-family{max-width:none}.badge-emblem{width:54px;height:58px}.badge-emblem svg{width:39px;height:39px}}
@media(forced-colors:active){.career-emblem,.badge-emblem,.is-earned .badge-emblem{background:Canvas;color:CanvasText;border:2px solid ButtonText;box-shadow:none}.career-emblem::before,.career-goal::after,.career-badge::before{display:none}.career-badge,.career-goal,.career-rank{background:Canvas;border-color:ButtonText}.career-badge.is-goal{outline:2px solid Highlight}.badge-family,.badge-count,.career-rank h3,.career-badge h4,.career-goal h3,.career-eyebrow{color:CanvasText}.career-dialog progress{forced-color-adjust:auto}}
