:root{--ink:#351033;--muted:#826c88;--raspberry:#cd2163;--berry:#e4387d;--pink:#fce5f3;--lilac:#efd5fa;--mint:#dff8e7;--gold:#f3b61b;--cream:#fff9f7;--border:#f1e3ed;--shadow:0 13px 38px rgba(73,21,69,.07)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(circle at 40% 0,#e8dafa,#d9c4ef 50%,#e3d0ed);font-family:ui-rounded,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:var(--ink);-webkit-font-smoothing:antialiased}
button,input{font:inherit}
button{cursor:pointer}
button:focus-visible,a:focus-visible,label:focus-within{outline:3px solid #9954be;outline-offset:3px}
button:disabled{cursor:default}
[hidden]{display:none!important}
.app-shell{position:relative;width:min(100%,475px);min-height:100vh;margin:0 auto;background:linear-gradient(175deg,#fffaf8 0%,#fff8fb 70%,#fff7fc 100%);box-shadow:0 25px 80px rgba(54,22,68,.17);display:flex;flex-direction:column;overflow:hidden}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:31px 24px 20px;position:relative;z-index:1}
.brand{color:var(--ink);font-size:clamp(20px,5.7vw,29px);font-weight:900;letter-spacing:-1.3px;white-space:nowrap;text-decoration:none;display:inline-flex;align-items:center;line-height:1}
.brand-re{padding-right:1px}
.brand-faq{position:relative;display:inline-block;color:#fffbe5;background:linear-gradient(150deg,#ee578a,#c50a56);padding:8px 5px 9px;border-radius:11px;font-size:.83em;letter-spacing:-.9px;text-shadow:0 1px 0 #7f144d;box-shadow:0 3px 0 #b5245a55}
.brand-faq:after{content:"";position:absolute;bottom:-7px;left:17px;border-width:8px 8px 0 0;border-style:solid;border-color:#bd185b transparent transparent transparent}
.brand-end{color:#c90b53;margin-left:1px}
.brand-sparkle{color:#e9a825;font-size:12px;align-self:flex-start;margin:-10px 0 0 3px}
.wallet{display:inline-flex;align-items:center;justify-content:center;gap:5px;white-space:nowrap;border:1px solid #f2d88a;border-radius:100px;background:#fff9e8;padding:5px 9px 5px 5px;font-size:12px;font-weight:800;box-shadow:0 2px 6px #a97f1a10}
.coin-icon{width:26px;height:26px;display:grid;place-items:center;font-size:14px;color:#fff5bb;border-radius:50%;border:2px solid #dc9417;background:linear-gradient(145deg,#ffde54,#e5a013);text-shadow:0 1px 1px #9a6310;box-shadow:inset 0 0 0 2px #ffd976}
#main-content{flex:1;padding:0 21px 22px}
.view[hidden]{display:none!important}
.view{animation:show .23s ease-out}
@keyframes show{from{opacity:.35;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.welcome{text-align:center;margin:10px 0 27px}
.eyebrow{font-size:10px;font-weight:900;letter-spacing:1.8px;color:#a95387}
.eyebrow span{color:#e5b033;font-size:18px;vertical-align:middle}
h1,h2,p{margin-top:0}
.welcome h1{font-size:clamp(28px,7vw,38px);line-height:1.15;letter-spacing:-1.35px;margin:9px 0 6px;font-weight:900}
.welcome h1 span,.rewards-heading h1 span{color:#e5b033;font-size:.6em;vertical-align:top}
.welcome p,.rewards-heading p,.profile-head p{font-size:17px;color:#806a89;font-weight:600;margin:0}
.card-pink{background:linear-gradient(130deg,#ffeafa,#ffebf4 50%,#fce2f3);border:1px solid #fff;box-shadow:var(--shadow)}
.white-card{background:#fffefc;border:1px solid #f5edf1;border-radius:24px;box-shadow:var(--shadow)}
.card-lilac{background:linear-gradient(115deg,#f4ddfa,#f0d5f3 55%,#f7e3f3);border:1px solid #f9eafa}
.hero-training{border-radius:24px;min-height:176px;padding:23px 18px;display:flex;align-items:center;gap:12px}
.book-illustration{width:118px;height:118px;flex:0 0 118px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle,#ffd1e5 50%,#ffdef0 67%,transparent 68%);transform:rotate(-10deg)}
.book-illustration span{display:grid;place-items:center;color:#f8d263;font-size:55px;font-weight:400;background:linear-gradient(145deg,#f84889,#a71560);width:75px;height:94px;border-radius:9px 14px 14px 9px;box-shadow:5px 6px 0 #ffccd8,0 14px 20px #b01b6b38;text-shadow:0 2px 1px #9a1557}
.training-info{flex:1;min-width:0}
.training-info p{font-size:13px;margin:0 0 3px;font-weight:650}
.training-info h2{font-size:clamp(21px,6vw,29px);line-height:1.15;letter-spacing:-.8px;font-weight:900;margin:0 0 17px;white-space:normal}
.training-info .primary-button{width:100%;max-width:100%;padding-inline:9px;gap:4px}
.primary-button{background:linear-gradient(140deg,#ef4480,#cb135d);border:0;border-radius:100px;color:white;box-shadow:0 7px 16px #b9136536;font-weight:800;padding:14px 19px;font-size:14px;min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:10px;text-align:center;transition:transform .18s,filter .18s}
.primary-button:hover{filter:brightness(1.04)}
.primary-button:active{transform:scale(.98)}
.primary-button span{font-size:27px;font-weight:400;line-height:14px}
.primary-button:disabled{opacity:.5;box-shadow:none}
.trainer-card{margin-top:17px;padding:17px 17px 16px;border-radius:24px;background:linear-gradient(135deg,#f7e5fa,#f7dbed 58%,#ffedf4);box-shadow:var(--shadow)}
.trainer-heading{display:flex;gap:10px;align-items:center}
.trainer-icon{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;border-radius:15px;background:#fff8fe;font-size:24px;box-shadow:0 4px 12px #b453981a}
.trainer-heading-copy{flex:1;min-width:0}
.trainer-kicker{display:block;color:#a25d90;font-size:9px;line-height:1.3;font-weight:900;letter-spacing:.7px;margin-bottom:3px}
.trainer-heading h2{font-size:19px;letter-spacing:-.5px;line-height:1.15;margin:0}
.trainer-badge{flex:0 0 auto;border-radius:20px;background:#fff9e2;color:#9d711b;font-size:11px;font-weight:850;padding:8px 10px;white-space:nowrap}
.trainer-status{font-size:14px;font-weight:850;line-height:1.4;margin:14px 0 5px;color:#4b2548}
.trainer-explain{font-size:12px;color:#816d86;line-height:1.45;margin:0 0 12px}
.trainer-start{width:100%;min-height:47px}
.trainer-feedback{display:block;margin-top:10px;border-top:1px solid #ffffffaa;padding-top:8px;font-size:12px;line-height:1.45;font-weight:750}
.progress-card{margin-top:17px;padding:21px 17px 15px}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:9px}
.section-head h2{font-size:20px;line-height:1.15;margin:0;letter-spacing:-.65px}
.percentage-pill{background:linear-gradient(130deg,#cda1f2,#b86de2);color:white;font-weight:850;padding:9px 16px;border-radius:100px;font-size:16px}
.overall-detail{color:#754c85;font-size:12px;font-weight:800;margin:0 0 7px;line-height:1.4}
.world-intro{color:#8b7590;font-size:12px;line-height:1.45;margin:0 0 14px}
.world-progress{display:grid;gap:10px}
.world-row{display:flex;width:100%;gap:11px;align-items:center;text-align:left;color:var(--ink);border:1px solid #f0e7ed;border-radius:17px;padding:13px 12px;background:#fffefe;box-shadow:0 2px 5px #52224a08;transition:background .2s,border-color .2s,transform .2s}
.world-row:hover:not(:disabled){background:#fff9fc;border-color:#eba8c7}
.world-row:active:not(:disabled){transform:scale(.993)}
.world-row:disabled{opacity:.55}
.world-icon{display:grid;place-items:center;flex:0 0 39px;width:39px;height:39px;border-radius:50%;font-size:19px}
.world-icon.rvg{background:#ffe2ed;color:#c42c71}
.world-icon.recht{background:#ead8ff;color:#854cbd}
.world-icon.buero{background:#def6e9;color:#239368}
.world-icon.mand{background:#e1efff;color:#4385be}
.world-icon.wiso{background:#fff1d9;color:#b77f22}
.world-info{display:block;flex:1;min-width:0}
.world-row-top{display:flex;justify-content:space-between;gap:5px;align-items:center;margin-bottom:7px}
.world-row-top strong{font-size:13px;line-height:1.25;overflow-wrap:break-word}
.world-row-top>span{font-size:12px;font-weight:750;color:#70577b;white-space:nowrap}
.world-row .bar-track,.world-row .bar-fill{display:block}
.world-meta{display:flex;flex-wrap:wrap;gap:3px 9px;align-items:center;justify-content:space-between;color:#947d99;font-size:10px;font-weight:650;margin-top:7px}
.world-meta .world-cta{color:#c12469;font-weight:850;white-space:nowrap}
.world-weight{display:block;margin-top:5px;font-size:10px;font-weight:700;color:#987a9c}
.bar-track{width:100%;height:11px;border-radius:30px;background:#ebe4ef;overflow:hidden}
.bar-fill{height:100%;border-radius:inherit;transition:width .38s ease;width:0}
.world-bar{height:6px}
.pink-fill{background:linear-gradient(90deg,#ed4b8b,#d51a67)}
.purple-fill{background:linear-gradient(90deg,#c99aeb,#9e65d5)}
.green-fill{background:linear-gradient(90deg,#7ac8a4,#46b68d)}
.blue-fill{background:linear-gradient(90deg,#87bcf7,#518fdb)}
.gold-fill{background:linear-gradient(90deg,#ffe16e,#f0ae13)}
.text-button{display:block;background:transparent;border:0;color:#bd256c;font-size:12px;font-weight:850;margin:15px auto 0;padding:4px;text-align:center}
.teaser-card{display:flex;align-items:center;gap:7px;border-radius:23px;padding:14px 15px;margin-top:17px;min-height:135px}
.car-art{display:block;width:54%;height:auto;max-height:155px;min-width:0;object-fit:contain;flex-shrink:0;filter:drop-shadow(0 7px 7px #a43d6a2f)}
.teaser-copy{flex:1;min-width:0}
.teaser-copy h2{font-size:clamp(14px,4.4vw,20px);font-weight:900;line-height:1.22;letter-spacing:-.4px;margin:0 0 11px}
.gold-track{background:#ffffffa3;border:2px solid #ffffff9a;height:15px}
.bar-note{font-size:13px;margin-top:7px}
.mini-note{font-size:10px;color:#a08ca6;text-align:center;margin:21px 7px 4px;line-height:1.45}
.tabbar{position:sticky;bottom:0;z-index:5;margin-top:auto;display:flex;justify-content:space-around;gap:4px;padding:11px 14px calc(12px + env(safe-area-inset-bottom));border-top:1px solid #f6eaf1;background:rgba(255,250,251,.97);box-shadow:0 -8px 20px #aa74a80b}
.tab{position:relative;border:0;background:transparent;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2px;color:#84618a;font-size:12px;font-weight:650;padding:6px 16px;min-height:57px;border-radius:15px;flex:1}
.tab-icon{font-size:22px;line-height:22px}
.tab.active{color:#d61767;font-weight:850}
.tab.active:after{content:"";position:absolute;width:44px;height:4px;border-radius:100px;bottom:0;background:var(--raspberry)}
.quiz-top{display:flex;align-items:center;gap:10px;margin-top:13px}
.back-button{width:32px;height:32px;border:1px solid #efd9e8;background:#fff;border-radius:50%;color:#a23e83;font-size:26px;line-height:20px}
.quiz-heading{display:flex;flex:1;align-items:center;justify-content:space-between;gap:8px}
.quiz-heading strong,.quiz-heading span{font-size:13px}
.question-track{height:7px;margin:14px 0 23px}
.quiz-card{padding:23px 18px 20px}
.quiz-pill{display:inline-flex;background:#ffebf4;color:#ae3878;padding:7px 10px;border-radius:30px;font-size:10px;font-weight:850;letter-spacing:.6px;margin-bottom:18px}
.quiz-card h1{font-size:clamp(20px,5.5vw,26px);line-height:1.28;letter-spacing:-.75px;margin:0 0 24px;font-weight:900}
.quiz-options{display:grid;gap:11px}
.answer{display:flex;align-items:center;gap:11px;width:100%;text-align:left;border-radius:16px;border:1.5px solid #eee1e9;background:#fff;padding:13px 12px;min-height:59px;color:#391738;font-size:14px;line-height:1.4;font-weight:550}
.answer:hover:not(:disabled){border-color:#ed8cb9;background:#fffbfd}
.answer .letter{display:grid;place-items:center;flex:0 0 31px;height:31px;border-radius:100px;background:#f7e8f1;color:#6e3968;font-size:15px;font-weight:800}
.answer .answer-text{flex:1}
.answer.correct{border-color:#69c991;background:#e6f9ee;color:#216841}
.answer.correct .letter{background:#ade8c7;color:#175f3a}
.answer.wrong{border-color:#eaa1a8;background:#fff1f3;color:#9a283f}
.answer.wrong .letter{background:#f4cdd3;color:#9a283f}
.answer .checkmark{font-size:25px;color:#27a66b;font-weight:900}
.quiz-feedback{margin-top:17px;padding:13px 14px;border-radius:14px;font-size:13px;line-height:1.5;background:#f7eff9}
.quiz-feedback strong{display:block;font-size:16px;margin-bottom:3px}
.quiz-feedback.success{background:#edfaef;color:#246b41}
.quiz-feedback.miss{background:#fff0f2;color:#9b3850}
.quiz-goal{display:flex;align-items:center;gap:6px;padding:8px 13px 8px 6px;border-radius:22px;margin-top:15px;min-height:117px}
.quiz-goal .car-art{width:49%;max-height:115px}
.quiz-goal .teaser-copy strong{display:block;font-size:15px;line-height:1.15;letter-spacing:-.4px;margin-bottom:10px}
.quiz-goal .teaser-copy span{font-size:13px;display:block;margin-top:7px}
.bottom-action{width:100%;font-size:18px;margin-top:18px;min-height:54px}
.rewards-heading{text-align:center;margin:21px 0 22px}
.rewards-heading h1{font-size:clamp(27px,7vw,36px);line-height:1.12;letter-spacing:-1px;margin-bottom:5px}
.rewards-heading p{font-size:17px}
.featured-reward{display:flex;align-items:center;border-radius:24px;min-height:177px;padding:11px 14px;gap:7px}
.featured-car{width:59%;max-height:165px}
.featured-copy{min-width:0;flex:1}
.featured-copy h2{font-size:21px;letter-spacing:-.5px;margin:0 0 8px}
.featured-copy p{font-size:12px;line-height:1.4;margin:0 0 9px;color:#805e8d}
.featured-copy .unlocked{color:#21965a;font-weight:800}
.small-reward-button{border:0;background:linear-gradient(130deg,#c62d6c,#e74885);color:white;padding:9px 10px;border-radius:20px;font-size:12px;font-weight:850}
.small-reward-button:disabled{background:#70c99a;color:#155e3b}
.small-reward-button.owned{background:#e0f8e8;color:#248955}
.next-reward-title{text-align:center;font-size:22px;line-height:1.2;letter-spacing:-.6px;margin:26px 0 16px}
.reward-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
.reward-item{border:1px solid #f1ddea;border-radius:21px;overflow:hidden;background:#fff;box-shadow:0 5px 18px #5f155510;min-width:0}
.reward-image{height:120px;background:radial-gradient(circle at 50% 30%,#fff2f9,#f3d9f7);display:grid;place-items:center;font-size:70px;position:relative}
.reward-image img{display:block;max-width:96%;max-height:112px;width:auto;height:auto;object-fit:contain;filter:drop-shadow(0 6px 6px #a7548433)}
.reward-image:after{content:"✦";color:#efb51e;font-size:26px;position:absolute;top:8px;right:14px}
.reward-copy{padding:10px 11px 13px}
.reward-copy h3{margin:0 0 7px;font-size:14px}
.reward-price{display:flex;align-items:center;gap:4px;font-size:12px;font-weight:700;margin-bottom:10px}
.reward-price .coin-icon{width:20px;height:20px;font-size:10px;border-width:1px}
.reward-buy{width:100%;border:0;border-radius:12px;background:#fbe1ed;color:#ac2668;font-weight:800;font-size:12px;padding:9px}
.reward-buy.owned{background:#e4f8e8;color:#248955}
.reward-filters{display:flex;gap:7px;overflow-x:auto;padding:3px 1px 13px;margin-bottom:3px;scrollbar-width:thin}
.reward-filter{flex:0 0 auto;border:1px solid #ead7e4;color:#956688;background:#fff8fb;border-radius:999px;padding:8px 13px;font-size:12px;font-weight:800}
.reward-filter.active{background:linear-gradient(140deg,#e83c83,#be2e7c);color:#fff;border-color:transparent;box-shadow:0 4px 11px #ae1d6733}
.reward-category{display:block;font-size:9px;font-weight:950;letter-spacing:1.2px;color:#c56891;margin-bottom:5px}
.celebration-emoji{font-size:clamp(90px,26vw,135px);filter:drop-shadow(0 13px 13px #b27a9540);line-height:1.3}
.city-entry{margin-top:15px;width:100%;display:flex;gap:11px;align-items:center;text-align:left;border:1px solid #eec8df;background:linear-gradient(125deg,#ffe1ee,#f7d9ff);color:var(--ink);padding:16px 15px;border-radius:20px;box-shadow:0 7px 16px #a9509a13}
.city-entry-symbol{font-size:31px;color:#daaa32;flex:0 0 35px;text-align:center}
.city-entry strong{font-size:16px;display:block;line-height:1.2}
.city-entry small{display:block;font-size:11px;color:#8d628a;line-height:1.4;margin-top:4px}
.city-entry-arrow{font-size:29px;margin-left:auto;color:#b94283}
.city-heading{text-align:center;margin:21px auto 18px}
.city-eyebrow{font-size:10px;font-weight:900;letter-spacing:1.3px;color:#c46496}
.city-heading h1{font-size:clamp(26px,7vw,34px);letter-spacing:-1px;margin:7px 0 6px}
.city-heading p{font-size:13px;line-height:1.45;color:#8b7692;margin:0 auto;max-width:365px}
.city-penthouse{display:flex;align-items:center;gap:10px;background:linear-gradient(120deg,#fff1c9,#f5d3f4);border:1px solid #f0d5a8;border-radius:17px;margin:0 0 15px;padding:12px;font-size:33px}
.city-penthouse strong{display:block;font-size:14px;color:#915c7f}
.city-penthouse small{display:block;margin-top:3px;font-size:11px;line-height:1.35;color:#90748a}
.city-zone-switch{display:grid;grid-template-columns:1fr 1fr;padding:5px;gap:5px;border:1px solid #f0ddea;border-radius:19px;background:#fff;margin-bottom:17px}
.city-zone-button{border:0;border-radius:14px;padding:12px 6px;background:transparent;color:#866f8c;font-size:12px;font-weight:800;min-height:45px}
.city-zone-button.active{color:#fff;background:linear-gradient(130deg,#ec4d8c,#b74bc1);box-shadow:0 4px 11px #ba43873b}
.city-zone-heading{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:17px 2px 12px}
.city-zone-heading h2{margin:3px 0 0;font-size:23px;letter-spacing:-.7px}
.city-section-kicker{font-size:10px;font-weight:900;letter-spacing:1.3px;color:#bd4b90}
.city-bubble{background:#fff0c3;color:#d39b29;border-radius:50%;font-size:23px;width:37px;height:37px;display:grid;place-items:center}
.garage-stage{height:clamp(248px,67vw,305px);position:relative;isolation:isolate;overflow:hidden;border-radius:25px;border:2px solid #fff;background:linear-gradient(180deg,#ffe1ee 0%,#e9c7ee 43%,#b76a9b 60%,#75466e 100%);box-shadow:0 11px 25px #804a8533;transition:background .3s}
.garage-stage:before{content:"";position:absolute;inset:0 0 41%;background:linear-gradient(95deg,#ffffff5a,#ffffff06 22%,#ffffff30 55%,#ffffff14 84%,#fff8fe69);z-index:0}
.garage-stage:after{content:"";position:absolute;left:-30%;right:-30%;height:46%;bottom:-25%;border-radius:50%;background:radial-gradient(ellipse,#fdf1fd88,#a45892a0 50%,transparent 75%);z-index:0}
.garage-stage.theme-neon{background:linear-gradient(180deg,#192043,#553674 46%,#4d3171 61%,#211b50 100%)}
.garage-stage.theme-champagne{background:linear-gradient(180deg,#fff8e6,#e3b9c3 48%,#b68a70 65%,#8f6556 100%)}
.showroom-lamp{position:absolute;top:0;height:70%;width:20px;z-index:1;filter:blur(12px);background:#fff9d7b0}
.lamp-left{left:13%}.lamp-right{right:13%}
.garage-stage.theme-neon .showroom-lamp{background:#f38dfbdf}
.garage-backwall{position:absolute;left:5%;right:5%;top:11%;height:48%;display:flex;gap:5px;z-index:1;opacity:.62}
.garage-backwall span{display:block;flex:1;border:2px solid #ffffff63;border-bottom-width:6px;border-radius:10px 10px 0 0;background:linear-gradient(180deg,#fff7e685,#e6a8f856 45%,#7563a15e)}
.garage-stage.theme-neon .garage-backwall span{background:linear-gradient(180deg,#6c55b8b3,#f56cee47)}
.garage-platform{position:absolute;left:4%;right:4%;bottom:8%;height:28%;border-radius:50%;z-index:1;background:radial-gradient(ellipse,#fff9f19e,#cf7caa7d 52%,#57334c39 73%,transparent 76%);transform:scaleY(.55)}
.garage-car{position:absolute;z-index:3;left:5%;width:90%;height:66%;bottom:9%;object-fit:contain;filter:drop-shadow(0 10px 9px #4f20305e);transition:opacity .3s,filter .3s}
.locked-car .garage-car{opacity:.22;filter:grayscale(1) drop-shadow(0 5px 6px #492c3960)}
.garage-placeholder{position:absolute;z-index:4;bottom:18px;left:12%;right:12%;border-radius:15px;padding:11px;text-align:center;background:#fffaf0eb;color:#934a70;font-size:13px;font-weight:900}
.garage-status{font-size:13px;color:#866b8a;text-align:center;font-weight:800;margin:13px 0 7px}
.city-subtitle{font-size:20px;letter-spacing:-.4px;margin:25px 1px 7px}
.city-help{font-size:12px;line-height:1.55;color:#8c7892;margin:0 1px 12px}
.garage-themes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.garage-theme-button{display:flex;flex-direction:column;align-items:center;text-align:center;gap:5px;min-width:0;padding:10px 5px 11px;border:1.5px solid #ead7e6;border-radius:15px;background:#fff;color:#684466;min-height:108px}
.garage-theme-button.selected{border-color:#e04387;background:#fff1f8;box-shadow:inset 0 0 0 1px #e04387}
.garage-theme-button.locked{opacity:.72}
.garage-theme-swatch{width:45px;height:35px;border-radius:11px;border:2px solid #fff;box-shadow:0 1px 6px #4b213533}
.garage-theme-swatch.theme-classic{background:linear-gradient(145deg,#fff0f2,#c671ad,#824e80)}
.garage-theme-swatch.theme-neon{background:linear-gradient(145deg,#151839,#7c29b7,#ec5cdd)}
.garage-theme-swatch.theme-champagne{background:linear-gradient(145deg,#fff9e7,#e7b66e,#c58b98)}
.garage-theme-button strong{font-size:11px;line-height:1.25}
.garage-theme-button small{font-size:10px;line-height:1.2;color:#987d98}
.city-collection-counter{flex:0 0 auto;border-radius:15px;background:linear-gradient(125deg,#ffe8f3,#ffeccc);color:#ac4588;padding:9px 12px;font-size:12px;font-weight:900;white-space:nowrap}
.collection-scene{position:relative;overflow:hidden;isolation:isolate;min-height:365px;border-radius:27px;border:2px solid #fff;box-shadow:0 11px 25px #8e4e8830;background:radial-gradient(ellipse at 50% 5%,#fffef7 0%,#ffe4f0 43%,#e7bbdb 75%,#b96b9f 100%)}
.collection-scene:before,.collection-scene:after{content:"✦";position:absolute;top:27px;left:10%;color:#dba646;font-size:23px;text-shadow:0 2px 6px #fff9d3}
.collection-scene:after{content:"✧";left:auto;right:9%;top:48px}
.collection-scene.penthouse{background:radial-gradient(ellipse at 50% 0%,#fff9db 0%,#f4d4f3 48%,#cdb3ed 73%,#8c79bf 100%)}
.scene-mirror{position:absolute;top:19px;left:17%;right:17%;height:183px;border:11px solid #ffe6c5;border-radius:46% 46% 16px 16px;box-shadow:inset 0 0 17px #fff7f1,0 0 0 3px #dca567,0 4px 17px #9c6f7e7a,0 0 25px #fff8e9;background:linear-gradient(145deg,#fffaf9ba,#f9d3f2a3);display:grid;place-items:start center;padding-top:25px}
.scene-mirror:before{content:"";position:absolute;inset:-11px;border-radius:inherit;border:3px dotted #fffefa;pointer-events:none}
.scene-mirror span{font-family:Georgia,serif;font-size:11px;letter-spacing:1.7px;color:#ae6088;font-weight:700;text-shadow:0 1px #fff}
.scene-shelf{position:absolute;left:2%;right:2%;height:24px;bottom:54px;border-radius:50%;background:linear-gradient(180deg,#fff8ef,#e5a9c3 45%,#a85f93);box-shadow:0 11px 12px #74396b4c,0 3px 0 #ffe7c6;z-index:1}
.scene-items{position:relative;z-index:3;display:grid;gap:7px;padding:0 11px;align-items:stretch}
.scene-items-three{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:136px}
.scene-items-four{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:73px;gap:11px 10px;padding:0 20px}
.display-piece{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:3px;min-width:0;min-height:164px;padding:8px 3px 11px;background:linear-gradient(155deg,#ffffffda,#fff4fadd 65%,#ffe2efd9);border:1px solid #ffffffd9;border-radius:18px;color:#7d3b69;box-shadow:0 8px 17px #7d367025,inset 0 -2px 0 #f5c0da;backdrop-filter:blur(3px);text-align:center;transition:transform .2s,box-shadow .2s}
.display-piece:active{transform:scale(.97)}
.display-piece.collected{border:1px solid #f9d798;background:linear-gradient(145deg,#fffef7f5,#ffeef9ed 70%,#fbe2eeef);box-shadow:0 6px 18px #a6538d38,0 0 0 1px #ffffffa3}
.display-piece.locked{background:linear-gradient(145deg,#fffafaac,#f4d9eaa6);border:1px dashed #d9b5cf;color:#916f8c}
.display-art{width:100%;height:107px;display:grid;place-items:center;min-width:0}
.display-art img{max-width:100%;max-height:106px;object-fit:contain;filter:drop-shadow(0 6px 9px #9b4a7244)}
.display-piece strong{font-size:11px;line-height:1.15;overflow-wrap:anywhere}
.display-piece small{font-size:10px;font-weight:850;color:#ab5283}
.display-piece.locked small{color:#947f91}
.product-emoji{font-size:58px;line-height:1;filter:drop-shadow(0 6px 6px #7d35643a)}
.locked-gift{display:grid;place-items:center;width:64px;height:64px;border-radius:20px;background:radial-gradient(circle,#fffafbef,#f3dae7aa);filter:grayscale(.75);font-size:44px;opacity:.65}
.scene-help{margin:13px 2px 8px;font-size:13px}
.fashion-scene{min-height:432px;background:linear-gradient(160deg,#fff4e7,#f4dbef 42%,#cf9cba 80%,#aa649a)}
.tech-scene{min-height:432px;background:linear-gradient(150deg,#e6e7ff,#fce8f8 43%,#b6a1d2 82%,#777bad)}
.scene-banner{position:relative;z-index:2;margin:25px auto 0;width:max-content;max-width:85%;padding:10px 20px;border-radius:50px;border:1px solid #ffecce;background:#fffaf3da;color:#b85d8b;font-family:Georgia,serif;font-size:11px;letter-spacing:2px;text-align:center;box-shadow:0 4px 17px #99528035}
.scene-banner span{color:#deab44}
.scene-items-four .display-piece{min-height:154px}
.scene-items-four .display-art{height:93px}
.scene-items-four .display-art img{max-height:91px}
.scene-items-four .product-emoji{font-size:55px}
.fashion-scene .scene-shelf,.tech-scene .scene-shelf{bottom:17px}
@media(max-width:370px){.scene-items-three{padding:0 6px;gap:5px}.display-piece{padding-inline:2px}.display-piece strong{font-size:10px}.display-piece small{font-size:9px}.scene-items-four{padding:0 11px}.city-zone-heading h2{font-size:21px}}
.career-card{margin-top:24px;padding:21px 17px 18px}
.career-top{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;align-items:center}
.career-kicker{font-size:10px;letter-spacing:1.4px;font-weight:900;color:#c43074}
.career-count{font-size:11px;font-weight:750;color:#916c96}
.career-card h2{margin:9px 0 11px;font-size:21px;letter-spacing:-.5px}
.career-rank{display:block;color:#a5357e;font-size:19px;line-height:1.3}
.career-next{font-size:12px;line-height:1.4;color:#856987;margin:7px 0 12px}
.career-track{height:12px;margin-bottom:17px}
.career-track .bar-fill{display:block}
.career-milestones{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.career-badge{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:0;padding:9px 3px;min-height:90px;border-radius:13px;border:1px dashed #e2d3e1;background:#fbf7fa;color:#9a8b9c;text-align:center;font-size:10px;font-weight:800;line-height:1.2}
.career-badge.achieved{background:linear-gradient(145deg,#fff3d0,#ffe6f1);color:#963f77;border:1px solid #edcc8a;box-shadow:0 2px 8px #a8578630}
.career-symbol{font-size:23px;color:#be9fbf}
.career-badge.achieved .career-symbol{color:#d99a25}
.career-badge small{font-size:9px;color:#a193a4;font-weight:650}
.career-hint{font-size:11px;line-height:1.55;color:#97839b;margin:14px 1px 0}
.celebration-dialog{width:min(430px,calc(100vw - 32px));max-height:calc(100dvh - 40px);margin:auto;padding:0;border:0;border-radius:28px;background:transparent;color:var(--ink);box-shadow:0 30px 100px #2d143c6e;overflow:visible}
.celebration-dialog::backdrop{background:rgba(43,12,48,.72);backdrop-filter:blur(7px)}
.celebration-dialog[open]{animation:celebration-enter .42s cubic-bezier(.17,.89,.26,1.2) both}
.celebration-content{position:relative;overflow:hidden;isolation:isolate;border:2px solid #fff;border-radius:28px;padding:30px 21px 24px;background:linear-gradient(155deg,#fff8fa,#f5ddfb 53%,#ffecf4);text-align:center}
.celebration-close{position:absolute;right:13px;top:13px;z-index:4;width:34px;height:34px;border:0;border-radius:50%;background:#ffffffc7;color:#934d7d;font-size:25px;line-height:1}
.celebration-eyebrow{position:relative;z-index:3;margin:7px 0 12px;color:#a23b7e;font-size:12px;letter-spacing:1.7px;font-weight:900}
.celebration-image-frame{position:relative;z-index:1;height:215px;display:grid;place-items:center;border-radius:25px;background:radial-gradient(ellipse at center,#fffaf9 12%,#fce2f4 54%,transparent 75%)}
.celebration-image-frame img{display:block;width:auto;max-width:100%;max-height:210px;object-fit:contain;filter:drop-shadow(0 12px 15px #97346d40);animation:reward-reveal .65s cubic-bezier(.2,.9,.25,1.3) both}
.celebration-content h2{position:relative;z-index:3;font-size:clamp(23px,7vw,29px);margin:5px 0 10px;letter-spacing:-.7px;line-height:1.12;font-weight:900}
.celebration-content p#celebration-description{position:relative;z-index:3;color:#755879;line-height:1.5;font-size:14px;margin:0 auto 17px;max-width:310px}
.celebration-done{position:relative;z-index:3;width:100%;font-size:16px;min-height:53px}
.celebration-sparkles{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.celebration-sparkle{position:absolute;left:50%;top:44%;color:#efb61e;font-size:24px;text-shadow:0 0 5px #fff4a9,0 0 10px #f6b32e;opacity:0;animation:star-burst 1.55s ease-out var(--delay) both}
.celebration-sparkle:nth-child(3n){color:#fffdf0;font-size:16px}
.celebration-sparkle:nth-child(4n){color:#e87aa8;font-size:21px}
@keyframes celebration-enter{from{opacity:0;transform:scale(.78) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}
@keyframes reward-reveal{from{opacity:0;transform:scale(.58) rotate(-8deg)}60%{opacity:1;transform:scale(1.07) rotate(2deg)}to{opacity:1;transform:scale(1) rotate(0)}}
@keyframes star-burst{0%{opacity:0;transform:translate(-50%,-50%) scale(.2) rotate(-35deg)}18%{opacity:1}58%{opacity:1}100%{opacity:0;transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) scale(.55) rotate(130deg)}}
.profile-head{display:flex;gap:13px;align-items:center;margin:24px 0 24px}
.profile-avatar{width:65px;height:65px;border-radius:22px;display:grid;place-items:center;font-size:35px;color:#ffe2a1;background:linear-gradient(145deg,#d93c83,#963aaf)}
.profile-head h1{font-size:25px;margin:0 0 2px;letter-spacing:-.7px}
.profile-head p{font-size:13px}
.stat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:15px}
.stat{display:flex;flex-direction:column;gap:5px;padding:19px 15px}
.stat strong{font-size:30px;color:#a64a9a}
.stat span{font-size:12px;color:#78677d}
.profile-review-note{text-align:center;color:#856c8d;font-size:12px;line-height:1.5;margin:7px 15px 0}
.profile-learned-note{text-align:center;color:#856c8d;font-size:12px;line-height:1.5;margin:0 10px 13px}
.full-width{width:100%;margin:8px 0;min-height:50px}
.secondary-button{display:inline-flex;align-items:center;justify-content:center;text-align:center;border:1px solid #ddabc9;border-radius:100px;color:#ab387e;background:#fff1f8;font-size:14px;font-weight:800;min-height:47px;padding:10px 16px}
.profile-storage{padding:20px 18px;margin-top:20px}
.profile-storage h2{font-size:19px;margin:0 0 9px}
.profile-storage p{font-size:13px;line-height:1.5;color:#7e6b85}
.upload-label{cursor:pointer;width:100%;margin:7px 0}
.reset-button{display:block;margin:12px auto 0;border:0;background:transparent;color:#a75a7e;font-size:12px;text-decoration:underline;padding:10px}
.finish-visual{font-size:85px;text-align:center;margin:68px auto 16px;filter:drop-shadow(0 9px 8px #8e236638)}
.center{text-align:center}
.finish-summary{line-height:1.5;text-align:center;color:#795f86;margin:14px auto 22px;max-width:300px}
.finish-stats{display:flex;padding:24px 18px;justify-content:space-around;margin-bottom:25px}
.finish-stats div{display:flex;align-items:center;flex-direction:column;gap:4px}
.finish-stats strong{font-size:28px;color:#b7307b}
.finish-stats span{font-size:12px;color:#826984}
.toast{position:fixed;z-index:20;left:50%;bottom:96px;transform:translate(-50%,20px);min-width:200px;max-width:calc(100vw - 35px);padding:12px 20px;border-radius:18px;background:#461839;color:white;box-shadow:0 11px 30px #28092338;text-align:center;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;font-size:13px;font-weight:700}
.toast.show{opacity:1;transform:translate(-50%,0)}
@media(min-width:550px){body{padding:24px 0}.app-shell{min-height:850px;border-radius:38px;border:6px solid #33303e;overflow:hidden}.topbar{padding-top:27px}}
@media(max-width:370px){.topbar{padding:22px 14px 14px}.wallet{font-size:10px;padding:3px 7px 3px 3px}.wallet-label{display:none}.brand{font-size:21px}#main-content{padding:0 13px 22px}.hero-training{padding:14px 10px;gap:3px}.book-illustration{width:99px;height:99px;flex-basis:99px}.book-illustration span{height:78px;width:65px;font-size:45px}.training-info h2{font-size:21px}.primary-button{padding:12px 13px;font-size:12px}.world-row{padding:9px}.tab{padding:6px 7px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}