/* GemstoneRO Vote Rewards: what the vote site adds to the main site's design system (assets/css/gs-core.css, gs-kit.css,
   gs-sky.css and gs-scenery.css are the main site's own files, unchanged). Two parts:
   1. rules copied unchanged from the main site's account sheet (mod-account.css, through the bug panel's bugs.css): the
      log in card's content (acc-auth, acc-or, acc-links, acc-field--link, acc-pw, acc-caps, acc-fine, acc-notes);
   2. the vote site's own components (gsv-): the row under the header, the vote card, the wait for the next vote, the
      reward, the help panels, the log in notes, the message page.
   Tokens only (--gs-*). Guide: handoff/pages.md (scratchpad). Built by SCR/vote/pages/build_vote_css.py. */

/* ======================================================================================================================
   1. Copied from the main site (themes/gemstone/css/mod-account.css, 2026-10-08)
   ====================================================================================================================== */
/* ---------- auth card content (layout 'auth': login, register, recovery) ---------- */
.acc-auth{display:flex;flex-direction:column;gap:var(--gs-s-5)}
.acc-auth>*{margin:0}
.acc-auth__head{display:flex;flex-direction:column;gap:8px}
.acc-auth__head>*{margin:0}
.acc-auth__title{font-size:clamp(1.625rem,1.38rem + 1vw,2.125rem);line-height:1.15}
.acc-auth__lead{color:var(--gs-text-2);font-size:var(--gs-fs-sm);line-height:1.6}
.acc-auth__lead strong{color:var(--gs-text)}
.acc-auth .gs-alert{margin:0}
.acc-auth .gs-alert__body ul{margin:.35em 0 0;padding-left:1.1em}
.acc-auth .gs-alert__body li{margin:0}
.acc-auth__foot{display:flex;flex-direction:column;gap:var(--gs-s-4)}
.acc-auth__foot>*{margin:0}

/* "or" separator */
.acc-or{display:flex;align-items:center;gap:12px;color:var(--gs-text-muted);font:700 var(--gs-fs-xs)/1.3 var(--gs-font-display);letter-spacing:.04em;text-align:center}
.acc-or::before,.acc-or::after{content:"";flex:1;height:1px;background:var(--gs-line)}

/* small link list under a form */
.acc-links{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 20px;margin:0;padding:0;list-style:none;font-size:var(--gs-fs-sm)}
.acc-links li{margin:0}
.acc-links a{display:inline-flex;align-items:center;gap:6px;min-height:36px;font-weight:600}
.acc-links .gs-icon{width:1.05em;height:1.05em}

/* very narrow phones (320px): long button labels may wrap instead of widening the card */
@media (max-width:379.98px){
  .acc-auth .gs-btn--block{height:auto;padding-block:10px;white-space:normal}
  .acc-auth .gs-btn--lg{padding-inline:14px;font-size:var(--gs-fs-md)}
}

/* ---------- form extras (all account forms) ---------- */
/* a recovery link in the label row that comes after the input in the source (Tab reaches the input first) */
.acc-field--link{position:relative}
.acc-field--link>.gs-label{padding-right:9.5em}
.acc-field__link{position:absolute;right:0;top:-9px;display:inline-flex;align-items:center;min-height:36px;font-size:var(--gs-fs-xs);font-weight:700}
.acc-opt{margin-left:2px;font:500 var(--gs-fs-xs) var(--gs-font-body);color:var(--gs-text-muted)}

