:root{--bg:#FBF3EC;--bg2:#F5E9DF;--card:#FFFFFF;--card2:#FFF6EF;--line:rgba(59,18,32,.12);--ink:#3B1220;--mut:#976E7B;--coral:#EA4B52;--coralink:#FFF6F3;--lime:#C6D94E;--limedk:#8AA017;--purple:#9B7BF0;--amber:#F0A35E;--amberdk:#C47A2B;--r:26px;font-size:16px}
*{margin:0;box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:'Inter',system-ui,sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased}
h1,h2,h3,.brand,.btn,.stat b{font-family:'Poppins',sans-serif}
.mono,.kick,.topic,.qnum,.p,.opt .ltr{font-family:'IBM Plex Mono',monospace}
.wrap{max-width:1180px;margin:0 auto;padding:0 28px}
@keyframes rise{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}
.rev{animation:rise .7s cubic-bezier(.16,1,.3,1) both}
.rev:nth-child(2){animation-delay:.08s}.rev:nth-child(3){animation-delay:.16s}.rev:nth-child(4){animation-delay:.24s}
@keyframes pulse{0%,100%{opacity:.55}50%{opacity:1}}
.topnav{position:sticky;top:0;z-index:10;background:rgba(251,243,236,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.topnav .wrap{display:flex;align-items:center;gap:14px;padding:16px 28px}
.brand{font-weight:700;font-size:19px;letter-spacing:.02em;display:flex;align-items:center;gap:10px}
.mark{width:30px;height:30px;border-radius:10px;background:var(--coral);display:grid;place-items:center;color:#fff;font-family:'Poppins';font-weight:700;font-size:15px}
.navlinks{display:flex;gap:8px;margin-left:18px}
.navlinks a{color:var(--mut);text-decoration:none;font-size:13.5px;font-weight:600;padding:8px 16px;border-radius:999px;transition:all .15s}
.navlinks a.on{background:#F3E2D6;color:var(--ink)}
.avatar{margin-left:auto;width:38px;height:38px;border-radius:14px;background:var(--purple);color:#fff;display:grid;place-items:center;font-weight:700;font-family:'Poppins';font-size:15px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-weight:600;font-size:14.5px;padding:14px 26px;border-radius:999px;border:0;background:var(--coral);color:var(--coralink);text-decoration:none;cursor:pointer;box-shadow:0 4px 0 #C13640;transition:transform .18s ease,box-shadow .18s ease}
.btn:hover{transform:translateY(-2px);box-shadow:0 6px 0 #C13640}
.btn:active{transform:translateY(1px);box-shadow:0 2px 0 #C13640}
.btn.ghost{background:var(--card);color:var(--ink);border:2px solid var(--line);box-shadow:0 4px 0 rgba(59,18,32,.09)}
.btn.sm{padding:10px 18px;font-size:13px}
.hero{padding-top:34px;padding-bottom:8px}
.kick{font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--mut);margin-bottom:12px}
.hero h1{font-size:clamp(34px,4.6vw,56px);font-weight:700;letter-spacing:-.01em;line-height:1.08}
.hero p.sub{margin:14px 0 24px;font-size:16px;color:var(--mut);max-width:520px}
.herogrid{display:grid;grid-template-columns:1.15fr .85fr;gap:22px;align-items:stretch}
.artcard{background:radial-gradient(130% 100% at 70% 0%,#FBE0D7 0%,#FDF1E9 58%);border:2px solid var(--line);box-shadow:0 6px 0 rgba(59,18,32,.06);border-radius:32px;padding:22px;display:flex;align-items:center;justify-content:center;min-height:300px;overflow:hidden;position:relative}
.chips{display:flex;gap:9px;flex-wrap:wrap;margin-top:26px}
.chip{font-size:12.5px;font-weight:600;padding:9px 16px;border-radius:999px;border:1.5px solid var(--line);background:var(--card);color:var(--mut);cursor:pointer;transition:all .15s}
.chip:hover{color:var(--ink)}
.chip.on{background:var(--ink);color:#FBF3EC;border-color:var(--ink)}
.secttl{display:flex;justify-content:space-between;align-items:center;margin:34px 0 16px}
.secttl h2{font-size:20px;font-weight:600}
.secttl span{font-size:12.5px;color:var(--mut)}
.topics{display:grid;grid-auto-flow:column;grid-auto-columns:150px;gap:14px;overflow-x:auto;padding-bottom:8px;scrollbar-width:none}
.topiccard{background:var(--card);border:2px solid var(--line);box-shadow:0 4px 0 rgba(59,18,32,.05);border-radius:22px;padding:18px 16px;transition:transform .18s ease}
.topiccard:hover{transform:translateY(-3px)}
.sq{width:44px;height:44px;border-radius:15px;display:grid;place-items:center;margin-bottom:12px}
.sq svg{display:block}
.topiccard b{display:block;font-size:13.5px;font-weight:600;margin-bottom:2px}
.topiccard span{font-size:11.5px;color:var(--mut)}
.modes{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:26px 0 40px}
.modecard{background:var(--card);border:2px solid var(--line);box-shadow:0 5px 0 rgba(59,18,32,.05);border-radius:var(--r);padding:26px;transition:transform .2s ease}
.modecard:hover{transform:translateY(-3px)}
.modecard h3{font-size:20px;font-weight:600;margin:14px 0 8px}
.modecard p{color:var(--mut);font-size:14px;margin-bottom:20px}
.modeic{width:46px;height:46px;border-radius:16px;display:grid;place-items:center}
.modefoot{display:flex;align-items:center;gap:14px}
.dedup{font-size:12px;color:var(--limedk);font-weight:600}
.ringwrap{display:flex;align-items:center;gap:24px}
.ring{width:130px;height:130px;border-radius:50%;background:conic-gradient(var(--coral) 0 68%,var(--lime) 68% 84%,rgba(59,18,32,.1) 84% 100%);display:grid;place-items:center;flex:none}
.ring i{width:98px;height:98px;border-radius:50%;background:#fff;display:grid;place-content:center;text-align:center;font-style:normal}
.ring b{font-family:'Poppins';font-size:24px;display:block;line-height:1.1}
.ring span{font-size:10.5px;color:var(--mut)}
.statrow{display:flex;gap:14px;margin-top:26px;flex-wrap:wrap}
.stat{flex:1;min-width:130px;background:var(--card);border:2px solid var(--line);box-shadow:0 4px 0 rgba(59,18,32,.05);border-radius:20px;padding:16px 18px;display:flex;align-items:center;gap:13px}
.sq.s{width:38px;height:38px;border-radius:13px;margin:0;flex:none}
.stat b{font-size:17px;display:block}
.stat span{font-size:11px;color:var(--mut)}
.note{padding:16px 0 90px;font-size:12.5px;color:var(--mut)}
.pagehead{padding-top:36px;padding-bottom:20px}
.pagehead h2{font-size:30px;font-weight:600}
.pagehead p{color:var(--mut);margin-top:6px;font-size:14.5px}
.toolbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:22px}
.search{flex:1;min-width:230px;display:flex;align-items:center;gap:10px;background:var(--card);border:2px solid var(--line);border-radius:999px;padding:13px 18px;color:var(--mut);font-size:14px}
.qgrid{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding-bottom:44px}
.qcard{background:var(--card);border:2px solid var(--line);box-shadow:0 5px 0 rgba(59,18,32,.05);border-radius:var(--r);padding:24px}
.qmeta{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px}
.topic{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:#4F5A12;background:var(--lime);box-shadow:0 2px 0 rgba(79,90,18,.35);padding:5px 12px;border-radius:999px;font-weight:600}
.qnum{font-size:11.5px;color:var(--mut)}
.qtext{font-family:'Poppins';font-size:16px;font-weight:500;margin-bottom:16px;line-height:1.5}
.opts{display:flex;flex-direction:column;gap:9px}
.opt{display:flex;align-items:center;gap:12px;padding:13px 16px;border:2px solid rgba(59,18,32,.16);border-radius:17px;font-size:14.5px;background:#FFFBF8;text-align:left;width:100%;color:var(--ink);font-family:inherit;cursor:pointer;transition:all .15s}
button.opt:hover{border-color:var(--mut)}
.opt .ltr{font-size:11px;color:var(--mut);flex:none;width:14px}
.opt .otext{flex:1}
.opt.ok{border-color:#B7CC3F;background:rgba(198,217,78,.18)}
.opt.ok .ltr{color:var(--limedk);font-weight:700}
.opt .tick{color:var(--limedk);display:grid;place-items:center}
.oktag{font-family:'IBM Plex Mono';font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--limedk)}
.why{margin-top:13px;padding:12px 15px;background:#FAEDE4;border-radius:14px;font-size:13px;color:var(--mut);display:flex;gap:10px}
.whylabel{font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--amberdk);flex:none;padding-top:2px;font-family:'IBM Plex Mono'}
.opt.sel{border-color:var(--coral);background:rgba(234,75,82,.08)}
.radio{width:19px;height:19px;border-radius:50%;border:2px solid rgba(59,18,32,.38);flex:none;position:relative}
.opt.sel .radio{border-color:var(--coral)}
.opt.sel .radio::after{content:'';position:absolute;inset:3.5px;border-radius:50%;background:var(--coral)}
.testgrid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:20px;align-items:start;padding-bottom:40px}
.progstrip{display:flex;align-items:center;gap:16px;margin-bottom:18px;font-size:13px;color:var(--mut)}
.progstrip b{color:var(--ink)}
.pbar{flex:1;height:8px;border-radius:99px;background:rgba(59,18,32,.1);overflow:hidden}
.pbar i{display:block;height:100%;width:74%;background:var(--coral);border-radius:99px;transition:width .5s cubic-bezier(.16,1,.3,1)}
.qactions{display:flex;gap:10px;margin-top:20px;align-items:center;flex-wrap:wrap}
.flagbtn{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:600;color:#8A5B68;background:var(--card);border:2px solid rgba(59,18,32,.2);border-radius:999px;padding:10px 17px;cursor:pointer;transition:all .15s}
.flagbtn:hover{color:var(--amberdk);border-color:var(--amberdk)}
.side .panel{background:var(--card);border:2px solid var(--line);box-shadow:0 5px 0 rgba(59,18,32,.05);border-radius:var(--r);padding:20px;margin-bottom:16px}
.panel h4{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--mut);margin-bottom:14px;font-weight:600}
.palette{display:grid;grid-template-columns:repeat(6,1fr);gap:7px}
.p{aspect-ratio:1;display:grid;place-items:center;font-size:11.5px;border:1.5px solid var(--line);border-radius:13px;color:var(--mut);background:#FFFBF8;position:relative}
.p.ans{background:var(--coral);color:#fff;border-color:var(--coral)}
.p.flg::after{content:'';position:absolute;top:5px;right:5px;width:6px;height:6px;border-radius:50%;background:var(--amber)}
.p.cur{outline:2px solid var(--limedk);outline-offset:2px;color:var(--limedk);border-color:var(--limedk);font-weight:700}
.legend{display:flex;gap:13px;flex-wrap:wrap;margin-top:14px;font-size:11px;color:var(--mut)}
.lg{display:flex;align-items:center;gap:6px}
.lg i{width:10px;height:10px;border-radius:4px;background:var(--coral)}
.lg.g i{background:#fff;border:1.5px solid var(--line)}
.lg.a i{background:var(--amber);border-radius:50%}
.resline{display:flex;justify-content:space-between;font-size:13.5px;padding:9px 0;border-bottom:1px dashed var(--line);color:var(--mut)}
.resline b{color:var(--ink)}
.bottomnav{display:none}
@media(max-width:860px){
 .navlinks{display:none}
 .hero{padding-top:22px;padding-bottom:4px}
 .herogrid{grid-template-columns:1fr}
 .artcard{min-height:230px;order:-1}
 .modes{grid-template-columns:1fr}
 .qgrid{grid-template-columns:1fr}
 .testgrid{grid-template-columns:1fr}
 .bottomnav{display:flex;position:fixed;left:14px;right:14px;bottom:14px;z-index:20;background:rgba(255,255,255,.97);backdrop-filter:blur(14px);border:2px solid var(--line);box-shadow:0 6px 0 rgba(59,18,32,.08);border-radius:24px;padding:10px;gap:6px}
 .bottomnav a{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px;border-radius:16px;color:var(--mut);text-decoration:none;font-size:10.5px;font-weight:600}
 .bottomnav a.on{background:var(--coral);color:#fff}
 .note{padding-bottom:120px}
 .pagehead{padding-top:20px !important;padding-bottom:10px !important}
 .pagehead h2{font-size:23px !important}
 .progstrip{margin-bottom:12px;font-size:12px;gap:10px;flex-wrap:wrap}
 .qcard{padding:18px !important}
 .qmeta{margin-bottom:10px}
 .qtext{font-size:15px !important;margin-bottom:12px}
 .opts{gap:8px}
 .opt{padding:11px 14px;font-size:14px}
 .qactions{margin-top:14px}
 .qactions .btn:last-child{flex:1 1 100%;justify-content:center}
 .testgrid{padding-bottom:120px}
 .qgrid{padding-bottom:120px}
}

body{overflow-x:clip}
@keyframes halo{0%,100%{opacity:.12}50%{opacity:.45}}
.stage{position:relative;height:470px}
.stagecard{position:absolute;left:26px;right:2px;top:96px;bottom:2px;border-radius:38px;background:radial-gradient(120% 90% at 78% 8%,#F5D3F0 0%,transparent 42%),radial-gradient(130% 100% at 18% 90%,#FBD9C4 0%,transparent 50%),linear-gradient(160deg,#FCE6DC 0%,#F8D8D2 48%,#EFD8F2 100%);border:2px solid rgba(255,255,255,.75);box-shadow:0 24px 48px -18px rgba(59,18,32,.3),inset 0 2px 0 rgba(255,255,255,.6)}
.stagecard.back{left:-2px;right:34px;top:112px;bottom:16px;transform:rotate(-4.5deg);background:linear-gradient(160deg,#F6E3D9,#EDD7E4);border-color:rgba(255,255,255,.6);box-shadow:0 14px 30px -14px rgba(59,18,32,.22);z-index:-1}
.sculpt{position:absolute;left:50%;transform:translateX(-50%);top:-46px;width:410px;height:400px}
.fbadge{position:absolute;display:grid;place-items:center;border-radius:50%;box-shadow:0 12px 24px -8px rgba(59,18,32,.3)}
.b1{width:62px;height:62px;background:#fff;top:22px;right:44px;color:#3B1220}
.b2{width:52px;height:52px;background:var(--coral);top:170px;left:6px;color:#fff;box-shadow:0 12px 24px -8px rgba(193,54,64,.55)}
.b3{width:44px;height:44px;background:#3B1220;top:66px;left:62px;color:#fff}
.bpill{position:absolute;bottom:158px;right:10px;background:#fff;border-radius:999px;padding:10px 16px;display:flex;gap:8px;align-items:center;font-size:12px;font-weight:700;color:#4F5A12;box-shadow:0 12px 24px -10px rgba(59,18,32,.3);font-family:'Poppins'}
.ringstat{position:absolute;right:-14px;bottom:-14px;width:150px;height:150px}
@media(max-width:860px){
 .stage{height:344px;order:-1;margin:2px 0 12px}
 .sculpt{width:316px;top:-24px}
 .stagecard{left:8px;right:4px;top:78px;border-radius:30px}
 .stagecard.back{left:-4px;right:18px;top:92px}
 .b1{width:48px;height:48px;top:14px;right:20px}
 .b2{width:44px;height:44px;top:148px;left:0}
 .b3{width:36px;height:36px;top:54px;left:26px}
 .bpill{bottom:104px;right:2px;padding:8px 13px;font-size:11px}
 .ringstat{width:116px;height:116px;right:-6px;bottom:-8px}
}

.rrow{display:flex;align-items:baseline;gap:14px;padding:10px 2px;border-bottom:2px dashed var(--line)}
.rrow:last-child{border-bottom:none}
.rrow b{font-family:Poppins;font-size:18px;color:#EA4B52;min-width:56px}
.rdate{margin-left:auto;font-family:"IBM Plex Mono";font-size:11px;color:var(--mut)}