:root {
  /* ── Kalender-first identitet (Swiss / kantig, papper + djup teal) ── */
  --paper:#FBFBF9; --panel:#FFFFFF; --ink:#14181A; --muted:#5C6663; --line:#E1E1DA;
  --accent:#0E6E6A; --accent-ink:#0A5450; --accent-tint:#D6E9E7;
  --good:#0E6E6A; --danger:#B14A3A; --amber:#C99A2E;
  --yes:#0E6E6A; --maybe:#C99A2E; --no:#B14A3A;
  --display:"Archivo",system-ui,sans-serif;
  --sans:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  /* bakåtkompat-alias (var --serif användes tidigare för rubriker) */
  --serif:"Archivo",system-ui,sans-serif;
  --gutter:clamp(20px,5vw,64px);
}
*{box-sizing:border-box}
html,body{margin:0}
html{-webkit-text-size-adjust:100%}
body{
  background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.55;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
  font-feature-settings:"tnum" 1,"lnum" 1;
}
a{color:var(--accent)}
.wrap{max-width:1120px;margin:0 auto;padding:22px 20px 72px}
.narrow{max-width:460px;margin:0 auto}
.num,.tnum{font-variant-numeric:tabular-nums}

/* Topbar */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:11px 20px;border-bottom:1px solid var(--line);background:var(--panel)}
.logo{display:flex;align-items:center;gap:8px;cursor:pointer}
.logo svg{width:22px;height:22px}
.logo b{font-family:var(--display);font-weight:800;font-size:1.02rem;letter-spacing:-.02em}
.logo span{color:var(--muted);font-family:var(--mono);font-size:.72rem;letter-spacing:.02em}
.topbar .right{display:flex;align-items:center;gap:12px;font-size:.9rem;flex-wrap:wrap;justify-content:flex-end}

/* Buttons — kantiga (liten radie), tydliga linjer */
.btn{font:inherit;font-weight:600;font-size:.92rem;border:1.5px solid var(--accent);background:var(--accent);color:#fff;padding:10px 18px;border-radius:2px;cursor:pointer;text-decoration:none;display:inline-block;text-align:center;transition:.16s}
.btn:hover{background:var(--accent-ink);border-color:var(--accent-ink)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--paper)}
.btn.sm{padding:7px 13px;font-size:.85rem}
.btn.subtle{background:var(--panel);color:var(--ink);border-color:var(--ink)}
.btn.subtle:hover{background:var(--ink);color:var(--paper)}
.btn.danger{background:transparent;color:var(--danger);border-color:transparent}
.btn.danger:hover{background:#b14a3a14}
.btn:disabled{opacity:.5;cursor:default}
.linkbtn{background:none;border:0;color:var(--muted);cursor:pointer;font:inherit;font-size:.85rem;padding:4px}
.linkbtn:hover{color:var(--ink)}

/* Cards / forms */
.card{background:var(--panel);border:1.5px solid var(--ink);border-radius:2px;padding:22px}
h1{font-family:var(--display);font-weight:800;letter-spacing:-.02em;text-wrap:balance}
h2{font-family:var(--display);font-weight:700;letter-spacing:-.01em}
h3{font-family:var(--display);font-weight:700}
label{display:block;font-family:var(--mono);font-size:.74rem;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin:14px 0 5px}
input,select,textarea{font:inherit;font-size:16px;width:100%;padding:10px 12px;border:1.5px solid var(--line);border-radius:2px;background:#fff;color:var(--ink)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px #0e6e6a22}
input[type=time],input[type=date]{font-variant-numeric:tabular-nums}
.row{display:flex;gap:10px;flex-wrap:wrap}
.row>*{flex:1}
.err{color:var(--danger);font-size:.86rem;margin-top:8px}
.pill{display:inline-block;font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);border:1.5px solid var(--line);border-radius:2px;padding:3px 9px}
.pill.pro{background:var(--accent);color:#fff;border-color:var(--accent)}
.muted{color:var(--muted)}
.divider{border:0;border-top:1px solid var(--line);margin:clamp(40px,6vw,72px) 0}

/* ── Landning (broadsheet / rutnäts-hero) ─────────────── */
.eyebrow{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:16px;display:inline-flex;align-items:center;gap:9px}
.eyebrow::before{content:"";width:26px;height:1.5px;background:var(--accent)}
.hero{display:grid;grid-template-columns:0.85fr 1.15fr;gap:clamp(28px,5vw,64px);align-items:center;margin:clamp(20px,4vw,40px) 0 8px}
@media(max-width:900px){.hero{grid-template-columns:1fr;gap:34px}}
.hero h1{font-size:clamp(34px,5.4vw,56px);line-height:1.04;margin:.1em 0 .3em;letter-spacing:-.03em}
.hero h1 .q{color:var(--accent)}
.hero p{font-size:clamp(15px,1.5vw,17px);color:var(--muted);max-width:38ch}
.hero .cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}

/* Board device (deltagare × tider) på landningen */
.demo-col{min-width:0}
.board{border:1.5px solid var(--ink);border-radius:2px;background:#fff;overflow:hidden;min-width:0}
.board-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1.5px solid var(--ink);font-family:var(--mono);font-size:.78rem;color:var(--muted)}
.board-head b{color:var(--ink);font-weight:600}
.board-head .live{display:inline-flex;align-items:center;gap:7px;color:var(--accent);white-space:nowrap}
.board-head .live::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 0 rgba(14,110,106,.5);animation:pulse 2.2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(14,110,106,.45)}70%{box-shadow:0 0 0 7px rgba(14,110,106,0)}100%{box-shadow:0 0 0 0 rgba(14,110,106,0)}}