/* password input with a show/hide button inside the field */
.acc-pw{position:relative;display:block}
.acc-pw>.gs-input{padding-right:96px}
.acc-pw__toggle.gs-btn{position:absolute;top:4px;right:4px;--gs-btn-h:38px;--gs-cut:7px;padding:0 12px;gap:6px;font-size:var(--gs-fs-xs)}
.acc-pw__toggle .gs-icon{width:16px;height:16px}
.acc-pw__toggle.is-on{--gs-btn-fill:rgba(92,184,255,.18);color:#fff}

/* Caps Lock hint */
.acc-caps{display:flex;align-items:center;gap:6px;color:var(--gs-warning);font-size:var(--gs-fs-xs);font-weight:700}
.acc-caps .gs-icon{width:14px;height:14px}

/* small print under a form (terms, notes) */
.acc-fine{margin:0;color:var(--gs-text-muted);font-size:var(--gs-fs-xs);line-height:1.6}
.acc-fine a{font-weight:700}

/* note list (plain information, no emoji) */
.acc-notes{display:grid;gap:8px;margin:0;padding:0;list-style:none;color:var(--gs-text-2);font-size:var(--gs-fs-sm);line-height:1.55}
.acc-notes li{position:relative;margin:0;padding-left:20px}
.acc-notes li::before{content:"";position:absolute;left:2px;top:.55em;width:7px;height:7px;transform:rotate(45deg);background:var(--gs-sapphire-300)}
.acc-notes strong{color:var(--gs-text)}

/* ======================================================================================================================
   2. The vote site's own components (gsv-), on the main site's tokens. Where a main site component has the same job, the
      values are its own: the vote card is the Free Points share card (mod-referral.css gs-ref-share__card), the help
      panels are its "How it works" and "The rules" (gs-ref-steps, gs-ref-how__spend, gs-ref-rules__list).
   ====================================================================================================================== */

/* --- shell: the vote site's row under the header (the main site's staff row, gs-adminbar) and the current section --- */
.gsv-appbar .gs-adminbar__links a{gap:6px}
.gsv-appbar .gs-adminbar__links .gs-icon{width:14px;height:14px;opacity:.85}
.gsv-appbar__end{display:flex;align-items:center;gap:var(--gs-s-3);flex:none;min-width:0;margin-left:auto}
.gsv-appbar__who{display:inline-flex;align-items:center;gap:6px;min-width:0;margin:0;color:var(--gs-text-2);font:700 var(--gs-fs-xs)/1 var(--gs-font-display)}
.gsv-appbar__who .gs-icon{flex:none;width:14px;height:14px;color:var(--gs-azure-300)}
.gsv-appbar__name{max-width:18ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gsv-appbar__logout{display:flex;margin:0}
.gsv-appbar__logout .gs-btn{--gs-btn-h:32px;padding:0 12px;font-size:var(--gs-fs-xs)}
@media (pointer:coarse),(max-width:767.98px){.gsv-appbar__logout .gs-btn{--gs-btn-h:44px}}
@media (max-width:519.98px){.gsv-appbar__who{display:none}}
.gs-menu__link[aria-current=true]{background:rgba(79,134,255,.18)}
.gs-footer__list a[aria-current=true]{color:#fff}
.gs-drawer__foot .gs-btn[aria-current=page]{--gs-btn-edge:var(--gs-sapphire-400);--gs-btn-fill:#15306e;color:#fff}

/* --- an alert whose text is HTML blocks (gsv_alert(..., array('html' => ...)) prints div.gs-alert__text) --- */
div.gs-alert__text>*{margin:0}
div.gs-alert__text>*+*{margin-top:.35em}
div.gs-alert__text :is(ul,ol){padding-left:1.2em}
div.gs-alert__text li+li{margin-top:.2em}

/* --- "We could not verify your connection" (the connection screening): the address and provider, then the steps --- */
.gsv-screen__facts{display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px 12px;margin:.6em 0;padding:8px 12px;border-left:3px solid var(--gs-line-strong);border-radius:0 var(--gs-r-1) var(--gs-r-1) 0;background:rgba(5,10,26,.4);font-size:var(--gs-fs-xs);line-height:1.6}
div.gs-alert__text>.gsv-screen__facts{margin-top:.6em}
.gsv-screen__facts dt{color:var(--gs-text-muted);font-weight:700}
.gsv-screen__facts dd{margin:0;color:var(--gs-text);font-family:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace;overflow-wrap:anywhere}

/* --- the vote card (vote.php): the vote on the left, the reward on the right from 900 px --- */
.gsv-vote{display:grid;gap:var(--gs-s-5);margin:0 0 var(--gs-s-6)}
@media (min-width:900px){.gsv-vote{grid-template-columns:minmax(0,1fr) 288px;align-items:stretch;gap:var(--gs-s-7)}}
.gsv-vote__main{display:flex;flex-direction:column;align-items:flex-start;gap:var(--gs-s-4);min-width:0}
.gsv-vote__main>*{margin:0;max-width:100%}
.gsv-vote__title{font-size:var(--gs-fs-xl)}
.gsv-vote__text{max-width:62ch;color:var(--gs-text-2);font-size:var(--gs-fs-md);line-height:1.6}
.gsv-vote__text strong{color:var(--gs-text)}
.gsv-vote__text .gsv-gold{color:var(--gs-gold-400)}
.gsv-vote__actions{display:flex;flex-wrap:wrap;align-items:center;align-self:stretch;gap:var(--gs-s-3) var(--gs-s-5)}
.gsv-vote__btn .gs-icon{width:1.2em;height:1.2em}
.gsv-vote__hint{display:flex;align-items:flex-start;gap:8px;max-width:62ch;color:var(--gs-text-muted);font-size:var(--gs-fs-sm);line-height:1.5}
.gsv-vote__hint .gs-icon{flex:none;width:16px;height:16px;margin-top:2px;color:var(--gs-azure-300)}
.gsv-vote .gs-alert{width:100%;margin:0}
@media (max-width:519.98px){.gsv-vote__actions .gs-btn--lg{width:100%}}

/* the topsite's own banner (config.php $vote_image_url): the same link as the button, for the eye only; hidden when it does not load */
.gsv-topsite{display:inline-flex;max-width:100%;border-radius:var(--gs-r-2);line-height:0;transition:transform var(--gs-dur-2) var(--gs-ease),filter var(--gs-dur-2)}
.gsv-topsite:hover{transform:translateY(-1px);filter:brightness(1.08)}
.gsv-topsite img{display:block;width:auto;max-width:100%;height:auto;max-height:90px;border-radius:var(--gs-r-2)}
.gsv-topsite.is-broken{display:none}

/* the wait until the next vote: clock tile, time left, the next vote's time, the cooldown as a bar */
.gsv-wait{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:0 16px;width:min(100%,560px);padding:var(--gs-s-4) var(--gs-s-5);border:1px solid var(--gs-line);border-radius:var(--gs-r-3);background:rgba(5,10,26,.42)}
.gsv-wait>*{margin:0;min-width:0}
.gsv-wait__tile{width:3.25rem;height:3.25rem}
.gsv-wait__line{display:grid;gap:4px}
.gsv-wait__label{display:block;color:var(--gs-text-muted);font:700 var(--gs-fs-xs)/1.3 var(--gs-font-display);letter-spacing:.05em;text-transform:uppercase}
.gsv-wait__time{display:block;color:#fff;font:800 var(--gs-fs-2xl)/1.15 var(--gs-font-display);font-variant-numeric:tabular-nums}
.gsv-wait__next{grid-column:1/-1;margin-top:12px;color:var(--gs-text-2);font-size:var(--gs-fs-sm)}
.gsv-wait__next strong{color:var(--gs-text)}
.gsv-wait__bar{grid-column:1/-1;margin-top:10px}
.gsv-wait.is-done .gsv-wait__time{color:var(--gs-success)}
.gsv-vote__refusal{width:100%}

/* a thin progress bar (the bug panel's upload bar, gsb-progress) */
.gsv-progress{display:block;width:100%;height:8px;border:0;border-radius:999px;background:rgba(140,175,255,.12);color:var(--gs-sapphire-400);overflow:hidden;-webkit-appearance:none;appearance:none}
.gsv-progress::-webkit-progress-bar{background:rgba(140,175,255,.12);border-radius:999px}
.gsv-progress::-webkit-progress-value{background:var(--gs-gem);border-radius:999px}
.gsv-progress::-moz-progress-bar{background:linear-gradient(112deg,#386ef1,#1f4fd6);border-radius:999px}

/* the reward column: the picture, the points ready to spend (gold marks the reward only), the account's numbers */
.gsv-reward{display:grid;justify-items:center;align-content:center;gap:4px;min-width:0;padding:var(--gs-s-5) var(--gs-s-4);border:1px solid var(--gs-line);border-radius:var(--gs-r-3);background:rgba(5,10,26,.4);text-align:center}
.gsv-reward>*{margin:0;min-width:0}
.gsv-reward__art{display:block;width:160px;margin:0 0 var(--gs-s-2);filter:drop-shadow(0 8px 14px rgba(2,6,20,.5))}
.gsv-reward__art img{display:block;width:100%;height:auto}
.gsv-reward__icon{width:96px;height:96px;margin:0 0 var(--gs-s-2)}
.gsv-reward__label{color:var(--gs-text-muted);font:700 var(--gs-fs-xs)/1.3 var(--gs-font-display);letter-spacing:.05em;text-transform:uppercase}
.gsv-reward__value{color:var(--gs-gold-400);font:800 var(--gs-fs-3xl)/1.05 var(--gs-font-display);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.gsv-reward__facts{display:grid;gap:6px;width:100%;margin:var(--gs-s-3) 0 0;padding:var(--gs-s-3) 0 0;border-top:1px solid var(--gs-line)}
.gsv-reward__facts>div{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px 12px;font-size:var(--gs-fs-sm)}
.gsv-reward__facts dt{color:var(--gs-text-muted)}
.gsv-reward__facts dd{margin:0;color:var(--gs-text);font-weight:700;font-variant-numeric:tabular-nums}
@media (max-width:899.98px){
  .gsv-reward{grid-template-columns:96px minmax(0,1fr);justify-items:start;align-items:center;column-gap:16px;padding:var(--gs-s-4);text-align:left}
  .gsv-reward__art,.gsv-reward__icon{grid-row:1/3;width:96px;height:auto;margin:0}
  .gsv-reward__label{align-self:end}
  .gsv-reward__value{align-self:start}
  .gsv-reward__facts{grid-column:1/-1}
}
@media (max-width:379.98px){
  .gsv-reward{grid-template-columns:72px minmax(0,1fr);column-gap:12px}
  .gsv-reward__art,.gsv-reward__icon{width:72px}
}

/* --- how voting works + before you vote (the main site's Free Points "How it works" and "The rules") --- */
.gsv-help{display:grid;gap:var(--gs-s-5);margin:0 0 var(--gs-s-7)}
@media (min-width:1024px){.gsv-help{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.gsv-help>.gs-panel{margin:0}
.gsv-help__title{margin:0 0 var(--gs-s-4);font-size:var(--gs-fs-xl)}
.gsv-steps{display:grid;gap:var(--gs-s-4);margin:0;padding:0;list-style:none}
.gsv-steps li{display:flex;align-items:flex-start;gap:14px;margin:0}
.gsv-steps img{flex:none;width:48px;height:48px}
.gsv-steps span{display:grid;gap:2px;color:var(--gs-text-2);font-size:var(--gs-fs-sm)}
.gsv-steps strong{color:var(--gs-text);font:700 var(--gs-fs-md)/1.3 var(--gs-font-display)}
.gsv-spend{display:flex;align-items:flex-start;gap:10px;margin:var(--gs-s-5) 0 0;padding:12px 14px;border-radius:var(--gs-r-2);background:rgba(140,175,255,.06);border:1px solid var(--gs-line);color:var(--gs-text-2);font-size:var(--gs-fs-sm)}
.gsv-spend .gs-icon{flex:none;margin-top:3px;color:var(--gs-gold-400)}
.gsv-spend strong{color:var(--gs-text)}
.gsv-tips{display:grid;gap:12px;margin:0;padding:0;list-style:none;color:var(--gs-text-2);font-size:var(--gs-fs-sm)}
.gsv-tips li{position:relative;margin:0;padding-left:22px}
.gsv-tips li::before{content:"";position:absolute;left:3px;top:.5em;width:8px;height:8px;transform:rotate(45deg);background:linear-gradient(135deg,var(--gs-azure-300) 50%,var(--gs-sapphire-500) 50%)}
.gsv-tips b{color:var(--gs-text)}
.gsv-tips__note{margin:var(--gs-s-4) 0 0;padding-top:var(--gs-s-4);border-top:1px solid var(--gs-line);color:var(--gs-text-muted);font-size:var(--gs-fs-xs);line-height:1.6}
.gsv-tips__note a{font-weight:700}

/* --- the log in card: "Before you vote" (the old warning box under the button, as a quiet note list) --- */
.gsv-before{display:grid;gap:8px;margin:0;padding:12px 16px;border:1px solid var(--gs-line);border-radius:var(--gs-r-2);background:rgba(5,10,26,.42)}
.gsv-before>*{margin:0}
.gsv-before__title{display:flex;align-items:center;gap:8px;color:var(--gs-text);font:800 var(--gs-fs-sm)/1.3 var(--gs-font-display)}
.gsv-before__title .gs-icon{flex:none;width:18px;height:18px;color:var(--gs-warning)}
.gsv-before .acc-notes{gap:4px;font-size:var(--gs-fs-xs)}
.gsv-before .acc-fine a{white-space:nowrap}

/* --- a page with one message (gsv_message_page(): callback.php's results, a database that does not answer) --- */
.gsv-note{display:flex;flex-direction:column;align-items:center;gap:var(--gs-s-4);width:min(100%,600px);margin:var(--gs-s-7) auto var(--gs-s-9);text-align:center}
.gsv-note>*{margin:0}
.gsv-note__tile{width:4.25rem;height:4.25rem}
.gsv-note__art{display:block;width:160px;filter:drop-shadow(0 8px 14px rgba(2,6,20,.5))}
.gsv-note__art img{display:block;width:100%;height:auto}
.gsv-note__title{font-size:var(--gs-fs-2xl)}
.gsv-note__text{max-width:52ch;color:var(--gs-text-2);font-size:var(--gs-fs-md);line-height:1.6}
.gsv-note__text>*{margin:0}
.gsv-note__text>*+*{margin-top:.5em}
.gsv-note__text strong{color:var(--gs-text)}
.gsv-note--success .gsv-note__text strong{color:var(--gs-gold-400)}
.gsv-note__redirect{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 8px;color:var(--gs-text-muted);font-size:var(--gs-fs-sm)}
.gsv-note__redirect .gs-icon{flex:none;color:var(--gs-azure-300)}
.gsv-note__secs{color:var(--gs-text);font-weight:700;font-variant-numeric:tabular-nums}
.gsv-note__stay{font-size:var(--gs-fs-sm)}
.gsv-note__actions{justify-content:center}
.gsv-note--danger{--gs-frame-edge:rgba(255,107,129,.5)}