/* Germannika Kreuz & Quer 0.1.0 */
.gkq-lock{overflow:hidden!important}
.gkq-app,.gkq-public-single{--green:#0b5e46;--green2:#074b38;--cream:#fffaf0;--gold:#d8b75f;--ink:#173e33;--muted:#6d8078;--line:#dce7e2;--purple:#7d52c8;--red:#a5463f;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink)}
.gkq-app *,.gkq-public-single *{box-sizing:border-box}
.gkq-app button,.gkq-app input,.gkq-app select,.gkq-app textarea,.gkq-public-single button,.gkq-public-single input,.gkq-public-single select{font:inherit}
.gkq-page-intro{max-width:1240px;margin:18px auto 12px;padding:0 18px}.gkq-page-intro a{color:var(--green);font-weight:800;text-decoration:none}.gkq-page-intro span{display:block;margin-top:10px;font-size:10px;letter-spacing:.18em;font-weight:900;color:#9a7930}.gkq-page-intro p{margin:4px 0;color:var(--muted)}
.gkq-workbench{max-width:1240px;margin:auto;padding:8px 18px 40px;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:22px;align-items:start}
.gkq-library{min-width:0}.gkq-library-head{display:flex;justify-content:space-between;gap:20px;align-items:start;padding:24px 26px;border-radius:24px;background:linear-gradient(135deg,#0b5e46,#073b2e);color:#fff;box-shadow:0 18px 42px rgba(7,75,56,.16)}.gkq-library-head span{font-size:10px;font-weight:900;letter-spacing:.18em;color:#efd27d}.gkq-library-head h1{font-family:Georgia,serif;font-size:38px;margin:3px 0 4px;color:#fff}.gkq-library-head p{margin:0;color:#dcece6}.gkq-help-chip{width:42px;height:42px;border-radius:50%;border:2px solid #e5c66f;background:#fff6df;color:var(--green);font-weight:1000;font-size:20px;cursor:pointer}
.gkq-filters{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}.gkq-filters button{border:2px solid var(--line);border-radius:999px;background:#fff;padding:8px 13px;color:#456059;font-weight:850;cursor:pointer}.gkq-filters button.is-active{background:var(--green);border-color:var(--green);color:#fff}
.gkq-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.gkq-card{display:grid;grid-template-columns:132px minmax(0,1fr);gap:15px;background:#fff;border:2px solid var(--line);border-radius:20px;padding:14px;box-shadow:0 10px 24px rgba(7,75,56,.06)}.gkq-card[hidden]{display:none!important}.gkq-card-board{position:relative;display:grid;grid-template-columns:repeat(3,1fr);aspect-ratio:1;border-radius:17px;overflow:hidden;background:#f7f4e9;border:3px solid #d5b85e;box-shadow:inset 0 0 0 3px rgba(255,255,255,.7)}.gkq-card-board i{border:1px solid rgba(11,94,70,.18)}.gkq-card-board b{position:absolute;width:24%;aspect-ratio:1;border-radius:50%;box-shadow:0 4px 10px rgba(0,0,0,.18);border:3px solid rgba(255,255,255,.65)}.gkq-card-board .t0{background:#0b7b5c}.gkq-card-board .t1{background:#d6a62d}.gkq-card-board b:nth-of-type(1){left:8%;top:8%}.gkq-card-board b:nth-of-type(2){left:38%;top:38%}.gkq-card-board b:nth-of-type(3){right:8%;bottom:8%}
.gkq-card-body{min-width:0}.gkq-card-meta{display:flex;justify-content:space-between;gap:8px;font-size:9px;font-weight:900;letter-spacing:.09em}.gkq-card-meta span{color:var(--green)}.gkq-card-meta em{font-style:normal;color:#9b792e}.gkq-card h3{font-size:18px;margin:7px 0 4px}.gkq-card p{color:var(--muted);margin:0 0 10px;font-size:13px}.gkq-card-facts{display:flex;gap:6px;flex-wrap:wrap}.gkq-card-facts span{background:#f3f7f5;border-radius:999px;padding:5px 8px;font-size:10px;font-weight:800;color:#567067}.gkq-card-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}
.gkq-create-card{position:sticky;top:20px;border:2px solid #d7bb69;border-radius:24px;background:linear-gradient(180deg,#fffdf7,#f8f1da);padding:22px;box-shadow:0 16px 34px rgba(105,82,23,.10)}.gkq-create-card>span{font-size:10px;letter-spacing:.18em;font-weight:900;color:#977328}.gkq-create-card h2{font-family:Georgia,serif;font-size:26px;color:var(--green);margin:4px 0 8px}.gkq-create-card p{color:var(--muted);font-size:13px}.gkq-mini-board{width:160px;max-width:100%;aspect-ratio:1;margin:18px auto;display:grid;grid-template-columns:repeat(3,1fr);border:4px solid var(--green);border-radius:22px;overflow:hidden;position:relative;background:#fff}.gkq-mini-board i{border:1px solid #d6e4de}.gkq-mini-board b{position:absolute;width:26%;aspect-ratio:1;border-radius:50%;background:linear-gradient(145deg,#1b8b6b,#07553f);border:4px solid #e4c76e;left:37%;top:37%;box-shadow:0 7px 15px rgba(0,0,0,.18)}
.gkq-create-button,.gkq-start{width:100%;border:0;border-radius:16px;background:linear-gradient(135deg,var(--green),var(--green2));color:#fff;padding:14px 16px;font-weight:950;letter-spacing:.02em;cursor:pointer;box-shadow:0 10px 22px rgba(7,75,56,.18)}
.gkq-btn{border:2px solid transparent;border-radius:11px;padding:8px 10px;font-weight:850;cursor:pointer}.gkq-btn-small{padding:7px 9px;font-size:12px}.gkq-btn-primary{background:var(--green);color:#fff;border-color:var(--green)}.gkq-btn-light{background:#fff;color:#456059;border-color:var(--line)}.gkq-btn-gold{background:#fff6df;color:#755817;border-color:#d8ba63}.gkq-btn-purple{background:#7d52c8;color:#fff;border-color:#7147bc}.gkq-btn-danger{background:#fff2ef;color:#9a3f38;border-color:#e5aaa3}.gkq-btn-report{background:#fff8eb;color:#79581b;border-color:#d7b55a}
.gkq-overlay{position:fixed;inset:0;z-index:1000000;background:rgba(7,42,33,.58);backdrop-filter:blur(6px);padding:20px;overflow:auto}.gkq-overlay[hidden]{display:none!important}.gkq-close{width:40px;height:40px;border-radius:50%;border:2px solid #d9e5df;background:#fff;color:#456059;font-size:24px;line-height:1;cursor:pointer}
.gkq-builder,.gkq-game-modal{width:min(1220px,100%);margin:auto;background:#fffdf8;border-radius:26px;border:2px solid #d9e5df;box-shadow:0 28px 80px rgba(0,0,0,.22);overflow:hidden}.gkq-builder-head,.gkq-game-top{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:18px 22px;background:linear-gradient(135deg,#0b5e46,#073f30);color:#fff}.gkq-builder-head span,.gkq-game-top span{font-size:10px;font-weight:900;letter-spacing:.16em;color:#efd27d}.gkq-builder-head h2{margin:3px 0 0;color:#fff}.gkq-builder-head-actions,.gkq-game-top-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.gkq-state-pill{font-size:10px;font-weight:950;letter-spacing:.09em;background:#fff7df;color:#765719;padding:8px 10px;border-radius:999px}
.gkq-builder-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;min-height:620px}.gkq-builder-form{padding:20px;overflow:auto;max-height:74vh}.gkq-builder-preview{padding:22px;background:linear-gradient(180deg,#f7fbf9,#f4edd8);border-left:2px solid #e2e9e5}.gkq-form-section{border:2px solid #e2ebe7;border-radius:18px;padding:17px;margin-bottom:14px;background:#fff}.gkq-section-title{display:flex;gap:10px;align-items:flex-start;margin-bottom:13px}.gkq-section-title>span{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:#fff4d4;border:2px solid #d8b75f;font-weight:950;color:var(--green)}.gkq-section-title h3{margin:0}.gkq-section-title p{margin:2px 0 0;color:var(--muted);font-size:12px}.gkq-form-section label{display:grid;gap:6px;font-weight:800;margin:10px 0}.gkq-form-section input,.gkq-form-section select,.gkq-form-section textarea{width:100%;border:2px solid #dce7e2;border-radius:12px;padding:10px;background:#fff;color:var(--ink)}.gkq-row-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.gkq-rule-note{background:#f2faf6;border-left:5px solid var(--green);padding:11px 13px;border-radius:12px;color:#426158;font-size:12px}.gkq-quick{background:#f4edff;border:2px solid #b89be9;border-radius:18px;padding:14px;margin-bottom:14px}.gkq-quick>div{display:flex;justify-content:space-between;gap:10px;align-items:center}.gkq-quick button{border:0;background:#7d52c8;color:#fff;border-radius:9px;padding:7px 9px;font-weight:800}.gkq-quick textarea{width:100%;height:210px;margin:10px 0 4px;border:2px solid #c7afea;border-radius:12px;padding:10px;font:12px/1.45 ui-monospace,monospace}.gkq-quick small{color:#6c5590}
.gkq-question-list{display:grid;gap:10px}.gkq-question-row{display:grid;grid-template-columns:42px minmax(0,1fr) 36px;gap:10px;padding:12px;border:2px solid #e4ebe8;border-radius:15px;background:#fbfdfc}.gkq-question-number{font-weight:950;color:#9a772c}.gkq-question-fields label{margin:0 0 8px}.gkq-question-delete{width:34px;height:34px;border-radius:50%;border:2px solid #e3b3ae;background:#fff1ef;color:#a14039;font-size:18px;cursor:pointer}.gkq-add-question{width:100%;margin-top:12px;border:2px dashed #8eb8a9;border-radius:13px;background:#f6fbf8;color:var(--green);padding:11px;font-weight:900;cursor:pointer}.gkq-question-media-edit{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;padding:8px;border-radius:12px;background:#f4f7f6}.gkq-question-media-edit [data-q-media-preview]{max-width:260px}.gkq-question-media-edit img,.gkq-question-media-edit video{max-height:110px;max-width:100%;border-radius:9px}.gkq-question-media-edit audio{max-width:100%}.gkq-question-media-edit button{border:1px solid #cbd9d3;background:#fff;border-radius:8px;padding:6px 8px;cursor:pointer}
.gkq-media-editor{display:grid;gap:10px}.gkq-media-preview{min-height:90px;border:2px dashed #cfdcd6;border-radius:14px;padding:10px;display:grid;place-items:center;color:#7a8a84}.gkq-media-preview img,.gkq-media-preview video{max-width:100%;max-height:220px;border-radius:12px}.gkq-media-preview audio{width:100%}
.gkq-preview-head{display:grid;gap:3px}.gkq-preview-head span{font-size:10px;font-weight:900;letter-spacing:.14em;color:#9b762a}.gkq-preview-head strong{font-family:Georgia,serif;font-size:24px;color:var(--green)}.gkq-preview-board{--n:4;width:min(300px,100%);aspect-ratio:1;margin:22px auto;display:grid;grid-template-columns:repeat(var(--n),1fr);border:5px solid var(--green);border-radius:24px;overflow:hidden;background:#fff;box-shadow:0 18px 30px rgba(7,75,56,.12)}.gkq-preview-board i{border:1px solid #d6e4de;display:grid;place-items:center}.gkq-preview-board b{display:block;width:62%;aspect-ratio:1;border-radius:50%;box-shadow:0 5px 10px rgba(0,0,0,.15)}.gkq-preview-board .team-0{background:#087356}.gkq-preview-board .team-1{background:#d3a62e}.gkq-preview-board .team-2{background:#9d473f}.gkq-preview-board .team-3{background:#7454a8}.gkq-preview-theme{text-align:center;font-family:Georgia,serif;font-style:italic;color:#59736a}.gkq-preview-info{display:flex;justify-content:center;gap:8px;margin-top:10px}.gkq-preview-info span{background:#fff;border:2px solid #e0e6e2;border-radius:999px;padding:7px 10px;font-size:11px;font-weight:850}
.gkq-builder-footer{display:flex;justify-content:space-between;gap:10px;padding:14px 20px;border-top:2px solid #e5ebe8;background:#fff}.gkq-builder-footer>div{display:flex;gap:8px;flex-wrap:wrap}
.gkq-game{background:#fffdf8;min-height:100%}.gkq-game-top>div:first-child{display:grid}.gkq-game-top strong{font-family:Georgia,serif;font-size:22px}.gkq-game-top small{color:#d9ebe5}.gkq-setup{padding:22px}.gkq-setup-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.gkq-setup-card,.gkq-rules-compact{border:2px solid #dce7e2;border-radius:20px;background:#fff;padding:18px}.gkq-setup-card>span,.gkq-rules-compact>span{font-size:9px;font-weight:950;letter-spacing:.15em;color:#9b762a}.gkq-setup-card h3{margin:3px 0 13px}.gkq-setup-card label{display:grid;gap:6px;font-weight:800}.gkq-setup-card select,.gkq-team-name input{border:2px solid #dbe6e1;border-radius:12px;padding:10px;width:100%}.gkq-team-name{display:grid!important;grid-template-columns:42px 1fr;gap:8px;align-items:center;margin-top:8px}.gkq-rules-compact{background:#f3faf6}.gkq-rules-compact ol{padding-left:19px;margin:10px 0 0;color:#4c665d;font-size:12px;line-height:1.5}.gkq-intro-media img,.gkq-intro-media video{width:100%;max-height:300px;object-fit:contain;border-radius:14px}.gkq-intro-media audio{width:100%}.gkq-start{width:min(420px,100%);display:block;margin:20px auto 0;font-size:16px;padding:15px}
.gkq-match{padding:18px}.gkq-team-strip{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.gkq-team-pill{display:flex;align-items:center;gap:7px;padding:8px 11px;border:2px solid #dde7e3;border-radius:999px;background:#fff;color:#63776f;font-weight:850}.gkq-team-pill.is-active{border-color:#d5b65d;background:#fff7df;color:var(--green);box-shadow:0 6px 14px rgba(130,98,22,.1)}.gkq-token{display:grid;place-items:center;width:34px;aspect-ratio:1;border-radius:50%;color:#fff;border:3px solid rgba(255,255,255,.75);box-shadow:0 5px 10px rgba(0,0,0,.18),inset 0 2px 3px rgba(255,255,255,.28)}.gkq-token.team-0{background:linear-gradient(145deg,#159272,#07533f)}.gkq-token.team-1{background:linear-gradient(145deg,#e0b945,#a87513)}.gkq-token.team-2{background:linear-gradient(145deg,#b95a51,#7f302a)}.gkq-token.team-3{background:linear-gradient(145deg,#8b69c4,#5e408e)}.gkq-token b{font-size:12px}
.gkq-match-grid{display:grid;grid-template-columns:minmax(0,1fr) 390px;gap:18px}.gkq-board-wrap{min-width:0}.gkq-turn-banner{display:flex;align-items:center;gap:9px;margin-bottom:10px;padding:8px 12px;border:2px solid #e1e9e5;border-radius:14px;background:#fff}.gkq-turn-banner span{display:grid}.gkq-turn-banner small{font-size:9px;letter-spacing:.13em;font-weight:900;color:#9a762b}.gkq-board{--n:4;width:min(720px,100%);aspect-ratio:1;display:grid;grid-template-columns:repeat(var(--n),1fr);border:6px solid var(--green);border-radius:28px;overflow:hidden;background:#f8fbf9;box-shadow:0 20px 42px rgba(7,75,56,.14);margin:auto}.gkq-cell{position:relative;border:1px solid #cfe0d9;background:linear-gradient(145deg,#fff,#f2f7f4);display:grid;place-items:center;cursor:pointer;color:#91a29b;font-size:11px;font-weight:850;min-width:0}.gkq-cell:not(:disabled):hover{background:#fff8e5;box-shadow:inset 0 0 0 3px #e0c36b}.gkq-cell.is-selected{background:#fff6d8;box-shadow:inset 0 0 0 4px #d7b452}.gkq-cell .gkq-token{width:64%;max-width:72px}.gkq-cell.is-winning{background:#fff0ad!important;animation:gkqWinPulse .75s ease-in-out infinite alternate}@keyframes gkqWinPulse{to{filter:brightness(1.08);box-shadow:inset 0 0 0 5px #d6aa28}}
.gkq-question-panel{border:2px solid #dce7e2;border-radius:22px;background:#fff;padding:18px;align-self:start;position:sticky;top:14px;min-height:330px}.gkq-question-idle{display:grid;gap:8px;text-align:center;padding:45px 12px}.gkq-question-idle>span{font-size:10px;letter-spacing:.15em;font-weight:900;color:#9c782a}.gkq-question-idle strong{font-family:Georgia,serif;font-size:24px;color:var(--green)}.gkq-question-idle p{color:var(--muted);font-size:13px}.gkq-question-kicker{display:flex;justify-content:space-between;gap:8px;color:#977329;font-size:10px;font-weight:900;letter-spacing:.08em}.gkq-question-active h3{font-family:Georgia,serif;font-size:25px;line-height:1.22;margin:15px 0;color:var(--ink);overflow-wrap:anywhere}.gkq-question-media img,.gkq-question-media video{width:100%;max-height:250px;object-fit:contain;border-radius:14px}.gkq-question-media audio{width:100%}.gkq-answer-reveal{width:100%;border:2px solid #d9b95e;border-radius:14px;background:#fff5d8;color:#715617;padding:12px;font-weight:900;cursor:pointer}.gkq-answer{margin-top:12px;border:2px solid #a9c9bd;border-radius:14px;background:#f2faf6;padding:13px}.gkq-answer span{font-size:9px;font-weight:900;letter-spacing:.14em;color:#6c8279}.gkq-answer strong{display:block;margin-top:4px;font-size:18px;color:var(--green);overflow-wrap:anywhere}.gkq-judge{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.gkq-judge button{border-radius:14px;padding:12px;font-weight:950;cursor:pointer}.gkq-judge-wrong{border:2px solid #d99f98;background:#fff0ee;color:#9a413a}.gkq-judge-right{border:2px solid #7db29e;background:#edf8f3;color:#0b6b50}.gkq-match-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.gkq-win-banner{margin-top:12px;border:3px solid #d6b34b;border-radius:19px;background:linear-gradient(135deg,#fff8d8,#fff1ae);padding:14px;display:flex;align-items:center;justify-content:center;gap:12px;text-align:center;box-shadow:0 12px 24px rgba(150,108,18,.12)}.gkq-win-banner[hidden]{display:none!important}.gkq-win-banner span{display:grid}.gkq-win-banner small{font-size:10px;font-weight:950;letter-spacing:.15em;color:#8e6920}.gkq-win-banner strong{font-family:Georgia,serif;font-size:25px;color:var(--green)}.gkq-win-banner em{font-style:normal;color:#806d43;font-size:12px}
.gkq-rules-dialog,.gkq-share-dialog,.gkq-report-dialog{width:min(610px,100%);margin:8vh auto;background:#fffdf8;border:2px solid #d9b95e;border-radius:24px;padding:22px;box-shadow:0 28px 70px rgba(0,0,0,.22)}.gkq-rules-dialog header,.gkq-share-dialog header,.gkq-report-dialog header{display:flex;justify-content:space-between;gap:12px}.gkq-rules-dialog header span,.gkq-share-dialog header span,.gkq-report-dialog header span{font-size:9px;font-weight:950;letter-spacing:.15em;color:#927027}.gkq-rules-dialog h2,.gkq-share-dialog h2,.gkq-report-dialog h2{margin:3px 0 0;color:var(--green);font-family:Georgia,serif}.gkq-rules-dialog ol{padding-left:22px;line-height:1.6;color:#49635a}.gkq-share-dialog label,.gkq-report-dialog label{display:grid;gap:6px;margin:16px 0;font-weight:800}.gkq-share-dialog input,.gkq-report-dialog select{width:100%;border:2px solid #dbe6e1;border-radius:12px;padding:11px}.gkq-report-actions{display:flex;justify-content:flex-end;gap:8px}.gkq-single-report{display:flex;justify-content:flex-end;margin-bottom:8px}
.gkq-public-single{max-width:1240px;margin:25px auto;padding:0 18px}.gkq-single-hero{padding:24px 26px;border-radius:24px;background:linear-gradient(135deg,#0b5e46,#073b2e);color:#fff;margin-bottom:16px}.gkq-single-hero a{color:#efd27d;font-weight:800;text-decoration:none}.gkq-single-hero span{display:block;margin-top:15px;font-size:10px;font-weight:900;letter-spacing:.16em;color:#efd27d}.gkq-single-hero h1{font-family:Georgia,serif;font-size:38px;margin:4px 0;color:#fff}.gkq-single-hero p{margin:0;color:#dcece6}.gkq-public-app{border:2px solid #dce7e2;border-radius:24px;overflow:hidden;background:#fffdf8}.gkq-single-copy{margin:18px 0;background:#fff;border:2px solid #e0e8e4;border-radius:20px;padding:20px}.gkq-single-copy h2{margin-top:0;color:var(--green)}.gkq-single-copy>div{display:flex;gap:8px;flex-wrap:wrap}.gkq-single-copy>div span{padding:7px 10px;border-radius:999px;background:#f3f7f5;font-size:12px;font-weight:800}.gkq-ad-slot{max-width:1100px;margin:18px auto;min-height:90px}
.gkq-empty{text-align:center;padding:30px;color:#75857f}.gkq-toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);opacity:0;z-index:1000005;background:#173e33;color:#fff;padding:11px 15px;border-radius:13px;font-weight:800;box-shadow:0 12px 28px rgba(0,0,0,.2);transition:.2s}.gkq-toast.is-show{opacity:1;transform:translate(-50%,0)}.gkq-toast.is-bad{background:#98433c}
.gkq-game:fullscreen,.gkq-game:-webkit-full-screen{overflow:auto;background:#fffdf8;padding-bottom:env(safe-area-inset-bottom)}.gkq-game:fullscreen .gkq-board,.gkq-game:-webkit-full-screen .gkq-board{width:min(74dvh,68vw,860px)}
.gkq-app :where(button,a,input,textarea,select):focus-visible,.gkq-public-single :where(button,a,input,textarea,select):focus-visible{outline:3px solid #f1c85e!important;outline-offset:3px!important}
.gkqw-quer-shot{display:grid;place-items:center;padding:10px}.gkqw-quer-board{width:128px;aspect-ratio:1;display:grid;grid-template-columns:repeat(3,1fr);position:relative;border:4px solid #0b5e46;border-radius:18px;overflow:hidden;background:#fff}.gkqw-quer-board i{border:1px solid #d8e5df}.gkqw-quer-board b{position:absolute;width:24%;aspect-ratio:1;border-radius:50%;border:3px solid #e4c66b;box-shadow:0 4px 9px rgba(0,0,0,.16)}.gkqw-quer-board .a{background:#0b7257}.gkqw-quer-board .b{background:#bf8e22}.gkqw-quer-board b:nth-of-type(1){left:7%;top:7%}.gkqw-quer-board b:nth-of-type(2){left:38%;top:38%}.gkqw-quer-board b:nth-of-type(3){right:7%;bottom:7%}
@media(max-width:980px){.gkq-workbench{grid-template-columns:1fr}.gkq-create-card{position:static}.gkq-builder-grid{grid-template-columns:1fr}.gkq-builder-preview{border-left:0;border-top:2px solid #e2e9e5}.gkq-setup-grid{grid-template-columns:1fr 1fr}.gkq-match-grid{grid-template-columns:1fr}.gkq-question-panel{position:static}.gkq-game:fullscreen .gkq-board{width:min(82dvh,92vw,760px)}}
@media(max-width:700px){.gkq-cards{grid-template-columns:1fr}.gkq-card{grid-template-columns:100px minmax(0,1fr)}.gkq-library-head{padding:20px}.gkq-library-head h1{font-size:32px}.gkq-builder-head,.gkq-game-top{align-items:flex-start}.gkq-builder-head-actions,.gkq-game-top-actions{justify-content:flex-end}.gkq-builder-form{padding:12px}.gkq-row-2,.gkq-setup-grid{grid-template-columns:1fr}.gkq-match{padding:9px}.gkq-board{border-width:4px;border-radius:18px}.gkq-cell .gkq-token{width:70%}.gkq-question-active h3{font-size:22px}}
@media(max-width:480px){.gkq-workbench,.gkq-page-intro,.gkq-public-single{padding-left:8px;padding-right:8px}.gkq-card{grid-template-columns:1fr}.gkq-card-board{width:130px}.gkq-builder-footer{display:grid}.gkq-builder-footer>div{display:grid;grid-template-columns:1fr}.gkq-builder-footer .gkq-btn{width:100%}.gkq-question-row{grid-template-columns:34px minmax(0,1fr) 32px}.gkq-judge{grid-template-columns:1fr}.gkq-team-strip{display:grid;grid-template-columns:1fr 1fr}.gkq-game-top{padding:12px}.gkq-game-top-actions{gap:5px}.gkq-game-top-actions .gkq-btn{font-size:10px}.gkq-board{width:96vw}.gkq-cell{font-size:9px}.gkq-token{width:30px}.gkq-rules-dialog,.gkq-share-dialog,.gkq-report-dialog{margin:2vh auto;padding:16px}}
@media(prefers-reduced-motion:reduce){.gkq-app *,.gkq-public-single *{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}
\n\n/* ==========================================================\n   Kreuz & Quer 0.1.0 — approved move tokens\n   ========================================================== */\n.gkq-token{\n  display:grid!important;place-items:center!important;\n  width:42px!important;aspect-ratio:1!important;\n  border:0!important;border-radius:50%!important;\n  background:transparent!important;box-shadow:none!important;\n  overflow:visible!important;flex:0 0 auto!important;\n}\n.gkq-token img{\n  width:100%!important;height:100%!important;object-fit:contain!important;\n  display:block!important;filter:drop-shadow(0 4px 5px rgba(32,25,10,.18));\n}\n.gkq-token b{display:none!important}\n.gkq-token.team-0,.gkq-token.team-1,.gkq-token.team-2,.gkq-token.team-3{background:transparent!important}\n.gkq-cell .gkq-token{width:78%!important;max-width:96px!important}\n.gkq-team-name .gkq-token,.gkq-team-pill .gkq-token{width:44px!important}\n@media(max-width:700px){.gkq-cell .gkq-token{width:82%!important}.gkq-team-name .gkq-token,.gkq-team-pill .gkq-token{width:38px!important}}\n

/* ==========================================================
   Kreuz & Quer 0.1.2 — full visual pass
   ========================================================== */

/* Break out of narrow theme/content columns on the library page. */
.gkq-app[data-gkq-app]:not(.gkq-public-app){
  width:min(1380px,calc(100vw - 48px))!important;
  max-width:none!important;
  margin-left:50%!important;
  margin-right:0!important;
  transform:translateX(-50%)!important;
}

/* Real page heading / breathing room. */
.gkq-page-intro{
  max-width:none!important;
  margin:26px 0 18px!important;
  padding:0!important;
  display:grid!important;
  gap:14px!important;
}
.gkq-page-intro>a{
  width:max-content;
  padding:7px 11px;
  border:1px solid #d6e4de;
  border-radius:999px;
  background:#fff;
  box-shadow:0 4px 12px rgba(7,75,56,.05);
}
.gkq-page-intro-copy{
  display:grid;
  gap:3px;
}
.gkq-page-intro-copy>span{
  margin:0!important;
}
.gkq-page-intro-copy h1{
  margin:0!important;
  font-family:Georgia,serif!important;
  font-size:clamp(36px,4vw,56px)!important;
  line-height:1!important;
  color:var(--green)!important;
  letter-spacing:-.025em;
}
.gkq-page-intro-copy p{
  margin:5px 0 0!important;
  max-width:820px;
  font-size:16px;
  line-height:1.5;
}

/* Library page: use the available desktop width. */
.gkq-workbench{
  max-width:none!important;
  margin:0!important;
  padding:0 0 50px!important;
  grid-template-columns:minmax(0,1fr) 360px!important;
  gap:26px!important;
}
.gkq-library-head{
  min-height:178px;
  padding:30px 34px!important;
  align-items:flex-start!important;
  background:
    radial-gradient(circle at 88% 24%,rgba(239,210,125,.16) 0 7%,transparent 7.5%),
    linear-gradient(135deg,#0b684d 0%,#074632 58%,#062f26 100%)!important;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 22px 52px rgba(7,75,56,.17)!important;
}
.gkq-library-head h1{
  font-size:44px!important;
  line-height:1.05!important;
}
.gkq-library-head p{
  max-width:680px;
  font-size:16px!important;
  line-height:1.45;
}
.gkq-help-chip{
  width:48px!important;
  height:48px!important;
  flex:0 0 48px;
  box-shadow:0 8px 18px rgba(0,0,0,.13);
}
.gkq-filters{
  gap:10px!important;
  margin:18px 0!important;
  align-items:center;
}
.gkq-filters button{
  padding:9px 16px!important;
  min-height:42px;
  font-size:13px;
  box-shadow:0 3px 10px rgba(7,75,56,.035);
}
.gkq-cards{
  grid-template-columns:repeat(auto-fill,minmax(345px,1fr))!important;
  gap:18px!important;
}
.gkq-card{
  grid-template-columns:150px minmax(0,1fr)!important;
  gap:18px!important;
  padding:17px!important;
  border-radius:23px!important;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.gkq-card:hover{
  transform:translateY(-2px);
  border-color:#c7dbd3;
  box-shadow:0 16px 30px rgba(7,75,56,.09);
}
.gkq-card-board{
  border-radius:20px!important;
  background:linear-gradient(145deg,#fffef9,#f3f8f5)!important;
}
.gkq-card-board b{display:none!important}
.gkq-card-token{
  position:absolute;
  width:29%;
  aspect-ratio:1;
  object-fit:contain;
  filter:drop-shadow(0 5px 7px rgba(0,0,0,.22));
}
.gkq-card-token-a{left:6%;top:7%}
.gkq-card-token-b{right:7%;bottom:7%}
.gkq-card h3{
  font-size:20px!important;
  line-height:1.18!important;
}
.gkq-card p{
  font-size:14px!important;
  min-height:20px;
}
.gkq-empty{
  min-height:210px;
  display:grid;
  place-items:center;
  margin-top:8px;
  border:2px dashed #c9dbd3;
  border-radius:22px;
  background:linear-gradient(145deg,#fbfdfc,#f5faf7);
  font-size:15px;
}
.gkq-empty[hidden]{display:none!important}

/* Creation panel gets equal visual weight without squeezing library. */
.gkq-create-card{
  top:24px!important;
  padding:26px!important;
  border-radius:26px!important;
  min-height:455px;
  background:
    radial-gradient(circle at 84% 16%,rgba(213,180,85,.18),transparent 24%),
    linear-gradient(180deg,#fffdf7,#f7efd7)!important;
}
.gkq-create-card h2{
  font-size:31px!important;
  line-height:1.05;
}
.gkq-create-card p{
  font-size:14px!important;
  line-height:1.5;
}
.gkq-mini-board{
  width:196px!important;
  border-width:5px!important;
  background:linear-gradient(145deg,#fff,#f6faf8)!important;
  box-shadow:0 16px 28px rgba(7,75,56,.10);
}
.gkq-mini-board b{display:none!important}
.gkq-mini-token{
  position:absolute;
  width:31%;
  aspect-ratio:1;
  object-fit:contain;
  z-index:2;
  filter:drop-shadow(0 7px 8px rgba(0,0,0,.22));
}
.gkq-mini-token-a{left:7%;top:7%}
.gkq-mini-token-b{right:7%;bottom:7%}
.gkq-create-button{
  min-height:54px!important;
  font-size:15px!important;
  margin-top:16px;
  box-shadow:0 10px 22px rgba(7,75,56,.18),0 0 0 4px rgba(216,183,95,.32);
}

/* Builder is intentionally spacious: it is a work surface, not a narrow modal. */
.gkq-overlay[data-gkq-builder]{
  padding:18px!important;
  display:grid;
  place-items:center;
}
.gkq-builder{
  width:min(1440px,calc(100vw - 36px))!important;
  max-height:94dvh!important;
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
  border-radius:28px!important;
}
.gkq-builder-head{
  padding:20px 26px!important;
}
.gkq-builder-head h2{
  font-family:Georgia,serif!important;
  font-size:clamp(29px,3vw,40px)!important;
  line-height:1!important;
}
.gkq-builder-grid{
  min-height:0!important;
  height:min(74dvh,790px)!important;
  grid-template-columns:minmax(0,1fr) 410px!important;
}
.gkq-builder-form{
  max-height:none!important;
  height:100%!important;
  padding:24px!important;
  scrollbar-gutter:stable;
}
.gkq-builder-preview{
  padding:26px!important;
  position:relative;
  overflow:auto;
  background:
    radial-gradient(circle at 75% 13%,rgba(217,183,95,.12),transparent 25%),
    linear-gradient(180deg,#fbfdfc,#f6efd8)!important;
}
.gkq-form-section{
  padding:21px!important;
  margin-bottom:18px!important;
  border-radius:21px!important;
  box-shadow:0 6px 16px rgba(7,75,56,.035);
}
.gkq-section-title{
  gap:13px!important;
  margin-bottom:17px!important;
}
.gkq-section-title>span{
  width:36px!important;
  height:36px!important;
  font-size:14px!important;
}
.gkq-section-title h3{
  font-family:Georgia,serif;
  font-size:24px!important;
  font-weight:500!important;
}
.gkq-section-title p{
  font-size:13px!important;
}
.gkq-form-section label{
  font-size:14px;
}
.gkq-form-section input,
.gkq-form-section select,
.gkq-form-section textarea{
  min-height:50px!important;
  padding:12px 13px!important;
  font-size:15px!important;
}
.gkq-form-section textarea{
  min-height:78px!important;
  resize:vertical;
}
.gkq-rule-note{
  padding:13px 15px!important;
  font-size:13px!important;
  line-height:1.45;
}
.gkq-question-row{
  padding:15px!important;
  border-radius:17px!important;
  gap:13px!important;
}
.gkq-question-number{
  font-size:14px;
}
.gkq-add-question{
  min-height:50px;
  font-size:14px;
}
.gkq-builder-footer{
  padding:14px 24px!important;
  min-height:72px;
  align-items:center;
  box-shadow:0 -8px 24px rgba(7,75,56,.045);
}
.gkq-builder-footer .gkq-btn{
  min-height:44px;
  padding-inline:16px;
}

/* Preview: empty game board + explicit team token legend. */
.gkq-preview-head{
  gap:5px!important;
}
.gkq-preview-head strong{
  font-size:29px!important;
  line-height:1.08;
}
.gkq-preview-head small{
  color:#71827b;
  font-size:12px;
}
.gkq-preview-board{
  width:min(330px,100%)!important;
  margin:22px auto 18px!important;
  border-width:5px!important;
  border-radius:25px!important;
  background:linear-gradient(145deg,#fff,#f7faf8)!important;
}
.gkq-preview-board i{
  border-color:#cfe0d9!important;
}
.gkq-preview-board b{display:none!important}
.gkq-preview-team-box{
  margin:0 auto 16px;
  width:min(350px,100%);
  padding:13px 14px;
  border:2px solid #dfE8e4;
  border-radius:17px;
  background:rgba(255,255,255,.72);
  box-shadow:0 8px 18px rgba(7,75,56,.045);
}
.gkq-preview-team-box>span{
  display:block;
  margin-bottom:9px;
  color:#967127;
  font-size:9px;
  font-weight:950;
  letter-spacing:.13em;
  text-align:center;
}
.gkq-preview-teams{
  display:flex;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
}
.gkq-preview-team{
  min-width:68px;
  display:grid;
  place-items:center;
  gap:4px;
}
.gkq-preview-team .gkq-token{
  width:52px!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.gkq-preview-team small{
  font-size:10px;
  font-weight:850;
  color:#62756e;
}
.gkq-preview-theme{
  font-size:19px!important;
  margin-top:6px;
}
.gkq-preview-info{
  margin-top:12px!important;
}

/* Approved PNG tokens should be the visual identity throughout the game. */
.gkq-token{
  overflow:visible!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.gkq-token img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  filter:drop-shadow(0 5px 7px rgba(0,0,0,.20));
}
.gkq-team-pill{
  min-height:54px;
  padding:8px 14px!important;
  background:linear-gradient(180deg,#fff,#fafcfb)!important;
}
.gkq-team-pill.is-active{
  border-color:#d2ad42!important;
  box-shadow:0 7px 18px rgba(151,111,21,.14),inset 0 0 0 1px rgba(255,255,255,.7)!important;
}
.gkq-team-pill .gkq-token{
  width:42px!important;
}
.gkq-team-name .gkq-token{
  width:42px!important;
}
.gkq-cell .gkq-token{
  width:78%!important;
  max-width:96px!important;
}

/* Main game also gets more breathing room. */
.gkq-game-top{
  padding:18px 24px!important;
}
.gkq-game-top strong{
  font-size:27px!important;
}
.gkq-setup{
  padding:26px!important;
}
.gkq-setup-grid{
  gap:18px!important;
}
.gkq-setup-card,
.gkq-rules-compact{
  padding:21px!important;
  border-radius:22px!important;
}
.gkq-match{
  padding:22px!important;
}
.gkq-match-grid{
  grid-template-columns:minmax(0,1fr) 420px!important;
  gap:22px!important;
}
.gkq-board{
  width:min(760px,100%)!important;
  border-width:7px!important;
}
.gkq-question-panel{
  padding:22px!important;
  border-radius:24px!important;
}
.gkq-question-active h3{
  font-size:28px!important;
}
.gkq-answer-reveal{
  min-height:50px;
}
.gkq-judge button{
  min-height:50px;
}

/* Tablet / mobile: keep spacious but fit naturally. */
@media(max-width:1180px){
  .gkq-app[data-gkq-app]:not(.gkq-public-app){
    width:min(1120px,calc(100vw - 28px))!important;
  }
  .gkq-workbench{
    grid-template-columns:minmax(0,1fr) 320px!important;
  }
  .gkq-builder-grid{
    grid-template-columns:minmax(0,1fr) 360px!important;
  }
  .gkq-match-grid{
    grid-template-columns:minmax(0,1fr) 360px!important;
  }
}
@media(max-width:980px){
  .gkq-app[data-gkq-app]:not(.gkq-public-app){
    width:calc(100vw - 22px)!important;
  }
  .gkq-workbench{
    grid-template-columns:1fr!important;
  }
  .gkq-create-card{
    position:static!important;
    min-height:0;
  }
  .gkq-builder{
    width:calc(100vw - 20px)!important;
    max-height:96dvh!important;
  }
  .gkq-builder-grid{
    height:auto!important;
    max-height:78dvh!important;
    display:block!important;
    overflow:auto;
  }
  .gkq-builder-form{
    height:auto!important;
    overflow:visible!important;
  }
  .gkq-builder-preview{
    border-left:0!important;
    border-top:2px solid #e2e9e5!important;
  }
  .gkq-match-grid{
    grid-template-columns:1fr!important;
  }
}
@media(max-width:700px){
  .gkq-page-intro{
    margin-top:16px!important;
  }
  .gkq-page-intro-copy h1{
    font-size:38px!important;
  }
  .gkq-library-head{
    min-height:0;
    padding:22px!important;
  }
  .gkq-library-head h1{
    font-size:35px!important;
  }
  .gkq-cards{
    grid-template-columns:1fr!important;
  }
  .gkq-card{
    grid-template-columns:115px minmax(0,1fr)!important;
  }
  .gkq-builder-head{
    padding:15px 16px!important;
  }
  .gkq-builder-head h2{
    font-size:28px!important;
  }
  .gkq-builder-form{
    padding:12px!important;
  }
  .gkq-form-section{
    padding:15px!important;
  }
}
@media(max-width:480px){
  .gkq-app[data-gkq-app]:not(.gkq-public-app){
    width:calc(100vw - 12px)!important;
  }
  .gkq-card{
    grid-template-columns:1fr!important;
  }
  .gkq-card-board{
    width:145px;
  }
  .gkq-builder{
    width:calc(100vw - 8px)!important;
    border-radius:18px!important;
  }
}


/* ==========================================================
   Kreuz & Quer 0.1.3 — save/footer/preview fixes
   ========================================================== */
.gkq-builder{
  overflow:hidden!important;
}
.gkq-builder-grid{
  overflow:hidden!important;
}
.gkq-builder-preview{
  min-height:0!important;
  padding-bottom:34px!important;
  overflow-y:auto!important;
  overscroll-behavior:contain;
}
.gkq-preview-team-box{
  margin:16px auto 12px!important;
  padding:11px 12px!important;
}
.gkq-preview-teams{
  gap:8px!important;
}
.gkq-preview-team{
  min-width:58px!important;
}
.gkq-preview-team .gkq-token{
  width:46px!important;
}
.gkq-preview-board{
  width:min(292px,100%)!important;
  margin:14px auto 12px!important;
}
.gkq-preview-theme{
  margin-top:8px!important;
}
.gkq-builder-footer{
  position:relative!important;
  z-index:30!important;
  flex:0 0 auto!important;
  background:#fffdf9!important;
  border-top:2px solid #dfe8e4!important;
  box-shadow:0 -10px 26px rgba(7,75,56,.09)!important;
}
.gkq-builder-footer>div{
  position:relative;
  z-index:31;
}
.gkq-builder-footer .gkq-btn{
  white-space:nowrap;
}
.gkq-builder-footer .gkq-btn:disabled{
  opacity:.6;
  cursor:wait;
}
.gkq-builder-footer .gkq-btn.is-saving{
  box-shadow:0 0 0 4px rgba(216,183,95,.35)!important;
}

/* On shorter laptop screens keep every footer button fully visible. */
@media (max-height:800px) and (min-width:981px){
  .gkq-builder{
    max-height:96dvh!important;
  }
  .gkq-builder-grid{
    height:calc(96dvh - 150px)!important;
  }
  .gkq-preview-board{
    width:min(250px,100%)!important;
  }
  .gkq-preview-head strong{
    font-size:25px!important;
  }
  .gkq-preview-team .gkq-token{
    width:40px!important;
  }
}

/* Footer must never hide behind the preview column on mobile/tablet either. */
@media(max-width:980px){
  .gkq-builder-grid{
    overflow:auto!important;
  }
  .gkq-builder-preview{
    overflow:visible!important;
    padding-bottom:24px!important;
  }
  .gkq-builder-footer{
    position:sticky!important;
    bottom:0!important;
  }
}


/* ==========================================================
   Kreuz & Quer 0.1.4 — reliable tokens + save endpoint
   ========================================================== */
.gkq-preview-team .gkq-token{
  display:block!important;
  width:54px!important;
  height:54px!important;
  aspect-ratio:1!important;
}
.gkq-preview-team .gkq-token img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  opacity:1!important;
  visibility:visible!important;
}
.gkq-preview-team{
  min-width:70px!important;
}
.gkq-preview-team small{
  margin-top:2px;
}


/* Kreuz & Quer 0.1.5 — token row consistency */
.gkq-preview-teams{
  min-height:64px;
  align-items:start;
}

/* Kreuz & Quer 0.1.6 — unified front-end API transport */

/* Kreuz & Quer 0.1.7 — cache-busted asset path + direct page POST API */


/* Kreuz & Quer 0.1.8 — successful save is final; post-save UI is local */


/* ==========================================================
   Kreuz & Quer 0.1.9 — 2-team final mechanics + game viewport
   ========================================================== */

/* ----- Fixed two-team controls ----- */
.gkq-fixed-teams{
  min-height:50px;
  display:grid;
  grid-template-columns:1fr auto;
  grid-template-areas:"eyebrow tokens" "title tokens";
  align-items:center;
  gap:1px 12px;
  padding:9px 12px;
  border:2px solid #dce7e2;
  border-radius:12px;
  background:linear-gradient(145deg,#fbfdfc,#f3f8f5);
}
.gkq-fixed-teams>span{
  grid-area:eyebrow;
  font-size:9px;
  font-weight:950;
  letter-spacing:.13em;
  color:#99752b;
}
.gkq-fixed-teams>strong{
  grid-area:title;
  font-size:14px;
  color:#234f42;
}
.gkq-fixed-token-pair{
  grid-area:tokens;
  display:flex;
  align-items:center;
}
.gkq-fixed-token-pair img{
  width:38px;
  height:38px;
  object-fit:contain;
  filter:drop-shadow(0 4px 5px rgba(0,0,0,.18));
}
.gkq-fixed-token-pair img+img{margin-left:-7px}
.gkq-setup-hint{
  margin:-4px 0 12px!important;
  color:#71837c!important;
  font-size:12px!important;
}

/* ----- Modal occupies the viewport but itself never needs vertical travel ----- */
.gkq-game-overlay{
  padding:8px!important;
  overflow:hidden!important;
  display:grid!important;
  place-items:center!important;
}
.gkq-game-modal{
  width:min(1480px,calc(100vw - 16px))!important;
  height:calc(100dvh - 16px)!important;
  max-height:none!important;
  margin:0!important;
  display:block!important;
  overflow:hidden!important;
  border-radius:26px!important;
}
.gkq-game{
  height:100%!important;
  min-height:0!important;
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr)!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 86% 10%,rgba(216,183,95,.08),transparent 22%),
    #fffdf8!important;
}

/* ----- Compact premium header ----- */
.gkq-game-top{
  min-height:82px!important;
  padding:12px 18px!important;
  flex:0 0 auto!important;
}
.gkq-game-top strong{
  font-size:clamp(23px,2vw,30px)!important;
  line-height:1.05!important;
}
.gkq-game-top small{
  font-size:13px!important;
}
.gkq-game-top-actions{
  flex-wrap:nowrap!important;
}
.gkq-game-top-actions .gkq-btn{
  min-height:42px;
}

/* ----- Setup screen: spacious but no giant vertical footprint ----- */
.gkq-setup{
  min-height:0!important;
  height:100%!important;
  overflow:auto!important;
  padding:20px!important;
}
.gkq-setup-grid{
  max-width:1200px;
  margin:0 auto;
  grid-template-columns:minmax(280px,.9fr) minmax(300px,1.1fr) minmax(300px,1fr)!important;
  gap:16px!important;
}
.gkq-team-setup-card [data-gkq-team-inputs]{
  display:grid;
  gap:9px;
}
.gkq-team-name{
  min-height:54px;
  grid-template-columns:50px 1fr!important;
  margin-top:0!important;
  padding:5px 8px 5px 5px;
  border:1px solid #e0e8e4;
  border-radius:14px;
  background:#fbfdfc;
}
.gkq-team-name .gkq-token{
  width:44px!important;
  height:44px!important;
}
.gkq-team-name input{
  min-height:44px;
}
.gkq-start{
  margin-top:16px!important;
  min-height:52px;
}

/* ----- Match: no page scroll on desktop ----- */
.gkq-match{
  min-height:0!important;
  height:100%!important;
  padding:10px 14px 12px!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
}
.gkq-team-strip{
  flex:0 0 auto!important;
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,260px))!important;
  justify-content:start!important;
  gap:9px!important;
  margin:0 0 8px!important;
}
.gkq-team-pill{
  min-height:46px!important;
  padding:5px 12px 5px 6px!important;
  border-radius:15px!important;
  font-size:14px!important;
}
.gkq-team-pill .gkq-token{
  width:38px!important;
  height:38px!important;
}
.gkq-team-pill.is-active{
  background:linear-gradient(145deg,#fff8df,#fffdf4)!important;
  border-color:#d6b449!important;
  box-shadow:0 5px 14px rgba(151,111,21,.13)!important;
}
.gkq-match-grid{
  flex:1 1 auto!important;
  min-height:0!important;
  height:100%!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(340px,400px)!important;
  gap:14px!important;
  align-items:stretch!important;
}
.gkq-board-wrap{
  min-width:0!important;
  min-height:0!important;
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
  align-items:start!important;
  overflow:hidden!important;
}
.gkq-turn-banner{
  min-height:45px!important;
  margin:0 0 7px!important;
  padding:5px 10px!important;
  border-radius:13px!important;
}
.gkq-turn-banner .gkq-token{
  width:34px!important;
  height:34px!important;
}
.gkq-turn-banner strong{
  font-size:15px!important;
}

/*
 * Core viewport fit:
 * on 6×6 a complete square remains visible without scrolling.
 */
.gkq-board{
  width:min(100%,calc(100dvh - 205px),700px)!important;
  max-width:100%!important;
  max-height:calc(100dvh - 205px)!important;
  height:auto!important;
  aspect-ratio:1!important;
  margin:0 auto!important;
  border-width:6px!important;
  border-radius:23px!important;
  box-shadow:0 12px 30px rgba(7,75,56,.13)!important;
}
.gkq-cell{
  min-height:0!important;
}
.gkq-cell>span:not(.gkq-token){
  font-size:clamp(9px,1.05vw,12px)!important;
  color:#8da098!important;
}
.gkq-cell .gkq-token{
  width:72%!important;
  max-width:76px!important;
  height:auto!important;
}
.gkq-cell .gkq-token img{
  filter:drop-shadow(0 4px 5px rgba(0,0,0,.18))!important;
}
.gkq-cell.is-winning{
  box-shadow:inset 0 0 0 4px #d6aa28!important;
}

/* ----- Question side becomes a fixed-height control console ----- */
.gkq-question-panel{
  min-height:0!important;
  height:100%!important;
  position:static!important;
  padding:16px!important;
  border-radius:20px!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 50% 0,rgba(216,183,95,.07),transparent 28%),
    #fff!important;
}
.gkq-question-idle{
  flex:1 1 auto;
  min-height:0;
  padding:24px 10px!important;
  place-content:center;
}
.gkq-question-idle strong{
  font-size:clamp(23px,2.2vw,31px)!important;
}
.gkq-question-active{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  padding-right:3px;
}
.gkq-question-active h3{
  font-size:clamp(22px,2.1vw,29px)!important;
  margin:12px 0!important;
}
.gkq-question-media img,
.gkq-question-media video{
  max-height:190px!important;
}
.gkq-answer{
  padding:11px!important;
}
.gkq-answer strong{
  font-size:17px!important;
}
.gkq-answer-reveal,
.gkq-judge button{
  min-height:46px!important;
}
.gkq-match-actions{
  flex:0 0 auto;
  margin-top:auto!important;
  padding-top:12px;
  border-top:1px solid #edf1ef;
}

/* Win message sits below board without increasing board dimensions. */
.gkq-win-banner{
  margin:7px auto 0!important;
  width:min(100%,700px);
  min-height:48px;
  padding:7px 12px!important;
}
.gkq-win-banner strong{
  font-size:21px!important;
}

/* ----- Fullscreen uses the extra height instead of growing beyond it ----- */
.gkq-game:fullscreen,
.gkq-game:-webkit-full-screen{
  width:100vw!important;
  height:100dvh!important;
  overflow:hidden!important;
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr)!important;
}
.gkq-game:fullscreen .gkq-board,
.gkq-game:-webkit-full-screen .gkq-board{
  width:min(calc(100dvh - 185px),calc(100vw - 460px),760px)!important;
  max-height:calc(100dvh - 185px)!important;
}
.gkq-game:fullscreen .gkq-match,
.gkq-game:-webkit-full-screen .gkq-match{
  min-height:0!important;
  overflow:hidden!important;
}

/* ----- Shorter laptop windows get an even more compact board chrome ----- */
@media (min-width:981px) and (max-height:760px){
  .gkq-game-top{
    min-height:70px!important;
    padding:9px 15px!important;
  }
  .gkq-game-top strong{font-size:22px!important}
  .gkq-match{padding:7px 10px 9px!important}
  .gkq-team-pill{min-height:40px!important}
  .gkq-team-pill .gkq-token{width:32px!important;height:32px!important}
  .gkq-turn-banner{min-height:40px!important;margin-bottom:5px!important}
  .gkq-turn-banner .gkq-token{width:30px!important;height:30px!important}
  .gkq-board{
    width:min(100%,calc(100dvh - 178px),660px)!important;
    max-height:calc(100dvh - 178px)!important;
  }
  .gkq-question-panel{padding:13px!important}
}

/* ----- Tablet/mobile: scrolling is preferable to crushing the board ----- */
@media(max-width:980px){
  .gkq-game-overlay{
    overflow:auto!important;
    align-items:start!important;
    padding:6px!important;
  }
  .gkq-game-modal{
    width:calc(100vw - 12px)!important;
    height:auto!important;
    min-height:calc(100dvh - 12px)!important;
    overflow:visible!important;
  }
  .gkq-game{
    height:auto!important;
    min-height:calc(100dvh - 12px)!important;
    overflow:visible!important;
  }
  .gkq-match{
    height:auto!important;
    overflow:visible!important;
  }
  .gkq-match-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    height:auto!important;
  }
  .gkq-board-wrap{
    overflow:visible!important;
  }
  .gkq-board{
    width:min(92vw,620px)!important;
    max-height:none!important;
  }
  .gkq-question-panel{
    height:auto!important;
    min-height:300px!important;
    overflow:visible!important;
  }
}
@media(max-width:560px){
  .gkq-team-strip{
    grid-template-columns:1fr 1fr!important;
  }
  .gkq-team-pill{
    min-width:0;
    overflow:hidden;
  }
  .gkq-team-pill>span:last-child{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .gkq-board{
    width:94vw!important;
    border-width:4px!important;
    border-radius:17px!important;
  }
}


/* ==========================================================
   Kreuz & Quer 0.1.10 — board rendering + viewport layout fix
   ========================================================== */

/* The previous desktop grid used height:100% inside a flex column.
   That made it cover the team strip. Let flex calculate the remaining height. */
.gkq-match-grid{
  height:auto!important;
  flex:1 1 0!important;
  min-height:0!important;
  overflow:hidden!important;
}

/* Team strip must always occupy its own row, never sit behind the match grid. */
.gkq-team-strip{
  position:relative!important;
  z-index:3!important;
  flex:0 0 auto!important;
  min-height:46px!important;
}

/* Board wrapper owns the remaining vertical space. */
.gkq-board-wrap{
  height:100%!important;
  min-height:0!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
  justify-items:center!important;
}

/* Explicit rows are critical: all 3×3–6×6 cells always form a real square grid. */
.gkq-board{
  width:var(--gkq-board-size,min(100%,calc(100dvh - 205px),690px))!important;
  height:var(--gkq-board-size,auto)!important;
  max-width:100%!important;
  max-height:100%!important;
  aspect-ratio:1!important;
  grid-template-columns:repeat(var(--n),minmax(0,1fr))!important;
  grid-template-rows:repeat(var(--n),minmax(0,1fr))!important;
  align-self:start!important;
  overflow:hidden!important;
}

.gkq-cell{
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  border:1px solid #cfe0d9!important;
  background:linear-gradient(145deg,#ffffff,#f3f8f5)!important;
  display:grid!important;
  place-items:center!important;
  overflow:visible!important;
}

.gkq-cell:disabled{
  opacity:1!important;
}

.gkq-cell-label{
  display:block!important;
  font-size:clamp(9px,1vw,12px)!important;
  line-height:1!important;
  color:#8da098!important;
  font-weight:800!important;
}

/* Empty board cells must still be visible. */
.gkq-cell:not(.is-owned){
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);
}

/* Keep tokens comfortably inside 6×6 cells. */
.gkq-cell .gkq-token{
  width:70%!important;
  height:70%!important;
  max-width:76px!important;
  max-height:76px!important;
}

/* Right panel stays aligned with the complete board area. */
.gkq-question-panel{
  min-height:0!important;
  height:100%!important;
}

/* Short laptop screens: slightly tighter chrome, complete board stays visible. */
@media (min-width:981px) and (max-height:850px){
  .gkq-game-top{
    min-height:68px!important;
    padding:8px 16px!important;
  }
  .gkq-game-top strong{
    font-size:22px!important;
  }
  .gkq-match{
    padding:7px 10px 9px!important;
  }
  .gkq-team-strip{
    min-height:40px!important;
    margin-bottom:5px!important;
  }
  .gkq-team-pill{
    min-height:40px!important;
  }
  .gkq-turn-banner{
    min-height:38px!important;
    margin-bottom:5px!important;
  }
}

/* Mobile/tablet: CSS sizing again controls the board. */
@media(max-width:980px){
  .gkq-match-grid{
    height:auto!important;
    overflow:visible!important;
    flex:none!important;
  }
  .gkq-board-wrap{
    height:auto!important;
  }
  .gkq-board{
    width:min(92vw,620px)!important;
    height:auto!important;
    max-height:none!important;
  }
}


/* ==========================================================
   Kreuz & Quer 0.1.11 — library + constructor organization
   ========================================================== */

/* ---------- Library: one clear flow instead of a squeezed side column ---------- */
.gkq-workbench{
  display:flex!important;
  flex-direction:column!important;
  gap:18px!important;
}
.gkq-create-card{
  order:-1!important;
  position:static!important;
  min-height:0!important;
  width:100%!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto auto!important;
  grid-template-areas:
    "eyebrow board button"
    "title board button"
    "copy board button"!important;
  align-items:center!important;
  column-gap:24px!important;
  padding:18px 22px!important;
  border-radius:22px!important;
}
.gkq-create-card>span{grid-area:eyebrow!important}
.gkq-create-card>h2{
  grid-area:title!important;
  margin:2px 0!important;
  font-size:28px!important;
}
.gkq-create-card>p{
  grid-area:copy!important;
  margin:3px 0 0!important;
  max-width:620px!important;
}
.gkq-create-card .gkq-mini-board{
  grid-area:board!important;
  width:112px!important;
  margin:0!important;
  border-radius:17px!important;
}
.gkq-create-card .gkq-create-button{
  grid-area:button!important;
  width:auto!important;
  min-width:230px!important;
  margin:0!important;
  padding:14px 20px!important;
}

.gkq-library-head{
  min-height:132px!important;
  padding:24px 28px!important;
}
.gkq-library-head h1{
  font-size:38px!important;
}
.gkq-library-tools{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin:15px 0 17px;
  padding:10px 12px;
  border:1px solid #dce7e2;
  border-radius:17px;
  background:#fbfdfc;
}
.gkq-library-tools .gkq-filters{
  margin:0!important;
  flex:1 1 auto;
}
.gkq-library-controls{
  display:flex;
  gap:8px;
  align-items:center;
  flex:0 0 auto;
}
.gkq-search{
  min-width:250px;
  height:42px;
  display:flex;
  align-items:center;
  gap:7px;
  padding:0 11px;
  border:2px solid #dce7e2;
  border-radius:12px;
  background:#fff;
}
.gkq-search>span{
  color:#8b9b95;
  font-size:19px;
}
.gkq-search input{
  width:100%;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  color:#274f43;
  font-weight:700;
}
.gkq-library-controls select{
  height:42px;
  min-width:118px;
  border:2px solid #dce7e2;
  border-radius:12px;
  background:#fff;
  padding:0 10px;
  color:#3f6056;
  font-weight:800;
}
.gkq-cards{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:16px!important;
}
.gkq-card{
  grid-template-columns:108px minmax(0,1fr)!important;
  min-height:174px;
  padding:13px!important;
}
.gkq-card-board{
  align-self:start;
  width:108px;
}
.gkq-card h3{
  margin-top:5px!important;
}
.gkq-card-actions{
  margin-top:10px!important;
}
.gkq-card-actions .gkq-btn{
  min-height:36px;
  padding:7px 9px!important;
  font-size:11px;
}

/* ---------- Constructor: denser, clearer, easier with 36 questions ---------- */
.gkq-builder{
  width:min(1500px,calc(100vw - 24px))!important;
  max-height:96dvh!important;
}
.gkq-builder-head{
  min-height:76px!important;
  padding:14px 20px!important;
}
.gkq-builder-head h2{
  font-size:32px!important;
}
.gkq-builder-grid{
  grid-template-columns:minmax(0,1fr) 340px!important;
  height:calc(96dvh - 146px)!important;
}
.gkq-builder-form{
  padding:16px 18px!important;
}
.gkq-builder-preview{
  padding:18px!important;
}
.gkq-preview-board{
  width:min(250px,100%)!important;
}
.gkq-preview-team-box{
  padding:9px!important;
}
.gkq-preview-team .gkq-token{
  width:42px!important;
  height:42px!important;
}
.gkq-form-section{
  padding:16px!important;
  margin-bottom:12px!important;
  border-radius:17px!important;
}
.gkq-section-title{
  margin-bottom:12px!important;
}
.gkq-section-title>span{
  width:32px!important;
  height:32px!important;
}
.gkq-section-title h3{
  font-size:21px!important;
}
.gkq-form-section input,
.gkq-form-section select{
  min-height:45px!important;
}
.gkq-quick textarea{
  height:170px!important;
}
.gkq-question-section{
  padding:0!important;
  overflow:hidden;
}
.gkq-question-section>.gkq-section-title{
  padding:16px 16px 0;
}
.gkq-question-toolbar{
  position:sticky;
  top:0;
  z-index:8;
  min-height:55px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:9px 14px;
  border-top:1px solid #e4ece8;
  border-bottom:1px solid #dce7e2;
  background:rgba(249,252,250,.96);
  backdrop-filter:blur(7px);
}
.gkq-question-toolbar>strong{
  color:#49665c;
  font-size:13px;
}
.gkq-add-question-top{
  width:auto!important;
  min-height:38px!important;
  margin:0!important;
  padding:7px 12px!important;
  border-style:solid!important;
}
.gkq-question-list{
  padding:10px 12px 14px;
  gap:8px!important;
}
.gkq-question-row{
  grid-template-columns:38px minmax(0,1fr) 32px!important;
  padding:10px!important;
  gap:9px!important;
  border-radius:13px!important;
}
.gkq-question-fields{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  gap:9px 12px!important;
}
.gkq-question-fields>label{
  margin:0!important;
}
.gkq-question-fields textarea{
  min-height:66px!important;
  height:66px;
  padding:9px 10px!important;
  font-size:13px!important;
}
.gkq-question-media-edit{
  grid-column:1/-1;
  min-height:42px;
  padding:6px 8px!important;
}
.gkq-question-media-edit [data-q-media-preview]{
  min-height:24px;
  max-width:none!important;
}
.gkq-question-media-edit img,
.gkq-question-media-edit video{
  max-height:70px!important;
}
.gkq-question-delete{
  width:30px!important;
  height:30px!important;
}
.gkq-builder-footer{
  min-height:70px!important;
  padding:11px 18px!important;
}
.gkq-builder-save-actions{
  display:flex;
  align-items:center;
  gap:8px;
}
.gkq-builder-save-actions [hidden]{
  display:none!important;
}
.gkq-builder-save-actions .gkq-btn{
  min-width:130px;
}
.gkq-builder-save-actions [data-gkq-save-primary]{
  min-width:190px;
}

/* Published game editing visually communicates update, not republishing. */
.gkq-builder[data-editing-id]:not([data-editing-id="0"]) .gkq-state-pill{
  box-shadow:inset 0 0 0 1px rgba(216,183,95,.35);
}

@media(max-width:1220px){
  .gkq-cards{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .gkq-library-tools{
    align-items:flex-start;
    flex-direction:column;
  }
  .gkq-library-controls{
    width:100%;
  }
  .gkq-search{
    flex:1 1 auto;
  }
}
@media(max-width:850px){
  .gkq-create-card{
    grid-template-columns:1fr auto!important;
    grid-template-areas:
      "eyebrow board"
      "title board"
      "copy board"
      "button button"!important;
  }
  .gkq-create-card .gkq-create-button{
    margin-top:12px!important;
    width:100%!important;
  }
  .gkq-cards{
    grid-template-columns:1fr!important;
  }
  .gkq-question-fields{
    grid-template-columns:1fr!important;
  }
  .gkq-question-media-edit{
    grid-column:1;
  }
}
@media(max-width:560px){
  .gkq-library-controls{
    display:grid;
    grid-template-columns:1fr;
  }
  .gkq-search{
    min-width:0;
  }
  .gkq-create-card{
    grid-template-columns:1fr!important;
    grid-template-areas:
      "eyebrow"
      "title"
      "copy"
      "button"!important;
  }
  .gkq-create-card .gkq-mini-board{
    display:none!important;
  }
}


/* ==========================================================
   Kreuz & Quer 0.1.12 — library layout repair
   ========================================================== */

/* Full-width breakout that remains centered in the viewport. */
.gkq-app[data-gkq-app]:not(.gkq-public-app){
  display:block!important;
  width:min(1380px,calc(100vw - 32px))!important;
  min-width:0!important;
  max-width:none!important;
  margin-left:50%!important;
  margin-right:0!important;
  transform:translateX(-50%)!important;
  overflow:visible!important;
}

/* Theme CSS must not hide plugin headings. */
.gkq-page-intro-copy h1{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  height:auto!important;
  max-height:none!important;
  overflow:visible!important;
}
.gkq-library-head h2{
  display:block!important;
  margin:3px 0 7px!important;
  font-family:Georgia,serif!important;
  font-size:clamp(28px,3vw,40px)!important;
  line-height:1.04!important;
  font-weight:700!important;
  color:#fff!important;
}

/* Main flow */
.gkq-workbench{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
}
.gkq-library,
.gkq-create-card,
.gkq-library-head,
.gkq-library-tools,
.gkq-cards{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
}

/* Creation block stays horizontal on desktop but can never squeeze the library. */
.gkq-create-card{
  grid-template-columns:minmax(0,1fr) 120px minmax(220px,280px)!important;
  gap:20px!important;
}
.gkq-create-card .gkq-mini-board{
  width:112px!important;
}
.gkq-create-card .gkq-create-button{
  min-width:0!important;
  width:100%!important;
}

/* Toolbar wraps naturally instead of forcing everything into one narrow row. */
.gkq-library-tools{
  flex-wrap:wrap!important;
  align-items:center!important;
}
.gkq-library-tools .gkq-filters{
  flex:1 1 560px!important;
  min-width:0!important;
}
.gkq-library-controls{
  flex:1 1 360px!important;
  min-width:280px!important;
  justify-content:flex-end!important;
}
.gkq-search{
  flex:1 1 230px!important;
  min-width:180px!important;
  max-width:420px!important;
}

/* Critical repair:
   never force three columns into a narrow WordPress content wrapper.
   The grid chooses 1/2/3 columns from the REAL available width. */
.gkq-cards{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr))!important;
  align-items:start!important;
  gap:16px!important;
}

/* Cards remain readable even if the theme gives the plugin only ~600px. */
.gkq-card{
  width:100%!important;
  min-width:0!important;
  grid-template-columns:122px minmax(0,1fr)!important;
  gap:16px!important;
  min-height:176px!important;
  padding:14px!important;
}
.gkq-card-board{
  width:122px!important;
  max-width:100%!important;
}
.gkq-card-body{
  min-width:0!important;
  overflow:visible!important;
}
.gkq-card h3{
  display:block!important;
  width:auto!important;
  min-width:0!important;
  max-width:none!important;
  margin:5px 0 5px!important;
  font-size:20px!important;
  line-height:1.15!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  hyphens:auto;
}
.gkq-card p{
  line-height:1.4!important;
}
.gkq-card-meta,
.gkq-card-facts,
.gkq-card-actions{
  min-width:0!important;
}
.gkq-card-actions{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:7px!important;
}
.gkq-card-actions .gkq-btn{
  width:auto!important;
  min-width:0!important;
  white-space:nowrap!important;
}

/* Medium desktop / constrained theme wrapper */
@media(max-width:1100px){
  .gkq-app[data-gkq-app]:not(.gkq-public-app){
    width:calc(100vw - 24px)!important;
  }
  .gkq-create-card{
    grid-template-columns:minmax(0,1fr) 108px!important;
    grid-template-areas:
      "eyebrow board"
      "title board"
      "copy board"
      "button button"!important;
  }
  .gkq-create-card .gkq-create-button{
    margin-top:4px!important;
  }
}

/* If a theme still constrains the visual area, stay elegant rather than collapsing. */
@media(max-width:760px){
  .gkq-library-tools{
    display:grid!important;
    grid-template-columns:1fr!important;
  }
  .gkq-library-controls{
    width:100%!important;
    min-width:0!important;
    justify-content:stretch!important;
  }
  .gkq-search{
    max-width:none!important;
  }
  .gkq-cards{
    grid-template-columns:1fr!important;
  }
}

@media(max-width:540px){
  .gkq-card{
    grid-template-columns:92px minmax(0,1fr)!important;
    gap:11px!important;
    padding:11px!important;
  }
  .gkq-card-board{
    width:92px!important;
  }
  .gkq-card h3{
    font-size:17px!important;
  }
  .gkq-create-card{
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-areas:
      "eyebrow"
      "title"
      "copy"
      "button"!important;
  }
  .gkq-create-card .gkq-mini-board{
    display:none!important;
  }
}


/* ==========================================================
   Kreuz & Quer 0.1.13 — modal/scroll root-cause fix
   ========================================================== */

/*
 * IMPORTANT:
 * Never transform the plugin root. A transform creates a containing block
 * for position:fixed descendants and was trapping the game modal inside
 * the page section instead of the browser viewport.
 */
.gkq-app[data-gkq-app]:not(.gkq-public-app){
  transform:none!important;
  position:relative!important;
  left:auto!important;

  width:min(1380px,calc(100vw - 32px))!important;
  max-width:none!important;

  /* Break out of a narrow WP content column WITHOUT transform. */
  margin-left:calc(50% - min(690px, calc(50vw - 16px)))!important;
  margin-right:0!important;

  overflow:visible!important;
}

/* Overlay is now truly viewport-fixed and is itself scrollable as a fallback. */
.gkq-overlay,
.gkq-game-overlay{
  position:fixed!important;
  inset:0!important;
  top:0!important;
  right:0!important;
  bottom:0!important;
  left:0!important;

  width:100vw!important;
  height:100dvh!important;
  max-width:none!important;
  max-height:none!important;

  margin:0!important;
  transform:none!important;

  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  scrollbar-gutter:stable;
}

/* Game modal always fits inside the real viewport. */
.gkq-game-overlay{
  padding:8px!important;
  display:flex!important;
  align-items:flex-start!important;
  justify-content:center!important;
}

.gkq-game-modal{
  flex:0 0 auto!important;
  width:min(1480px,calc(100vw - 16px))!important;
  height:calc(100dvh - 16px)!important;
  min-height:0!important;
  max-height:calc(100dvh - 16px)!important;
  margin:0 auto!important;
  overflow:hidden!important;
}

/* Setup gets its own reliable vertical scroller. */
.gkq-setup{
  min-height:0!important;
  height:100%!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  scrollbar-gutter:stable!important;
  -webkit-overflow-scrolling:touch;
  padding-bottom:28px!important;
}

/* Match stays fitted to the viewport; no accidental page-height expansion. */
.gkq-match{
  min-height:0!important;
  overflow:hidden!important;
}

/* Builder/share/rules overlays also remain usable on short screens. */
.gkq-builder{
  max-height:calc(100dvh - 20px)!important;
}
.gkq-rules-modal,
.gkq-share-modal,
.gkq-report-modal{
  max-height:calc(100dvh - 24px)!important;
  overflow:auto!important;
}

/* When body is locked, the viewport overlay remains the scrolling surface. */
html.gkq-lock,
body.gkq-lock{
  overflow:hidden!important;
  height:100%!important;
}

/* Desktop widths */
@media(min-width:981px){
  .gkq-game-overlay{
    overflow-y:auto!important;
  }
}

/* Mobile: normal full-width breakout without transform as well. */
@media(max-width:980px){
  .gkq-app[data-gkq-app]:not(.gkq-public-app){
    width:calc(100vw - 16px)!important;
    margin-left:calc(50% - calc(50vw - 8px))!important;
  }
  .gkq-game-overlay{
    padding:6px!important;
    overflow-y:auto!important;
  }
  .gkq-game-modal{
    width:calc(100vw - 12px)!important;
    height:auto!important;
    min-height:calc(100dvh - 12px)!important;
    max-height:none!important;
    overflow:visible!important;
  }
}


/* 0.1.15: retain rules presentation only; library/cards/buttons stay on 0.1.13 visuals */
/* ---------- Compact start-screen rules ---------- */
.gkq-rules-compact{
  padding:18px!important;
  border:1px solid #cfe0d9!important;
  border-radius:20px!important;
  background:
    radial-gradient(circle at 90% 8%,rgba(225,187,80,.14),transparent 25%),
    linear-gradient(145deg,#f8fcfa,#edf7f2)!important;
  box-shadow:0 10px 24px rgba(7,75,56,.065)!important;
}
.gkq-rules-compact-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:13px;
}
.gkq-rules-compact-head span{
  display:block;
  color:#9a7323;
  font-size:9px;
  font-weight:950;
  letter-spacing:.15em;
}
.gkq-rules-compact-head h3{
  margin:2px 0 0!important;
  font-family:Georgia,serif;
  font-size:24px!important;
  color:#114f3d;
}
.gkq-win-mini{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.gkq-win-mini b{
  padding:6px 8px;
  border:1px solid #dec05e;
  border-radius:999px;
  background:#fff8dc;
  color:#70530e;
  font-size:9px;
  white-space:nowrap;
}
.gkq-rule-steps{
  display:grid;
  gap:8px;
}
.gkq-rule-steps>div{
  display:grid;
  grid-template-columns:30px minmax(0,1fr);
  gap:9px;
  align-items:center;
  padding:8px 9px;
  border:1px solid #dbe7e2;
  border-radius:12px;
  background:rgba(255,255,255,.72);
}
.gkq-rule-steps i{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:9px;
  background:#0c7052;
  color:#fff;
  font-style:normal;
  font-weight:950;
  font-size:11px;
}
.gkq-rule-steps p,
.gkq-rule-goal p{
  margin:0!important;
  display:grid;
  gap:2px;
}
.gkq-rule-steps strong,
.gkq-rule-goal strong{
  font-size:12px;
  color:#214d40;
}
.gkq-rule-steps small,
.gkq-rule-goal small{
  color:#657b73;
  font-size:10px;
  line-height:1.35;
}
.gkq-rule-goal{
  margin-top:9px;
  display:grid;
  grid-template-columns:32px minmax(0,1fr);
  gap:9px;
  align-items:center;
  padding:9px 10px;
  border:1px solid #dfc15b;
  border-radius:12px;
  background:linear-gradient(135deg,#fff9e1,#fff2b9);
}
.gkq-rule-goal>span{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#d9aa2f;
  color:#fff;
  font-size:15px;
}

/* ---------- Full rules modal ---------- */
.gkq-rules-dialog{
  width:min(820px,calc(100vw - 28px))!important;
  max-height:calc(100dvh - 28px)!important;
  margin:14px auto!important;
  padding:0!important;
  overflow:auto!important;
  border:1px solid #d7c073!important;
  border-radius:26px!important;
  background:#fffdf8!important;
  box-shadow:0 30px 80px rgba(3,44,33,.28)!important;
}
.gkq-rules-header{
  position:sticky;
  top:0;
  z-index:3;
  padding:20px 22px 18px;
  align-items:flex-start!important;
  background:
    radial-gradient(circle at 88% 20%,rgba(239,205,105,.16),transparent 27%),
    linear-gradient(135deg,#0b684d,#074733)!important;
  border-bottom:1px solid rgba(255,255,255,.12);
}
.gkq-rules-header span{
  color:#efd27d!important;
}
.gkq-rules-header h2{
  color:#fff!important;
  font-size:34px!important;
}
.gkq-rules-header p{
  margin:5px 0 0;
  color:#dcece6;
  font-size:13px;
}
.gkq-rules-header .gkq-close{
  flex:0 0 auto;
}
.gkq-rules-goal{
  margin:18px 20px 14px;
  padding:16px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:18px;
  align-items:center;
  border:1px solid #e0c261;
  border-radius:18px;
  background:linear-gradient(135deg,#fff9df,#fff1b7);
}
.gkq-rules-goal-copy{
  display:grid;
  gap:4px;
}
.gkq-rules-goal-copy span{
  color:#8d691a;
  font-size:9px;
  font-weight:950;
  letter-spacing:.15em;
}
.gkq-rules-goal-copy strong{
  color:#174d3d;
  font-family:Georgia,serif;
  font-size:20px;
  line-height:1.2;
}
.gkq-win-rule-cards{
  display:flex;
  gap:8px;
}
.gkq-win-rule-cards>div{
  min-width:105px;
  display:grid;
  place-items:center;
  padding:9px 12px;
  border:1px solid #d8b544;
  border-radius:14px;
  background:#fffdf5;
  box-shadow:0 5px 12px rgba(139,100,14,.08);
}
.gkq-win-rule-cards b{
  color:#8a6819;
  font-size:9px;
}
.gkq-win-rule-cards strong{
  color:#0b684d;
  font-family:Georgia,serif;
  font-size:30px;
  line-height:1;
}
.gkq-win-rule-cards small{
  color:#697c75;
  font-size:9px;
}
.gkq-rules-flow{
  padding:0 20px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
}
.gkq-rules-flow article{
  min-height:104px;
  display:grid;
  grid-template-columns:36px minmax(0,1fr);
  gap:10px;
  padding:12px;
  border:1px solid #dce8e3;
  border-radius:15px;
  background:#fbfdfc;
}
.gkq-rules-flow article:last-child{
  grid-column:1/-1;
  min-height:84px;
}
.gkq-rules-flow i{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:linear-gradient(145deg,#0d7958,#07513c);
  color:#fff;
  font-style:normal;
  font-weight:950;
  box-shadow:0 5px 11px rgba(7,81,60,.14);
}
.gkq-rules-flow strong{
  display:block;
  margin-bottom:4px;
  color:#184d3e;
  font-size:13px;
}
.gkq-rules-flow p{
  margin:0;
  color:#60766e;
  font-size:11px;
  line-height:1.45;
}
.gkq-rules-bottom{
  margin:14px 20px 20px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
}
.gkq-rules-bottom>div{
  display:grid;
  gap:4px;
  padding:11px 12px;
  border-radius:13px;
  background:#eef7f3;
  border:1px solid #d3e4dc;
}
.gkq-rules-bottom span{
  color:#9a7426;
  font-size:8px;
  font-weight:950;
  letter-spacing:.13em;
}
.gkq-rules-bottom strong{
  color:#31584c;
  font-size:10px;
  line-height:1.35;
}

/* responsive rules */
@media(max-width:680px){
  .gkq-rules-goal{
    grid-template-columns:1fr;
  }
  .gkq-win-rule-cards{
    justify-content:stretch;
  }
  .gkq-win-rule-cards>div{
    flex:1 1 0;
    min-width:0;
  }
  .gkq-rules-flow{
    grid-template-columns:1fr;
  }
  .gkq-rules-flow article:last-child{
    grid-column:auto;
  }
  .gkq-rules-bottom{
    grid-template-columns:1fr;
  }
}

/* ==========================================================
   Kreuz & Quer 0.1.16 — confident modern library redesign
   Thick, intentional borders; restrained Germannika palette.
   ========================================================== */

/* Page atmosphere */
.gkq-app[data-gkq-app]:not(.gkq-public-app){
  --gkq16-deep:#103f34;
  --gkq16-deeper:#0a3028;
  --gkq16-green:#14644f;
  --gkq16-cream:#fbf8ef;
  --gkq16-paper:#ffffff;
  --gkq16-line:#c5d8d0;
  --gkq16-line-strong:#8eaca0;
  --gkq16-gold:#d3ad45;
  --gkq16-ink:#173f34;
  --gkq16-muted:#60786f;
}

.gkq-page-intro{
  position:relative;
  padding:10px 2px 18px!important;
  margin:24px 0 16px!important;
}
.gkq-page-intro>a{
  display:inline-flex!important;
  align-items:center;
  min-height:42px;
  width:max-content!important;
  padding:8px 14px!important;
  border:3px solid var(--gkq16-line)!important;
  border-radius:14px!important;
  background:#fff!important;
  color:var(--gkq16-deep)!important;
  font-weight:900!important;
  text-decoration:none!important;
  box-shadow:0 7px 18px rgba(16,63,52,.08)!important;
}
.gkq-page-intro>a:hover{
  border-color:var(--gkq16-line-strong)!important;
  transform:translateY(-1px);
}
.gkq-page-intro-copy>span{
  color:#8d6a1e!important;
  font-size:11px!important;
  font-weight:950!important;
  letter-spacing:.16em!important;
}
.gkq-page-intro-copy h1{
  margin-top:4px!important;
  color:var(--gkq16-deep)!important;
  font-size:clamp(44px,5vw,68px)!important;
  line-height:.98!important;
  letter-spacing:-.035em!important;
}
.gkq-page-intro-copy p{
  max-width:850px!important;
  color:#526c63!important;
  font-size:17px!important;
  font-weight:650!important;
}

/* Library hero: strong silhouette instead of thin outlined box */
.gkq-library-head{
  position:relative;
  overflow:hidden;
  min-height:166px!important;
  padding:30px 32px!important;
  border:3px solid var(--gkq16-deeper)!important;
  border-radius:30px!important;
  background:
    radial-gradient(circle at 86% 16%,rgba(220,181,73,.22),transparent 22%),
    radial-gradient(circle at 74% 76%,rgba(255,255,255,.08),transparent 28%),
    linear-gradient(135deg,#175f4c 0%,#0f493c 54%,#092f28 100%)!important;
  box-shadow:0 24px 52px rgba(8,47,39,.18)!important;
}
.gkq-library-head::after{
  content:"";
  position:absolute;
  right:-70px;
  bottom:-90px;
  width:260px;
  height:260px;
  border:22px solid rgba(255,255,255,.055);
  border-radius:50%;
  pointer-events:none;
}
.gkq-library-head>div{
  position:relative;
  z-index:1;
  max-width:820px;
}
.gkq-library-head>div>span{
  color:#f0d27b!important;
  font-size:11px!important;
  letter-spacing:.19em!important;
  font-weight:950!important;
}
.gkq-library-head h2{
  margin:5px 0 9px!important;
  font-size:clamp(34px,3.4vw,48px)!important;
  line-height:1!important;
  letter-spacing:-.025em!important;
}
.gkq-library-head p{
  max-width:720px!important;
  color:#dcebe5!important;
  font-size:15px!important;
  line-height:1.55!important;
  font-weight:650!important;
}

/* Rules trigger: bold, obvious, not a floating thin question mark */
.gkq-help-chip{
  position:relative;
  z-index:2;
  width:auto!important;
  min-width:126px!important;
  height:52px!important;
  padding:0 15px 0 9px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:9px!important;
  flex:0 0 auto!important;
  border:3px solid #e0ba50!important;
  border-radius:16px!important;
  background:#fffaf0!important;
  color:var(--gkq16-deep)!important;
  box-shadow:0 10px 24px rgba(0,0,0,.18)!important;
  cursor:pointer!important;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease!important;
}
.gkq-help-chip>span{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:var(--gkq16-deep);
  color:#fff;
  font-family:Arial,sans-serif;
  font-size:24px;
  line-height:1;
  font-weight:1000;
}
.gkq-help-chip>strong{
  font-size:13px;
  font-weight:950;
  letter-spacing:.02em;
}
.gkq-help-chip:hover{
  transform:translateY(-2px)!important;
  background:#fff4d8!important;
  box-shadow:0 14px 30px rgba(0,0,0,.20)!important;
}

/* Filters/search: one cohesive control deck with real weight */
.gkq-library-tools{
  margin:18px 0 20px!important;
  padding:14px!important;
  border:3px solid var(--gkq16-line)!important;
  border-radius:22px!important;
  background:linear-gradient(180deg,#ffffff,#f8fbf9)!important;
  box-shadow:0 10px 26px rgba(16,63,52,.07)!important;
}
.gkq-filters{
  gap:9px!important;
}
.gkq-filters button{
  min-height:42px!important;
  padding:8px 15px!important;
  border:3px solid #c8d8d2!important;
  border-radius:13px!important;
  background:#fff!important;
  color:#3e5d53!important;
  font-size:12px!important;
  font-weight:900!important;
  box-shadow:none!important;
  transition:transform .15s ease,border-color .15s ease,background .15s ease!important;
}
.gkq-filters button:hover{
  transform:translateY(-1px);
  border-color:#8eaca0!important;
  background:#f6faf8!important;
}
.gkq-filters button.is-active{
  border-color:var(--gkq16-deep)!important;
  background:var(--gkq16-deep)!important;
  color:#fff!important;
  box-shadow:0 6px 14px rgba(16,63,52,.15)!important;
}
.gkq-search,
.gkq-library-controls select{
  min-height:44px!important;
  border:3px solid #c8d8d2!important;
  border-radius:13px!important;
  background:#fff!important;
  box-shadow:none!important;
}
.gkq-search{
  padding:0 12px!important;
}
.gkq-search:focus-within,
.gkq-library-controls select:focus{
  border-color:#719487!important;
  box-shadow:0 0 0 4px rgba(113,148,135,.12)!important;
}
.gkq-search>span{
  color:var(--gkq16-deep)!important;
  font-size:22px!important;
  font-weight:950!important;
}
.gkq-search input,
.gkq-library-controls select{
  color:#294e42!important;
  font-weight:850!important;
}

/* Game cards: editorial, substantial, neutral — no rainbow action row */
.gkq-cards{
  gap:20px!important;
}
.gkq-card{
  position:relative;
  overflow:hidden;
  padding:16px!important;
  border:3px solid var(--gkq16-line)!important;
  border-radius:26px!important;
  background:linear-gradient(150deg,#fff 0%,#fff 62%,#f7faf8 100%)!important;
  box-shadow:0 12px 28px rgba(16,63,52,.08)!important;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease!important;
}
.gkq-card::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:6px;
  background:linear-gradient(90deg,var(--gkq16-deep),#2d7861 68%,#d8b34c 68%,#d8b34c 100%);
}
.gkq-card:hover{
  transform:translateY(-3px)!important;
  border-color:#7ea194!important;
  box-shadow:0 18px 36px rgba(16,63,52,.13)!important;
}
.gkq-card-board{
  border:4px solid var(--gkq16-deep)!important;
  border-radius:21px!important;
  background:linear-gradient(145deg,#fffdf6,#eef6f1)!important;
  box-shadow:inset 0 0 0 4px rgba(211,173,69,.22),0 8px 20px rgba(16,63,52,.10)!important;
}
.gkq-card-board i{
  border:2px solid rgba(16,63,52,.18)!important;
}
.gkq-card-meta{
  align-items:center!important;
  gap:10px!important;
}
.gkq-card-meta span,
.gkq-card-meta em{
  display:inline-flex!important;
  align-items:center!important;
  min-height:25px!important;
  padding:4px 8px!important;
  border-radius:8px!important;
  font-size:9px!important;
  font-weight:950!important;
  letter-spacing:.08em!important;
}
.gkq-card-meta span{
  background:#eaf4ef!important;
  color:#1c604b!important;
}
.gkq-card-meta em{
  background:#f5f0df!important;
  color:#785d1e!important;
}
.gkq-card h3{
  margin:8px 0 5px!important;
  color:var(--gkq16-ink)!important;
  font-size:21px!important;
  line-height:1.12!important;
  letter-spacing:-.018em!important;
}
.gkq-card p{
  color:var(--gkq16-muted)!important;
  font-size:13px!important;
  font-weight:650!important;
}
.gkq-card-facts{
  gap:7px!important;
}
.gkq-card-facts span{
  padding:6px 9px!important;
  border:0!important;
  border-radius:9px!important;
  background:#edf4f0!important;
  color:#4f6a61!important;
  font-size:10px!important;
  font-weight:850!important;
}
.gkq-card-actions{
  gap:8px!important;
  margin-top:13px!important;
}
.gkq-card-actions .gkq-btn{
  min-height:38px!important;
  padding:8px 11px!important;
  border:3px solid #b8ccc4!important;
  border-radius:11px!important;
  background:#fff!important;
  color:#31584c!important;
  font-size:11px!important;
  font-weight:950!important;
  box-shadow:none!important;
}
.gkq-card-actions .gkq-btn:hover{
  border-color:#789b8e!important;
  background:#f4f8f6!important;
  transform:translateY(-1px);
}
.gkq-card-actions .gkq-btn-primary{
  border-color:var(--gkq16-deep)!important;
  background:var(--gkq16-deep)!important;
  color:#fff!important;
  box-shadow:0 7px 15px rgba(16,63,52,.14)!important;
}
.gkq-card-actions .gkq-btn-primary:hover{
  border-color:#082d25!important;
  background:#082d25!important;
}
.gkq-card-actions .gkq-btn-gold,
.gkq-card-actions .gkq-btn-report,
.gkq-card-actions .gkq-btn-light{
  border-color:#b8ccc4!important;
  background:#fff!important;
  color:#31584c!important;
}

/* Creation strip: bold frame + one clear CTA */
.gkq-create-card{
  position:relative!important;
  overflow:hidden!important;
  border:3px solid #b7973b!important;
  border-radius:26px!important;
  background:
    radial-gradient(circle at 82% 18%,rgba(211,173,69,.16),transparent 20%),
    linear-gradient(135deg,#fffdf7,#f6f0dd)!important;
  box-shadow:0 14px 32px rgba(99,78,24,.10)!important;
}
.gkq-create-card::before{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  width:8px;
  background:var(--gkq16-deep);
}
.gkq-create-card>span{
  color:#8c681d!important;
  font-weight:950!important;
}
.gkq-create-card>h2{
  color:var(--gkq16-deep)!important;
  font-size:30px!important;
}
.gkq-create-card>p{
  color:#63776f!important;
  font-weight:650!important;
}
.gkq-create-card .gkq-mini-board{
  border:4px solid var(--gkq16-deep)!important;
  box-shadow:inset 0 0 0 4px rgba(211,173,69,.20),0 8px 18px rgba(16,63,52,.10)!important;
}
.gkq-create-card .gkq-mini-board i{
  border:2px solid rgba(16,63,52,.18)!important;
}
.gkq-create-card .gkq-create-button{
  min-height:50px!important;
  border:3px solid var(--gkq16-deep)!important;
  border-radius:14px!important;
  background:var(--gkq16-deep)!important;
  color:#fff!important;
  box-shadow:0 10px 20px rgba(16,63,52,.17)!important;
}
.gkq-create-card .gkq-create-button:hover{
  background:#082f27!important;
  border-color:#082f27!important;
  transform:translateY(-2px);
}

/* Empty state gets an intentional thick frame instead of a dashed placeholder look. */
.gkq-empty{
  min-height:180px!important;
  border:3px solid #c5d8d0!important;
  border-radius:24px!important;
  background:#f8fbf9!important;
  color:#5c746b!important;
  font-weight:800!important;
}

/* Rules surfaces: no thin hairlines */
.gkq-rules-compact{
  border:3px solid #bfd2ca!important;
  border-radius:22px!important;
  box-shadow:0 12px 28px rgba(16,63,52,.08)!important;
}
.gkq-win-mini b,
.gkq-rule-steps>div,
.gkq-rule-goal{
  border-width:3px!important;
}
.gkq-rule-steps>div{
  border-color:#cfddd7!important;
  border-radius:14px!important;
}
.gkq-rule-goal{
  border-color:#d2ae48!important;
  border-radius:14px!important;
}
.gkq-rules-dialog{
  border:3px solid #a9862e!important;
  border-radius:28px!important;
  box-shadow:0 34px 88px rgba(3,44,33,.32)!important;
}
.gkq-rules-header{
  border-bottom:3px solid rgba(255,255,255,.13)!important;
}
.gkq-rules-goal,
.gkq-win-rule-cards>div,
.gkq-rules-flow article,
.gkq-rules-bottom>div{
  border-width:3px!important;
}
.gkq-rules-goal{border-color:#d4b14f!important}
.gkq-win-rule-cards>div{border-color:#d0ac43!important}
.gkq-rules-flow article{border-color:#cfddd7!important}
.gkq-rules-bottom>div{border-color:#c5d8d0!important}

/* Mobile */
@media(max-width:760px){
  .gkq-library-head{
    min-height:0!important;
    padding:24px 22px!important;
    border-radius:24px!important;
    flex-direction:column!important;
    align-items:flex-start!important;
  }
  .gkq-help-chip{
    min-width:118px!important;
    height:48px!important;
  }
  .gkq-library-tools{
    padding:12px!important;
    border-radius:18px!important;
  }
  .gkq-filters button{
    min-height:40px!important;
    padding:7px 12px!important;
  }
}

@media(max-width:540px){
  .gkq-page-intro-copy h1{
    font-size:44px!important;
  }
  .gkq-card{
    border-radius:21px!important;
  }
  .gkq-card-actions .gkq-btn{
    flex:1 1 auto!important;
    justify-content:center!important;
  }
}


/* ==========================================================
   Kreuz & Quer 0.1.17 — constructor entry border
   Fuchsrad gold/orange language; no layout changes
   ========================================================== */
.gkq-create-card{
  border:4px solid #d9a62f!important;
  box-shadow:
    0 16px 36px rgba(157,98,13,.15),
    inset 0 0 0 2px rgba(241,201,93,.24)!important;
}
.gkq-create-card::before{
  width:10px!important;
  background:linear-gradient(180deg,#f1c95d 0%,#d28b16 100%)!important;
}
