body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}html,body{overflow-y:auto;min-height:100vh}h1{font-size:3.2rem;line-height:.3}.top{display:flex;width:70%;justify-content:space-between;margin-bottom:20px;align-items:center;flex-wrap:wrap}.stadt-button{--glow-color: rgb(217, 176, 255);--glow-spread-color: rgba(191, 123, 255, .78);--btn-color: rgb(100, 61, 136);border:.2em solid var(--glow-color);padding:.5em 1.2em;color:var(--glow-color);font-size:14px;font-weight:700;background-color:var(--btn-color);border-radius:.8em;outline:none;box-shadow:0 0 .7em .2em var(--glow-color),0 0 2em .8em var(--glow-spread-color),inset 0 0 .5em .2em var(--glow-color);text-shadow:0 0 .4em var(--glow-color);position:relative;transition:all .3s ease;cursor:grab;text-align:center}.stadt-button:after{pointer-events:none;content:"";position:absolute;top:120%;left:0;height:100%;width:100%;background-color:var(--glow-spread-color);filter:blur(1.5em);opacity:.6;transform:perspective(1.2em) rotateX(35deg) scaleY(.6)}.stadt-button:hover{color:var(--btn-color);background-color:var(--glow-color);box-shadow:0 0 .8em .2em var(--glow-color),0 0 3em 1.5em var(--glow-spread-color),inset 0 0 .6em .2em var(--glow-color)}.stadt-button:active{transform:scale(.96);box-shadow:0 0 .4em .2em var(--glow-color),0 0 2em 1.5em var(--glow-spread-color),inset 0 0 .4em .2em var(--glow-color)}.bundesland-button,.download-button{--white: #ffe7ff;--bg: #080808;--radius: 100px;outline:none;cursor:pointer;border:0;position:relative;border-radius:var(--radius);background-color:var(--bg);transition:all .2s ease;box-shadow:inset 0 .3rem .9rem #ffffff4d,inset 0 -.1rem .3rem #000000b3,inset 0 -.4rem .9rem #ffffff80,0 3rem 3rem #0000004d,0 1rem 1rem -.6rem #000c;padding:14px 22px;color:#fffc;font-size:18px;display:flex;align-items:center;justify-content:center;text-align:center;word-break:break-word}.main-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;width:85%}.staedte-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.bw{grid-area:bw}.b{grid-area:b}.ber{grid-area:ber}.mv{grid-area:mv}.bremen{grid-area:bremen}.hh{grid-area:hh}.hessen{grid-area:hessen}.bran{grid-area:bran}.nds{grid-area:nds}.nrw{grid-area:nrw}.rp{grid-area:rp}.saar{grid-area:saar}.sachsen{grid-area:sachsen}.sa{grid-area:sa}.sh{grid-area:sh}.thu{grid-area:thu}.bundeslaender-grid{display:grid;grid-template-columns:repeat(4,minmax(160px,1fr));grid-template-rows:repeat(4,auto);gap:12px;width:100%;grid-template-areas:"bw b ber mv" "bremen hh hessen bran" "nds nrw rp saar" "sachsen sa sh thu"}.user-input{width:25%;padding:8px 12px;font-size:16px;color:#000;border-radius:8px;border:2px solid #a855f7;box-shadow:0 2px 4px #0003;outline:none;transition:all .2s ease}.user-input:focus{border-color:#fbbf24;box-shadow:0 2px 8px #bf7bff80}@media(max-width:1400px){.staedte-grid{grid-template-columns:repeat(3,1fr)}.bundeslaender-grid{grid-template-columns:repeat(3,minmax(160px,1fr));grid-template-rows:repeat(6,auto);grid-template-areas:"thu b ber" "sachsen bremen hh" "hessen bran nds" "nrw rp saar" "mv sa sh" "bw bw bw"}}@media(max-width:1000px){h1{font-size:2.3rem;line-height:.8}.staedte-grid{grid-template-columns:repeat(2,1fr)}.bundeslaender-grid{grid-template-columns:repeat(2,minmax(160px,1fr));grid-template-rows:repeat(8,auto);grid-template-areas:"bw mv" "ber b" "bremen hh" "hessen bran" "nds thu" "rp saar" "sachsen sa" "sh nrw"}}@media(max-width:800px){h1{font-size:2rem;line-height:.8;flex-wrap:wrap;text-align:center}.top{display:flex;flex-direction:column;width:70%;justify-content:space-between;margin-bottom:20px;align-items:center;gap:15px}.staedte-grid{grid-template-columns:repeat(2,1fr)}.bundeslaender-grid{grid-template-columns:repeat(2,minmax(160px,1fr));grid-template-rows:repeat(8,auto);grid-template-areas:"bw mv" "ber b" "bremen hh" "hessen bran" "nds thu" "rp saar" "sachsen sa" "sh nrw"}}@media(max-width:650px){.staedte-grid{grid-template-columns:repeat(1,1fr)}.bundeslaender-grid{grid-template-columns:1fr;grid-template-rows:repeat(16,auto);grid-template-areas:"bw" "mv" "b" "ber" "bremen" "hh" "hessen" "bran" "nds" "nrw" "rp" "saar" "sachsen" "sa" "sh" "thu"}}@media(max-width:450px){.main-grid{grid-template-columns:1fr;gap:20px;width:90%}}.userInput{--glow-color: rgb(217, 176, 255);--glow-spread-color: rgba(191, 123, 255, .78);--btn-color: rgb(100, 61, 136);width:16%;padding:12px 20px 8px;font-size:16px;font-style:italic;font-family:Arial,Helvetica,sans-serif;color:#ebe5e5;background-color:#050008;border-radius:.8em;text-align:center;box-shadow:0 0 .2em .2em var(--glow-color),0 0 2em .2em var(--glow-spread-color),inset 0 0 .2em .2em var(--glow-color);outline:none;transition:all .2s ease;border:4px solid rgb(60,53,59)}.userInput:focus{outline:none;border-color:#5a055f;box-shadow:0 2px 8px #bf7bff80}.userInput:hover{border-color:#888}.userInput:focus::placeholder{color:transparent}
