:root{
  --ink:#16202c; --muted:#5b6675; --bg:#f3f5f8; --card:#fff; --line:#e1e6ee; --brand:#1f3a5f; --brand2:#2d5a8e; --brand-soft:var(--brand-soft);
  --well:#1e8e4e; --well-bg:#e3f5ea; --little:#2563b8; --little-bg:#e4eefb; --heard:#b26a00; --heard-bg:#fdf1dc; --dont:#a33a3a; --dont-bg:#fbe7e7;
  --none:#8a94a3; --radius:14px;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;font:17px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:var(--bg);padding-bottom:env(safe-area-inset-bottom)}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:3px solid #f2b705;outline-offset:2px}
.top{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;padding-top:calc(10px + env(safe-area-inset-top));background:var(--brand);color:#fff}
.brand{display:flex;align-items:center;gap:10px;min-width:0}
.logo{width:38px;height:38px;border-radius:10px;background:#fff;color:var(--brand);display:grid;place-items:center;font-size:24px;font-weight:700;flex:none}
h1{font-size:20px;margin:0;line-height:1.1;white-space:nowrap}
.sub{margin:0;font-size:13px;opacity:.8}
.me{display:flex;flex-direction:column;align-items:flex-end;line-height:1.1;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.35);color:#fff;border-radius:999px;padding:8px 12px;font-size:15px;white-space:nowrap;max-width:48vw;overflow:hidden;text-overflow:ellipsis}
.tabs{position:sticky;top:calc(58px + env(safe-area-inset-top));z-index:4;display:grid;grid-template-columns:repeat(5,auto);justify-content:space-around;background:#fff;border-bottom:1px solid var(--line)}
.tabs button{border:0;background:none;padding:13px 6px;font-size:15px;white-space:nowrap;font-weight:600;color:var(--muted);border-bottom:3px solid transparent}
.tabs button.on{color:var(--brand);border-bottom-color:var(--brand)}
main{max-width:760px;margin:0 auto;padding:12px 12px 40px}
h2{font-size:21px;margin:14px 2px 10px}
h2.big{font-size:26px;text-align:center;margin-top:24px}
h2.mt{margin-top:34px}
.hint{color:var(--muted);margin:6px 2px 12px;font-size:15px}
#v-pick .hint{text-align:center}
.pick{display:grid;gap:12px;max-width:420px;margin:18px auto}
.pick button{padding:18px;font-size:21px;font-weight:600;border-radius:var(--radius);border:2px solid var(--line);background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.05)}
.pick button:active{background:var(--brand-soft);border-color:var(--brand2)}
.bar{display:grid;gap:10px;margin-bottom:12px}
input[type=search],input:not([type]),select{width:100%;padding:13px 14px;border:1.5px solid var(--line);border-radius:12px;background:#fff;font-size:17px}
.chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.chips.wrap{flex-wrap:wrap;overflow:visible;margin:16px 0 8px}
.chips button{flex:none;border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:8px 14px;font-size:15px;font-weight:600;color:var(--muted)}
.chips button.on{background:var(--brand);border-color:var(--brand);color:#fff}
.sort{display:flex;align-items:center;gap:8px;font-size:15px;color:var(--muted)}
.sort select{flex:1;padding:10px 12px}
.actions{display:flex;gap:8px;flex-wrap:wrap}
.ghost{border:1.5px solid var(--line);background:#fff;border-radius:12px;padding:10px 14px;font-weight:600;font-size:15px}
.primary{border:0;background:var(--brand);color:#fff;border-radius:12px;padding:13px 18px;font-weight:700}
.primary:active{background:var(--brand2)}
.progress{margin:0 2px;color:var(--muted);font-size:15px}
.songs{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.song{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:12px;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.head{display:flex;gap:12px;align-items:center}
.art{width:56px;height:56px;border-radius:10px;flex:none;object-fit:cover;background:linear-gradient(135deg,var(--brand2),var(--brand));color:#fff;display:grid;place-items:center;font-size:26px}
.meta{min-width:0;flex:1}
.title{font-weight:700;font-size:18px;line-height:1.25;overflow-wrap:anywhere}
.he{font-weight:500;color:var(--muted);font-size:15px;direction:rtl;text-align:left;unicode-bidi:isolate}
.artist{color:var(--muted);font-size:15px;overflow-wrap:anywhere}
.zing{flex:none;align-self:flex-start;text-decoration:none;font-size:14px;font-weight:700;color:#7b1fa2;background:#f5e9fb;border-radius:999px;padding:7px 11px}
.levels{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.lv{border:2px solid var(--line);background:#fff;border-radius:12px;padding:12px 6px;font-size:16px;font-weight:700;min-height:52px;line-height:1.15}
.lv.well{color:var(--well)} .lv.little{color:var(--little)} .lv.heard{color:var(--heard)} .lv.dont{color:var(--dont)}
.lv.on.well{background:var(--well);border-color:var(--well);color:#fff}
.lv.on.little{background:var(--little);border-color:var(--little);color:#fff}
.lv.on.heard{background:var(--heard);border-color:var(--heard);color:#fff}
.lv.on.dont{background:var(--dont);border-color:var(--dont);color:#fff}
.lv.on::before{content:""}
.empty{text-align:center;color:var(--muted);padding:30px 10px;background:#fff;border-radius:var(--radius);border:1px dashed var(--line)}
.counts{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.pill{border-radius:999px;padding:4px 10px;font-size:14px;font-weight:700}
.pill.well{background:var(--well-bg);color:var(--well)} .pill.little{background:var(--little-bg);color:var(--little)}
.pill.heard{background:var(--heard-bg);color:var(--heard)} .pill.dont{background:var(--dont-bg);color:var(--dont)} .pill.none{background:#eef0f3;color:var(--muted)}
.meter{display:flex;height:9px;border-radius:9px;overflow:hidden;background:#eef0f3;margin-top:10px}
.meter i{display:block;height:100%}
.meter .well{background:var(--well)} .meter .little{background:var(--little)} .meter .heard{background:var(--heard)} .meter .dont{background:var(--dont)}
.who{margin:10px 0 0;padding:0;list-style:none;display:grid;gap:4px;font-size:15px}
.who b{display:inline-block;min-width:9.5em}
.who .well b{color:var(--well)} .who .little b{color:var(--little)} .who .heard b{color:var(--heard)} .who .dont b{color:var(--dont)} .who .none b{color:var(--none)}
.tablewrap{overflow-x:auto;background:#fff;border:1px solid var(--line);border-radius:var(--radius)}
table.grid{border-collapse:collapse;width:100%;font-size:15px}
.grid th,.grid td{padding:9px 8px;text-align:center;border-bottom:1px solid var(--line);white-space:nowrap}
.grid th:first-child,.grid td:first-child{text-align:left}
.grid thead th{font-size:13px;color:var(--muted)}
.grid td.well{color:var(--well);font-weight:700}.grid td.little{color:var(--little);font-weight:700}.grid td.heard{color:var(--heard);font-weight:700}.grid td.dont{color:var(--dont);font-weight:700}
.group{margin:14px 0}
.group h3{margin:0 0 6px;font-size:17px}
.group ul{margin:0;padding-left:20px}
.group li{margin:3px 0}
.row{display:flex;gap:8px}
.row input{flex:1;min-width:0}
.stack{display:grid;gap:10px}
.add{flex:none;border:0;background:var(--brand);color:#fff;border-radius:10px;padding:10px 14px;font-weight:700;font-size:15px}
.add[disabled]{background:#cfd6e0;color:#5b6675}
.small{font-size:13px;color:var(--muted)}
.rm{border:0;background:none;color:var(--muted);font-size:13px;text-decoration:underline;padding:6px 0 0}
.toast{position:fixed;left:50%;bottom:calc(22px + env(safe-area-inset-bottom));transform:translateX(-50%) translateY(30px);opacity:0;background:#16202c;color:#fff;padding:11px 18px;border-radius:999px;font-weight:600;transition:.2s;pointer-events:none;z-index:20;max-width:90vw}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.foot{text-align:center;color:var(--muted);font-size:13px;padding:10px 16px 30px}
.foot a{color:inherit}
.printonly{display:none}
@media (min-width:700px){.levels{grid-template-columns:repeat(4,1fr)}}
@media print{
  body{background:#fff;font-size:11pt}
  .top,.tabs,main,.toast,.foot{display:none!important}
  .printonly{display:block}
  .printonly h1{color:#000;font-size:18pt;margin:0 0 4pt}
  .printonly table{border-collapse:collapse;width:100%;font-size:9.5pt}
  .printonly th,.printonly td{border:1px solid #999;padding:3pt 4pt;text-align:center}
  .printonly td:first-child,.printonly th:first-child{text-align:left}
  .printonly tr{break-inside:avoid}
  .printonly tr.grp th{background:#e8edf4;text-align:left;font-size:11pt;padding:5pt 4pt}
  .printonly td b,.printonly td small{unicode-bidi:isolate}
}

.me small{font-size:11px;opacity:.75;font-weight:400}
.me b{font-weight:600}
@media (max-width:420px){.sub{display:none}.grid th,.grid td{padding:9px 5px}}

/* Zing search from the Mark tab */
.searchform{margin:0}
.zingbtn{width:100%;border:2px solid var(--brand2);background:var(--brand-soft);color:var(--brand);border-radius:12px;padding:12px 14px;font-weight:700;font-size:16px;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.zingbtn:active{background:#dce7f6}
.zingbox{margin-top:18px}
.zinghead{font-size:19px;margin:6px 2px 4px;color:var(--brand)}
.empty .linkbtn,.linkbtn{display:inline-block;margin-top:10px;border:2px solid var(--brand2);background:var(--brand-soft);color:var(--brand);border-radius:12px;padding:10px 14px;font-weight:700;font-size:15px}

/* v3: Activity tab */
@media (max-width:420px){.tabs button{font-size:14px;padding:13px 3px}}
.who-t td,.who-t th{font-size:16px}
.who-t tbody tr{cursor:pointer}
.who-t tbody tr.on td{background:var(--brand-soft)}
.who-t td.name{font-weight:700;color:var(--brand);text-decoration:underline;text-underline-offset:3px;white-space:normal;min-width:92px}
.who-t td.seen{font-size:14px;color:var(--ink);white-space:normal}
.who-t td.never{color:var(--none)}
.feedhead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:22px}
.feedhead h2{margin:10px 2px}
.feed{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.feed li{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px;font-size:17px;line-height:1.35}
.feed li .t{display:block;font-size:14px;color:var(--muted);margin-top:3px}
.feed li b{color:var(--brand)}
.feed li.a-visit{background:#f8fafc;color:var(--muted);font-size:16px}
.feed li.a-remove{border-left:4px solid var(--dont)}
.feed li.a-add{border-left:4px solid var(--brand2)}
.feed li .lvl{font-weight:700}
.feed li .lvl.well{color:var(--well)} .feed li .lvl.little{color:var(--little)} .feed li .lvl.heard{color:var(--heard)} .feed li .lvl.dont{color:var(--dont)}
.feed .day{background:none;border:0;padding:10px 2px 0;font-size:14px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.ghost.wide{display:block;width:100%;margin:14px 0 6px;padding:14px;font-size:17px}

/* v4: Manual List, type + source filters, Hebrew niggunim */
.clabel{flex:none;align-self:center;font-size:13px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;min-width:42px}
.tchips button{padding:7px 12px;font-size:14px}
.tline{margin-top:4px}
.tbadge{display:inline-block;font-size:12px;font-weight:700;color:var(--brand);background:var(--brand-soft);border-radius:999px;padding:2px 9px}
.meta[dir=rtl] .title{font-size:19px}
.zingbtn.small-zing{padding:9px 12px;font-size:15px;border-width:1.5px}
.feed li.a-import,.feed li.a-unseed{border-left:4px solid var(--well);background:#f6fbf8}
@media (max-width:420px){.tabs button{font-size:13.5px;padding:13px 2px}}

.part{font-size:13px;font-weight:500;color:var(--muted);text-decoration:none}
.part.blk{display:block;margin-top:2px}
.pick button .part{font-size:15px;margin-top:4px}
.who-t td.name .part{text-decoration:none;display:block}
h2 .part{font-size:15px;margin-left:6px}

/* v7: Settings */
.topr{display:flex;align-items:center;gap:8px;flex:none}
.gear{width:44px;height:44px;border-radius:999px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.15);font-size:21px;line-height:1;display:grid;place-items:center;padding:0}
.gear.on{background:rgba(255,255,255,.4);box-shadow:0 0 0 2px #fff}
.brand{flex:1}
h1{overflow:hidden;text-overflow:ellipsis}
#v-settings h4{margin:18px 2px 8px;font-size:16px;color:var(--brand)}
.sect{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);margin:0 0 12px;overflow:hidden}
.sect>summary{list-style:none;cursor:pointer;padding:16px;font-size:18px;font-weight:700;display:flex;justify-content:space-between;align-items:center}
.sect>summary::-webkit-details-marker{display:none}
.sect>summary::after{content:"›";font-size:26px;color:var(--muted);transform:rotate(90deg);transition:.15s}
.sect[open]>summary::after{transform:rotate(-90deg)}
.sect[open]>summary{border-bottom:1px solid var(--line)}
.sbody{padding:4px 14px 16px}
.fld{display:block;margin:0 0 10px}
.fld>span{display:block;font-size:14px;font-weight:600;color:var(--muted);margin:0 2px 4px}
#v-settings input:not([type=color]),#v-settings textarea,#v-settings select{width:100%;padding:12px 13px;border:1.5px solid var(--line);border-radius:12px;background:var(--card);font-size:17px;color:var(--ink)}
#v-settings textarea{font:inherit;resize:vertical}
.alist{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.alist>li{border:1px solid var(--line);border-radius:12px;padding:10px 12px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;background:var(--card)}
.alist>li.editing{display:block;background:var(--brand-soft)}
.alist>li.empty{display:block}
.aname{min-width:0;flex:1 1 140px;overflow-wrap:anywhere}
.btnrow{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.btnrow .ghost,.btnrow .primary{padding:10px 13px;font-size:15px}
.ic{width:42px;height:42px;border:1.5px solid var(--line);background:var(--card);border-radius:10px;font-size:19px;font-weight:700;color:var(--brand)}
.ic[disabled]{opacity:.3}
.ghost.danger{color:var(--dont);border-color:var(--dont-bg)}
.primary.wide{width:100%;margin-top:6px;padding:15px}
.gate{max-width:420px;margin:10px auto;display:grid;gap:10px}
.gate input{text-align:center;font-size:22px!important;letter-spacing:.06em}
.gatemsg{color:var(--dont);font-weight:600;text-align:center;min-height:1.4em;margin:0}
.lvrow{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--line);border-radius:12px;padding:10px;margin:0 0 10px}
.lvf{flex:1;min-width:0}
input[type=color]{width:54px;height:54px;border:1.5px solid var(--line);border-radius:12px;padding:3px;background:var(--card);flex:none}
.swatches{display:flex;gap:10px;flex-wrap:wrap;margin:4px 0 6px}
.sw{width:40px;height:40px;border-radius:999px;border:2px solid #fff;box-shadow:0 0 0 1.5px var(--line)}
.sticky-save{position:sticky;bottom:0;background:var(--card);padding:8px 0 2px}
.hist .aname span:first-child{font-size:15px}
.feed li.a-setting{border-left:4px solid var(--brand)}
.feed li.a-setting b{color:var(--brand)}

/* dark look */
body.dark{--ink:#e7ecf2;--muted:#9aa6b5;--bg:#0e1319;--card:#18202a;--line:#2b3644;--none:#7d8896}
body.dark .tabs,body.dark .pick button,body.dark input[type=search],body.dark input:not([type]),body.dark select,body.dark .chips button,body.dark .ghost,body.dark .empty,body.dark .tablewrap,body.dark .feed li,body.dark .ic{background:var(--card);color:var(--ink)}
body.dark .chips button{color:var(--muted)}
body.dark .chips button.on{background:var(--brand2);border-color:var(--brand2);color:#fff}
body.dark .tabs button.on{color:#fff;border-bottom-color:var(--brand2)}
body.dark .feed li.a-visit{background:#141b23}
body.dark .pill.none,body.dark .meter{background:#232d39}
body.dark .zingbtn,body.dark .linkbtn,body.dark .tbadge{color:#fff}
body.dark .feed li b,body.dark #v-settings h4,body.dark .ic,body.dark .zinghead,body.dark .who-t td.name{color:#9cc3ff}
body.dark .lv.on{color:#fff}
body.dark .add[disabled]{background:#2b3644;color:var(--muted)}
body.dark .lv{background:var(--card)}
body.dark .ghost.danger{color:var(--dont)}
.whohead{margin-top:0}
.reload{padding:8px 12px;font-size:15px;flex:none}
.reload[disabled]{opacity:.6}
@media (max-width:420px){.sub{display:block;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.brand>div{min-width:0}h1{font-size:19px}}
.gear{-webkit-tap-highlight-color:transparent;color:#fff}
.zlink{display:inline-block;margin-top:6px;font-size:14px;font-weight:700;color:#7b1fa2;background:#f5e9fb;border-radius:999px;padding:6px 11px;text-decoration:none}
body.dark .zlink{background:#3a2347;color:#e7c6f5}

/* v8: Zing links */
.zing.maybe{background:#fff4e0;color:#9a5b00;border:1px dashed #e0a23a}
body.dark .zing.maybe{background:#3d2e14;color:#f3c77a;border-color:#a37a2c}
.zmaybe{background:#fff8ec;border-radius:10px;padding:8px 10px}
body.dark .zmaybe{background:#33291a}
.zpick{list-style:none;margin:8px 0 0;padding:0}
.zpick li{display:flex;flex-direction:column;gap:6px;padding:10px 0;border-top:1px solid rgba(0,0,0,.08)}
.zpick .btnrow{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.zpick .zlink{margin-top:0}
.es-zing{direction:ltr;text-align:left}

/* v8: Settings login / log out */
.logintitle{margin:4px 0 0;text-align:center;font-size:22px}
.gate.login .fld{display:grid;gap:6px}
.pwwrap{position:relative;display:block}
.pwwrap input{width:100%;box-sizing:border-box;padding-right:52px!important}
.eye{position:absolute;right:6px;top:50%;transform:translateY(-50%);border:0;background:transparent;font-size:22px;padding:6px 8px;cursor:pointer;line-height:1}
.loginbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px}
.lok{font-weight:700;color:#2e7d32}
body.dark .lok{color:#81c784}
.logout{background:#d32f2f;color:#fff;border:0;border-radius:12px;font-weight:700;font-size:16px;padding:10px 16px;cursor:pointer}
.logout.wide{width:100%;margin-top:14px;padding:14px}

/* v8: Zing tab kinds, browse, similar divider */
.zkinds{margin:10px 0 2px}
#zingList .zkind{padding:0}
.zb{display:flex;align-items:center;gap:12px;width:100%;background:transparent;border:0;padding:12px 14px;text-align:start;font:inherit;color:inherit;cursor:pointer}
.zb .art{flex:none;width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;background:var(--line)}
.zb .meta{display:flex;flex-direction:column;min-width:0;flex:1}
.zb .title{font-weight:700;font-size:17px}
.zb .artist{color:var(--muted);font-size:14px}
.zbl{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.zgo{flex:none;font-size:26px;color:var(--muted)}
#zingList .zhead{list-style:none;font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:14px 4px 4px;background:none;border:0;box-shadow:none;padding:0}
#zingList .zdiv{list-style:none;display:flex;align-items:center;gap:10px;margin:16px 0 6px;color:var(--muted);font-weight:700;font-size:14px;background:none;border:0;box-shadow:none;padding:0}
#zingList .zdiv::before,#zingList .zdiv::after{content:"";flex:1;border-top:1.5px dashed var(--line)}
#zingList .zcrumb{list-style:none;background:none;border:0;box-shadow:none;padding:4px 2px 6px}
.ztitle{font-size:20px;font-weight:800;margin-top:6px}

/* v8: Zing link right on the song row */
.zbox{flex:none;align-self:flex-start;display:flex;align-items:center;gap:4px}
.zbox .zing{align-self:auto}
.zing.find{border:1.5px dashed #c9a3dd;background:#fff;color:#7b1fa2;cursor:pointer;font:inherit;font-size:14px;font-weight:700}
body.dark .zing.find{background:transparent;color:#e7c6f5;border-color:#7d5a91}
.zmini{border:0;background:transparent;color:var(--muted);font-size:15px;font-weight:700;width:30px;height:32px;border-radius:999px;padding:0;cursor:pointer}
.zmini.ok{color:#2e7d32;background:#e8f5e9;font-size:16px}
body.dark .zmini.ok{background:#1f3a22;color:#81c784}
.zpanel{margin-top:10px;padding:10px;border:1.5px solid #e3cdef;border-radius:12px;background:#fbf6fd}
body.dark .zpanel{background:#2a2030;border-color:#5a3f6a}
.zprow{display:flex;gap:8px;align-items:center;justify-content:space-between;margin-bottom:8px}
.zprow input{flex:1;min-width:0;font-size:16px;padding:10px;border:1.5px solid var(--line);border-radius:10px;direction:ltr}
.zprow .primary{padding:10px 14px}
.zpanel .zpick li{list-style:none;background:none;border:0;box-shadow:none;margin:0}
.zpanel .zpick .primary{padding:8px 14px}
.linkbtn.danger{color:var(--dont)}
.zpanel .zpick li{display:block;padding:10px 0 4px;border-top:1px solid rgba(0,0,0,.08)}
.zpanel .zpick .aname{display:block}
.zpanel .zpick .btnrow{display:flex;gap:8px;align-items:center;margin-top:6px}


/* ===================== v8 redesign: denser layout (all looks) ===================== */
:root{--toph:62px}
.top{min-height:var(--toph);padding:7px 12px;padding-top:calc(7px + env(safe-area-inset-top))}
.logo-img{width:48px;height:48px;border-radius:50%;flex:none;display:block;box-shadow:0 0 0 1.5px rgba(224,204,128,.55),0 2px 8px rgba(0,0,0,.35)}
.brand .bt{min-width:0}
h1{font-family:"Frank Ruhl Libre","David Libre",Georgia,"Times New Roman",serif;font-size:21px;font-weight:700;letter-spacing:.01em}
.tabs{top:calc(var(--toph) + env(safe-area-inset-top))}
.tabs button{padding:11px 6px}
main{max-width:1240px;padding:10px 10px 30px}
h2{font-family:"Frank Ruhl Libre","David Libre",Georgia,serif;font-size:20px;margin:10px 2px 8px}
.hint{font-size:14px;margin:4px 2px 8px}
.bar{gap:7px;margin-bottom:8px}
input[type=search],input:not([type]),select{padding:10px 12px;font-size:16px;border-radius:10px}
.chips{gap:6px}
.chips button{padding:6px 12px;font-size:14px}
.tchips button{padding:5px 10px;font-size:13px}
.zingbtn.small-zing{padding:7px 10px;font-size:14px}
.progress{font-size:13.5px}
details.moref{border:1px dashed var(--line);border-radius:10px;padding:0 8px}
details.moref>summary{cursor:pointer;list-style:none;padding:7px 2px;font-size:13.5px;font-weight:700;color:var(--muted)}
details.moref>summary::-webkit-details-marker{display:none}
details.moref>summary::before{content:"▸ ";}
details.moref[open]>summary::before{content:"▾ ";}
details.moref.active>summary{color:var(--brand)}
details.moref .chips{margin:0 0 7px}
.songs{gap:8px}
.song{padding:9px 10px;border-radius:12px}
#markList .art,#resList .art{display:none}
.head{gap:8px;align-items:flex-start}
.title{font-size:16.5px;line-height:1.25}
.meta[dir=rtl] .title{font-size:17.5px}
.meta[dir=rtl] .title,.meta[dir=rtl] .artist{font-family:"Frank Ruhl Libre","David Libre",serif}
.artist{font-size:13.5px;display:inline}
.tline{display:inline;margin:0 0 0 6px}
.meta[dir=rtl] .tline{margin:0 6px 0 0}
.tbadge{font-size:11px;padding:1px 8px;vertical-align:1px}
.he{font-size:13.5px}
.zing{font-size:13px;padding:6px 10px}
.levels{grid-template-columns:repeat(4,1fr);gap:5px;margin-top:7px}
.lv{min-height:38px;padding:5px 2px;font-size:13.5px;border-radius:9px;border-width:1.5px}
.lv.on::before{content:""}
.counts{gap:4px;margin-top:6px}
.pill{font-size:12.5px;padding:2px 8px}
.meter{height:7px;margin-top:7px}
details.whod{margin-top:6px}
details.whod>summary{cursor:pointer;font-size:13px;font-weight:700;color:var(--muted);list-style:none}
details.whod>summary::-webkit-details-marker{display:none}
details.whod>summary::before{content:"▸ "}
details.whod[open]>summary::before{content:"▾ "}
.who{margin-top:6px;font-size:14px}
.who b{min-width:8em}
.feed li{padding:9px 12px;font-size:15.5px}
.feed li .t{font-size:12.5px}
.grid th,.grid td{padding:7px 7px}
#v-mark .bar{grid-template-columns:minmax(0,1fr) auto;align-items:center}
#v-mark .bar>*{grid-column:1/-1}
#v-mark .bar>.searchform{grid-column:1/2}
#v-mark .bar>#zingBtn{grid-column:2/3;width:auto;max-width:44vw}
.sort{font-size:14px}
.actions .ghost{padding:8px 12px;font-size:14px}
@media (min-width:760px){
  #markList,#resList,#zingList{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
  #markList .empty,#resList .empty,#zingList .zhead,#zingList .zdiv,#zingList .zcrumb{grid-column:1/-1}
  #v-results .bar{grid-template-columns:minmax(0,1fr) auto;align-items:center}
  #v-results .bar>*{grid-column:1/-1}
  #v-results .bar>.sort{grid-column:1/2;max-width:420px}
  #v-results .bar>.actions{grid-column:2/3}
}
@media (min-width:1150px){#markList,#resList,#zingList{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:760px){.levels{grid-template-columns:repeat(4,1fr)}}

/* ===================== v8: Kehulu brown & gold look ===================== */
body.kh{--ink:#f3e9d2;--muted:#bba98a;--bg:#1e1713;--card:#2a211b;--line:#4a3b2f;--none:#9b8a70;
  --gold:#c9a94f;--gold2:#e0cc80;--ongold:#2a1f17;
  background:radial-gradient(1200px 600px at 50% -200px,#3a2e27 0%,#1e1713 60%) fixed,#1e1713}
body.kh .top{background:linear-gradient(180deg,#3a2e27,#2a211b);border-bottom:1px solid rgba(201,169,79,.45);box-shadow:0 2px 10px rgba(0,0,0,.35)}
body.kh h1{background:linear-gradient(180deg,#f1e2a8,#c9a94f);-webkit-background-clip:text;background-clip:text;color:transparent}
body.kh .sub{color:#cdbb92;opacity:1}
body.kh .tabs{background:#251d17;border-bottom:1px solid #4a3b2f}
body.kh .tabs button{color:#bba98a}
body.kh .tabs button.on{color:var(--gold2);border-bottom-color:var(--gold)}
body.kh .gear,body.kh .me{background:rgba(201,169,79,.12);border-color:rgba(201,169,79,.45);color:#f3e9d2}
body.kh .gear.on{background:rgba(201,169,79,.35);box-shadow:0 0 0 2px var(--gold)}
body.kh h2,body.kh #v-settings h4,body.kh .zinghead{color:var(--gold2)}
body.kh .primary,body.kh .add{background:linear-gradient(180deg,#e0cc80,#c9a94f);color:var(--ongold);text-shadow:none}
body.kh .primary:active{background:#b8963d}
body.kh .add[disabled]{background:#3b2f26;color:var(--muted)}
body.kh .chips button{background:#2a211b;border-color:#4a3b2f;color:#cdbb92}
body.kh .chips button.on{background:linear-gradient(180deg,#e0cc80,#c9a94f);border-color:#c9a94f;color:var(--ongold)}
body.kh input[type=search],body.kh input:not([type]),body.kh select,body.kh #v-settings input:not([type=color]),body.kh #v-settings textarea,body.kh #v-settings select,body.kh .zprow input{background:#241c16;border-color:#5a4838;color:#f3e9d2}
body.kh input::placeholder{color:#8f7f66}
body.kh .song,body.kh .sect,body.kh .alist>li,body.kh .tablewrap,body.kh .feed li,body.kh .empty,body.kh .pick button{background:linear-gradient(180deg,#2e241d,#28201a);border-color:#4a3b2f;box-shadow:0 1px 3px rgba(0,0,0,.3)}
body.kh .pick button:active{border-color:var(--gold)}
body.kh .zingbtn,body.kh .linkbtn{background:rgba(201,169,79,.12);border-color:rgba(201,169,79,.6);color:var(--gold2)}
body.kh .tbadge{background:rgba(201,169,79,.16);color:var(--gold2)}
body.kh .zing{background:rgba(201,169,79,.16);color:var(--gold2)}
body.kh .zing.find{background:transparent;border-color:rgba(201,169,79,.55);color:var(--gold2)}
body.kh .zing.maybe{background:#3d2e14;color:#f3c77a;border-color:#a37a2c}
body.kh .zlink{background:rgba(201,169,79,.16);color:var(--gold2)}
body.kh .zpanel{background:#241c16;border-color:#5a4838}
body.kh .lv{background:#241c16;border-color:#4a3b2f}
body.kh .lv.on{color:#1e1713}
body.kh .lv.on.well{background:var(--well);border-color:var(--well)}
body.kh .feed li b,body.kh .who-t td.name,body.kh .feed li.a-setting b{color:var(--gold2)}
body.kh .feed li.a-visit{background:#231b16}
body.kh .feed li.a-import,body.kh .feed li.a-unseed{background:#26231a}
body.kh .feed li.a-setting{border-left-color:var(--gold)}
body.kh .pill.none,body.kh .meter{background:#3a2e25}
body.kh .who-t tbody tr.on td{background:#3a2e25}
body.kh .ic{background:#241c16;color:var(--gold2);border-color:#4a3b2f}
body.kh .ghost{background:#2a211b;border-color:#5a4838;color:#f3e9d2}
body.kh .toast{background:#e0cc80;color:#2a1f17}
body.kh .foot{color:#9b8a70}
body.kh .logout{background:#a8382c}
body.kh details.moref{border-color:#4a3b2f}
body.kh .zb .art{background:#3a2e25}
body.kh .sw{border-color:#2a211b}
body.kh :focus-visible{outline-color:var(--gold2)}
body.kh .alist>li.editing{background:#33281f}
body.kh .zmaybe{background:#33291a}

/* tab bar ready for more sections: scrolls sideways when they don't fit */
.tabs{display:flex;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;justify-content:space-between}
.tabs::-webkit-scrollbar{display:none}
.tabs button{flex:1 0 auto;padding-left:8px;padding-right:8px}


/* ===================== v9: Events ===================== */
body.noscroll{overflow:hidden}
.evtop{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:2px 0 6px}
.evtop .evh{margin:6px 2px}
.evtop .primary{padding:10px 16px;min-height:40px}
.evsec{font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:10px 2px 6px;font-weight:800}
.evsec span,.evpast summary span,.evsubs span,.wg span{display:inline-block;min-width:1.6em;text-align:center;font-size:12px;border-radius:999px;padding:0 6px;background:var(--line);color:var(--ink);margin-left:4px;font-weight:700;letter-spacing:0}
.ecards{display:grid;gap:8px}
@media (min-width:760px){.ecards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1150px){.ecards{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ecard{display:flex;flex-direction:column;gap:3px;width:100%;text-align:start;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px 12px;color:inherit;font:inherit;min-height:44px}
.ec1{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13.5px;color:var(--muted)}
.ec1 b{color:var(--gold2,var(--brand));font-weight:700}
.etype{display:inline-block;font-size:12px;font-weight:800;border-radius:999px;padding:2px 9px;background:rgba(201,169,79,.18);color:var(--gold2,var(--brand));letter-spacing:.02em}
.ename{font-family:"Frank Ruhl Libre","David Libre",Georgia,serif;font-size:19px;font-weight:700;line-height:1.2;overflow-wrap:anywhere}
.ec3{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;font-size:13.5px;color:var(--muted)}
.ebadge{font-size:12.5px;font-weight:800;border-radius:999px;padding:2px 9px}
.ebadge.ok{background:var(--well-bg);color:var(--well)}
.ebadge.warn{background:#3d2e14;color:#f3c77a}
.ebadge.none{background:var(--line);color:var(--muted)}
body:not(.kh):not(.dark) .ebadge.warn{background:#fff4e0;color:#9a5b00}
.evpast{margin-top:12px;border:1px dashed var(--line);border-radius:12px;padding:0 10px 4px}
.evpast>summary{cursor:pointer;list-style:none;padding:10px 2px;font-weight:800;color:var(--muted);font-size:14px;min-height:40px}
.evpast>summary::-webkit-details-marker{display:none}
.evpast>summary::before{content:"▸ "}
.evpast[open]>summary::before{content:"▾ "}
.evpast .ecard{opacity:.85}
.evempty{padding:16px;text-align:center}
/* event page */
.evnav{margin:2px 0 4px}
.evnav .back{padding:8px 12px;min-height:38px;font-size:14px}
.evhead{margin:0 0 6px}
.evtitle{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.evtitle h2{margin:2px 0;font-size:22px;overflow-wrap:anywhere}
.evmeta{display:flex;flex-wrap:wrap;gap:2px 14px;margin:2px 2px;font-size:14.5px;color:var(--ink)}
.evmeta b{color:var(--gold2,var(--brand))}
.evnotes{margin:4px 2px 0;font-size:14px;color:var(--muted);white-space:pre-wrap}
.rsvp{display:flex;align-items:center;gap:6px;margin:6px 0;flex-wrap:nowrap}
.rsvp .rlabel{font-size:13px;color:var(--muted);font-weight:700;max-width:5.5em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:0 1 auto}
.rsvp button{flex:1 1 0;min-width:0;min-height:40px;border:1.5px solid var(--line);background:var(--card);color:var(--ink);border-radius:10px;font-weight:700;font-size:14px;padding:6px 4px;white-space:nowrap}
.rsvp button.on.r-in{background:var(--well);border-color:var(--well);color:#fff}
.rsvp button.on.r-maybe{background:#b8860b;border-color:#b8860b;color:#fff}
.rsvp button.on.r-no{background:var(--dont);border-color:var(--dont);color:#fff}
.evact{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px;margin:4px 0 8px}
.evact::-webkit-scrollbar{display:none}
.evact button{flex:none;min-height:40px;padding:8px 12px;font-size:14px}
.evsubs{display:flex;border-bottom:1px solid var(--line);margin:0 0 8px}
.evsubs button{flex:1;border:0;background:none;color:var(--muted);font-weight:700;font-size:15px;padding:10px 4px;min-height:42px;border-bottom:3px solid transparent}
.evsubs button.on{color:var(--gold2,var(--brand));border-bottom-color:var(--gold,var(--brand))}
.evpanel{display:none}
.evpanel.show{display:block}
.evwh{display:none}
@media (min-width:900px){
  .evsubs{display:none}
  .evpanels{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start}
  .evpanel{display:block}
  .evwh{display:block;margin:4px 2px 6px;font-size:16px;color:var(--gold2,var(--brand))}
  .evwho{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:8px 12px;position:sticky;top:calc(var(--toph) + 56px)}
}
.sumrow{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 10px;margin:0 0 8px}
.evsum{margin:0 2px;font-size:14.5px}
.okc{color:var(--well);font-weight:700}
.warnc{color:#f0a640;font-weight:700}
body:not(.kh):not(.dark) .warnc{color:#9a5b00}
.chips.cnt button{min-height:36px}
.setlist{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.esong{background:var(--card);border:1px solid var(--line);border-radius:11px;padding:6px 8px 6px 4px;position:relative}
.esong.practice{border-left:3px solid #e0a23a}
.er1{display:flex;align-items:center;gap:2px;min-height:36px}
.grip{flex:none;width:30px;height:36px;display:grid;place-items:center;font-size:20px;color:var(--muted);cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none}
.enum{flex:none;min-width:1.6em;font-weight:800;color:var(--gold2,var(--brand));font-size:14px;text-align:center}
.etap{flex:1;min-width:0;text-align:start;background:none;border:0;color:inherit;font:inherit;padding:6px 4px;min-height:36px;cursor:pointer;line-height:1.25}
.et{font-weight:700;font-size:16px}
.ea{color:var(--muted);font-size:13.5px}
.esong .zing{flex:none;align-self:center;padding:7px 10px;font-size:13px;min-height:32px}
.er2{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-left:32px;margin-top:2px}
.kc{font-size:13px;white-space:nowrap}
.kc small{color:var(--muted)}
.kc.muted{color:var(--muted)}
.kbar{display:inline-flex;width:64px;height:7px;border-radius:999px;overflow:hidden;background:var(--line);flex:none}
.kbar i{display:block;height:100%}
.kbar .kw{background:var(--well)} .kbar .km{background:var(--little)} .kbar .kn{background:var(--dont)}
.needp{font-size:12px;font-weight:800;color:#f3c77a;background:#3d2e14;border-radius:999px;padding:2px 8px;white-space:nowrap}
body:not(.kh):not(.dark) .needp{background:#fff4e0;color:#9a5b00}
.emv{margin-left:auto;display:flex;gap:4px}
.ic.sm{width:36px;height:36px;font-size:16px;border-radius:9px}
.ic.sm.x{color:var(--dont)}
.edet{list-style:none;margin:6px 0 2px 32px;padding:6px 0 0;border-top:1px dashed var(--line);display:grid;gap:4px}
.edet li{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:14px}
.edet .lvx{margin-left:auto}
.lvl.none{color:var(--muted);font-size:13px}
.esong.dragging{z-index:3;box-shadow:0 8px 24px rgba(0,0,0,.45);border-color:var(--gold,var(--brand));opacity:.97}
.setlist.dragmode .esong:not(.dragging){transition:none}
.wg{margin:10px 2px 4px;font-size:14px;color:var(--muted)}
.wg-in{color:var(--well)} .wg-maybe{color:#d9a53a} .wg-no{color:var(--dont)}
.wlist{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.wlist li{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:6px 10px;background:var(--card);border:1px solid var(--line);border-radius:10px;font-size:15px}
.evwho .wlist li{background:transparent}
.you{color:var(--muted)}
/* sheets */
.evsheet{position:fixed;inset:0;z-index:20;background:rgba(10,7,5,.6);display:flex;align-items:flex-end;justify-content:center}
.evsheet .sbox{background:var(--bg);border:1px solid var(--line);border-bottom:0;border-radius:16px 16px 0 0;width:100%;max-width:640px;max-height:92vh;overflow:auto;padding:10px 12px calc(12px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:8px}
@media (min-width:700px){.evsheet{align-items:center}.evsheet .sbox{border-radius:16px;border-bottom:1px solid var(--line)}}
.evsheet.picker .sbox{height:92vh}
.shead{display:flex;align-items:center;justify-content:space-between;gap:10px}
.shead h3{margin:0;font-size:18px;color:var(--gold2,var(--brand));min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.shead h3 small{color:var(--muted);font-weight:600;font-size:14px;margin-left:6px}
.sform{display:grid;gap:8px}
.flabel{font-size:13px;font-weight:700;color:var(--muted)}
.etchips{margin:0!important;gap:6px}
.etchips button{min-height:36px}
.fld{display:grid;gap:4px}
.fld>span{font-size:13px;font-weight:700;color:var(--muted)}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.evsheet input,.evsheet textarea{width:100%;padding:10px 12px;border:1.5px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);font:inherit;font-size:16px;min-height:42px}
body.kh .evsheet input,body.kh .evsheet textarea{background:#241c16;border-color:#5a4838;color:#f3e9d2}
body.kh .evsheet input[type=date],body.kh .evsheet input[type=time]{color-scheme:dark}
.btnrow.end{justify-content:flex-end}
.btnrow.end button{min-height:42px}
.pkhint{margin:0 2px}
.pklist{list-style:none;margin:0;padding:0;flex:1;overflow:auto;display:grid;gap:4px;align-content:start}
.pkb{display:flex;align-items:center;gap:10px;width:100%;text-align:start;background:var(--card);border:1.5px solid var(--line);border-radius:10px;padding:7px 10px;min-height:44px;color:inherit;font:inherit}
.pkb .pkc{flex:none;width:24px;height:24px;border-radius:7px;border:2px solid var(--muted);display:grid;place-items:center;font-size:13px;font-weight:800}
.pkb.sel{border-color:var(--gold,var(--brand))}
.pkb.sel .pkc{background:var(--gold,var(--brand));border-color:var(--gold,var(--brand));color:var(--ongold,#fff)}
.pkb.has{opacity:.55}
.pkb.has .pkc{border-color:var(--well);color:var(--well)}
.pkt{flex:1;min-width:0;line-height:1.25;font-size:15.5px;overflow-wrap:anywhere}
.pkt small{color:var(--muted);font-size:13px}
.pkk{flex:none;font-size:12.5px;color:var(--muted)}
.sfoot{position:sticky;bottom:0;padding-top:4px;background:var(--bg)}
.sfoot .primary[disabled]{opacity:.5}
.cplist{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.cpb{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;text-align:start;background:var(--card);border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;min-height:48px;color:inherit;font:inherit}
.cpb small{display:block;color:var(--muted);font-size:13px}
.cpn{flex:none;color:var(--muted);font-size:14px}
#shareTa{font-size:14px;min-height:240px}
body.kh .ecard,body.kh .esong,body.kh .pkb,body.kh .cpb{background:linear-gradient(180deg,#2e241d,#28201a);border-color:#4a3b2f}
body.kh .ecard:active,body.kh .pkb:active,body.kh .cpb:active{border-color:var(--gold)}
body.kh .evsheet .sbox{background:#1e1713;border-color:#4a3b2f}
body.kh .sfoot{background:#1e1713}
body.kh .rsvp button:not(.on){background:#241c16;border-color:#4a3b2f;color:#f3e9d2}
body.kh .feed li.a-event{border-left:4px solid var(--gold)}
.feed li.a-event{border-left:4px solid var(--brand)}
@media print{
  .evsheet{display:none!important}
  .printonly .psl td,.printonly .psl th{text-align:center}
}

/* v9 tune: one compact counts line per song */
.er2{padding-left:6px;gap:7px;flex-wrap:nowrap}
.kbar{width:46px}
.edetact{display:flex;justify-content:flex-end;margin:6px 0 2px}
.edetact .ghost{min-height:38px;padding:7px 12px;font-size:14px}
.etap[dir=rtl]{text-align:right}

.evnav{display:flex;align-items:center;justify-content:space-between;gap:6px}
.evtools{display:flex;gap:6px}
.evtools .ghost{min-height:38px;padding:7px 10px;font-size:14px}
.evtools .danger{min-width:40px}
.setlist,.grip,.enum{-webkit-user-select:none;user-select:none}
.setlist.dragmode{touch-action:none}
@media (max-width:520px){.rsvp .rlabel{display:none}.rsvp button{font-size:13.5px}}
.etap .ea{font-weight:400}

.edet .lvl{font-weight:700;font-size:13.5px}
.edet .lvl.well{color:var(--well)} .edet .lvl.little{color:var(--little)} .edet .lvl.heard{color:var(--heard)} .edet .lvl.dont{color:var(--dont)}

/* ===== v10: notifications ===== */
.bell{position:relative;width:44px;height:44px;border-radius:999px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.15);font-size:20px;line-height:1;display:grid;place-items:center;padding:0;color:#fff;-webkit-tap-highlight-color:transparent;flex:none}
.bell .bico{display:block;transform-origin:50% 10%}
.bell.on{background:rgba(255,255,255,.4);box-shadow:0 0 0 2px #fff}
.bell .badge{position:absolute;top:-3px;right:-4px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:#d23b2f;color:#fff;font:800 12px/20px system-ui,-apple-system,sans-serif;text-align:center;box-shadow:0 0 0 2px #2a211b}
.bell:has(.badge:not([hidden])) .bico{animation:ring 2.4s ease-in-out 1}
@keyframes ring{0%,60%,100%{transform:rotate(0)}10%{transform:rotate(14deg)}20%{transform:rotate(-12deg)}30%{transform:rotate(8deg)}40%{transform:rotate(-5deg)}}
body.kh .bell{background:rgba(201,169,79,.12);border-color:rgba(201,169,79,.45);color:#f3e9d2}
body.kh .bell.on{background:rgba(201,169,79,.35);box-shadow:0 0 0 2px var(--gold)}
.npanel{position:fixed;z-index:30;top:calc(var(--toph,62px) + env(safe-area-inset-top) + 6px);right:8px;width:min(380px,calc(100vw - 16px));max-height:calc(100vh - var(--toph,62px) - 24px);max-height:calc(100dvh - var(--toph,62px) - env(safe-area-inset-top) - 24px);display:flex;flex-direction:column;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 32px rgba(0,0,0,.45);overflow:hidden}
.npanel[hidden]{display:none}
body.kh .npanel{border-color:rgba(201,169,79,.55);background:#2a211b}
.npanel::before{content:"";position:absolute;top:-7px;right:66px;width:12px;height:12px;background:inherit;border-left:1px solid inherit;transform:rotate(45deg)}
.nhead{display:flex;align-items:center;gap:6px;padding:8px 8px 8px 12px;border-bottom:1px solid var(--line);font-size:15px}
body.kh .nhead b{color:var(--gold2)}
.nhead .sp{flex:1}
.nlink{min-height:36px;padding:4px 10px;border:0;background:none;color:var(--brand2);font-weight:700;font-size:13.5px;border-radius:8px}
body.kh .nlink{color:var(--gold2)}
.nx{width:36px;height:36px;border:0;border-radius:999px;background:transparent;color:var(--muted);font-size:17px}
.nlist{overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;flex:1 1 auto}
.nempty{padding:18px 14px;color:var(--muted);font-size:14px;text-align:center;margin:0}
.nitem{position:relative;padding:9px 12px 9px 14px;border-bottom:1px solid var(--line);font-size:14px;line-height:1.35}
.nitem:last-child{border-bottom:0}
.nitem.unread::after{content:"";position:absolute;left:5px;top:15px;width:6px;height:6px;border-radius:50%;background:#d23b2f}
.nitem.needs{background:linear-gradient(90deg,rgba(201,169,79,.2),rgba(201,169,79,.06));box-shadow:inset 3px 0 0 var(--gold,#c9a94f)}
.nitem.gone .ntext{opacity:.8}
.npill{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.02em;text-transform:uppercase;background:var(--gold,#c9a94f);color:var(--ongold,#2a1f17);border-radius:999px;padding:2px 8px;margin-bottom:4px}
.ntext b{font-weight:800}
body.kh .ntext b{color:var(--gold2)}
.nsub{color:var(--muted);font-size:12.5px;margin-top:2px}
.nacts{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px;align-items:center}
.nrs{display:flex;gap:5px;flex:1 1 100%}
.nrs button{flex:1 1 0;min-width:0;min-height:38px;border:1.5px solid var(--line);background:var(--card);color:var(--ink);border-radius:10px;font-weight:700;font-size:13px;padding:5px 3px;white-space:nowrap}
body.kh .nrs button:not(.on){background:#241c16;border-color:#4a3b2f;color:#f3e9d2}
.nrs button.on.r-in{background:var(--well);border-color:var(--well);color:#fff}
.nrs button.on.r-maybe{background:#b8860b;border-color:#b8860b;color:#fff}
.nrs button.on.r-no{background:var(--dont);border-color:var(--dont);color:#fff}
.nopen{min-height:36px;padding:4px 10px;border:1px solid var(--line);background:transparent;color:var(--ink);border-radius:10px;font-weight:700;font-size:13px}
body.kh .nopen{border-color:rgba(201,169,79,.5);color:var(--gold2)}
.npush{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;padding:9px 12px;border-top:1px solid var(--line);font-size:13px;background:rgba(0,0,0,.12)}
.pbtn{min-height:38px;padding:6px 12px;border-radius:10px;border:1.5px solid var(--gold,#c9a94f);background:transparent;color:var(--gold2,var(--ink));font-weight:800;font-size:13.5px}
.pon{font-weight:700;color:var(--well)}
.phint{color:var(--muted);font-size:12.5px;line-height:1.4;flex:1 1 100%}
.phint b{color:var(--ink)}
/* gold "are you coming?" banner */
.askbar{position:sticky;top:calc(var(--toph,62px) + env(safe-area-inset-top));z-index:4;display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:6px 8px 0;padding:8px 40px 8px 10px;border-radius:12px;background:linear-gradient(180deg,#e0cc80,#c9a94f);color:#2a1f17;box-shadow:0 4px 14px rgba(0,0,0,.35)}
.askbar[hidden]{display:none}
.askt{flex:1 1 100%;display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 6px;font-size:14px;line-height:1.3}
.askq{font-weight:800}
.askev{border:0;background:none;padding:0;color:#2a1f17;font-size:13.5px;text-align:start;text-decoration:underline;text-underline-offset:2px;min-height:24px}
.askbar .nrs button{background:rgba(255,255,255,.55);border-color:rgba(42,31,23,.35);color:#2a1f17;min-height:38px}
.askbar .nrs button:active{background:#2a1f17;color:#e0cc80}
.askx{position:absolute;top:4px;right:4px;width:36px;height:36px;border:0;border-radius:999px;background:transparent;color:#2a1f17;font-size:16px}
.askbar{position:relative;top:auto}
@media (max-width:420px){.top{gap:6px;padding-left:9px;padding-right:9px}.brand{gap:7px}.logo-img{width:40px;height:40px}h1{font-size:17px}.top .sub{font-size:11px}.bell,.topr .gear{width:38px;height:38px}.topr{gap:5px}.me{max-width:31vw;padding:6px 9px;font-size:13.5px}.bell{font-size:18px}.topr .gear{font-size:19px}}

/* ===================================================================================
   v11 — mature, modern look. One line-icon set (inline SVG), no emoji, quiet palette.
   Prefixed with body:not(#_v11) so these rules sit above the older layers.
   =================================================================================== */
:root{--well:#2e7550;--little:#47658a;--heard:#9a6c22;--dont:#9c463f;--well-bg:#e6efe9;--little-bg:#e8edf3;--heard-bg:#f3ece0;--dont-bg:#f3e6e4;
  --r:12px;--r-sm:10px;--s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;
  --ff:"Inter",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --ff-serif:"Cormorant Garamond","Frank Ruhl Libre",Georgia,"Times New Roman",serif;
  --ff-he:"Frank Ruhl Libre","David Libre",Georgia,serif}
/* light (default when no Kehulu/dark look) */
body:not(#_v11){--bg:#f6f4f0;--card:#ffffff;--card2:#fbfaf8;--line:#e8e2d8;--line2:#d8d0c3;--ink:#1d1914;--muted:#6c6357;--none:#9a9083;
  --gold:var(--brand,#9c7a2e);--gold2:color-mix(in srgb,var(--brand,#9c7a2e) 72%,#000);--ongold:#fff;--hl:color-mix(in srgb,var(--brand,#9c7a2e) 10%,transparent);
  --shadow:0 1px 2px rgba(30,20,10,.06),0 1px 1px rgba(30,20,10,.04);--shadow-lg:0 12px 32px rgba(30,20,10,.16);
  --topbg:rgba(255,255,255,.92);--toast-bg:#1d1914;--toast-ink:#f6f4f0}
body.dark:not(#_v11){--bg:#0f1215;--card:#171b20;--card2:#1c2127;--line:#262c34;--line2:#343c47;--ink:#e6e9ed;--muted:#98a2ae;--none:#7e8894;
  --gold:var(--brand,#c6a75e);--gold2:color-mix(in srgb,var(--brand,#c6a75e) 70%,#fff);--ongold:#111;--hl:color-mix(in srgb,var(--brand,#c6a75e) 14%,transparent);
  --shadow:0 1px 2px rgba(0,0,0,.35);--shadow-lg:0 16px 40px rgba(0,0,0,.55);--topbg:rgba(15,18,21,.9);--toast-bg:#e6e9ed;--toast-ink:#0f1215}
body.kh:not(#_v11){--bg:#14100d;--card:#1c1612;--card2:#221b16;--line:#30261f;--line2:#433529;--ink:#ece3d2;--muted:#a69680;--none:#7f705d;
  --gold:#c6a75e;--gold2:#dcc48f;--ongold:#191310;--hl:rgba(198,167,94,.12);
  --shadow:0 1px 2px rgba(0,0,0,.4);--shadow-lg:0 18px 44px rgba(0,0,0,.6);--topbg:rgba(20,16,13,.92);--toast-bg:#ece3d2;--toast-ink:#191310;
  background:#14100d}
body:not(#_v11){font-family:var(--ff);font-size:15px;line-height:1.45;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-feature-settings:"cv11","ss01"}
body:not(#_v11) button,body:not(#_v11) input,body:not(#_v11) select,body:not(#_v11) textarea{font-family:var(--ff)}
body:not(#_v11) :focus-visible{outline:2px solid var(--gold);outline-offset:2px}
body:not(#_v11) ::selection{background:var(--hl)}
/* icons */
body:not(#_v11) .i{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;vertical-align:-4px;display:inline-block}
body:not(#_v11) .i.fill{fill:currentColor;stroke-width:1.25}
body:not(#_v11) .i.spin{animation:v11spin 1s linear infinite}
@keyframes v11spin{to{transform:rotate(360deg)}}
body:not(#_v11) button:has(>.i),body:not(#_v11) a:has(>.i){display:inline-flex;align-items:center;justify-content:center;gap:6px}
/* header */
body:not(#_v11) .top{background:var(--topbg);-webkit-backdrop-filter:saturate(140%) blur(12px);backdrop-filter:saturate(140%) blur(12px);border-bottom:1px solid var(--line);box-shadow:none;color:var(--ink);padding:8px 16px;padding-top:calc(8px + env(safe-area-inset-top));min-height:var(--toph)}
body:not(#_v11) .logo-img{width:42px;height:42px;box-shadow:0 0 0 1px rgba(198,167,94,.4)}
body:not(#_v11) h1{font-family:var(--ff-serif);font-weight:600;font-size:23px;letter-spacing:.01em;line-height:1.05;color:var(--ink);background:none;-webkit-text-fill-color:currentColor}
body.kh:not(#_v11) h1{color:var(--gold2);background:none;-webkit-background-clip:border-box;background-clip:border-box}
body:not(#_v11) .sub{font-size:10.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);opacity:1;margin-top:3px}
body:not(#_v11) .topr{gap:var(--s2)}
body:not(#_v11) .bell,body:not(#_v11) .gear{width:40px;height:40px;border-radius:var(--r-sm);border:1px solid var(--line2);background:transparent;color:var(--ink);box-shadow:none;transition:border-color .15s,color .15s,background .15s}
body:not(#_v11) .bell .i,body:not(#_v11) .gear .i{width:19px;height:19px;vertical-align:0}
body:not(#_v11) .bell:hover,body:not(#_v11) .gear:hover{border-color:var(--gold);color:var(--gold2)}
body:not(#_v11) .bell.on,body:not(#_v11) .gear.on{border-color:var(--gold);color:var(--gold2);background:var(--hl);box-shadow:none}
body:not(#_v11) .bell .bico{display:grid;place-items:center;animation:none!important}
body:not(#_v11) .bell .badge{top:-5px;right:-5px;min-width:17px;height:17px;padding:0 4px;font:600 10.5px/17px var(--ff);background:#b5483d;color:#fff;box-shadow:0 0 0 2px var(--bg)}
body:not(#_v11) .me{border-radius:var(--r-sm);border:1px solid var(--line2);background:transparent;color:var(--ink);padding:5px 10px;min-height:40px;justify-content:center;font-size:13px}
body:not(#_v11) .me b{font-weight:600}
body:not(#_v11) .me small{font-size:10.5px;color:var(--muted);letter-spacing:.02em}
/* tabs */
body:not(#_v11) .tabs{background:var(--bg);border-bottom:1px solid var(--line);gap:var(--s1);padding:0 8px}
body:not(#_v11) .tabs button{font-size:14px;font-weight:500;color:var(--muted);padding:12px 10px 11px;border-bottom:2px solid transparent;letter-spacing:.005em;transition:color .15s,border-color .15s}
body:not(#_v11) .tabs button:hover{color:var(--ink)}
body:not(#_v11) .tabs button.on{color:var(--ink);border-bottom-color:var(--gold);font-weight:600}
/* type */
body:not(#_v11) h2{font-family:var(--ff-serif);font-weight:600;font-size:23px;letter-spacing:.005em;color:var(--ink);margin:12px 2px 8px}
body.kh:not(#_v11) h2{color:var(--ink)}
body:not(#_v11) h2.big{font-size:30px}
body:not(#_v11) h3,body:not(#_v11) h4{font-weight:600}
body:not(#_v11) #v-settings h4{color:var(--muted);font-size:11.5px;text-transform:uppercase;letter-spacing:.1em;font-weight:600;margin:16px 2px 8px}
body:not(#_v11) .hint{color:var(--muted);font-size:13.5px}
body:not(#_v11) .progress{color:var(--muted);font-size:13px}
body:not(#_v11) .meta[dir=rtl] .title,body:not(#_v11) .meta[dir=rtl] .artist,body:not(#_v11) .he,body:not(#_v11) [lang=he]{font-family:var(--ff-he)}
/* inputs */
body:not(#_v11) input[type=search],body:not(#_v11) input:not([type]),body:not(#_v11) input[type=url],body:not(#_v11) input[type=text],body:not(#_v11) input[type=password],body:not(#_v11) select,body:not(#_v11) textarea,body:not(#_v11) #v-settings input:not([type=color]),body:not(#_v11) #v-settings textarea,body:not(#_v11) #v-settings select,body:not(#_v11) .evsheet input,body:not(#_v11) .evsheet textarea,body:not(#_v11) .zprow input{background:var(--card);border:1px solid var(--line2);border-radius:var(--r-sm);color:var(--ink);font-size:16px;padding:10px 12px;min-height:42px;box-shadow:none;transition:border-color .15s,box-shadow .15s}
body:not(#_v11) input:focus,body:not(#_v11) select:focus,body:not(#_v11) textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px var(--hl)}
body:not(#_v11) input::placeholder,body:not(#_v11) textarea::placeholder{color:var(--none)}
body.kh:not(#_v11) input[type=date],body.kh:not(#_v11) input[type=time],body.dark:not(#_v11) select{color-scheme:dark}
/* buttons */
body:not(#_v11) .primary,body:not(#_v11) .add{background:var(--gold);color:var(--ongold);border:1px solid var(--gold);border-radius:var(--r-sm);font-weight:600;font-size:14.5px;padding:10px 16px;min-height:40px;text-shadow:none;box-shadow:none;transition:filter .15s,background .15s}
body:not(#_v11) .primary:hover,body:not(#_v11) .add:hover{filter:brightness(1.07)}
body:not(#_v11) .primary:active,body:not(#_v11) .add:active{filter:brightness(.94);background:var(--gold)}
body:not(#_v11) .add[disabled]{background:transparent;border-color:var(--line2);color:var(--muted);filter:none}
body:not(#_v11) .ghost,body:not(#_v11) .reload{background:transparent;border:1px solid var(--line2);color:var(--ink);border-radius:var(--r-sm);font-weight:500;font-size:14px;padding:8px 13px;min-height:38px;transition:border-color .15s,background .15s}
body:not(#_v11) .ghost:hover{border-color:var(--gold);background:var(--hl)}
body:not(#_v11) .ghost.danger,body:not(#_v11) .linkbtn.danger{color:var(--dont);border-color:color-mix(in srgb,var(--dont) 40%,transparent)}
body:not(#_v11) .ghost.icb{width:38px;padding:0}
body:not(#_v11) .linkbtn,body:not(#_v11) .empty .linkbtn{background:transparent;border:1px solid var(--line2);color:var(--gold2);border-radius:var(--r-sm);font-weight:500;font-size:14px;padding:8px 13px;min-height:38px}
body:not(#_v11) .zingbtn,body:not(#_v11) .zingbtn.small-zing{background:transparent;border:1px solid var(--line2);color:var(--gold2);border-radius:var(--r-sm);font-weight:500;font-size:13.5px;padding:8px 12px;min-height:42px}
body:not(#_v11) .ic,body:not(#_v11) .ic.sm{background:transparent;border:1px solid var(--line2);color:var(--ink);border-radius:var(--r-sm);display:inline-grid;place-items:center;padding:0}
body:not(#_v11) .ic.sm{width:36px;height:36px}
body:not(#_v11) .ic .i{vertical-align:0}
body:not(#_v11) .ic[disabled]{opacity:.28}
body:not(#_v11) .logout{background:transparent;border:1px solid color-mix(in srgb,var(--dont) 55%,transparent);color:var(--dont);font-weight:600;font-size:14px;border-radius:var(--r-sm);padding:8px 14px;min-height:38px}
body.kh:not(#_v11) .logout{background:transparent}
body:not(#_v11) .logout:hover{background:var(--dont-bg)}
/* chips */
body:not(#_v11) .chips{gap:6px}
body:not(#_v11) .chips button,body:not(#_v11) .chip{background:transparent;border:1px solid var(--line2);color:var(--muted);border-radius:999px;font-weight:500;font-size:13px;padding:6px 13px;min-height:36px;transition:color .15s,border-color .15s,background .15s}
body:not(#_v11) .chips button:hover{color:var(--ink)}
body:not(#_v11) .chips button.on,body:not(#_v11) .chip.on{background:var(--hl);border-color:color-mix(in srgb,var(--gold) 65%,transparent);color:var(--gold2);box-shadow:none}
body:not(#_v11) .tchips button{font-size:12.5px;padding:5px 11px;min-height:34px}
body:not(#_v11) .clabel{font-size:10.5px;letter-spacing:.1em;font-weight:600}
body:not(#_v11) details.moref{border:1px solid var(--line);border-radius:var(--r-sm)}
body:not(#_v11) details.moref>summary,body:not(#_v11) details.whod>summary,body:not(#_v11) .evpast>summary{display:flex;align-items:center;gap:6px}
body:not(#_v11) details.moref>summary::before,body:not(#_v11) details.whod>summary::before,body:not(#_v11) .evpast>summary::before,body:not(#_v11) details.moref[open]>summary::before,body:not(#_v11) details.whod[open]>summary::before,body:not(#_v11) .evpast[open]>summary::before{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(-45deg);transition:transform .15s;flex:none;margin:0 3px}
body:not(#_v11) details.moref[open]>summary::before,body:not(#_v11) details.whod[open]>summary::before,body:not(#_v11) .evpast[open]>summary::before{transform:rotate(45deg)}
body:not(#_v11) details.moref>summary{font-weight:500;font-size:13px}
/* song cards */
body:not(#_v11) .song,body:not(#_v11) .alist>li,body:not(#_v11) .tablewrap,body:not(#_v11) .feed li,body:not(#_v11) .pick button,body:not(#_v11) .ecard,body:not(#_v11) .esong,body:not(#_v11) .pkb,body:not(#_v11) .cpb,body:not(#_v11) .sect,body:not(#_v11) .wlist li{background:var(--card);border:1px solid var(--line);box-shadow:var(--shadow)}
body:not(#_v11) .song{border-radius:var(--r);padding:10px 12px}
body:not(#_v11) .songs{gap:8px}
body:not(#_v11) .title{font-weight:600;font-size:15.5px;letter-spacing:-.003em}
body:not(#_v11) .meta[dir=rtl] .title{font-size:17.5px;font-weight:600}
body:not(#_v11) .artist{color:var(--muted);font-size:13px}
body:not(#_v11) .tbadge{background:transparent;border:1px solid var(--line2);color:var(--muted);font-size:10.5px;font-weight:500;letter-spacing:.04em;padding:0 7px;border-radius:999px}
body:not(#_v11) .art,body:not(#_v11) .zb .art{background:var(--card2);border:1px solid var(--line);color:var(--gold2);border-radius:var(--r-sm);display:grid;place-items:center}
body:not(#_v11) .art .i{width:20px;height:20px;vertical-align:0}
/* zing link chips */
body:not(#_v11) .zing,body:not(#_v11) .zlink{display:inline-flex;align-items:center;gap:5px;background:transparent;border:1px solid color-mix(in srgb,var(--gold) 45%,transparent);color:var(--gold2);border-radius:999px;font-weight:600;font-size:12.5px;padding:5px 11px;min-height:32px;text-decoration:none}
body:not(#_v11) .zing .i,body:not(#_v11) .zlink .i{width:12px;height:12px;vertical-align:0}
body:not(#_v11) .zing.find{border:1px dashed var(--line2);color:var(--muted);background:transparent;font-weight:500}
body:not(#_v11) .zing.find .i{width:14px;height:14px}
body:not(#_v11) .zing.maybe{border:1px dashed color-mix(in srgb,var(--heard) 70%,transparent);color:var(--heard);background:transparent}
body:not(#_v11) .zmini{width:32px;height:32px;border-radius:var(--r-sm);color:var(--muted);background:transparent;display:inline-grid;place-items:center}
body:not(#_v11) .zmini .i{width:15px;height:15px;vertical-align:0}
body:not(#_v11) .zmini:hover{color:var(--ink);background:var(--hl)}
body:not(#_v11) .zmini.ok{color:var(--well);background:var(--well-bg)}
body:not(#_v11) .zpanel{background:var(--card2);border:1px solid var(--line2);border-radius:var(--r)}
body:not(#_v11) .zpick li,body:not(#_v11) .zpanel .zpick li{border-top:1px solid var(--line)}
body:not(#_v11) .zmaybe{background:var(--heard-bg);border-radius:var(--r-sm)}
/* mark levels: dot + text */
body:not(#_v11) .levels{gap:6px}
body:not(#_v11) .lv{position:relative;display:flex;align-items:center;justify-content:center;gap:6px;background:transparent;border:1px solid var(--line2);color:var(--muted);border-radius:var(--r-sm);font-weight:500;font-size:13px;min-height:38px;padding:5px 4px;transition:background .15s,border-color .15s,color .15s}
body:not(#_v11) .lv::before,body:not(#_v11) .lv.on::before{content:"";width:7px;height:7px;border-radius:50%;flex:none;background:transparent;box-shadow:inset 0 0 0 1.5px currentColor}
body:not(#_v11) .lv.well::before{color:var(--well)} body:not(#_v11) .lv.little::before{color:var(--little)} body:not(#_v11) .lv.heard::before{color:var(--heard)} body:not(#_v11) .lv.dont::before{color:var(--dont)}
body:not(#_v11) .lv.well,body:not(#_v11) .lv.little,body:not(#_v11) .lv.heard,body:not(#_v11) .lv.dont{color:var(--muted)}
body:not(#_v11) .lv:hover{color:var(--ink);border-color:var(--gold)}
body:not(#_v11) .lv.on.well{background:var(--well-bg);border-color:var(--well);color:var(--ink)} body:not(#_v11) .lv.on.well::before{background:var(--well);box-shadow:none}
body:not(#_v11) .lv.on.little{background:var(--little-bg);border-color:var(--little);color:var(--ink)} body:not(#_v11) .lv.on.little::before{background:var(--little);box-shadow:none}
body:not(#_v11) .lv.on.heard{background:var(--heard-bg);border-color:var(--heard);color:var(--ink)} body:not(#_v11) .lv.on.heard::before{background:var(--heard);box-shadow:none}
body:not(#_v11) .lv.on.dont{background:var(--dont-bg);border-color:var(--dont);color:var(--ink)} body:not(#_v11) .lv.on.dont::before{background:var(--dont);box-shadow:none}
body:not(#_v11) .lv.on{font-weight:600}
/* pills / meters / level words */
body:not(#_v11) .pill{display:inline-flex;align-items:center;gap:5px;border-radius:999px;font-size:12px;font-weight:500;padding:2px 9px 2px 8px;background:transparent;border:1px solid var(--line);color:var(--ink)}
body:not(#_v11) .pill::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--none);flex:none}
body:not(#_v11) .pill.well::before{background:var(--well)} body:not(#_v11) .pill.little::before{background:var(--little)} body:not(#_v11) .pill.heard::before{background:var(--heard)} body:not(#_v11) .pill.dont::before{background:var(--dont)}
body:not(#_v11) .pill.well,body:not(#_v11) .pill.little,body:not(#_v11) .pill.heard,body:not(#_v11) .pill.dont,body:not(#_v11) .pill.none{background:transparent;color:var(--ink)}
body:not(#_v11) .pill.none{color:var(--muted)}
body:not(#_v11) .meter,body:not(#_v11) .kbar{height:4px;border-radius:999px;background:var(--line)}
body:not(#_v11) .meter .well,body:not(#_v11) .kbar .kw{background:var(--well)} body:not(#_v11) .meter .little,body:not(#_v11) .kbar .km{background:var(--little)} body:not(#_v11) .meter .heard{background:var(--heard)} body:not(#_v11) .meter .dont,body:not(#_v11) .kbar .kn{background:var(--dont)}
body:not(#_v11) .lvl{font-weight:600}
body:not(#_v11) .lvl.well{color:var(--well)} body:not(#_v11) .lvl.little{color:var(--little)} body:not(#_v11) .lvl.heard{color:var(--heard)} body:not(#_v11) .lvl.dont{color:var(--dont)}
body:not(#_v11) .kc{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-variant-numeric:tabular-nums;color:var(--ink)}
body:not(#_v11) .kd{display:inline-flex;align-items:center;gap:4px;font-weight:600}
body:not(#_v11) .kd i{width:7px;height:7px;border-radius:50%;display:inline-block}
body:not(#_v11) .kd.w i{background:var(--well)} body:not(#_v11) .kd.m i{background:var(--little)} body:not(#_v11) .kd.n i{background:var(--dont)}
body:not(#_v11) .kc small{color:var(--muted);font-weight:400}
/* tables */
body:not(#_v11) .tablewrap{border-radius:var(--r);overflow:auto}
body:not(#_v11) .grid{border-collapse:collapse}
body:not(#_v11) .grid th{font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);background:var(--card2);border-bottom:1px solid var(--line)}
body:not(#_v11) .grid td{font-size:13.5px;border-bottom:1px solid var(--line)}
body:not(#_v11) .grid tr:last-child td{border-bottom:0}
body:not(#_v11) .grid td.well{color:var(--well)} body:not(#_v11) .grid td.little{color:var(--little)} body:not(#_v11) .grid td.heard{color:var(--heard)} body:not(#_v11) .grid td.dont{color:var(--dont)}
body:not(#_v11) .who-t td,body:not(#_v11) .who-t th{font-size:13.5px}
body:not(#_v11) .who-t td.name,body.kh:not(#_v11) .who-t td.name{color:var(--ink);font-weight:600;text-decoration:none}
body:not(#_v11) .who-t tbody tr.on td,body.kh:not(#_v11) .who-t tbody tr.on td{background:var(--hl)}
body:not(#_v11) .part{color:var(--muted);font-size:12px}
/* activity feed */
body:not(#_v11) .feed{gap:6px}
body:not(#_v11) .feed li{border-radius:var(--r-sm);padding:9px 12px;font-size:14px;line-height:1.45;border-left:1px solid var(--line)}
body:not(#_v11) .feed li b,body.kh:not(#_v11) .feed li b{color:var(--ink);font-weight:600}
body:not(#_v11) .feed li .t{font-size:11.5px;color:var(--muted);margin-top:2px}
body:not(#_v11) .feed li.a-visit,body.kh:not(#_v11) .feed li.a-visit{background:transparent;box-shadow:none;color:var(--muted);font-size:13px}
body:not(#_v11) .feed li.a-remove{box-shadow:inset 2px 0 0 var(--dont),var(--shadow)}
body:not(#_v11) .feed li.a-add{box-shadow:inset 2px 0 0 var(--little),var(--shadow)}
body:not(#_v11) .feed li.a-event,body:not(#_v11) .feed li.a-setting,body.kh:not(#_v11) .feed li.a-event,body.kh:not(#_v11) .feed li.a-setting{border-left:1px solid var(--line);box-shadow:inset 2px 0 0 var(--gold),var(--shadow)}
body:not(#_v11) .feed li.a-import,body:not(#_v11) .feed li.a-unseed,body.kh:not(#_v11) .feed li.a-import{background:var(--card);box-shadow:inset 2px 0 0 var(--well),var(--shadow)}
body:not(#_v11) .feed .day{font-size:10.5px;letter-spacing:.12em;font-weight:600;color:var(--muted);background:none;box-shadow:none;border:0}
body:not(#_v11) .fi{display:inline-flex;vertical-align:-3px;margin-right:7px;color:var(--gold2)}
body:not(#_v11) .fi .i{width:15px;height:15px}
/* empty states */
body:not(#_v11) .empty{background:transparent;border:1px dashed var(--line2);border-radius:var(--r);color:var(--muted);box-shadow:none;font-size:14px}
/* settings */
body:not(#_v11) .sect{border-radius:var(--r);margin:0 0 8px}
body:not(#_v11) .sect>summary{font-size:15px;font-weight:600;padding:13px 16px;justify-content:flex-start;gap:10px;min-height:48px}
body:not(#_v11) .sect>summary .i{color:var(--gold2)}
body:not(#_v11) .sect>summary::after{content:"";width:7px;height:7px;border-right:1.5px solid var(--muted);border-bottom:1.5px solid var(--muted);transform:rotate(45deg);margin-left:auto;font-size:0;transition:transform .15s}
body:not(#_v11) .sect[open]>summary::after{transform:rotate(-135deg)}
body:not(#_v11) .sect[open]>summary{border-bottom:1px solid var(--line)}
body:not(#_v11) .alist>li{border-radius:var(--r-sm);box-shadow:none}
body:not(#_v11) .alist>li.editing,body.kh:not(#_v11) .alist>li.editing{background:var(--card2)}
body:not(#_v11) .lvrow{border:1px solid var(--line);border-radius:var(--r-sm)}
body:not(#_v11) input[type=color]{border:1px solid var(--line2);border-radius:var(--r-sm);background:var(--card)}
body:not(#_v11) .sw{border:2px solid var(--card);box-shadow:0 0 0 1px var(--line2)}
body:not(#_v11) .loginbar{padding:8px 12px;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
body:not(#_v11) .lok,body.dark:not(#_v11) .lok{display:inline-flex;align-items:center;gap:6px;color:var(--well);font-weight:600;font-size:14px}
body:not(#_v11) .logintitle{display:flex;align-items:center;justify-content:center;gap:8px;font-family:var(--ff-serif);font-weight:600;font-size:26px}
body:not(#_v11) .logintitle .i{width:20px;height:20px;color:var(--gold2)}
body:not(#_v11) .gate input{font-size:20px!important;letter-spacing:.14em}
body:not(#_v11) .eye{display:grid;place-items:center;width:40px;height:40px;color:var(--muted);padding:0;right:2px}
body:not(#_v11) .eye .i{vertical-align:0}
body:not(#_v11) .gatemsg{color:var(--dont);font-size:13.5px;font-weight:500}
/* pick-your-name */
body:not(#_v11) .pick button{border-radius:var(--r);font-size:17px;font-weight:600;padding:14px;transition:border-color .15s}
body:not(#_v11) .pick button:hover,body:not(#_v11) .pick button:active{border-color:var(--gold)}
/* zing tab */
body:not(#_v11) .zb .art{width:40px;height:40px}
body:not(#_v11) .zbl{font-size:10px;letter-spacing:.1em;font-weight:600}
body:not(#_v11) .zb .title{font-size:15.5px;font-weight:600}
body:not(#_v11) .zgo{color:var(--muted)}
body:not(#_v11) .ztitle{display:flex;align-items:center;gap:8px;font-family:var(--ff-serif);font-weight:600;font-size:24px}
body:not(#_v11) .ztitle .i{color:var(--gold2);width:20px;height:20px;vertical-align:0}
body:not(#_v11) #zingList .zhead{font-size:10.5px;letter-spacing:.12em;font-weight:600}
body:not(#_v11) #zingList .zdiv{font-size:12px;font-weight:600;letter-spacing:.04em}
body:not(#_v11) #zingList .zdiv::before,body:not(#_v11) #zingList .zdiv::after{border-top:1px solid var(--line)}
/* events */
body:not(#_v11) .evsec{font-size:10.5px;letter-spacing:.12em;font-weight:600}
body:not(#_v11) .evsec span,body:not(#_v11) .evpast summary span,body:not(#_v11) .evsubs span,body:not(#_v11) .wg span{background:var(--card2);border:1px solid var(--line);color:var(--muted);font-weight:500;font-size:11px}
body:not(#_v11) .ecard{border-radius:var(--r);padding:12px 14px;gap:4px;transition:border-color .15s}
body:not(#_v11) .ecard:hover,body.kh:not(#_v11) .ecard:active{border-color:color-mix(in srgb,var(--gold) 55%,transparent)}
body:not(#_v11) .etype{background:transparent;border:1px solid color-mix(in srgb,var(--gold) 40%,transparent);color:var(--gold2);font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:2px 8px}
body:not(#_v11) .ename{font-family:var(--ff-serif);font-weight:600;font-size:21px}
body:not(#_v11) .ename[dir=auto]:lang(he),body:not(#_v11) .evtitle h2{font-family:var(--ff-serif)}
body:not(#_v11) .ec1{font-size:12.5px}
body:not(#_v11) .ec1 b,body:not(#_v11) .evmeta b{color:var(--gold2);font-weight:600}
body:not(#_v11) .ec3{font-size:12.5px;gap:4px 14px}
body:not(#_v11) .ec3>span,body:not(#_v11) .evmeta>span{display:inline-flex;align-items:center;gap:5px}
body:not(#_v11) .ec3 .i,body:not(#_v11) .evmeta .i{width:14px;height:14px;vertical-align:0;color:var(--muted)}
body:not(#_v11) .ebadge{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:600;padding:2px 9px;border-radius:999px}
body:not(#_v11) .ebadge .i{width:12px;height:12px;vertical-align:0}
body:not(#_v11) .ebadge.ok{background:var(--well-bg);color:var(--well)}
body:not(#_v11) .ebadge.warn,body:not(.kh):not(.dark):not(#_v11) .ebadge.warn{background:var(--heard-bg);color:var(--heard)}
body:not(#_v11) .ebadge.none{background:var(--card2);color:var(--muted)}
body:not(#_v11) .evpast{border:1px solid var(--line);border-radius:var(--r)}
body:not(#_v11) .evpast>summary{font-weight:500;font-size:13.5px}
body:not(#_v11) .evnav .back{padding:7px 12px 7px 8px}
body:not(#_v11) .evtitle h2{font-size:26px;font-weight:600}
body:not(#_v11) .evmeta{font-size:13.5px;gap:4px 16px}
body:not(#_v11) .rsvp button,body:not(#_v11) .nrs button,body.kh:not(#_v11) .rsvp button:not(.on),body.kh:not(#_v11) .nrs button:not(.on){background:transparent;border:1px solid var(--line2);color:var(--ink);font-weight:500;font-size:13px;border-radius:var(--r-sm);min-height:38px;gap:5px}
body:not(#_v11) .rsvp button .i,body:not(#_v11) .nrs button .i{width:15px;height:15px;vertical-align:0}
body:not(#_v11) .rsvp button.on.r-in,body:not(#_v11) .nrs button.on.r-in{background:var(--well-bg);border-color:var(--well);color:var(--ink);font-weight:600}
body:not(#_v11) .rsvp button.on.r-in .i,body:not(#_v11) .nrs button.on.r-in .i{color:var(--well)}
body:not(#_v11) .rsvp button.on.r-maybe,body:not(#_v11) .nrs button.on.r-maybe{background:var(--heard-bg);border-color:var(--heard);color:var(--ink);font-weight:600}
body:not(#_v11) .rsvp button.on.r-maybe .i,body:not(#_v11) .nrs button.on.r-maybe .i{color:var(--heard)}
body:not(#_v11) .rsvp button.on.r-no,body:not(#_v11) .nrs button.on.r-no{background:var(--dont-bg);border-color:var(--dont);color:var(--ink);font-weight:600}
body:not(#_v11) .rsvp button.on.r-no .i,body:not(#_v11) .nrs button.on.r-no .i{color:var(--dont)}
body:not(#_v11) .rsvp .rlabel{font-weight:500;font-size:12.5px}
body:not(#_v11) .evact button{gap:6px}
body:not(#_v11) .evsubs{border-bottom:1px solid var(--line)}
body:not(#_v11) .evsubs button{font-weight:500;font-size:14px;border-bottom:2px solid transparent;color:var(--muted);gap:6px}
body:not(#_v11) .evsubs button.on{color:var(--ink);border-bottom-color:var(--gold);font-weight:600}
body:not(#_v11) .evsubs button .i{width:16px;height:16px}
body:not(#_v11) .evwh{font-family:var(--ff-serif);font-weight:600;font-size:19px;color:var(--ink)}
body:not(#_v11) .evwho{border-radius:var(--r)}
body:not(#_v11) .okc{color:var(--well);font-weight:600}
body:not(#_v11) .warnc,body:not(.kh):not(.dark):not(#_v11) .warnc{color:var(--heard);font-weight:600}
body:not(#_v11) .esong{border-radius:var(--r-sm)}
body:not(#_v11) .esong.practice{border-left:1px solid var(--line);box-shadow:inset 2px 0 0 var(--heard),var(--shadow)}
body:not(#_v11) .grip{color:var(--none);width:28px}
body:not(#_v11) .grip .i{width:16px;height:16px;vertical-align:0}
body:not(#_v11) .enum{color:var(--muted);font-weight:600;font-size:12.5px;font-variant-numeric:tabular-nums}
body:not(#_v11) .et{font-weight:600;font-size:15px}
body:not(#_v11) .etap[dir=rtl] .et{font-family:var(--ff-he);font-size:16.5px}
body:not(#_v11) .needp,body:not(.kh):not(.dark):not(#_v11) .needp{display:inline-flex;align-items:center;gap:4px;background:var(--heard-bg);color:var(--heard);font-weight:600;font-size:11.5px;padding:2px 8px}
body:not(#_v11) .needp .i{width:12px;height:12px;vertical-align:0}
body:not(#_v11) .edet{border-top:1px solid var(--line)}
body:not(#_v11) .wg{font-size:12px;font-weight:600;letter-spacing:.04em}
body:not(#_v11) .wg-maybe{color:var(--heard)}
body:not(#_v11) .wlist li{box-shadow:none;border-radius:var(--r-sm);font-size:14px}
body:not(#_v11) .evsheet{background:rgba(8,6,5,.6);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
body:not(#_v11) .evsheet .sbox,body.kh:not(#_v11) .evsheet .sbox{background:var(--card);border-color:var(--line2);box-shadow:var(--shadow-lg)}
body:not(#_v11) .sfoot,body.kh:not(#_v11) .sfoot{background:var(--card)}
body:not(#_v11) .shead h3{font-family:var(--ff-serif);font-weight:600;font-size:21px;color:var(--ink)}
body:not(#_v11) .pkb,body:not(#_v11) .cpb{border-radius:var(--r-sm);box-shadow:none}
body:not(#_v11) .pkb .pkc{border:1.5px solid var(--line2);border-radius:6px;font-size:12px;font-weight:600}
body:not(#_v11) .pkb .pkc .i{width:14px;height:14px;vertical-align:0}
body:not(#_v11) .pkb.sel{border-color:var(--gold)}
body:not(#_v11) .pkb.has .pkc{border-color:var(--well);color:var(--well)}
body:not(#_v11) .cpn{display:inline-flex;align-items:center;gap:5px}
body:not(#_v11) .cpn .i{width:14px;height:14px;vertical-align:0}
body:not(#_v11) .flabel,body:not(#_v11) .fld>span{font-size:12px;font-weight:500;color:var(--muted)}
/* notifications panel */
body:not(#_v11) .npanel,body.kh:not(#_v11) .npanel{background:var(--card2);border:1px solid var(--line2);border-radius:var(--r);box-shadow:var(--shadow-lg)}
body:not(#_v11) .npanel::before{display:none}
body:not(#_v11) .nhead{padding:10px 8px 10px 14px;border-bottom:1px solid var(--line)}
body:not(#_v11) .nhead b,body.kh:not(#_v11) .nhead b{font-family:var(--ff-serif);font-weight:600;font-size:19px;color:var(--ink)}
body:not(#_v11) .nlink,body.kh:not(#_v11) .nlink{color:var(--gold2);font-weight:500;font-size:13px}
body:not(#_v11) .nx{display:grid;place-items:center;border-radius:var(--r-sm);color:var(--muted)}
body:not(#_v11) .nx .i{vertical-align:0}
body:not(#_v11) .nitem{padding:11px 14px 11px 16px;border-bottom:1px solid var(--line);font-size:13.5px}
body:not(#_v11) .nitem.unread::after{left:6px;top:17px;width:5px;height:5px;background:var(--gold)}
body:not(#_v11) .nitem.needs{background:var(--hl);box-shadow:inset 2px 0 0 var(--gold)}
body:not(#_v11) .npill{background:transparent;border:1px solid color-mix(in srgb,var(--gold) 55%,transparent);color:var(--gold2);font-size:9.5px;font-weight:600;letter-spacing:.12em;padding:1px 7px;margin-bottom:6px}
body:not(#_v11) .ntext b,body.kh:not(#_v11) .ntext b{color:var(--ink);font-weight:600}
body:not(#_v11) .nk{display:inline-flex;vertical-align:-3px;margin-right:6px;color:var(--gold2)}
body:not(#_v11) .nk .i{width:15px;height:15px}
body:not(#_v11) .nsub{font-size:11.5px}
body:not(#_v11) .nopen,body.kh:not(#_v11) .nopen{background:transparent;border:1px solid var(--line2);color:var(--ink);font-weight:500;font-size:12.5px;border-radius:var(--r-sm);gap:4px;padding:4px 8px 4px 11px}
body:not(#_v11) .nopen .i{width:14px;height:14px;vertical-align:0}
body:not(#_v11) .npush{background:transparent;border-top:1px solid var(--line);padding:10px 14px;font-size:12.5px}
body:not(#_v11) .pbtn{display:inline-flex;align-items:center;gap:6px;background:transparent;border:1px solid color-mix(in srgb,var(--gold) 60%,transparent);color:var(--gold2);font-weight:600;font-size:13px;border-radius:var(--r-sm)}
body:not(#_v11) .pon{display:inline-flex;align-items:center;gap:6px;color:var(--well);font-weight:600}
body:not(#_v11) .phint{display:flex;gap:8px;align-items:flex-start}
body:not(#_v11) .phint>.i{margin-top:1px;color:var(--muted)}
body:not(#_v11) .phint .iin{display:inline-flex;vertical-align:-3px}
body:not(#_v11) .phint .iin .i{width:14px;height:14px}
/* are-you-coming banner: quiet card with a gold edge, not a gold slab */
body:not(#_v11) .askbar{background:var(--card2);color:var(--ink);border:1px solid color-mix(in srgb,var(--gold) 45%,transparent);box-shadow:inset 3px 0 0 var(--gold),var(--shadow);border-radius:var(--r);padding:10px 44px 10px 14px;margin:8px 10px 0}
body:not(#_v11) .askq{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--gold2)}
body:not(#_v11) .askq .i{width:16px;height:16px}
body:not(#_v11) .askev{color:var(--ink);text-decoration-color:var(--line2)}
body:not(#_v11) .askbar .nrs button{background:transparent;border-color:var(--line2);color:var(--ink)}
body:not(#_v11) .askbar .nrs button:active{background:var(--hl);color:var(--ink)}
body:not(#_v11) .askx{display:grid;place-items:center;color:var(--muted);top:6px;right:6px;border-radius:var(--r-sm)}
body:not(#_v11) .askx .i{vertical-align:0}
/* toast + footer */
body:not(#_v11) .toast,body.kh:not(#_v11) .toast{background:var(--toast-bg);color:var(--toast-ink);border-radius:var(--r-sm);font-size:13.5px;font-weight:500;box-shadow:var(--shadow-lg);padding:10px 16px}
body:not(#_v11) .foot,body.kh:not(#_v11) .foot{color:var(--none);font-size:12px}
body:not(#_v11) .foot a{color:var(--muted)}
/* motion: subtle only */
@media (prefers-reduced-motion:reduce){body:not(#_v11) *{transition:none!important;animation:none!important}}
@media (max-width:420px){
  body:not(#_v11) .top{padding-left:12px;padding-right:12px;gap:8px}
  body:not(#_v11) .logo-img{width:38px;height:38px}
  body:not(#_v11) h1{font-size:20px}
  body:not(#_v11) .sub{font-size:9.5px;letter-spacing:.12em}
  body:not(#_v11) .bell,body:not(#_v11) .topr .gear{width:38px;height:38px}
  body:not(#_v11) .me{min-height:38px;padding:4px 8px}
  body:not(#_v11) .tabs button{font-size:13.5px;padding:12px 9px 11px}
  body:not(#_v11) .lv{font-size:12.5px;gap:5px}
}
@media print{body:not(#_v11) .i{display:none}}

/* v11 tune */
body:not(#_v11) #markList .art,body:not(#_v11) #resList .art{display:none}
body:not(#_v11) .sub{text-transform:none;letter-spacing:.02em;font-size:12px;font-weight:400}
body:not(#_v11) .lv{white-space:nowrap;padding:5px 2px;letter-spacing:-.005em}
body:not(#_v11) .grid th{letter-spacing:.04em;font-size:10px}
body:not(#_v11) .sect>summary{min-height:44px;padding:11px 14px}
@media (max-width:420px){body:not(#_v11) .sub{font-size:11px}body:not(#_v11) .lv{font-size:12px;gap:4px}body:not(#_v11) .lv::before{width:6px;height:6px}}

body:not(#_v11) .evact{display:grid;grid-template-columns:auto 1fr 1fr;overflow:visible}
body:not(#_v11) .evact button{padding:8px 10px;font-size:13.5px;min-width:0;white-space:nowrap}
body:not(#_v11) .nrs button{padding:6px 6px;white-space:nowrap;min-width:0;flex:1 1 0}
body:not(#_v11) .askbar .nrs{margin-right:-30px}
@media (max-width:420px){body:not(#_v11) .nrs button,body:not(#_v11) .rsvp button{font-size:12.5px;gap:4px}body:not(#_v11) .nrs button .i,body:not(#_v11) .rsvp button .i{width:14px;height:14px}}
@media (min-width:760px){body:not(#_v11) .evact{display:flex}}

body:not(#_v11) .zgo .i{width:18px;height:18px;vertical-align:0}
body:not(#_v11) .grid th,body:not(#_v11) .grid td{padding:7px 6px}
body:not(#_v11) .grid th{letter-spacing:.03em}
body:not(#_v11) h2 .part{font-family:var(--ff);font-weight:400}
@media (max-width:420px){body:not(#_v11) h1{font-size:19.5px}body:not(#_v11) .sub{font-size:10.5px;letter-spacing:0}body:not(#_v11) .me{padding:4px 7px}body:not(#_v11) .me small{font-size:10px;letter-spacing:0}}

@media (min-width:760px){body:not(#_v11) .askbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px}body:not(#_v11) .askbar .askt{flex:1 1 auto}body:not(#_v11) .askbar .nrs{flex:0 1 420px;margin-right:0}}

/* v11: every tap target at least 36px */
body:not(#_v11) .zing,body:not(#_v11) .zlink{min-height:36px}
body:not(#_v11) .zmini{width:36px;height:36px}
body:not(#_v11) .tchips button{min-height:36px}
body:not(#_v11) details.moref>summary{min-height:36px}
body:not(#_v11) .askev{min-height:36px}

/* ===================================================================================
   v12 — "Kehulu light": warm ivory paper, clearly different tones per area, vibrant gold.
   Default look (theme mode "kehulu"). The v11 dark espresso look is mode "espresso".
   =================================================================================== */
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12){--bg:#faf6ef;--card:#ffffff;--card2:#fdf9f2;--line:#ecdfca;--line2:#dcc8a6;--ink:#3b2a1e;--muted:#6f5a46;--none:#a08b74;
  --gold:#c9952c;--gold2:#8f620f;--ongold:#2a1c12;--hl:rgba(201,149,44,.15);
  --sand:#efdcbb;--sand2:#e6cda3;--tabbg:#f6ead6;--palegold:#fbf1d8;--palegold-line:#ecd6a0;
  --peach:#fdeee4;--peach2:#fbe2d2;--peach-line:#efc7ad;--terra:#a3461f;
  --sage:#f0f5ec;--sage-line:#d3e1cb;--sage-ink:#3d5a35;--slate:#eef2f7;--slate-line:#d3dce8;
  --shadow:0 1px 2px rgba(92,60,25,.08),0 2px 6px rgba(92,60,25,.06);--shadow-lg:0 14px 36px rgba(70,45,20,.22);
  --topbg:var(--sand);--toast-bg:#3b2a1e;--toast-ink:#fdf8ef;
  --paper:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .42 0 0 0 0 .29 0 0 0 0 .14 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E");
  --linen:repeating-linear-gradient(0deg,rgba(150,105,50,.055) 0 1px,transparent 1px 4px),repeating-linear-gradient(90deg,rgba(150,105,50,.045) 0 1px,transparent 1px 5px);
  --staff:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='64'%3E%3Cg stroke='%23a2763c' stroke-opacity='.16' stroke-width='1'%3E%3Cpath d='M0 14h240M0 22h240M0 30h240M0 38h240M0 46h240'/%3E%3C/g%3E%3Cg fill='%23a2763c' fill-opacity='.13'%3E%3Cellipse cx='52' cy='34' rx='4.2' ry='3.1' transform='rotate(-20 52 34)'/%3E%3Cpath d='M55.6 33V12h1.2v21z'/%3E%3Cellipse cx='168' cy='26' rx='4.2' ry='3.1' transform='rotate(-20 168 26)'/%3E%3Cpath d='M171.6 25V6h1.2v19z'/%3E%3C/g%3E%3C/svg%3E");
  background-color:var(--bg);background-image:var(--paper),var(--linen);background-attachment:fixed,fixed;color:var(--ink)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) main{background:transparent}
/* header band: sand / light caramel with a faint music staff, logo on a brown disc */
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .top{background-color:var(--sand);background-image:var(--staff),linear-gradient(180deg,#f3e4c8,#e9d3ad);background-repeat:repeat-x,no-repeat;background-position:0 50%,0 0;-webkit-backdrop-filter:none;backdrop-filter:none;border-bottom:1px solid #d4b98b;box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 2px 8px rgba(92,60,25,.10);color:var(--ink)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .logo-img{border-radius:50%;background:#3a2516;padding:2px;box-shadow:0 0 0 2px #5a3a22,0 2px 6px rgba(58,37,22,.35)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) h1{color:#4a2f1b}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .sub{color:#6a4f37}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .bell,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .gear,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .me{background:rgba(255,252,245,.72);border-color:#cfb385;color:var(--ink)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .bell:hover,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .gear:hover{border-color:var(--gold);color:#6e4a10;background:#fffaf0}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .bell.on,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .gear.on{background:#fff6e2;border-color:var(--gold);color:#6e4a10}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .bell .badge{background:#d64545;box-shadow:0 0 0 2px var(--sand)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .me small{color:#7a5f45}
/* tab bar: its own lighter tan tone, gold underline */
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .tabs{background:var(--tabbg);background-image:var(--linen);border-bottom:1px solid #e2cda8;box-shadow:0 1px 3px rgba(92,60,25,.06)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .tabs button{color:#7a6048}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .tabs button:hover{color:var(--ink)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .tabs button.on{color:#3b2a1e;border-bottom:3px solid var(--gold);padding-bottom:10px}
/* filter / search panel: pale gold */
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .bar{background:var(--palegold);border:1px solid var(--palegold-line);border-radius:var(--r);padding:10px;box-shadow:var(--shadow)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .bar input[type=search],body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .bar select,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .bar input:not([type]){background:#fff;border-color:#e3cb92}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .chips button{background:#fff;border-color:#e3cfa6;color:#6f5a46}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .chips button:hover{border-color:var(--gold);color:var(--ink)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .chips button.on{background:var(--gold);border-color:var(--gold);color:var(--ongold);font-weight:600}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) input:focus,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) select:focus,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(201,149,44,.22)}
/* buttons: primary gold, secondary deep-brown outline */
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .primary,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .add{background:var(--gold);border-color:#b8851f;color:var(--ongold);box-shadow:0 1px 2px rgba(120,80,20,.25),inset 0 1px 0 rgba(255,255,255,.25)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .primary:hover,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .add:hover{background:#d4a137;filter:none}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .add[disabled]{background:#f3ead9;border-color:var(--line2);color:var(--muted);box-shadow:none}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .ghost,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .reload{background:#fffdf9;border:1px solid #7a5434;color:#4a2f1b}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .ghost:hover{background:#fbf1de;border-color:#5a3a22}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .ghost.danger,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .linkbtn.danger{color:#b03030;border-color:rgba(214,69,69,.55);background:#fffafa}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .linkbtn,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .empty .linkbtn{background:#fffdf9;border-color:#7a5434;color:#4a2f1b}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .zing,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .zlink,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .zingbtn,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .zingbtn.small-zing{background:#fff8e8;border-color:#e0bf72;color:#7a5209}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .zing:hover,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .zlink:hover,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .zingbtn:hover{background:#fdefcc;border-color:var(--gold)}
/* song cards: white, soft shadow, thin warm border */
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .song,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .tablewrap,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .pick button,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .esong,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .sect,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .wlist li{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .song:hover{border-color:#e2cb9f}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .tbadge{border-color:#e2cfac;color:#7a6048;background:#fcf6ea}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .art,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .zb .art{background:#fbf1dc;border-color:#ecd6a6;color:#8f620f}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .artist{color:#78614c}
/* mark levels: vibrant dot + word; selected = filled tinted pill */
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .lv{background:#fff;border-color:#e2d3bb;color:#5e4a39}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .lv.well,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .lv.little,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .lv.heard,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .lv.dont{color:#5e4a39}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .lv::before{width:9px;height:9px;box-shadow:none}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .lv.well::before{background:var(--well)} body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .lv.little::before{background:var(--little)} body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .lv.heard::before{background:var(--heard)} body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .lv.dont::before{background:var(--dont)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .lv:hover{border-color:var(--gold);color:var(--ink)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .lv.on.well{background:var(--well-bg);border-color:var(--well);color:var(--well-t);box-shadow:inset 0 0 0 1px var(--well)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .lv.on.little{background:var(--little-bg);border-color:var(--little);color:var(--little-t);box-shadow:inset 0 0 0 1px var(--little)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .lv.on.heard{background:var(--heard-bg);border-color:var(--heard);color:var(--heard-t);box-shadow:inset 0 0 0 1px var(--heard)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .lv.on.dont{background:var(--dont-bg);border-color:var(--dont);color:var(--dont-t);box-shadow:inset 0 0 0 1px var(--dont)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .lv.on{border-radius:999px;font-weight:600}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .pill.well{background:var(--well-bg);border-color:transparent;color:var(--well-t)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .pill.little{background:var(--little-bg);border-color:transparent;color:var(--little-t)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .pill.heard{background:var(--heard-bg);border-color:transparent;color:var(--heard-t)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .pill.dont{background:var(--dont-bg);border-color:transparent;color:var(--dont-t)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .pill.none{background:#f5efe5;border-color:transparent;color:var(--muted)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .pill::before{width:7px;height:7px}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .meter,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .kbar{background:#efe5d6;height:5px}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .lvl.well,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .grid td.well,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .okc,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .lok{color:var(--well-t)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .lvl.little,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .grid td.little{color:var(--little-t)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .lvl.heard,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .grid td.heard,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .warnc,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .wg-maybe{color:var(--heard-t)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .lvl.dont,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .grid td.dont{color:var(--dont-t)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .kd i{width:8px;height:8px}
/* tables (Results) */
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .grid th{background:#f7ecd8;color:#6f5a46;border-bottom-color:#e6d2ad}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .grid td{border-bottom-color:#f0e6d6}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .who-t tbody tr.on td{background:#fff4dd}
/* Events: light terracotta / peach */
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .ecard{background:linear-gradient(180deg,#fff3ea,var(--peach));border:1px solid var(--peach-line);box-shadow:var(--shadow)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .ecard:hover,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .ecard:active{border-color:#e3a988}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .etype{background:#fff;border-color:#e9b393;color:var(--terra)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .ec1 b,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .evmeta b{color:var(--terra)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .evsec span,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .evpast summary span,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .evsubs span,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .wg span{background:#fff;border-color:var(--peach-line);color:#8a4a2c}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .evpast{background:rgba(253,238,228,.55);border-color:var(--peach-line)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .ebadge.ok{background:var(--well-bg);color:var(--well-t)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .ebadge.warn{background:var(--heard-bg);color:var(--heard-t)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .ebadge.none{background:#fff;color:var(--muted)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) #v-events .evtitle,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) #v-events .evhead{color:var(--ink)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .evsubs{border-bottom-color:var(--peach-line)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .evsubs button.on{border-bottom:3px solid var(--terra);color:var(--ink)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .esong.practice{box-shadow:inset 3px 0 0 var(--heard),var(--shadow)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .needp{background:var(--heard-bg);color:var(--heard-t)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .evwho{background:var(--peach);border:1px solid var(--peach-line)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .rsvp button,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .nrs button{background:#fff;border-color:#d8c3a2;color:var(--ink)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .rsvp button.on.r-in,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .nrs button.on.r-in{background:var(--well-bg);border-color:var(--well);color:var(--well-t)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .rsvp button.on.r-maybe,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .nrs button.on.r-maybe{background:var(--heard-bg);border-color:var(--heard);color:var(--heard-t)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .rsvp button.on.r-no,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .nrs button.on.r-no{background:var(--dont-bg);border-color:var(--dont);color:var(--dont-t)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .evsheet{background:rgba(59,42,30,.42)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .evsheet .sbox{background:#fffdf9;border-color:var(--line2)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .sfoot{background:#fbf4e6}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .shead{background:#f6ead6}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .pkb,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .cpb{background:#fff;border:1px solid var(--line)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .pkb.sel{background:#fff6e2;border-color:var(--gold)}
/* Choir members: soft sage */
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) #v-singers .tablewrap,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) #v-singers .song,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) #v-singers .alist>li{background:var(--sage);border-color:var(--sage-line)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) #v-singers .grid th{background:#e3ecdc;color:var(--sage-ink);border-bottom-color:var(--sage-line)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) #v-singers .grid td{border-bottom-color:#e1eadb}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) #v-singers .bar{background:var(--sage);border-color:var(--sage-line)}
/* Activity: light blue-grey */
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .feed li{background:var(--slate);border:1px solid var(--slate-line);box-shadow:none}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .feed li.a-visit{background:transparent;border-color:transparent}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .feed li.a-remove{box-shadow:inset 3px 0 0 var(--dont)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .feed li.a-add{box-shadow:inset 3px 0 0 var(--little)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .feed li.a-event,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .feed li.a-setting{border-left:1px solid var(--slate-line);box-shadow:inset 3px 0 0 var(--gold)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .feed li.a-import,body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .feed li.a-unseed{background:var(--slate);box-shadow:inset 3px 0 0 var(--well)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .feed .day{color:#5b6a7e;background:none;border:0}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .fi{color:#4a6488}
/* bell panel: white with a tinted header */
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .npanel{background:#fff;border:1px solid #dcc8a6;box-shadow:var(--shadow-lg);overflow:hidden}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .nhead{background:linear-gradient(180deg,#f6e7c9,#f1dfbd);border-bottom:1px solid #e2c993}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .nhead b{color:#4a2f1b}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .nlink{color:#7a5209}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .nitem{border-bottom-color:#f1e7d8}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .nitem.needs{background:#fff6e0;box-shadow:inset 3px 0 0 var(--gold)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .npill{background:#fff;border-color:#e0bf72;color:#7a5209}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .nk{color:#a0701a}
/* are-you-coming banner: pale gold card */
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .askbar{background:var(--palegold);border:1px solid var(--palegold-line);box-shadow:inset 4px 0 0 var(--gold),var(--shadow)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .askq{color:#7a5209}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .askbar .nrs button{background:#fff;border-color:#e0c78f}
/* Settings */
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .sect>summary{background:#fbf3e4}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .sect[open]>summary{background:#f6ead6;border-bottom-color:#e8d5b1}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .sect>summary .i{color:#a0701a}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .alist>li{background:#fff;border:1px solid var(--line)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .alist>li.editing{background:#fff8ea}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .loginbar{background:var(--palegold);border-color:var(--palegold-line)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .empty{background:rgba(255,255,255,.6);border-color:#dcc8a6;color:var(--muted)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .toast{background:var(--toast-bg);color:var(--toast-ink)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .foot{color:#77624d}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) .foot a{color:#6f5a46}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) #v-pick .pick button:hover{border-color:var(--gold)}

body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) #v-activity .tablewrap{background:#f7f9fc;border-color:var(--slate-line)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) #v-activity .grid th{background:#e7edf5;color:#4f5e72;border-bottom-color:var(--slate-line)}
body.vb:not(.kh):not(.dark):not(#_v11):not(#_v12) #v-activity .grid td{border-bottom-color:#e6ebf2}

/* ===== v13: mark levels = one plain colored dot (no words, no box) ===== */
.kdot{display:inline-block;width:12px;height:12px;border-radius:50%;flex:none;vertical-align:-1px;background:var(--none)}
.kdot.well{background:var(--well)}
.kdot.little{background:var(--little)}
.kdot.heard{background:var(--heard)}
.kdot.dont{background:var(--dont)}
.kdot.none{background:transparent;box-shadow:inset 0 0 0 1.6px var(--none)}
/* picker on a song row: 4 bare dots, the chosen one full color and a bit bigger */
body .song .dpick{display:flex;align-items:center;gap:2px;margin:4px 0 -4px;margin-inline-start:-8px}
body .song .dpick button.dp{-webkit-appearance:none;appearance:none;background:none!important;border:0!important;box-shadow:none!important;outline:0;padding:0!important;margin:0;width:40px;min-width:40px;height:38px;min-height:38px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;cursor:pointer;-webkit-tap-highlight-color:transparent;color:inherit}
body .song .dpick button.dp::before,body .song .dpick button.dp::after{content:none!important;display:none!important}
body .song .dpick .dp .kdot{width:14px;height:14px;opacity:.55;transition:opacity .15s,transform .15s}
body .song .dpick.has .dp .kdot{opacity:.3}
body .song .dpick .dp:hover .kdot{opacity:.8}
body .song .dpick .dp.on .kdot{opacity:1;transform:scale(1.3)}
body .song .dpick .dp:focus-visible{outline:2px solid var(--gold,#c9952c);outline-offset:-6px}
/* one compact color key above the song list */
.dotkey{display:flex;flex-wrap:wrap;align-items:center;gap:2px 12px;font-size:11.5px;line-height:1.3;color:var(--muted);margin:2px 2px 8px}
.dotkey:empty{display:none}
.dotkey span{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.dotkey .kdot{width:9px;height:9px}
/* counts: dot + number only */
body .dcounts{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;margin-top:7px}
body .dcounts .dc{display:inline-flex;align-items:center;gap:5px;font-size:13.5px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--ink);background:none;border:0;padding:0}
body .dcounts .dc.z{opacity:.4}
body .dwho li.wd{display:flex;align-items:baseline;gap:8px}
body .dwho li.wd .kdot{position:relative;top:1px}
body th.dth{text-align:center}
body th.dth .kdot{width:11px;height:11px}
body .group h3.dh{display:flex;align-items:center;gap:7px;font-size:15px;font-weight:600}
body .lvd{display:inline-flex;align-items:center;vertical-align:middle}
body .lvd .kdot{width:11px;height:11px}
body .kd i{width:11px!important;height:11px!important;border-radius:50%}

/* ================= v14: Song list = the choir's list + Zing panel; List / Compact / Grid views ================= */
body:not(#_v14a):not(#_v14b) .sltools{display:flex;align-items:center;gap:8px;flex-wrap:nowrap;min-width:0}
body:not(#_v14a):not(#_v14b) .vseg{display:inline-flex;flex:none;border:1px solid var(--line2,var(--line));border-radius:10px;overflow:hidden;background:var(--card)}
body:not(#_v14a):not(#_v14b) .vseg button{-webkit-appearance:none;appearance:none;background:transparent;border:0;border-radius:0;min-width:40px;min-height:38px;padding:0 9px;display:inline-flex;align-items:center;justify-content:center;color:var(--muted);cursor:pointer;box-shadow:none}
body:not(#_v14a):not(#_v14b) .vseg button+button{border-inline-start:1px solid var(--line)}
body:not(#_v14a):not(#_v14b) .vseg button .i{width:17px;height:17px}
body:not(#_v14a):not(#_v14b) .vseg button.on{background:color-mix(in srgb,var(--gold,#c9952c) 20%,transparent);color:var(--ink,#3b2a1e)}
body:not(#_v14a):not(#_v14b) .slsel{display:inline-flex;align-items:center;gap:3px;flex:1 1 0;min-width:0;border:1px solid var(--line2,var(--line));border-radius:10px;padding:0 2px 0 9px;min-height:38px;background:var(--card);color:var(--muted);cursor:pointer}
body:not(#_v14a):not(#_v14b) .slsel .i{width:15px;height:15px;flex:none}
body:not(#_v14a):not(#_v14b) .slsel select{-webkit-appearance:none;appearance:none;border:0;background:transparent;box-shadow:none;font:inherit;font-size:13.5px;color:var(--ink,#3b2a1e);min-height:36px;height:36px;padding:0 6px 0 3px;margin:0;width:100%;min-width:0;text-overflow:ellipsis;cursor:pointer}
body:not(#_v14a):not(#_v14b) .slsel:focus-within{outline:2px solid var(--gold,#c9952c);outline-offset:1px}
body:not(#_v14a):not(#_v14b) #markList .sghead{grid-column:1/-1;display:flex;align-items:baseline;gap:8px;font-weight:600;font-size:13.5px;color:var(--gold2,#8a6a1c);padding:12px 4px 4px;border-bottom:1px solid var(--line);background:transparent;list-style:none}
body:not(#_v14a):not(#_v14b) #markList .sghead b{font-weight:500;color:var(--muted);font-size:12px}
body:not(#_v14a):not(#_v14b) #markList .sghead:first-child{padding-top:2px}

/* Compact list: one dense line per song */
body:not(#_v14a):not(#_v14b) #markList.v-compact{grid-template-columns:minmax(0,1fr)!important;gap:0;background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden}
body:not(#_v14a):not(#_v14b) #markList.v-compact .song{display:flex;flex-wrap:wrap;align-items:center;gap:0 4px;padding:0 2px 0 10px;border:0;border-bottom:1px solid var(--line);border-radius:0;box-shadow:none;min-height:42px}
body:not(#_v14a):not(#_v14b) #markList.v-compact .song:last-child{border-bottom:0}
body:not(#_v14a):not(#_v14b) #markList.v-compact .sghead{background:color-mix(in srgb,var(--gold,#c9952c) 9%,var(--card));padding:8px 10px 6px}
body:not(#_v14a):not(#_v14b) #markList.v-compact .head{flex:1 1 0;min-width:0;display:flex;align-items:center;gap:4px}
body:not(#_v14a):not(#_v14b) #markList.v-compact .meta{flex:1 1 auto;min-width:0;display:flex;align-items:baseline;gap:8px;white-space:nowrap;overflow:hidden}
body:not(#_v14a):not(#_v14b) #markList.v-compact .title{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;font-size:15px}
body:not(#_v14a):not(#_v14b) #markList.v-compact .meta[dir=rtl] .title{font-size:16px}
body:not(#_v14a):not(#_v14b) #markList.v-compact .artist{flex:0 100 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;font-size:12.5px}
body:not(#_v14a):not(#_v14b) #markList.v-compact .he,body:not(#_v14a):not(#_v14b) #markList.v-compact .tline{display:none}
body:not(#_v14a):not(#_v14b) #markList.v-compact .zbox{align-self:center;gap:0}
body:not(#_v14a):not(#_v14b) #markList.v-compact .zbox .zing{font-size:0;gap:0;padding:0;width:34px;min-width:34px;height:34px;min-height:34px;justify-content:center;border-radius:50%}
body:not(#_v14a):not(#_v14b) #markList.v-compact .zbox .zing .i{width:13px;height:13px}
body:not(#_v14a):not(#_v14b) #markList.v-compact .zbox .zmini{width:30px;min-width:30px}
body:not(#_v14a):not(#_v14b) #markList.v-compact .dpick{flex:none;margin:0;gap:0}
body:not(#_v14a):not(#_v14b) #markList.v-compact .dpick button.dp{width:36px;min-width:36px;height:40px;min-height:40px}
body:not(#_v14a):not(#_v14b) #markList.v-compact .zpanel{flex:1 0 100%;margin:0 0 8px}

/* Grid: cards */
body:not(#_v14a):not(#_v14b) #markList.v-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px}
@media (min-width:600px){ body:not(#_v14a):not(#_v14b) #markList.v-grid{grid-template-columns:repeat(auto-fill,minmax(185px,1fr))!important} }
body:not(#_v14a):not(#_v14b) #markList.v-grid .song{display:flex;flex-direction:column;padding:10px 8px 4px 10px;min-height:124px;min-width:0}
body:not(#_v14a):not(#_v14b) #markList.v-grid .head{flex:1 1 auto;display:flex;flex-direction:column;align-items:stretch;gap:6px;min-width:0}
body:not(#_v14a):not(#_v14b) #markList.v-grid .meta{min-width:0}
body:not(#_v14a):not(#_v14b) #markList.v-grid .title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:15px;line-height:1.25}
body:not(#_v14a):not(#_v14b) #markList.v-grid .meta[dir=rtl] .title{font-size:16px}
body:not(#_v14a):not(#_v14b) #markList.v-grid .artist{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
body:not(#_v14a):not(#_v14b) #markList.v-grid .he,body:not(#_v14a):not(#_v14b) #markList.v-grid .tline{display:none}
body:not(#_v14a):not(#_v14b) #markList.v-grid .zbox{align-self:flex-start;margin-top:auto}
body:not(#_v14a):not(#_v14b) #markList.v-grid .dpick{margin:4px 0 0;margin-inline-start:-8px;gap:0}
body:not(#_v14a):not(#_v14b) #markList.v-grid .dpick button.dp{width:38px;min-width:38px}

/* Zing panel */
body:not(#_v14a):not(#_v14b) .zside{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:0 12px 14px;box-shadow:0 6px 24px rgba(59,42,30,.08)}
body:not(#_v14a):not(#_v14b) .zshead{display:flex;align-items:center;justify-content:space-between;gap:8px;position:sticky;top:0;z-index:2;margin:0 -12px 6px;padding:10px 8px 10px 14px;background:color-mix(in srgb,var(--gold,#c9952c) 14%,var(--card));border-bottom:1px solid var(--line);border-radius:14px 14px 0 0}
body:not(#_v14a):not(#_v14b) .zshead h2{margin:0;font-size:18px}
body:not(#_v14a):not(#_v14b) .zsclose{width:40px;height:40px;min-height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:transparent;border:0;color:var(--ink,#3b2a1e);cursor:pointer}
body:not(#_v14a):not(#_v14b) .zside > .hint{margin:4px 0 8px}
body:not(#_v14a):not(#_v14b) .zside #zingList{grid-template-columns:minmax(0,1fr)!important}
body:not(#_v14a):not(#_v14b) .zside #zingList .song .add{white-space:nowrap}
body:not(#_v14a):not(#_v14b) .zside .ztype{margin-top:14px;border-top:1px solid var(--line);padding-top:4px}
body:not(#_v14a):not(#_v14b) .zside .ztype summary{cursor:pointer;font-weight:600;padding:10px 2px;min-height:40px;color:var(--ink,#3b2a1e)}
body:not(#_v14a):not(#_v14b) .zscrim{position:fixed;inset:0;z-index:39;background:rgba(40,28,18,.38)}
@media (max-width:899.98px){
  body:not(#_v14a):not(#_v14b) .zside{position:fixed;top:0;right:0;bottom:0;z-index:40;width:min(440px,94vw);max-height:none;margin:0;border-radius:16px 0 0 16px;border-right:0;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding-top:0;padding-bottom:calc(16px + env(safe-area-inset-bottom));transform:translateX(105%);visibility:hidden;transition:transform .22s ease,visibility 0s linear .22s;box-shadow:-12px 0 40px rgba(40,28,18,.18)}
  body:not(#_v14a):not(#_v14b) .zside.open{transform:none;visibility:visible;transition:transform .22s ease,visibility 0s}
  body:not(#_v14a):not(#_v14b) .zshead{padding-top:calc(10px + env(safe-area-inset-top));border-radius:16px 0 0 0}
  body.zsopen{overflow:hidden}
}
@media (min-width:900px){
  body:not(#_v14a):not(#_v14b) .slwrap{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:16px;align-items:start}
  body:not(#_v14a):not(#_v14b) .zside{position:sticky;top:calc(var(--toph,62px) + env(safe-area-inset-top) + 58px);max-height:calc(100vh - var(--toph,62px) - 74px);overflow:auto;overscroll-behavior:contain}
  body:not(#_v14a):not(#_v14b) #v-mark .bar>#zingBtn,body:not(#_v14a):not(#_v14b) .zsclose{display:none}
  body:not(#_v14a):not(#_v14b) #v-mark .bar>.searchform{grid-column:1/-1}
  body:not(#_v14a):not(#_v14b) .zscrim{display:none}
  body:not(#_v14a):not(#_v14b) #markList.v-list{grid-template-columns:minmax(0,1fr)}
}
@media (min-width:1150px){ body:not(#_v14a):not(#_v14b) #markList.v-list{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (min-width:1400px){ body:not(#_v14a):not(#_v14b) main{max-width:1380px} }
@media print{ body:not(#_v14a):not(#_v14b) .zside,body:not(#_v14a):not(#_v14b) .zscrim,body:not(#_v14a):not(#_v14b) .sltools{display:none!important} }
@media (prefers-reduced-motion:reduce){ body:not(#_v14a):not(#_v14b) .zside{transition:none!important} }
body:not(#_v14a):not(#_v14b) .zside .zkinds{flex-wrap:wrap;overflow:visible}
@media (min-width:900px){ body:not(#_v14a):not(#_v14b) .slsel{flex:0 1 220px} }

/* v15: shared event types */
#evSheet .etchips .etaddchip{display:inline-flex;align-items:center;gap:5px;border-style:dashed;border-color:var(--gold);color:var(--gold2);background:transparent;font-weight:600}
#evSheet .etchips .etaddchip .i{width:16px;height:16px}
#evSheet .etchips .etaddchip.on2{background:var(--hl)}
#evSheet .etchips .etmanbtn{width:36px;height:36px;min-height:36px;padding:0;border-radius:999px;display:inline-grid;place-items:center;background:transparent;color:var(--muted)}
#evSheet .etchips .etmanbtn .i{width:17px;height:17px}
#evSheet .etchips .etmanbtn.on2{background:var(--hl);color:var(--ink);border-color:var(--gold)}
.etadd{display:flex;gap:8px;margin:10px 0 2px;align-items:stretch}
.etadd[hidden],.etman[hidden]{display:none}
.etadd input{flex:1;min-width:0;min-height:40px}
.etadd .primary{min-height:40px;padding:0 16px}
#evSheet .etman{margin:10px 0 2px;padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--card2)}
.etmanhead{display:flex;flex-direction:column;gap:2px;margin:0 2px 8px}
.etmanhead .hint{margin:0;font-size:12.5px}
.etlist{gap:6px!important}
.etlist>li{padding:4px 6px 4px 12px!important;flex-wrap:nowrap!important}
.etlist>li.editing{display:block;padding:8px!important}
.etlist .aname{min-width:0;overflow:hidden;text-overflow:ellipsis}
.etlist .btnrow{flex:none;gap:4px;margin:0}
.etlist .ic{width:36px!important;height:36px!important}
.etlist .ic.danger{color:var(--dont,#c0392b)}
.etlist .etren{width:100%;min-height:40px;margin-bottom:8px}
.etman .row{display:flex;gap:8px}
.etman .row input{flex:1;min-width:0;min-height:40px}

/* v15: + Add song, Zing panel = linking, sort "Added" line */
.addsongbtn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:0 14px;white-space:nowrap;flex:none}
.addsongbtn .i{width:18px;height:18px}
.sadded{font-size:12px;color:var(--muted);margin-top:2px}
#markList li.flash{animation:khflash 1.6s ease-out 1}
@keyframes khflash{0%{box-shadow:0 0 0 3px var(--gold)}100%{box-shadow:0 0 0 0 transparent}}
.zres .zacts{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:8px;padding-inline-start:0}
.zres .zacts .zlink{display:inline-flex;align-items:center;gap:5px;min-height:36px;padding:0 12px;border:1px solid var(--line2);border-radius:999px;font-size:13px;font-weight:600;color:var(--ink);text-decoration:none;background:#fff}
.zres .zacts .zlink .i{width:15px;height:15px}
.zres .zacts .primary{display:inline-flex;align-items:center;gap:5px;min-height:36px;padding:0 14px;font-size:13px}
.zres .zacts .primary .i{width:15px;height:15px}
.zres .zacts .add.ghostsm{display:inline-flex;align-items:center;gap:4px;min-height:36px;padding:0 10px;font-size:12.5px;font-weight:500;background:transparent;border:0;color:var(--muted);text-decoration:underline;text-underline-offset:2px;box-shadow:none;width:auto}
.zres .zacts .add.ghostsm[disabled]{text-decoration:none;opacity:.8}
.zres .zacts .add.ghostsm .i{width:14px;height:14px}
.zstarget{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:8px 0;padding:8px 10px;border:1px solid var(--gold);border-radius:10px;background:var(--hl);font-size:13.5px}
.zstarget[hidden]{display:none}
.zstarget .i{width:15px;height:15px;vertical-align:-2px;margin-inline-end:4px}
.zstarget .ghost{min-height:36px;flex:none}
.zsman{margin:14px 0 6px}
.zsman .linkbtn{min-height:36px}
.evsheet.addsong,.evsheet.linkto{z-index:60}
.asdup{margin:-4px 0 10px;padding:8px 10px;border-radius:10px;background:#fff4dc;border:1px solid #f0d394;font-size:13px;color:#6b4a12}
.asdup[hidden]{display:none}
.asdup .i{width:15px;height:15px;vertical-align:-2px;margin-inline-end:4px}
.aszrow{display:flex;gap:8px}
.aszrow input{flex:1;min-width:0;min-height:40px}
.aszrow .ghost{display:inline-flex;align-items:center;gap:5px;flex:none;min-height:40px;white-space:nowrap}
.aszrow .ghost .i{width:16px;height:16px}
.asznote{margin:6px 0 0;min-height:0}
.asznote:empty{display:none}
.asznote .i{width:14px;height:14px;vertical-align:-2px;color:var(--well,#2e9e5b);margin-inline-end:3px}
#evSheet select#asType{width:100%;min-height:40px}
.lkfrom{margin:0 0 8px}
.lkfrom .i{width:14px;height:14px;vertical-align:-2px;margin-inline-end:4px}
.lklist .pkb{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px}
.lktag{flex:none;font-size:11.5px;color:var(--muted);border:1px solid var(--line2);border-radius:999px;padding:2px 8px;display:inline-flex;align-items:center;gap:3px}
.lktag.on{color:var(--well,#2e9e5b);border-color:currentColor}
.lktag .i{width:12px;height:12px}
#evSheet .addsong .btnrow .primary .i,#evSheet .btnrow .primary .i{width:16px;height:16px;vertical-align:-3px;margin-inline-end:4px}

body:not(#_v15a):not(#_v15b) #v-mark .bar{grid-template-columns:minmax(0,1fr) auto auto}
body:not(#_v15a):not(#_v15b) #v-mark .bar>.searchform{grid-column:1/2}
body:not(#_v15a):not(#_v15b) #v-mark .bar>#addSongBtn{grid-column:2/3;width:auto}
body:not(#_v15a):not(#_v15b) #v-mark .bar>#zingBtn{grid-column:3/4;max-width:40vw;display:inline-flex;align-items:center;gap:5px}
@media (max-width:520px){ #zingBtn .zsw{display:none} #v-mark .addsongbtn{padding:0 12px} }
@media (min-width:900px){ body:not(#_v15a):not(#_v15b) #v-mark .bar>#zingBtn{display:none} }

body:not(#_v15a) #v-mark .bar>#addSongBtn{min-height:42px;height:42px;font-size:14px;padding:0 11px;gap:4px;border-radius:var(--r-sm,10px)}
body:not(#_v15a) #v-mark .bar>#addSongBtn .i{width:16px;height:16px}
@media (max-width:520px){ body:not(#_v15a) #v-mark .bar>#zingBtn{padding:8px 10px} body:not(#_v15a) #v-mark .bar input#markSearch{padding-left:10px;padding-right:8px} }

.zres .zacts .zaddnew{display:inline-flex;align-items:center;gap:4px;min-height:36px;padding:0 10px;font-size:12.5px;font-weight:500;background:transparent;border:1px dashed var(--line2);border-radius:999px;color:var(--muted)}
.zres .zacts .zaddnew[disabled]{border-style:solid;opacity:.75}
.zres .zacts .zaddnew .i{width:14px;height:14px}

.lklist .pkt{display:flex;flex-direction:column;align-items:flex-start;text-align:start;min-width:0;gap:1px}
.lklist .pkt small{color:var(--muted);font-size:12px}

/* v16: source logos + any-link */
.slogo{width:18px;height:18px;flex:none;border-radius:4px;object-fit:contain;vertical-align:-4px;margin-inline-end:5px;background:#fff}
.zing .slogo{width:18px;height:18px;margin-inline-end:5px}
.zing{display:inline-flex;align-items:center;gap:0;max-width:150px;white-space:nowrap}
.zing .zsn{overflow:hidden;text-overflow:ellipsis}
.zing.src-link,.zing.src-spotify,.zing.src-youtube,.zing.src-drive,.zing.src-apple,.zing.src-soundcloud{color:#3d4f63;background:#eef2f6}
.zing.src-oitzer{color:#5b3b9c;background:#f1ecfa}
.zing .i{width:16px;height:16px}
.zsrcsw{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 10px}
.zsrcsw .chip,.zsrcrow .chip{display:inline-flex;align-items:center;min-height:38px}
.zsrcrow{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}
.asfind{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.srcbtn{display:inline-flex;align-items:center;min-height:40px}
.asznote .slogo{margin-inline-end:6px}
#zingBtn .zsph{display:none}
@media (max-width:520px){ #zingBtn .zsph{display:inline} }

/* ================= v17: left filter panel, Song list sections, the song menu ================= */
body:not(#_v17a):not(#_v17b):not(#_v17c) .fside{display:flex;flex-direction:column;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 12px 16px;box-shadow:var(--shadow)}
body:not(#_v17a):not(#_v17b):not(#_v17c) .fshead{display:flex;align-items:center;justify-content:space-between;gap:8px}
body:not(#_v17a):not(#_v17b):not(#_v17c) .fshead h3{margin:0;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
body:not(#_v17a):not(#_v17b):not(#_v17c) .fsclose{width:32px;height:32px;min-height:32px;display:grid;place-items:center;border-radius:8px;border:0;background:transparent;color:var(--muted);padding:0}
body:not(#_v17a):not(#_v17b):not(#_v17c) .fsclose:hover{background:var(--hl);color:var(--ink)}
body:not(#_v17a):not(#_v17b):not(#_v17c) .fsgrp{display:flex;flex-direction:column;gap:6px}
body:not(#_v17a):not(#_v17b):not(#_v17c) .fsgrp .clabel,body:not(#_v17a):not(#_v17b):not(#_v17c) .fside .chips .clabel{display:block;min-width:0;margin:0 0 2px;font-size:10.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
body:not(#_v17a):not(#_v17b):not(#_v17c) .fside .chips.fcol{display:flex;flex-direction:column;align-items:stretch;flex-wrap:nowrap;gap:3px;overflow:visible;margin:0;padding:0}
body:not(#_v17a):not(#_v17b):not(#_v17c) .fside .chips.fcol button{width:100%;text-align:left;justify-content:flex-start;border-radius:8px;border:1px solid transparent;background:transparent;color:var(--ink);font-size:13.5px;font-weight:500;padding:7px 10px;min-height:34px;box-shadow:none}
body:not(#_v17a):not(#_v17b):not(#_v17c) .fside .chips.fcol button:hover{background:var(--card2);border-color:var(--line)}
body:not(#_v17a):not(#_v17b):not(#_v17c) .fside .chips.fcol button.on{background:var(--hl);border-color:color-mix(in srgb,var(--gold) 55%,transparent);color:var(--gold2);font-weight:600}
body:not(#_v17a):not(#_v17b):not(#_v17c) .fside .slsel.fsel{width:100%;flex:none}
body:not(#_v17a):not(#_v17b):not(#_v17c) .fside .slsel.fsel select{width:100%}
body:not(#_v17a):not(#_v17b):not(#_v17c) .fsclear{align-self:flex-start;font-size:13px}
body:not(#_v17a):not(#_v17b):not(#_v17c) .fsbtn{display:inline-flex;align-items:center;gap:6px;flex:none;border:1px solid var(--line2,var(--line));border-radius:10px;padding:0 11px;min-height:38px;background:var(--card);color:var(--muted);font:inherit;font-size:13.5px;font-weight:500;cursor:pointer}
body:not(#_v17a):not(#_v17b):not(#_v17c) .fsbtn .i{width:17px;height:17px}
body:not(#_v17a):not(#_v17b):not(#_v17c) .fsbtn:hover{color:var(--ink)}
body:not(#_v17a):not(#_v17b):not(#_v17c) .fsbtn.on{border-color:color-mix(in srgb,var(--gold) 60%,transparent);color:var(--gold2);background:var(--hl)}
body:not(#_v17a):not(#_v17b):not(#_v17c) .fscount{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--gold);color:var(--ongold,#fff);font-size:11px;font-weight:700;line-height:1}
body:not(#_v17a):not(#_v17b):not(#_v17c) .fscount[hidden]{display:none}
body:not(#_v17a):not(#_v17b):not(#_v17c) .fscrim{position:fixed;inset:0;z-index:44;background:rgba(40,28,18,.38)}
@media (max-width:899.98px){
  body:not(#_v17a):not(#_v17b):not(#_v17c) .fside{position:fixed;top:0;left:0;bottom:0;z-index:45;width:min(300px,86vw);border-radius:0 16px 16px 0;border-left:0;overflow:auto;overscroll-behavior:contain;padding-top:calc(14px + env(safe-area-inset-top));padding-bottom:calc(18px + env(safe-area-inset-bottom));transform:translateX(-105%);visibility:hidden;transition:transform .22s ease,visibility 0s linear .22s;box-shadow:var(--shadow-lg)}
  body:not(#_v17a):not(#_v17b):not(#_v17c) .fside.open{transform:none;visibility:visible;transition:transform .22s ease}
  body:not(#_v17a):not(#_v17b):not(#_v17c) .fside .chips.fcol button{min-height:40px;font-size:14.5px}
  body.fsopen{overflow:hidden}
}
@media (min-width:900px){
  body:not(#_v17a):not(#_v17b):not(#_v17c) .slwrap{grid-template-columns:minmax(0,1fr) 360px}
  body:not(#_v17a):not(#_v17b):not(#_v17c) .slwrap.fs-on{grid-template-columns:210px minmax(0,1fr) 340px}
  body:not(#_v17a):not(#_v17b):not(#_v17c) .slwrap:not(.fs-on) .fside{display:none}
  body:not(#_v17a):not(#_v17b):not(#_v17c) .fside{position:sticky;top:calc(var(--toph,62px) + env(safe-area-inset-top) + 58px);max-height:calc(100vh - var(--toph,62px) - 74px);overflow:auto;overscroll-behavior:contain}
  body:not(#_v17a):not(#_v17b):not(#_v17c) .fsclose{display:grid}
  body:not(#_v17a):not(#_v17b):not(#_v17c) .fscrim{display:none!important}
}
@media (prefers-reduced-motion:reduce){ body:not(#_v17a):not(#_v17b):not(#_v17c) .fside{transition:none!important} }
@media print{ body:not(#_v17a):not(#_v17b):not(#_v17c) .fside,body:not(#_v17a):not(#_v17b):not(#_v17c) .fscrim,body:not(#_v17a):not(#_v17b):not(#_v17c) .fsbtn,body:not(#_v17a):not(#_v17b):not(#_v17c) .smore,body:not(#_v17a):not(#_v17b):not(#_v17c) .slsecgo{display:none!important} }

/* sections */
body:not(#_v17a):not(#_v17b):not(#_v17c) #markList .slsec{grid-column:1/-1;list-style:none;display:flex;align-items:center;gap:6px;margin:18px 0 4px;padding:0;border:0;border-bottom:1px solid var(--line2);background:transparent;box-shadow:none}
body:not(#_v17a):not(#_v17b):not(#_v17c) #markList .slsec:first-child{margin-top:2px}
body:not(#_v17a):not(#_v17b):not(#_v17c) #markList .slsech{flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:8px;border:0;background:transparent;padding:10px 2px 9px;text-align:left;color:var(--ink);font:inherit;cursor:pointer;min-height:44px}
body:not(#_v17a):not(#_v17b):not(#_v17c) #markList .slsech .chev{width:16px;height:16px;flex:none;color:var(--muted);transition:transform .15s}
body:not(#_v17a):not(#_v17b):not(#_v17c) #markList .slsec:not(.open) .slsech .chev{transform:rotate(-90deg)}
body:not(#_v17a):not(#_v17b):not(#_v17c) #markList .slsech .sname{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:1px}
body:not(#_v17a):not(#_v17b):not(#_v17c) #markList .slsech .sname bdi{font-size:16px;font-weight:650;letter-spacing:-.005em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body:not(#_v17a):not(#_v17b):not(#_v17c) #markList .slsech .sname small{font-size:12px;font-weight:400;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body:not(#_v17a):not(#_v17b):not(#_v17c) #markList .slsech .scount{flex:none;font-size:12px;font-weight:600;color:var(--gold2);background:var(--palegold,var(--hl));border:1px solid var(--palegold-line,var(--line));border-radius:999px;padding:2px 9px;white-space:nowrap}
body:not(#_v17a):not(#_v17b):not(#_v17c) #markList .slsech .scount span{font-weight:400;color:var(--muted)}
body:not(#_v17a):not(#_v17b):not(#_v17c) #markList .slsec.actsec .slsech .sname bdi{color:var(--gold2)}
body:not(#_v17a):not(#_v17b):not(#_v17c) #markList .slsecgo{flex:none;display:inline-flex;align-items:center;gap:2px;border:0;background:transparent;color:var(--muted);font:inherit;font-size:12.5px;padding:6px 4px;cursor:pointer;white-space:nowrap}
body:not(#_v17a):not(#_v17b):not(#_v17c) #markList .slsecgo .i{width:14px;height:14px}
body:not(#_v17a):not(#_v17b):not(#_v17c) #markList .slsecgo:hover{color:var(--gold2)}
body:not(#_v17a):not(#_v17b):not(#_v17c) #markList .secempty{grid-column:1/-1;list-style:none;font-size:13.5px;color:var(--muted);padding:12px 4px 6px;background:transparent;border:0;box-shadow:none;text-align:left}
body:not(#_v17a):not(#_v17b):not(#_v17c) #markList .sghead{padding-top:10px}

/* row: Active tag and the menu button */
body:not(#_v17a):not(#_v17b):not(#_v17c) .abadge{display:inline-block;font-size:10.5px;font-weight:600;letter-spacing:.04em;color:var(--gold2);background:var(--palegold,var(--hl));border:1px solid var(--palegold-line,var(--line2));border-radius:999px;padding:0 7px;margin-inline-end:4px;line-height:17px;vertical-align:1px}
body:not(#_v17a):not(#_v17b):not(#_v17c) .smore{flex:none;width:34px;height:34px;min-height:34px;display:inline-grid;place-items:center;padding:0;border:0;border-radius:9px;background:transparent;color:var(--muted);cursor:pointer;margin-inline-start:2px}
body:not(#_v17a):not(#_v17b):not(#_v17c) .smore .i{width:18px;height:18px;fill:currentColor;stroke:none}
body:not(#_v17a):not(#_v17b):not(#_v17c) .smore:hover,body:not(#_v17a):not(#_v17b):not(#_v17c) .smore[aria-expanded="true"]{background:var(--hl);color:var(--ink)}
body:not(#_v17a):not(#_v17b):not(#_v17c) #markList.v-compact .smore{width:30px;height:30px;min-height:30px}

/* the menu */
body:not(#_v17a):not(#_v17b):not(#_v17c) .smenu{position:fixed;z-index:70;min-width:224px;max-width:min(300px,calc(100vw - 16px));background:var(--card);color:var(--ink);border:1px solid var(--line2);border-radius:12px;box-shadow:var(--shadow-lg);padding:5px}
body:not(#_v17a):not(#_v17b):not(#_v17c) .smenu .smt{font-size:12px;color:var(--muted);padding:6px 10px 7px;margin-bottom:3px;border-bottom:1px solid var(--line);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body:not(#_v17a):not(#_v17b):not(#_v17c) .smenu .smi{display:flex;align-items:center;gap:10px;width:100%;min-height:40px;padding:8px 10px;border:0;border-radius:8px;background:transparent;color:var(--ink);font:inherit;font-size:14.5px;font-weight:500;text-align:left;cursor:pointer}
body:not(#_v17a):not(#_v17b):not(#_v17c) .smenu .smi .i{width:18px;height:18px;flex:none;color:var(--muted)}
body:not(#_v17a):not(#_v17b):not(#_v17c) .smenu .smi span{flex:1;display:flex;align-items:baseline;gap:8px}
body:not(#_v17a):not(#_v17b):not(#_v17c) .smenu .smi small{margin-inline-start:auto;font-size:11.5px;font-weight:400;color:var(--muted)}
body:not(#_v17a):not(#_v17b):not(#_v17c) .smenu .smi:hover,body:not(#_v17a):not(#_v17b):not(#_v17c) .smenu .smi:focus-visible{background:var(--hl);outline:none}
body:not(#_v17a):not(#_v17b):not(#_v17c) .smenu .smi.danger,body:not(#_v17a):not(#_v17b):not(#_v17c) .smenu .smi.danger .i{color:var(--dont-t,#b03030)}
body:not(#_v17a):not(#_v17b):not(#_v17c) .smenu .smsep{height:1px;background:var(--line);margin:4px 6px}

/* Add to event sheet */
body:not(#_v17a):not(#_v17b):not(#_v17c) .aelist{display:flex;flex-direction:column;gap:8px}
body:not(#_v17a):not(#_v17b):not(#_v17c) .aeitem{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;padding:12px 12px;border:1px solid var(--line2);border-radius:12px;background:var(--card);color:var(--ink);font:inherit;text-align:left;cursor:pointer}
body:not(#_v17a):not(#_v17b):not(#_v17c) .aeitem:hover{border-color:var(--gold)}
body:not(#_v17a):not(#_v17b):not(#_v17c) .aeitem .aen{display:flex;flex-direction:column;gap:2px;min-width:0}
body:not(#_v17a):not(#_v17b):not(#_v17c) .aeitem .aen bdi{font-weight:600;font-size:15px}
body:not(#_v17a):not(#_v17b):not(#_v17c) .aeitem .aen small{color:var(--muted);font-size:12.5px}
body:not(#_v17a):not(#_v17b):not(#_v17c) .aeitem .aes{flex:none;display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:600;color:var(--gold2);border:1px solid color-mix(in srgb,var(--gold) 55%,transparent);border-radius:999px;padding:4px 11px}
body:not(#_v17a):not(#_v17b):not(#_v17c) .aeitem .aes .i{width:14px;height:14px}
body:not(#_v17a):not(#_v17b):not(#_v17c) .aeitem.has{cursor:default;opacity:.75}
body:not(#_v17a):not(#_v17b):not(#_v17c) .aeitem.has .aes{color:var(--well-t,#1f7444);border-color:transparent}

/* Activity: Restore on a delete line */
body:not(#_v17a):not(#_v17b):not(#_v17c) .restorebtn{display:inline-flex;align-items:center;gap:4px;margin-inline-start:6px;padding:2px 9px;min-height:26px;font-size:12.5px;border-radius:999px;vertical-align:1px}
body:not(#_v17a):not(#_v17b):not(#_v17c) .restorebtn .i{width:13px;height:13px}

body:not(#_v17a):not(#_v17b):not(#_v17c) .fsgrp .clabel,body:not(#_v17a):not(#_v17b):not(#_v17c) .fside .chips .clabel{text-align:left;align-self:flex-start}
@media (max-width:520px){ body:not(#_v17a):not(#_v17b):not(#_v17c) #markList .slsecgo .sgo-t{display:none} body:not(#_v17a):not(#_v17b):not(#_v17c) #markList .slsecgo{padding:8px 6px} body:not(#_v17a):not(#_v17b):not(#_v17c) #markList .slsecgo .i{width:18px;height:18px} }

/* ================= What's New: welcome card + tour (whatsnew.js) ================= */
body.wn-lock{overflow:hidden}
.wn-scrim{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(40,28,18,.5)}
.wn-card{width:100%;max-width:420px;max-height:calc(100vh - 32px);overflow:auto;background:var(--card,#fff);color:var(--ink,#3b2a1e);border:1px solid var(--line,#ecdfca);border-radius:18px;padding:22px 20px 18px;box-shadow:0 18px 44px rgba(0,0,0,.28);animation:wnIn .22s ease-out}
.wn-badge{display:inline-block;padding:3px 10px;border-radius:999px;background:var(--gold,#c9952c);color:var(--ongold,#2a1c12);font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.wn-card h2{margin:10px 0 12px;font-size:22px;line-height:1.25}
.wn-list{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:10px}
.wn-list li{display:flex;gap:10px;align-items:flex-start;font-size:15px;line-height:1.4;color:var(--ink,#3b2a1e)}
.wn-ic{flex:none;width:30px;height:30px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--gold,#c9952c) 18%,transparent);color:var(--gold2,#8f620f)}
.wn-ic svg,.wn-arrow svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.wn-btns{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.wn-btns button,.wn-tbtns button{-webkit-appearance:none;appearance:none;min-height:44px;padding:0 16px;border-radius:12px;font:inherit;font-size:15px;font-weight:600;cursor:pointer}
.wn-no,.wn-skip,.wn-back{background:transparent;color:var(--ink,#3b2a1e);border:1px solid var(--line2,#dcc8a6)}
.wn-yes,.wn-next{background:var(--gold,#c9952c);color:var(--ongold,#2a1c12);border:1px solid var(--gold,#c9952c)}
.wn-tour{position:fixed;inset:0;z-index:200;pointer-events:none}
.wn-block{position:fixed;inset:0;pointer-events:auto}
.wn-ring{position:fixed;border-radius:14px;box-shadow:0 0 0 3px var(--gold,#c9952c),0 0 0 9999px rgba(40,28,18,.55);animation:wnRing 1.2s ease-in-out infinite;transition:all .25s ease;pointer-events:none}
.wn-arrow{position:fixed;width:36px;height:40px;display:flex;align-items:center;justify-content:center;color:var(--gold,#c9952c);animation:wnBlink 1s ease-in-out infinite;transition:left .25s ease,top .25s ease;pointer-events:none}
.wn-arrow svg{width:36px;height:36px;stroke-width:3;filter:drop-shadow(0 2px 3px rgba(0,0,0,.35))}
.wn-arrow.up svg{transform:rotate(180deg)}
.wn-tip{position:fixed;pointer-events:auto;background:var(--card,#fff);color:var(--ink,#3b2a1e);border:1px solid var(--line,#ecdfca);border-radius:16px;padding:14px 14px 12px;box-shadow:0 16px 40px rgba(0,0,0,.3);transition:left .25s ease,top .25s ease}
.wn-step{font-size:12px;font-weight:700;color:var(--gold2,#8f620f);letter-spacing:.03em;text-transform:uppercase}
.wn-tip h3{margin:4px 0 4px;font-size:18px}
.wn-tip p{margin:0 0 12px;font-size:15px;line-height:1.45;color:var(--muted,#6f5a46)}
.wn-tbtns{display:flex;gap:8px;align-items:center}
.wn-tbtns span{flex:1}
.wn-tbtns button{min-height:40px;padding:0 14px;font-size:14px}
.wn-foot{-webkit-appearance:none;appearance:none;background:none;border:0;padding:0;font:inherit;color:inherit;text-decoration:underline;cursor:pointer}
@keyframes wnBlink{0%,100%{opacity:1;transform:translateY(0)}50%{opacity:.25;transform:translateY(6px)}}
@keyframes wnRing{0%,100%{box-shadow:0 0 0 3px var(--gold,#c9952c),0 0 0 9999px rgba(40,28,18,.55)}50%{box-shadow:0 0 0 7px color-mix(in srgb,var(--gold,#c9952c) 55%,transparent),0 0 0 9999px rgba(40,28,18,.55)}}
@keyframes wnIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.wn-arrow,.wn-ring,.wn-card{animation:none}}
/* a long event name must not stretch the list wider than a phone (the heading shrinks and cuts the name with …) */
body:not(#_v17a):not(#_v17b):not(#_v17c) #markList > li.slsec{min-width:0}
.wn-footline{text-align:center;padding:0 16px calc(24px + env(safe-area-inset-bottom));font-size:13px;color:var(--muted,#6f5a46)}

/* ================= v18: Chat (chat.js) — Friedco's team chat, in the Kehulu look ================= */
#tabs [data-view=chat]{position:relative}
.kc-tabbadge{display:inline-block;min-width:18px;height:18px;margin-inline-start:6px;padding:0 5px;border-radius:9px;background:var(--terra,#a3461f);color:#fff;font-size:11px;font-weight:700;line-height:18px;text-align:center;vertical-align:1px}
.kc-tabbadge[hidden]{display:none}
body:not(#_v18a):not(#_v18b):not(#_v18c) #v-chat{padding-bottom:0}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-wrap{display:grid;grid-template-columns:300px minmax(0,1fr);gap:14px;height:calc(100dvh - var(--toph,62px) - 118px);min-height:440px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-side,body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-thread{background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);min-height:0;display:flex;flex-direction:column;overflow:hidden}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-sidehead{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 12px 10px 16px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--gold,#c9952c) 10%,var(--card))}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-sidehead h2{margin:0;font-size:22px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-newbtn{-webkit-appearance:none;appearance:none;display:inline-flex;align-items:center;gap:5px;min-height:36px;padding:0 12px;border-radius:10px;border:1px solid var(--gold,#c9952c);background:var(--gold,#c9952c);color:var(--ongold,#2a1c12);font:inherit;font-size:14px;font-weight:600;cursor:pointer}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-newbtn .i{width:15px;height:15px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-newbtn[aria-expanded=true]{background:transparent;color:var(--ink)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-new{padding:10px 12px 12px;border-bottom:1px solid var(--line);background:var(--card2,var(--card));max-height:50%;overflow:auto}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-new[hidden]{display:none}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-newh{margin:2px 0 6px;font-size:12.5px;font-weight:600;color:var(--muted)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-people{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-person{-webkit-appearance:none;appearance:none;display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 10px 0 4px;border-radius:999px;border:1px solid var(--line2,var(--line));background:var(--card);color:var(--ink);font:inherit;font-size:13.5px;cursor:pointer}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-newform{display:flex;gap:6px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-newform input{flex:1;min-width:0;min-height:38px;border:1px solid var(--line2,var(--line));border-radius:10px;padding:0 10px;font:inherit;font-size:15px;background:var(--card);color:var(--ink)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-go{-webkit-appearance:none;appearance:none;min-height:38px;padding:0 14px;border-radius:10px;border:0;background:var(--gold,#c9952c);color:var(--ongold,#2a1c12);font:inherit;font-weight:600;cursor:pointer}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-list{list-style:none;margin:0;padding:6px;overflow:auto;flex:1;min-height:0}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-list li{list-style:none;margin:0;padding:0}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-conv{-webkit-appearance:none;appearance:none;width:100%;display:flex;align-items:center;gap:10px;padding:9px 10px;border:0;border-radius:12px;background:transparent;color:var(--ink);font:inherit;text-align:start;cursor:pointer;box-shadow:none;min-height:58px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-conv:hover{background:color-mix(in srgb,var(--gold,#c9952c) 8%,transparent)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-conv.on{background:color-mix(in srgb,var(--gold,#c9952c) 18%,transparent)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-cmain{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-cname{font-weight:600;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-cprev{font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-conv.unread .kc-cname,body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-conv.unread .kc-cprev{color:var(--ink);font-weight:700}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-cside{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:4px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-cwhen{font-size:11.5px;color:var(--muted);white-space:nowrap}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-unread{min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--gold,#c9952c);color:var(--ongold,#2a1c12);font-size:11.5px;line-height:20px;text-align:center}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-unread.men{background:var(--terra,#a3461f);color:#fff}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-hash{flex:none;width:38px;height:38px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--gold,#c9952c) 16%,transparent);color:var(--gold2,#8f620f)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-hash .i{width:18px;height:18px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-av{flex:none;width:34px;height:34px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:#fff;font-size:13px;font-weight:700;letter-spacing:.02em}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-av.sm{width:28px;height:28px;font-size:11px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-conv .kc-av.sm{width:38px;height:38px;font-size:13px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-av.ghost{background:transparent!important}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-empty{padding:16px;color:var(--muted);font-size:14px;text-align:center}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-pick{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:24px;text-align:center;color:var(--muted)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-pickic .i{width:40px;height:40px;color:var(--gold,#c9952c)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-thead{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--gold,#c9952c) 10%,var(--card))}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-ttl{flex:1;min-width:0;display:flex;flex-direction:column}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-ttl b{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-ttl small{font-size:12px;color:var(--muted)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-back{display:none}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-iconbtn,body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-back{-webkit-appearance:none;appearance:none;width:38px;height:38px;min-height:38px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--muted);align-items:center;justify-content:center;cursor:pointer;box-shadow:none}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-iconbtn{display:inline-flex}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-iconbtn .i,body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-back .i{width:18px;height:18px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-msgs{flex:1;min-height:0;overflow:auto;padding:10px 14px 14px;background:var(--card2,var(--card));overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-day{display:flex;align-items:center;gap:10px;margin:14px 0 8px;color:var(--muted);font-size:12px;font-weight:600}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-day::before,body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-day::after{content:"";flex:1;height:1px;background:var(--line)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-none{padding:30px 10px;text-align:center;color:var(--muted)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-older{text-align:center;margin:4px 0 8px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-older button{-webkit-appearance:none;appearance:none;border:1px solid var(--line2,var(--line));background:var(--card);color:var(--ink);border-radius:999px;min-height:32px;padding:0 14px;font:inherit;font-size:13px;cursor:pointer}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-msg{display:flex;align-items:flex-end;gap:8px;margin-top:10px;max-width:100%}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-msg.join{margin-top:3px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-msg.mine{justify-content:flex-end}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-bub{position:relative;max-width:min(78%,560px);padding:7px 11px 5px;border-radius:16px 16px 16px 5px;background:var(--card);border:1px solid var(--line);box-shadow:0 1px 1px rgba(92,60,25,.05);min-width:0}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-msg.mine .kc-bub{border-radius:16px 16px 5px 16px;background:color-mix(in srgb,var(--gold,#c9952c) 20%,var(--card));border-color:color-mix(in srgb,var(--gold,#c9952c) 35%,var(--line))}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-who{display:block;font-size:12.5px;margin-bottom:1px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-txt{font-size:15px;line-height:1.42;white-space:normal;overflow-wrap:anywhere;color:var(--ink)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-txt a{color:var(--gold2,#8f620f);text-decoration:underline}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-msg.gone .kc-txt{color:var(--muted)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-men{font-weight:600;color:var(--gold2,#8f620f)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-men.kc-mine{background:color-mix(in srgb,var(--gold,#c9952c) 28%,transparent);border-radius:5px;padding:0 3px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-time{display:block;text-align:end;font-size:11px;color:var(--muted);margin-top:1px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-quote{border-inline-start:3px solid var(--gold,#c9952c);padding:3px 8px;margin:2px 0 4px;background:color-mix(in srgb,var(--gold,#c9952c) 8%,transparent);border-radius:6px;font-size:13px;display:flex;flex-direction:column}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-quote span{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-acts{display:none;gap:4px;margin-top:4px;flex-wrap:wrap}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-msg.show .kc-acts{display:flex}
@media (hover:hover){ body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-msg:hover .kc-acts{display:flex} }
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-acts button{-webkit-appearance:none;appearance:none;display:inline-flex;align-items:center;gap:4px;min-height:28px;padding:0 8px;border-radius:8px;border:1px solid var(--line2,var(--line));background:var(--card);color:var(--muted);font:inherit;font-size:12.5px;cursor:pointer}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-acts button .i{width:13px;height:13px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-acts button.del{color:var(--dont,#a33a3a)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-mention{display:flex;flex-wrap:wrap;gap:6px;padding:8px 12px 0;border-top:1px solid var(--line);background:var(--card)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-mention[hidden]{display:none}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-mention button{-webkit-appearance:none;appearance:none;display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:0 10px 0 3px;border-radius:999px;border:1px solid var(--line2,var(--line));background:var(--card);color:var(--ink);font:inherit;font-size:13.5px;cursor:pointer}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-mention button.on{border-color:var(--gold,#c9952c);background:color-mix(in srgb,var(--gold,#c9952c) 14%,transparent)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-composer{padding:10px 12px calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--card)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-composer.busy{opacity:.6}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-ctx{display:flex;align-items:center;gap:6px;justify-content:space-between;margin:0 0 8px;padding:4px 4px 4px 10px;border-radius:10px;background:color-mix(in srgb,var(--gold,#c9952c) 10%,transparent);font-size:13px;color:var(--muted)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-ctx[hidden]{display:none}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-ctx>span{display:flex;align-items:center;gap:6px;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-ctx .i{width:14px;height:14px;flex:none}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-crow{display:flex;align-items:flex-end;gap:8px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-crow textarea{flex:1;min-width:0;resize:none;min-height:42px;max-height:140px;border:1px solid var(--line2,var(--line));border-radius:14px;padding:10px 12px;font:inherit;font-size:16px;line-height:1.35;background:var(--card2,var(--card));color:var(--ink)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-crow textarea:focus{outline:2px solid var(--gold,#c9952c);outline-offset:0}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-send{-webkit-appearance:none;appearance:none;flex:none;width:44px;height:44px;min-height:44px;padding:0;border-radius:50%;border:0;background:var(--gold,#c9952c);color:var(--ongold,#2a1c12);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-send .i{width:19px;height:19px}
@media (max-width:759.98px){
  body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-wrap{grid-template-columns:minmax(0,1fr);height:calc(100dvh - var(--toph,62px) - 104px)}
  body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-wrap .kc-thread{display:none}
  body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-wrap.kc-in .kc-side{display:none}
  body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-wrap.kc-in .kc-thread{display:flex}
  body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-back{display:inline-flex}
  body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-bub{max-width:84%}
}

/* ================= v19: Formatted chat messages — the Friedco OS toolbar, in the Kehulu look ================= */
/* The message box is a formatted box now (div#kcText, contenteditable) in place of the textarea. */
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-edit{flex:1;min-width:0;min-height:42px;max-height:160px;overflow-y:auto;border:1px solid var(--line2,var(--line));border-radius:14px;padding:10px 12px;font-size:16px;line-height:1.35;background:var(--card2,var(--card));color:var(--ink);outline:none;overflow-wrap:anywhere;white-space:pre-wrap;-webkit-user-select:text;user-select:text}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-edit:focus{outline:2px solid var(--gold,#c9952c);outline-offset:0}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-edit.rt-empty::before{content:attr(data-placeholder);color:var(--muted);pointer-events:none}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-edit ul,body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-edit ol,
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-txt.rt-shown ul,body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-txt.rt-shown ol{margin:3px 0;padding-inline-start:22px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-edit blockquote,body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-txt.rt-shown blockquote{margin:3px 0;padding-inline-start:10px;border-inline-start:3px solid var(--line2,var(--line));color:var(--muted)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-edit p,body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-txt.rt-shown p{margin:0 0 5px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-txt.rt-shown > :last-child{margin-bottom:0}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-txt.rt-shown a{text-decoration:underline}
/* the toolbar */
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-rtwrap{margin:0 0 6px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .rt-bar{display:flex;flex-wrap:wrap;align-items:center;gap:2px;padding:3px 4px;border:1px solid var(--line);border-radius:10px;background:var(--card2,var(--bg))}
body:not(#_v18a):not(#_v18b):not(#_v18c) .rt-btn{-webkit-appearance:none;appearance:none;min-width:30px;height:30px;min-height:30px;padding:0 6px;border:0;border-radius:7px;background:none;color:var(--ink);font-size:14px;line-height:30px;cursor:pointer}
body:not(#_v18a):not(#_v18b):not(#_v18c) .rt-btn:hover{background:color-mix(in srgb,var(--ink) 8%,transparent)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .rt-btn.is-on{background:color-mix(in srgb,var(--gold,#c9952c) 25%,var(--card));color:var(--ink)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .rt-sep{width:1px;height:18px;background:var(--line);margin:0 3px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .rt-size{width:auto;height:30px;padding:0 4px;margin:0;font-size:13px;border-radius:7px;border:1px solid var(--line);background:var(--card);color:var(--ink)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .rt-a{font-weight:700;border-bottom:3px solid #c0392b;line-height:1}
body:not(#_v18a):not(#_v18b):not(#_v18c) .rt-mark{background:#fff3b0;color:#16202c;padding:0 2px;border-radius:2px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .rt-pop-wrap{position:relative;display:inline-flex}
/* the colour swatches open UPWARD — the toolbar sits at the very bottom of the screen */
body:not(#_v18a):not(#_v18b):not(#_v18c) .rt-pop{position:absolute;z-index:30;bottom:36px;left:0;display:grid;grid-template-columns:repeat(6,26px);gap:5px;padding:7px;background:var(--card);border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 20px rgba(0,0,0,.18)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .rt-pop[hidden]{display:none}
body:not(#_v18a):not(#_v18b):not(#_v18c) .rt-sw{width:26px;height:26px;min-height:26px;border-radius:6px;border:1px solid rgba(0,0,0,.18);cursor:pointer;padding:0}
body:not(#_v18a):not(#_v18b):not(#_v18c) .rt-sw-none{background:linear-gradient(135deg,#fff 45%,#c0392b 45%,#c0392b 55%,#fff 55%)!important}
/* the Aa button on a phone, beside the message box */
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-aa{-webkit-appearance:none;appearance:none;flex:none;width:40px;height:44px;min-height:44px;padding:0;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--ink);font-size:15px;font-weight:700;font-family:Georgia,"Times New Roman",serif;cursor:pointer}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-aa.on{background:color-mix(in srgb,var(--gold,#c9952c) 25%,var(--card));border-color:var(--gold,#c9952c)}

/* ================= v20: WhatsApp-style ticks, who is on, renaming ================= */
/* ticks on his own messages: grey ✓ sent, grey ✓✓ delivered, blue ✓✓ read */
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-tick{display:inline-flex;vertical-align:-3px;margin-inline-start:2px;color:var(--muted)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-tick .i{width:16px;height:16px;stroke-width:2.2}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-tick.read{color:#34a6dd}
/* "Info": who has read / received it */
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-info{margin-top:6px;padding:7px 9px;border-radius:10px;background:var(--card);border:1px solid var(--line);font-size:13px;line-height:1.4;color:var(--ink)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-irow{display:flex;gap:5px;align-items:baseline;flex-wrap:wrap}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-irow + .kc-irow{margin-top:3px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-irow b{font-weight:600}
/* someone who is on: a green dot on their picture, green words under the name */
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-avwrap{position:relative;display:inline-flex;flex:none}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-dot{position:absolute;right:-1px;bottom:-1px;width:11px;height:11px;border-radius:50%;background:#2fb344;border:2px solid var(--card)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-on{color:#1f9a3a;font-weight:600}
/* renaming in place */
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-renameform{display:flex;align-items:center;gap:4px}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-renameform input{flex:1;min-width:0;padding:7px 10px;font-size:16px;border-radius:9px;border:1px solid var(--gold,#c9952c);background:var(--card);color:var(--ink)}
body:not(#_v18a):not(#_v18b):not(#_v18c) .kc-iconbtn.ok{color:#1f9a3a}

/* ================= v21: Rehearsed Songs ================= */
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .abadge.rbadge{color:var(--sage-ink,#3d5a35);background:var(--sage,#f0f5ec);border-color:var(--sage-line,#d3e1cb)}
/* ================= v21: chat — a message's ⋯ menu, swipe to reply, conversation pictures ================= */
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-acts{display:none!important}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-bub{padding-inline-end:30px}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-mmore{-webkit-appearance:none;appearance:none;position:absolute;top:3px;inset-inline-end:3px;width:26px;height:22px;min-height:22px;padding:0;border:0;border-radius:8px;background:transparent;color:var(--muted);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;opacity:.55;box-shadow:none}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-mmore .i{width:16px;height:16px}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-mmore:hover,body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-mmore[aria-expanded=true]{opacity:1;background:color-mix(in srgb,var(--gold,#c9952c) 16%,transparent);color:var(--ink)}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-menu{position:fixed;z-index:70;min-width:190px;padding:5px;background:var(--card);border:1px solid var(--line2,var(--line));border-radius:12px;box-shadow:var(--shadow-lg,0 12px 32px rgba(0,0,0,.2))}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-menu button{-webkit-appearance:none;appearance:none;width:100%;display:flex;align-items:center;justify-content:flex-start;gap:10px;min-height:40px;padding:0 10px;border:0;border-radius:8px;background:transparent;color:var(--ink);font:inherit;font-size:14.5px;text-align:start;cursor:pointer;box-shadow:none}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-menu button .i{width:16px;height:16px;color:var(--muted);flex:none}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-menu button:hover,body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-menu button:focus-visible{background:color-mix(in srgb,var(--gold,#c9952c) 14%,transparent);outline:none}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-menu button.del,body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-menu button.del .i{color:var(--dont,#a33a3a)}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-bub.kc-swiping{box-shadow:0 0 0 2px var(--gold,#c9952c)}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-pic{flex:none;width:38px;height:38px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;color:#fff}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-pic svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-pic img{width:100%;height:100%;object-fit:cover;display:block}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-pic.big,body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-hash.big{width:40px;height:40px}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-picbtn{-webkit-appearance:none;appearance:none;position:relative;flex:none;padding:0;border:0;background:transparent;border-radius:12px;cursor:pointer;line-height:0;box-shadow:none}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-picedit{position:absolute;right:-4px;bottom:-4px;width:20px;height:20px;border-radius:50%;background:var(--card);border:1px solid var(--line2,var(--line));display:flex;align-items:center;justify-content:center;color:var(--ink)}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-picedit .i{width:12px;height:12px}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-picbox{position:fixed;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(40,28,18,.45)}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-piccard{width:100%;max-width:380px;max-height:calc(100dvh - 32px);overflow:auto;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:12px 14px 16px;box-shadow:var(--shadow-lg,0 14px 36px rgba(0,0,0,.25))}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-pichead{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-pichead b{font-size:16px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-picup,body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-picoff{-webkit-appearance:none;appearance:none;width:100%;display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;border-radius:12px;font:inherit;font-size:15px;font-weight:600;cursor:pointer}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-picup{border:1px solid var(--gold,#c9952c);background:var(--gold,#c9952c);color:var(--ongold,#2a1c12)}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-picoff{margin-top:12px;border:1px solid var(--line2,var(--line));background:transparent;color:var(--dont,#a33a3a)}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-picup .i,body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-picoff .i{width:18px;height:18px}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-picgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:8px}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-picopt{-webkit-appearance:none;appearance:none;padding:4px;border:2px solid transparent;border-radius:14px;background:transparent;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:none}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-picopt.on{border-color:var(--gold,#c9952c)}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .kc-picopt .kc-pic{width:44px;height:44px}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .lgerr{color:var(--dont,#a33a3a);min-height:1.2em;margin:2px 0 0}
body:not(#_v21a):not(#_v21b):not(#_v21c):not(#_v21d) .acctout{margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}