/* Plans / pricing (kantiga ramar) */
.plan-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1.5px solid var(--ink);border-radius:2px}
@media(max-width:560px){.plan-grid{grid-template-columns:1fr}}
.plan{border-right:1px solid var(--line);padding:28px 26px;background:var(--panel);display:flex;flex-direction:column}
.plan:last-child{border-right:none}
@media(max-width:560px){.plan{border-right:none;border-bottom:1px solid var(--line)}.plan:last-child{border-bottom:none}}
.plan.pro{background:var(--ink);color:var(--paper)}
.plan.pro .muted{color:#9fb8b6}
.plan h3{font-size:1.05rem}
.plan .kind,.plan .price{font-family:var(--display)}
.price{font-family:var(--display);font-weight:800;font-size:2.1rem;letter-spacing:-.03em;margin:8px 0 2px;line-height:1}
.feat{list-style:none;padding:0;margin:14px 0 22px;font-size:.92rem;display:flex;flex-direction:column;gap:9px}
.feat li{padding:0 0 0 24px;position:relative;line-height:1.4}
.feat li:before{content:"";position:absolute;left:2px;top:.42em;width:11px;height:7px;border-left:2px solid var(--accent);border-bottom:2px solid var(--accent);transform:rotate(-45deg)}
.plan.pro .feat li:before{border-color:var(--accent-tint)}
.plan .buy{margin-top:auto}
.how-head,.price-head-title{font-family:var(--display)}

/* App layout */
.layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.8fr);gap:26px;align-items:start;margin-top:18px}
@media(max-width:900px){.layout{grid-template-columns:1fr}}
aside{display:flex;flex-direction:column;gap:16px}

