:root{color:#21231f;font-synthesis:none;text-rendering:optimizelegibility;background:#f6f4ee;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{background:#f6f4ee;min-width:320px;min-height:100vh;margin:0}button{font:inherit}.app-shell{min-height:100vh;padding:24px 16px}.welcome-shell,.quiz-shell{place-items:center;display:grid}.welcome-card,.quiz-card{background:#ffffffeb;border:1px solid #21231f14;border-radius:28px;width:min(100%,720px);box-shadow:0 18px 60px #21231f14}.welcome-card{text-align:center;padding:34px}.quiz-card{padding:28px}.brand-badge{letter-spacing:.02em;color:#405c46;background:#e9f0e9;border-radius:999px;align-items:center;gap:8px;padding:9px 13px;font-size:14px;font-weight:800;display:inline-flex}.hero-icon{background:#fff1cf;border-radius:30px;place-items:center;width:108px;height:108px;margin:30px auto 18px;font-size:62px;display:grid;transform:rotate(-2deg)}h1{letter-spacing:-.045em;margin:0;font-size:clamp(34px,7vw,56px);line-height:1.02}.lead{color:#60645c;max-width:560px;margin:20px auto 0;font-size:17px;line-height:1.65}.feature-list{text-align:left;grid-template-columns:repeat(3,1fr);gap:10px;margin:28px 0;display:grid}.feature-list>div{background:#fcfbf7;border:1px solid #eceae2;border-radius:16px;align-items:center;gap:10px;min-height:68px;padding:14px;font-size:14px;font-weight:650;display:flex}.feature-list svg{color:#5c7b62;flex:none}.primary-btn,.secondary-btn,.back-btn{cursor:pointer;border:0;transition:transform .15s,box-shadow .15s,background .15s}.primary-btn{color:#fff;background:#263b2b;border-radius:16px;justify-content:center;align-items:center;gap:10px;min-height:54px;padding:0 24px;font-weight:800;display:inline-flex;box-shadow:0 10px 26px #263b2b2e}.primary-btn:hover{transform:translateY(-1px)}.fine-print{color:#898d84;max-width:570px;margin:20px auto 0;font-size:12px;line-height:1.5}.quiz-top{gap:22px;display:grid}.progress-wrap{width:100%}.progress-row{color:#6b6e67;justify-content:space-between;margin-bottom:8px;font-size:13px;font-weight:700;display:flex}.progress-track{background:#ece9df;border-radius:999px;height:9px;overflow:hidden}.progress-bar{border-radius:inherit;background:#5c7b62;height:100%;transition:width .3s}.question-block{margin:42px 0 24px}.question-block h1{font-size:clamp(31px,6vw,48px)}.question-block p{color:#70736d;margin:12px 0 0;line-height:1.5}.options-grid{gap:12px;display:grid}.option-card{text-align:left;color:#282a26;cursor:pointer;background:#fff;border:1.5px solid #e5e3da;border-radius:18px;grid-template-columns:52px 1fr 26px;align-items:center;gap:12px;width:100%;min-height:72px;padding:10px 16px 10px 10px;transition:border-color .15s,transform .15s,box-shadow .15s,background .15s;display:grid}.option-card:hover{border-color:#9fb1a2;transform:translateY(-1px);box-shadow:0 8px 20px #21231f0f}.option-card.selected{background:#f3f7f3;border-color:#5c7b62}.option-icon{background:#f7f4ec;border-radius:14px;place-items:center;width:52px;height:52px;font-size:28px;display:grid}.option-text{font-weight:760}.option-check{color:#4f6f56;place-items:center;display:grid}.quiz-footer{color:#92958d;justify-content:space-between;align-items:center;gap:20px;margin-top:24px;font-size:12px;display:flex}.back-btn{color:#575b54;background:0 0;align-items:center;gap:7px;padding:8px 4px;font-weight:750;display:inline-flex}.back-btn:disabled{opacity:.3;cursor:default}.results-shell{max-width:980px;margin:0 auto}.results-head{padding:28px 4px 18px}.results-head h1{margin-top:22px}.results-head p{color:#6c7068;font-size:17px}.results-list{gap:16px;display:grid}.result-card{background:#fff;border:1px solid #e7e4dc;border-radius:24px;grid-template-columns:86px 1fr;gap:18px;padding:22px;display:grid;position:relative;box-shadow:0 12px 30px #21231f0d}.rank-pill{color:#fff;background:#263b2b;border-radius:999px;padding:6px 9px;font-size:12px;font-weight:850;position:absolute;top:14px;left:14px}.dog-avatar{background:#fff2d5;border-radius:24px;place-items:center;width:86px;height:86px;margin-top:20px;font-size:50px;display:grid}.result-title-row{justify-content:space-between;gap:18px;display:flex}.result-title-row h2{letter-spacing:-.03em;margin:0;font-size:26px}.result-title-row p{color:#6b6e68;margin:8px 0 0;line-height:1.5}.score-circle{color:#35513b;background:#edf4ed;border-radius:50%;flex:none;align-content:center;place-items:center;width:78px;height:78px;display:grid}.score-circle strong{font-size:21px}.score-circle span{text-transform:uppercase;letter-spacing:.08em;font-size:10px;font-weight:800}.reasons{flex-wrap:wrap;gap:8px;margin-top:16px;display:flex}.reasons span{color:#4f6553;background:#f4f7f2;border-radius:999px;align-items:center;gap:5px;padding:7px 10px;font-size:12px;font-weight:700;display:inline-flex}.traits-grid{grid-template-columns:1fr 1fr;gap:14px 24px;margin-top:20px;display:grid}.match-label{color:#6f736b;justify-content:space-between;margin-bottom:6px;font-size:12px;display:flex}.match-label strong{color:#32352f}.mini-track{background:#efede7;border-radius:999px;height:7px;overflow:hidden}.mini-fill{border-radius:inherit;background:#6c866f;height:100%}.secondary-btn{color:#3e433c;background:#fff;border:1px solid #d9d6cc;border-radius:14px;justify-content:center;align-items:center;gap:8px;padding:13px 17px;font-weight:800;display:inline-flex}.restart{margin:22px 0 40px}@media (width<=640px){.app-shell{padding:0}.welcome-card,.quiz-card{min-height:100vh;box-shadow:none;border:0;border-radius:0;padding:24px 18px}.welcome-card{flex-direction:column;justify-content:center;display:flex}.feature-list{grid-template-columns:1fr}.feature-list>div{min-height:58px}.primary-btn{width:100%}.question-block{margin-top:34px}.quiz-footer{align-items:flex-start}.quiz-footer>span{text-align:right;max-width:150px}.results-shell{padding:18px 12px 30px}.results-head{padding:16px 4px}.result-card{border-radius:20px;grid-template-columns:64px 1fr;gap:12px;padding:16px}.dog-avatar{border-radius:18px;width:64px;height:64px;font-size:38px}.result-title-row{display:block}.score-circle{border-radius:12px;gap:6px;width:auto;height:auto;margin-top:12px;padding:8px 10px;display:inline-flex}.score-circle strong{font-size:17px}.traits-grid{grid-template-columns:1fr}.result-title-row h2{font-size:22px}.restart{width:100%}}