@import url('./tailwind.css');
:root{--ink:#293a33;--muted:#7c8279;--orange:#df673e;--line:#e1e3d9;--paper:#f5f3ed}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:14px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,polygon:focus-visible{outline:3px solid #df673e;outline-offset:4px}button{border:0;background:none}header{height:96px;margin:0 5%;border-bottom:1px solid var(--line)}a{color:inherit;text-decoration:none}.brand{font-size:24px;letter-spacing:-1px;font-weight:750;display:flex;align-items:center;gap:5px}.brand-icon{font-size:35px;color:var(--orange);margin-right:9px}.brand-light{font-weight:400}.edition{font-size:10px;letter-spacing:2.2px;color:var(--muted)}.quiet{font-size:12px;font-weight:600;padding:10px 0}.quiet>span{margin-left:7px}main{max-width:1550px;margin:auto;padding:52px 5% 0}.intro{margin-bottom:40px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;display:flex;align-items:center;gap:8px}.eyebrow>span{width:6px;height:6px;background:var(--orange);border-radius:50%}h1{font-size:clamp(38px,4.1vw,62px);font-weight:500;letter-spacing:-2.5px;line-height:1.05;margin:21px 0 17px}h1 em{font-family:Georgia,serif;color:var(--orange);font-weight:400}.intro p{font-size:14px;color:var(--muted);margin:0}.intro-note{font-family:Georgia,serif;font-size:15px;color:#8a8c80;line-height:1.6;padding-bottom:4px}.workspace{display:grid;grid-template-columns:220px minmax(0,1fr) 195px;gap:28px}.section-label{font-size:10px;color:#959b8d;letter-spacing:1px;display:flex;gap:13px;align-items:center;margin:5px 0 21px}.section-label>span{font-size:9px;font-weight:700}h2{font-size:17px;font-weight:500;letter-spacing:-.4px;margin:0 0 18px}.puzzle-list{display:grid;gap:9px}.puzzle-choice{padding:13px 12px;display:flex;gap:13px;align-items:center;text-align:left;border:1px solid var(--line);border-radius:8px;background:#f9f8f4;width:100%}.puzzle-choice.active{background:#f0f1e9;border-color:#7e8b72;box-shadow:inset 0 0 0 1px #7e8b72}.puzzle-choice svg{width:36px;height:36px;flex:none}.puzzle-choice strong{display:block;font-size:12px;font-weight:600}.puzzle-choice small{display:block;font-size:10px;color:var(--muted);margin-top:5px}.puzzle-choice .check{margin-left:auto;font-size:12px;color:#6b795d}.mode-row{display:flex;justify-content:space-between;align-items:center;margin-top:23px;font-size:10px}.switch{background:#728363;width:30px;height:17px;border-radius:20px;padding:3px;flex-shrink:0}.switch i{width:11px;height:11px;display:block;background:white;border-radius:50%;margin-left:13px}.switch[aria-checked=false]{background:#b7bcb1}.switch[aria-checked=false] i{margin-left:0}.tip{display:flex;gap:10px;border-top:1px solid var(--line);padding-top:23px;margin-top:24px}.tip>span{font-size:24px;color:var(--orange)}.tip strong{font-size:10px;font-weight:600}.tip p{font-size:11px;line-height:1.8;color:var(--muted);margin:8px 0}.personal{padding:22px 0;border-top:1px solid var(--line);margin-top:18px}.personal>span,.personal small{display:block;color:var(--muted);font-size:9px;letter-spacing:1px}.personal strong{display:block;font-size:26px;font-weight:400;margin:10px 0;font-variant-numeric:tabular-nums}.personal small{letter-spacing:0}.game-card{background:#fffefa;border:1px solid #dfe1d6;border-radius:13px;overflow:hidden;box-shadow:0 8px 28px #26342304}.game-top{padding:22px 27px 18px;border-bottom:1px solid #ebede4}.badge{font-size:8px;letter-spacing:1.3px;color:#7a866d}.game-top h2{margin:7px 0 0;font-size:21px}.timer-block>span{font-size:8px;letter-spacing:1.7px;color:#9a9d91}.timer-block strong{font-size:27px;font-weight:400;letter-spacing:1px;line-height:1.4;font-variant-numeric:tabular-nums}.timer-block button{margin-left:10px;background:#f0f1e8;border:1px solid #e4e7d9;width:29px;height:29px;border-radius:50%;font-size:11px}.board-wrap{position:relative;background:#f9faf4}#board{display:block;width:100%;touch-action:none;user-select:none;min-height:280px}.board-caption{font-family:Arial,sans-serif;font-size:10px;letter-spacing:2px;fill:#a0a697}.piece{cursor:grab;stroke:#fffefa;stroke-width:1.6;stroke-linejoin:round}.piece.selected{stroke:#263c35;stroke-width:2;stroke-dasharray:5 4}.piece:active{cursor:grabbing}.board-bottom{padding:13px 22px;border-top:1px solid #e8eadf;gap:10px;font-size:10px;color:var(--muted)}.board-bottom .quiet{font-size:10px}.status-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:#829772;margin-right:5px}.tool-note{font-size:11px;color:var(--muted);line-height:1.6;margin-top:-7px}.selected-preview{background:#eeeee5;border:1px solid #e1e3d8;border-radius:9px;text-align:center;margin:24px 0 13px;padding:15px 12px 12px}.selected-preview svg{width:100%;height:105px}.selected-preview>span{display:block;font-size:10px;color:#6b7566;margin-top:8px}.rotate-row{display:flex;gap:9px}.rotate-row button{width:50%;background:#fffefa;border:1px solid var(--line);border-radius:7px;padding:9px}.rotate-row b{display:block;font-size:25px;font-weight:400}.rotate-row span{font-size:10px;color:var(--muted)}.wide{display:flex;justify-content:center;gap:12px;width:100%;margin-top:9px;border:1px solid var(--line);border-radius:7px;background:#fffefa;padding:11px;font-size:13px}.wide span{font-size:11px}.reset{width:100%;padding:15px;font-size:17px;margin-top:9px}.reset span{font-size:11px;margin-left:7px}.keyboard{margin-top:17px;padding-top:23px;border-top:1px solid var(--line);color:var(--muted);font-size:10px}.keyboard>span{font-size:8px;letter-spacing:1.2px}.keyboard p{margin:14px 0}kbd{background:#e9e9e0;border:1px solid #dcded2;border-radius:3px;font-family:inherit;font-size:9px;padding:3px 5px;color:#6c7564;display:inline-block}.under{display:flex;justify-content:space-between;padding:24px 0 40px;color:var(--muted);font-size:10px}.little-star{color:var(--orange);margin-right:9px;font-size:19px;vertical-align:middle}footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);margin:0 5%;padding:24px 0;font-size:10px;color:#8c9286}.footer-sep{margin:0 12px;color:#c6cbbc}.overlay{position:absolute;inset:0;background:#f7f8f0f5;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:20px}.overlay[hidden]{display:none}.overlay>span{font-size:44px;color:var(--orange);margin-bottom:16px}.overlay h2{font-family:Georgia,serif;font-size:30px}.overlay p{font-size:13px;line-height:1.7;color:var(--muted)}.primary{background:var(--ink);color:white;border-radius:7px;padding:14px 22px;margin-top:17px;font-size:12px}dialog{max-width:470px;width:calc(100% - 32px);border:1px solid var(--line);border-radius:14px;background:#fffefa;padding:34px;color:var(--ink)}dialog::backdrop{background:#26342b66;backdrop-filter:blur(3px)}dialog h2{font:30px Georgia,serif;margin-top:22px}dialog p,dialog li{font-size:13px;line-height:1.9;color:#6d786b}dialog ol{padding-left:18px}.close{position:absolute;top:10px;right:14px;font-size:24px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.flex{display:flex}.items-center{align-items:center}.items-end{align-items:flex-end}.justify-between{justify-content:space-between}.antialiased{-webkit-font-smoothing:antialiased}button:hover{filter:brightness(.96)}@media(min-width:1500px){main{padding-left:2%;padding-right:2%}.workspace{grid-template-columns:240px minmax(0,1fr) 210px;gap:38px}}@media(max-width:1100px){.workspace{grid-template-columns:175px minmax(0,1fr);gap:20px}.tools{grid-column:2;display:flex;align-items:center;gap:10px;flex-wrap:wrap}.tools .section-label,.tools h2,.tool-note,.selected-preview,.keyboard{display:none}.rotate-row{width:130px}.rotate-row button{padding:3px}.wide,.reset{width:auto;margin:0}.intro-note{display:none}.sidebar{grid-row:span 2}main{padding-top:35px}}@media(max-width:640px){header{height:74px}.brand{font-size:20px}.brand-icon{font-size:28px}.edition{display:none}main{padding:30px 4% 0}.intro{margin-bottom:25px}h1{font-size:43px;letter-spacing:-2px}.intro p{font-size:12px}.eyebrow{font-size:8px}.workspace{display:flex;flex-direction:column;gap:17px}.sidebar{display:contents}.sidebar>.section-label,.sidebar>h2,.tip,.personal,.mode-row{display:none}.puzzle-list{display:flex;gap:6px}.puzzle-choice{padding:9px 8px;gap:7px}.puzzle-choice svg{width:24px;height:24px}.puzzle-choice strong{font-size:10px}.puzzle-choice small{font-size:8px}.puzzle-choice .check{display:none}.game-top{padding:17px 19px}.game-top h2{font-size:19px}.tools{justify-content:center;background:#eeeee5;padding:10px;border-radius:9px;gap:8px}.rotate-row{width:124px}.wide{padding:12px}.reset{padding:12px 5px}.board-bottom{padding:10px 14px;font-size:9px}.board-bottom .quiet{font-size:9px}.under{padding:15px 0 24px;font-size:9px}.under>span:last-child{display:none}footer{font-size:9px;padding:19px 0}footer>span:last-child{display:none}#board{min-height:0}}
/* Erweiterter Blindformen-Katalog: echte Silhouetten und vier Schwierigkeitsstufen. */
.catalog-controls{display:grid;gap:9px}.catalog-controls input,.catalog-controls select,.rotation-select select{font:inherit;color:var(--ink);background:#fffefa;border:1px solid var(--line);border-radius:6px;min-width:0;padding:9px;font-size:11px;width:100%}.catalog-controls input{font-size:12px}.filter-row{display:grid;grid-template-columns:1fr 1fr;gap:6px}.catalog-meta{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:9px;margin:1px 0 7px}.catalog-meta button{font-size:9px;text-decoration:underline;padding:4px 0}.puzzle-list{max-height:408px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:2px 5px 4px 2px;scrollbar-color:#bec5b4 transparent}.level-heading{font-size:10px;font-weight:600;letter-spacing:.5px;color:#718367;margin:11px 0 2px;padding:6px 0}.puzzle-choice{min-height:65px}.puzzle-choice strong{line-height:1.4}.puzzle-choice[aria-pressed=true]{background:#e9eddf}.puzzle-choice .check{font-size:15px}.grade-note{font-size:9px;line-height:1.6;color:#8a9281;margin:10px 0}.free-play{width:100%;text-align:left;border:1px dashed #b6beaa;border-radius:7px;padding:11px;font-size:12px;margin-top:3px}.free-play span{display:block;font-size:9px;color:var(--muted);padding:5px 0 0 16px}.free-play.active{background:#e9eddf}.collection{display:grid;gap:7px;margin-top:17px;color:#728066;font-size:10px}.collection small{font-size:9px;color:var(--muted)}.collection progress{height:5px;width:100%;accent-color:#7a8e69;border:0;background:#e3e7da;border-radius:5px}.collection progress::-webkit-progress-bar{background:#e3e7da;border-radius:5px}.collection progress::-webkit-progress-value{background:#7a8e69;border-radius:5px}.collection progress::-moz-progress-bar{background:#7a8e69;border-radius:5px}.catalog-empty{font-size:12px;line-height:1.7;padding:18px 6px;color:var(--muted)}.challenge-nav{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e8eadf;padding:7px 17px;gap:8px}.challenge-nav span{font-size:9px;color:var(--muted);text-align:center;line-height:1.4}.challenge-nav button{padding:7px 12px;background:#f0f1e8;border-radius:5px}.rotation-select{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px;font-size:10px;color:var(--muted)}.rotation-select select{width:76px;padding:6px}.angle-control{margin:13px 0 5px}.angle-control label{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);margin-bottom:7px}.angle-control output{color:var(--ink);font-variant-numeric:tabular-nums}.angle-control input{width:100%;margin:0;accent-color:#728363;cursor:pointer;min-height:24px}.piece{touch-action:none}.game-card{align-self:start}.board-top h2{max-width:75%}button:disabled{opacity:.4;cursor:default}footer a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:1100px){.rotation-select{margin:0}.angle-control{flex:1 1 130px;margin:0 6px}.angle-control input{min-height:30px}.tools{align-self:start}.puzzle-list{max-height:380px}.workspace{align-items:start}}
@media(max-width:640px){.catalog-controls{gap:7px}.sidebar{display:block;order:0}.sidebar>.section-label,.sidebar>h2{display:block}.sidebar>.section-label{margin:0 0 10px}.sidebar>h2{font-size:18px;margin-bottom:12px}.catalog-controls{grid-template-columns:1fr 1.4fr;align-items:center}.catalog-meta{grid-column:1/-1;margin:0}.puzzle-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;max-height:230px}.level-heading{grid-column:1/-1;margin:4px 0 0}.puzzle-choice{min-height:61px;gap:9px;padding:8px}.puzzle-choice svg{height:35px;width:35px}.puzzle-choice strong{font-size:11px}.puzzle-choice small{font-size:9px}.puzzle-choice .check{display:inline;font-size:12px}.grade-note{margin:7px 0;font-size:8px}.free-play{font-size:11px;padding:9px;display:flex;gap:12px;align-items:center}.free-play span{display:inline;padding:0}.collection{display:flex;align-items:center;gap:9px;margin-top:11px}.collection progress{width:60px}.collection small{margin-left:auto;font-size:8px}.sidebar .mode-row{display:flex;margin:12px 0 0;font-size:10px}.game-card{width:100%}.tools{gap:8px;justify-content:space-between}.rotation-select{font-size:10px;gap:5px}.rotation-select select{width:59px}.angle-control{flex-basis:100%;order:5;margin:3px 4px}.angle-control label{margin-bottom:0}.rotate-row{width:110px}.wide{padding:10px}.reset{padding:10px 4px}.intro p{max-width:310px;line-height:1.7}.game-top h2{max-width:230px;line-height:1.25;font-size:18px}.challenge-nav{padding:5px 12px}.timer-block strong{font-size:23px}.tip,.personal{display:none}.workspace{gap:17px}.under{margin-top:0}footer{display:block}footer>span:last-child{display:block;margin-top:10px}}
@media(min-width:1101px){.puzzle-list{max-height:330px}.tools .personal{margin-top:12px;padding:17px 0}.tools .personal strong{font-size:24px;margin:8px 0}.tools .keyboard{margin-top:12px;padding-top:18px}.tools .keyboard p{margin:11px 0}}
@media(min-width:641px) and (max-width:1100px){.tools .personal{display:none}}