:root{--ink:#1e1b4b;--ink-soft:#6b6a8f;--primary:#6366f1;--primary-2:#a855f7;--primary-3:#ec4899;--good:#10b981;--good-bg:#d1fae5;--ok:#f59e0b;--ok-bg:#fef3c7;--bad:#f43f5e;--bad-bg:#ffe4e6;--surface:#ffffffc7;--line:#e6e7f7;--radius:32px;--shadow:0 18px 40px -22px #4f46e559, 0 2px 6px #1e1b4b0a}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}html,body{min-height:100%;color:var(--ink);touch-action:manipulation;overscroll-behavior:none;margin:0;font-family:ui-rounded,SF Pro Rounded,-apple-system,Segoe UI,system-ui,sans-serif}body{background-color:#f8f7ff;background-image:radial-gradient(60rem 40rem at 5% -10%,#c7d2fe 0%,#0000 60%),radial-gradient(50rem 40rem at 105% 0,#fbcfe8 0%,#0000 55%),radial-gradient(50rem 40rem at 50% 115%,#a7f3d0 0%,#0000 55%),none;background-position:0 0,0 0,0 0,0 0;background-repeat:repeat,repeat,repeat,repeat;background-size:auto,auto,auto,auto;background-attachment:fixed;background-origin:padding-box,padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box,border-box}.screen{max-width:1040px;min-height:100dvh;padding:max(20px, env(safe-area-inset-top)) 28px 0;flex-direction:column;gap:clamp(14px,2.4vh,26px);margin:0 auto;display:flex}.header{text-align:center}.header h1{letter-spacing:-.02em;background:linear-gradient(90deg, var(--primary), var(--primary-2) 55%, var(--primary-3));color:#0000;-webkit-background-clip:text;background-clip:text;margin:0;font-size:clamp(2.2rem,5.4vw,3.6rem);font-weight:900}.untertitel{color:var(--ink-soft);margin:6px 0 14px;font-size:clamp(1rem,2.2vw,1.35rem)}.fortschritt{justify-content:center;gap:8px;display:flex}.fortschritt__punkt{background:#dcddf3;border-radius:999px;width:36px;height:8px;transition:width .3s,background .3s}.fortschritt__punkt.an{background:linear-gradient(90deg, var(--primary), var(--primary-2));width:64px}.frage{background:var(--surface);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid #ffffffe6;padding:22px 26px 26px;animation:.5s both einblenden}.frage:nth-of-type(2){animation-delay:80ms}.frage:nth-of-type(3){animation-delay:.16s}@keyframes einblenden{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}.frage h2{align-items:center;gap:14px;margin:0 0 18px;font-size:clamp(1.35rem,3.2vw,1.9rem);font-weight:800;display:flex}.nummer{color:#fff;background:linear-gradient(135deg, var(--primary), var(--primary-2));border-radius:50%;flex:none;place-items:center;width:2.1em;height:2.1em;font-size:.72em;font-weight:800;transition:background .3s;display:inline-grid}.frage.fertig .nummer{background:var(--good);font-size:0}.frage.fertig .nummer:after{content:"✓";font-size:1.15rem}.optionen{gap:16px;display:grid}.optionen--klassen{grid-template-columns:repeat(5,1fr)}.optionen--smileys{grid-template-columns:repeat(3,1fr)}.option{font:inherit;color:inherit;cursor:pointer;border:2px solid var(--line);background:#fff;border-radius:24px;transition:transform .18s cubic-bezier(.3,1.5,.5,1),box-shadow .18s,border-color .18s,background .18s,opacity .18s,filter .18s;position:relative;box-shadow:0 6px 14px -10px #1e1b4b40}.option:active{transform:scale(.95)}.option--klassen{padding:26px 0;font-size:clamp(1.8rem,5vw,2.8rem);font-weight:900}.option--smileys{flex-direction:column;align-items:center;gap:8px;padding:18px 10px 16px;display:flex}.emoji{filter:drop-shadow(0 6px 8px #1e1b4b26);font-size:clamp(3.4rem,9vw,5.6rem);line-height:1;transition:transform .25s cubic-bezier(.3,1.8,.5,1)}.beschriftung{text-align:center;color:var(--ink-soft);font-size:clamp(1rem,2.3vw,1.4rem);font-weight:700}.optionen:has(.aktiv) .option:not(.aktiv){opacity:.55;filter:saturate(.6)}.option.aktiv{border-color:var(--primary);background:#eef2ff;transform:translateY(-4px)scale(1.04);box-shadow:0 0 0 5px #6366f133,0 18px 28px -16px #4f46e58c}.option.aktiv .beschriftung{color:var(--ink)}.option.aktiv .emoji{transform:scale(1.12)rotate(-4deg)}.option--klassen.aktiv{color:#fff;background:linear-gradient(135deg, var(--primary), var(--primary-2));border-color:#0000}.ton-good.aktiv{border-color:var(--good);background:var(--good-bg);box-shadow:0 0 0 5px #10b98138,0 18px 28px -16px #10b98199}.ton-ok.aktiv{border-color:var(--ok);background:var(--ok-bg);box-shadow:0 0 0 5px #f59e0b38,0 18px 28px -16px #f59e0b99}.ton-bad.aktiv{border-color:var(--bad);background:var(--bad-bg);box-shadow:0 0 0 5px #f43f5e33,0 18px 28px -16px #f43f5e8c}.fuss{padding:14px 0 max(20px, env(safe-area-inset-bottom));justify-content:flex-end;margin-top:auto;display:flex;position:sticky;bottom:0}.senden{font:inherit;color:#fff;background:linear-gradient(135deg, var(--primary), var(--primary-2) 60%, var(--primary-3));cursor:pointer;border:0;border-radius:999px;align-items:center;gap:14px;padding:20px 38px 20px 42px;font-size:clamp(1.3rem,3vw,1.8rem);font-weight:800;transition:transform .15s,box-shadow .15s,opacity .25s,filter .25s;display:flex;box-shadow:0 16px 30px -10px #a855f7b3}.senden svg{fill:none;stroke:currentColor;stroke-width:3px;stroke-linecap:round;stroke-linejoin:round;width:1.5em;height:1.5em;transition:transform .2s}.senden:not(:disabled){animation:1.8s ease-in-out infinite puls}.senden:not(:disabled) svg{animation:1.2s ease-in-out infinite pfeil}.senden:active:not(:disabled){transform:scale(.96)}.senden:disabled{opacity:.45;filter:grayscale(.7);box-shadow:none;cursor:not-allowed}@keyframes puls{0%,to{box-shadow:0 16px 30px -10px #a855f7b3,0 0 #a855f759}50%{box-shadow:0 16px 30px -10px #a855f7b3,0 0 0 16px #a855f700}}@keyframes pfeil{0%,to{transform:translate(0)}50%{transform:translate(6px)}}.danke{z-index:10;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#f8f7ffd1;place-items:center;animation:.3s both einblenden;display:grid;position:fixed;inset:0}.danke[hidden]{display:none}.danke__inhalt{text-align:center;animation:.6s cubic-bezier(.2,1.6,.4,1) both aufpoppen}.danke__emoji{filter:drop-shadow(0 14px 20px #1e1b4b33);font-size:clamp(6rem,20vw,12rem);line-height:1}.danke__text{letter-spacing:-.03em;background:linear-gradient(90deg, var(--primary), var(--primary-2) 55%, var(--primary-3));color:#0000;-webkit-background-clip:text;background-clip:text;font-size:clamp(3.4rem,13vw,7.5rem);font-weight:900}.danke__klein{color:var(--ink-soft);font-size:clamp(1.4rem,4vw,2.4rem)}@keyframes aufpoppen{0%{opacity:0;transform:scale(.2)rotate(-8deg)}to{opacity:1;transform:none}}.admin{width:min(92vw,540px);color:var(--ink);border-radius:var(--radius);-webkit-user-select:text;user-select:text;background:#fff;border:0;padding:30px;box-shadow:0 30px 80px -20px #1e1b4b80}.admin::backdrop{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#1e1b4b73}.admin h2{margin:0 0 8px}.admin p{color:var(--ink-soft);margin:0 0 20px}.admin__aktionen{flex-wrap:wrap;gap:12px;display:flex}.admin button{font:inherit;color:var(--primary);cursor:pointer;background:#eef2ff;border:0;border-radius:16px;padding:14px 20px;font-weight:700}.admin button:first-child{color:#fff;background:linear-gradient(135deg, var(--primary), var(--primary-2))}@media (width<=700px){.screen{padding-inline:16px}.optionen--klassen{grid-template-columns:repeat(3,1fr)}.optionen--smileys{gap:10px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}