@font-face{font-family:Anton;src:url('/fonts/Anton-Regular.ttf') format('truetype');font-display:swap}*{box-sizing:border-box} :root{color-scheme:light;--bg:#faf8f1;--ink:#111824;--muted:#62686d;--line:#17202d;--surface:#fffef9;--accent:#c8ff43;--accent-ink:#111824;--lilac:#d9b0ef;--soft:#eeece4;--shadow:#111824;--danger:#a02836;--boardline:#bfc1bb}html[data-theme=dark]{color-scheme:dark;--bg:#0e1824;--ink:#f8f7ee;--muted:#aab4c2;--line:#cedbdc;--surface:#182533;--accent:#a1f5dc;--accent-ink:#101b25;--soft:#253341;--shadow:#050b12;--danger:#ffadb3;--boardline:#536779}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.45 Arial,Helvetica,sans-serif}button,input,select{font:inherit}button{cursor:pointer;color:inherit}button:disabled{opacity:.45;cursor:not-allowed}button,input,select{border:1.5px solid var(--line);border-radius:12px;min-height:44px;background:var(--surface);padding:10px 16px}button{font-weight:700;transition:transform .15s,background .15s}button:active:not(:disabled){transform:translateY(2px)}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #9664e0;outline-offset:3px}a{color:inherit}h1,h2,h3,p{margin:0}h1,h2,h3,.display{font-family:Anton,Impact,sans-serif;font-weight:400;line-height:1.15}h1{font-size:38px}h2{font-size:30px}h3{font-size:23px}.muted{color:var(--muted)}.tiny{font-size:12px}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:800;text-transform:uppercase}.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--line)}.wide{width:100%}.pill{border-radius:50px}.text-button{border:0;background:none}.icon-button{width:44px;padding:10px;display:grid;place-items:center;border:0;background:none}.icon{width:22px;height:22px;display:inline-block;vertical-align:middle}.row{display:flex;align-items:center;gap:10px}.between{justify-content:space-between}.stack{display:grid;gap:14px}.spacer{flex:1}.badge{font-size:10px;letter-spacing:1px;border-radius:5px;background:var(--lilac);color:#1b1425;padding:4px 7px;font-weight:800}.shell{max-width:1160px;margin:auto;padding:24px 32px}.topbar{display:flex;align-items:center;justify-content:space-between;padding-bottom:22px}.brand-small{font-family:Anton;font-size:22px;letter-spacing:-.6px;display:flex;align-items:center;gap:10px}.brand-small b{font:800 9px Arial;letter-spacing:1px;transform:rotate(-5deg);background:var(--lilac);padding:6px;color:#151321}.topnote{color:var(--muted);font-size:12px}.hero{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;min-height:680px}.hero-copy{order:2}.hero-art{order:1;position:relative;padding:18px 4px 35px}.hero-logo{width:100%;display:block;margin:0 auto -18px;position:relative;z-index:2}.hero-cards{display:flex;align-items:center;padding:20px 0;position:relative}.hero-card{width:53%;flex-shrink:0;border:3px solid var(--line);border-radius:22px;background:#d5fb79;padding:10px 0 10px;transform:rotate(-8deg);box-shadow:5px 7px 0 var(--shadow);overflow:hidden}.hero-card+ .hero-card{background:#dab5f2;transform:rotate(8deg);margin-left:-6%;margin-top:35px}.hero-card img{width:100%;display:block;aspect-ratio:1122/1402;object-fit:contain}.hero-card strong{display:block;width:80%;margin:auto;border-radius:10px;background:#fffdf3;color:#101824;text-align:center;font-family:Anton;font-size:25px;padding:3px}.hero-copy h1{font-size:clamp(42px,4.7vw,66px);margin:16px 0 22px;max-width:470px}.hero-copy p{color:var(--muted);max-width:310px;line-height:1.7}.hero-actions{display:grid;gap:10px;margin:32px 0 20px;max-width:370px}.hero-actions button{height:58px;font-size:18px;display:flex;align-items:center;justify-content:center;gap:15px}.hero-actions .primary{font-family:Anton;font-size:24px}.hero-meta{display:flex;gap:22px;color:var(--muted);font-size:12px;margin:24px 0}.theme-tabs{display:flex;gap:6px;justify-content:center}.theme-tabs button{min-height:40px;border:0;background:none;color:var(--muted);font-size:13px;padding:8px 12px;border-radius:0}.theme-tabs button[aria-pressed=true]{color:var(--ink);box-shadow:0 3px 0 var(--accent)}.home-footer{display:flex;justify-content:space-between;border-top:1px solid var(--boardline);padding-top:16px;align-items:center}.home-footer p{font-size:11px;color:var(--muted)}.lobby{max-width:540px;margin:25px auto 60px}.room-code{font-family:Anton;font-size:56px;letter-spacing:8px;line-height:1.3}.invite{padding:22px;border:2px solid var(--line);border-radius:22px;background:var(--surface);box-shadow:4px 4px 0 var(--shadow)}.qr{width:104px;height:104px;border-radius:10px;background:#fff}.people{display:grid;gap:8px;margin:22px 0}.person{padding:12px 15px;border:1px solid var(--boardline);border-radius:13px;display:flex;gap:12px;align-items:center}.avatar{background:var(--lilac);color:#171c29;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-weight:800}.dot{width:7px;height:7px;background:#67b797;border-radius:50%;display:inline-block;margin-right:4px}.offline .dot{background:#96999d}.callout{padding:14px 16px;background:var(--soft);border-radius:12px;font-size:13px}.board-shell{max-width:1000px;margin:auto;padding:16px 22px 24px}.board-header{display:flex;align-items:center;gap:10px;margin-bottom:10px}.board-header h1{font-size:29px}.board-header p{font-size:12px;color:var(--muted)}.turn-banner{border-top:1px solid var(--boardline);border-bottom:1px solid var(--boardline);display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 0;margin-bottom:10px;font-size:12px}.turn-banner strong{font-size:13px}.turn-indicator{background:var(--accent);color:var(--accent-ink);padding:5px 9px;border-radius:6px;font-weight:800}.board{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}.card{position:relative;min-width:0;border:1px solid var(--boardline);border-radius:12px;overflow:hidden;background:#cde8b4;color:#111824;transition:transform .15s}.card:nth-child(4n+2){background:#dcb9ee}.card:nth-child(4n+3){background:#ffe4a1}.card:nth-child(4n){background:#b6e7d5}.card-main{display:block;width:100%;padding:0;border:0;border-radius:0;background:none;min-height:0}.card-main img{width:100%;aspect-ratio:1122/1402;object-fit:contain;display:block}.card-name{font-family:Anton;font-size:18px;display:block;text-align:left;background:#fffdf5;padding:3px 8px;min-height:31px;border-top:1px solid #11182433}.card-detail{position:absolute;bottom:0;right:0;border:0;border-left:1px solid #11182433;border-radius:0;background:#fffdf5;color:#111824;width:34px;min-height:31px;height:31px;padding:6px}.card-detail .icon{width:17px;height:17px}.excluded .card-main img{opacity:.28}.excluded .card-main:before{content:'×';font:76px/.9 Arial;position:absolute;inset:20% 0 auto;text-align:center;color:white;text-shadow:0 2px 5px #111;z-index:1;pointer-events:none}.excluded .card-main{background:#111824}.excluded .card-name{background:#c3c6c4}.chosen{outline:3px solid var(--accent-ink);outline-offset:2px}.chosen:after{content:'✓';position:absolute;top:5px;right:5px;background:var(--accent);border:1px solid #111824;border-radius:50%;width:25px;height:25px;text-align:center;font-weight:900;pointer-events:none}.board-actions{position:sticky;bottom:0;background:var(--bg);padding:10px 0 max(10px,env(safe-area-inset-bottom));margin-top:8px;z-index:3;border-top:1px solid var(--boardline)}.action-main{display:flex;gap:8px}.action-main>*{flex:1}.action-main button{min-height:47px}.action-secondary{display:flex;gap:8px;justify-content:center;margin-top:5px}.action-secondary button{font-size:12px;min-height:40px;padding:7px 10px}.wait{font-size:13px;text-align:center;padding:10px;color:var(--muted)}.errorbar{border:1px solid var(--danger);background:var(--surface);color:var(--danger);padding:12px;font-size:13px;border-radius:12px;margin:10px 0}.result{max-width:500px;margin:20px auto;text-align:center;display:grid;gap:20px}.result .winner-image{width:230px;margin:auto;border-radius:20px;background:var(--lilac);border:2px solid var(--line)}.result h1{font-size:48px}.result-stamp{color:var(--accent-ink);background:var(--accent);display:inline-block;border-radius:8px;transform:rotate(-4deg);padding:8px 15px;margin:auto;font-family:Anton;font-size:22px}.result .winner-image img{width:100%;display:block}.result .winner-image strong{display:block;padding:6px;background:#fffdf4;color:#111824;font-family:Anton;font-size:25px}dialog{background:var(--bg);color:var(--ink);padding:24px;border:2px solid var(--line);border-radius:24px;width:min(480px,calc(100% - 24px));max-height:calc(100dvh - 32px);overflow-y:auto;box-shadow:8px 9px 0 #0004}dialog::backdrop{background:#07111dc4}.modal-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:18px}.modal-head h2{font-size:29px}.modal-body{display:grid;gap:16px}.modal-body label{display:grid;gap:6px;font-weight:700;font-size:13px}.modal-body input,.modal-body select{width:100%}.modal-body p{font-size:14px;color:var(--muted)}.modal-body ul{padding-left:22px;margin:0;line-height:1.8}.detail-image{height:min(54dvh,550px);width:100%;object-fit:contain;border-radius:16px;background:var(--lilac)}.detail-actions{display:flex;gap:8px}.detail-actions>*{flex:1}#notice{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:20;max-width:calc(100% - 24px);background:var(--ink);color:var(--bg);border-radius:14px;padding:12px 18px;font-size:14px;box-shadow:0 4px 24px #0003}#notice:empty{display:none}#secret{position:fixed;inset:0;z-index:30;background:#07111df5;display:grid;place-content:center;justify-items:center;padding:25px;color:white;pointer-events:none}#secret[hidden]{display:none}#secret img{max-width:320px;width:75vw;max-height:65dvh;object-fit:contain;background:#d2b2ea;border-radius:20px}#secret p{margin:12px}.secret-close{pointer-events:auto}.editor{max-width:650px;margin:24px auto}.editor-hero{padding:22px;border:2px solid var(--line);border-radius:20px;background:var(--surface)}.editor-preview{width:100%;max-height:340px;object-fit:contain;border-radius:15px;background:var(--soft)}.editor-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.library{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.library img{width:100%;border-radius:12px}.loading{margin:30vh auto;text-align:center}.terms{font-size:12px;color:var(--muted);line-height:1.6}.price{font-family:Anton;font-size:42px}.step{display:flex;gap:12px;align-items:flex-start}.step b{font-family:Anton;font-size:24px;color:var(--accent-ink);background:var(--accent);border-radius:50%;min-width:36px;text-align:center}.step p{padding-top:5px}input[type=checkbox]{width:20px;min-height:20px}.consent{display:flex!important;align-items:flex-start;gap:10px!important;font-weight:400!important}.set-row{display:grid;grid-template-columns:80px 1fr;align-items:center;gap:8px}.set-row label{font-weight:400}.set-row select{font-size:13px;padding:8px}.account-note{font-size:12px;color:var(--muted)}
@media(min-width:800px){.board-shell{max-width:850px}.board{gap:10px}.board-actions{max-width:600px;margin:14px auto 0}.board-header{margin-top:10px}.hero-art:after{content:'24 FIGUREN. EINE GUTE FRAGE.';position:absolute;bottom:0;left:0;right:0;font-size:10px;font-weight:800;letter-spacing:2px;text-align:center;color:var(--muted)}}
@media(max-width:700px){.shell{padding:14px 20px}.topbar{padding-bottom:0}.topnote{display:none}.hero{display:flex;flex-direction:column;gap:0;min-height:0;max-width:420px;margin:auto}.hero-art{width:100%;padding:0 12px 10px}.hero-logo{width:100%;margin:0 auto -18px}.hero-cards{padding:8px 0 12px;margin:0 8px}.hero-card{border-width:2px;border-radius:17px;padding:3px 0 7px;box-shadow:3px 4px 0 var(--shadow)}.hero-card+ .hero-card{margin-top:22px}.hero-card strong{font-size:21px}.hero-copy{width:100%;text-align:center}.hero-copy>.eyebrow,.hero-copy>p,.hero-meta{display:none}.hero-copy h1{font-size:30px;margin:5px 0 14px;max-width:none}.hero-actions{margin:0 0 12px;max-width:none;gap:9px}.hero-actions button{height:49px;font-size:16px}.hero-actions .primary{font-size:23px}.hero-copy>.text-button{font-size:12px;min-height:36px}.home-footer{border:0;justify-content:center;padding-top:8px}.home-footer>p{display:none}.topbar .brand-small{font-size:15px}.topbar .brand-small b{font-size:8px;padding:3px}.board-shell{padding:10px 10px 0}.board{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.card{border-radius:8px}.card-name{font-size:12px;padding:5px 3px;min-height:28px}.card-detail{width:28px;height:28px;min-height:28px;padding:5px}.card-detail .icon{width:15px;height:15px}.card-main img{aspect-ratio:1122/1402}.card-name{padding-right:27px}.excluded .card-main:before{font-size:54px}.board-header h1{font-size:25px}.board-header{margin-bottom:6px}.turn-banner{padding:6px 0;margin-bottom:7px;font-size:11px}.turn-banner strong{font-size:12px}.board-actions{padding-top:7px}.action-secondary button{font-size:11px}.lobby{margin:22px auto}.room-code{font-size:45px;letter-spacing:5px}.invite{padding:16px}.qr{width:88px;height:88px}dialog{padding:19px;border-radius:20px}.editor{margin:24px 0}.card-main{min-height:44px}}
@media(max-width:350px){.shell{padding:12px}.hero-art{padding:0 20px 5px}.hero-copy h1{font-size:26px}.board{grid-template-columns:repeat(3,minmax(0,1fr))}.card-name{font-size:14px}.board-header h1{font-size:22px}.qr{width:74px;height:74px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Separate 44px detail controls; names stay readable in the narrow four-column board. */
.card-name{min-height:44px;display:flex;align-items:center;padding-right:44px}.card-detail{width:44px;height:44px;min-height:44px;padding:13px}.card-detail .icon{width:18px;height:18px}
@media(max-width:700px){.card-name{font-size:11px;padding-left:3px;padding-right:43px}.card-detail{padding:13px}.card-detail .icon{width:18px;height:18px}}
/* V4: mobile typography, keyboard viewport and reversible background scroll lock. */
:root{--bg:#f2f3f6;--surface:#fff;--soft:#e6e8ed}
html[data-theme=dark]{--bg:#0e1824;--surface:#182533;--soft:#253341}
input,select,textarea,.modal-body input,.modal-body select,.set-row select{font-size:16px;line-height:1.4;max-width:100%;min-width:0}
body.dialog-open{position:fixed;width:100%;overflow:hidden}
dialog{position:fixed;top:var(--visible-top,0px);bottom:auto;margin:12px auto;width:min(480px,calc(100% - 24px));max-height:calc(var(--visible-height,100dvh) - 24px);padding:0;overflow:hidden;transform:none}
.modal-head{position:sticky;top:0;margin:0;padding:14px 16px;background:var(--bg);z-index:1;border-bottom:1px solid var(--boardline)}
.modal-body{padding:16px;overflow:auto;max-height:calc(var(--visible-height,100dvh) - 112px);overscroll-behavior:contain;padding-bottom:max(16px,env(safe-area-inset-bottom))}
.modal-head h2{font-size:clamp(22px,6vw,29px)}
.profile-button{font-size:13px;padding:8px;border:1px solid var(--boardline);min-height:44px}
.home-footer{padding-bottom:max(16px,env(safe-area-inset-bottom));gap:8px}
.resume{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
@media(max-width:700px){.shell{padding-top:max(10px,env(safe-area-inset-top));padding-bottom:max(20px,env(safe-area-inset-bottom))}.hero-art{max-width:min(82vw,290px);padding:0 10px 8px}.hero-logo{max-height:120px;object-fit:contain;margin-bottom:-12px}.hero-card strong{font-size:17px}.hero-card+.hero-card{margin-top:12px}.hero-copy h1{font-size:27px;margin:4px 0 12px}.hero-actions{margin-bottom:6px}.topbar .brand-small b{display:none}.topbar{gap:4px}.topbar .row{gap:0}.action-secondary{gap:0;flex-wrap:wrap}.board-actions{padding-bottom:max(12px,env(safe-area-inset-bottom))}}
@media(max-height:650px) and (max-width:700px){.hero-art{max-width:225px}.hero-logo{max-height:90px}.hero-copy h1{font-size:24px}}