:root{--bread-50:#fff8e8;--bread-100:#f6e2b7;--bread-200:#e8bf78;--crust-500:#9b5c2e;--crust-700:#653716;--meat-300:#e99b86;--meat-500:#c85d4b;--mustard-400:#e9b638;--pickle-500:#4f7b43;--ink:#2d1a10;--paper:rgba(255,251,239,.92);--shadow:0 24px 70px rgba(83,46,16,.22)}*{box-sizing:border-box}body{background:radial-gradient(circle at top left,rgba(233,182,56,.28),transparent 32rem),linear-gradient(135deg,#fff8e8,#f4cf92 44%,#e99b86);color:var(--ink);font-family:ui-rounded,Trebuchet MS,system-ui,sans-serif;margin:0;min-width:320px}button,input,select{font:inherit}.page{margin:0 auto;padding:36px 0 64px;width:min(1120px,calc(100% - 32px))}.hero{align-items:flex-start;display:flex;gap:24px;justify-content:space-between;padding:14px 0 30px}.hero__copy{max-width:720px}.hero__kicker{font-size:1.4rem;margin:0 0 8px}.hero h1{font-size:5.8rem;letter-spacing:0;line-height:.92;margin:0;text-shadow:4px 4px 0 var(--mustard-400)}.hero p:last-child{font-size:1.18rem;line-height:1.6;margin:18px 0 0;max-width:640px}.sprach-toggle{background:var(--paper);border:2px solid rgba(101,55,22,.24);border-radius:999px;box-shadow:0 12px 30px #532e1024;display:inline-flex;gap:8px;padding:8px}.sprach-toggle__button{align-items:center;background:transparent;border:0;border-radius:999px;color:var(--crust-700);cursor:pointer;display:inline-flex;gap:8px;min-height:42px;padding:0 14px;transition:transform .16s ease,background .16s ease,box-shadow .16s ease}.sprach-toggle__button--active{background:#fff;box-shadow:inset 0 -3px #e9b638bd}.calculator-shell{display:grid;gap:24px}.form-card,.result-card{background:var(--paper);border:3px solid rgba(101,55,22,.28);border-radius:8px;box-shadow:var(--shadow)}.form-card{padding:32px}.form-card__header{display:grid;gap:8px;margin-bottom:22px}.form-card__header h2,.form-card__header p{margin:0}.form-card__header p{color:var(--crust-500);font-weight:700}.form-card__header h2{font-size:2.55rem;letter-spacing:0}.form-grid{display:grid;gap:18px;grid-template-columns:repeat(2,minmax(0,1fr))}.field{display:grid;gap:8px;min-width:0}.field--wide{border:0;grid-column:1/-1;margin:0;padding:0}.field legend,.field span{color:var(--crust-700);font-weight:900}.field input,.field select{background:#ffffffc7;border:2px solid rgba(101,55,22,.24);border-radius:8px;color:var(--ink);min-height:52px;outline:none;padding:0 14px;transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease;width:100%}.field input:focus,.field select:focus{border-color:var(--meat-500);box-shadow:0 0 0 4px #c85d4b24}.glueck-grid{display:grid;gap:14px;grid-template-columns:repeat(4,minmax(120px,1fr));margin-top:8px}.glueck-card{align-content:start;background:#fffdf7;border:2px solid rgba(101,55,22,.2);border-radius:8px;cursor:pointer;display:grid;gap:7px;grid-template-rows:auto auto 1fr;min-height:-moz-fit-content;min-height:fit-content;padding:10px;position:relative;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}.glueck-card input{opacity:0;position:absolute}.glueck-card--active{border-color:var(--meat-500);box-shadow:0 14px 28px #c85d4b2e;transform:translateY(-2px) rotate(-.4deg)}.glueck-card__comic{aspect-ratio:1;background:transparent;border:0;border-radius:8px;box-shadow:none;display:block;height:auto;justify-self:center;-o-object-fit:cover;object-fit:cover;width:100%}.glueck-card__label{font-size:.95rem}.glueck-card__caption{color:#62422c;font-size:.82rem;line-height:1.25}.button{align-items:center;background:var(--crust-700);border:0;border-radius:8px;box-shadow:0 8px #3e200d;color:#fffdf7;cursor:pointer;display:inline-flex;font-weight:900;justify-content:center;min-height:54px;padding:0 24px;transition:transform .12s ease,box-shadow .12s ease,opacity .12s ease}.button:active{box-shadow:0 3px #3e200d;transform:translateY(5px)}.button:disabled{cursor:wait;opacity:.7}.button--primary{background:linear-gradient(135deg,var(--meat-500),var(--crust-700));margin-top:22px;width:100%}.button--secondary{background:#fffdf7;box-shadow:0 8px #65371647;color:var(--crust-700)}.form-card__error{color:#8b1d1d;font-weight:900;margin:18px 0 0}.result-card{overflow:hidden;padding:36px;position:relative}.result-card--special{animation:special-pop .8s cubic-bezier(.2,.9,.18,1.2)}.result-card__eyebrow{color:var(--pickle-500);font-weight:900;margin:0 0 10px}.result-card h2{font-size:4rem;letter-spacing:0;line-height:1.02;margin:0}.result-card__score{color:var(--meat-500);display:inline-block;min-width:2.1ch;text-shadow:3px 3px 0 rgba(233,182,56,.76)}.result-card__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}.rang{background:#fffdf7c7;border:2px dashed rgba(101,55,22,.34);border-radius:8px;display:grid;gap:8px;isolation:isolate;margin-top:22px;max-width:720px;overflow:hidden;padding:18px;position:relative}.rang strong{font-size:1.8rem;position:relative;z-index:1}.rang span:last-child{color:#62422c;position:relative;z-index:1}.rang--special{background:linear-gradient(135deg,#e9b63857,#fffdf7e6);border-color:var(--meat-500)}.rang__shine{background:#ffffff70;height:180%;inset:-40% auto auto -30%;position:absolute;transform:rotate(18deg);width:42%;z-index:0}.rang .rang--special{z-index:5}.rang--special .rang__shine{animation:shine 1.3s ease-out}.fade-rise-enter-active,.fade-rise-leave-active{transition:opacity .22s ease,transform .22s ease}.fade-rise-enter-from,.fade-rise-leave-to{opacity:0;transform:translateY(12px)}@keyframes shine{0%{transform:translate(-80%) rotate(18deg)}to{transform:translate(420%) rotate(18deg)}}@keyframes special-pop{0%{transform:scale(.96) rotate(-1deg)}70%{transform:scale(1.01) rotate(.4deg)}to{transform:scale(1) rotate(0)}}@media(max-width:820px){.hero{flex-direction:column}.sprach-toggle{justify-content:center;width:100%}.form-grid{grid-template-columns:1fr}.glueck-grid{grid-template-columns:repeat(2,minmax(120px,1fr))}.hero h1{font-size:4.2rem}.result-card h2{font-size:3rem}}@media(max-width:520px){.page{padding-top:18px;width:min(100% - 20px,1120px)}.sprach-toggle{border-radius:8px;display:grid}.sprach-toggle__button{justify-content:center}.glueck-grid{grid-template-columns:1fr}.hero h1{font-size:3.1rem}.form-card{padding:20px}.form-card__header h2{font-size:2rem}.result-card{padding:22px}.result-card h2{font-size:2.25rem}.rang strong{font-size:1.35rem}}
