:root{--ink:#102653;--muted:#5c7896;--green:#08976b;--blue:#136aeb;--line:#dfeef7;--card:#ffffffed;--shadow:0 15px 38px rgba(15,80,116,.11);--easing:cubic-bezier(.2,.8,.2,1)}
*{box-sizing:border-box}html{min-height:100%;scroll-behavior:smooth}body{margin:0;color:var(--ink);background:#daeefa;font-family:'DM Sans',system-ui,-apple-system,sans-serif}button,a,summary{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #ffc333;outline-offset:3px}button,summary{touch-action:manipulation}a{color:#1255ac;font-weight:800}em{font-style:normal;color:#059466}h1,h2,h3,p{overflow-wrap:break-word}h1,h2,h3{font-family:Outfit,system-ui,sans-serif}img{max-width:100%}#app{min-height:100vh}
.app-shell{max-width:525px;min-height:100dvh;margin:auto;position:relative;overflow:hidden;background:linear-gradient(180deg,#b2edff 0,#ecf8ff 22%,#fffef3 55%,#e7fbf0 100%);padding:0 17px calc(106px + env(safe-area-inset-bottom));box-shadow:0 1px 52px rgba(9,57,95,.16);isolation:isolate}
.app-shell:before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 70% 12% at 102% 13%,#ffed975e,transparent),radial-gradient(ellipse 70% 13% at -25% 38%,#5eddae50,transparent),radial-gradient(ellipse 80% 10% at 120% 74%,#bae3ff94,transparent);z-index:-1}
.main-content{padding-bottom:18px}.masthead{display:flex;align-items:center;justify-content:space-between;min-height:91px;gap:8px;position:relative;z-index:3}.brand{display:flex;align-items:center;gap:9px;border:0;padding:0;background:transparent;color:var(--ink);text-align:left;font-family:Outfit,sans-serif;font-size:23px;font-weight:900;line-height:.92;letter-spacing:-.8px}.brand img{width:50px;height:50px;filter:drop-shadow(0 6px 8px rgba(14,126,87,.14))}.brand small{font-weight:900;font-size:20px;display:block}.brand b{color:#058d5c}.edition-pill{display:flex;align-items:center;gap:5px;border-radius:30px;background:#ffffffbb;border:1px solid #ffffff;font-weight:900;color:#1b6a6d;letter-spacing:.7px;font-size:9px;padding:10px 11px;white-space:nowrap}.live-dot{width:7px;height:7px;background:#00be75;border-radius:100%;box-shadow:0 0 0 4px #00be7533;animation:pulse 2.6s infinite}.circle-btn{width:43px;height:43px;border-radius:50%;border:1px solid #fff;background:#ffffffe0;font-size:26px;color:#20476e;box-shadow:var(--shadow)}
.eyebrow{font-size:10px;font-weight:900;letter-spacing:1.7px;color:#087b63}.page-heading h1{font-family:Outfit,sans-serif;font-size:clamp(35px,8.9vw,48px);line-height:1.04;letter-spacing:-1.5px;margin:10px 0 8px;font-weight:900}.page-heading p{margin:0;max-width:410px;font-size:15px;color:#446986;line-height:1.49}.page-heading{position:relative;z-index:1}.home-hero{position:relative;padding-top:8px;border-radius:29px;min-height:348px}.home-hero .page-heading{max-width:390px;padding-top:24px}.home-hero .page-heading h1{font-size:clamp(42px,10vw,57px);letter-spacing:-2px;line-height:1.0}.home-hero .page-heading p{max-width:325px}.landscape{height:145px;position:relative;overflow:hidden;width:100%;margin-top:-3px;pointer-events:none}.landscape svg{width:110%;height:172px;position:absolute;bottom:-2px;left:-5%;filter:drop-shadow(0 5px 4px rgba(17,100,142,.08))}.sun-glow{width:190px;height:190px;position:absolute;right:8px;bottom:-30px;border-radius:50%;background:radial-gradient(circle,#ffe37a89,#ffe37a30 49%,transparent 75%);animation:lightglow 5s ease-in-out infinite}.cloud{position:absolute;height:21px;background:#ffffff9c;border-radius:40px;filter:blur(1px)}.cloud:before,.cloud:after{content:'';position:absolute;border-radius:50%;background:#ffffff9c}.cloud:before{width:37px;height:32px;bottom:1px;left:18px}.cloud:after{width:28px;height:25px;bottom:0;left:45px}.cloud-a{width:105px;left:20px;top:40px;animation:cloudfloat 10s ease-in-out infinite}.cloud-b{width:99px;right:15px;top:21px;animation:cloudfloat 9s -3s ease-in-out infinite}.bush{position:absolute;bottom:1px;width:30%;height:32px;border-radius:70% 60% 0 0;background:radial-gradient(circle at 20% 0,#6cd96c 0 15%,transparent 16%),radial-gradient(circle at 50% 0,#24ac77 0 25%,transparent 26%),radial-gradient(circle at 85% 0,#168871 0 20%,transparent 21%)}.bush-left{left:-15px}.bush-right{right:-15px;transform:scaleX(-1)}
.floating{position:absolute;z-index:2;display:flex;align-items:center;gap:5px;background:#ffffffd6;border:1px solid white;box-shadow:0 8px 18px #22698713;border-radius:30px;padding:8px 11px;font-weight:800;font-size:10px;color:#127e6e;animation:bob 4s ease-in-out infinite}.mini-float.one{right:4px;top:1px}.mini-float.two{right:1px;bottom:122px;animation-delay:-2s}.home-highlight{display:flex;align-items:center;gap:10px;background:#ffffffb8;border:1px solid #ffffffea;padding:9px 13px;border-radius:17px;font-size:12px;font-weight:600;margin-top:-18px;position:relative;z-index:2;box-shadow:0 9px 26px #267a9a0c}.home-highlight strong{color:#057f60}.highlight-logo{height:36px;width:36px;display:grid;place-items:center;background:#e4f8ef;border-radius:11px;font-size:22px;flex-shrink:0}
.feature-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:14px 0 16px}.feature-strip>div{background:#ffffffbd;border:1px solid white;border-radius:18px;padding:12px 5px;text-align:center;box-shadow:0 5px 16px #1b77a010;display:flex;align-items:center;flex-direction:column;gap:4px}.feature-strip span{font-size:22px;color:#076a9c}.feature-strip strong{font-size:12px}.feature-strip small{color:#63819a;font-size:10px}.action-stack{display:grid;gap:9px}.action-stack.spaced{margin-top:22px}.main-btn,.outline-btn,.text-btn{border:0;width:100%;min-height:58px;border-radius:19px;display:flex;align-items:center;justify-content:center;gap:10px;font-size:16px;font-weight:900;text-align:center;position:relative;overflow:hidden;transition:transform .2s var(--easing),box-shadow .2s var(--easing),background .2s}.main-btn{background:linear-gradient(125deg,#00c77a,#048b66);box-shadow:0 11px 23px #069a6b33;color:white;border:1px solid #52dda5}.main-btn span{font-size:22px;margin-left:10px}.main-btn:before{content:'';position:absolute;height:120%;width:65px;left:-125px;top:-10%;transform:skewX(-24deg);background:linear-gradient(90deg,transparent,#fff7,transparent);animation:shimmer 4.6s infinite}.outline-btn{background:#ffffffbf;color:#185ba8;border:1.5px solid #448bee}.text-btn{color:#397296;background:transparent;min-height:44px;font-size:13px}.main-btn:hover,.outline-btn:hover{transform:translateY(-2px);box-shadow:0 13px 25px #16759c25}.main-btn:active,.outline-btn:active{transform:scale(.975)}
.section-head{display:flex;justify-content:space-between;align-items:center;margin:25px 0 11px}.section-head h2{font-size:24px;letter-spacing:-.5px;margin:5px 0 0;line-height:1.1}.sparkle{color:#ffbb08;font-size:31px;animation:spinhalf 5s ease-in-out infinite}.candidate-row{display:grid;grid-template-columns:1fr 1fr;gap:11px}.candidate-card{position:relative;display:flex;flex-direction:column;justify-content:end;text-align:left;min-height:182px;overflow:hidden;border-radius:23px;border:2px solid #ffffffb2;color:white;padding:11px;box-shadow:0 10px 23px #1a598c2a;transition:transform .25s var(--easing),box-shadow .25s}.candidate-card.rose{background:linear-gradient(145deg,#fe5d75,#bc2645)}.candidate-card.blue{background:linear-gradient(150deg,#298efa,#103bab)}.candidate-card img{object-fit:cover;object-position:50% 27%;height:116px;width:116px;border:3px solid #ffffff81;border-radius:50%;position:absolute;top:5px;left:50%;transform:translateX(-50%);box-shadow:0 7px 15px #0003}.candidate-card .candidate-text{position:relative;z-index:1;text-shadow:0 1px 7px #03174e88;display:grid;gap:2px;margin-top:121px}.candidate-text strong{font-size:19px;line-height:1.02;font-family:Outfit;font-weight:900}.candidate-text small{font-size:10px;color:#fff8ee;font-weight:700}.candidate-go{font-size:18px;position:absolute;right:11px;bottom:8px;transition:transform .2s}.candidate-card:hover{transform:translateY(-4px)}.candidate-card:hover .candidate-go{transform:translate(2px,-2px)}.candidate-card.large{min-height:223px}.candidate-card.large img{height:143px;width:143px}.candidate-card.large .candidate-text{margin-top:155px}.candidate-card.large .candidate-text strong{font-size:23px}.profile-list{display:grid;gap:14px;margin-top:20px}.profile-list .candidate-card{min-height:220px}.profile-list .candidate-card img{position:relative;left:auto;transform:none;top:auto;margin-bottom:-100px;align-self:flex-end;height:145px;width:145px}.profile-list .candidate-card .candidate-text{margin-top:106px}
.glass-note{display:flex;align-items:flex-start;gap:11px;background:#ffffffe3;border-radius:19px;border:1px solid white;padding:14px;margin-top:16px;box-shadow:var(--shadow)}.glass-note span{font-size:28px}.glass-note p{margin:0;color:#4d6a81;font-size:12px;line-height:1.5}.mini-chips{display:flex;gap:7px;flex-wrap:wrap;margin:5px 0 18px}.mini-chips span{font-size:11px;padding:8px 11px;border-radius:40px;background:#ffffffc9;box-shadow:0 5px 15px #2079ac13;color:#235c89;font-weight:800;border:1px solid white}
/* Screen transitions: whole screen moves softly, then cards/stats reveal in stages */
.view-enter{animation:pagein .49s var(--easing) both}.view-exit{animation:pageout .17s ease-in both;pointer-events:none}.view-enter>.page-heading,.view-enter>.question-hero{animation:slidein .48s var(--easing) both}.view-enter>.panel,.view-enter>.stat-banner,.view-enter>.question-card{animation:slidein .58s .08s var(--easing) both}.view-enter>.answer-grid,.view-enter>.topic-grid,.view-enter>.candidate-row,.view-enter>.compare-stack{animation:slidein .58s .14s var(--easing) both}
/* Quiz */
.quiz-topline{display:flex;align-items:center;justify-content:space-between;color:#255d82;font-size:12px;font-weight:800;margin:6px 3px 9px}.quiz-topline strong{font-size:16px;color:#027d64}.progressbar{height:11px;border:2px solid #effbff;background:#cfe0ee;border-radius:999px;overflow:hidden;box-shadow:0 3px 8px #36789910}.progressbar>span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#25d47d,#008d70);transition:width .65s var(--easing);position:relative}.progressbar>span:after{content:'';position:absolute;right:0;width:10px;top:-1px;bottom:-1px;background:#defff4a9;box-shadow:0 0 13px #b0fff9;border-radius:50%}.question-hero{position:relative;margin-top:12px;height:166px;text-align:center;z-index:0}.question-hero h1{font-size:clamp(25px,8vw,37px);font-weight:900;line-height:1.1;margin:10px auto 0;position:relative;z-index:1;max-width:320px}.question-hero h1 em{color:var(--theme)}.question-hero .landscape{margin-top:-17px;height:116px;opacity:.75}.question-hero .landscape svg{height:147px}.question-orb{position:absolute;border:2px solid white;background:#ffffffd6;box-shadow:0 9px 18px #40829c26;border-radius:50%;display:grid;place-items:center;z-index:2;animation:bob 4s infinite}.orb-a{top:23px;left:3px;width:48px;height:48px;font-size:26px}.orb-b{top:42px;right:15px;width:34px;height:34px;font-size:28px;color:#ffb52b;animation-delay:-2s}.question-card{background:white;border:1px solid #fff;border-radius:27px;box-shadow:var(--shadow);padding:19px 21px 20px;position:relative;margin-top:0;min-height:177px}.question-bigicon{width:54px;height:54px;display:grid;place-items:center;background:var(--theme-soft);border-radius:17px;font-size:30px;box-shadow:inset 0 0 1px var(--theme);animation:softpulse 2.7s ease-in-out infinite}.question-label{font-size:10px;font-weight:900;color:var(--theme);letter-spacing:1.5px;display:block;margin-top:10px}.question-card h2{font-size:clamp(22px,6.1vw,29px);font-weight:900;line-height:1.15;letter-spacing:-.5px;margin:7px 0}.question-card p{color:#69809e;line-height:1.45;font-size:13px;margin:0}.answer-grid{display:grid;gap:9px;margin-top:14px}.answer-btn{width:100%;min-height:59px;border:1.5px solid #ffffffd1;border-radius:19px;padding:9px 11px;display:flex;align-items:center;gap:13px;color:#fff;text-align:left;box-shadow:0 7px 18px #256c9126;transition:transform .18s var(--easing),filter .22s,box-shadow .22s}.answer-btn.green{background:linear-gradient(110deg,#08cc78,#049262)}.answer-btn.blue{background:linear-gradient(110deg,#1e8aff,#0958d4)}.answer-btn.sky{background:linear-gradient(110deg,#419fe7,#1a79bf)}.answer-btn.violet{background:linear-gradient(110deg,#8f89e4,#6960b8)}.answer-btn.indigo{background:linear-gradient(110deg,#657fb9,#43598b)}.answer-btn.gold{background:linear-gradient(110deg,#ffe25e,#ffc318);color:#132b58}.answer-btn.red{background:linear-gradient(110deg,#ff6067,#e92c44)}.answer-btn.gray{background:linear-gradient(110deg,#819bb1,#5d7590)}.answer-mark{height:38px;width:38px;flex-shrink:0;border-radius:50%;background:#fffef4e0;display:grid;place-items:center;color:#125983;font-size:22px;font-weight:900}.answer-btn.green .answer-mark{color:#099b6e}.answer-btn.red .answer-mark{color:#ec3146}.answer-btn strong{flex:1;font-size:clamp(14px,4.1vw,17px);font-weight:900}.answer-next{background:#001b3833;border-radius:50%;width:31px;height:31px;display:grid;place-items:center;font-size:30px;line-height:1;transition:transform .18s}.answer-btn:hover{filter:brightness(1.045);transform:translateY(-2px)}.answer-btn:active,.answer-btn.chosen{transform:scale(.97);filter:brightness(1.08);box-shadow:0 0 0 4px #ffffff80,0 7px 25px #246d9955}.answer-btn.chosen .answer-next{transform:translateX(5px)}
.scale-explorer,.curiosity{background:#fffffff0;border:1px solid white;border-radius:20px;margin-top:13px;box-shadow:0 6px 20px #12547b12;padding:15px}.scale-title{font-size:14px;font-weight:900}.scale-options{display:flex;gap:7px;margin-top:11px}.scale-options button{flex:1;border:1px solid #c8dfee;background:#eef6fa;color:#154c83;border-radius:12px;padding:12px 6px;font-weight:900;font-size:13px;transition:all .2s}.scale-options button.selected{background:#1163e5;color:white;border-color:#1163e5;transform:translateY(-2px);box-shadow:0 7px 14px #337fed30}.scale-explorer p{color:#5c7896;font-size:12px;line-height:1.5;margin:11px 0 0}.curiosity{padding:0;overflow:hidden}.curiosity summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:12px;padding:12px}.curiosity summary::-webkit-details-marker{display:none}.curiosity summary>span:nth-child(2){display:flex;flex-direction:column;gap:3px;flex:1}.curiosity strong{font:900 17px Outfit}.curiosity small{color:#6683a0;font-size:11px}.bulb{height:43px;width:43px;border-radius:50%;background:#ffcc25;display:grid;place-items:center;color:white;font-size:27px;box-shadow:0 6px 16px #ffc42e42}.chevron{font-size:24px;transition:transform .24s}.curiosity[open] .chevron{transform:rotate(180deg)}.curiosity-body{padding:0 17px 15px;color:#4b6783;font-size:13px;line-height:1.5;animation:slidein .35s ease both}.curiosity-body p{margin:3px 0 9px}.linkpill{display:inline-flex;align-items:center;gap:5px;text-decoration:none;background:#e7f4ff;border:1px solid #cce5f8;border-radius:13px;padding:8px 11px;font-size:12px;line-height:1.2;transition:background .2s}.linkpill:hover{background:#d6eeff}.quiz-foot{display:flex;flex-direction:column;align-items:center;margin-top:9px;color:#71879d;font-size:10px}.quiz-foot .text-btn{min-height:34px}
/* Main explore view */
.topic-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin-top:15px}.topic-tile{position:relative;min-height:213px;background:linear-gradient(160deg,var(--soft),#ffffffeb 65%);border:1.5px solid #fff;text-align:left;border-radius:24px;padding:13px;display:flex;flex-direction:column;gap:8px;box-shadow:0 9px 26px rgba(33,85,118,.10);transition:transform .26s var(--easing),box-shadow .26s}.topic-tile:hover{transform:translateY(-5px) rotate(-.5deg);box-shadow:0 15px 25px #17498021}.topic-illustration{height:73px;width:100%;border-radius:17px;background:linear-gradient(145deg,#ffffffa0,var(--soft));display:grid;place-items:center;font-size:50px;filter:drop-shadow(0 6px 3px #ffffffa8);animation:bob 5.4s ease-in-out infinite}.topic-tile:nth-child(even) .topic-illustration{animation-delay:-2s}.topic-tile strong{font:900 18px/1.05 Outfit}.topic-tile small{font-size:11px;line-height:1.36;color:#5d7897;flex:1}.tile-link{color:var(--accent);font-weight:900;font-size:12px;display:flex;justify-content:space-between;align-items:center;background:#fff9;border-radius:12px;padding:9px 10px}.tile-link b{font-size:19px}
/* Radar and results */
.confetti{position:absolute;top:115px;font-size:41px;color:#ffd545;animation:bob 4s ease-in-out infinite}.confetti-a{right:32px}.confetti-b{right:60px;top:150px;color:#0bbf9a;animation-delay:-2s}.stat-banner{display:flex;align-items:center;gap:13px;border-radius:20px;background:#eaffef;box-shadow:var(--shadow);border:1px solid white;margin-top:18px;padding:13px}.stat-icon{background:#06bc70;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:28px;font-weight:900;animation:softpulse 2.2s infinite}.stat-banner strong{display:block;font-weight:900;font-size:14px}.stat-banner small{display:block;font-size:12px;line-height:1.3;color:#5c7b7d;margin-top:3px}.panel{background:#fffffff0;border:1.5px solid white;border-radius:23px;box-shadow:var(--shadow);padding:17px;margin-top:14px}.panel h2{font:900 22px/1.12 Outfit;margin:0 0 10px}.panel p{font-size:13px;color:#536e89;line-height:1.6}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:5px}.panel-heading h2{margin:0}.panel-tag{color:#0b9269;background:#e3f8ed;font-weight:900;font-size:9px;padding:6px 8px;border-radius:10px}.chart-holder{background:radial-gradient(ellipse at center,#f3fffb 0,#ffffff00 76%);display:grid;place-items:center;margin:2px auto}.radar{width:100%;max-width:280px;height:auto;display:block}.radar-shape{transform-origin:50% 50%;animation:growradar .85s .14s cubic-bezier(.21,.88,.23,1.1) both}.priority-rows{display:grid;gap:6px}.priority-line{border:1px solid #eff5fb;background:#f9fcff;text-align:left;border-radius:13px;padding:9px;display:flex;align-items:center;gap:10px;width:100%;transition:transform .2s,background .2s}.priority-line:hover{background:#eff8ff;transform:translateX(2px)}.topic-round{height:41px;width:41px;border-radius:13px;background:var(--soft);display:grid;place-items:center;flex-shrink:0;font-size:23px}.priority-label{flex:1;min-width:0}.priority-label strong{font-size:13px}.priority-line>b{font:900 15px Outfit;min-width:39px;text-align:right}.meter{display:block;height:9px;background:#dfecf5;border-radius:12px;overflow:hidden;margin-top:7px}.meter i{display:block;height:100%;width:var(--amount);background:linear-gradient(90deg,#79d5cb,var(--bar));border-radius:12px;animation:growbar 1.3s .25s var(--easing) both}.methodnote{color:#6d8498!important;font-size:11px!important;margin-top:14px;line-height:1.52!important}.next-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.next-tile{display:flex;flex-direction:column;text-align:left;gap:5px;min-height:158px;border:1px solid white;border-radius:21px;padding:17px;font-weight:900;color:#174b70;box-shadow:var(--shadow);transition:transform .2s}.next-tile:hover{transform:translateY(-3px)}.next-tile.mint{background:#ddf9ea}.next-tile.lavender{background:#e9ebff}.next-tile span{font-size:30px;color:#157ccc}.next-tile strong{font-size:16px}.next-tile small{font-weight:600;font-size:11px;color:#64809c}
/* Comparison & profile */
.topic-tabs{display:flex;overflow-x:auto;gap:8px;scrollbar-width:none;margin:13px -17px 10px;padding:5px 17px 10px}.topic-tabs button{flex-shrink:0;border:1px solid #d3e6f1;background:#fffdfc;color:#315f86;border-radius:24px;padding:10px 13px;font-weight:900;font-size:12px;transition:background .2s,color .2s,transform .2s}.topic-tabs button.active{color:white;background:#106de4;border-color:#106de4;box-shadow:0 6px 12px #1467b82b;transform:translateY(-2px)}.topic-lead{background:linear-gradient(135deg,var(--soft),#fffffff2);margin-top:5px}.topic-lead .topic-headicon{width:57px;height:57px;border-radius:17px;display:grid;place-items:center;background:#fff;font-size:34px;margin-bottom:12px;box-shadow:0 6px 15px #154c7512}.topic-lead h2{font:900 24px Outfit;margin:7px 0}.topic-lead p{margin:0}.compare-stack{display:grid;gap:12px;margin-top:14px}.candidate-summary{border:1px solid #fff;border-radius:22px;background:#fffffff5;overflow:hidden;box-shadow:var(--shadow)}.candidate-summary-top{display:flex;align-items:center;gap:14px;padding:11px 15px;color:white}.candidate-summary.rose .candidate-summary-top{background:linear-gradient(115deg,#ff6473,#ce2c4d)}.candidate-summary.blue .candidate-summary-top{background:linear-gradient(115deg,#258aff,#1555c8)}.candidate-summary-top img{width:66px;height:66px;object-fit:cover;border-radius:50%;border:3px solid #ffffffb2}.candidate-summary-top strong{font:900 21px Outfit;display:block}.candidate-summary-top small{font-size:11px;opacity:.95}.candidate-summary>p{padding:14px 15px 4px;line-height:1.55;font-size:13px;color:#435f7b;margin:0}.candidate-links{padding:8px 15px 15px}.verification{display:flex;align-items:flex-start;gap:12px;background:#fff8df;border:1px solid #fff3bc;border-radius:19px;padding:14px;margin-top:15px}.verify-icon{width:40px;height:40px;border-radius:50%;background:#faca20;display:grid;place-items:center;font-size:24px;flex-shrink:0}.verification strong{font-size:14px;font-weight:900}.verification p{font-size:12px;color:#6d6581;line-height:1.5;margin:4px 0 0}.profile-banner{border-radius:23px;position:relative;overflow:hidden;margin-top:18px;display:flex;align-items:center;gap:15px;min-height:185px;padding:17px;color:white;box-shadow:var(--shadow)}.profile-banner.rose{background:linear-gradient(115deg,#fd6673,#c12646)}.profile-banner.blue{background:linear-gradient(115deg,#2389ec,#143fb1)}.profile-banner img{width:128px;height:143px;object-fit:cover;object-position:50% 25%;border-radius:20px;border:3px solid #ffffff76}.profile-banner h2{font:900 31px/.98 Outfit;margin:9px 0}.profile-banner small{font-size:11px;line-height:1.4}.profile-badge{border:1px solid #fff8;border-radius:12px;padding:5px 10px;font-weight:900;font-size:12px}.profile-sections{display:grid;gap:9px;margin-top:15px}.profile-details{background:#fffffff2;border:1px solid white;border-radius:18px;box-shadow:0 7px 19px #1f6c9520;overflow:hidden}.profile-details summary{list-style:none;display:flex;align-items:center;gap:13px;padding:14px 15px;cursor:pointer}.profile-details summary::-webkit-details-marker{display:none}.profile-details summary span{width:40px;height:40px;background:#eaf5ff;display:grid;place-items:center;border-radius:13px;font-size:21px}.profile-details summary strong{flex:1;font-size:14px;font-weight:900}.profile-details summary b{font-size:22px;color:#406b92;transition:transform .2s}.profile-details[open] summary b{transform:rotate(180deg)}.detail-body{padding:0 17px 16px 17px;color:#456684;line-height:1.55;font-size:13px;animation:slidein .22s ease both}.detail-body p{margin:3px 0 10px}.detail-body ul{margin:4px 0 12px;padding-left:20px}.detail-body li{margin-bottom:7px}.detail-body .linkpill{margin:5px 5px 2px 0}.source-list{display:grid;gap:11px}.source-list>div{border-radius:15px;background:#f5fbff;border:1px solid #e3eff6;padding:13px;display:grid;gap:7px}.source-list strong{font-weight:900;font-size:13px}.source-list small{color:#67859c;font-size:11px}.source-list .linkpill{justify-self:start}
/* Bottom nav */
.bottom-nav{position:fixed;z-index:15;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,525px);height:calc(72px + env(safe-area-inset-bottom));padding:7px 8px calc(7px + env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;align-items:stretch;border-top:1px solid #ffffffcf;background:#fffffff3;box-shadow:0 -7px 29px rgba(16,64,104,.12);backdrop-filter:blur(17px);-webkit-backdrop-filter:blur(17px)}.bottom-nav button{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2px;border:0;border-radius:12px;background:transparent;color:#65849c;font-size:10px;font-weight:900;transition:color .2s,background .2s}.bottom-nav .nav-icon{font-size:24px;line-height:1.1;transition:transform .2s}.bottom-nav button.current{color:#038c68;background:#e1f8ee}.bottom-nav button.current .nav-icon{transform:translateY(-2px)}.bottom-nav button:active .nav-icon{transform:scale(.85)}#liveToast{position:fixed;z-index:25;bottom:calc(95px + env(safe-area-inset-bottom));left:50%;transform:translate(-50%,15px);background:#153b58;color:#fff;box-shadow:var(--shadow);border-radius:13px;padding:9px 13px;font-size:13px;max-width:400px;width:max-content;pointer-events:none;opacity:0;transition:opacity .2s,transform .2s}#liveToast.visible{opacity:1;transform:translate(-50%,0)}
@keyframes pagein{from{opacity:0;transform:translateY(18px) scale(.994)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes pageout{to{opacity:0;transform:translateY(-8px) scale(.99)}}@keyframes slidein{from{opacity:0;transform:translateY(17px)}to{opacity:1;transform:translateY(0)}}@keyframes growradar{from{opacity:.1;transform:scale(.15)}to{opacity:1;transform:scale(1)}}@keyframes growbar{from{width:0}to{width:var(--amount)}}@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes pulse{0%,100%{box-shadow:0 0 0 4px #00be7530}50%{box-shadow:0 0 0 7px #00be750e}}@keyframes softpulse{0%,100%{transform:scale(1)}50%{transform:scale(1.045)}}@keyframes shimmer{0%,57%{left:-125px}75%,100%{left:125%}}@keyframes spinhalf{50%{transform:rotate(25deg)}}@keyframes cloudfloat{0%,100%{transform:translateX(0)}50%{transform:translateX(17px)}}@keyframes lightglow{0%,100%{transform:scale(1)}50%{transform:scale(1.16)}}
@media(max-width:370px){.app-shell{padding-left:12px;padding-right:12px}.brand{font-size:20px}.brand small{font-size:17px}.brand img{width:44px;height:44px}.edition-pill{font-size:8px;padding:9px 7px}.home-hero .page-heading h1{font-size:42px}.question-card h2{font-size:22px}.question-hero{height:142px}.topic-tile{min-height:225px;padding:11px}.topic-tile strong{font-size:16px}.profile-banner img{width:103px;height:122px}.profile-banner h2{font-size:25px}.candidate-card .candidate-text strong{font-size:17px}}
@media(min-width:526px){.app-shell{border-radius:0 0 18px 18px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
/* Animated on-load progress and staggered answers */
.progressbar>span{animation:progressDraw .48s var(--easing) both}
.answer-grid .answer-btn{animation:answerReveal .45s var(--easing) both}
.answer-grid .answer-btn:nth-child(1){animation-delay:.04s}.answer-grid .answer-btn:nth-child(2){animation-delay:.09s}.answer-grid .answer-btn:nth-child(3){animation-delay:.14s}.answer-grid .answer-btn:nth-child(4){animation-delay:.19s}.answer-grid .answer-btn:nth-child(5){animation-delay:.24s}
@keyframes progressDraw{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes answerReveal{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:translateX(0)}}
