/* SARAVUE v11 · F3 „Echte Stimmen“ + F4 „Geschenkgutscheine“ (Look v10 „Ruhige App“)
   Gutschein-Seite /gutschein/, Karte (Vorschau + Druckansicht /api/?r=gift/view), Bewertungsseite /bewerten/, Stimmen auf der Startseite,
   Konto-Blöcke und Admin-Bereiche „Stimmen“ und „Gutscheine“. Nur Creme, Tinte, Ambrosia (Fläche) und Aktionsgrün.
   Keine Schatten-Karten, keine Verläufe, keine gestrichelten Linien, keine Deko-Rauten. */

/* ---------- Gutschein-Karte (Vorschau + Druck), Seitenverhältnis A6 quer ---------- */
.gc-card{--gc-bg:#FBF8F2;--gc-ink:#23211C;--gc-mute:#5F5A50;--gc-line:rgba(35,33,28,.16);position:relative;display:grid;grid-template-rows:auto 1fr auto;gap:6px;
  width:100%;aspect-ratio:148/105;padding:clamp(16px,5.2%,30px) clamp(18px,6%,34px);border-radius:14px;background:var(--gc-bg);color:var(--gc-ink);box-shadow:inset 0 0 0 1px var(--gc-line);overflow:hidden;container-type:inline-size}
