/* Поверх любой темы открытки: значок сайта, нижняя панель, окно пожелания, конверт для получателя */
[hidden]{display:none!important}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
.ui-brand{position:fixed;left:14px;top:14px;z-index:30;font:700 15px/1 'PT Serif',Georgia,serif;background:#fbf5e8;color:#2b2522;text-decoration:none;padding:9px 13px;box-shadow:0 6px 18px -6px rgba(0,0,0,.35)}
.ui-brand span{color:#c42a2a}
.ui-bar{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:30;display:flex;align-items:center;gap:14px;background:#fbf5e8;padding:8px 8px 8px 18px;box-shadow:0 12px 30px -10px rgba(40,25,5,.55);border:1.5px solid rgba(43,37,34,.2);width:max-content;max-width:calc(100% - 24px)}
.ui-bar small{font:400 12.5px/1.35 'PT Mono',monospace;letter-spacing:.02em;color:rgba(43,37,34,.8)}
.ui-btn{display:inline-block;font:700 16px/1.1 'PT Serif',Georgia,serif;background:#c42a2a;color:#fff;border:0;padding:13px 18px;cursor:pointer;text-decoration:none;white-space:nowrap}
.ui-btn:hover{background:#a91f1f;color:#fff}
.ui-note{position:fixed;left:50%;top:14px;transform:translateX(-50%);z-index:40;width:max-content;max-width:calc(100% - 24px);font:400 15px/1.4 'PT Serif',Georgia,serif;background:#fffaf0;color:#2b2522;padding:12px 16px;border-left:6px solid #234f96;box-shadow:0 12px 30px -12px rgba(0,0,0,.45)}
.ui-note.err{border-left-color:#c42a2a}

/* окно «Ваше пожелание» */
.dlg{margin:auto;border:0;padding:0;background:#fbf5e8;color:#2b2522;width:min(560px,calc(100% - 24px));max-height:calc(100% - 24px);box-shadow:0 30px 70px -20px rgba(0,0,0,.6);font:400 16px/1.5 'PT Serif',Georgia,serif}
.dlg::backdrop{background:rgba(30,22,12,.55)}
.dlg form{padding:22px clamp(18px,4vw,30px);border-top:8px solid transparent;border-image:repeating-linear-gradient(-45deg,#c42a2a 0 12px,#fbf5e8 12px 20px,#234f96 20px 32px,#fbf5e8 32px 40px) 8}
.dlg h2{font:700 26px/1.2 'PT Serif',Georgia,serif;margin-bottom:16px}
.dlg label{display:block;font:400 12px/1.2 'PT Mono',monospace;letter-spacing:.1em;text-transform:uppercase;color:rgba(43,37,34,.66);margin:0 0 16px}
.dlg input[type=text],.dlg textarea{display:block;width:100%;margin-top:8px;font:400 17px/1.45 'PT Serif',Georgia,serif;letter-spacing:0;text-transform:none;color:#2b2522;background:#fff;border:1.5px solid rgba(43,37,34,.3);padding:10px 12px;outline:none;border-radius:0}
.dlg input[name=author]{font:700 25px/1.2 'Caveat',cursive;color:#234f96}
.dlg textarea{resize:vertical;min-height:150px}
.dlg input:focus,.dlg textarea:focus{border-color:#c42a2a}
.dlg input[type=file]{display:block;margin-top:8px;font:400 14px/1.3 'PT Mono',monospace;letter-spacing:0;text-transform:none;color:#2b2522;max-width:100%}
.dlg .cnt{display:block;text-align:right;margin-top:4px;font:400 12px/1 'PT Mono',monospace;color:rgba(43,37,34,.55);text-transform:none;letter-spacing:0}
.dlg .chk{display:flex;gap:10px;align-items:flex-start;text-transform:none;letter-spacing:0;font:400 14.5px/1.45 'PT Serif',Georgia,serif;color:rgba(43,37,34,.82)}
.dlg .chk input{width:18px;height:18px;margin-top:2px;flex:none;accent-color:#234f96}
.dlg a{color:#234f96;text-decoration:none}
.dlg-err{margin:-6px 0 14px;color:#c42a2a;font-size:15px}
.dlg-act{display:flex;justify-content:flex-end;gap:10px;margin-top:6px}
.dlg-act button[type=button]{font:400 14px/1 'PT Mono',monospace;background:transparent;border:1.5px solid rgba(43,37,34,.35);padding:12px 16px;cursor:pointer;color:#2b2522}

/* выбор наклейки */
.dlg{overflow:auto}
.stk-field{margin:0 0 16px}
.stk-lbl{display:block;font:400 12px/1.2 'PT Mono',monospace;letter-spacing:.1em;text-transform:uppercase;color:rgba(43,37,34,.66);margin-bottom:8px}
.stk-row{display:flex;align-items:center;flex-wrap:wrap;gap:10px}
.stk-preview{width:72px;height:72px}
.stk-btn{font:400 14px/1 'PT Mono',monospace;background:#fff;border:1.5px solid rgba(43,37,34,.3);padding:10px 14px;cursor:pointer;color:#2b2522}
.stk-panel{margin-top:12px;padding:12px;background:#fff;border:1.5px solid rgba(43,37,34,.2)}
.dlg input.stk-search,.dlg input.gif-search{display:block;width:100%;font:400 16px/1.3 'PT Serif',Georgia,serif;padding:9px 12px;border:1.5px solid rgba(43,37,34,.3);outline:none;border-radius:0;background:#fff;color:#2b2522}
.dlg input.stk-search:focus,.dlg input.gif-search:focus{border-color:#c42a2a}
.stk-tabs{display:flex;gap:4px;overflow-x:auto;margin:10px 0 8px;padding-bottom:4px;scrollbar-width:thin}
.stk-tabs button{flex:none;font:400 12.5px/1 'PT Mono',monospace;padding:8px 10px;background:#fbf5e8;border:1px solid rgba(43,37,34,.2);cursor:pointer;color:#2b2522;white-space:nowrap}
.stk-tabs button[aria-selected="true"]{background:#234f96;border-color:#234f96;color:#fff}
.stk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(48px,1fr));gap:4px;height:240px;overflow-y:auto;align-content:start}
.gif-preview{width:96px;height:72px;object-fit:cover;background:#eee}
.pick-modes{display:flex;margin-bottom:10px;border:1.5px solid rgba(43,37,34,.3);width:max-content}
.pick-modes button{font:400 14px/1 'PT Mono',monospace;padding:10px 16px;background:#fff;border:0;cursor:pointer;color:#2b2522}
.pick-modes button[aria-selected="true"]{background:#234f96;color:#fff}
.gif-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:6px;height:280px;overflow-y:auto;align-content:start;margin-top:10px}
.gif-opt{height:96px;padding:0;border:0;background:#eee;cursor:pointer;overflow:hidden}
.gif-opt img{display:block;width:100%;height:100%;object-fit:cover}
.gif-opt:focus-visible{outline:3px solid #234f96;outline-offset:-3px}
.gif-more{margin-top:10px}
.stk-empty{grid-column:1/-1;padding:20px 4px;font:400 14px/1.4 'PT Serif',Georgia,serif;color:rgba(43,37,34,.7)}
.stk-opt{display:grid;place-items:center;height:52px;background:transparent;border:1.5px solid transparent;border-radius:8px;cursor:pointer}
.stk-opt:hover{background:#fbf5e8}
.stk-opt[aria-pressed="true"]{border-color:#234f96;background:#eef3fb}
.stk-opt img{width:40px;height:40px}
.stk-credit{margin-top:12px;font:400 11.5px/1.4 'PT Mono',monospace;color:rgba(43,37,34,.6)}
.ui-credit{text-align:center;padding:0 16px 100px;font:400 11.5px/1.4 'PT Mono',monospace;letter-spacing:.02em}
.ui-credit span{display:inline-block;background:rgba(251,245,232,.92);color:rgba(43,37,34,.75);padding:6px 10px}
.ui-credit a{color:#234f96;text-decoration:none}

/* «Изменить / Удалить» у своего пожелания */
.own{display:flex;gap:6px;justify-content:flex-end;margin-top:10px}
.own form{display:inline}
.own-btn{font:400 12px/1 'PT Mono',monospace;letter-spacing:.02em;background:rgba(255,255,255,.92);border:1px solid rgba(0,0,0,.28);padding:6px 9px;cursor:pointer;color:#2b2522}

.ui-foot{text-align:center;padding:0 16px 60px;font:400 13px/1.5 'PT Mono',monospace;letter-spacing:.03em}
.ui-foot a{display:inline-block;background:#fbf5e8;color:#2b2522;text-decoration:none;padding:11px 16px;box-shadow:0 8px 20px -10px rgba(0,0,0,.4)}
.ui-foot a:hover{color:#c42a2a}

/* конверт, который получатель вскрывает */
.intro{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:16px;background-color:#e6d6b8;background-image:radial-gradient(rgba(110,80,40,.12) 1px,transparent 1.3px);background-size:9px 9px;transition:opacity .5s ease,visibility .5s}
body.opened .intro{opacity:0;visibility:hidden}
.intro-in{display:flex;flex-direction:column;align-items:center;gap:24px;width:min(560px,100%)}
.envelope{position:relative;width:100%;aspect-ratio:16/10;background:#fbf5e8;border:12px solid transparent;border-image:repeating-linear-gradient(-45deg,#c42a2a 0 12px,#fbf5e8 12px 20px,#234f96 20px 32px,#fbf5e8 32px 40px) 12;box-shadow:0 30px 60px -24px rgba(60,40,10,.65);perspective:900px}
.flap{position:absolute;left:0;right:0;top:0;height:50%;background:#f1e6cf;clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top;transition:transform .6s ease}
body.opening .flap{transform:rotateX(180deg)}
.seal{position:absolute;left:50%;top:50%;width:58px;height:58px;margin:-29px 0 0 -29px;border-radius:50%;background:radial-gradient(circle at 40% 35%,#d94b4b,#9e1d1d);box-shadow:0 4px 8px rgba(0,0,0,.3);z-index:2;display:grid;place-items:center;color:#f7d7d7;font:400 24px/1 'Marck Script',cursive;transition:opacity .2s}
body.opening .seal{opacity:0}
.env-face{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:6px;padding:0 20px 18px;text-align:center}
.env-face .to{font:700 clamp(28px,6vw,40px)/1.05 'Caveat',cursive;color:#234f96}
.env-face small{font:400 12px/1.3 'PT Mono',monospace;letter-spacing:.1em;text-transform:uppercase;color:rgba(43,37,34,.65)}

body.embed .ui-brand,body.embed .ui-bar,body.embed .ui-foot,body.embed .ui-note,body.embed .ui-credit{display:none!important}
@media (max-width:560px){
  .ui-bar{left:12px;right:12px;transform:none;width:auto;justify-content:space-between;padding-left:12px}
  .ui-bar small{font-size:11.5px}
  .ui-brand{font-size:13px;padding:7px 10px}
}

/* голосовое и видео в пожелании — во всех оформлениях */
.w-audio{margin:12px 0 4px}
.w-audio span{display:block;font:400 11.5px/1.2 'PT Mono',monospace;letter-spacing:.08em;text-transform:uppercase;opacity:.7;margin-bottom:6px}
.w-audio audio{display:block;width:100%;height:40px}
.w-video{position:relative;margin:12px 0 4px;aspect-ratio:16/9;background:#111}
.w-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* окно пожелания: подсказки и добавки */
.hint-btn{display:block;margin:-8px 0 16px;font:400 14px/1.3 'PT Serif',Georgia,serif;background:none;border:0;border-bottom:1.5px dashed #234f96;padding:0 0 1px;color:#234f96;cursor:pointer;text-align:left}
.hints{display:grid;gap:6px;margin:-4px 0 18px}
.hints button{text-align:left;font:400 15px/1.4 'PT Serif',Georgia,serif;background:#fff;border:1.5px solid rgba(43,37,34,.18);padding:9px 12px;cursor:pointer;color:#2b2522}
.hints button:hover{border-color:#234f96;background:#f4f7fd}
.add-btns{display:flex;flex-wrap:wrap;gap:8px}
.add-btns .stk-btn[aria-expanded="true"]{background:#234f96;border-color:#234f96;color:#fff}
.add-box{margin:-4px 0 18px;padding:12px;background:#fff;border:1.5px solid rgba(43,37,34,.2)}
.add-box label{margin-bottom:8px}
.add-box small{display:block;margin-top:8px;font:400 13.5px/1.45 'PT Serif',Georgia,serif;color:rgba(43,37,34,.72)}
.dlg input[type=url]{display:block;width:100%;margin-top:8px;font:400 16px/1.4 'PT Serif',Georgia,serif;letter-spacing:0;text-transform:none;color:#2b2522;background:#fff;border:1.5px solid rgba(43,37,34,.3);padding:10px 12px;outline:none;border-radius:0}
.img-preview{display:block;max-width:200px;max-height:150px;margin:6px 0 8px;border:4px solid #fff;box-shadow:0 2px 10px rgba(0,0,0,.22)}
.draw-cv{display:block;width:100%;height:auto;aspect-ratio:4/3;background:#fff;border:1.5px dashed rgba(43,37,34,.35);touch-action:none;cursor:crosshair}
.draw-tools{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:10px}
.draw-tools .sep{flex:1}
.draw-col{width:30px;height:30px;padding:0;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1.5px rgba(43,37,34,.35);cursor:pointer}
.draw-col[aria-pressed="true"]{box-shadow:0 0 0 3px #234f96}
.draw-size{display:grid;place-items:center;width:34px;height:34px;padding:0;background:#fff;border:1.5px solid rgba(43,37,34,.3);cursor:pointer}
.draw-size i{display:block;border-radius:50%;background:#2b2522}
.draw-size[aria-pressed="true"]{border-color:#234f96;background:#eef3fb}
.voice-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.rec-on{display:inline-flex;align-items:center;gap:8px;font:400 15px/1 'PT Mono',monospace}
.rec-dot{display:block;width:12px;height:12px;border-radius:50%;background:#c42a2a;animation:rec 1s steps(2) infinite}
@keyframes rec{50%{opacity:.15}}
.voice-prev{display:block;width:100%;margin-top:10px}

/* подарок вскладчину */
.ui-btn.alt{background:#fff;color:#2b2522;box-shadow:inset 0 0 0 1.5px rgba(43,37,34,.4)}
.ui-btn.alt:hover{background:#fff;color:#c42a2a;box-shadow:inset 0 0 0 1.5px #c42a2a}
.ui-btn .m{display:none}
.dlg-in{padding:22px clamp(18px,4vw,30px);border-top:8px solid transparent;border-image:repeating-linear-gradient(-45deg,#c42a2a 0 12px,#fbf5e8 12px 20px,#234f96 20px 32px,#fbf5e8 32px 40px) 8}
.dlg-in > p{margin-bottom:12px}
.dlg-in textarea{display:block;width:100%;min-height:140px;margin:4px 0 6px;font:400 17px/1.45 'PT Serif',Georgia,serif;color:#2b2522;background:#fff;border:1.5px solid rgba(43,37,34,.3);padding:10px 12px;outline:none;resize:vertical}
.gift-note{font:700 19px/1.4 'PT Serif',Georgia,serif;background:#fff;padding:12px 14px;border-left:5px solid #c42a2a}
.dlg-act a.ui-btn{color:#fff}

/* ответ получателя «Спасибо всем» — в конце открытки */
.ui-reply{position:relative;z-index:2;width:min(720px,calc(100% - 32px));margin:0 auto 34px;padding:24px clamp(20px,4vw,34px) 22px;background:#fffaf0;color:#2b2522;box-shadow:0 24px 50px -24px rgba(0,0,0,.6);border-top:8px solid transparent;border-image:repeating-linear-gradient(-45deg,#c42a2a 0 12px,#fffaf0 12px 20px,#234f96 20px 32px,#fffaf0 32px 40px) 8}
.ui-reply h2{font:400 12.5px/1.3 'PT Mono',monospace;letter-spacing:.12em;text-transform:uppercase;color:#c42a2a;margin-bottom:10px}
.ui-reply blockquote{font:italic 400 clamp(19px,2vw,23px)/1.5 'PT Serif',Georgia,serif;white-space:pre-line;overflow-wrap:anywhere}
.ui-reply p{margin-top:12px;font:400 12.5px/1.3 'PT Mono',monospace;color:rgba(43,37,34,.65)}
.ui-note.tip{text-decoration:none;animation:tipout .6s ease 9s forwards}
@keyframes tipout{to{opacity:0;visibility:hidden}}

/* кнопки получателя под открыткой */
.ui-actions{position:relative;z-index:2;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;padding:0 16px 22px}
.ui-actions button,.ui-actions a{font:700 15px/1.1 'PT Serif',Georgia,serif;background:#fbf5e8;color:#2b2522;border:0;padding:13px 17px;cursor:pointer;text-decoration:none;box-shadow:0 8px 20px -10px rgba(0,0,0,.45)}
.ui-actions .ui-btn{background:#c42a2a;color:#fff}
.ui-actions button:hover,.ui-actions a:hover{color:#c42a2a}
.ui-actions .ui-btn:hover{color:#fff;background:#a91f1f}
.confetti{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:70}

@media (max-width:560px){
  .ui-bar{flex-wrap:wrap;row-gap:8px}
  .ui-bar small{flex-basis:100%}
  .ui-bar .ui-btn{flex:1 1 auto;text-align:center;padding:12px 10px;font-size:15px}
  .ui-btn .d{display:none}
  .ui-btn .m{display:inline}
}

/* печать и сохранение в PDF: только открытка, цвета и фон как на экране */
@page{size:A4;margin:10mm}
@page poster{size:A3 landscape}
.w-vlink{display:none}
@media print{
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  html,body{background-attachment:scroll!important}
  body::before{display:none!important}
  .ui-brand,.ui-bar,.ui-note,.ui-foot,.ui-actions,.intro,.dlg,.own,.confetti,.w-audio,.w-video{display:none!important}
  .w-vlink{display:block;margin-top:8px;font:400 11px/1.3 'PT Mono',monospace;word-break:break-all;color:inherit}
  article[id^="w"],.ui-reply{break-inside:avoid}
  body.th-stengazeta{page:poster}
  .ui-credit{padding-bottom:0}
}