:root{font-family:system-ui,-apple-system,'Segoe UI','Noto Sans SC','Microsoft YaHei',sans-serif;color:#51412d;background:#fff8df;font-synthesis:none;font-weight:500;font-size:16px}*{box-sizing:border-box}body{margin:0;min-height:100svh;background:radial-gradient(ellipse at 9% 10%,#ffefb7 0,transparent 34%),radial-gradient(ellipse at 94% 86%,#ead7b8 0,transparent 32%),#fff9e8}.shell{width:min(100% - 28px,700px);margin:0 auto;padding:20px 0 24px}.topline{display:flex;align-items:center;justify-content:center;gap:9px;color:#9b8058;font-size:.82rem;margin:4px 0 16px;letter-spacing:.04em}.paw{font-size:1.05rem;color:#ad8b52}.doodle{font-size:1.2rem;color:#b99868}.card{position:relative;overflow:hidden;background:#fffdf5;border:2px solid #e9d7ad;border-radius:30px;padding:clamp(24px,6vw,46px);box-shadow:0 12px 35px #72552b14}.card:before,.card:after{content:'';position:absolute;pointer-events:none;border:1.5px dashed #cbb286;border-radius:50%;width:48px;height:28px;transform:rotate(-28deg);opacity:.8}.card:before{top:18px;right:24px}.card:after{bottom:19px;left:21px;transform:rotate(28deg)}.eyebrow{text-transform:uppercase;letter-spacing:.14em;color:#a8864f;font-weight:900;font-size:.76rem}.hero{text-align:center;padding:8px 0 12px}.dog{font-size:3.3rem;filter:drop-shadow(2px 3px 0 #f3e2b5);margin:4px 0 10px}h1{font-size:clamp(2rem,8vw,3.1rem);line-height:1.18;margin:8px auto 14px;letter-spacing:-.04em;color:#493a29}h2{font-size:clamp(1.35rem,5vw,1.85rem);line-height:1.4;margin:10px 0;color:#493a29}p{line-height:1.8;color:#71634f}.intro{max-width:510px;margin:0 auto 22px}.pillrow{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:17px auto 24px}.pill{border:1px solid #e8d8b5;background:#fff8e6;border-radius:999px;padding:7px 12px;font-size:.82rem;color:#806a46}.btn{border:0;border-radius:999px;padding:14px 24px;font:inherit;font-weight:800;cursor:pointer;transition:transform .15s,box-shadow .15s,background .15s;min-height:48px}.btn:hover{transform:translateY(-2px)}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.48;cursor:not-allowed;transform:none}.primary{background:#aa8550;color:#fffdf5;box-shadow:0 5px 0 #89683d}.primary:hover{background:#987543}.secondary{background:#f3e8c9;color:#755d37;border:1px solid #e5d3a8}.actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:23px}.quiz-head{display:flex;align-items:center;justify-content:space-between;color:#917a54;font-size:.86rem;font-weight:800;margin:0 0 10px}.progress{height:9px;background:#f2e9d0;border-radius:99px;overflow:hidden;margin-bottom:26px}.progress span{height:100%;display:block;background:repeating-linear-gradient(135deg,#b08d58,#b08d58 8px,#c3a675 8px,#c3a675 16px);border-radius:99px;transition:width .3s}.question{margin:0 0 20px}.options{display:grid;gap:11px}.option{display:flex;align-items:center;gap:13px;text-align:left;width:100%;border:1.5px solid #e6dbc1;border-radius:19px;background:#fffaf0;color:#554735;padding:14px 16px;min-height:62px;font:inherit;font-size:.98rem;line-height:1.55;font-weight:600;cursor:pointer;transition:.16s}.option:hover,.option:focus-visible{border-color:#b99b6b;background:#fff4d9;outline:none;transform:translateY(-1px)}.option.selected{border-color:#a68551;background:#f8edcf;box-shadow:0 0 0 2px #eadbb7}.letter{flex:none;width:29px;height:29px;border-radius:50%;display:grid;place-items:center;background:#f0e4c6;color:#826940;font-weight:900;font-size:.8rem}.navrow{display:flex;justify-content:space-between;margin-top:21px}.navrow .btn{padding:11px 17px;min-height:44px}.result-tag{display:inline-flex;border-radius:999px;padding:7px 12px;background:#f3e8c9;color:#82683e;font-weight:800;font-size:.85rem}.result-title{margin:12px 0 5px}.result-subtitle{margin:0;color:#9a7c4d;font-weight:700}.traits{display:grid;gap:13px;margin:24px 0 28px}.trait-line{display:grid;grid-template-columns:82px 1fr 43px;align-items:center;gap:10px;font-size:.87rem;color:#665640}.track{height:11px;border-radius:99px;background:#f1e9d7;overflow:hidden}.fill{height:100%;border-radius:99px;background:linear-gradient(90deg,#dfc38a,#a9824c)}.percent{text-align:right;font-weight:900;color:#816640;font-variant-numeric:tabular-nums}.reading{border-top:1px dashed #d8c49b;padding-top:17px}.reading h3{font-size:1.06rem;color:#79623f;margin:0 0 7px}.reading p{margin:0 0 10px;font-size:.95rem}.reading-block{padding:14px 0;border-bottom:1px dashed #e5d7b9}.reading-block:last-child{border-bottom:0}.reading-block h4{margin:0 0 5px;font-size:.96rem;color:#805f33}.reading-block p{margin:0}.share-note{text-align:center;font-size:.8rem;color:#92836a;margin-top:12px}.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#51412d;color:white;border-radius:999px;padding:11px 18px;box-shadow:0 6px 22px #0002;z-index:4}footer{text-align:center;padding:16px 10px 0;color:#948366;font-size:.75rem;line-height:1.6}.fineprint{font-size:.79rem;color:#96866a;margin:18px 0 0}@media(max-width:420px){.shell{width:min(100% - 18px,700px);padding-top:12px}.card{border-radius:25px;padding:23px 18px}.option{padding:12px;font-size:.91rem}.traits{gap:11px}.trait-line{grid-template-columns:70px 1fr 40px;gap:8px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}