/* sheets.css v3.2.0: the cookie and policy dialog, the install dialog (V302-SPEC 3 to 5) and the
   donation sheet plus the Zeffy modal frame it opens (V310-SPEC 2); since v3.2.0 the donation
   sheet is a centred card at every width (V320-SPEC 5).
   Colours come from each surface's own tokens, with the shipped values as fallbacks:
   register.css (light, white panels) and app.css (dark portal, with its light theme). */
:root{
  --sg-bg:var(--panel,#FFFFFF);
  --sg-ink:var(--ink,#1E1230);
  --sg-muted:var(--ink-2,#3C2C57);
  --sg-line:var(--line-strong,rgba(42,23,63,.22));
  --sg-link:var(--brand,#5B2A8C);
  --sg-go:linear-gradient(180deg,var(--primary-hover,#FFB940),var(--primary,#F5A623));
  --sg-on-go:var(--on-primary,#1A0F2E);
  --sg-focus:var(--accent-pink,#E0218A);
  --sg-scrim:rgba(22,11,38,.58);
  --sg-shadow:0 30px 70px -30px rgba(22,11,38,.55);
  --sg-tip:var(--panel-2,#F5F2FA);
}
html[data-sg-surface="portal"], html[data-theme="dark"]{
  --sg-bg:var(--surface,#211436);
  --sg-ink:var(--text,#F4ECDF);
  --sg-muted:var(--muted,#B4A6CE);
  --sg-line:var(--line-strong,rgba(255,255,255,.2));
  --sg-link:var(--brand,#C9ABEC);
  --sg-go:linear-gradient(135deg,var(--marigold,#F58024),var(--saffron,#F6A93B));
  --sg-on-go:var(--on-accent,#22110A);
  --sg-focus:var(--focus,#F6A93B);
  --sg-scrim:rgba(8,4,16,.66);
  --sg-shadow:0 30px 70px -30px rgba(0,0,0,.85);
  --sg-tip:var(--surface-2,#291A43);
}

/* while a dialog is open: no page scroll, no Buddy, no install pill */
html.sg-sheet-open{overflow:hidden}
html.sg-sheet-open .buddy-fab,html.sg-sheet-open .buddy,
html.sg-sheet-open #installPill,html.sg-sheet-open .install{display:none !important}

.sg-sheet-wrap{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;
  padding:16px;padding-left:calc(16px + env(safe-area-inset-left,0px));padding-right:calc(16px + env(safe-area-inset-right,0px))}
.sg-scrim{position:absolute;inset:0;background:var(--sg-scrim)}
.sg-sheet{position:relative;box-sizing:border-box;width:100%;max-width:520px;max-height:calc(100dvh - 32px);overflow:auto;
  background:var(--sg-bg);color:var(--sg-ink);border:1px solid var(--sg-line);border-radius:20px;box-shadow:var(--sg-shadow);
  padding:26px 26px 22px;font-family:var(--sans,system-ui,-apple-system,"Segoe UI",sans-serif);font-size:1rem;line-height:1.55;
  text-align:left;overscroll-behavior:contain}
.sg-sheet:focus{outline:none}
.sg-title{margin:0 0 10px;font-family:var(--serif,Georgia,serif);font-weight:700;font-size:1.4rem;line-height:1.2;color:var(--sg-ink);letter-spacing:0}
.sg-body{color:var(--sg-muted)}
.sg-body p{margin:0 0 10px}
.sg-body p:last-child{margin-bottom:0}
.sg-ios{display:flex;align-items:center;gap:12px;margin-top:14px !important;padding:12px 14px;border-radius:13px;
  background:var(--sg-tip);border:1px solid var(--sg-line);color:var(--sg-ink);font-weight:600}
.sg-share{flex:none;width:22px;height:22px;color:var(--sg-link)}

.sg-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:20px}
.sg-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;box-sizing:border-box;
  padding:11px 22px;border-radius:999px;border:1px solid transparent;font:inherit;font-weight:600;font-size:1rem;line-height:1.2;
  cursor:pointer;text-decoration:none;-webkit-tap-highlight-color:transparent}
.sg-btn-primary{background:var(--sg-go);color:var(--sg-on-go)}
.sg-btn-primary:hover{filter:brightness(1.05)}
.sg-btn-ghost{background:transparent;color:var(--sg-ink);border-color:var(--sg-line)}
.sg-btn-ghost:hover{border-color:var(--sg-link)}
.sg-link{display:inline-flex;align-items:center;min-height:44px;padding:0 4px;color:var(--sg-link);font-weight:600;
  text-decoration:underline;text-underline-offset:3px}
.sg-btn:focus-visible,.sg-link:focus-visible{outline:3px solid var(--sg-focus);outline-offset:3px}

/* phones: a bottom sheet clear of the home indicator (consent and install; the donation sheet
   is a centred card at every width, see the v3.2.0 block below) */
@media (max-width:599.98px){
  .sg-sheet-wrap{align-items:flex-end;padding:0}
  .sg-sheet{max-width:none;max-height:92dvh;border-radius:22px 22px 0 0;border-bottom:0;
    padding:22px calc(18px + env(safe-area-inset-right,0px)) calc(20px + env(safe-area-inset-bottom,0px)) calc(18px + env(safe-area-inset-left,0px))}
  .sg-sheet::before{content:"";display:block;width:40px;height:4px;border-radius:4px;background:var(--sg-line);margin:-8px auto 14px}
  .sg-title{font-size:1.25rem}
  .sg-actions .sg-btn{flex:1 1 100%}
  .sg-actions .sg-link{flex:1 1 100%;justify-content:center}
}

/* v3.2.0 (V320-SPEC 5): the donation sheet, and only that one, is a centred card at EVERY width,
   phones included: centred both ways, at most 520 px wide, a 16 px margin on every side plus the
   safe area (notch, home indicator, landscape cut outs), and it scrolls inside itself when it is
   taller than the viewport (a phone on its side, 200 percent text). sheets.js puts the class
   sg-donate-wrap on #sgDonateWrap only; consent and install keep the rules above (a bottom sheet
   below 600 px). The selectors carry two classes so they win over the phone block above at any
   width without !important. */
.sg-sheet-wrap.sg-donate-wrap{align-items:center;justify-content:center;
  padding:calc(16px + env(safe-area-inset-top,0px)) calc(16px + env(safe-area-inset-right,0px))
          calc(16px + env(safe-area-inset-bottom,0px)) calc(16px + env(safe-area-inset-left,0px))}
.sg-donate-wrap .sg-sheet{width:100%;max-width:520px;margin:0 auto;border-radius:20px;border-bottom:1px solid var(--sg-line);
  max-height:calc(100vh - 32px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));
  max-height:calc(100dvh - 32px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));
  overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}
.sg-donate-wrap .sg-sheet::before{content:none;display:none}
@media (max-width:599.98px){
  /* the wrap already keeps the card clear of the notch and the home indicator */
  .sg-donate-wrap .sg-sheet{padding:22px 20px 20px}
}

/* privacy.html: the same notice as a bar that does not block reading */
.sg-consent-bar{position:fixed;left:0;right:0;bottom:0;z-index:1000;box-sizing:border-box;background:var(--sg-bg);color:var(--sg-ink);
  border-top:1px solid var(--sg-line);box-shadow:0 -18px 40px -26px rgba(22,11,38,.45);
  padding:16px calc(16px + env(safe-area-inset-right,0px)) calc(14px + env(safe-area-inset-bottom,0px)) calc(16px + env(safe-area-inset-left,0px));
  font-family:var(--sans,system-ui,-apple-system,"Segoe UI",sans-serif);font-size:.95rem;line-height:1.5}
.sg-bar-inner{max-width:1040px;margin:0 auto}
.sg-consent-bar .sg-title{font-size:1.1rem;margin-bottom:6px}
.sg-consent-bar .sg-actions{margin-top:12px}
html.sg-bar-open body{padding-bottom:var(--sg-bar-h,0px)}
html.sg-bar-open .buddy-fab,html.sg-bar-open #installPill,html.sg-bar-open .install{display:none !important}
@media (min-width:900px){
  .sg-bar-inner{display:flex;align-items:center;gap:24px}
  .sg-consent-bar .sg-body{flex:1 1 auto}
  .sg-consent-bar .sg-title{flex:0 0 auto;max-width:180px;margin:0}
  .sg-consent-bar .sg-actions{flex:0 0 auto;margin-top:0;flex-wrap:nowrap}
}

/* motion only when the visitor has not asked for less */
@media (prefers-reduced-motion:no-preference){
  .sg-sheet-wrap .sg-scrim{opacity:0;transition:opacity .2s ease}
  .sg-sheet-wrap .sg-sheet{opacity:0;transform:translateY(14px);transition:opacity .2s ease,transform .24s ease}
  .sg-sheet-wrap.in .sg-scrim{opacity:1}
  .sg-sheet-wrap.in .sg-sheet{opacity:1;transform:none}
  .sg-consent-bar{transform:translateY(100%);transition:transform .24s ease}
  .sg-consent-bar.in{transform:none}
}

/* v3.1.0 (V310-SPEC 2): the Zeffy modal for a trigger created after load, drawn by sheets.js with
   the same geometry as Zeffy's own script (full screen on phones, a 5% / 10% inset box from 769 px).
   The frame is only injected on the first Donate tap, so nothing here paints before that. */
.sg-zeffy-wrap{position:fixed;inset:0;z-index:10000;display:block}
.sg-zeffy-wrap[hidden]{display:none}
.sg-zeffy-scrim{position:absolute;inset:0;background:rgba(0,0,0,.5)}
/* phones: a 52 px strip above the frame holds our close button, so a frame that never loads
   (host unreachable, lie-fi) still leaves a way back to the pass without a keyboard */
.sg-zeffy{position:absolute;inset:0;box-sizing:border-box;
  padding-top:calc(52px + env(safe-area-inset-top,0px));padding-bottom:env(safe-area-inset-bottom,0px)}
.sg-zeffy-frame{display:block;width:100%;height:100%;border:0;border-radius:4px;background:transparent}
.sg-zeffy-frame:focus-visible{outline:3px solid var(--sg-focus);outline-offset:-3px}
/* the close control: 44 px, an ink disc with a white glyph (contrast 15:1) and a light ring so it
   reads on the dark scrim and on a loaded form alike */
.sg-zeffy-close{position:absolute;top:calc(4px + env(safe-area-inset-top,0px));right:calc(8px + env(safe-area-inset-right,0px));
  z-index:1;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;margin:0;
  border-radius:50%;border:2px solid rgba(255,255,255,.85);background:#1E1230;color:#FFFFFF;cursor:pointer;
  box-shadow:0 6px 18px -6px rgba(0,0,0,.6);-webkit-tap-highlight-color:transparent}
.sg-zeffy-close:hover{background:#2A174A}
.sg-zeffy-close:focus-visible{outline:3px solid var(--sg-focus);outline-offset:3px}
.sg-zeffy-close svg{display:block;width:20px;height:20px}
@media (min-width:769px){
  .sg-zeffy{top:5%;bottom:5%;left:10%;right:10%;padding:0}
  .sg-zeffy-close{top:-22px;right:-22px}
}
@media (forced-colors:active){
  .sg-zeffy-close{border:2px solid ButtonText;background:ButtonFace;color:ButtonText;forced-color-adjust:none}
}
html.sg-zeffy-open{overflow:hidden}
@media (prefers-reduced-motion:no-preference){
  .sg-zeffy-wrap{opacity:0;transition:opacity .25s ease-in-out}
  .sg-zeffy-wrap.in{opacity:1}
}

/* the status line sheets.js shows when the frame never loaded and the plain page went to a new
   tab: the text plus a real link to the same page in case a late tab was refused */
.sg-toast{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:10001;
  box-sizing:border-box;max-width:min(520px,calc(100vw - 32px));padding:12px 18px;border-radius:14px;
  background:var(--sg-ink);color:var(--sg-bg);font-family:var(--sans,system-ui,-apple-system,"Segoe UI",sans-serif);
  font-size:1rem;line-height:1.45;text-align:center;box-shadow:var(--sg-shadow)}
.sg-toast-link{display:inline-block;min-height:44px;line-height:44px;padding:0 4px;color:inherit;font-weight:700;
  text-decoration:underline;text-underline-offset:3px}
.sg-toast-link:focus-visible{outline:3px solid var(--sg-focus);outline-offset:2px}
@media (prefers-reduced-motion:no-preference){
  .sg-toast{opacity:0;transition:opacity .25s ease}
  .sg-toast.in{opacity:1}
}

@media print{
  .sg-sheet-wrap,.sg-consent-bar,.sg-zeffy-wrap,.sg-toast{display:none !important}
  html.sg-bar-open body{padding-bottom:0}
}