/* Shared Hanip geometry and alpha layers are intentionally inherited unchanged. */
.career-page{--accent:#80d7df}.career-page [hidden]{display:none!important}
.career-page #start{height:auto;min-height:590px}.career-page #start .callout{height:auto;min-height:0;display:block;line-height:1.85;white-space:pre-line;margin:24px 0 18px!important}.career-page #start .small{height:auto}.career-page #start .test-stats{flex:none}
.career-grid{display:grid;gap:18px;margin-top:28px}.career-card{border:1px solid #35363c;border-radius:18px;padding:24px;background:linear-gradient(130deg,#80d7df0b,transparent 65%)}.career-card:first-child{border-color:#80d7df88}.career-rank{font-size:12px;letter-spacing:2px;font-weight:800;color:var(--accent)}.career-card h2{font-size:26px;margin:12px 0;line-height:1.4;word-break:keep-all}.career-card p{line-height:1.85;color:#d0ccd4;white-space:pre-line}.career-card h3{font-size:14px;color:var(--accent);margin:22px 0 8px}.career-tags{display:flex;flex-wrap:wrap;gap:7px}.career-tags span{padding:6px 10px;border:1px solid #3d454b;border-radius:20px;font-size:12px;color:#b9cfd3}.career-page details{line-height:1.85;color:#bcb8c3}.career-page summary{cursor:pointer;color:#eceaf0;font-weight:700}.career-page a:not(.btn):not(.recommend-card){color:var(--accent)}.disclaimer{margin-top:24px}.career-page #sharePreview{display:block;width:100%;border-radius:16px;margin:12px 0}.career-page #saveImage{display:block;text-align:center;text-decoration:none;margin:12px 0}.career-page label{display:block;margin:16px 0 8px}.career-page input{width:100%;padding:12px;background:#15151b;border:1px solid #3b3944;border-radius:8px;color:#eee}.career-page #shareStatus{min-height:22px}.career-page .career-card a{font-size:13px}
@media(max-width:420px){.career-card{padding:20px 17px}.career-card h2{font-size:23px}}
@media(prefers-reduced-motion:reduce){.career-page .orbit{animation:none}.career-page .analysis-fill{transition:none}}
/* Career's own cyan accent instead of the legacy game-green icon filter. */
.career-page #start .test-stat img.stat-icon-img{filter:brightness(0) saturate(100%) invert(83%) sepia(33%) saturate(568%) hue-rotate(134deg) brightness(92%) contrast(91%)!important}

/* Result hierarchy mirrors the champion result: portraits, values, reasons, details. */
.career-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:28px}
.career-pick{min-width:0;text-align:center}.career-portrait{position:relative;overflow:hidden;aspect-ratio:1;border:1px solid #80d7df48;border-radius:16px;background:radial-gradient(ellipse at 30% 15%,#80d7df20,transparent 65%),linear-gradient(140deg,#17272f,#101319);color:#80d7df;box-shadow:inset 0 0 0 5px #09090d80}
.career-pick:nth-child(2) .career-portrait{color:#c1b6ee;background:radial-gradient(ellipse at 30% 15%,#c1b6ee20,transparent 65%),linear-gradient(140deg,#242033,#101319);border-color:#c1b6ee48}
.career-pick:nth-child(3) .career-portrait{color:#e0c396;background:radial-gradient(ellipse at 30% 15%,#e0c39620,transparent 65%),linear-gradient(140deg,#2b2824,#101319);border-color:#e0c39648}
.career-portrait svg{display:block;width:100%;height:100%;padding:4% 4% 9%}.career-art-label{position:absolute;bottom:9%;left:0;right:0;font-size:10px;letter-spacing:.04em;color:#d1d4dc}.career-pick .career-rank{margin:13px 0 7px;font-size:11px;letter-spacing:1px}.career-pick h2{font-size:18px;line-height:1.55;word-break:keep-all;overflow-wrap:anywhere;margin:0}.career-art-note{font-size:11px!important;text-align:center;margin-top:16px!important}.career-details{display:grid;gap:16px}.career-card h2{color:var(--accent);font-size:22px;margin:0 0 22px}.career-card .career-match-count{font-size:12px;color:#a7acb8}.career-axis{display:grid;grid-template-columns:100px minmax(0,1fr) 45px;gap:14px;align-items:center;margin:17px 0;font-size:14px}.career-axis b{font-weight:600}.career-axis>span{text-align:right;font-variant-numeric:tabular-nums;color:#d8e3e6}.career-track{height:8px;overflow:hidden;border-radius:999px;background:#26252d}.career-fill{height:100%;background:var(--accent);border-radius:inherit}.career-page #careerWhy{line-height:1.9}.career-page #careerDetails h3{color:#eceaf0}
@media(max-width:480px){.career-grid{gap:9px}.career-portrait{border-radius:12px}.career-pick h2{font-size:14px}.career-art-label{font-size:8px}.career-pick .career-rank{font-size:10px}.career-axis{grid-template-columns:85px minmax(0,1fr) 40px;gap:9px;font-size:12px}.career-card h2{font-size:20px}}
