.ptica-dobra-app{
    --green-deep:#0d7a63;
    --green:#18a087;
    --green-light:#2ecc9a;
    --green-pale:#e9f8f2;
    --purple:#a78bfa;
    --purple-deep:#7c5cd6;
    --pink:#f6a8c2;
    --pink-deep:#f088ab;
    --ink:#0f3d33;
    --ink-soft:#3c6a5f;
    --cream:#fffaf3;
    --gold:#f4c04a;
    --bad:#8b8fa3;
    --radius:22px;
    --shadow:0 18px 40px -18px rgba(13,122,99,.35);
    --font-display:"Baloo 2","Segoe UI",Verdana,Tahoma,sans-serif;
    --font-body:"Mulish","Segoe UI",Verdana,Tahoma,sans-serif;
    font-family:var(--font-body);
  }
  .ptica-dobra-app, .ptica-dobra-app *{box-sizing:border-box;}
  .ptica-dobra-app{scroll-behavior:smooth;}
  .ptica-dobra-app{margin:0;padding:3%;}
  body.pd-donate-open{overflow:hidden;}
  .ptica-dobra-app{
    background:
      radial-gradient(1200px 600px at 15% -10%, #d6f3e8 0%, transparent 55%),
      radial-gradient(900px 500px at 110% 10%, #efe3ff 0%, transparent 50%),
      var(--cream);
    color:var(--ink);
    line-height:1.6;
    font-family:var(--font-body);
    -webkit-font-smoothing:antialiased;
  }
  @media (prefers-reduced-motion: no-preference){
    .ptica-dobra-app .hero-art img{ animation: pd-float 5.5s ease-in-out infinite; }
    .ptica-dobra-app .blob1{ animation: pd-float 7s ease-in-out infinite; }
    .ptica-dobra-app .blob2{ animation: pd-float 6s ease-in-out infinite reverse; }
  }
  @keyframes pd-float{
    0%,100%{ transform: translateY(0); }
    50%{ transform: translateY(-14px); }
  }
  .ptica-dobra-app img{max-width:max-content;display:block;}
  .ptica-dobra-app a{color:inherit;}
  .ptica-dobra-app .wrap{max-width:1080px;margin:0 auto;padding:0 20px;}
  .ptica-dobra-app .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    border:none;border-radius:999px;cursor:pointer;
    font-family:var(--font-display);font-weight:600;font-size:16.5px;padding:16px 30px;
    text-decoration:none;transition:transform .15s ease, box-shadow .15s ease, filter .15s ease;
    box-shadow:var(--shadow);
    white-space:nowrap;
  }
  .ptica-dobra-app .btn:active{transform:translateY(1px) scale(.98);}
  .ptica-dobra-app .btn-primary{background:linear-gradient(135deg,var(--green-light),var(--green-deep));color:#fff;}
  .ptica-dobra-app .btn-primary:hover{filter:brightness(1.06);box-shadow:0 20px 44px -16px rgba(13,122,99,.5);}
  .ptica-dobra-app .btn-ghost{background:#fff;color:var(--green-deep);border:2px solid var(--green-pale);box-shadow:none;}
  .ptica-dobra-app .btn-ghost:hover{border-color:var(--green-light);}
  .ptica-dobra-app .btn-donate{background:linear-gradient(135deg,var(--pink-deep),var(--purple-deep));color:#fff;}
  .ptica-dobra-app .btn:disabled{opacity:.5;cursor:not-allowed;transform:none;}

  /* ---------- HEADER ---------- */
  .ptica-dobra-app header{padding:18px 0;}
  .ptica-dobra-app .nav{display:flex;align-items:center;justify-content:space-between;}
  .ptica-dobra-app .brand{display:flex;align-items:center;text-decoration:none;}
  .ptica-dobra-app .brand img{height:38px;width:auto;display:block;}
  .ptica-dobra-app .nav a.site-link{font-weight:700;font-size:15px;color:var(--ink-soft);text-decoration:none;border-bottom:2px solid transparent;}
  .ptica-dobra-app .nav a.site-link:hover{border-color:var(--green-light);}

  /* ---------- HERO ---------- */
  .ptica-dobra-app .hero{padding:28px 0 10px;}
  .ptica-dobra-app .hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:36px;align-items:center;}
  .ptica-dobra-app .eyebrow{
    display:inline-flex;align-items:center;gap:8px;
    background:var(--green-pale);color:var(--green-deep);
    font-weight:800;font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;
    padding:8px 14px;border-radius:999px;margin-bottom:18px;
  }
  .ptica-dobra-app h1{font-family:var(--font-display);font-weight:700;font-size:50px;line-height:1.06;margin:0 0 18px;color:var(--ink);letter-spacing:-.01em;text-wrap:balance;}
  .ptica-dobra-app h1 span{color:var(--green-deep);}
  .ptica-dobra-app .lead{font-size:18.5px;color:var(--ink-soft);margin:0 0 28px;max-width:520px;}
  .ptica-dobra-app .hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:22px;}
  .ptica-dobra-app .hero-stats{display:flex;gap:26px;flex-wrap:wrap;color:var(--ink-soft);font-size:13.5px;}
  .ptica-dobra-app .hero-stats b{display:block;font-family:var(--font-display);font-weight:600;color:var(--ink);font-size:21px;font-variant-numeric:tabular-nums;}
  .ptica-dobra-app .hero-art{position:relative;text-align:center;}
  .ptica-dobra-app .hero-art img{width:100%;max-width:420px;height:auto;aspect-ratio:640/649;margin:0 auto;position:relative;z-index:2;filter:drop-shadow(0 26px 30px rgba(13,122,99,.25));}
  .ptica-dobra-app .flight-path{position:absolute;inset:-6% -12% -4%;z-index:1;pointer-events:none;}
  .ptica-dobra-app .flight-path .trail{fill:none;stroke:var(--green-light);stroke-width:3;stroke-linecap:round;stroke-dasharray:1 14;opacity:.55;}
  @media (prefers-reduced-motion: no-preference){
    .ptica-dobra-app .flight-path .egg-trail{ animation: pd-drop 3.2s ease-in infinite; }
    .ptica-dobra-app .flight-path .egg-trail:nth-child(3){ animation-delay:.5s; }
    .ptica-dobra-app .flight-path .egg-trail:nth-child(4){ animation-delay:1.1s; }
  }
  @keyframes pd-drop{
    0%{ transform:translateY(0); opacity:0; }
    12%{ opacity:1; }
    80%{ opacity:1; }
    100%{ transform:translateY(26px); opacity:0; }
  }

  /* ---------- HOW TO PLAY ---------- */
  .ptica-dobra-app .section{
    padding: 0;
}
  .ptica-dobra-app .section-head{text-align:center;max-width:620px;margin:0 auto 34px;}
  .ptica-dobra-app .section-head h2{font-family:var(--font-display);font-weight:700;font-size:32px;margin:0 0 10px;color:var(--ink);text-wrap:balance;}
  .ptica-dobra-app .section-head p{color:var(--ink-soft);margin:0;}
  .ptica-dobra-app .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;position:relative;}
  .ptica-dobra-app .step{background:#fff;border-radius:18px;padding:26px 20px 22px;box-shadow:var(--shadow);text-align:left;position:relative;}
  .ptica-dobra-app .step .num{
    width:34px;height:40px;display:flex;align-items:center;justify-content:center;
    background:linear-gradient(160deg,var(--green-light),var(--green-deep));color:#fff;
    font-family:var(--font-display);font-weight:700;font-size:15px;margin-bottom:16px;
    border-radius:50% 50% 50% 50% / 58% 58% 42% 42%;
    box-shadow:0 8px 16px -6px rgba(13,122,99,.5);
  }
  .ptica-dobra-app .step h3{font-family:var(--font-display);font-weight:600;margin:0 0 8px;font-size:17.5px;color:var(--ink);}
  .ptica-dobra-app .step p{margin:0;color:var(--ink-soft);font-size:14.5px;}


  /* ---------- GAME ---------- */
  .ptica-dobra-app .game-section{
    padding:52px 0 70px;
    container-type:inline-size;
    container-name:pd-game-section;
  }
  .ptica-dobra-app .game-panel{
    background:linear-gradient(160deg,#0d7a63,#0a5c4b 65%);
    border-radius:32px;padding:26px;box-shadow:0 30px 60px -24px rgba(10,60,48,.55);
    display:grid;grid-template-columns:340px minmax(400px,1fr);gap:26px;
    /* The game stage must fill the complete height of its grid cell.
       The canvas wrapper below is a flex child, so when the sidebar is taller
       the actual playing field grows with it instead of leaving a green tail
       under the right column. */
    align-items:stretch;
  }
  .ptica-dobra-app .game-side h2{font-family:var(--font-display);font-weight:700;color:#fff;font-size:25px;margin:0 0 10px;}
  .ptica-dobra-app .game-side p{color:#cdeee3;font-size:14.5px;margin:0 0 18px;}
  .ptica-dobra-app .side-list{list-style:none;margin:0 0 20px;padding:0;display:flex;flex-direction:column;gap:10px;}
  .ptica-dobra-app .side-list li{
    display:flex;gap:10px;align-items:flex-start;color:#eafff6;font-size:14px;
    background:rgba(255,255,255,.08);border-radius:14px;padding:10px 12px;
  }
  .ptica-dobra-app .side-list li .ic{font-size:18px;}
  .ptica-dobra-app .game-note{
    font-size:12.5px;line-height:1.5;color:#cdeee3;
    background:rgba(0,0,0,.15);border:1px dashed rgba(255,255,255,.25);
    border-radius:12px;padding:10px 12px;margin:0 0 18px;
  }
  .ptica-dobra-app .side-cta{display:flex;flex-direction:column;gap:10px;}
  .ptica-dobra-app .best-score{color:#cdeee3;font-size:13px;}
  .ptica-dobra-app .best-score b{font-family:var(--font-display);color:#fff;font-size:16px;font-variant-numeric:tabular-nums;}
  .ptica-dobra-app .accum-box{background:rgba(255,255,255,.1);border-radius:14px;padding:12px 14px;}
  .ptica-dobra-app .accum-label{font-size:12px;color:#cdeee3;}
  .ptica-dobra-app .accum-amount{font-family:var(--font-display);font-weight:800;font-size:20px;color:#fff;margin:2px 0 10px;font-variant-numeric:tabular-nums;}
  .ptica-dobra-app .accum-box .btn{width:100%;padding:11px 16px;font-size:14px;}

  /* ---------- donation nudge (lives inside the end-of-round plaques) ----------
     A short persuasive line — plus a VK-follow button on the stronger tier —
     inserted into whichever "round finished" screen is about to show: the
     milestone modal (goal reached) or the game-over overlay (time ran out).
     Gentle wording after round 3, a stronger one after round 5. Reuses the
     screen's own existing donate button as the call to action, so this is
     just the extra nudge text/VK-link riding along inside that same card. */
  .ptica-dobra-app .round-nudge{
    background:#fff6de;border:1.5px solid rgba(244,192,74,.7);
    border-radius:14px;padding:12px 14px;margin:0 0 16px;
  }
  /* the extra specificity (vs. plain ".modal p" / ".gameover-overlay p") is
     needed so this card's own text color/width win regardless of the two
     screens' very different default paragraph styling (dark-on-white modal
     vs. light-on-dark overlay) and regardless of stylesheet source order */
  .ptica-dobra-app .modal .round-nudge p, .ptica-dobra-app .gameover-overlay .round-nudge p{
    margin:0 0 10px;color:var(--ink);font-size:13.5px;line-height:1.45;max-width:none;
  }
  .ptica-dobra-app .round-nudge p:last-child{margin-bottom:0;}
  .ptica-dobra-app .round-nudge .btn-vk{
    width:100%;padding:10px 14px;font-size:13px;font-weight:700;
    background:#fff;color:var(--green-deep);border:2px solid var(--green-pale);
  }

  /* ---------- exit confirmation (shown inside the milestone plaque when the
     player clicks "Выйти из игры" instead of continuing) ---------- */
  .ptica-dobra-app .exit-confirm{
    background:#f3f6f5;border:1.5px solid rgba(13,122,99,.18);
    border-radius:14px;padding:14px 14px 12px;margin:14px 0 0;text-align:left;
  }
  .ptica-dobra-app .exit-confirm p{margin:0 0 10px;color:var(--ink);font-size:13.5px;line-height:1.45;}
  .ptica-dobra-app .exit-confirm .btn-vk{
    display:flex;width:100%;padding:10px 14px;font-size:13px;font-weight:700;margin:0 0 10px;
    background:#fff;color:var(--green-deep);border:2px solid var(--green-pale);
  }

  .ptica-dobra-app .game-stage{
    background:transparent;border-radius:24px;overflow:hidden;position:relative;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.4);
    display:flex;flex-direction:column;
    container-type:inline-size;
    container-name:pd-game-stage;
    min-width:0;min-height:0;align-self:stretch;
  }
  .ptica-dobra-app .game-hud{
    display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;
    width:var(--pd-scene-width,100%);max-width:100%;align-self:center;box-sizing:border-box;
    padding:12px 16px 16px;background:#fff;position:relative;z-index:5;overflow:hidden;
    border-bottom:1px solid #eef6f2;border-radius:24px 24px 0 0;
    row-gap:6px;column-gap:10px;
  }
  .ptica-dobra-app .hud-block{display:flex;align-items:center;gap:6px;font-weight:800;color:var(--ink);font-size:15px;font-variant-numeric:tabular-nums;white-space:nowrap;}
  .ptica-dobra-app .hud-block .lbl{font-size:11px;font-weight:700;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;}
  .ptica-dobra-app .hearts{display:flex;gap:3px;font-size:16px;}
  .ptica-dobra-app #hud-timer-block{transition:color .15s ease;}
  .ptica-dobra-app #hud-timer-block.timer-urgent{color:#e0435a;animation:pd-pulse 1s ease-in-out infinite;}
  @keyframes pd-pulse{0%,100%{transform:scale(1);}50%{transform:scale(1.1);}}
  .ptica-dobra-app .hud-buttons{display:flex;gap:8px;}
  .ptica-dobra-app .sound-btn{
    border:none;background:var(--green-pale);color:var(--green-deep);width:36px;height:36px;border-radius:12px;
    font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;
  }
  .ptica-dobra-app .sound-btn:hover{background:#d9f0e6;}
  .ptica-dobra-app #game-canvas-wrap{
    position:relative;width:100%;
    /* The wrapper is the PLAYING FIELD and may have any available height.
       The Phaser canvas inside it keeps the logical 480:520 scene ratio;
       free space becomes harmless letterboxing instead of stretching sprites. */
    height:0;padding-bottom:calc(520 / 480 * 100%);
    aspect-ratio:480/520;
    background:transparent;
    overflow:hidden;
    display:flex;align-items:center;justify-content:center;
    -webkit-touch-callout:none;-webkit-user-select:none;user-select:none;
  }
  @supports (aspect-ratio: 1/1){
    .ptica-dobra-app #game-canvas-wrap{
      height:auto;padding-bottom:0;
      flex:0 0 auto;
      min-height:0;
    }
  }

  /* Keep two columns only while the actual game column can stay >= 400px.
     340 sidebar + 26 gap + 400 game + 52 panel padding = 818px. */
  @container pd-game-section (max-width:817px){
    .ptica-dobra-app .game-panel{grid-template-columns:1fr;}
  }

  /* Runtime fallback: while idle we may keep the compact two-column layout.
     When Play is pressed, JS mathematically calculates Phaser.Scale.FIT from
     the available playfield and the logical 480:520 scene. If FIT would leave
     letterboxing, this class stacks the columns before gameplay starts. */
  .ptica-dobra-app .game-panel.pd-game-expanded{
    grid-template-columns:1fr !important;
  }
  .ptica-dobra-app .game-panel.pd-game-expanded .game-stage{
    /* 95dvh is a CEILING, not a forced height. The stage shrinks to the
       natural HUD + 480:520 scene height on tall/narrow phones and only
       reaches the viewport cap when the proportional scene would be taller. */
    box-shadow:none;
    width:100%;
    max-width:100%;
    height:auto;
    min-height:0;
    max-height:95dvh;
    justify-self:stretch;
    align-self:start;
  }
  .ptica-dobra-app .game-panel.pd-game-expanded #game-canvas-wrap{
    /* JS writes --pd-play-width from the real viewport, HUD height and
       available stage width. This keeps the scene proportional and ensures
       HUD + canvas never exceed 95dvh without manufacturing green voids. */
    width:min(100%, var(--pd-play-width, 100%));
    flex:0 0 auto;
    height:auto;
    min-height:0;
    max-height:none;
    padding-bottom:0;
    aspect-ratio:480/520;
    margin:0 auto;
  }

  /* In the two-column layout the PLAYING FIELD fills all remaining height
     below the HUD. The canvas itself is not distorted: Phaser.Scale.FIT
     fits the 480:520 scene inside this rectangle. */
  @container pd-game-section (min-width:818px){
    .ptica-dobra-app #game-canvas-wrap{
      flex:1 1 auto;
      height:auto;
      min-height:0;
      padding-bottom:0;
      aspect-ratio:auto;
    }
  }

  /* On very wide two-column layouts use the same 95dvh ceiling. Never force
     the stage to 95dvh: a shorter proportional HUD + scene remains shorter. */
  @container pd-game-section (min-width:1018px){
    .ptica-dobra-app .game-panel:not(.pd-game-expanded) .game-stage{
      height:auto;
      min-height:0;
      max-height:95dvh;
      align-self:start;
    }
    .ptica-dobra-app .game-panel:not(.pd-game-expanded) #game-canvas-wrap{
      flex:0 0 auto;
      height:auto;
      min-height:0;
      max-height:none;
      padding-bottom:0;
      aspect-ratio:480/520;
      width:min(100%, var(--pd-play-width, 100%));
      margin:0 auto;
    }
  }
  .ptica-dobra-app #game-canvas-wrap canvas{
    display:block !important;
    max-width:100% !important;
    max-height:100% !important;
    margin:auto !important;
    border-radius:0 0 24px 24px;
    touch-action:none;
  }
  .ptica-dobra-app .progress-track{
    /* The progress rail lives INSIDE .game-hud. This makes protruding side
       "tabs" structurally impossible even while Phaser is being resized. */
    position:absolute;left:14px;right:14px;bottom:0;top:auto;
    width:auto;max-width:none;transform:none;
    height:6px;border-radius:6px 6px 0 0;background:#e4f4ee;overflow:hidden;z-index:1;
  }
  .ptica-dobra-app .progress-fill{height:100%;width:0%;background:linear-gradient(90deg,var(--gold),#ffbf3f);transition:width .25s ease;}
  .ptica-dobra-app .level-badge{
    position:absolute;left:50%;top:28px;transform:translateX(-50%);z-index:4;
    background:rgba(13,122,99,.92);color:#fff;font-family:var(--font-display);font-weight:600;
    font-size:12px;padding:6px 14px;border-radius:999px;white-space:nowrap;
    box-shadow:0 6px 14px -6px rgba(13,122,99,.5);
    max-width:calc(100% - 28px);overflow:hidden;text-overflow:ellipsis;
  }
  .ptica-dobra-app .idle-overlay, .ptica-dobra-app .gameover-overlay{
    position:absolute;inset:0;background:rgba(10,60,48,.92);color:#fff;
    display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
    padding:26px;gap:14px;z-index:10;
  }
  .ptica-dobra-app .gameover-overlay h3{font-family:var(--font-display);font-weight:700;margin:0;font-size:23px;}
  .ptica-dobra-app .gameover-overlay p{margin:0;color:#d8f3e9;font-size:14px;max-width:280px;}
  /* Do not use a global .hidden rule here: Leyka also uses generic hidden-state
     classes internally. Scope hiding to the game UI only so payment methods
     can manage their own visibility. */
  .ptica-dobra-app .idle-overlay.hidden,
  .ptica-dobra-app .gameover-overlay.hidden,
  .ptica-dobra-app .round-nudge.hidden,
  .ptica-dobra-app .accum-box.hidden,
  .ptica-dobra-app .exit-confirm.hidden,
  .ptica-dobra-app #milestone-modal.hidden,
  .ptica-dobra-app .donate-amount-hint.hidden,
  .ptica-dobra-app .btn.hidden{display:none !important;}

  /* IMPORTANT: Leyka Star measures its payment-method carousel on page load.
     display:none would give it a zero-width modal and break the carousel.
     Keep the donation modal laid out but completely invisible/non-interactive
     until the game opens it. */
  .ptica-dobra-app #donate-modal.hidden{
    display:flex !important;
    visibility:hidden !important;
    opacity:0 !important;
    pointer-events:none !important;
  }
  .ptica-dobra-app #donate-modal:not(.hidden){
    visibility:visible;
    opacity:1;
    pointer-events:auto;
  }

  /* ---------- MODAL ---------- */
  .ptica-dobra-app .modal-backdrop{
    position:fixed;inset:0;background:rgba(9,40,32,.55);
    -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);
    display:flex;align-items:center;justify-content:center;padding:20px;z-index:100;
  }
  .ptica-dobra-app .modal{
    background:#fff;border-radius:26px;max-width:420px;width:100%;padding:32px 28px 28px;
    text-align:center;box-shadow:0 40px 80px -20px rgba(0,0,0,.4);position:relative;
  }
  .ptica-dobra-app .modal .close-x{
    position:absolute;top:14px;right:14px;border:none;background:var(--green-pale);color:var(--green-deep);
    width:32px;height:32px;border-radius:10px;cursor:pointer;font-size:16px;
  }
  .ptica-dobra-app .modal .egg-badge{
    width:74px;height:74px;border-radius:50%;background:linear-gradient(135deg,var(--gold),#ffbf3f);
    display:flex;align-items:center;justify-content:center;font-size:34px;margin:0 auto 14px;
    box-shadow:0 14px 24px -8px rgba(244,192,74,.6);
  }
  .ptica-dobra-app .modal h3{font-family:var(--font-display);font-weight:700;margin:0 0 10px;font-size:23px;color:var(--ink);}
  .ptica-dobra-app .modal p{margin:0 0 10px;color:var(--ink-soft);font-size:15px;}
  .ptica-dobra-app .modal .modal-meaning{
    margin:4px 0 22px;
    font-size:clamp(16px,2.2vw,19px);
    line-height:1.4;
    font-weight:800;
    color:var(--green-deep);
  }
  .ptica-dobra-app .modal .modal-actions{display:flex;flex-direction:column;gap:10px;}
  .ptica-dobra-app .modal .modal-actions .btn{width:100%;}
  .ptica-dobra-app .modal-actions-secondary{display:flex;gap:8px;flex-wrap:wrap;}
  .ptica-dobra-app .modal-actions-secondary .btn{flex:1;min-width:0;font-size:12.5px;padding:11px 8px;white-space:nowrap;}
  .ptica-dobra-app .modal-exit-link{
    border:none;background:none;color:var(--ink-soft);font-size:12.5px;
    text-decoration:underline;cursor:pointer;padding:6px 4px 0;
    align-self:center;
  }
  .ptica-dobra-app .modal-exit-link:hover{color:var(--ink);}

  /* ---------- DONATE (Leyka payment form) modal ---------- */
  .ptica-dobra-app .modal.donate-preview{
    max-width:760px;max-height:calc(100vh - 32px);overflow-y:auto;
    text-align:left;padding:30px 28px 28px;
  }
  .ptica-dobra-app .modal.donate-preview .egg-badge, .ptica-dobra-app .modal.donate-preview > h3, .ptica-dobra-app .modal.donate-preview > .donate-modal-sub{text-align:center;}
  .ptica-dobra-app .donate-modal-sub{font-size:13.5px;}
  .ptica-dobra-app .donate-amount-hint{
    font-size:13px;font-weight:700;color:var(--green-deep);
    background:var(--green-pale);border-radius:10px;padding:8px 12px;margin:0 0 14px;
    text-align:center;
  }
  .ptica-dobra-app #donate-modal #leyka-form-host.leyka-form-host{
    width:100%;
    max-width:680px;
    margin:14px auto 0;
    padding:0 !important;
    min-width:0;
    box-sizing:border-box !important;
  }
  .ptica-dobra-app .leyka-form-host *{box-sizing:border-box;}

  /* Keep the Leyka root itself padding-free (as required), but place the
     horizontal breathing room INSIDE the Star form. This makes the white
     Leyka container visibly wider than its contents and keeps it centred. */
  .ptica-dobra-app #donate-modal #leyka-form-host > div[id*="leyka-pf-"].leyka-pf-star{
    width:100% !important;
    max-width:none !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .ptica-dobra-app #donate-modal #leyka-form-host > div[id*="leyka-pf-"] .leyka-tpl-star-form{
    width:100% !important;
    max-width:none !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:24px !important;
    box-sizing:border-box !important;
  }

  .ptica-dobra-app #donate-modal #leyka-form-host .section.section--person,
  .ptica-dobra-app #donate-modal #leyka-form-host .section--person{
    padding:0 !important;
  }

  /* Game donation form: amount and periodicity belong to the game, not to Leyka UI.
     Star selectors are hidden immediately by CSS. JS below additionally removes
     equivalent controls from other Leyka templates after their DOM is initialised. */
  .ptica-dobra-app #leyka-form-host .section--periodicity,
  .ptica-dobra-app #leyka-form-host .section--description,
  .ptica-dobra-app #leyka-form-host .section--amount,
  .ptica-dobra-app #leyka-form-host .step--amount,
  .ptica-dobra-app #leyka-form-host .amount_range,
  .ptica-dobra-app #leyka-form-host .amount__range_wrapper,
  .ptica-dobra-app #leyka-form-host .amount__figure,
  .ptica-dobra-app #leyka-form-host .amount-description,
  .ptica-dobra-app #leyka-form-host [data-periodicity],
  .ptica-dobra-app #leyka-form-host [data-payment-amount-option-id],
  .ptica-dobra-app #leyka-form-host input[name="donate_amount_flex"]{
    display:none !important;
  }

  .ptica-dobra-app #leyka-form-host input[name="leyka_donation_amount"],
  .ptica-dobra-app #leyka-form-host input[name="donate_amount_flex"],
  .ptica-dobra-app #leyka-form-host input[name="leyka_recurring"]{
    pointer-events:none !important;
    user-select:none !important;
  }

  .ptica-dobra-app .pd-test-gateway{
    margin:14px 0 18px;padding:14px 16px;border:1px dashed rgba(124,92,214,.55);
    border-radius:14px;background:#f7f3ff;color:var(--ink);display:flex;flex-direction:column;gap:7px;
  }
  .ptica-dobra-app .pd-test-gateway strong{font-family:var(--font-display);font-size:15px;color:var(--purple-deep);}
  .ptica-dobra-app .pd-test-gateway span{font-size:12.5px;line-height:1.45;color:var(--ink-soft);}
  .ptica-dobra-app .pd-test-gateway .btn{align-self:flex-start;padding:10px 16px;font-size:13px;box-shadow:none;}
  .ptica-dobra-app .pd-test-gateway small{font-size:12px;color:var(--ink-soft);min-height:1.4em;}
  .ptica-dobra-app .pd-test-gateway.is-success{background:#eefaf4;border-color:rgba(13,122,99,.45);}
  .ptica-dobra-app .pd-test-gateway.is-error{background:#fff1f1;border-color:rgba(180,40,55,.45);}

  .ptica-dobra-app .pd-payment-result{
    margin:16px 0 4px;text-align:center;
  }
  .ptica-dobra-app .pd-payment-result-card{
    padding:24px 22px;border-radius:18px;background:var(--green-pale);
    border:1px solid rgba(13,122,99,.2);box-shadow:var(--shadow);
  }
  .ptica-dobra-app .pd-payment-result-card h4{
    margin:0 0 10px;font-family:var(--font-display);font-size:22px;color:var(--green-deep);
  }
  .ptica-dobra-app .pd-payment-result-card p{margin:0 0 12px;text-align:center;max-width:none;}
  .ptica-dobra-app .pd-payment-result-card .pd-payment-result-meta{
    font-size:13px;font-weight:700;color:var(--ink-soft);margin-bottom:18px;
  }
  .ptica-dobra-app .pd-payment-result-card .btn{box-shadow:none;}

  .ptica-dobra-app .pd-leyka-error{
    margin:14px 0 0;padding:14px;border-radius:12px;background:#fff1f1;
    color:#8a2430;font-weight:700;text-align:center;
  }
  @media (max-width:520px){
    .ptica-dobra-app .modal.donate-preview{padding:24px 14px 18px;max-height:calc(100vh - 16px);}
    .ptica-dobra-app #donate-modal #leyka-form-host > div[id*="leyka-pf-"] .leyka-tpl-star-form{
      padding:12px !important;
    }
  }

  /* ---------- SHARE ---------- */
  .ptica-dobra-app .share{padding:10px 0 60px;text-align:center;}
  .ptica-dobra-app .share h2{font-family:var(--font-display);font-weight:700;font-size:23px;margin:0 0 8px;}
  .ptica-dobra-app .share p{color:var(--ink-soft);margin:0 0 20px;}
  .ptica-dobra-app .share-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}

  /* ---------- SUPPORTERS (список поддержавших + "каждый 10-й") ---------- */
  .ptica-dobra-app .supporters{padding:10px 0 60px;text-align:center;}
  .ptica-dobra-app .supporters h2{font-family:var(--font-display);font-weight:700;font-size:23px;margin:0 0 8px;}
  .ptica-dobra-app .supporters > p{color:var(--ink-soft);margin:0 auto 24px;max-width:560px;}
  .ptica-dobra-app .supporters-panel{
    background:#fff;border-radius:24px;box-shadow:var(--shadow);
    padding:26px 28px;max-width:640px;margin:0 auto;text-align:left;
  }
  .ptica-dobra-app .supporters-stat{
    display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;
    padding-bottom:16px;margin-bottom:16px;border-bottom:1px solid var(--green-pale);
  }
  .ptica-dobra-app .supporters-stat-num{font-family:var(--font-display);font-weight:700;font-size:30px;color:var(--green-deep);font-variant-numeric:tabular-nums;}
  .ptica-dobra-app .supporters-stat-lbl{color:var(--ink-soft);font-size:14px;}
  .ptica-dobra-app .supporters-list{min-height:0;}
  .ptica-dobra-app .supporters-empty{margin:0;color:var(--ink-soft);font-size:13.5px;line-height:1.5;}
  .ptica-dobra-app .supporters-names{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;}
  .ptica-dobra-app .supporters-names li{
    display:flex;justify-content:space-between;gap:12px;font-size:14px;color:var(--ink);
    background:var(--green-pale);border-radius:10px;padding:8px 12px;
  }
  .ptica-dobra-app .supporters-names li span:last-child{color:var(--ink-soft);font-size:12.5px;white-space:nowrap;}
  .ptica-dobra-app .supporters-names .supporter-name{
    display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0;
  }
  .ptica-dobra-app .supporters-names li.supporter-winner{
    background:linear-gradient(135deg,#fff7d6,#eaf9ef);
    border:2px solid var(--gold);
    box-shadow:0 8px 20px -14px rgba(13,122,99,.65);
    padding:7px 10px;
  }
  .ptica-dobra-app .supporter-winner-badge{
    display:inline-flex;align-items:center;
    padding:2px 8px;border-radius:999px;
    background:#fff;color:var(--green-deep) !important;
    border:1px solid rgba(244,192,74,.75);
    font-size:11px !important;font-weight:800;line-height:1.4;white-space:nowrap;
  }

  /* ---------- FOOTER ---------- */
  .ptica-dobra-app footer{background:var(--ink);color:#bfe3d7;padding:34px 0;}
  .ptica-dobra-app .footer-row{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;font-size:13.5px;}
  .ptica-dobra-app footer a{color:#eafff6;text-decoration:none;font-weight:700;}
  .ptica-dobra-app footer a:hover{text-decoration:underline;}

  @media (max-width:920px){
    .ptica-dobra-app .hero-grid{grid-template-columns:1fr;}
    .ptica-dobra-app .hero-art{order:-1;max-width:280px;margin:0 auto;}
    .ptica-dobra-app .steps{grid-template-columns:1fr;}
    .ptica-dobra-app h1{font-size:34px;}
  }
  @media (max-width:520px){
    .ptica-dobra-app .game-panel{padding:16px;border-radius:24px;}
    .ptica-dobra-app h1{font-size:28px;}
    .ptica-dobra-app .btn{padding:14px 22px;font-size:15.5px;}
  }
  @media (max-width:380px){
    .ptica-dobra-app .game-hud{padding:10px 12px;}
    .ptica-dobra-app .hud-block{font-size:13px;gap:4px;}
    .ptica-dobra-app .hud-block .lbl{font-size:9.5px;}
    .ptica-dobra-app .sound-btn{width:32px;height:32px;font-size:14px;}
  }


  .ptica-dobra-app div[id*="leyka-pf-"].leyka-pf-star .leyka-tpl-star-form .section-title-container{
    margin:0;
  }

  .ptica-dobra-app div[id*="leyka-pf-"].leyka-pf-star{
    width:100% !important;
    max-width:none !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:0 !important;
  }

  /* Payment-method layout is intentionally NOT overridden here.
     Leyka Star keeps full control of its own carousel geometry and navigation. */