/* Enspalts-vy (ägarens poll-vy) */
.owner-wrap{max-width:820px}
.poll-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-top:2px}
.poll-head__title{min-width:0}
.poll-head .btn{flex:0 0 auto;white-space:nowrap}
.add-row{margin-top:14px}
.add-row .btn{width:100%}
.owner-tools{margin-top:26px;padding-top:18px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.owner-tools .cal-set{flex:1;min-width:220px}
.owner-tools .cal-hint{margin:0;font-size:.84rem;flex:1;min-width:220px}
.export-link{color:var(--muted);font-size:.8rem;white-space:nowrap}
.export-link:hover{color:var(--ink)}
.invite-card textarea{resize:vertical;min-height:64px}
/* Mini edit/delete på kolumn-headers (ägare) */
.opt-edit{display:flex;justify-content:center;gap:4px;margin-top:6px}
.opt-mini{font:inherit;font-size:.72rem;line-height:1;border:1px solid var(--line);background:#fff;color:var(--muted);border-radius:2px;width:22px;height:20px;cursor:pointer;padding:0}
.opt-mini:hover{border-color:var(--ink);color:var(--ink)}
th.optcol.best .opt-mini,th.optcol.final .opt-mini{background:transparent;border-color:currentColor;color:inherit;opacity:.85}

/* How it works (kantiga, uppdelade celler) */
.sec-label{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0 0 18px;text-align:center}
.how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;max-width:900px;margin:18px auto 0;border:1.5px solid var(--ink);border-radius:2px}
@media(max-width:680px){.how-grid{grid-template-columns:1fr}}
.how-step{text-align:left;padding:26px 24px;border-right:1px solid var(--line)}
.how-step:last-child{border-right:none}
@media(max-width:680px){.how-step{border-right:none;border-bottom:1px solid var(--line)}.how-step:last-child{border-bottom:none}}
.how-num{display:inline-flex;align-items:center;justify-content:center;font-family:var(--mono);font-weight:600;font-size:.8rem;color:var(--accent)}
.how-step .ic{margin:6px 0 14px}
.how-step h3{font-family:var(--display);font-weight:700;font-size:1.1rem;margin:8px 0 5px}
.how-step p{color:var(--muted);font-size:.92rem;margin:0}

/* Poll list (dashboard) */
.polls{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;margin-top:16px}
.ptile{border:1.5px solid var(--line);border-radius:2px;padding:16px;background:var(--panel);cursor:pointer;display:flex;flex-direction:column;gap:6px;transition:.14s}
.ptile:hover{border-color:var(--ink)}
.ptile h3{margin:0;font-family:var(--display);font-weight:700}
.ptile .meta{color:var(--muted);font-family:var(--mono);font-size:.78rem;font-variant-numeric:tabular-nums}
.ptile .final{color:var(--accent);font-size:.82rem;font-weight:600}

/* ── Poll-rutnät (deltagare × tider) — luftigt, ej upprutat ─── */
.pollgrid-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:6px;background:var(--panel)}
table.pollgrid{border-collapse:collapse;width:100%;min-width:420px;font-variant-numeric:tabular-nums}
table.pollgrid th,table.pollgrid td{padding:0;text-align:center}
/* Bara subtila radavskiljare — inga vertikala rutnäts-linjer mellan kolumner */
table.pollgrid tbody tr+tr td{border-top:1px solid var(--line)}
table.pollgrid thead th{background:var(--panel);position:sticky;top:0;z-index:1;padding:14px 12px 12px;vertical-align:bottom;border-bottom:1px solid var(--line)}
table.pollgrid thead th.optcol.best{color:var(--accent-ink);box-shadow:inset 0 -2px 0 var(--accent)}
table.pollgrid thead th.optcol.best .opt-time{color:var(--accent)}
table.pollgrid thead th.optcol.final{color:#8a6410;box-shadow:inset 0 -2px 0 var(--amber)}
table.pollgrid thead th.optcol.final .opt-time{color:#a9791f}
.opt-date{font-family:var(--display);font-weight:700;font-size:.92rem;display:block;white-space:nowrap;letter-spacing:-.01em}
.opt-time{font-family:var(--mono);font-size:.74rem;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.opt-badge{display:inline-block;margin-top:6px;font-family:var(--mono);font-size:.6rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;padding:2px 7px;border-radius:2px}
.opt-badge.best{background:var(--accent-tint);color:var(--accent-ink)}
.opt-badge.final{background:#c99a2e26;color:#8a6410}
.namecol{text-align:left;padding:12px 16px !important;font-weight:600;white-space:nowrap;position:sticky;left:0;background:var(--panel);z-index:1}
.pollgrid tbody tr:hover .namecol{color:var(--accent-ink)}
.pollgrid tbody td.cell{height:52px}
.pollgrid tbody td.cell.best{background:#0e6e6a0d}
.pollgrid tbody td.cell.final{background:#c99a2e14}
.mark{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;font-weight:700;font-size:.92rem}
.mark.yes{color:var(--yes)}
.mark.maybe{color:#8A6410}
.mark.no{color:#6E7673}
.mark.blank{color:#dcdcd4}
/* Summeringsrad — mjuk avgränsning, ingen tung linje */
.pollgrid tfoot td{padding:11px 9px;border-top:1px solid var(--line);font-size:.82rem}
.pollgrid tfoot tr td{border-top:2px solid var(--line)}
.pollgrid tfoot td.cell.best{background:#0e6e6a0d}
.pollgrid tfoot td.cell.final{background:#c99a2e14}
.tally{display:flex;flex-direction:column;gap:1px;align-items:center;line-height:1.25;font-variant-numeric:tabular-nums}
.tally .yn{font-family:var(--mono);font-weight:600;color:var(--accent);font-size:1.05rem}
.tally .sub{font-family:var(--mono);color:var(--muted);font-size:.72rem}
.finalbtn{margin-top:5px;font-family:var(--mono);font-size:.7rem;padding:4px 9px;border-radius:2px;border:1.5px solid var(--line);background:#fff;color:var(--accent);cursor:pointer;font-weight:600;letter-spacing:.02em}
.finalbtn:hover{border-color:var(--accent)}
.finalbtn.is-final{background:var(--amber);color:#241a04;border-color:var(--amber)}

/* Vote-form (deltagare) */
.voteform{margin-top:16px}
.voteopt{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1.5px solid var(--line);border-radius:2px;background:#fff;margin-bottom:8px}
.voteopt .vinfo{flex:1;min-width:0}
.voteopt .vdate{font-family:var(--display);font-weight:700}
.voteopt .vtime{font-family:var(--mono);font-size:.8rem;color:var(--muted);font-variant-numeric:tabular-nums}
.segbtns{display:inline-flex;border:1.5px solid var(--line);border-radius:2px;overflow:hidden;flex:0 0 auto}
.segbtns button{font:inherit;font-size:.82rem;font-weight:600;border:0;background:#fff;color:var(--muted);padding:7px 13px;cursor:pointer;border-left:1px solid var(--line)}
.segbtns button:first-child{border-left:0}
.segbtns button[aria-pressed="true"].yes{background:var(--yes);color:#fff}
.segbtns button[aria-pressed="true"].maybe{background:var(--maybe);color:#241a04}
.segbtns button[aria-pressed="true"].no{background:var(--no);color:#fff}

/* Options editor (owner) */
.optlist{display:flex;flex-direction:column;gap:8px}
.optrow{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1.5px solid var(--line);border-radius:2px;background:#fff}
.optrow .oinfo{flex:1;min-width:0}
.optrow .odate{font-family:var(--display);font-weight:700}
.optrow .otime{font-family:var(--mono);font-size:.8rem;color:var(--muted);font-variant-numeric:tabular-nums}

/* Share modal */
.qr-tile{display:flex;justify-content:center;padding:16px;background:#fff;border:1.5px solid var(--line);border-radius:2px}
.qr-tile #qr{display:flex;line-height:0}
.share-link{display:flex;gap:8px;margin-top:14px}
.share-link input{flex:1;min-width:0;font-family:var(--mono);font-size:16px;color:var(--muted)}
.share-link .btn{flex:0 0 auto;white-space:nowrap}
.cal-feed{margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.cal-feed__title{font-family:var(--display);font-weight:700;font-size:.98rem;margin-bottom:4px}
.chk-row{display:flex;align-items:center;gap:8px;font-family:var(--sans);font-size:.9rem;text-transform:none;letter-spacing:0;color:var(--ink);cursor:pointer;margin-top:8px}
.chk-row input{width:auto;margin:0}

/* Consent */
.consent{position:fixed;left:16px;right:16px;bottom:16px;z-index:200;background:var(--panel);border:1.5px solid var(--ink);border-radius:2px;box-shadow:0 8px 30px rgba(0,0,0,.12);padding:14px 16px;display:flex;flex-wrap:wrap;align-items:center;gap:12px;justify-content:space-between;max-width:640px;margin:0 auto}
.consent-lead{font-size:.9rem;color:var(--ink)}
.consent-btns{display:flex;gap:8px;flex:0 0 auto}

/* Toast */
.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:var(--ink);color:var(--paper);padding:10px 16px;border-radius:2px;font-size:.88rem;z-index:50;opacity:0;transition:opacity .2s}
.toast.show{opacity:1}
.foot{margin-top:36px;color:var(--muted);font-family:var(--mono);font-size:.78rem;text-align:center;letter-spacing:.01em}
#appfoot{padding:8px 16px 40px;margin-top:0}

/* SEO-collapsible-kort (dolt-men-crawlbart), matchar Swiss/kantig kort-stil */
.seo-more{max-width:560px; margin:0 auto 22px; padding:2px 20px; color:var(--muted);
  background:var(--panel); border:1.5px solid var(--ink); border-radius:2px;}
.seo-more>summary{cursor:pointer; list-style:none; font-family:var(--display); font-size:.95rem; font-weight:600; color:var(--ink);
  padding:15px 2px; display:flex; align-items:center; gap:7px; user-select:none;}
.seo-more>summary::-webkit-details-marker{display:none}
.seo-more>summary::after{content:"›"; display:inline-block; transition:transform .15s; font-size:1.2rem; line-height:1; color:var(--muted); margin-left:auto;}
.seo-more[open]>summary{border-bottom:1px dashed var(--line);}
.seo-more[open]>summary::after{transform:rotate(90deg);}
.seo-more>summary:hover{color:var(--ink);}
.seo-more-body{font-size:.9rem; line-height:1.6; color:var(--muted); padding:12px 2px 14px;}
.seo-more-body h1{font-size:1.15rem; margin:8px 0 6px; color:var(--ink); font-family:var(--display);}
.seo-more-body h2{font-size:1rem; margin:18px 0 6px; color:var(--ink); font-family:var(--display);}
.seo-more-body h3{font-size:.92rem; margin:14px 0 3px; color:var(--ink); font-family:var(--display);}
.seo-more-body p,.seo-more-body ul,.seo-more-body ol{margin:0 0 12px;}
.seo-more-body ul,.seo-more-body ol{padding-left:20px;}

/* Modal */
.modal-bg{position:fixed;inset:0;background:#14181a66;display:grid;place-items:center;z-index:40;padding:16px;overflow-y:auto}
.modal{background:var(--panel);border:1.5px solid var(--ink);border-radius:2px;padding:24px;max-width:440px;width:100%}
.modal.share-modal{max-width:420px}
.modal.checkout-modal{max-width:480px;max-height:92vh;max-height:92dvh;overflow-y:auto}
#ec-mount{min-height:120px}
.modal h2{margin:0 0 4px}
/* Diskret avvisbar install-pill. Vänsterställd + auto-bredd → krockar inte med support-bubblan
   (nere till höger). Sitter över consent-baren (env safe-area + marginal) så den aldrig skyms.
   Avvisas via ×; gömmer sig i 7 dagar (mt_install_dismissed). */
.installbtn{position:fixed;left:14px;right:auto;bottom:calc(14px + env(safe-area-inset-bottom, 0px));
  z-index:150;display:inline-flex;align-items:center;gap:2px;padding:0;
  background:var(--panel);color:var(--ink);border:1.5px solid var(--ink);border-radius:2px;
  box-shadow:0 4px 16px rgba(0,0,0,.12);font:inherit;font-size:.82rem;font-weight:600;cursor:pointer;
  max-width:calc(100vw - 90px)}
.installbtn .ib-main{display:inline-flex;align-items:center;gap:6px;padding:8px 6px 8px 14px;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.installbtn .ib-x{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
  width:26px;height:30px;margin-right:4px;border-radius:2px;font-size:1.15rem;line-height:1;
  color:var(--muted);opacity:.85}
.installbtn .ib-x:hover{opacity:1;background:rgba(20,24,26,.10)}
.installbtn svg{display:block}
/* När consent-baren visas: lyft install-pillen ovanför den så de inte överlappar. */
body:has(.consent) .installbtn{bottom:calc(84px + env(safe-area-inset-bottom, 0px));}

/* Legend / summary aside */
.sumrow{display:flex;align-items:center;gap:9px;font-size:.86rem;padding:5px 0}
.sumrow .sd{width:11px;height:11px;flex:none}
.sumrow.yes .sd{background:var(--yes)} .sumrow.maybe .sd{background:var(--maybe)} .sumrow.no .sd{background:var(--no)}
.best-box{border:1.5px solid var(--accent);border-radius:2px;padding:15px 17px;background:var(--accent-tint)}
.best-box .bl{font-family:var(--mono);font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent);font-weight:600}
.best-box .bd{font-family:var(--display);font-size:1.15rem;font-weight:700;margin-top:3px}
.final-box{border-color:var(--amber);background:#c99a2e1a}
.final-box .bl{color:#a9791f}

/* ══════════════════════════════════════════════════════════
   Kort-vy (Skiss 3) — ett kort per tid, röst inline
   ══════════════════════════════════════════════════════════ */
.card-wrap{max-width:600px}
.phead-meta .meta{font-family:var(--mono);font-size:.8rem;color:var(--muted);margin-top:8px;display:flex;flex-wrap:wrap;gap:4px 14px}
.phead-meta .meta span{display:inline-flex;align-items:center}
.phead-meta .meta span::before{content:"";display:inline-block;width:5px;height:5px;background:var(--accent);margin-right:7px}

/* best/final-box: luft ovanför i kort-vyn */
.card-wrap #bestbox:not(:empty){margin-top:16px}

/* Översikts-remsa: prick/chip per tid, trafikljus, inga namn, tappbar */
.overview{display:flex;align-items:center;gap:10px;margin-top:14px}
.overview:empty{display:none}
.ov-label{font-family:var(--mono);font-size:.62rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);flex:0 0 auto}
.ov-track{display:flex;gap:6px;overflow-x:auto;padding:2px 0;-webkit-overflow-scrolling:touch}
.ov-chip{display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;font:inherit;font-size:.74rem;font-weight:500;color:var(--ink);background:#fff;border:1.5px solid var(--line);border-radius:2px;padding:5px 9px;cursor:pointer;transition:.14s;white-space:nowrap}
.ov-chip:hover{border-color:var(--ink)}
.ov-chip .ov-dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto;background:#c9c9c2}
.ov-chip.green .ov-dot{background:var(--yes)}
.ov-chip.amber .ov-dot{background:var(--maybe)}
.ov-chip.red .ov-dot{background:var(--no)}
.ov-chip .ov-d{color:var(--muted)}
.ov-chip b{color:var(--ink)}
.ov-chip .ov-dash{color:var(--muted)}
.ov-chip.is-best{border-color:var(--accent)}
.ov-chip.is-final{border-color:var(--amber)}

/* Vem-är-du-chip */
.me{display:flex;align-items:center;gap:10px;margin:20px 0 6px;padding:11px 14px;border:1.5px solid var(--ink);border-radius:2px;background:var(--panel)}
.me .dot{width:26px;height:26px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-family:var(--mono);font-size:.7rem;font-weight:600;flex:0 0 auto}
.me input{flex:1;font:inherit;font-weight:600;border:0;background:transparent;padding:2px;min-width:0;width:auto}
.me input::placeholder{color:#a9b0ac;font-weight:400}
.me input:focus{outline:none;box-shadow:none}
.me input.need{color:var(--danger)}
.me .tag{font-family:var(--mono);font-size:.62rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);flex:0 0 auto}
/* Diskret ✎ för att ändra sitt eget namn i efterhand (visas bara när jag är sparad deltagare). */
.me-edit{font:inherit;font-size:.72rem;line-height:1;border:1px solid var(--line);background:#fff;color:var(--muted);border-radius:2px;width:24px;height:22px;cursor:pointer;padding:0;flex:0 0 auto}
.me-edit:hover{border-color:var(--ink);color:var(--ink)}
.me.need{border-color:var(--danger);box-shadow:0 0 0 3px #b14a3a1f}
.hint{font-family:var(--mono);font-size:.72rem;color:var(--muted);margin:0 0 14px;padding-left:2px}

/* Kort */
.cards{display:flex;flex-direction:column;gap:12px}
.card.best{border-color:var(--accent);box-shadow:inset 3px 0 0 var(--accent)}
.card.final{border-color:var(--amber);box-shadow:inset 3px 0 0 var(--amber)}
.card{padding:15px 16px;transition:box-shadow .16s,border-color .16s}
.card.flash{box-shadow:0 0 0 3px #0e6e6a44}
.card.best.flash{box-shadow:inset 3px 0 0 var(--accent),0 0 0 3px #0e6e6a44}
.card.final.flash{box-shadow:inset 3px 0 0 var(--amber),0 0 0 3px #c99a2e55}
.card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.ct-left{min-width:0}
.cdate{font-family:var(--display);font-weight:700;font-size:1.08rem;display:flex;align-items:center;gap:9px;flex-wrap:wrap;letter-spacing:-.01em}
.ctime{font-family:var(--mono);font-size:.8rem;color:var(--muted);margin-top:2px}
.cbadge{font-family:var(--mono);font-size:.58rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;padding:2px 7px;border-radius:2px;white-space:nowrap}
.cbadge.best{background:var(--accent-tint);color:var(--accent-ink)}
.cbadge.final{background:#c99a2e26;color:#8a6410}
.cedit{display:flex;gap:5px;flex:0 0 auto}
.cedit .mini{font:inherit;font-size:.72rem;line-height:1;border:1px solid var(--line);background:#fff;color:var(--muted);border-radius:2px;width:24px;height:22px;cursor:pointer;padding:0}
.cedit .mini:hover{border-color:var(--ink);color:var(--ink)}

/* fit-stapel + tally */
.cmid{display:flex;align-items:center;gap:12px;margin:13px 0 4px}
.bar{flex:1;height:8px;border:1px solid var(--line);border-radius:2px;background:#fff;display:flex;overflow:hidden}
.bar i{display:block;height:100%}
.bar .y{background:var(--yes)}.bar .m{background:var(--maybe)}
.ctally{font-family:var(--mono);font-size:.78rem;color:var(--muted);white-space:nowrap}
.ctally b{color:var(--accent);font-size:1rem;font-weight:600}
.avs{display:flex;align-items:center;margin-top:11px;flex-wrap:wrap;row-gap:6px}
.av{width:23px;height:23px;border-radius:50%;display:grid;place-items:center;font-family:var(--mono);font-size:.62rem;font-weight:600;color:#fff;border:1.5px solid var(--panel);margin-left:-7px}
.av:first-child{margin-left:0}
.av.y{background:var(--yes)}.av.m{background:var(--maybe);color:#241a04}.av.n{background:#c9c9c2;color:#5c5c55}
.av.more{background:#ecece6;color:var(--muted)}
/* "DU"-avatar: dashed ring markerar konsekvent "du" bland röstarna. Fyllningen
   följer din egen röst-färg (ja/kanske/nej); neutral vit när du inte röstat (.none). */
/* Nollställ margin/padding som annars läcker in från den generiska .me-regeln (namn-pillen),
   så DU-avataren ligger inline med de andra avatarerna (behåller -7px överlapp från .av). */
.av.me{font-size:.56rem;border:1.5px dashed var(--muted);margin:0 0 0 -7px;padding:0}
.av.me.none{background:#fff;color:var(--muted)}
.av.me.y{background:var(--yes);color:#fff}
.av.me.m{background:var(--maybe);color:#241a04}
.av.me.n{background:#c9c9c2;color:#5c5c55}

/* din en-tap-röst i varje kort */
.cvote{display:flex;align-items:center;gap:10px;margin-top:13px;padding-top:13px;border-top:1px dashed var(--line)}
.cvote .lbl{font-family:var(--mono);font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);flex:0 0 auto}
.seg{display:flex;flex:1;border:1.5px solid var(--line);border-radius:2px;overflow:hidden}
.seg button{flex:1;font:inherit;font-size:.82rem;font-weight:600;border:0;border-left:1px solid var(--line);background:#fff;color:var(--muted);padding:9px 0;cursor:pointer}
.seg button:first-child{border-left:0}
.seg button.on.yes{background:var(--yes);color:#fff}
.seg button.on.maybe{background:var(--maybe);color:#241a04}
.seg button.on.no{background:var(--no);color:#fff}
.seg button:disabled{cursor:default;opacity:.55}
.cpick{font-family:var(--mono);font-size:.66rem;font-weight:600;padding:7px 11px;border-radius:2px;border:1.5px solid var(--line);background:#fff;color:var(--accent);cursor:pointer;flex:0 0 auto;white-space:nowrap}
.cpick:hover{border-color:var(--accent)}
.cpick.is-final{background:var(--amber);color:#241a04;border-color:var(--amber)}

/* spar-remsa: auto-save + valfri detalj + Klar */
.savebar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:18px;flex-wrap:wrap}
.autosave{font-family:var(--mono);font-size:.74rem;color:var(--muted);display:inline-flex;align-items:center;gap:7px}
.autosave::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent)}
.autosave.busy::before{animation:pulse 1.1s infinite}
.sb-right{display:flex;align-items:center;gap:10px}
.optlink{font-family:var(--mono);font-size:.74rem;color:var(--muted);background:none;border:0;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.optlink:hover{color:var(--ink)}
.done{font:inherit;font-weight:600;font-size:.82rem;border:1.5px solid var(--line);background:#fff;color:var(--muted);padding:6px 16px;border-radius:2px;cursor:pointer}
.done:hover{border-color:var(--ink);color:var(--ink)}

/* owner-tools i kort-vyn: staplas snyggt på smala skärmar */
.card-wrap .owner-tools{margin-top:22px}

:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ── Intervallval (månad/år) i uppgraderings-modalen ── */
.iv-pick{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.iv-opt{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:11px 12px;border:1.5px solid var(--line);border-radius:2px;cursor:pointer;background:var(--panel)}
.iv-opt input{accent-color:var(--accent);margin:0;flex:0 0 auto}
.iv-opt .iv-name{font-weight:600}
.iv-opt .iv-price{margin-left:auto;font-family:var(--mono);font-size:.9rem;color:var(--muted)}
.iv-opt .iv-tag{font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:#fff;background:var(--accent);border-radius:2px;padding:2px 7px}
.iv-opt:has(input:checked){border-color:var(--accent);background:var(--accent-tint)}
.iv-opt:has(input:checked) .iv-price{color:var(--accent-ink)}
/* ── Bottom-sheet swipe-ner-stäng (mobil) ── */
.modal.mdrag{transition:transform .28s cubic-bezier(.22,.61,.36,1);}
.modal .mhandle{display:none;}
@media (max-width:560px){
  .modal .mhandle{display:block; width:38px; height:4px; border-radius:999px; background:var(--line);
    margin:-8px auto 12px; touch-action:none;}
}
