.sk-quiz{--skq-bg:var(--sk-night,#151A3E);--skq-card:var(--sk-night-2,#1F2654);--skq-fg:var(--sk-on-night,#F8F5EF);--skq-mute:var(--sk-muted-on-night,#AEB5DA);--skq-acc:var(--sk-accent,#E9AE57);--skq-line:color-mix(in srgb,var(--skq-fg) 40%,transparent);--skq-ease:var(--sk-ease,cubic-bezier(.22,.8,.3,1));--skq-2:var(--sk-space-2,8px);--skq-3:var(--sk-space-3,12px);--skq-4:var(--sk-space-4,16px);--skq-5:var(--sk-space-5,24px);--skq-6:var(--sk-space-6,32px);--skq-sm:var(--sk-fs-sm,.875rem);--skq-pill:var(--sk-r-pill,999px);scroll-margin-top:var(--sk-space-8,64px);font-family:var(--sk-font-sans,inherit);font-size:var(--sk-fs-base,1rem);line-height:var(--sk-lh-body,1.6);color:var(--sk-ink,#151A3E)}
:where(.sk-quiz){max-width:720px;margin-inline:auto}
.sk-quiz *{box-sizing:border-box}
.sk-quiz :where(p,h2,h3,h4,ul,li,fieldset,legend){margin:0;padding:0;border:0;min-width:0;list-style:none}
.sk-quiz .sk-quiz__grid,.sk-quiz .sk-quiz__chips{padding:0;list-style:none}
.sk-quiz :is(.sk-quiz__grid,.sk-quiz__chips)>li{margin:0}
.sk-quiz [hidden]{display:none!important}
.sk-quiz__panel{position:relative;overflow:hidden;padding:var(--skq-5) var(--skq-4) var(--skq-6);border-radius:var(--sk-r-xl,24px);background-color:var(--skq-bg);background-image:radial-gradient(90% 55% at 100% 0,color-mix(in srgb,var(--skq-acc) 18%,transparent),transparent 70%);color:var(--skq-fg);box-shadow:var(--sk-shadow-1,0 12px 32px #151a3e2e)}
.sk-quiz__intro,.sk-quiz__also,.sk-quiz__note{font-size:var(--skq-sm);color:var(--skq-mute)}
.sk-quiz__intro{margin-bottom:var(--skq-4)}
.sk-quiz__count{margin-bottom:var(--skq-2);font-size:var(--skq-sm);font-weight:600}
.sk-quiz__track{height:6px;margin-bottom:var(--skq-6);overflow:hidden;border-radius:var(--skq-pill);background:color-mix(in srgb,var(--skq-fg) 14%,transparent)}
.sk-quiz__bar{display:block;height:100%;background:var(--skq-acc);transform-origin:0;transition:transform .6s var(--skq-ease)}
.sk-quiz__legend{float:left;width:100%;margin-bottom:var(--skq-5)}
.sk-quiz__legend+*{clear:both}
.sk-quiz__q,.sk-quiz__title{font-family:var(--sk-font-serif,inherit);font-size:var(--sk-fs-2xl,1.75rem);font-weight:600;line-height:var(--sk-lh-tight,1.2);color:inherit}
.sk-quiz__options,.sk-quiz__grid{display:grid;gap:var(--skq-3)}
.sk-quiz__option{position:relative;display:block;color:inherit}
.sk-quiz__input{position:absolute;inset:0;z-index:1;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.sk-quiz__answer{display:flex;align-items:center;gap:var(--skq-3);min-height:56px;padding:var(--skq-3) var(--skq-4);border:1.5px solid var(--skq-line);border-radius:var(--sk-r-l,16px);background:var(--skq-card);font-weight:500;line-height:1.35;transition:var(--sk-dur,.2s) var(--skq-ease)}
.sk-quiz__answer::before{content:"";flex:none;width:22px;height:22px;border:2px solid var(--skq-mute);border-radius:50%}
.sk-quiz__input:hover+.sk-quiz__answer,.sk-quiz__input:checked+.sk-quiz__answer,.sk-quiz__input:checked+.sk-quiz__answer::before{border-color:var(--skq-acc)}
.sk-quiz__input:checked+.sk-quiz__answer{background:color-mix(in srgb,var(--skq-acc) 14%,var(--skq-card))}
.sk-quiz__input:checked+.sk-quiz__answer::before{background:radial-gradient(circle,var(--skq-acc) 0 38%,transparent 44%)}
.sk-quiz__nav{display:flex;gap:var(--skq-3);margin-top:var(--skq-6)}
.sk-quiz__nav [data-sk-next]{margin-left:auto}
.sk-quiz__btn{display:inline-grid;place-items:center;min-height:48px;padding:var(--skq-3) var(--skq-5);border:1.5px solid transparent;border-radius:var(--skq-pill);font:inherit;font-weight:600;line-height:1.2;text-align:center;text-decoration:none;cursor:pointer;transition:var(--sk-dur,.2s)}
.sk-quiz__btn--primary,.sk-quiz__btn--primary:visited{background:var(--skq-acc);color:var(--sk-on-accent,#151A3E)}
.sk-quiz__btn--primary:hover{background:var(--sk-accent-hover,#DE9C3F);color:var(--sk-on-accent,#151A3E)}
.sk-quiz__btn--ghost,.sk-quiz__btn--ghost:visited{background:none;color:inherit;border-color:var(--skq-line)}
.sk-quiz__btn--ghost:hover{border-color:var(--skq-acc);color:inherit}
.sk-quiz__btn:disabled,.sk-quiz [aria-disabled=true]{opacity:.45;cursor:not-allowed}
.sk-quiz .sk-quiz__btn.is-added{opacity:1;cursor:default}
.sk-quiz :focus-visible,.sk-quiz__input:focus-visible+.sk-quiz__answer{outline:3px solid var(--skq-fg);outline-offset:3px}
.sk-quiz__card :focus-visible{outline-color:var(--sk-focus,#151A3E)}
.sk-quiz [tabindex="-1"]:focus{outline:0}
@keyframes skq-in{from{opacity:0;transform:translate(var(--skq-x,32px))}}
@keyframes skq-out{to{opacity:0;transform:translate(calc(var(--skq-x,32px)*-1))}}
@keyframes skq-up{from{opacity:0;transform:translateY(16px)}}
.sk-quiz .is-in{animation:skq-in .45s var(--skq-ease) both}
.sk-quiz .is-out{animation:skq-out .17s ease-in both}
.is-in .sk-quiz__option,.is-in .sk-quiz__card{animation:skq-up .5s var(--skq-ease) both;animation-delay:calc(var(--i,0)*50ms + 80ms)}
.is-done .sk-quiz__intro,.is-done .sk-quiz__steps,.is-done .sk-quiz__nav{display:none}
[data-tone=licht]{--skq-tone:var(--sk-p-licht,#E6E9F8)}
[data-tone=moe]{--skq-tone:var(--sk-p-moe,#F9E8DC)}
[data-tone=inslapen]{--skq-tone:var(--sk-p-inslapen,#EEE8F8)}
[data-tone=nek]{--skq-tone:var(--sk-p-nek,#E7F0E6)}
[data-tone=warm]{--skq-tone:var(--sk-p-warm,#DFF0F2)}
[data-tone=beauty]{--skq-tone:var(--sk-p-beauty,#F8E7EC)}
.sk-quiz__hero{margin-bottom:var(--skq-6)}
.sk-quiz__hero::before{content:"";display:block;width:44px;height:44px;margin-bottom:var(--skq-5);border-radius:50%;background:var(--skq-tone);box-shadow:0 0 40px var(--skq-tone)}
.sk-quiz__badge{display:inline-block;margin-bottom:var(--skq-3);padding:var(--sk-space-1,4px) var(--skq-3);border-radius:var(--skq-pill);background:var(--skq-tone);color:var(--sk-ink,#151A3E);font-size:var(--sk-fs-xs,.8125rem);font-weight:700}
.sk-quiz__text,.sk-quiz__also{margin-top:var(--skq-3)}
.sk-quiz__also a,.sk-quiz__more{color:var(--skq-acc);font-weight:600;text-underline-offset:3px}
.sk-quiz__more{display:inline-flex;align-items:center;min-height:48px;margin-top:var(--skq-2)}
.sk-quiz__sub{margin-bottom:var(--skq-3);font-family:var(--sk-font-serif,inherit);font-size:var(--sk-fs-lg,1.25rem);font-weight:600;line-height:1.25;color:inherit}
.sk-quiz__grid{margin-bottom:var(--skq-6)}
.sk-quiz__card{display:grid;grid-template-columns:88px 1fr;gap:var(--skq-3);align-items:start;padding:var(--skq-3);border-radius:var(--sk-r-l,16px);background:var(--sk-surface,#fff);color:var(--sk-ink,#151A3E)}
.sk-quiz__card--set{background:var(--sk-sand,#F2EDE4);box-shadow:inset 0 0 0 2px var(--skq-acc)}
.sk-quiz__media{display:block;aspect-ratio:1;overflow:hidden;border-radius:var(--sk-r-m,12px);background:var(--sk-sand,#F2EDE4)}
.sk-quiz__media img{display:block;width:100%;height:100%;object-fit:cover}
.sk-quiz__body{display:flex;flex-direction:column;align-items:flex-start;gap:var(--sk-space-1,4px);min-width:0}
.sk-quiz__name{font-family:inherit;font-size:1em;font-weight:600;line-height:1.3}
.sk-quiz__name a,.sk-quiz__msg a{color:inherit;font-weight:600}
.sk-quiz__name a{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-decoration:none}
.sk-quiz__desc,.sk-quiz__msg{font-size:var(--skq-sm);color:var(--sk-ink-soft,#3A3F5E)}
.sk-quiz__msg{color:var(--sk-success,#1E6A48)}
.sk-quiz__price{font-weight:700}
.sk-quiz__card .sk-quiz__btn{width:100%;margin-top:var(--skq-2);padding-inline:var(--skq-3)}
.sk-quiz__empty p{margin-bottom:var(--skq-3)}
.sk-quiz__chips{display:flex;flex-wrap:wrap;gap:var(--skq-2);margin-bottom:var(--skq-5)}
.sk-quiz__again{margin-top:var(--skq-5);text-align:center}
.sk-quiz__note,.sk-quiz__privacy{margin-top:var(--skq-4);text-align:center}
.sk-quiz__note{font-size:var(--sk-fs-xs,.8125rem)}
.sk-quiz__privacy{margin-top:var(--skq-3);font-size:var(--skq-sm);color:var(--sk-ink-soft,#3A3F5E)}
.sk-quiz__sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media (min-width:640px){
.sk-quiz__panel{padding:var(--sk-space-7,48px)}
.sk-quiz__grid{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}
.sk-quiz__grid .sk-quiz__card{display:flex;flex-direction:column;align-items:stretch}
.sk-quiz__grid .sk-quiz__body{flex:1}
.sk-quiz__grid .sk-quiz__btn{margin-top:auto}
}
@supports not (color:color-mix(in srgb,red,red)){
.sk-quiz{--skq-line:var(--skq-mute)}
.sk-quiz__track,.sk-quiz__input:checked+.sk-quiz__answer{background:var(--skq-card)}
}
@media (scripting:none){.sk-quiz__head,.sk-quiz__steps,.sk-quiz__nav,.sk-quiz__privacy{display:none}}
@media (prefers-reduced-motion:reduce){.sk-quiz *{animation:none!important;transition:none!important}}
