@font-face{font-family:Labrada;src:url('/assets/zabawy/fonts/labrada-regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:WeddingSerif;src:url('/templates/postcard/assets/fonts/ebgaramond-latin.woff2') format('woff2');font-display:swap;unicode-range:U+0000-00FF,U+2013-2014,U+2018-2019,U+201C-201D,U+2026}
@font-face{font-family:WeddingSerif;src:url('/templates/postcard/assets/fonts/ebgaramond-latin-ext.woff2') format('woff2');font-display:swap;unicode-range:U+0100-024F,U+1E00-1EFF}
@font-face{font-family:WeddingScript;src:url('/templates/postcard/assets/fonts/labelleaurore-400-latin.woff2') format('woff2');font-display:swap;unicode-range:U+0000-00FF,U+2013-2014,U+2018-2019,U+201C-201D,U+2026}
@font-face{font-family:WeddingScript;src:url('/templates/postcard/assets/fonts/labelleaurore-400-latin-ext.woff2') format('woff2');font-display:swap;unicode-range:U+0100-024F,U+1E00-1EFF}
:root{color-scheme:light;--ink:#394053;--cream:#e9e3d7;--blue:#535c74;--stripe:#747b8c;font-family:Arial,sans-serif;color:var(--ink);background:#f6f5f1}
*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,input:focus-visible{outline:3px solid #97753e;outline-offset:3px}[hidden]{display:none!important}
/* Logo ma w SVG preserveAspectRatio="none": każde pudełko o innych proporcjach niż 99×85 je rozciąga.
   Dlatego ustawiamy tylko wysokość, a szerokość liczy się sama z proporcji pliku. */
.app-header{height:86px;border-bottom:1px solid #dedfdc;display:flex;align-items:center;justify-content:space-between;padding:0 4vw;gap:20px}.app-header img{display:block;width:auto;height:48px}.app-header span{font-size:12px;color:#626874}
.workspace{display:grid;grid-template-columns:340px minmax(0,1fr);max-width:1510px;margin:auto;gap:50px;padding:36px 4vw 60px}.editor h1{font:42px/1.06 WeddingSerif,Georgia,serif;font-weight:400;margin:0 0 16px}.editor>p{font-size:14px;line-height:1.6;margin-bottom:28px}.editor label{display:block;font-size:12px;margin-bottom:7px}.editor input{width:100%;border:1px solid #c7cad0;border-radius:3px;padding:10px 11px;background:#fff;color:var(--ink);min-height:42px}.editor input:invalid:not(:placeholder-shown){border-color:#c7cad0}
.words-heading{display:flex;align-items:center;justify-content:space-between;margin-top:28px}.words-heading h2{font-size:16px;margin:0}.words-heading span{font-size:12px}.help{font-size:12px!important;line-height:1.5!important;color:#626874;margin:10px 0 20px!important}
.entry{position:relative;padding:0 28px 17px 0;margin-bottom:15px;border:0;border-bottom:1px solid #dedfdc;min-width:0}.entry legend{font-size:11px;color:#626874;padding:0;margin-bottom:8px}.entry input+label{margin-top:9px}.entry .remove{position:absolute;right:-4px;top:4px;background:none;border:0;font-size:21px;color:var(--ink);padding:4px}.entry .letter-count{float:right;color:#626874}
.primary,.secondary{border:1px solid #a8afbc;padding:11px 14px;border-radius:3px;min-height:42px;background:transparent;color:var(--ink);font-size:13px}.primary{display:block;background:var(--ink);color:#fff;border-color:var(--ink);width:100%;margin-top:16px}.primary:hover{background:#535e76}.secondary:hover{background:#e9e9e5}.editor>#status{font-size:13px;line-height:1.5;margin:16px 0;color:#4c5c42}.editor>#status.error{color:#923f30}
.preview{min-width:0}.preview-toolbar{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;margin-bottom:14px}.switcher{display:flex;border-bottom:1px solid #b8bdc6}.switcher button{padding:12px 10px;border:0;border-bottom:2px solid transparent;background:transparent;color:#626874;font-size:13px}.switcher button[aria-pressed=true]{border-bottom-color:var(--ink);color:var(--ink)}.answers-toggle{font-size:12px;display:flex;align-items:center;gap:6px;cursor:pointer}.answers-toggle input{accent-color:var(--ink);width:17px;height:17px}.print-hint{font-size:11px;color:#626874;line-height:1.5;margin:0 0 22px}#preview-error{padding:18px;background:#f3e5df;font-size:14px;line-height:1.6;border-left:3px solid #923f30}
.paper-wrap{width:100%;max-width:794px;margin:0 auto;container-type:inline-size}
.paper{position:relative;width:100%;aspect-ratio:595/842;background:repeating-linear-gradient(90deg,var(--blue) 0,var(--blue) 4.25%,var(--stripe) 4.25%,var(--stripe) 13.695%);color:var(--cream);box-shadow:0 4px 24px #303d5118;font-family:Labrada,Georgia,serif;print-color-adjust:exact;-webkit-print-color-adjust:exact}
.paper-heading{position:absolute;left:6.05%;top:3.44%;width:64.2%;height:16.2%;text-align:center}
.paper-heading p{font-size:4.034cqw;line-height:1.4;margin:0}
.paper-heading h2{font-family:WeddingScript,cursive;font-weight:400;font-size:10.756cqw;line-height:1.2;margin:0;white-space:nowrap}
#answer-label{position:absolute;top:18.5cqw;width:100%;display:block;font-size:2.35cqw;line-height:1.2}
.decoration{position:absolute;pointer-events:none}.decoration img{position:absolute;width:100%;height:100%;object-fit:fill}
.decoration-top{left:69.58%;top:3.44%;width:24.33%;height:22.12%}.decoration-top img+img{left:1.32%;top:7.41%;width:97.82%;height:89.33%}
.decoration-left{left:5.71%;top:46.97%;width:22.19%;height:19.89%}.decoration-left img+img{left:1.26%;top:2.87%;width:91.62%;height:94.17%}
.decoration-search{display:none;left:59.83%;top:1.43%;width:31.6%;height:17.35%}.decoration-search img+img{left:1.46%;top:5.65%;width:96.75%;height:93.95%}
.board{position:absolute;left:6.05%;top:19.715%;width:87.9%;height:50%;display:flex;align-items:center;justify-content:center}
.board svg{display:block;width:100%;height:100%;overflow:visible}.board rect.cell{fill:var(--cream);stroke:var(--ink);stroke-width:.9}.board text{fill:var(--ink);font-family:Labrada,Georgia,serif}.board text.letter{font-size:25px;text-anchor:middle}.board text.number{font-size:16px;font-family:WeddingScript,cursive}.board .answer-line{stroke:#93654f;stroke-opacity:.35;stroke-width:27;stroke-linecap:round;fill:none}
.clues{position:absolute;left:6.05%;top:73.4%;width:87.9%;height:23.67%;background:var(--cream);color:var(--ink);padding:3.8% 2.69%;overflow-wrap:anywhere}
.clue-columns{display:grid;grid-template-columns:1.12fr 1fr;gap:4%}.clues h3{font-family:WeddingScript,cursive;font-size:3.36cqw;line-height:1.4;font-weight:400;margin:0 0 1.4cqw}.clue-list{list-style:none;padding:0;margin:0;font-size:2.52cqw;line-height:1.43}.clue-list li{margin:0;padding-left:1.4em;text-indent:-1.4em}
.word-list{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(var(--word-rows,3),auto);grid-auto-flow:column;gap:0 3cqw;padding:0;margin:0;font-size:2.52cqw;line-height:1.43}
.paper.is-search .paper-heading{left:8.57%;top:4.51%;width:48.57%;height:13.5%}.paper.is-search .paper-heading h2{font-size:8.067cqw}
.paper.is-search #answer-label{top:15.1cqw}
.paper.is-search .decoration-top,.paper.is-search .decoration-left{display:none}.paper.is-search .decoration-search{display:block}
.paper.is-search .board{top:20.19%;height:57.58%}.paper.is-search .clues{top:80.62%;height:16.19%;padding:4.36% 5.55%}
@media(min-width:1200px){.preview-toolbar{flex-wrap:nowrap}.paper-wrap{max-width:690px}}
@media(max-width:1000px){.workspace{grid-template-columns:290px minmax(0,1fr);gap:24px;padding-left:24px;padding-right:24px}}
@media(max-width:760px){.app-header{height:72px;padding:0 20px}.app-header img{height:40px}.app-header span{font-size:10px}.workspace{display:flex;flex-direction:column;padding:26px 18px;gap:28px}.editor h1{font-size:37px}.preview-toolbar{gap:10px}.print-hint{margin-bottom:16px}}
@page{size:A4 portrait;margin:0}
@media print{
  :root,body{margin:0!important;padding:0!important;background:white}
  .app-header,.editor,.preview-toolbar,.print-hint,#preview-error,noscript{display:none!important}
  .workspace,.preview{display:block;margin:0;padding:0;max-width:none}
  .paper-wrap{width:210mm;max-width:none;margin:0}
  .paper{width:210mm;height:297mm;aspect-ratio:auto;box-shadow:none;break-inside:avoid;overflow:hidden}
  body.print-blocked .paper-wrap{display:none}
  body.print-blocked::before{content:'Najpierw wygeneruj poprawną, kompletną planszę. Wróć do edytora i sprawdź komunikaty.';display:block;padding:20mm;font:16pt Arial,sans-serif}
}
@font-face{font-family:Petrona;src:url('/assets/zabawy/fonts/petrona.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Lato;src:url('/assets/zabawy/fonts/lato.ttf') format('truetype');font-weight:400;font-display:swap}
.editor select,.editor textarea{width:100%;padding:10px;border:1px solid #c7cad0;background:white;color:var(--ink);font:inherit;margin-bottom:14px}.editor textarea{min-height:360px;line-height:1.5}.paper-date{position:absolute;bottom:0;left:6%;width:88%;text-align:center;font-family:WeddingScript,cursive;font-size:2.3cqw;margin:0}
/* Square search board spans exactly the same width as its word list. */
.paper.is-search .board{top:20.19%;height:auto;aspect-ratio:1}.paper.is-search .board svg{max-width:none!important;max-height:none!important}.paper.is-search .clues{top:83.6%;height:13.2%;padding:3% 3.2%}
.decoration-cupid{display:none}
[data-collection=cupid] .paper{background:var(--cream);outline:.0px solid transparent;box-shadow:inset 0 0 0 2.18cqw var(--ink);color:var(--ink);font-family:Petrona,Georgia,serif}
[data-collection=cupid] .decoration-top,[data-collection=cupid] .decoration-left,[data-collection=cupid] .decoration-search{display:none}
[data-collection=cupid] .decoration-cupid{display:block;left:61%;top:4.5%;width:30%;height:16%;background:var(--ink);mask:var(--cupid-image) center/contain no-repeat;-webkit-mask:var(--cupid-image) center/contain no-repeat}
[data-collection=cupid] .paper-heading{left:6%;top:5%;width:52%;height:15%}
[data-collection=cupid] .paper-heading p{font-family:Petrona,Georgia,serif;font-size:3.2cqw}
[data-collection=cupid] .paper-heading h2{font-size:7cqw!important;white-space:normal;line-height:1.15}
[data-collection=cupid] .board text,[data-collection=cupid] .clues{font-family:Petrona,Georgia,serif}
[data-collection=cupid] .board text.number{font-family:WeddingScript,cursive}
[data-collection=cupid] .paper.is-search .board{top:20.19%}
[data-collection=cupid] .clues{background:transparent}
[data-collection=cupid] #answer-label{top:14cqw}
.bingo-heading{position:absolute;top:4%;left:6%;width:88%;text-align:center}.bingo-heading p{font-size:3.2cqw;margin:0 0 1cqw}.bingo-heading h2{font:10.5cqw/1.1 WeddingScript,cursive;margin:0}.bingo-rules{position:absolute;top:22%;left:17%;width:66%;text-align:center;font-size:2.52cqw;line-height:1.35}
.bingo-grid{position:absolute;left:6.05%;top:30.76%;width:87.9%;aspect-ratio:1;background:var(--cream);padding:3.06%;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:repeat(5,minmax(0,1fr));color:var(--ink)}
.bingo-cell{border:1px solid var(--ink);margin-right:-1px;margin-bottom:-1px;display:flex;align-items:center;justify-content:center;text-align:center;padding:5%;font-size:2.08cqw;line-height:1.2;overflow-wrap:anywhere}.bingo-cupid{display:block;width:90%;height:90%;background:var(--ink);mask:url('/assets/figma/logo.svg') center/contain no-repeat;-webkit-mask:url('/assets/figma/logo.svg') center/contain no-repeat}
.bingo-names{position:absolute;top:94%;left:6%;width:88%;text-align:center;font:4cqw/1.2 WeddingScript,cursive;margin:0}
[data-collection=cupid] .bingo-heading{top:14%;left:6.5%;width:25%;text-align:left}
[data-collection=cupid] .bingo-heading p{display:none}
[data-collection=cupid] .bingo-heading h2{font-size:10cqw}
[data-collection=cupid] .bingo-art{position:absolute;left:31.4%;top:4.6%;width:61.8%;height:20.7%;background:var(--ink);mask:url('/assets/zabawy/figma/cupid-rose.svg') center/contain no-repeat;-webkit-mask:url('/assets/zabawy/figma/cupid-rose.svg') center/contain no-repeat}
[data-collection=cupid] .bingo-rules{top:27.8%;left:6.5%;width:87%;font:2cqw/1.3 Lato,sans-serif}
[data-collection=cupid] .bingo-grid{left:6.55%;top:31.59%;width:86.72%;padding:0;background:transparent}
[data-collection=cupid] .bingo-names{font-size:3.3cqw}
.bingo-pages .paper-wrap:not(:first-child){margin-top:30px}
@media print{.bingo-pages .paper-wrap:not(:first-child){margin-top:0}.bingo-pages .paper-wrap{break-after:page}.bingo-pages .paper-wrap:last-child{break-after:auto}}
[data-collection=cupid] .paper.is-search .decoration-search{display:none}
.bingo-names{height:5%;top:93.6%;line-height:1.5}
/* Stripes według Figmy (papier 595×842): nadtytuł 3,92%, środek tytułu 14,67%, zasady 22,09%, środek imion 96,82%.
   Nagłówek zajmuje całą kartkę, żeby procenty w nim liczyły się od wysokości papieru; zasady bez domyślnego
   marginesu akapitu, bo ten przesuwał je o linijkę w dół. Odstęp tytuł–zasady wychodzi wtedy równy odstępowi
   siatka–imiona. calc(… - 3cqw) to połowa linijki imion (4cqw × 1,5 / 2) — środek linijki trafia w Figmę. */
[data-collection=stripes] .bingo-heading{top:0;left:0;width:100%;height:100%}
[data-collection=stripes] .bingo-heading p{position:absolute;top:3.92%;left:0;width:100%;margin:0;line-height:1.35}
[data-collection=stripes] .bingo-heading h2{position:absolute;top:14.67%;left:0;width:100%;transform:translateY(-50%)}
[data-collection=stripes] .bingo-rules{top:22.09%;margin:0}
[data-collection=stripes] .bingo-names{top:calc(96.82% - 3cqw)}
/* Hasło w polu karty: najwyżej 3 linijki, pole się nie rozciąga. Czy tekst się zmieścił, mierzy bingo.mjs
   i zaznacza pole klasą is-too-long — wtedy wydruk jest zablokowany, więc obcięty tekst nie trafi na papier. */
.bingo-text{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden;max-width:100%}
.bingo-cell.is-too-long{background:#f3e5df;color:#923f30;box-shadow:inset 0 0 0 2px #923f30}
/* Demo gier: znak wodny na każdej kartce (ekran i wydruk), a zamiast wydruku komunikat. „Drukuj / PDF”
   w demo otwiera okno podglądu (demo-print.mjs), style na końcu pliku. */
.demo-print-message{display:none}
body[data-demo] .paper::after{content:'';position:absolute;inset:0;z-index:10;pointer-events:none;background:var(--ink);opacity:.18;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='260' viewBox='0 0 400 260'%3E%3Ctext x='200' y='130' font-family='Arial,Helvetica,sans-serif' font-size='30' font-weight='700' text-anchor='middle' dominant-baseline='middle' transform='rotate(-30 200 130)'%3EDEMO %C2%B7 The Link of Love%3C/text%3E%3C/svg%3E") 0 0/50% auto repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='260' viewBox='0 0 400 260'%3E%3Ctext x='200' y='130' font-family='Arial,Helvetica,sans-serif' font-size='30' font-weight='700' text-anchor='middle' dominant-baseline='middle' transform='rotate(-30 200 130)'%3EDEMO %C2%B7 The Link of Love%3C/text%3E%3C/svg%3E") 0 0/50% auto repeat}
@media print{body[data-demo] .paper-wrap{display:none!important}body[data-demo]::before{content:none!important}body[data-demo] .demo-print-message{display:block!important;margin:0;padding:20mm;font:16pt Arial,sans-serif;color:#000}}
/* Formularz bingo w blokach (karta, hasła, karty do druku). Każde hasło ma własne pole; lista przewija się
   w bloku, żeby 24–100 pól nie wypychało przycisków i podglądu daleko w dół. Na telefonie rośnie ze stroną. */
.bingo-block{margin:0 0 16px;padding:18px 18px 20px;border:1px solid #dedfdc;border-radius:15px;background:#fff;min-width:0}
.bingo-block legend{float:left;width:100%;display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:0;margin:0 0 14px;font:20px/1.2 Radley,Georgia,serif;color:var(--ink)}
.bingo-block legend+*{clear:both}.bingo-block :is(input,select)+label{margin-top:14px}.bingo-block select{margin-bottom:0}.bingo-block .help{margin-top:0!important;margin-bottom:12px!important}
.bingo-count{font:12px Arial,sans-serif;color:#626874;white-space:nowrap}.bingo-count.is-short{color:#923f30}
.bingo-word-list{list-style:none;counter-reset:haslo;margin:0;padding:6px;max-height:min(56vh,520px);overflow-y:auto;border:1px solid #e6e3de;border-radius:10px;background:#faf9f7}
.bingo-word-list li{display:flex;align-items:center;gap:6px;counter-increment:haslo}.bingo-word-list li+li{margin-top:6px}
.bingo-word-list li::before{content:counter(haslo);flex:0 0 22px;text-align:right;font-size:11px;color:#626874}
.bingo-word-list input{flex:1 1 auto;min-width:0}
.bingo-word-remove{flex:none;width:34px;height:42px;padding:0;border:0;border-radius:8px;background:none;color:var(--ink);font-size:21px;line-height:1}.bingo-word-remove:hover:not(:disabled){background:#e9e9e5}
.bingo-word-add{width:100%;margin-top:12px}
@media(max-width:760px){.bingo-word-list{max-height:none;overflow:visible}}
/* Demo: okno „Drukuj / PDF” (demo-print.mjs) z kartą A4 ze znakiem wodnym i przyciskiem zakupu. Wydruku
   nie odblokowuje — w demo @media print i tak chowa kartę. Kolory i font jak w blokach sklepu. */
.demo-print{width:min(960px,calc(100% - 32px));max-width:none;max-height:calc(100% - 32px);padding:0;border:0;border-radius:15px;background:#f0eeea;color:#2f0310;font:17px/1.4 Radley,Georgia,serif;overflow:auto}
.demo-print::backdrop{background:rgb(47 3 16/.6)}
.demo-print__bar{position:sticky;top:0;z-index:20;display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;padding:20px 24px;background:#e0ded8}
.demo-print__bar>div{flex:1 1 280px}.demo-print__bar h2{margin:0 0 4px;font:24px/1.15 Radley,Georgia,serif}.demo-print__bar p{margin:0;font-size:15px;color:#6d525a}
.demo-print__buy,.demo-print__close{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 22px;border-radius:15px;font:inherit;text-decoration:none}
.demo-print__buy{border:1px solid #3d0510;background:#3d0510;color:#f0eeea}.demo-print__buy:hover{background:#571521}
.demo-print__close{border:1px solid currentColor;background:transparent;color:#2f0310}.demo-print__close:hover{background:#d4d1ca}
.demo-print__buy:focus-visible,.demo-print__close:focus-visible{outline:3px solid #97753e;outline-offset:3px}
.demo-print__pages{padding:24px}.demo-print__pages .paper-wrap{width:min(100%,calc((100vh - 220px)*595/842));max-width:none;margin:0 auto}
@media(max-width:760px){.demo-print__bar{padding:16px}.demo-print__buy,.demo-print__close{flex:1 1 auto}.demo-print__pages{padding:16px}.demo-print__pages .paper-wrap{width:100%}}
@media print{.demo-print{display:none!important}}