:root{--ink:#35203f;--purple:#765780;--cream:#f7f0e8;--gold:#c7a873}*{box-sizing:border-box}html,body{height:100%;margin:0;overflow:hidden}body{color:var(--ink);background:var(--cream);font-family:Arial,Helvetica,sans-serif}button,a{font:inherit}button{cursor:pointer}em{font-family:Georgia,Times New Roman,serif;font-weight:400}.app{background:radial-gradient(circle at 50% 30%,#fff,#f7f0e8 68%,#eadff0);grid-template-rows:58px 1fr 76px;height:100svh;transition:background .35s;display:grid}.app.violet{background:linear-gradient(145deg,#f1e6f3,#d8c6df)}.app.blue{background:linear-gradient(145deg,#edf4f5,#d8e9ed)}.app.rose{background:linear-gradient(145deg,#faeeed,#ead9e7)}.app.dark{color:#fff;background:linear-gradient(145deg,#321b3b,#50375d)}.app.final{color:#fff;background:radial-gradient(circle at 50% 20%,#765780,#321b3b 75%)}.top{-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);z-index:5;background:#f7f0e8c9;border-bottom:1px solid #35203f18;align-items:center;gap:18px;padding:0 5vw;display:flex}.brand{color:var(--ink);letter-spacing:.18em;background:0 0;border:0;align-items:center;gap:8px;font-size:10px;font-weight:800;display:flex}.brand i{background:var(--gold);border-radius:50%;width:9px;height:9px}.progress{background:#35203f18;border-radius:9px;flex:1;max-width:500px;height:3px;margin:auto;overflow:hidden}.progress span{background:linear-gradient(90deg,var(--purple),var(--gold));height:100%;transition:width .3s;display:block}.top small{color:var(--purple);font-weight:700}.slide{align-items:center;padding:40px 24px 28px;display:grid;overflow-y:auto}.slide-in{width:min(900px,100%);margin:auto;animation:.35s enter}.kicker{text-transform:uppercase;letter-spacing:.2em;color:var(--purple);margin:0 0 24px;font-size:10px;font-weight:800}.dark .kicker,.final .kicker{color:#dfcae3}.slide h1{letter-spacing:-.045em;max-width:880px;margin:0 0 28px;font-size:clamp(42px,7vw,76px);line-height:.96}.slide h1 strong,.slide h1 em{color:var(--purple)}.dark h1 em,.final h1 em{color:#e4cce9}.content{max-width:820px}.subtitle,.intro{max-width:760px;font-size:clamp(18px,2.2vw,23px);line-height:1.5}.content blockquote,.big{border-left:2px solid var(--gold);max-width:720px;margin:26px 0;padding-left:20px;font:italic clamp(23px,3vw,34px)/1.3 Georgia,serif}.chips{grid-template-columns:repeat(3,1fr);gap:9px;display:grid}.chips span{background:#ffffff9c;border-radius:15px;padding:15px;font-weight:700}.question{background:#ffffffc2;border:1px solid #35203f18;border-radius:24px;max-width:680px;margin:25px 0;padding:20px;box-shadow:0 15px 45px #35203f12}.question h3{margin:0 0 13px;font-size:17px}.choices button{width:100%;color:var(--ink);text-align:left;background:#ffffffa8;border:1px solid #35203f1d;border-radius:13px;justify-content:space-between;margin-top:7px;padding:13px 15px;display:flex}.choices button.on{border-color:var(--purple);background:#eee4f1;font-weight:700}.mini-scale{grid-template-columns:repeat(5,1fr);gap:8px;margin:30px 0;display:grid}.mini-scale span{color:#fff;text-align:center;border-radius:18px;padding:24px 8px;font-weight:800}.promise,.insight,.disclaimer{border-left:4px solid var(--gold);background:#fff9;border-radius:19px;max-width:760px;padding:19px 21px;line-height:1.5}.promise p{margin:7px 0 0}.ph-badge{text-align:center;background:#ffffffb8;border-radius:50%;place-content:center;width:125px;height:125px;margin-bottom:24px;display:grid;box-shadow:0 15px 40px #35203f14}.ph-badge small{letter-spacing:.15em}.ph-badge b{font-size:28px}.ph-badge span{text-transform:uppercase;font-size:9px}.warning{color:#fff;background:#4b294f;border-radius:99px;padding:9px 15px;font-size:12px;font-weight:800;display:inline-block}.wrong{color:#a33a50;font-weight:700}.correct{color:#275338;background:#e3f0e5;border-radius:12px;padding:13px;font-weight:700}.cycle{flex-wrap:wrap;gap:9px;margin:24px 0;display:flex}.cycle span{background:#eee3f0;border-radius:99px;padding:12px 15px;font-weight:700}.water-list{grid-template-columns:repeat(5,1fr);gap:8px;margin:28px 0;display:grid}.water-list div{background:#ffffff12;border:1px solid #ffffff2c;border-radius:17px;padding:18px 12px}.water-list b,.water-list span{display:block}.water-list span{color:#e5dce6;margin-top:8px;font-size:12px}.dark .disclaimer{background:#ffffff10}.roads{grid-template-columns:1fr 1fr;gap:12px;margin:25px 0;display:grid}.roads div{background:#ffffff82;border-radius:20px;padding:24px}.roads b,.roads span{display:block}.roads b{margin-bottom:8px;font-size:24px}.paths{grid-template-columns:1fr 1fr;gap:10px;display:grid}.paths button{text-align:left;color:#fff;background:#ffffff10;border:1px solid #ffffff35;border-radius:18px;min-height:105px;padding:18px 42px 18px 18px;position:relative}.paths button.on{background:#ffffff25;border-color:#ead3ee}.paths b,.paths span{display:block}.paths b{margin-bottom:6px;font-size:17px}.paths span{color:#dfd0e1;font-size:12px}.paths i{position:absolute;top:17px;right:17px}.primary{color:var(--ink);text-transform:uppercase;background:#fff;border-radius:14px;margin-top:20px;padding:16px 22px;font-weight:800;text-decoration:none;display:inline-block}.nav{-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);background:#f7f0e8e8;border-top:1px solid #35203f18;justify-content:space-between;align-items:center;gap:12px;padding:0 5vw;display:flex}.nav button{border-radius:13px;padding:14px 18px;font-weight:800}.back{color:var(--ink);background:0 0;border:1px solid #35203f24}.next{background:linear-gradient(135deg,#3c174c,var(--purple));color:#fff;border:0;min-width:190px}.nav button:disabled{opacity:.35;cursor:not-allowed}.next:disabled{background:#8d828f}@keyframes enter{0%{opacity:0;transform:translate(18px)}to{opacity:1;transform:none}}@media (width<=650px){.top{padding:0 15px}.brand{font-size:8px}.slide{align-items:start;padding:30px 17px 20px}.slide h1{font-size:clamp(38px,11vw,56px)}.chips{grid-template-columns:1fr 1fr}.mini-scale{grid-template-columns:1fr}.mini-scale span{padding:12px}.water-list{grid-template-columns:1fr 1fr}.roads,.paths{grid-template-columns:1fr}.nav{padding:0 15px}.nav button{padding:13px 15px}.next{min-width:165px}.question{padding:16px}.content blockquote{font-size:22px}}@media (prefers-reduced-motion:reduce){.slide-in{animation:none}}