/* Career Lottery activity theatre. All motion is decorative and skippable. */
.career-app .cl-scene{position:fixed;inset:0;z-index:100004;display:grid;place-items:center;width:100vw;height:100vh;height:100dvh;max-width:none;max-height:none;padding:24px;margin:0;border:0;overflow:hidden;background:transparent;color:#f7fbff;font:16px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;overscroll-behavior:contain;isolation:isolate}
.career-app .cl-scene:not([open]){display:none}
.career-app .cl-scene::backdrop{background:#030a1ccc;backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}
.cl-scene,.cl-scene *,.cl-scene *::before,.cl-scene *::after{box-sizing:border-box}
.career-app .cl-scene-card{position:relative;width:min(100%,720px);max-height:calc(100vh - 48px);max-height:calc(100dvh - 48px);border:1px solid color-mix(in srgb,var(--cl-scene-accent) 45%,#fff2);border-radius:30px;overflow:auto;overscroll-behavior:contain;background:radial-gradient(ellipse at 50% 0,color-mix(in srgb,var(--cl-scene-dark) 55%,transparent),transparent 58%),linear-gradient(150deg,#17233e,#0c1630 70%);box-shadow:0 24px 90px #0009,0 0 80px color-mix(in srgb,var(--cl-scene-accent) 13%,transparent);animation:cl-scene-card-in .3s cubic-bezier(.16,1,.3,1);scrollbar-width:thin;scrollbar-color:var(--cl-scene-accent) #111c34}
.career-app .cl-scene-close{position:absolute;top:16px;right:16px;z-index:5;display:grid;place-items:center;width:46px;height:46px;min-height:46px;margin:0;padding:0;border:1px solid #ffffff3d;border-radius:50%;background:#09132cbf;color:#f9fbff;box-shadow:0 4px 16px #0003;cursor:pointer;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:transform .18s ease,background .18s ease}
.career-app .cl-scene-close:hover{background:#33435e}.career-app .cl-scene-close:active{transform:scale(.92)}
.career-app .cl-scene-stage{position:relative;aspect-ratio:720/340;min-height:160px;overflow:hidden;border-bottom:1px solid #ffffff12;background:radial-gradient(ellipse at 50% 30%,color-mix(in srgb,var(--cl-scene-accent) 15%,transparent),transparent 70%)}
.career-app .cl-scene-illustration{display:block;width:100%;height:100%;overflow:visible}
.career-app .cl-scene-copy{padding:0 30px 25px;margin-top:-8px;position:relative}
.career-app .cl-scene-kicker{display:block;width:fit-content;margin:0 auto 9px;padding:5px 13px;border:1px solid color-mix(in srgb,var(--cl-scene-accent) 42%,transparent);border-radius:30px;background:#0a1538;color:var(--cl-scene-light);font-size:max(14px,16px);line-height:1.4;font-weight:650;letter-spacing:.02em;text-align:center}
.career-app .cl-scene-copy h2{margin:0 0 10px;color:#f9fcff;font:800 clamp(28px,4vw,38px)/1.08 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;text-align:center;letter-spacing:-.045em;text-wrap:balance;text-transform:none}
.career-app p.cl-scene-subtitle{margin:0 auto 15px;max-width:38ch;color:var(--cl-scene-light);font-size:max(14px,18px);line-height:1.4;text-align:center;text-wrap:balance}
.career-app .cl-scene-results{display:flex;justify-content:center;flex-wrap:wrap;gap:9px;margin:20px auto 0;max-width:600px}
.career-app .cl-scene-chip{display:flex;flex:1 1 145px;max-width:250px;min-width:0;flex-direction:column;justify-content:center;align-items:center;gap:3px;padding:12px 13px;border:1px solid #a4bdde30;border-radius:15px;background:#22334b8c;text-align:center;animation:cl-scene-chip-in .4s .16s both cubic-bezier(.16,1,.3,1)}
.career-app .cl-scene-chip strong{display:block;max-width:100%;font-size:max(14px,20px);line-height:1.2;color:#e7f7ff;overflow-wrap:anywhere;text-wrap:balance}
.career-app .cl-scene-chip span{display:block;color:#b9cae2;font-size:max(14px,16px);line-height:1.3;text-wrap:balance}
.career-app .cl-scene-chip--up{border-color:#6ee7b740;background:linear-gradient(145deg,#15494388,#19374b8c)}
.career-app .cl-scene-chip--up strong{color:#a2ffd8}
.career-app .cl-scene-chip--down{border-color:#fda4af40;background:linear-gradient(145deg,#532b4388,#2731498c)}
.career-app .cl-scene-chip--down strong{color:#ffc0c9}
.career-app .cl-scene-chip:nth-child(2){animation-delay:.21s}.career-app .cl-scene-chip:nth-child(3){animation-delay:.26s}.career-app .cl-scene-chip:nth-child(4){animation-delay:.31s}
.career-app .cl-scene-details{max-width:600px;margin:15px auto 0;border:0;border-radius:10px;background:transparent;color:#adc1dc;text-align:center}
.career-app .cl-scene-details>summary{display:flex;align-items:center;justify-content:center;min-height:44px;padding:5px;color:#b6c8e0;font-size:max(14px,16px);cursor:pointer;list-style:none;text-decoration:underline;text-underline-offset:4px}
.career-app .cl-scene-details>summary::-webkit-details-marker{display:none}
.career-app .cl-scene-details p{margin:5px 0 0;padding:10px 14px;border-radius:12px;background:#060f2366;color:#d4e3f2;font-size:max(14px,16px);line-height:1.5;text-wrap:pretty}
.career-app .cl-scene-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:18px}
.career-app .cl-scene-saved{display:inline-flex;align-items:center;gap:7px;min-width:0;color:#9fb7cd;font-size:max(14px,16px);line-height:1.3}
.career-app .cl-scene-saved svg{color:#72e7ba;flex:none}
.career-app .cl-scene-continue{display:inline-flex;align-items:center;justify-content:center;gap:11px;min-height:48px;min-width:148px;flex:none;border:1px solid var(--cl-scene-light);border-radius:13px;padding:12px 18px;background:var(--cl-scene-accent);color:#08172b;font-size:max(14px,16px);font-weight:750;cursor:pointer;box-shadow:0 5px 18px #0002;transition:transform .18s ease,filter .18s ease}
.career-app .cl-scene-continue:hover{filter:brightness(1.08)}.career-app .cl-scene-continue:active{transform:scale(.96)}
.career-app .cl-scene :is(button,summary):focus-visible{outline:3px solid #fff;outline-offset:4px}
.career-app .cl-scene-timer{position:sticky;bottom:0;left:0;width:100%;height:3px;background:#ffffff0d;overflow:hidden;border-radius:0 0 28px 28px}
.career-app .cl-scene-timer span{display:block;width:100%;height:100%;background:var(--cl-scene-accent);transform-origin:left;animation:cl-scene-timer var(--cl-scene-duration,2400ms) linear forwards}
.career-app .cl-scene-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;margin:-1px;padding:0;border:0}
.cl-scene-person-motion{transform-box:fill-box;transform-origin:50% 85%;animation:cl-scene-person .75s ease-in-out 2}
.cl-scene-person--run .cl-scene-person-motion{animation:cl-scene-run .34s ease-in-out 5}
.cl-scene-cap{transform-box:fill-box;transform-origin:50% 50%;animation:cl-scene-cap 1.45s cubic-bezier(.2,.8,.25,1) both}
.cl-scene-book{transform-box:fill-box;transform-origin:50% 80%;animation:cl-scene-book .9s .12s ease-out both}
.cl-scene-star{transform-box:fill-box;transform-origin:center;animation:cl-scene-star .8s ease-in-out 2 alternate}
.cl-scene-elevator{animation:cl-scene-elevator 1.35s cubic-bezier(.16,1,.3,1) both}
.cl-scene-rise{animation:cl-scene-rise .7s .3s ease-in-out 2;transform-box:fill-box;transform-origin:center}
.cl-scene-disco{transform-box:fill-box;transform-origin:center;animation:cl-scene-disco 1.5s ease-in-out both}
.cl-scene-notes{animation:cl-scene-notes 1.4s ease-out both}
.cl-scene-speed{animation:cl-scene-speed .5s ease-out 3}
.cl-scene-heart{transform-box:fill-box;transform-origin:center;animation:cl-scene-heart .7s ease-in-out 2}
.cl-scene-box-lid{transform-box:fill-box;transform-origin:80% 80%;animation:cl-scene-box-lid 1.2s cubic-bezier(.16,1,.3,1) both}
.cl-scene-product{animation:cl-scene-product 1.2s .2s cubic-bezier(.16,1,.3,1) both}
.cl-scene-coin-flow{--cl-coin-size:.8;animation:cl-scene-coin-flow 1.1s cubic-bezier(.3,.1,.7,1) both;transform-box:fill-box;transform-origin:center;transform:translate(var(--cl-bank-to-x),var(--cl-bank-to-y)) scale(var(--cl-coin-size))}
.cl-scene-coin-flow--b{--cl-coin-size:.65;animation-delay:.15s}.cl-scene-coin-flow--c{--cl-coin-size:.72;animation-delay:.3s}
.cl-scene-shield{transform-box:fill-box;transform-origin:center;animation:cl-scene-shield 1.3s cubic-bezier(.16,1,.3,1) both}
.cl-scene-blocked-card{animation:cl-scene-blocked-card 1.2s ease-out both}
.cl-scene-die{transform-box:fill-box;transform-origin:center;animation:cl-scene-die 1.45s cubic-bezier(.12,.8,.25,1) both}
.cl-scene-lucky-card{animation:cl-scene-lucky-card 1.3s cubic-bezier(.16,1,.3,1) both}
.cl-scene-home-card{animation:cl-scene-home-card 1.25s cubic-bezier(.16,1,.3,1) both}
.cl-scene-exchange{animation:cl-scene-exchange .8s ease-in-out 2}
.cl-scene-parcel{animation:cl-scene-parcel 1.3s cubic-bezier(.16,1,.3,1) both}
.cl-scene-medal{transform-box:fill-box;transform-origin:50% 65%;animation:cl-scene-medal 1.35s cubic-bezier(.16,1,.3,1) both}
.cl-scene-confetti{animation:cl-scene-confetti 1.5s var(--cl-scene-delay,0ms) ease-out both}
@keyframes cl-scene-card-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes cl-scene-chip-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes cl-scene-timer{to{transform:scaleX(0)}}
@keyframes cl-scene-person{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-6px) rotate(-2deg)}}
@keyframes cl-scene-run{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-10px) rotate(2deg)}}
@keyframes cl-scene-cap{0%{transform:translateY(45px) rotate(-12deg);opacity:0}40%{transform:translateY(-22px) rotate(8deg);opacity:1}100%{transform:translateY(0) rotate(0);opacity:1}}
@keyframes cl-scene-book{from{transform:scaleX(.45);opacity:.4}to{transform:scaleX(1);opacity:1}}
@keyframes cl-scene-star{from{transform:scale(.4) rotate(-12deg);opacity:.35}to{transform:scale(1.05) rotate(10deg);opacity:1}}
@keyframes cl-scene-elevator{from{transform:translateY(65px);opacity:.15}to{transform:translateY(0);opacity:1}}
@keyframes cl-scene-rise{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@keyframes cl-scene-disco{from{transform:rotate(-20deg);filter:brightness(.75)}to{transform:rotate(20deg);filter:brightness(1.12)}}
@keyframes cl-scene-notes{from{transform:translateY(25px);opacity:0}to{transform:translateY(-10px);opacity:1}}
@keyframes cl-scene-speed{from{opacity:.2;transform:translateX(14px)}to{opacity:1;transform:translateX(-8px)}}
@keyframes cl-scene-heart{0%,100%{transform:scale(1)}40%{transform:scale(1.13)}65%{transform:scale(1.04)}}
@keyframes cl-scene-box-lid{0%{transform:translateY(0) rotate(0)}45%,100%{transform:translate(-25px,-48px) rotate(-20deg)}}
@keyframes cl-scene-product{0%{opacity:0;transform:translateY(75px) scale(.4)}70%,100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes cl-scene-coin-flow{0%{opacity:0;transform:translate(var(--cl-bank-from-x),var(--cl-bank-from-y)) scale(var(--cl-coin-size)) rotateY(0)}18%{opacity:1}85%{opacity:1}100%{opacity:.5;transform:translate(var(--cl-bank-to-x),var(--cl-bank-to-y)) scale(var(--cl-coin-size)) rotateY(360deg)}}
@keyframes cl-scene-shield{0%{opacity:0;transform:scale(.35)}65%{opacity:1;transform:scale(1.09)}100%{transform:scale(1)}}
@keyframes cl-scene-blocked-card{0%{transform:translateX(-50px) rotate(-12deg);opacity:0}45%{transform:translateX(95px) rotate(8deg);opacity:1}65%{transform:translateX(95px) rotate(8deg);opacity:1}100%{transform:translate(-15px,35px) rotate(-28deg);opacity:.45}}
@keyframes cl-scene-die{0%{transform:translateY(-35px) rotate(-140deg) scale(.65);opacity:.3}70%{transform:translateY(7px) rotate(8deg) scale(1.04);opacity:1}100%{transform:translateY(0) rotate(0) scale(1);opacity:1}}
@keyframes cl-scene-lucky-card{0%{transform:translateY(100px);opacity:0}65%,100%{transform:translateY(0);opacity:1}}
@keyframes cl-scene-home-card{0%{transform:translateY(80px) rotate(-15deg);opacity:0}100%{transform:translateY(0) rotate(4deg);opacity:1}}
@keyframes cl-scene-exchange{0%,100%{transform:translateX(-7px)}50%{transform:translateX(7px)}}
@keyframes cl-scene-parcel{0%{transform:translateX(-65px) scale(.8);opacity:.4}100%{transform:translateX(0) scale(1);opacity:1}}
@keyframes cl-scene-medal{0%{transform:translateY(35px) scale(.5);opacity:0}60%{transform:translateY(-5px) scale(1.05);opacity:1}100%{transform:none;opacity:1}}
@keyframes cl-scene-confetti{from{opacity:0;transform:translateY(-90px) rotate(-25deg)}25%{opacity:1}to{opacity:.85;transform:translateY(18px) rotate(20deg)}}
@media(max-width:600px){.career-app .cl-scene{padding:14px}.career-app .cl-scene-card{border-radius:24px;max-height:calc(100vh - 28px);max-height:calc(100dvh - 28px)}.career-app .cl-scene-stage{aspect-ratio:720/390;min-height:160px}.career-app .cl-scene-copy{padding:0 18px 19px;margin-top:-4px}.career-app .cl-scene-copy h2{font-size:max(14px,30px)}.career-app p.cl-scene-subtitle{font-size:max(14px,16px);margin-bottom:12px}.career-app .cl-scene-close{top:11px;right:11px;width:44px;height:44px;min-height:44px}.career-app .cl-scene-kicker{font-size:max(14px,16px)}.career-app .cl-scene-results{gap:7px;margin-top:15px}.career-app .cl-scene-chip{flex-basis:120px;padding:10px 8px;border-radius:12px}.career-app .cl-scene-chip strong{font-size:max(14px,18px)}.career-app .cl-scene-chip span{font-size:max(14px,16px)}.career-app .cl-scene-footer{flex-direction:column-reverse;align-items:stretch;gap:11px;margin-top:14px}.career-app .cl-scene-continue{width:100%;min-height:48px}.career-app .cl-scene-saved{justify-content:center;font-size:max(14px,16px)}.career-app .cl-scene-details{margin-top:10px}}
@media(max-height:600px) and (min-width:601px){.career-app .cl-scene-card{width:min(100%,850px);display:grid;grid-template-columns:minmax(220px,.85fr) minmax(0,1.15fr)}.career-app .cl-scene-stage{height:100%;min-height:290px;aspect-ratio:auto;border-bottom:0}.career-app .cl-scene-illustration{object-fit:contain}.career-app .cl-scene-copy{padding:23px 22px;margin-top:0}.career-app .cl-scene-copy h2{font-size:max(14px,27px)}.career-app .cl-scene-results{margin-top:12px}.career-app .cl-scene-chip{flex-basis:100px;padding:8px}.career-app .cl-scene-chip strong{font-size:max(14px,18px)}.career-app .cl-scene-footer{margin-top:12px;flex-direction:column-reverse;align-items:stretch;gap:9px}.career-app .cl-scene-saved{justify-content:center}.career-app .cl-scene-timer{grid-column:1/-1}}
@media(prefers-reduced-motion:reduce){.career-app .cl-scene *,.career-app .cl-scene *::before,.career-app .cl-scene *::after{animation:none!important;transition:none!important}.career-app .cl-scene-timer{display:none}}
.career-app .cl-scene--reduced *{animation:none!important;transition:none!important}
.cl-scene-career-prop,.cl-scene-study-prop{animation:cl-scene-prop-in 1.2s .12s cubic-bezier(.16,1,.3,1) both}
@keyframes cl-scene-prop-in{from{transform:translateY(35px) scale(.7);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}
.career-app .cl-scene--reduced .cl-scene-timer{display:none}
.cl-scene-conversation{animation:cl-scene-prop-in .75s .12s cubic-bezier(.16,1,.3,1) both}
.cl-scene-game-piece{animation:cl-scene-game-piece 1.3s cubic-bezier(.16,1,.3,1) both}
.cl-scene-swimmer{animation:cl-scene-swimmer 1.4s ease-in-out both}
.cl-scene-water,.cl-scene-call{animation:cl-scene-water .6s ease-in-out 2 alternate}
@keyframes cl-scene-game-piece{from{transform:translate(-45px,12px)}to{transform:translate(0,0)}}
@keyframes cl-scene-swimmer{from{transform:translateX(-40px)}to{transform:translateX(28px)}}
@keyframes cl-scene-water{from{opacity:.35}to{opacity:1}}

/* Fixed-width artwork and a sticky exit row keep narrow/short viewports operable. */
.career-app .cl-scene-stage{width:100%;min-width:0;max-width:100%}
.career-app .cl-scene-copy{min-width:0;padding-bottom:18px}
.career-app .cl-scene-footer{position:sticky;bottom:0;z-index:4;margin:0;padding:16px 30px 22px;border-top:1px solid #ffffff10;background:#0e1931;box-shadow:0 -10px 22px #0e19313d}
.career-app .cl-scene-timer{z-index:5}
@media(max-width:600px){.career-app .cl-scene-stage{min-height:0}.career-app .cl-scene-copy{padding-bottom:14px}.career-app .cl-scene-footer{padding:13px 18px 17px}}
@media(max-height:600px) and (min-width:601px){.career-app .cl-scene-stage{grid-column:1;grid-row:1/span 2}.career-app .cl-scene-copy{grid-column:2;grid-row:1;padding-bottom:12px}.career-app .cl-scene-footer{grid-column:2;grid-row:2;padding:12px 22px 16px}.career-app .cl-scene-timer{grid-row:3}}

/* The receipt scrolls inside the card; close and Continue stay outside it. */
.career-app .cl-scene-card{display:flex;flex-direction:column;overflow:hidden}
.career-app .cl-scene-scroll{flex:1 1 auto;min-height:0;min-width:0;max-width:100%;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--cl-scene-accent) #111c34}
.career-app .cl-scene-scroll::-webkit-scrollbar{width:8px}
.career-app .cl-scene-scroll::-webkit-scrollbar-track{background:#111c34}
.career-app .cl-scene-scroll::-webkit-scrollbar-thumb{border:2px solid #111c34;border-radius:8px;background:var(--cl-scene-accent)}
.career-app .cl-scene-close{background:#bc293c;border-color:#ff8f9c;color:#fff;box-shadow:0 4px 16px #650e2a66}
.career-app .cl-scene-close:hover{background:#db3549}
.career-app .cl-scene-close:active{background:#9d1f31}
.career-app .cl-scene-footer{position:relative;flex:0 0 auto;min-width:0}
.career-app .cl-scene-timer{position:relative;flex:0 0 3px}
@media(max-height:600px) and (min-width:601px){
 .career-app .cl-scene-scroll{display:grid;grid-template-columns:minmax(180px,.85fr) minmax(0,1.15fr);align-items:start}
 .career-app .cl-scene-scroll>.cl-scene-stage{grid-column:1;grid-row:1;align-self:stretch;height:100%;min-height:230px;aspect-ratio:auto}
 .career-app .cl-scene-scroll>.cl-scene-copy{grid-column:2;grid-row:1;padding-top:23px}
 .career-app .cl-scene-footer{padding:10px 22px 12px;flex-direction:row;align-items:center}
}

/* A compact, non-scrolling head reserves room for the red close control. */
.career-app .cl-scene-chrome{display:flex;align-items:center;gap:12px;flex:0 0 auto;min-width:0;padding:11px 16px;border-bottom:1px solid #ffffff12;background:#0d1931;z-index:5}
.career-app .cl-scene-chrome>.cl-scene-kicker{flex:1;min-width:0;max-width:100%;margin:0;padding:0;border:0;border-radius:0;background:transparent;text-align:left;font-size:max(14px,14px);line-height:1.3}
.career-app .cl-scene-chrome>.cl-scene-close{position:static;flex:0 0 auto;margin:0 0 0 auto}
@media(max-width:600px){.career-app .cl-scene-chrome{padding:8px 11px}}
