.kl-quiz{padding:var(--kl-space-9) 0;background:linear-gradient(160deg,var(--kl-color-surface) 0%,var(--kl-color-surface-soft) 100%);border-top:1px solid var(--kl-color-line);overflow-x:clip}.kl-quiz .quiz-intro{max-width:640px;margin-bottom:var(--kl-space-8)}.kl-quiz .quiz-intro h2{font-family:var(--kl-font-display);font-size:var(--kl-type-display);color:var(--kl-color-wordmark);line-height:var(--kl-leading-tight);margin-bottom:var(--kl-space-4)}.kl-quiz .quiz-intro p{font-size:var(--kl-type-body-lg);color:var(--kl-color-muted);margin-bottom:var(--kl-space-6)}.kl-quiz .quiz-intro-actions{display:flex;gap:var(--kl-space-3);flex-wrap:wrap}.kl-quiz .quiz-layout{display:grid;grid-template-columns:1fr;gap:var(--kl-space-5);align-items:start;max-width:680px}.kl-quiz .quiz-card{padding:var(--kl-space-6);border-radius:var(--kl-radius-xl);background:var(--kl-color-surface);border:1px solid var(--kl-color-line);box-shadow:var(--kl-shadow-lg);min-height:480px;min-width:0}.kl-quiz .quiz-card [hidden]{display:none!important}.kl-quiz .quiz-card[data-quiz-state=result]{min-height:0}.kl-quiz .quiz-progress-row{display:flex;align-items:center;justify-content:space-between;gap:var(--kl-space-3);margin-bottom:var(--kl-space-5)}.kl-quiz .quiz-step-label{font-size:var(--kl-type-body-sm);font-weight:var(--kl-weight-bold);color:var(--kl-color-muted)}.kl-quiz .quiz-progress-track{flex:1;height:var(--kl-space-2);border-radius:var(--kl-radius-full);background:var(--kl-color-surface-soft);overflow:hidden}.kl-quiz .quiz-progress-fill{height:100%;width:25%;border-radius:inherit;background:var(--kl-color-roast);transition:width var(--kl-duration-base) var(--kl-ease-standard)}.kl-quiz .quiz-question{font-family:var(--kl-font-display);font-size:var(--kl-type-h2);color:var(--kl-color-wordmark);line-height:var(--kl-leading-heading);margin-bottom:var(--kl-space-6)}.kl-quiz .quiz-options{display:grid;gap:var(--kl-space-3)}.kl-quiz .quiz-option{display:flex;align-items:center;gap:var(--kl-space-3);min-height:calc(var(--kl-space-8) - var(--kl-space-2));padding:var(--kl-space-3) var(--kl-space-4);border:1px solid var(--kl-color-line);border-radius:var(--kl-radius-md);background:var(--kl-color-surface);cursor:pointer;font-size:var(--kl-type-body-sm);font-weight:var(--kl-weight-semibold);color:var(--kl-color-ink);transition:background var(--kl-duration-fast),border-color var(--kl-duration-fast),transform var(--kl-duration-fast);text-align:left;width:100%;font-family:var(--kl-font-sans)}.kl-quiz .quiz-option:hover{background:var(--kl-color-roast-soft);border-color:var(--kl-color-roast);transform:translate(var(--kl-space-1))}.kl-quiz .quiz-option:focus-visible{outline:var(--kl-focus-ring);outline-offset:var(--kl-space-1)}.kl-quiz .quiz-option.is-selected{background:var(--kl-color-roast-soft);border-color:var(--kl-color-roast);color:var(--kl-color-roast)}.kl-quiz .quiz-option.is-selected .quiz-option-key{background:var(--kl-color-roast);color:var(--kl-color-white)}.kl-quiz .quiz-option-key{display:grid;place-items:center;width:var(--kl-space-6);height:var(--kl-space-6);border-radius:var(--kl-radius-full);background:var(--kl-color-surface-soft);color:var(--kl-color-wordmark);font-size:var(--kl-type-label);font-weight:var(--kl-weight-bold);flex-shrink:0}.kl-quiz .quiz-nav-row{display:flex;align-items:center;justify-content:space-between;gap:var(--kl-space-3);margin-top:var(--kl-space-5)}.kl-quiz .quiz-back,.kl-quiz .quiz-restart{-webkit-appearance:none;appearance:none;cursor:pointer;border-radius:var(--kl-radius-full);min-height:calc(var(--kl-space-6) + var(--kl-space-3));padding:var(--kl-space-2) var(--kl-space-4);font-family:inherit;font-size:var(--kl-type-body-sm);font-weight:var(--kl-weight-semibold);transition:background var(--kl-duration-fast),color var(--kl-duration-fast),border-color var(--kl-duration-fast)}.kl-quiz .quiz-back{background:transparent;color:var(--kl-color-muted);border:1px solid var(--kl-color-line)}.kl-quiz .quiz-back:hover{background:var(--kl-color-surface-soft);color:var(--kl-color-wordmark)}.kl-quiz .quiz-back[disabled]{opacity:.4;cursor:not-allowed}.kl-quiz .quiz-restart{background:var(--kl-color-roast);color:var(--kl-color-white);border:none}.kl-quiz .quiz-restart:hover{background:var(--kl-color-roast-hover)}.kl-quiz .see-all{display:inline-flex;align-items:center;gap:6px;font-size:var(--kl-type-body-sm);font-weight:var(--kl-weight-semibold);color:var(--kl-color-roast);white-space:nowrap;transition:gap var(--kl-duration-fast)}.kl-quiz .see-all:hover{gap:10px}.kl-quiz .see-all svg{width:16px;height:16px}.kl-quiz .see-all:focus-visible{outline:var(--kl-focus-ring);outline-offset:var(--kl-space-1)}.kl-quiz .quiz-rail{display:grid;gap:var(--kl-space-3)}.kl-quiz .quiz-mini-prod{padding:var(--kl-space-3);border:1px solid var(--kl-color-line);border-radius:var(--kl-radius-md);background:var(--kl-color-surface);box-shadow:var(--kl-shadow-sm)}.kl-quiz .quiz-mini-img{aspect-ratio:4 / 3;border-radius:var(--kl-radius-sm);background:var(--kl-color-surface-soft);overflow:hidden;margin-bottom:var(--kl-space-2)}.kl-quiz .quiz-mini-img img,.kl-quiz .quiz-mini-img .kl-placeholder-svg{width:100%;height:100%;object-fit:contain;padding:var(--kl-space-2)}.kl-quiz .quiz-mini-prod strong{display:block;font-size:var(--kl-type-body-sm);font-weight:var(--kl-weight-semibold);color:var(--kl-color-wordmark);line-height:var(--kl-leading-heading)}.kl-quiz .quiz-mini-prod span{font-size:var(--kl-type-label);color:var(--kl-color-muted)}.kl-quiz .quiz-stepper{display:flex;align-items:center;gap:var(--kl-space-3);list-style:none;margin:var(--kl-space-6) 0 0;padding:0}.kl-quiz .quiz-stepper__dot{position:relative;display:grid;place-items:center;width:var(--kl-space-6);height:var(--kl-space-6);flex:none;border-radius:var(--kl-radius-full);border:1px solid var(--kl-color-line);background:var(--kl-color-surface);color:var(--kl-color-muted);font-size:var(--kl-type-body-sm);font-weight:var(--kl-weight-bold);transition:background var(--kl-duration-fast),border-color var(--kl-duration-fast),color var(--kl-duration-fast)}.kl-quiz .quiz-stepper__dot:not(:last-child):after{content:"";position:absolute;left:100%;top:50%;width:var(--kl-space-3);height:2px;transform:translateY(-50%);background:var(--kl-color-line)}.kl-quiz .quiz-stepper__num{line-height:1}.kl-quiz .quiz-stepper__dot svg{display:none;width:14px;height:14px}.kl-quiz [data-quiz-step-card][data-quiz-step-status=current]{border-color:var(--kl-color-roast);color:var(--kl-color-roast);background:var(--kl-color-roast-soft);box-shadow:0 0 0 1px var(--kl-color-roast) inset}.kl-quiz [data-quiz-step-card][data-quiz-step-status=done]{border-color:var(--kl-color-roast);background:var(--kl-color-roast);color:var(--kl-color-white)}.kl-quiz [data-quiz-step-card][data-quiz-step-status=done] .quiz-stepper__num{display:none}.kl-quiz [data-quiz-step-card][data-quiz-step-status=done] svg{display:block}.kl-quiz [data-quiz-step-card][data-quiz-step-status=done]:after{background:var(--kl-color-roast)}.kl-quiz .quiz-result[hidden]{display:none}.kl-quiz .quiz-result:not([hidden]){display:grid;gap:var(--kl-space-5)}.kl-quiz .quiz-result__head{display:flex;align-items:center;gap:var(--kl-space-2);color:var(--kl-color-olive);font-size:var(--kl-type-label);font-weight:var(--kl-weight-bold);text-transform:uppercase;letter-spacing:.08em}.kl-quiz .quiz-result__head svg{width:18px;height:18px}.kl-quiz .quiz-result__title{font-family:var(--kl-font-display);font-size:var(--kl-type-h2);line-height:var(--kl-leading-heading);color:var(--kl-color-wordmark);margin:0}.kl-quiz a.quiz-result__product{display:flex;align-items:center;gap:var(--kl-space-4);padding:var(--kl-space-4);border:1px solid var(--kl-color-line);border-radius:var(--kl-radius-lg);background:var(--kl-gradient-warm);box-shadow:var(--kl-shadow-sm);min-width:0;text-decoration:none;transition:box-shadow var(--kl-duration-fast),transform var(--kl-duration-fast)}.kl-quiz a.quiz-result__product:hover{box-shadow:var(--kl-shadow-md);transform:translateY(-2px)}.kl-quiz .quiz-result__product img{width:calc(var(--kl-space-8) + var(--kl-space-6));height:calc(var(--kl-space-8) + var(--kl-space-6));flex-shrink:0;object-fit:contain;background:var(--kl-color-surface-soft);border:1px solid var(--kl-color-line);border-radius:var(--kl-radius-md);padding:var(--kl-space-2);aspect-ratio:1 / 1}.kl-quiz .quiz-result__product-name{font-size:var(--kl-type-body-lg);font-weight:var(--kl-weight-semibold);color:var(--kl-color-wordmark);margin:0 0 4px}.kl-quiz .quiz-result__product-sub{font-size:var(--kl-type-body-sm);color:var(--kl-color-muted);margin:0 0 8px}.kl-quiz .quiz-result__product-cta{font-size:var(--kl-type-body-sm);font-weight:var(--kl-weight-semibold);color:var(--kl-color-roast)}.kl-quiz .quiz-result__why{font-size:var(--kl-type-body);line-height:var(--kl-leading-body);color:var(--kl-color-wordmark);margin:0;padding:var(--kl-space-4);border-left:var(--kl-space-1) solid var(--kl-color-roast);border-radius:var(--kl-radius-md);background:var(--kl-color-roast-soft)}.kl-quiz .quiz-result__actions{display:flex;align-items:center;gap:var(--kl-space-3);flex-wrap:wrap}.kl-quiz .quiz-result__actions .quiz-restart{flex-shrink:0}.kl-quiz .quiz-atc{flex:1;min-width:180px}@media(max-width:767px){.kl-quiz{padding:var(--kl-space-7) 0}.kl-quiz .quiz-intro{margin-bottom:var(--kl-space-5)}.kl-quiz .quiz-intro h2{font-size:var(--kl-type-h2)}.kl-quiz .quiz-intro p{font-size:var(--kl-type-body);margin-bottom:var(--kl-space-4)}.kl-quiz .quiz-layout{grid-template-columns:1fr}.kl-quiz .quiz-card{min-height:0;padding:var(--kl-space-4);border-radius:var(--kl-radius-lg)}.kl-quiz .quiz-progress-row{align-items:flex-start}.kl-quiz .quiz-step-label{white-space:normal}.kl-quiz .quiz-progress-track{margin-top:var(--kl-space-2)}.kl-quiz .quiz-question{font-size:var(--kl-type-h3);margin-bottom:var(--kl-space-4)}.kl-quiz .quiz-options{gap:var(--kl-space-2)}.kl-quiz .quiz-option{min-height:calc(var(--kl-space-7) + var(--kl-space-1));padding:var(--kl-space-3)}.kl-quiz .quiz-stepper{gap:var(--kl-space-2);margin-top:var(--kl-space-5)}.kl-quiz .quiz-stepper__dot:not(:last-child):after{width:var(--kl-space-2)}}@media(max-width:480px){.kl-quiz a.quiz-result__product{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--kl-space-3);padding:var(--kl-space-3)}.kl-quiz .quiz-result__product-name,.kl-quiz .quiz-result__product-sub{overflow-wrap:anywhere}.kl-quiz .quiz-result__product img{width:calc(var(--kl-space-7) + var(--kl-space-5));height:calc(var(--kl-space-7) + var(--kl-space-5))}.kl-quiz .quiz-result__actions{flex-direction:column;align-items:stretch}.kl-quiz .quiz-result__actions .quiz-restart,.kl-quiz .quiz-atc,.kl-quiz .quiz-back{justify-content:center;width:100%}.kl-quiz .quiz-nav-row{align-items:stretch;flex-direction:column}}
/*# sourceMappingURL=/cdn/shop/t/9/assets/kl-quiz.css.map */