.gc-card.gc-ambrosia{--gc-bg:#D2E7CA;--gc-ink:#23211C;--gc-mute:#3A372F;--gc-line:rgba(35,33,28,.12)}
.gc-card.gc-tinte{--gc-bg:#23211C;--gc-ink:#F6F1E8;--gc-mute:#D2E7CA;--gc-line:rgba(246,241,232,.14)}
.gc-top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.gc-mark svg,.gc-mark .logo{display:block;height:clamp(10px,3.4cqi,15px);width:auto;color:var(--gc-ink)}
.gc-kind{font:500 clamp(12px,3.4cqi,15px)/1 var(--f-sans);color:var(--gc-mute)}
.gc-amt{align-self:end;margin:0;font:400 clamp(40px,15cqi,76px)/1 var(--f-display);letter-spacing:-.01em;font-variant-numeric:tabular-nums lining-nums}
.gc-for{margin:0;font:500 clamp(15px,4.4cqi,20px)/1.25 var(--f-sans)}
.gc-msg{margin:0;font-size:clamp(13px,3.6cqi,16px);line-height:1.4;color:var(--gc-mute);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.gc-foot{display:grid;gap:4px;padding-top:10px;border-top:1px solid var(--gc-line)}
.gc-code{margin:0;font:600 clamp(15px,4.6cqi,22px)/1.2 var(--f-sans);letter-spacing:.08em;font-variant-numeric:tabular-nums lining-nums}
.gc-fine{margin:0;font-size:clamp(10.5px,2.7cqi,12.5px);line-height:1.35;color:var(--gc-mute)}

/* ---------- Seite /gutschein/ ---------- */
.gc-page .gc-head .lead{margin-top:8px;color:var(--rauch);font-size:17px;max-width:40em}
.gc-form{display:grid;gap:var(--ma-5);margin-top:var(--ma-4)}
.gc-form .bk-sec{display:grid;gap:var(--ma-3)}
.gc-form .bk-h{font:600 var(--fs-t3)/1.3 var(--f-sans);letter-spacing:-.005em}
.gc-form .opt .nm{font-variant-numeric:tabular-nums lining-nums}
.gc-other{display:grid;gap:6px;max-width:240px}
.gc-other[hidden]{display:none}
.gc-prev{display:grid;gap:var(--ma-3)}
.gc-prev .seg{justify-self:start}
.gc-prev .gc-card{max-width:440px}
.gc-direct[hidden],.gc-self-note[hidden]{display:none}
.gc-row2{display:grid;gap:var(--ma-3)}
@media (min-width:640px){.gc-row2{grid-template-columns:1fr 1fr}}
.gc-count{justify-self:end;font-size:var(--fs-micro);color:var(--rauch);font-variant-numeric:tabular-nums}
.gc-pay{display:grid;gap:6px;padding:var(--ma-4);border-radius:var(--r-2);background:var(--papier-2)}
.gc-pay p{margin:0}
.gc-errs{padding:14px 16px;border-radius:var(--r-1);background:var(--rost-hauch);color:var(--tusche)}
.gc-errs ul{margin:6px 0 0;padding-left:20px}
.gc-errs a{color:var(--tusche)}
.gc-done{display:grid;gap:var(--ma-4)}
.gc-done .pass{padding:var(--ma-5);border-radius:var(--r-2);background:var(--gruen);color:var(--tusche);display:grid;gap:6px}
.gc-done .pass .big{font:400 44px/1 var(--f-display);font-variant-numeric:tabular-nums lining-nums}
.gc-done dl{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin:0}
.gc-done dt{color:var(--rauch)}
.gc-done dd{margin:0;overflow-wrap:anywhere}
.gc-done .gc-ways{display:grid;gap:var(--ma-4)}
.gc-done .gc-way{padding-top:var(--ma-3);border-top:1px solid var(--hair)}
.gc-done .gc-way h2{font:600 17px/1.3 var(--f-sans);margin:0 0 6px}
@media (min-width:1024px){.gc-prev{grid-template-columns:minmax(0,420px);}}

/* ---------- Druckansicht der Karte ---------- */
.gc-view .app-main{max-width:720px}
.gc-view .gc-card{max-width:560px;margin:0 auto}
.gc-after{display:grid;gap:var(--ma-3);max-width:560px;margin:var(--ma-5) auto 0}
.gc-acts{display:flex;flex-wrap:wrap;gap:10px}
@media print{
  @page{size:148mm 105mm;margin:0}
  html,body{background:#fff!important}
  .no-print,.skip{display:none!important}
  .gc-view .app-main{padding:0!important;margin:0!important;max-width:none}
  .gc-view .gc-card{width:148mm;height:105mm;max-width:none;aspect-ratio:auto;border-radius:0;box-shadow:none;-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

/* ---------- Bewertungsseite /bewerten/ ---------- */
.rv-page{display:grid;gap:var(--ma-5)}
.rv-page .lead{color:var(--rauch);font-size:17px;margin-top:6px}
.rv-circles{display:flex;gap:10px;flex-wrap:wrap}
.rv-circles button{width:52px;height:52px;border-radius:50%;border:0;background:none;box-shadow:inset 0 0 0 1.5px var(--kante);color:var(--tusche);font:500 17px/1 var(--f-sans);font-variant-numeric:tabular-nums lining-nums;cursor:pointer;transition:background var(--dur-2) var(--ease),box-shadow var(--dur-2)}
.rv-circles button:hover{box-shadow:inset 0 0 0 1.5px var(--wald)}
.rv-circles button.on{background:var(--gruen);box-shadow:none;color:var(--wald);font-weight:600}
.rv-circles button[aria-checked="true"]{box-shadow:inset 0 0 0 2px var(--wald)}
.rv-scale{display:flex;justify-content:space-between;max-width:300px;font-size:var(--fs-micro);color:var(--rauch)}
.rv-sec{display:grid;gap:var(--ma-3)}
.rv-sec h2{font:600 var(--fs-t3)/1.3 var(--f-sans)}
.rv-next{display:grid;gap:var(--ma-3);padding:var(--ma-5);border-radius:var(--r-2);background:var(--papier-2)}
.rv-next h2{font:600 var(--fs-t3)/1.3 var(--f-sans);margin:0}
.rv-acts{display:flex;flex-wrap:wrap;gap:10px}
.rv-quote{margin:0;padding-left:14px;border-left:2px solid var(--gruen);color:var(--tusche);white-space:pre-line;overflow-wrap:anywhere}

/* ---------- Startseite: Stimmen ---------- */
#stimmen [data-stimmen-list]{min-height:188px}
.st-sum{font:600 15px/1.3 var(--f-sans);color:var(--tusche);white-space:nowrap;font-variant-numeric:tabular-nums lining-nums}
.st-sum small{font-weight:400;color:var(--rauch)}
.st-row{display:block}
.st-row .row-t{font:400 17px/1.45 var(--f-sans);white-space:pre-line;overflow-wrap:anywhere}
.st-reply{margin:8px 0 0;padding-left:12px;border-left:2px solid var(--gruen);font-size:15px;line-height:1.45;color:var(--tusche);white-space:pre-line}
.st-reply b{font-weight:600}
.st-note{margin:10px 0 0;font-size:14px;color:var(--rauch);max-width:46em}
.st-all{margin-top:4px}
.gc-link .row-t{font-weight:500}

/* ---------- Konto (Wallet): Stimmen und Gutscheine ---------- */
.k11 .row-v{font-size:16px}
.k11-rv{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:center}

/* ---------- Admin: Stimmen, Gutscheine ---------- */
.a11-bar{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;justify-content:space-between;margin-bottom:var(--ma-4)}
.a11-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:var(--ma-4)}
.a11-kpi{padding:14px 16px;border-radius:var(--r-2);background:var(--papier-2)}
.a11-kpi b{display:block;font:600 22px/1.2 var(--f-sans);font-variant-numeric:tabular-nums lining-nums}
.a11-kpi span{font-size:var(--fs-micro);color:var(--rauch)}
.a11-list{display:grid;gap:0;border-top:1px solid var(--hair)}
.a11-item{display:grid;gap:8px;padding:16px 0;border-bottom:1px solid var(--hair)}
.a11-head{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;align-items:baseline}
.a11-head b{font:600 17px/1.3 var(--f-sans)}
.a11-meta{font-size:14px;color:var(--rauch);overflow-wrap:anywhere}
.a11-body{margin:0;white-space:pre-line;overflow-wrap:anywhere}
.a11-acts{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.a11-st{font:500 13px/1 var(--f-sans);padding:6px 10px;border-radius:999px;background:var(--papier-2);color:var(--tusche);white-space:nowrap}
.a11-st.on{background:var(--gruen);color:var(--tusche)}
.a11-form{display:grid;gap:10px;padding:12px 0 0}
.a11-form[hidden]{display:none}
.a11-tx{margin:0;padding:0;list-style:none;font-size:14px;color:var(--rauch);display:grid;gap:2px}
.a11-empty{padding:var(--ma-5) 0;color:var(--rauch)}

/* v11 · Stimmungsbild dezent oben (Gutschein, Bewerten) – KI-generiert, siehe Fuß */
.gc-ph .ph{display:block;overflow:hidden;aspect-ratio:3/1;border-radius:16px;margin:0 0 var(--ma-5);background:var(--papier-2)}
.gc-ph .ph img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 55%}
.rv-page>header::before{content:"";display:block;aspect-ratio:3/1;border-radius:16px;margin-bottom:var(--ma-5);background:var(--papier-2) center 55%/cover no-repeat;background-image:image-set(url("/assets/img/studio/pflege-800.webp") type("image/webp"),url("/assets/img/studio/pflege-800.jpg") type("image/jpeg"))}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .gc-ph .ph img,:root:not([data-theme="light"]) .rv-page>header::before{filter:brightness(.86) saturate(.92)}}

/* UX v11: Gutschein-Leiste bei 390 px – Betrag nicht mehr abgeschnitten (zweizeilig statt Ellipse), Kartenfarbe mind. 44 px */
@media (max-width:560px){.gc-bar .tot{white-space:normal;font-size:17px;line-height:1.2}.gc-bar .l2{display:none}}
.gc-prev .seg button{min-height:44px}
.gc-ways-h{margin-top:var(--ma-4,16px)}
