/* אופק (ברירת המחדל, OFL — fonts/OFL-OfekSans.txt), 7 משקלים */
@font-face{font-family:"Ofek Sans";src:url(fonts/ofek-200.woff2) format("woff2");font-weight:200;font-display:swap}
@font-face{font-family:"Ofek Sans";src:url(fonts/ofek-300.woff2) format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"Ofek Sans";src:url(fonts/ofek-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Ofek Sans";src:url(fonts/ofek-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Ofek Sans";src:url(fonts/ofek-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Ofek Sans";src:url(fonts/ofek-700.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Ofek Sans";src:url(fonts/ofek-800.woff2) format("woff2");font-weight:800;font-display:swap}@font-face{font-family:"Ofek Sans";src:url(fonts/ofek-900.woff2) format("woff2");font-weight:900;font-display:swap}
/* Assistant משתנה: כל המשקלים מ-200 (דק) עד 800 (שחור) בשני קבצים קטנים */
@font-face{font-family:Assistant;src:url(fonts/assistant_var_heb.woff2) format("woff2");font-weight:200 800;font-display:swap;unicode-range:U+0307-0308,U+0590-05FF,U+200C-2010,U+20AA,U+25CC,U+FB1D-FB4F}
@font-face{font-family:Assistant;src:url(fonts/assistant_var_lat.woff2) format("woff2");font-weight:200 800;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* פלטת "רגועה" של האפליקציה (כחול-נייבי) */
:root{
  --frame:#E6ECF2;--bg:#F7F8FA;--card:#FFFFFF;--raise:#EEF2F6;--hover:#E4EAF1;--press:#D9E1EA;
  --text:#0F172A;--muted:#556274;--faint:#8592A3;--line:#D6DEE7;
  --primary:#0B6AA8;--onPrimary:#FFFFFF;--primarySoft:#D6EAF7;--accent:#E58A2A;--accentSoft:#FDEBCB;--sec:#00809F;--ok:#3F7A3A;--warm:#B8661A;--warmSoft:#FDEBCB;
  --solid:#0F172A;--onSolid:#FFFFFF;
  --shadow:0 1px 2px #0000000f,0 8px 24px #0000000f;
  --c1:#1E88C8;--c2:#0B4C7A;
  --on-cover:#fff;--on-cover-hover:#ffffff1f;--on-cover-track:#ffffff40;
  --sh-1:0 2px 8px #00000024;--sh-2:0 8px 24px #0000002e;--sh-3:0 12px 40px #0006;--sh-fab:0 8px 16px #0000004d;--scrim:#0009;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;
  --gutter:16px;
  --f-body:"Ofek Sans",Assistant,system-ui,"Segoe UI",sans-serif;--f-meta:"Ofek Sans",Assistant,system-ui,sans-serif;
  --t-display:clamp(32px,8.5vw,42px);--t-h2:24px;--t-h3:19px;--t-title:17px;--t-card:16px;--t-meta:14px;--t-btn:16px;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --frame:#060D17;--bg:#0A1320;--card:#101C2C;--raise:#172638;--hover:#1F3147;--press:#283C57;
    --text:#E7EEF6;--muted:#9AA9BB;--faint:#6C7C90;--line:#26374D;
    --primary:#7CC4F0;--onPrimary:#00304F;--primarySoft:#0F3B5C;--accent:#F5B85A;--accentSoft:#3A2A12;--sec:#4FC3DA;
    --solid:#EAF1F8;--onSolid:#0A1320;
    --shadow:0 1px 2px #0008,0 10px 30px #0006;
    --sh-1:0 2px 8px #0006;--sh-2:0 8px 24px #0008;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --frame:#060D17;--bg:#0A1320;--card:#101C2C;--raise:#172638;--hover:#1F3147;--press:#283C57;
    --text:#E7EEF6;--muted:#9AA9BB;--faint:#6C7C90;--line:#26374D;
    --primary:#7CC4F0;--onPrimary:#00304F;--primarySoft:#0F3B5C;--accent:#F5B85A;--accentSoft:#3A2A12;--sec:#4FC3DA;
    --solid:#EAF1F8;--onSolid:#0A1320;--shadow:0 1px 2px #0008,0 10px 30px #0006;--sh-1:0 2px 8px #0006;--sh-2:0 8px 24px #0008;color-scheme:dark;
}

*{box-sizing:border-box}
html,body{height:100%}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--frame);color:var(--text);font:400 17px/1.45 var(--f-body);
  -webkit-font-smoothing:antialiased;overflow:hidden;overscroll-behavior:none}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent;text-align:inherit}
svg{display:block;fill:currentColor}
:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:8px}
.row:focus-visible,.qk:focus-visible,.s-item:focus-visible{outline-offset:-2px}
.player :focus-visible{outline-color:var(--on-cover)}
@media (min-width:1000px){.player :focus-visible{outline-color:var(--primary)}}
input.seek:focus-visible{outline:0}
small,.meta,.pill,.chip,.times,.toast,.sheet-state,.count,.col,.lhead,.np-sub,.tabs a,.sec a,.sort,.more{font-family:var(--f-meta)}
[hidden]{display:none!important}

/* ============ מבנה ============ */
.app{height:100vh;height:100dvh;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto auto;grid-template-areas:"view" "player" "tabs"}
.side{display:none}
.view{grid-area:view;position:relative;scroll-padding-top:72px;overflow-y:auto;overflow-x:hidden;background:var(--bg);outline:none;overscroll-behavior:contain;scrollbar-width:thin}
.player{grid-area:player}
.tabs{grid-area:tabs}

@media (min-width:1000px){
  .app{grid-template-columns:300px minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;grid-template-areas:"side view" "player player";gap:8px;padding:8px 8px 0}
  .side{grid-area:side;display:flex;flex-direction:column;gap:8px;min-height:0}
  .panel{background:var(--bg);border-radius:12px}
  .view{border-radius:12px}
  .tabs{display:none}
}

/* ---- סרגל צד (מחשב) ---- */
.nav{padding:12px 8px}
.brand{display:flex;align-items:center;gap:var(--s3);padding:var(--s2) 12px var(--s4);font-weight:700;font-size:var(--t-h3);line-height:1.25}
.brand img{border-radius:9px}
.nav-a{display:flex;align-items:center;gap:var(--s4);padding:10px 12px;border-radius:8px;font-weight:700;font-size:var(--t-title);line-height:1.3;color:var(--muted);transition:color .15s}
.nav-a svg{width:26px;height:26px}
.nav-a:hover,.nav-a.on{color:var(--text)}
.lib{flex:1;min-height:0;display:flex;flex-direction:column;padding:8px}
.lib header a{display:flex;align-items:center;gap:14px;padding:8px 12px 12px;font-weight:700;color:var(--muted)}
.lib header a:hover,.lib header a.on{color:var(--text)}
.lib header svg{width:26px;height:26px}
.side-list{overflow-y:auto;flex:1;scrollbar-width:thin}
.s-item{display:flex;align-items:center;gap:12px;padding:8px;border-radius:8px;transition:background .15s}
.s-item:hover{background:var(--hover)}
.s-item:active{background:var(--press)}
.s-item.on{background:var(--raise)}
.s-item .cv{width:48px;height:48px;box-shadow:none}
.s-item b{display:block;font-weight:700;font-size:var(--t-card);line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.s-item small{display:block;color:var(--muted);font-size:var(--t-meta);line-height:1.35}
.s-item.now b{color:var(--accent)}
.s-item>span:last-child{min-width:0;flex:1}

/* ---- סרגל עליון בתוך התצוגה ---- */
.topbar{position:sticky;top:0;z-index:15;display:flex;align-items:center;gap:var(--s3);padding:var(--s2) var(--gutter);height:calc(56px + var(--st));margin-bottom:calc(-56px - var(--st));
  padding-top:calc(var(--s2) + var(--st));transition:background .25s;pointer-events:none}
.topbar>*{pointer-events:auto}
.tb-title{pointer-events:none}
.topbar.solid{background:var(--tb,var(--raise));box-shadow:0 1px 0 var(--line)}
.tb-nav{display:none;gap:8px}
.tb-title{flex:1;min-width:0;font-weight:700;font-size:var(--t-h3);line-height:1.3;opacity:0;transition:opacity .2s;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.topbar.solid .tb-title{opacity:1}
.topbar .tb-search{display:none}
@media (min-width:1000px){
  .tb-nav{display:flex}
  .topbar .tb-search{display:flex;flex:0 1 380px}
}
.ic.round{width:40px;height:40px;/* cm-fallback */background:var(--frame);background:color-mix(in srgb,var(--frame) 70%,transparent)}
.ic.round:hover{/* cm-fallback */background:var(--frame);background:color-mix(in srgb,var(--frame) 85%,transparent)}
.ic.round svg{width:22px;height:22px}
.ic.round:disabled{opacity:.4;cursor:default}

/* ---- חיפוש ---- */
.search{display:flex;align-items:center;gap:10px;background:var(--raise);border-radius:999px;padding:0 16px;height:48px;
  border:1px solid transparent;transition:background .2s,border-color .2s}
.search:hover{background:var(--hover)}
.search:focus-within{box-shadow:0 0 0 1px var(--primary)}
.search:focus-within{border-color:var(--primary);background:var(--card)}
.search svg{width:22px;height:22px;color:var(--muted);flex:none}
.search input{flex:1;min-width:0;border:0;background:none;color:var(--text);font:500 var(--t-title)/1.3 var(--f-body);outline:none;height:100%}
.search input::placeholder{color:var(--faint);font-weight:400}
.search input::-webkit-search-cancel-button{filter:grayscale(1);opacity:.6;cursor:pointer}
.page-search{margin:0 0 var(--s5)}
@media (min-width:1000px){.page-search{display:none}}

/* ============ עמודים ============ */
#page{position:relative;padding:calc(var(--s5) + var(--st)) var(--gutter) calc(var(--s6) + env(safe-area-inset-bottom));min-height:100%}
@media (min-width:1000px){:root{--gutter:24px}#page{padding:80px var(--gutter) 40px}.topbar{height:64px;margin-bottom:-64px;padding:var(--s3) var(--gutter)}}
.wash{position:absolute;inset:0 0 auto 0;height:420px;background:linear-gradient(180deg,var(--wash,transparent),transparent);pointer-events:none;z-index:0}
.page-in{position:relative;z-index:1;animation:fade .25s ease both}
@keyframes fade{from{opacity:0;transform:translateY(4px)}}
h1.h{font-size:var(--t-display);font-weight:700;letter-spacing:-.01em;line-height:1.2;margin:0 0 var(--s4)}
.sec{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);margin:var(--s6) 0 var(--s2);min-height:40px}
.sec h2{margin:0;font-size:var(--t-h2);font-weight:700;letter-spacing:-.005em;line-height:1.25}
.sec a,.sec .count{font:500 14px/1.3 var(--f-meta);color:var(--muted);white-space:nowrap;display:inline-flex;align-items:center;min-height:40px;padding-inline-start:var(--s3)}
.sec a:hover{color:var(--text);text-decoration:underline}
.sec a:active{color:var(--primary)}
.sec:first-child{margin-top:0}
.sub{color:var(--muted);margin:calc(-1*var(--s2)) 0 var(--s5);font:400 15px/1.4 var(--f-meta)}

/* ---- עטיפה (כמו באפליקציה) ---- */
.cv{position:relative;flex:none;border-radius:18%;overflow:hidden;background:var(--raise);box-shadow:var(--sh-1);display:block}
.cv svg{width:100%;height:100%}
.cv.round{border-radius:50%}
.cv text{font-family:var(--f-body);font-weight:800}

/* ---- כפתור ניגון צף (כמו בספוטיפיי) ---- */
.fab{position:absolute;inset-inline-end:8px;bottom:8px;width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--sec));color:var(--onPrimary);
  display:grid;place-items:center;box-shadow:var(--sh-fab);opacity:0;transform:translateY(8px);transition:opacity .2s,transform .2s}
.fab svg{width:24px;height:24px}
.fab:hover{transform:scale(1.05)}
.fab:active{transform:scale(.96)}
.card:hover .fab,.card:focus-within .fab,.fab.on{opacity:1;transform:none}
@media (hover:none){.fab{display:none}}

/* ---- גישה מהירה ---- */
.quick{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s2)}
@media (min-width:760px){.quick{grid-template-columns:repeat(4,minmax(0,1fr))}}
.qk{position:relative;display:flex;align-items:center;gap:10px;height:56px;border-radius:8px;overflow:hidden;
  /* cm-fallback */
  background:transparent;
  background:color-mix(in srgb,var(--text) 7%,transparent);transition:background .15s;padding-inline-end:var(--s2)}
.qk:hover{/* cm-fallback */background:transparent;background:color-mix(in srgb,var(--text) 13%,transparent)}
.qk:active{/* cm-fallback */background:transparent;background:color-mix(in srgb,var(--text) 18%,transparent)}
.qk .cv{width:56px;height:56px;border-radius:0;box-shadow:none}
.qk b{flex:1;min-width:0;font-weight:700;font-size:14px;line-height:1.3;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.qk .heard{position:absolute;bottom:0;inset-inline:56px 0;height:3px;/* cm-fallback */background:transparent;background:color-mix(in srgb,var(--text) 14%,transparent)}
.qk .heard i{display:block;height:100%;background:var(--accent)}

/* ---- מדפים ---- */
.shelf{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(140px,40vw,188px);gap:var(--s1);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:6px;
  margin:0 calc(-1*var(--gutter));padding:0 6px 6px;scrollbar-width:none;overscroll-behavior-x:contain}
.shelf::-webkit-scrollbar{display:none}
@media (min-width:1000px){.shelf{padding:0 14px 6px;scroll-padding-inline:14px}}
.card{position:relative;display:block;padding:10px;border-radius:10px;transition:background .2s;scroll-snap-align:start;min-width:0;cursor:pointer}
.card:hover{background:var(--hover)}
.card:active{background:var(--press)}
.card .art{position:relative;margin-bottom:var(--s3)}
.card .cv{width:100%;aspect-ratio:1;height:auto;box-shadow:var(--sh-2)}
.card b{font-weight:700;font-size:var(--t-card);line-height:1.35;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.card small{display:block;color:var(--muted);font-size:var(--t-meta);line-height:1.35;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card.now b{color:var(--accent)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--s1);margin:0 -10px}

/* ---- עיון לפי סדרה ---- */
.browse{display:grid;grid-template-columns:repeat(auto-fill,minmax(158px,1fr));gap:var(--s3)}
.tile{position:relative;height:104px;border-radius:10px;overflow:hidden;padding:var(--s4);color:var(--on-cover);font-weight:700;font-size:var(--t-h3);line-height:1.25;
  transition:transform .15s;isolation:isolate}
.tile:hover{transform:scale(1.02)}
.tile small{display:block;font:500 12px/1.35 var(--f-meta);opacity:.9;margin-top:var(--s1)}
.tile:active{transform:scale(.98)}
.tile .cv{position:absolute;width:74px;height:74px;inset-inline-start:-8px;bottom:-10px;transform:rotate(25deg);box-shadow:none;z-index:-1}

/* ---- כותרת עמוד רב (כמו עמוד אמן) ---- */
.head{display:flex;align-items:flex-end;gap:var(--s5);padding:var(--s2) 0 var(--s4)}
.head .cv{width:clamp(132px,22vw,232px);height:clamp(132px,22vw,232px);box-shadow:var(--sh-3)}
.head small{font:500 14px/1.3 var(--f-meta);color:var(--muted)}
.head h1{margin:var(--s1) 0 var(--s2);font-size:clamp(32px,7vw,60px);font-weight:700;letter-spacing:-.02em;line-height:1.12;text-wrap:balance}
.head p{margin:0;font:400 15px/1.45 var(--f-meta);color:var(--muted)}
.head p b{color:var(--text);font-weight:500}
@media (max-width:640px){.head{flex-direction:column;align-items:flex-start;gap:var(--s4)}.head .cv{align-self:center;width:176px;height:176px}}
.acts-row{display:flex;align-items:center;gap:var(--s3);padding:var(--s1) 0 var(--s4)}
.bigplay{width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--sec));color:var(--onPrimary);display:grid;place-items:center;box-shadow:var(--sh-fab);transition:transform .15s}
.bigplay:hover{transform:scale(1.05)}
.bigplay:active{transform:scale(.95)}
.bigplay svg{width:28px;height:28px}
.acts-row .ic{color:var(--muted)}
.acts-row .ic:hover{color:var(--text)}
.chips{display:flex;gap:var(--s2);overflow-x:auto;margin:0 calc(-1*var(--gutter)) var(--s3);padding:0 var(--gutter) 2px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 var(--s4);border-radius:999px;background:var(--raise);font-size:14px;line-height:1.3;white-space:nowrap;transition:background .15s}
.chip:active{background:var(--press)}
.chip:hover{background:var(--hover)}
.chip.on{background:var(--text);color:var(--bg);font-weight:700}
.chip span{opacity:.6}
.sort{margin-inline-start:auto;font:400 14px/1.3 var(--f-meta);color:var(--muted);display:flex;align-items:center;gap:6px;height:40px;padding:0 var(--s3);border-radius:999px}
.sort:active{background:var(--press)}
.sort:hover{color:var(--text);background:var(--hover)}
.sort svg{width:18px;height:18px}

/* ---- רשימת שיעורים ---- */
.list{display:flex;flex-direction:column}
.row{position:relative;display:grid;grid-template-columns:48px minmax(0,1fr) 40px;align-items:center;gap:var(--s3);padding:var(--s2);margin:0 -8px;
  border-radius:8px;transition:background .12s;cursor:pointer;-webkit-user-select:none;user-select:none}
.row:hover{background:var(--hover)}
.row:active{background:var(--press)}
.row .idx,.row .col,.row .acts,.lhead{display:none}
.row .lead{display:contents}
.row .cv{width:48px;height:48px;border-radius:6px;box-shadow:none}
.row .body{min-width:0}
.row .t{display:block;font-weight:500;font-size:var(--t-title);line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row.now .t{color:var(--accent);font-weight:800}
.row.now{/* cm-fallback */background:transparent;background:color-mix(in srgb,var(--primary) 9%,transparent)}
.row.now:hover{/* cm-fallback */background:transparent;background:color-mix(in srgb,var(--primary) 14%,transparent)}
.row .meta{display:flex;align-items:center;gap:0 6px;color:var(--muted);font-size:var(--t-meta);line-height:1.4;margin-top:2px;white-space:nowrap;overflow:hidden}
.row .meta>span{overflow:hidden;text-overflow:ellipsis;flex:none}
.row .meta>span+span::before{content:"·";color:var(--faint);margin:0 6px}
.row .meta>.r,.row .meta>.s{flex:0 1 auto;min-width:4.5em}
.row .meta>.s{flex-shrink:2}
.row .ok{display:inline-flex;align-items:center;gap:3px;color:var(--ok)}
.row .ok svg{width:14px;height:14px}
.row .more-b{width:40px;height:40px;color:var(--muted)}
.row .heard{position:absolute;bottom:2px;inset-inline:68px 60px;height:2px;border-radius:2px;background:var(--line);overflow:hidden}
.row .heard i{display:block;height:100%;background:var(--accent)}
.row.focus{animation:flash 1.6s ease 2}
@keyframes flash{50%{/* cm-fallback */background:transparent;background:color-mix(in srgb,var(--primary) 18%,transparent)}}
.more{display:block;margin:var(--s4) auto 0;min-height:40px;padding:0 var(--s5);border-radius:999px;border:1px solid var(--line);font:500 14px/1.3 var(--f-meta);color:var(--muted)}
.more:active{background:var(--press)}
.more:hover{color:var(--text);border-color:var(--text)}

@media (min-width:1000px){
  .list{--cols:40px minmax(0,1.6fr) minmax(0,1fr) 112px 72px 116px}
  .list.norabbi{--cols:40px minmax(0,2fr) 112px 72px 116px}
  .row,.lhead{display:grid;grid-template-columns:var(--cols);gap:var(--s4);margin:0 -16px;padding:6px 16px}
  .lhead{border-bottom:1px solid var(--line);margin-bottom:var(--s2);padding-bottom:var(--s2);font-size:var(--t-meta);font-weight:500;color:var(--muted)}
  .lhead span:nth-last-child(2){text-align:end}
  .row .idx{display:grid;place-items:center;width:40px;height:40px;color:var(--muted);font:400 15px var(--f-meta);font-variant-numeric:tabular-nums}
  .row .idx .pl{display:none;width:20px;height:20px;color:var(--text)}
  .row:hover .idx .n,.row:hover .idx .bar-eq{display:none}
  .row:hover .idx .pl{display:block}
  .row .lead{display:flex;align-items:center;gap:12px;min-width:0}
  .row .cv{width:40px;height:40px;border-radius:4px}
  .row .meta .mo,.list:not(.norabbi):not(.compact) .row .meta .r{display:none}
  .list.compact{--cols:40px minmax(0,1fr) 72px 116px}
  .list.compact .row .col:not(.c-len){display:none}
  .list.compact .lhead{display:none}
  .row .col{display:block;font-size:14px;line-height:1.4;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .row a.col:hover{color:var(--text);text-decoration:underline}
  .row .c-len{text-align:end;font-variant-numeric:tabular-nums}
  .row .more-b{display:none}
  .row .acts{display:flex;justify-content:flex-end;gap:2px;opacity:0;transition:opacity .12s}
  .row:hover .acts,.row:focus-within .acts{opacity:1}
  .row .acts .ic{width:36px;height:36px;color:var(--muted)}
  .row .acts .ic:hover{color:var(--text)}
  .row .acts svg{width:20px;height:20px}
  .row .heard{inset-inline:124px auto;width:min(30%,260px);bottom:4px}
}

/* ---- גלי שמע מנגנים ---- */
.bar-eq{display:inline-flex;align-items:flex-end;gap:2px;width:14px;height:14px;color:var(--accent)}
.bar-eq i{flex:1;background:currentColor;border-radius:1px;height:30%;animation:eq .9s ease-in-out infinite}
.bar-eq i:nth-child(2){animation-delay:-.35s}.bar-eq i:nth-child(3){animation-delay:-.6s}
.bar-eq.paused i{animation:none;height:40%}
@keyframes eq{0%,100%{height:25%}50%{height:100%}}

/* ---- כפתורים ---- */
.ic{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;flex:none;transition:background .15s,color .15s,transform .1s}
.ic:hover{background:var(--hover)}
.ic:active{background:var(--press)}
.ic:active{transform:scale(.92)}
.ic svg{width:24px;height:24px}
.ic.lg{width:56px;height:56px}
.ic.lg svg{width:36px;height:36px}
.pp{width:36px;height:36px;border-radius:50%;background:var(--solid);color:var(--onSolid);display:grid;place-items:center;transition:transform .12s;flex:none}
.pp:hover{transform:scale(1.06)}
.pp:active{transform:scale(.94)}
.pp svg{transition:transform .15s}
.pp svg{width:20px;height:20px}
.pp.big{width:72px;height:72px}
.pp.big svg{width:34px;height:34px}
.pill{height:40px;min-width:48px;padding:0 var(--s3);border-radius:999px;font-size:14px;line-height:1.3;font-weight:500;color:var(--muted);display:inline-flex;align-items:center;justify-content:center;gap:4px;
  font-variant-numeric:tabular-nums;transition:background .15s,color .15s;white-space:nowrap}
.pill:hover{background:var(--hover);color:var(--text)}
.pill:active{background:var(--press)}
.pill.on{color:var(--primary)}
.pill svg{width:20px;height:20px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:48px;padding:0 var(--s5);border-radius:999px;background:var(--primary);color:var(--onPrimary);font-weight:700;font-size:var(--t-btn);line-height:1.3}
.btn:hover{filter:brightness(1.08)}
.btn:active{filter:brightness(.94)}

/* ---- פס התקדמות ---- */
input.seek{-webkit-appearance:none;appearance:none;width:100%;height:16px;background:transparent;margin:0;cursor:pointer;--p:0%}
input.seek::-webkit-slider-runnable-track{height:4px;border-radius:4px;/* cm-fallback */background:linear-gradient(90deg,var(--sk,var(--text)) var(--p),transparent var(--p));background:linear-gradient(90deg,var(--sk,var(--text)) var(--p),color-mix(in srgb,var(--text) 18%,transparent) var(--p))}
input.seek::-moz-range-track{height:4px;border-radius:4px;/* cm-fallback */background:transparent;background:color-mix(in srgb,var(--text) 18%,transparent)}
input.seek::-moz-range-progress{height:4px;border-radius:4px;background:var(--sk,var(--text))}
input.seek::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;border-radius:50%;background:var(--text);margin-top:-4px;border:0;opacity:0;transition:opacity .15s}
input.seek::-moz-range-thumb{width:12px;height:12px;border-radius:50%;background:var(--text);border:0;opacity:0}
input.seek:hover,input.seek:focus-visible{--sk:var(--primary)}
input.seek:hover::-webkit-slider-thumb,input.seek:active::-webkit-slider-thumb,input.seek:focus-visible::-webkit-slider-thumb{opacity:1}
input.seek:hover::-moz-range-thumb{opacity:1}

/* ============ נגן ============ */
/* טלפון: כרטיס צף מעל הלשוניות, בצבע העטיפה (כמו בספוטיפיי) */
.player{position:relative;margin:0 var(--s2) var(--s1);display:flex;align-items:center;gap:var(--s2);padding:var(--s2);border-radius:12px;
  /* cm-fallback */
  background:var(--c2);
  background:color-mix(in srgb,var(--c1) 48%,var(--c2));color:var(--on-cover);box-shadow:var(--sh-2);animation:up .3s ease both;z-index:20}
@keyframes up{from{opacity:0}}
.np{flex:1;min-width:0;display:flex;align-items:center;gap:var(--s3)}
.np-cover{flex:none}
.np-cover .cv{width:42px;height:42px;border-radius:6px;box-shadow:none}
.np-txt{min-width:0;flex:1}
.np-title{display:block;max-width:100%;font-weight:700;font-size:14px;line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.np-sub{display:block;font-size:12px;line-height:1.35;opacity:.85;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.np-sub:hover{text-decoration:underline}
.ctl-btns{display:flex;align-items:center;gap:2px}
.player .ic{color:inherit}
.player .ic:hover{background:var(--on-cover-hover)}
.player .pp{background:transparent;color:var(--on-cover);width:44px;height:44px}
.player .pp svg{width:28px;height:28px}
.ctl-seek,.extra,#pFwd{display:none}
.mini-prog{position:absolute;bottom:0;inset-inline:var(--s3);height:2px;border-radius:2px;background:var(--on-cover-track);overflow:hidden}
.mini-prog i{display:block;height:100%;width:0;background:var(--on-cover)}

@media (min-width:1000px){
  .player{margin:0 -8px;border-radius:0;background:var(--frame);color:var(--text);box-shadow:none;height:84px;padding:0 var(--s4);display:grid;
    grid-template-columns:minmax(180px,30%) minmax(0,40%) minmax(180px,30%);gap:var(--s2);animation:none}
  .np-cover .cv{width:56px;height:56px;border-radius:6px}
  .np-title{font-size:var(--t-card)}
  .np-sub{font-size:var(--t-meta)}
  .np-title:hover{text-decoration:underline}
  .np-sub{color:var(--muted);opacity:1}
  .ctl{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:0}
  .ctl-btns{gap:16px}
  .player .ic{color:var(--muted)}
  .player .ic:hover{color:var(--text);background:none}
  #pFwd{display:grid}
  .player .pp{width:34px;height:34px;background:var(--solid);color:var(--onSolid)}
  .player .pp svg{width:18px;height:18px}
  .ctl-seek{display:flex;align-items:center;gap:8px;width:100%;max-width:620px;font:400 12px/1 var(--f-meta);color:var(--muted);font-variant-numeric:tabular-nums}
  .ctl-seek span{min-width:42px;text-align:center}
  .extra{display:flex;align-items:center;justify-content:flex-end;gap:2px}
  .extra .ic{width:40px;height:40px}
  .extra .pill{height:32px}
  .extra .ic svg{width:20px;height:20px}
  .mini-prog{display:none}
}

/* ---- לשוניות (טלפון) ---- */
.tabs{display:flex;justify-content:space-around;padding:var(--s1) 0 calc(var(--s1) + env(safe-area-inset-bottom));box-shadow:0 -1px 0 var(--line);background:var(--frame);position:relative;z-index:10}
.tabs a{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;font:500 11px/1.2 var(--f-meta);color:var(--muted);padding:var(--s2) 0;min-height:52px;justify-content:center;transition:color .15s}
.tabs svg{width:25px;height:25px;transition:transform .1s}
.tabs a.on{color:var(--primary)}
.tabs a:active svg{transform:scale(.9)}
@media (min-width:1000px){.app .tabs{display:none}}

/* ---- נגן מלא ---- */
.sheet{position:fixed;inset:0;z-index:40;background:var(--bg);overflow-y:auto;overscroll-behavior:contain;animation:sheetIn .32s cubic-bezier(.2,.8,.2,1) both}
@keyframes sheetIn{from{transform:translateY(100%)}}
.sheet.closing{animation:sheetOut .22s ease-in both}
@keyframes sheetOut{to{transform:translateY(100%)}}
.sheet-bg{position:fixed;inset:0;/* cm-fallback */background:linear-gradient(180deg,var(--bg) 0%,var(--bg) 48%,var(--bg) 88%);background:linear-gradient(180deg,color-mix(in srgb,var(--c1) 48%,var(--bg)) 0%,color-mix(in srgb,var(--c2) 28%,var(--bg)) 48%,var(--bg) 88%);pointer-events:none}
.sheet-in{position:relative;max-width:480px;margin:0 auto;min-height:100%;display:flex;flex-direction:column;
  padding:calc(var(--s2) + var(--st)) var(--s5) calc(var(--s5) + env(safe-area-inset-bottom));will-change:transform}
.sheet-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.sheet-from{text-align:center;min-width:0;flex:1;line-height:1.35}
.sheet-from small{display:block;font-size:12px;color:var(--text);opacity:.72}
.sheet-from b{display:block;font-weight:700;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sheet-cover{display:grid;place-items:center;margin:var(--s4) 0 var(--s5)}
.sheet-cover .cv{width:min(84vw,400px,44vh);height:min(84vw,400px,44vh);border-radius:12px;box-shadow:var(--sh-3);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.sheet.paused .sheet-cover .cv{transform:scale(.93)}
.sheet-meta{display:flex;align-items:center;gap:var(--s3)}
.sheet-meta>div{flex:1;min-width:0}
.sheet-meta h2{margin:0;font-size:24px;font-weight:700;letter-spacing:-.005em;line-height:1.2}
.sheet-meta a{display:inline-block;margin-top:var(--s1);color:var(--text);opacity:.75;font-size:var(--t-title);line-height:1.35}
.sheet-meta a:hover{color:var(--text);text-decoration:underline}
.sheet-seek{margin-top:var(--s4)}
.sheet-seek input.seek::-webkit-slider-thumb{opacity:1}
.sheet-seek input.seek::-moz-range-thumb{opacity:1}
.times{display:flex;justify-content:space-between;font-size:12px;line-height:1.3;color:var(--text);opacity:.75;margin-top:var(--s1);font-variant-numeric:tabular-nums}
.sheet-ctl{display:flex;align-items:center;justify-content:space-between;margin-top:var(--s2)}
.sheet-ctl .pill{min-width:56px;color:var(--text)}
.sheet-ctl .pill.on{color:var(--primary)}
.sheet-state{min-height:20px;color:var(--text);opacity:.75;font-size:var(--t-meta);line-height:1.5;margin:var(--s2) 0 0;text-align:center}
.sheet-state a{color:var(--primary);text-decoration:underline}
.sheet-next{margin-top:var(--s4);/* cm-fallback */background:var(--card);background:color-mix(in srgb,var(--card) 82%,transparent);border-radius:16px;padding:var(--s4) var(--s3) var(--s2)}
.sheet-next:empty{display:none}
.sheet-next h3{margin:0 0 var(--s2) var(--s2);margin-inline:var(--s2);font-size:var(--t-title);line-height:1.3;font-weight:700}
.sheet-next .row{margin:0;padding:var(--s2);grid-template-columns:48px minmax(0,1fr)}
.sheet-next .row .more-b,.sheet-next .row .acts,.sheet-next .row .col,.sheet-next .row .idx{display:none}
.sheet-next .row .lead{display:contents}
.sheet-next .row .cv{width:48px;height:48px}
.sheet-next .row .meta .mo{display:inline}
@media (min-width:1000px){.sheet-in{padding-top:28px}}

/* ---- תפריט פעולות ---- */
.menu{position:fixed;inset:0;z-index:50;background:var(--scrim);display:flex;align-items:flex-end;justify-content:center;animation:fadeIn .15s both}
@keyframes fadeIn{from{opacity:0}}
.menu-in{width:100%;max-width:520px;background:var(--card);border-radius:18px 18px 0 0;padding:var(--s2) var(--s2) calc(var(--s3) + env(safe-area-inset-bottom));animation:up .22s ease both}
.menu-head{display:flex;align-items:center;gap:var(--s3);padding:var(--s3);border-bottom:1px solid var(--line);margin-bottom:var(--s2)}
.menu-head>div{min-width:0}
.menu-head .cv{width:48px;height:48px;border-radius:6px;box-shadow:none}
.menu-head b{display:block;font-weight:700;line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.menu-head small{display:block;color:var(--muted);font-size:var(--t-meta);line-height:1.35}
.menu-in>button,.menu-in>a{transition:background .15s;display:flex;width:100%;align-items:center;gap:var(--s4);min-height:48px;padding:0 var(--s3);border-radius:10px;font-weight:500;font-size:var(--t-title);line-height:1.3}
.menu-in>button:active,.menu-in>a:active{background:var(--press)}
.menu-in>button:hover,.menu-in>a:hover{background:var(--hover)}
.menu-in>button svg,.menu-in>a svg{width:24px;height:24px;color:var(--muted)}
@media (min-width:1000px){.menu{align-items:center}.menu-in{border-radius:16px;max-width:380px}}

/* ---- מצבים ---- */
.empty{text-align:center;padding:72px var(--s4);color:var(--muted);font-size:15px;line-height:1.5}
.empty b{display:block;font-size:var(--t-h2);line-height:1.25;color:var(--text);font-weight:700;margin-bottom:var(--s2)}
.empty .btn{margin-top:var(--s5)}
.sk-h{height:36px;width:200px;margin:0 0 var(--s4)}
.sk-sec{height:26px;width:160px;margin:var(--s6) 0 var(--s3)}
.sk-q{height:56px;border-radius:8px}
.sk-art{aspect-ratio:1;border-radius:18%}
.sk-line{height:14px;margin-top:var(--s3);width:80%}
.sk-line.s{height:12px;width:55%;margin-top:var(--s2)}
.sk-row{display:grid;grid-template-columns:48px 1fr;gap:var(--s3);padding:var(--s2) 0;align-items:center}
.sk-row .skel:first-child{height:48px;border-radius:6px}
.skel{background:linear-gradient(90deg,var(--raise),var(--hover),var(--raise));background-size:200% 100%;animation:sh 1.2s infinite linear;border-radius:8px}
@keyframes sh{to{background-position:-200% 0}}
mark{/* cm-fallback */background:transparent;background:color-mix(in srgb,var(--primary) 26%,transparent);color:inherit;border-radius:3px;padding:0 1px}
.top-hit{display:flex;flex-direction:column;gap:var(--s4);padding:var(--s5);border-radius:12px;background:var(--raise);transition:background .2s;position:relative}
.top-hit:hover{background:var(--hover)}
.top-hit .cv{width:96px;height:96px}
.top-hit b{display:block;font-size:28px;font-weight:700;letter-spacing:-.01em;line-height:1.2}
.top-hit small{display:block;margin-top:var(--s1);color:var(--muted);font-size:14px;line-height:1.4}
.top-hit small span{display:inline-block;background:var(--frame);color:var(--text);padding:2px 10px;border-radius:999px;margin-inline-start:6px;font-weight:500;font-size:12px}
.hits{display:grid;gap:var(--s5)}
@media (min-width:1000px){.hits{grid-template-columns:minmax(0,.85fr) minmax(0,1.4fr)}}

/* ---- הודעה קופצת ---- */
.toast{position:fixed;z-index:60;left:50%;bottom:calc(150px + env(safe-area-inset-bottom));transform:translate(-50%,16px);opacity:0;
  background:var(--solid);color:var(--onSolid);padding:var(--s3) var(--s4);border-radius:10px;font-size:14px;line-height:1.35;font-weight:500;pointer-events:none;transition:all .22s;
  max-width:calc(100% - 32px);box-shadow:var(--sh-2)}
.toast.on{opacity:1;transform:translate(-50%,0)}
@media (min-width:1000px){.toast{bottom:110px}}

/* ---- המשך האזנה ---- */
.hero{position:relative;display:flex;align-items:center;gap:var(--s4);padding:var(--s3);margin:var(--s4) 0 var(--s3);border-radius:14px;cursor:pointer;
  /* cm-fallback */
  background:var(--card);
  background:color-mix(in srgb,var(--c1) 14%,var(--card));box-shadow:var(--sh-1);transition:background .2s,transform .15s}
.hero:hover{/* cm-fallback */background:var(--card);background:color-mix(in srgb,var(--c1) 22%,var(--card))}
.hero:active{transform:scale(.99)}
.hero .cv{width:84px;height:84px;border-radius:12px;box-shadow:var(--sh-2)}
.hero .hb{flex:1;min-width:0}
.hero small{display:block;font-size:var(--t-meta);font-weight:600;color:var(--muted);line-height:1.3}
.hero b{display:block;font-size:var(--t-h3);font-weight:800;line-height:1.25;margin:2px 0;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.hero .hm{display:block;font-size:var(--t-meta);color:var(--muted);line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hbar{display:block;height:4px;border-radius:4px;/* cm-fallback */background:transparent;background:color-mix(in srgb,var(--text) 14%,transparent);overflow:hidden;margin-top:var(--s2)}
.hbar i{display:block;height:100%;background:var(--accent);border-radius:4px;transition:width .3s}
.head .hbar{max-width:260px}
.hero .bigplay{flex:none}
@media (hover:none){.hero .bigplay{width:52px;height:52px}}

/* טבעת התקדמות על עטיפה */
.ring{position:absolute;top:8px;inset-inline-start:8px;width:28px;height:28px;border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,#000a 66%,#0000 69%),conic-gradient(#F7B021 var(--p),#ffffff40 0);box-shadow:0 1px 4px #0006}
.ring.done{display:grid;place-items:center;background:var(--ok);color:#fff;border-radius:50%}
:root:not([data-theme=light]) .ring.done{color:#0B1220}
.ring.done svg{width:20px;height:20px}
.tag{position:absolute;top:8px;inset-inline-start:8px;padding:2px 9px;border-radius:999px;background:#000a;color:#fff;font:600 12px/1.5 var(--f-meta)}

/* ---- קישור-טקסט, פילטרים, התקנה ---- */
.lnk{font:500 14px/1.3 var(--f-meta);color:var(--muted);min-height:40px;padding:0 var(--s3);border-radius:999px;transition:color .15s,background .15s}
.lnk:hover{color:var(--text);background:var(--hover)}
.chips.wrap{flex-wrap:wrap;overflow:visible}
.filters{display:flex;gap:var(--s2);margin:0 0 var(--s4);flex-wrap:wrap}
.fl{height:36px;padding:0 var(--s3);border-radius:999px;border:1px solid var(--line);font:500 14px/1.3 var(--f-meta);color:var(--muted);display:inline-flex;align-items:center;gap:6px;transition:background .15s,color .15s,border-color .15s}
.fl:hover{color:var(--text);border-color:var(--muted)}
.fl:active{background:var(--press)}
.fl.on{background:var(--primarySoft);border-color:transparent;color:var(--text);font-weight:700}
.fl span{color:var(--warm);font-weight:700}
.resume{flex:1;min-width:0;font:600 15px/1.3 var(--f-meta);color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sort{margin-inline-start:0}
.empty.sm{padding:var(--s6) var(--s4)}
.install{display:flex;align-items:center;gap:var(--s3);padding:var(--s2) var(--s2) var(--s2) var(--s4);margin:0 0 var(--s4);border-radius:12px;background:var(--primarySoft);font-size:15px;line-height:1.35;animation:fade .25s both}
.install span{flex:1;min-width:0}
.btn.sm{min-height:40px;padding:0 var(--s4);font-size:15px}
.install .ic{color:var(--muted)}

/* ---- הורדה בשורה ---- */
.ic.dling{position:relative;color:var(--primary)}
.ic.dling::before{content:"";position:absolute;inset:5px;border-radius:50%;background:conic-gradient(var(--primary) var(--dp,0%),var(--line) 0);
  -webkit-mask:radial-gradient(farthest-side,#0000 calc(100% - 3px),#000 calc(100% - 2px));mask:radial-gradient(farthest-side,#0000 calc(100% - 3px),#000 calc(100% - 2px))}
.ic.dling .pct{font:700 11px/1 var(--f-meta);font-variant-numeric:tabular-nums}
.row .acts .ic.dling{opacity:1}
.row:has(.dling) .acts{opacity:1}

/* ---- תור ---- */
.sheet-next .row{grid-template-columns:48px minmax(0,1fr) 40px}
.sheet-next .row .rm{display:grid;color:var(--muted)}
.row .rm{display:none}
.nh{display:flex;align-items:center;justify-content:space-between;margin-inline:var(--s2)}
.nh h3{margin:0}
.more-n{margin:var(--s2) var(--s3) var(--s3);font:400 14px/1.4 var(--f-meta);color:var(--muted)}
.ser{display:flex;align-items:center;gap:var(--s3);width:100%;padding:var(--s3) var(--s4);margin-bottom:var(--s3);border-radius:12px;background:var(--primarySoft);transition:background .15s,transform .1s}
.ser:hover{/* cm-fallback */background:var(--primarySoft);background:color-mix(in srgb,var(--primary) 22%,var(--primarySoft))}
.ser:active{transform:scale(.99)}
.ser svg{width:24px;height:24px;flex:none;color:var(--primary)}
.ser span{min-width:0}
.ser small{display:block;font-size:13px;color:var(--muted);line-height:1.3}
.ser b{display:block;font-weight:700;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#pQueue{position:relative}
#pQueue[data-n]:not([data-n=""])::after{content:attr(data-n);position:absolute;top:2px;inset-inline-end:2px;min-width:16px;height:16px;border-radius:8px;background:var(--accent);color:#1a1100;font:700 11px/16px var(--f-meta);text-align:center}
.sheet-state a{font-weight:700}

/* ---- קיצורי מקלדת ---- */
.kb-hint{display:none}
@media (min-width:1000px){
  .kb-hint{display:flex;align-items:center;gap:var(--s3);padding:var(--s2) var(--s4);border-radius:8px;color:var(--muted);font:500 14px/1.3 var(--f-meta);min-height:40px;transition:color .15s}
  .kb-hint:hover{color:var(--text)}
}
kbd{display:inline-block;min-width:26px;padding:2px 8px;border-radius:6px;border:1px solid var(--line);border-bottom-width:2px;background:var(--raise);font:600 13px/1.4 var(--f-meta);text-align:center;color:var(--text)}
.keys{display:grid;grid-template-columns:auto 1fr;gap:var(--s3) var(--s4);margin:0;padding:var(--s3);align-items:center}
.keys dt{white-space:nowrap}.keys dd{margin:0;color:var(--muted);font-size:15px}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
kbd{direction:ltr;unicode-bidi:isolate}

/* במחשב: שם הרב בעמודה נפרדת — בלי נקודה מיותרת לפני הפריט הבא בשורה */
@media (min-width:1000px){
  .list:not(.norabbi):not(.compact) .row .meta .r + span::before{content:none;margin:0}
}

/* =====================================================================
   זכוכית נוזלית מעל בית רומנו — כמו באפליקציה.
   לוחות: לבן שקוף + טשטוש אמיתי של מה שמאחור + קו אור עליון + הבהק בפינה.
   ===================================================================== */
html:root:not(#x){
  --frame:transparent;--bg:transparent;--card:rgba(14,30,48,.92);--raise:rgba(255,255,255,.1);--hover:rgba(255,255,255,.14);--press:rgba(255,255,255,.2);
  --text:#fff;--muted:rgba(255,255,255,.74);--faint:rgba(255,255,255,.5);--line:rgba(255,255,255,.16);
  --primary:#F9AE00;--onPrimary:#231400;--primarySoft:rgba(249,174,0,.2);--accent:#FFD36E;--accentSoft:rgba(249,174,0,.18);--sec:#EDA132;--ok:#6EE7B7;--warm:#FFD36B;--warmSoft:rgba(249,174,0,.2);
  --solid:#fff;--onSolid:#0B1A2C;--scrim:rgba(4,10,18,.55);
  --sh-1:0 4px 12px -4px rgba(0,0,0,.5);--sh-2:0 14px 30px -12px rgba(0,0,0,.7);--sh-3:0 30px 60px -20px rgba(0,0,0,.85);
  /* מהסקיל liquid-glass-web */
  --lg-blur:24px;--lg-sat:180%;--lg-spring:cubic-bezier(.22,1,.36,1);
  --glass-fill:radial-gradient(120% 70% at 85% -15%,rgba(255,255,255,.2),transparent 55%),linear-gradient(135deg,rgba(255,255,255,.17),rgba(255,255,255,.05));
  --glass-edge:rgba(255,255,255,.24);
  --glass-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -1px 0 rgba(255,255,255,.08),0 18px 44px -20px rgba(0,0,0,.75);
  color-scheme:dark;
}
/* תמונת הרקע: AVIF (כמחצית המשקל) לדפדפנים שתומכים, אחרת JPG — אותה תמונה */
:root{--romano:url(img/romano.jpg)}
/* ריווח לשורת המצב: באייפון/דפדפן — env; באפליקציה — האפליקציה קובעת את --st בעצמה (WebView ישן לא מעביר env) */
:root{--st:env(safe-area-inset-top,0px)}
@supports (background-image:image-set(url("img/romano.avif") type("image/avif"))){:root{--romano:image-set(url("img/romano.avif") type("image/avif"),url("img/romano.jpg") type("image/jpeg"))}}
body{background:#06121F}
.backdrop{position:fixed;inset:0;z-index:-1;background:
  linear-gradient(180deg,rgba(11,42,74,.25) 0%,rgba(11,42,74,.68) 38%,rgba(6,18,31,.93) 72%,#06121F 100%),
  var(--romano) 50% 28%/cover no-repeat}
.backdrop::after{content:"";position:absolute;width:60vmax;height:60vmax;right:-20vmax;top:30%;border-radius:50%;background:#0079BE;filter:blur(120px);opacity:.35}

/* מתכון הזכוכית */
.glass,.panel.nav,.panel.lib,.player,.tabs,.menu-in,.toast,.sheet-next,.top-hit,.hero,.install,.ser,.list:not(.group .list):not(.sheet-next .list),
.search,.chip,.fl,.ic.round,.more,.tile,.empty.sm{
  background:var(--glass-fill);border:1px solid var(--glass-edge);box-shadow:var(--glass-shadow);
  -webkit-backdrop-filter:blur(var(--lg-blur)) saturate(var(--lg-sat));backdrop-filter:blur(var(--lg-blur)) saturate(var(--lg-sat))}
@media (prefers-contrast:more){
  .glass,.panel.nav,.panel.lib,.player,.tabs,.menu-in,.sheet-next,.hero,.list,.search,.chip{background:#0E1E30;-webkit-backdrop-filter:none;backdrop-filter:none}}

/* מבנה: התצוגה עצמה שקופה — הלוחות שבתוכה הם הזכוכית */
.view{background:none}
@media (min-width:1000px){
  .app{gap:12px;padding:12px 12px 0}
  .panel{border-radius:24px}
  .view{border-radius:0}
}
.topbar.solid{background:rgba(8,22,38,.55);-webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%);box-shadow:0 1px 0 var(--line)}

/* סרגל צד */
.brand{gap:12px;font-size:18px}
.brand img{width:44px;height:44px;border-radius:14px;background:#fff;padding:4px;object-fit:contain;box-shadow:0 6px 16px -6px rgba(0,0,0,.6)}
.brand span{display:flex;flex-direction:column;line-height:1.2}
.brand small{font:500 12.5px/1.3 var(--f-meta);color:var(--muted)}
.nav-a{border-radius:14px;transition:background .2s,color .2s}
.nav-a.on{background:rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
.nav-a.on svg{color:var(--primary)}
.s-item{border-radius:14px}
.s-item .cv{box-shadow:0 0 0 2px rgba(255,255,255,.12)}

/* כותרת הבית — כמו באפליקציה */
.hello{display:flex;align-items:center;gap:14px;margin:0 0 6px}
.hello .logo{width:60px;height:60px;border-radius:18px;background:#fff;padding:5px;object-fit:contain;flex:none;box-shadow:0 10px 24px -10px rgba(0,0,0,.7)}
.hello h1.h{margin:0;font-size:clamp(30px,7vw,40px);font-weight:800;letter-spacing:-.015em;text-shadow:0 2px 18px rgba(0,0,0,.45)}
.hello p{margin:2px 0 0;color:var(--muted);font:500 15px/1.35 var(--f-meta)}

/* ממשיכים לשמוע */
.hero{border-radius:26px;padding:14px;margin:18px 0 12px;transition:transform .3s var(--lg-spring)}
.hero:hover{background:var(--glass-fill)}
.hero:hover{transform:translateY(-2px)}
.hero .cv{width:76px;height:76px;border-radius:18px}
.hero small{color:var(--warm);font-weight:800;letter-spacing:.01em}
.hero b{font-size:20px}

/* כרטיס המצב */
.stat{border-radius:26px;padding:16px;margin:0 0 6px}
.st-h{display:flex;align-items:center;gap:12px}
.st-h>div{min-width:0}
.st-h b{display:block;font-size:19px;font-weight:800;line-height:1.25}
.st-h small{display:block;color:var(--muted);font-size:14px;line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.st-ic{flex:none;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:rgba(249,174,0,.2);color:var(--warm);box-shadow:inset 0 0 0 1px rgba(249,174,0,.35)}
.st-ic svg{width:24px;height:24px}
.nums{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;margin-top:14px;border-radius:18px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);overflow:hidden}
.nums>*{text-align:center;padding:9px 4px;transition:background .2s}
.nums>a:hover{background:rgba(255,255,255,.08)}
.nums>*+*{border-inline-start:1px solid rgba(255,255,255,.14)}
.nums b{display:block;font-size:24px;font-weight:800;line-height:1.1;font-variant-numeric:tabular-nums}
.nums b.y{color:var(--primary)}
.nums small{color:var(--muted);font:500 12.5px/1.3 var(--f-meta)}

/* כותרות מקטע */
.sec h2{font-size:21px;font-weight:800;text-shadow:0 2px 14px rgba(0,0,0,.4)}
.sec a{color:var(--warm);font-weight:700}

/* שבבים */
.chip{height:38px;border-radius:14px;font-weight:700;color:var(--text)}
.chip:hover{background:var(--glass-fill);border-color:rgba(255,255,255,.4)}
.chip span{color:var(--warm);opacity:1;font-weight:700}
.chip.on{background:#fff;color:#0B2A4A;border-color:#fff}
.chips{padding-bottom:6px}

/* לוח יום / חודש: שורות בתוך זכוכית אחת (כמו רשימה מקובצת של אייפון) */
.group{border-radius:26px;padding:6px 6px 4px;margin:0 0 14px;content-visibility:auto;contain-intrinsic-size:auto 260px}
.gh{display:flex;align-items:baseline;gap:8px;margin:6px 12px 2px;font-size:15px}
.gh b{font-weight:800}
.gh span{color:var(--muted);font-weight:500}
.gh em{margin-inline-start:auto;font:500 13px var(--f-meta);color:var(--faint);font-style:normal}
.group .row{margin:0;border-radius:16px}
.group .row+.row::after,.list:not(.group .list) .row+.row::after{content:"";position:absolute;top:0;inset-inline:68px 12px;height:1px;background:var(--line)}
.list:not(.group .list):not(.sheet-next .list){border-radius:24px;padding:6px}
.list:not(.group .list) .row{margin:0;border-radius:16px}
.group .list{background:none;border:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}

/* שורה */
.row:hover{background:rgba(255,255,255,.08)}
.row:active{background:rgba(255,255,255,.14)}
.row .cv{border-radius:12px;box-shadow:0 0 0 1px rgba(255,255,255,.14),0 6px 14px -8px rgba(0,0,0,.8)}
.row .t{font-weight:700}
.row.now{background:rgba(249,174,0,.12)}
.row.now .t{color:var(--accent)}
.row .heard{background:rgba(255,255,255,.14)}
@media (min-width:1000px){
  .group .row,.list:not(.group .list) .row{margin:0;padding:6px 10px}
  .row .cv{border-radius:10px}
}

/* כפתורי ניגון: ענבר עם נפח */
.bigplay,.fab{background:linear-gradient(145deg,#FFD36E,#EDA132);color:#231400;box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 10px 24px -8px rgba(241,136,0,.85)}
.pp{background:#fff;color:#0B1A2C}
.btn{background:linear-gradient(145deg,#FFD36E,#EDA132);color:#231400;box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
.ic:hover{background:rgba(255,255,255,.12)}

/* עטיפות, מדפים, כרטיסים */
.card{border-radius:20px}
.card:hover{background:rgba(255,255,255,.08)}
.card .cv{border-radius:20px;box-shadow:0 0 0 1px rgba(255,255,255,.14),var(--sh-2)}
.head .cv{border-radius:28px;box-shadow:0 0 0 1px rgba(255,255,255,.18),var(--sh-3)}
.head h1{text-shadow:0 4px 30px rgba(0,0,0,.5)}
.tile{border-radius:20px}
.top-hit{border-radius:24px}
.fl{border-radius:14px;color:var(--text)}
.fl.on{background:#fff;color:#0B2A4A;border-color:#fff}
.fl.on span{color:#B35A00}
.more{border-radius:14px;color:var(--text)}
.search{border-radius:16px}
.search:focus-within{border-color:rgba(249,174,0,.7);box-shadow:var(--glass-shadow),0 0 0 3px rgba(249,174,0,.25)}

/* נגן: קפסולת זכוכית כהה */
.player{background:linear-gradient(135deg,rgba(14,30,48,.72),rgba(7,15,26,.78));border-radius:22px;color:#fff}
.player .pp{background:#fff;color:#0B1A2C}
.mini-prog{background:rgba(255,255,255,.2)}.mini-prog i{background:var(--primary)}
@media (min-width:1000px){
  .player{margin:0 0 12px;border-radius:24px;background:linear-gradient(135deg,rgba(14,30,48,.66),rgba(7,15,26,.74));color:#fff}
  .player .pp{width:40px;height:40px;background:linear-gradient(145deg,#FFD36E,#EDA132);color:#231400}
  .player .ic{color:rgba(255,255,255,.8)}
  .player .ic:hover{color:#fff}
}
input.seek:hover,input.seek:focus-visible{--sk:var(--primary)}

/* לשוניות: קפסולה צפה */
.tabs{margin:0 12px calc(8px + env(safe-area-inset-bottom));padding:6px;border-radius:999px;box-shadow:var(--glass-shadow)}
.tabs a{border-radius:999px;min-height:48px;color:rgba(255,255,255,.7)}
.tabs a.on{color:#fff;background:rgba(255,255,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
.tabs a.on svg{color:var(--primary)}

/* נגן מלא: בית רומנו מאחור, כהה כלפי מטה */
.sheet{background:#06121F}
.sheet-bg{/* cm-fallback */background:linear-gradient(180deg,rgba(11,42,74,.45) 0%,rgba(14,30,48,.78) 45%,rgba(7,15,26,.96) 80%),var(--romano) 50% 25%/cover no-repeat;background:linear-gradient(180deg,color-mix(in srgb,var(--c1) 40%,rgba(11,42,74,.45)) 0%,rgba(14,30,48,.78) 45%,rgba(7,15,26,.96) 80%),var(--romano) 50% 25%/cover no-repeat}
.sheet-cover .cv{border-radius:34px;box-shadow:0 0 0 1px rgba(255,255,255,.2),0 30px 60px -20px #000}
.sheet-next{border-radius:24px}
.sheet-next .list{background:none;border:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;padding:0}
.sheet-ctl .pp.big{background:linear-gradient(145deg,#FFD36E,#EDA132);color:#231400;box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 14px 30px -10px rgba(241,136,0,.85)}
.ser{border-radius:18px}

/* תפריט והודעות */
.menu-in{background:linear-gradient(135deg,rgba(20,38,58,.86),rgba(8,18,30,.92));border-radius:26px 26px 0 0}
@media (min-width:1000px){.menu-in{border-radius:24px}}
.menu-in>button svg,.menu-in>a svg{color:var(--primary)}
.toast{background:linear-gradient(135deg,rgba(20,38,58,.9),rgba(8,18,30,.94));color:#fff;border-radius:16px}
kbd{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.25);color:#fff}
.skel{background:linear-gradient(90deg,rgba(255,255,255,.06),rgba(255,255,255,.14),rgba(255,255,255,.06));background-size:200% 100%}

/* תנועה: כניסה אחת רכה של הדף (לא אפקט על כל כרטיס) */
.page-in{animation:glassIn .45s var(--lg-spring) both}
@keyframes glassIn{from{opacity:0;transform:translateY(10px) scale(.99)}}
@media (prefers-reduced-motion:reduce){.page-in{animation:none}}
/* טלפון: שורה קצרה — הרב, מספר, תאריך; הסדרה כבר בכותרת או בעמוד */
@media (max-width:999px){.row .meta .s{display:none}.row .meta>.r{flex:0 1 auto;min-width:7.5em}}
.group .row .idx .n{visibility:hidden}

/* =====================================================================
   שכבה 3: טיפוגרפיה במשקלים, ארכיון שנים, תמלול, ותנועה
   ===================================================================== */
/* משקלים: 800 לכותרות, 200–300 להקשר ולמספרים גדולים, 600–650 לשמות */
.lite{font-weight:300;color:var(--muted);letter-spacing:0;margin-inline-start:6px}
.hello h1.h{font-weight:800;letter-spacing:-.02em}
.hello p{font-weight:300;font-size:16px;letter-spacing:.01em}
.sec h2{font-weight:800}
.nums b{font-weight:200;font-size:34px;letter-spacing:-.02em}
.nums b.y{font-weight:300}
.nums small{font-weight:600;letter-spacing:.02em}
.st-h b{font-weight:750}
.st-h small{font-weight:300}
.row .t{font-weight:650}
.row .meta{font-weight:400}
.gh b{font-weight:750}
.gh span{font-weight:300}
.chip{font-weight:600}
.chip em{font-style:normal;font-weight:300;color:var(--muted)}
.head h1{font-weight:800}
.head small{font-weight:300;letter-spacing:.04em}
.brand span{font-weight:750}
.brand small{font-weight:300}
.txb{display:inline-flex;align-items:center;padding:0 7px;border-radius:999px;background:rgba(110,231,183,.16);color:var(--ok);font:600 11.5px/1.6 var(--f-meta);flex:none}

/* ארכיון: כרטיס לכל שנה */
.years{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-bottom:18px}
.ycard{border-radius:22px;padding:16px 18px;display:flex;flex-direction:column;gap:2px;transition:transform .4s var(--lg-spring),border-color .3s}
.ycard b{font-weight:200;font-size:34px;line-height:1.1;letter-spacing:-.01em}
.ycard small{font-weight:600;color:var(--warm);font-size:13.5px}
.ycard:hover{transform:translateY(-3px);border-color:rgba(249,174,0,.5)}
.yhead{padding:8px 0 18px}
.yhead small{font:600 14px var(--f-meta);color:var(--warm);letter-spacing:.06em}
.yhead h1{margin:2px 0 4px;font-size:clamp(56px,12vw,96px);font-weight:200;letter-spacing:-.03em;line-height:1;text-shadow:0 6px 40px rgba(0,0,0,.5)}
.yhead p{margin:0;color:var(--muted);font-weight:300}
.yhead p b{color:#fff;font-weight:700}
.ygrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;align-items:start}
.ygroup{padding:10px;margin:0}
.yr{display:flex;align-items:center;gap:12px;padding:6px 6px 10px;border-bottom:1px solid var(--line)}
.yr .cv{width:48px;height:48px;border-radius:14px}
.yr b{display:block;font-weight:750;font-size:16.5px}
.yr small{color:var(--muted);font-weight:300}
.sers{display:flex;flex-direction:column;padding-top:4px}
.srow{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:12px;transition:background .2s}
.srow:hover{background:rgba(255,255,255,.08)}
.srow b{flex:1;min-width:0;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.srow span{font:300 14px var(--f-meta);color:var(--muted);font-variant-numeric:tabular-nums}

/* התמלול בנגן המלא */
.sheet-tx{margin-top:16px;border-radius:24px;padding:12px 6px 6px 6px;overflow:hidden}
/* לוח התמלול: זכוכית כהה אחת בכל מצב (מוטבע, מגירה, מסך מלא, שני טורים), בשתי ערכות הצבע */
.sheet-tx.glass,.sheet-tx{background:linear-gradient(180deg,rgba(22,40,62,.86),rgba(8,18,30,.94) 160px);border:1px solid rgba(255,255,255,.2);
  -webkit-backdrop-filter:blur(28px) saturate(170%);backdrop-filter:blur(28px) saturate(170%);color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.32),0 18px 44px -20px rgba(0,0,0,.75)}
@media (prefers-contrast:more){.sheet-tx.glass,.sheet-tx{background:#0B1826;-webkit-backdrop-filter:none;backdrop-filter:none}}
.sheet-tx header{display:flex;align-items:center;gap:8px;padding:0 12px 8px}
.sheet-tx header b{font-weight:800;font-size:17px}
.tx-lvl{font:600 12px/1.6 var(--f-meta);padding:0 8px;border-radius:999px;background:rgba(110,231,183,.16);color:var(--ok)}
.sheet-tx header .lnk{margin-inline-start:auto;min-height:32px;color:var(--warm);font-weight:600}
.tx-body{max-height:min(46vh,420px);overflow-y:auto;padding:4px 12px 20px;scrollbar-width:thin;
  -webkit-mask:linear-gradient(transparent,#000 22px,#000 calc(100% - 28px),transparent);mask:linear-gradient(transparent,#000 22px,#000 calc(100% - 28px),transparent)}
.tx-body span{cursor:pointer;border-radius:6px;padding:1px 0}
.tx-body span.sp{color:rgba(255,255,255,.95)}
.tx-wait{color:var(--muted);text-align:center;font-weight:300}
@media (min-width:1000px){.sheet-in{max-width:620px}}

/* ---- תנועה ---- */
/* אור שעוקב אחרי העכבר על הזכוכית */
.glass{position:relative}
.glass::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .35s;
  background:radial-gradient(260px circle at var(--mx,50%) var(--my,0%),rgba(255,255,255,.13),transparent 60%)}
@media (hover:hover){.glass:hover::after{opacity:1}}
/* כפתור ניגון "חי" — הילה נושמת בזמן ניגון */
.bigplay{position:relative}
.bigplay::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid rgba(249,174,0,.55);opacity:0;pointer-events:none}
html:not(.paused-all) .playing .bigplay::after,.hero.playing .bigplay::after{animation:halo 1.8s var(--lg-spring) infinite}
@keyframes halo{0%{opacity:.8;transform:scale(.92)}100%{opacity:0;transform:scale(1.35)}}
.bigplay:active,.pp:active,.chip:active,.ycard:active{transform:scale(.95);transition:transform .12s}
/* כניסה ראשונה: הלוגו קופץ, הברכה נכנסת, הלוחות עולים אחד אחרי השני */
.intro .hello .logo{animation:pop .9s var(--lg-spring) both}
@keyframes pop{0%{opacity:0;transform:scale(.6) rotate(-8deg)}100%{opacity:1;transform:none}}
.intro .hello h1{animation:rise .8s var(--lg-spring) .08s both}
.intro .hello p{animation:rise .8s var(--lg-spring) .16s both}
.intro .page-in>.hero,.intro .page-in>.stat,.intro .page-in>.sec,.intro .page-in>.chips,.intro .page-in>.group,.intro .page-in>.years{animation:rise .9s var(--lg-spring) both}
.intro .page-in>.hero{animation-delay:.2s}.intro .page-in>.stat{animation-delay:.26s}
.intro .page-in>:nth-child(5){animation-delay:.32s}.intro .page-in>:nth-child(6){animation-delay:.36s}
.intro .page-in>:nth-child(7){animation-delay:.4s}.intro .page-in>:nth-child(8){animation-delay:.44s}
.intro .page-in>:nth-child(n+9){animation-delay:.48s}
@keyframes rise{from{opacity:0;transform:translateY(18px) scale(.985);filter:blur(6px)}}
/* הנגן המלא נפתח מלמטה עם קפיצה רכה, העטיפה "נוחתת" */
.sheet{animation:sheetIn .55s var(--lg-spring) both}
.sheet:not(.closing) .sheet-cover .cv{animation:land .7s var(--lg-spring) .05s both}
@keyframes land{from{opacity:0;transform:scale(.82) translateY(24px)}}
/* שורה מתנגנת: פס אור עדין */
.row.now{background:linear-gradient(90deg,rgba(249,174,0,.06),rgba(249,174,0,.16))}
@media (prefers-reduced-motion:reduce){.glass::after{display:none}.intro *{animation:none!important}}

/* =====================================================================
   שכבה 4: תמלול חי (סימון נע, חיפוש, ציטוט), נגן מלא בשני טורים במחשב,
   מעברי עמוד, קפיץ בכפתורים, ופרטים קטנים
   ===================================================================== */
/* תמלול: הסימון הענברי גולש ממילה למילה מאחורי הטקסט */
.tx-body{position:relative;isolation:isolate;overscroll-behavior:contain}
.tx-hl{position:absolute;top:0;left:0;z-index:-1;border-radius:8px;pointer-events:none;opacity:0;
  background:linear-gradient(180deg,#FFDA7A,#F7B526);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 0 0 1px rgba(255,214,120,.35),0 0 16px -2px rgba(249,174,0,.45);
  transition:transform .26s cubic-bezier(.3,.8,.3,1),width .26s cubic-bezier(.3,.8,.3,1),height .26s,opacity .3s}
.tx-hl.on{opacity:1}
.tx-hl.snap{transition:opacity .3s}
.tx-body span{transition:color .3s;border-radius:6px;padding:1px 0}
.tx-body span.on{color:#2A1800;background:none;box-shadow:none;font-weight:inherit}
.tx-body span:hover{background:rgba(255,255,255,.1)}
.tx-body span.on:hover{background:none}
.tx-body p{font-size:18px;line-height:2;letter-spacing:.003em;margin:0 0 22px;color:rgba(255,255,255,.46)}
.tx-body ::selection{background:rgba(124,196,240,.38);color:#fff}
/* זמן בראש כל פסקה */
.tx-t{display:flex;align-items:center;gap:8px;margin:0 0 2px;padding:0;font:600 12.5px/1.6 var(--f-meta);color:var(--warm);font-variant-numeric:tabular-nums;letter-spacing:.02em;opacity:.8;transition:opacity .2s}
.tx-t::after{content:"";flex:0 0 28px;height:1px;background:currentColor;opacity:.4}
.tx-t:hover{opacity:1}
/* שלד בזמן טעינה */
.tx-sk{display:flex;flex-direction:column;gap:14px;padding:12px 0 8px}
.tx-sk i{background:linear-gradient(90deg,rgba(255,255,255,.07),rgba(255,255,255,.16),rgba(255,255,255,.07));background-size:200% 100%;display:block;height:14px;border-radius:7px;margin-inline-start:auto}
/* חיפוש בתמלול */
.sheet-tx header{min-height:40px}
.tx-sb{width:36px;height:36px;margin-inline-start:auto;color:var(--muted)}
.tx-sb svg{width:20px;height:20px}
.tx-sb.on{color:#231400;background:linear-gradient(145deg,#FFD36E,#EDA132)}
.sheet-tx header .tx-lvl{margin-inline-end:auto}
.sheet-tx header .lnk,.sheet-tx header .tx-sb{margin-inline-start:0}
.tx-xp{display:none}
.tx-xp svg{transition:transform .35s var(--lg-spring)}
.tx-xp.on svg{transform:rotate(180deg)}
.tx-find{display:flex;align-items:center;gap:4px;margin:0 8px 8px;padding:0 4px 0 12px;height:44px;border-radius:14px;
  background:rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.16);animation:findIn .35s var(--lg-spring) both}
.tx-find:focus-within{border-color:rgba(249,174,0,.7);box-shadow:0 0 0 3px rgba(249,174,0,.2)}
@keyframes findIn{from{opacity:0;transform:translateY(-6px)}}
.tx-find input{flex:1;min-width:0;height:100%;border:0;background:none;color:#fff;font:500 16px/1.3 var(--f-body);outline:none}
.tx-find input::placeholder{color:var(--faint);font-weight:300}
.tx-find input::-webkit-search-cancel-button{filter:grayscale(1);opacity:.6}
.tx-n{font:500 13px/1 var(--f-meta);color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;min-width:3ch;text-align:center}
.tx-find .ic{width:34px;height:34px}
.tx-find .ic svg{width:22px;height:22px}
.tx-find .ic:disabled{opacity:.35;cursor:default}
.tx-body span.hit{background:rgba(124,196,240,.22);color:#fff;box-shadow:0 0 0 2px rgba(124,196,240,.22)}
.tx-body span.hit.cur{background:rgba(124,196,240,.55);box-shadow:0 0 0 2px rgba(124,196,240,.55);animation:hitPulse .6s var(--lg-spring)}
@keyframes hitPulse{from{box-shadow:0 0 0 8px rgba(124,196,240,0)}}
/* בועת ציטוט מעל/מתחת לקטע המסומן */
.tx-quote{position:absolute;top:0;left:0;z-index:5;display:flex;gap:2px;padding:4px;border-radius:14px;
  background:linear-gradient(135deg,rgba(20,38,58,.94),rgba(8,18,30,.96));border:1px solid rgba(255,255,255,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 14px 30px -10px #000;animation:quoteIn .28s var(--lg-spring) both}
@keyframes quoteIn{from{opacity:0;scale:.92}}
.tx-quote button{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 12px;border-radius:10px;font:600 14px/1 var(--f-meta);white-space:nowrap;color:#fff;transition:background .15s}
.tx-quote button:hover{background:rgba(255,255,255,.12)}
.tx-quote svg{width:18px;height:18px;color:var(--primary)}

/* נגן מלא: טלפון — טור אחד כמו קודם; מחשב רחב עם תמלול — שני טורים, התמלול לכל הגובה */
.sheet-cols,.sheet-main,.sheet-side{display:contents}
.sheet-main,.sheet-side{min-width:0}
@media (min-width:1100px){
  .sheet-in:has(.sheet-tx:not([hidden])){max-width:1240px;padding-inline:40px}
  .sheet-in:has(.sheet-tx:not([hidden])) .sheet-cols{display:grid;grid-template-columns:minmax(0,440px) minmax(0,1fr);gap:56px;align-items:start;margin-top:8px}
  .sheet-in:has(.sheet-tx:not([hidden])) .sheet-main{display:flex;flex-direction:column;position:sticky;top:16px}
  .sheet-in:has(.sheet-tx:not([hidden])) .sheet-side{display:flex;flex-direction:column;gap:16px}
  .sheet-in:has(.sheet-tx:not([hidden])) .sheet-cover{margin-top:8px}
  .sheet-in:has(.sheet-tx:not([hidden])) .sheet-cover .cv{width:min(400px,46vh);height:min(400px,46vh)}
  .sheet-in:has(.sheet-tx:not([hidden])) .sheet-tx{margin-top:0;padding:16px 8px 8px}
  .sheet-in:has(.sheet-tx:not([hidden])) .tx-body{max-height:calc(100vh - 190px);max-height:calc(100dvh - 190px);padding-inline:20px}
  .sheet-in:has(.sheet-tx:not([hidden])) .tx-body p{font-size:20px;line-height:2.05}
  .sheet-in:has(.sheet-tx:not([hidden])) .sheet-next{margin-top:0}
}
/* העטיפה העפה מהנגן הקטן */
.cv.fly{position:fixed;z-index:45;margin:0;transform-origin:0 0;pointer-events:none;will-change:left,top,width,height;animation:none!important;transition:none!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.2),0 30px 60px -20px #000;border-radius:34px}
.sheet.flying .sheet-cover .cv{animation:none}

/* מעבר בין עמודים (View Transitions): הישן נמס, החדש עולה מתוך הדף עצמו */
::view-transition-old(root){animation:vtOut .18s ease-out both}
::view-transition-new(root){animation:vtIn .24s ease-out both}
@keyframes vtOut{to{opacity:0}}
@keyframes vtIn{from{opacity:0}}
/* העמוד עצמו זז לפי הכיוון: קדימה — נכנס משמאל (כיוון הקריאה), אחורה — מימין. הסרגלים נשארים במקום */
#page{view-transition-name:page}
/* הסרגלים מעל העמוד גם בזמן המעבר */
#topbar{view-transition-name:topbar}nav.tabs{view-transition-name:tabs}#player{view-transition-name:mini}
::view-transition-group(tabs),::view-transition-group(mini),::view-transition-group(topbar){animation-duration:0s}
.vt .page-in{animation:none}
::view-transition-old(page){animation:vtPageOut .2s cubic-bezier(.4,0,1,1) both}
::view-transition-new(page){animation:vtPageIn .34s var(--lg-spring) both}
html[data-nav="back"]::view-transition-old(page){animation-name:vtPageOutB}
html[data-nav="back"]::view-transition-new(page){animation-name:vtPageInB}
@keyframes vtPageOut{to{opacity:0;transform:translateX(24px)}}
@keyframes vtPageIn{from{opacity:0;transform:translateX(-36px)}}
@keyframes vtPageOutB{to{opacity:0;transform:translateX(-24px)}}
@keyframes vtPageInB{from{opacity:0;transform:translateX(36px)}}
.page-in.still{animation:none}

/* קפיץ: לחיצה מכווצת מהר, השחרור חוזר עם קפיצה רכה */
.ic,.pill,.pp,.chip,.fl,.btn,.bigplay,.fab,.lnk,.more,.sort,.tabs a svg,.tx-t,.ycard,.tile{transition-property:background,color,border-color,opacity,box-shadow,transform;transition-duration:.2s,.2s,.2s,.2s,.2s,.5s;transition-timing-function:ease,ease,ease,ease,ease,var(--lg-spring)}
.ic:active,.pill:active,.lnk:active,.more:active,.sort:active,.fl:active,.btn:active{transform:scale(.92);transition-duration:.08s}
.bigplay:active,.pp:active,.fab:active,.chip:active,.ycard:active,.tile:active{transform:scale(.94);transition-duration:.08s}
.fab:hover:not(:active),.bigplay:hover:not(:active){transform:scale(1.06)}
.card .fab:not(.on){transform:translateY(8px)}
.card:hover .fab:not(:active),.card:focus-within .fab:not(:active),.fab.on:not(:active){transform:none}
.card:hover .fab:hover:not(:active){transform:scale(1.06)}

/* פרטים קטנים */
:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.chip:focus-visible,.ycard:focus-visible,.tile:focus-visible,.card:focus-visible,.hero:focus-visible,.said-c:focus-visible{outline-offset:3px}
.row .meta,.chip span,.ycard small,.gh span,.gh em,.c-len,.hm,.resume,.more-n,.tag,.np-sub,.sheet-state,.srow span{font-variant-numeric:tabular-nums}
.sec h2 .lite{font-size:.8em}
.empty b{font-weight:800;letter-spacing:-.01em}
.empty{font-weight:300}
.sheet-meta h2{font-weight:800;letter-spacing:-.015em;text-wrap:balance}
.sheet-from small{font-weight:300;letter-spacing:.03em}
.np-title{font-weight:700}
.times{font-weight:500}
/* חיפוש: "נאמר בשיעורים" — ציטוט מתוך התמלול עם הזמן */
.said{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,420px),1fr));gap:12px}
.said-c{display:flex;align-items:flex-start;gap:14px;padding:14px;border-radius:22px;transition:transform .4s var(--lg-spring),border-color .3s}
.said-c:hover{transform:translateY(-2px);border-color:rgba(249,174,0,.45)}
.said-c .cv{width:52px;height:52px;border-radius:14px}
.said-c>span{min-width:0}
.said-c .q{display:block;font-size:16.5px;line-height:1.8;font-weight:400;color:rgba(255,255,255,.88)}
.said-c .q mark,.tr-said mark{background:linear-gradient(180deg,#FFDA7A,#F7B526);color:#2A1800;border-radius:6px;padding:1px 3px;font-weight:600}
.said-c .q i{font-style:normal;color:var(--warm);font-weight:700}
.said-c small{display:block;margin-top:6px;color:var(--muted);font-size:13.5px;font-weight:300;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.said-c small b{color:var(--warm);font-weight:700;font-variant-numeric:tabular-nums}
/* רשימות ארוכות: הדפדפן מצייר רק את מה שבמסך */
.list>.row{content-visibility:auto;contain-intrinsic-size:auto 64px}
@media (min-width:1000px){.list>.row{contain-intrinsic-size:auto 52px}}
.sheet-next .list>.row,.row.now{content-visibility:visible}
@media (prefers-reduced-motion:reduce){
  .tx-hl{transition:none}
  ::view-transition-old(root),::view-transition-new(root),::view-transition-old(page),::view-transition-new(page){animation:none}
}

/* =====================================================================
   שכבה 4: סדרות כאלבומים, והארכיון כעולם נפרד (ענבר-זהב, שנה גדולה)
   ===================================================================== */
/* עטיפת אלבום: שם הסדרה על צבע הרב; גודל הטקסט לפי גודל העטיפה */
.cv.alb{container-type:inline-size;display:flex;flex-direction:column;padding:0;color:#fff;text-align:start;
  background:radial-gradient(120% 80% at 100% 0%,rgba(255,255,255,.24),transparent 55%),linear-gradient(150deg,var(--a),var(--b))}
.alb>svg{position:absolute;inset:0;width:100%;height:100%}
.alb-t{position:relative;margin:10cqw 10cqw 0;font-weight:800;font-size:clamp(9px,15cqw,44px);line-height:1.08;letter-spacing:-.01em;text-wrap:balance;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-shadow:0 2px 10px rgba(0,0,0,.25)}
.alb-r{position:relative;margin:4cqw 10cqw 0;font-weight:300;font-size:clamp(8px,8.5cqw,22px);line-height:1.2;opacity:.88;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.alb-y{position:absolute;bottom:7%;inset-inline-end:9%;font-weight:200;font-size:clamp(8px,11cqw,32px);letter-spacing:-.02em;color:#FFE7B0;text-shadow:0 2px 12px rgba(0,0,0,.45)}
/* בארכיון: גוון ספר ישן ומסגרת זהב */
.cv.alb.old{/* cm-fallback */background:radial-gradient(120% 80% at 100% 0%,rgba(255,226,170,.26),transparent 55%),
  linear-gradient(150deg,var(--a),var(--b));background:radial-gradient(120% 80% at 100% 0%,rgba(255,226,170,.26),transparent 55%),
  linear-gradient(150deg,color-mix(in srgb,var(--a) 72%,#8A5A1C),color-mix(in srgb,var(--b) 68%,#1E1307))}
.cv.alb.old::after{content:"";position:absolute;inset:4.5%;border:1px solid rgba(255,214,140,.55);border-radius:14%;pointer-events:none}
.cv.alb.singles{/* cm-fallback */background:repeating-linear-gradient(180deg,transparent 0 17%,rgba(255,255,255,.1) 17% 19%),linear-gradient(150deg,var(--a),var(--b));background:repeating-linear-gradient(180deg,transparent 0 17%,rgba(255,255,255,.1) 17% 19%),linear-gradient(150deg,color-mix(in srgb,var(--a) 70%,#0B2A4A),color-mix(in srgb,var(--b) 70%,#06121F))}
.alb-card b{font-weight:700}
.grid.albums{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
@media (min-width:1000px){.grid.albums{grid-template-columns:repeat(auto-fill,minmax(176px,1fr))}}

/* עמוד סדרה */
.head.album .cv{border-radius:14%}
.disc{display:flex;align-items:baseline;gap:10px;margin:22px 6px 8px;font-size:17px;font-weight:800;line-height:1.3}
.disc:first-child{margin-top:4px}
.disc em{font:300 13.5px var(--f-meta);font-style:normal;color:var(--muted)}
/* "רצועה": המספר במקום העטיפה (בטלפון); במחשב — בעמודת המספר */
.row .tn{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:rgba(255,255,255,.08);
  font:300 19px/1 var(--f-meta);font-variant-numeric:tabular-nums;color:var(--muted);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.row.now .tn{color:var(--accent);font-weight:700}
@media (min-width:1000px){.row .tn{display:none}.list.tracks .row .idx .n{font-weight:300;font-size:16px}}

/* פס הארכיון בבית ובחיפוש */
.arch-strip{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:26px;margin:26px 0 4px;
  background:linear-gradient(120deg,rgba(249,174,0,.24),rgba(138,90,28,.2) 55%,rgba(255,255,255,.05)),var(--glass-fill);border-color:rgba(255,214,140,.4);
  transition:transform .4s var(--lg-spring),border-color .3s}
.arch-strip:hover{transform:translateY(-2px);border-color:rgba(255,214,140,.7)}
.arch-strip:active{transform:scale(.98)}
.as-ic{flex:none;width:50px;height:50px;border-radius:16px;display:grid;place-items:center;background:rgba(249,174,0,.22);color:var(--warm);box-shadow:inset 0 0 0 1px rgba(249,174,0,.4)}
.as-ic svg{width:26px;height:26px}
.as-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.as-t small{font:600 13px/1.3 var(--f-meta);color:var(--warm);letter-spacing:.04em}
.as-t b{font-size:21px;font-weight:800;line-height:1.2}
.as-t span{font:300 14px/1.35 var(--f-meta);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.as-go svg{width:26px;height:26px;color:var(--warm)}

/* הארכיון: שנה = פס גדול */
.ybands{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(min(100%,330px),1fr))}
.yband{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;gap:6px 18px;padding:18px 20px;border-radius:28px;min-height:156px;
  border-color:rgba(255,214,140,.32);background:linear-gradient(140deg,rgba(249,174,0,.16),rgba(255,255,255,.04) 60%),var(--glass-fill);transition:transform .4s var(--lg-spring),border-color .3s}
.yband:hover{transform:translateY(-3px);border-color:rgba(255,214,140,.65)}
.yband:active{transform:scale(.98)}
.yb-n{grid-row:1;align-self:center;font-weight:200;font-size:clamp(50px,13vw,76px);line-height:1;letter-spacing:-.03em;color:#FFE7B0;text-shadow:0 6px 30px rgba(0,0,0,.45)}
.yb-c{align-self:center;font:300 15px/1.5 var(--f-meta);color:var(--muted)}
.yb-c b{color:#fff;font-weight:700}
.yb-covers{grid-column:1/-1;display:flex;gap:8px;margin-top:6px}
.yb-covers .cv{width:52px;height:52px;border-radius:12px;box-shadow:var(--sh-1)}
.yb-covers .alb-r,.yb-covers .alb-y{display:none}
.yb-covers .alb-t{margin:12cqw 10cqw 0;font-size:21cqw;-webkit-line-clamp:2;text-shadow:none}
.yb-covers .cv.alb.old::after{inset:6%}
/* שנה: לכל רב שורה של אלבומים */
.chips.yrs{margin-bottom:6px}
.yr-sec{margin:20px 0 4px}
.yr-h{display:flex;align-items:center;gap:12px;padding:4px 2px 6px}
.yr-h .cv{width:44px;height:44px;box-shadow:0 0 0 2px rgba(255,214,140,.25)}
.yr-h>span:not(.cv){flex:1;min-width:0}
.yr-h b{display:block;font-weight:800;font-size:19px;line-height:1.25;text-shadow:0 2px 14px rgba(0,0,0,.4)}
.yr-h small{display:block;color:var(--muted);font:300 14px/1.35 var(--f-meta)}
.yr-h em{font:600 13.5px var(--f-meta);font-style:normal;color:var(--warm);white-space:nowrap}
.yr-h:hover b{text-decoration:underline;text-underline-offset:3px}
/* עמודי הארכיון: כל הזכוכית בגוון זהב */
.wash.arch{height:560px}
.page-in.arch .glass,.page-in.arch .chip,.page-in.arch .list:not(.group .list){border-color:rgba(255,214,140,.3)}
.page-in.arch .chip.on{background:#FFE7B0;border-color:#FFE7B0;color:#2A1A06}
.page-in.arch .bigplay{background:linear-gradient(135deg,#FFD36B,#C9821E);color:#2A1A06}
.page-in.arch .head small a,.yhead small a{color:var(--warm);font-weight:600}
.page-in.arch .head small a:hover,.yhead small a:hover{text-decoration:underline}
.arch-g .gh b{color:#FFE7B0}
/* הודעה מהמנהל בראש הבית */
.notice{border-radius:20px;padding:12px 16px;margin:14px 0 0;font-weight:600;line-height:1.45;border-color:rgba(249,174,0,.45)}
/* הארכיון ברשימת הצד */
.s-arch{margin-top:6px}
.s-item .arch-ic{display:grid;place-items:center;background:rgba(249,174,0,.2);color:var(--warm);box-shadow:inset 0 0 0 1px rgba(249,174,0,.35)}
.s-item .arch-ic svg{width:24px;height:24px}
.head p .lnk{min-height:0;padding:0;color:var(--warm);font:inherit;font-weight:600}
.head p .lnk:hover{background:none;text-decoration:underline}
.head p a:hover{text-decoration:underline}
.sec .sort{margin-inline-start:auto}
@media (prefers-reduced-motion:reduce){.arch-strip,.yband{transition:none}}

/* =====================================================================
   התמלול כמגירה בטלפון: מציץ מתחתית הנגן, נמשך למעלה למסך מלא (app.js: Drawer)
   ===================================================================== */
.tx-grab{display:none}
.tx-strip{display:none}
@media (max-width:1099px){
  .sheet.tx-drawer .sheet-in{padding-bottom:calc(var(--peek,120px) + 24px + env(safe-area-inset-bottom))}
  .sheet.tx-drawer .sheet-tx{position:fixed;inset-inline:0;top:0;z-index:3;margin:0 auto;max-width:480px;width:100%;
    display:flex;flex-direction:column;padding:0 6px 0;border-radius:26px 26px 0 0;border-bottom:0;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.32),0 -18px 40px -18px rgba(0,0,0,.8);
    will-change:transform;contain:layout paint;overflow:hidden;touch-action:none}
  .sheet.tx-drawer .sheet-tx::after{display:none}
  .sheet.tx-drawer .tx-grab{display:grid;place-items:center;width:100%;height:26px;flex:none;cursor:grab;touch-action:none;-webkit-tap-highlight-color:transparent}
  .sheet.tx-drawer .tx-grab i{display:block;width:40px;height:5px;border-radius:3px;background:rgba(255,255,255,.42);transition:background .2s,width .3s var(--lg-spring)}
  .sheet.tx-drawer .tx-grab:hover i,.sheet.tx-drag .tx-grab i{background:rgba(255,255,255,.7);width:48px}
  .sheet.tx-drag .tx-grab{cursor:grabbing}
  .sheet.tx-drawer .tx-grab:focus-visible{outline:none}
  .sheet.tx-drawer .tx-grab:focus-visible i{outline:2px solid var(--primary);outline-offset:4px}
  .sheet.tx-drawer .sheet-tx header{flex:none;touch-action:none;cursor:grab;padding-top:0}
  .sheet.tx-drawer .tx-find{flex:none}
  .sheet.tx-drawer .tx-xp{display:grid}
  .sheet.tx-drawer .tx-body{flex:1;min-height:0;max-height:none;touch-action:pan-y;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
    padding-bottom:calc(56px + env(safe-area-inset-bottom));scroll-padding-bottom:calc(56px + env(safe-area-inset-bottom));
    -webkit-mask:linear-gradient(transparent,#000 10px,#000 calc(100% - 28px),transparent);mask:linear-gradient(transparent,#000 10px,#000 calc(100% - 28px),transparent)}
  .sheet.tx-drawer:not(.tx-full) .tx-body{overflow:hidden}
  .sheet.tx-drag *{-webkit-user-select:none;user-select:none}
  /* פס הנגן הקומפקטי: מופיע ככל שהמגירה עולה */
  .sheet.tx-drawer .tx-strip{display:flex;align-items:center;gap:10px;position:fixed;top:0;inset-inline:0;z-index:4;margin:0 auto;max-width:480px;
    padding:calc(8px + var(--st)) 12px 8px;min-height:64px;
    background:linear-gradient(180deg,rgba(10,22,36,.97),rgba(8,18,30,.92));-webkit-backdrop-filter:blur(24px) saturate(160%);backdrop-filter:blur(24px) saturate(160%);
    box-shadow:0 1px 0 rgba(255,255,255,.1);
    opacity:var(--txk,0);transform:translateY(calc((1 - var(--txk,0)) * -14px));pointer-events:none}
  .sheet.tx-full .tx-strip{pointer-events:auto}
  .tx-strip .ic{width:40px;height:40px;color:var(--text)}
  .tx-strip .ic svg{width:26px;height:26px}
  .st-cv .cv{width:40px;height:40px;border-radius:10px;box-shadow:0 0 0 1px rgba(255,255,255,.18)}
  .st-t{flex:1;min-width:0;line-height:1.25}
  .st-t b{display:block;font-weight:700;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .st-t small{display:block;text-align:end;font:500 12.5px/1.4 var(--f-meta);color:var(--muted);font-variant-numeric:tabular-nums}
  .tx-strip .pp{width:44px;height:44px;background:linear-gradient(145deg,#FFD36E,#EDA132);color:#231400;box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 8px 20px -8px rgba(241,136,0,.8)}
  .tx-strip .pp svg{width:22px;height:22px}
  /* מאחורי המגירה הפתוחה — המסך מתעמעם */
  .sheet.tx-drawer .sheet-in{transition:filter .2s}
  .sheet.tx-drawer::before{content:"";position:fixed;inset:0;z-index:2;pointer-events:none;background:rgba(4,10,18,.72);opacity:var(--txk,0)}
}
@media (max-width:1099px) and (min-width:1000px){.sheet.tx-drawer .sheet-tx,.sheet.tx-drawer .tx-strip{max-width:620px}}
/* בלי transform שנשאר אחרי הכניסה — אחרת position:fixed בתוך הנגן (המגירה) היה נגלל איתו */
.sheet:not(.closing){animation-fill-mode:backwards}
/* הודעה עם פעולה (ביטול) */
.toast.act{pointer-events:auto;display:flex;align-items:center;gap:14px;padding-inline-end:8px}
.toast button{flex:none;min-height:34px;padding:0 14px;border-radius:999px;font:700 14px/1 var(--f-meta);color:#231400;background:linear-gradient(145deg,#FFD36E,#EDA132)}
/* תפריט: פעולה הרסנית ואזהרה */
.menu-in>button.danger,.menu-in>button.danger svg{color:#FF8A7A}
.menu-note{margin:0 var(--s3) var(--s3);font-size:14.5px;line-height:1.5;color:var(--muted)}
.menu-note b{color:var(--text);font-weight:700}
/* עדכון זמין */
.upd-pill{position:fixed;z-index:55;top:calc(12px + var(--st));left:50%;transform:translateX(-50%);min-height:40px;padding:0 18px;border-radius:999px;
  font:700 14px/1 var(--f-meta);color:#231400;background:linear-gradient(145deg,#FFD36E,#EDA132);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 12px 28px -10px rgba(0,0,0,.7);
  animation:findIn .4s var(--lg-spring) both}
/* הארכיון — לשונית משלו, בגוון זהב (כמו עמודי הארכיון) */
.tabs a[data-nav=archive].on,.nav-a[data-nav=archive].on{color:#FFE7B0}
.tabs a[data-nav=archive].on svg,.nav-a[data-nav=archive].on svg{color:#F9C24A}
.tabs a[data-nav=archive].on{background:linear-gradient(145deg,rgba(255,201,60,.24),rgba(201,130,30,.14));box-shadow:inset 0 1px 0 rgba(255,231,176,.45),inset 0 0 0 1px rgba(255,214,140,.3)}
.nav-a[data-nav=archive].on{background:linear-gradient(145deg,rgba(255,201,60,.2),rgba(201,130,30,.1));box-shadow:inset 0 1px 0 rgba(255,231,176,.4),inset 0 0 0 1px rgba(255,214,140,.25)}
/* שליחת הקלטה: כפתור פלוס בזכוכית ענבר — במרכז שורת הלשוניות, ובסרגל הצד במחשב */
.tabs a.tab-up{flex:0 0 auto;padding:0 6px;gap:3px}
.tab-up span{display:grid;place-items:center;width:44px;height:44px;margin-top:-2px;border-radius:50%;color:#231400;
  background:linear-gradient(145deg,#FFD36E,#EDA132);box-shadow:inset 0 1px 0 rgba(255,255,255,.65),inset 0 -2px 6px rgba(160,80,0,.35),0 8px 18px -8px rgba(241,136,0,.95);
  transition:transform .4s var(--lg-spring)}
.tabs a.tab-up span svg{width:26px;height:26px;color:#231400}
.tabs a.tab-up{font-size:0;min-width:56px}
.tabs a.tab-up.on{background:none;box-shadow:none}
.tabs a.tab-up.on span{box-shadow:inset 0 1px 0 rgba(255,255,255,.65),0 0 0 3px rgba(8,18,30,.9),0 0 0 5px rgba(249,174,0,.7)}
.tabs a.tab-up:active span{transform:scale(.9)}
.nav-a.nav-up{margin-top:8px;color:var(--text);background:linear-gradient(145deg,rgba(255,201,60,.22),rgba(241,136,0,.1));box-shadow:inset 0 1px 0 rgba(255,255,255,.3),inset 0 0 0 1px rgba(249,174,0,.4)}
.nav-a.nav-up svg{color:#231400;background:linear-gradient(145deg,#FFD36E,#EDA132);border-radius:50%;padding:3px;width:28px;height:28px}
.nav-a.nav-up:hover,.nav-a.nav-up.on{background:linear-gradient(145deg,rgba(255,201,60,.32),rgba(241,136,0,.16))}
@media (prefers-reduced-motion:reduce){.tab-up span{transition:none}}

/* =====================================================================
   שליחת הקלטה (#/upload, upload.js)
   ===================================================================== */
.up-head{display:flex;align-items:center;gap:16px;margin:8px 0 18px}
.up-head .h{margin:0}
.up-head p{margin:4px 0 0;color:var(--muted);font:400 15.5px/1.5 var(--f-meta);max-width:52ch}
.up-badge{flex:none;display:grid;place-items:center;width:60px;height:60px;border-radius:20px;color:#231400;
  background:linear-gradient(145deg,#FFD36E,#EDA132);box-shadow:inset 0 1px 0 rgba(255,255,255,.65),0 16px 30px -14px rgba(241,136,0,.9)}
.up-badge svg{width:32px;height:32px}
.up{display:flex;flex-direction:column;gap:14px;max-width:640px}
.up-seg{display:flex;gap:4px;padding:4px;border-radius:999px;background:rgba(0,0,0,.24);border:1px solid rgba(255,255,255,.14);align-self:flex-start}
.up-seg button{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 18px;border-radius:999px;font:700 15px/1 var(--f-meta);color:var(--muted);transition:background .2s,color .2s}
.up-seg button svg{width:20px;height:20px}
.up-seg button.on{color:#fff;background:rgba(255,255,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
.up-seg button.on svg{color:var(--primary)}
.up-seg button:disabled{opacity:.45}
.up-drop{display:flex;align-items:center;gap:14px;min-height:96px;padding:16px 18px;border-radius:24px;cursor:pointer;
  border:1.5px dashed rgba(255,255,255,.34);transition:border-color .2s,background .2s}
.up-drop:hover,.up-drop:focus-within{border-color:rgba(249,174,0,.75)}
.up-drop.has{border-style:solid;border-color:rgba(249,174,0,.5)}
.up-drop input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.up-dic{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:rgba(249,174,0,.16);color:var(--primary);box-shadow:inset 0 0 0 1px rgba(249,174,0,.35)}
.up-dic svg{width:28px;height:28px}
.up-fn{flex:1;min-width:0}
.up-fn b{display:block;font-weight:800;font-size:17px;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;unicode-bidi:plaintext;text-align:start}
.up-fn small{display:block;color:var(--muted);font:400 14px/1.45 var(--f-meta);margin-top:2px}
.up-drop em{font:700 14px var(--f-meta);font-style:normal;color:var(--warm)}
.up-hint{margin:0;color:var(--muted);font:400 14px/1.5 var(--f-meta);text-align:center}
.up-hint b{color:var(--text)}
.up-rec{display:flex;flex-direction:column;align-items:center;gap:12px;padding:22px 18px 18px;border-radius:26px}
.up-big{display:grid;place-items:center;width:104px;height:104px;border-radius:50%;padding:0;
  background:radial-gradient(circle at 50% 35%,rgba(255,255,255,.18),transparent 60%),rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.25)}
.up-big span{display:grid;place-items:center;width:78px;height:78px;border-radius:50%;color:#fff;
  background:linear-gradient(145deg,#FF6B5A,#D63A2C);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 14px 30px -10px rgba(214,58,44,.9);transition:transform .4s var(--lg-spring)}
.up-big svg{width:38px;height:38px}
.up-big:active span{transform:scale(.92)}
.up-cta{font-weight:800;font-size:19px}
.up-rt{display:flex;align-items:center;gap:10px}
.up-rt b{font:700 34px/1 var(--f-meta);font-variant-numeric:tabular-nums;letter-spacing:.01em}
.up-rt small{color:var(--muted);font:500 14px var(--f-meta)}
.up-dot{width:12px;height:12px;border-radius:50%;background:#FF5A47;box-shadow:0 0 0 4px rgba(255,90,71,.25);animation:recDot 1.2s ease-in-out infinite}
.up-dot.done{background:var(--ok);box-shadow:0 0 0 4px rgba(110,231,183,.2);animation:none}
.up-rec.paused .up-dot{animation:none;background:var(--muted);box-shadow:none}
@keyframes recDot{50%{opacity:.35}}
#upMeter{width:100%;height:64px;display:block}
.up-rb{display:flex;align-items:center;justify-content:center;gap:28px;width:100%}
.up-rb .up-sp{width:48px}
.up-pz{width:48px;height:48px;background:rgba(255,255,255,.12);box-shadow:inset 0 0 0 1px rgba(255,255,255,.2)}
.up-pz svg{width:24px;height:24px}
.up-stop{display:grid;place-items:center;width:72px;height:72px;border-radius:50%;color:#fff;
  background:linear-gradient(145deg,#FF6B5A,#D63A2C);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 14px 30px -10px rgba(214,58,44,.9)}
.up-stop svg{width:30px;height:30px}
.up-rec audio{width:100%;max-width:420px;height:44px;border-radius:999px}
.up-card{border-radius:24px;padding:18px}
.up-form{display:flex;flex-direction:column;gap:16px}
.up-f{display:flex;flex-direction:column;gap:6px}
.up-f>span{font-weight:700;font-size:15.5px}
.up-f em{font-style:normal;font-weight:400;color:var(--faint);font-size:13.5px;margin-inline-start:6px}
.up-f input{height:50px;padding:0 14px;border-radius:14px;border:0;font:500 17px var(--f-body);color:#fff;color-scheme:dark;
  background:rgba(0,0,0,.28);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);outline:none;width:100%;min-width:0}
.up-f input:focus{box-shadow:inset 0 0 0 1px rgba(249,174,0,.75),0 0 0 3px rgba(249,174,0,.2)}
.up-f small{color:var(--muted);font:400 13.5px/1.45 var(--f-meta)}
.btn svg{width:22px;height:22px}
.up-go{min-height:56px;font-size:18px}
.btn.ghost{background:rgba(255,255,255,.1);color:var(--text);box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}
.up-row{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.up-share{margin:2px 0 0;text-align:center}
.up-share .lnk{display:inline-flex;align-items:center;gap:8px}
.up-share .lnk svg{width:18px;height:18px}
.up-prog{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:16px 18px}
.up-ring{width:96px;height:96px;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(closest-side,rgba(8,18,30,.92) 78%,transparent 80% 100%),conic-gradient(#FFD36E var(--p),rgba(255,255,255,.14) 0)}
.up-ring b{font:800 26px/1 var(--f-meta);font-variant-numeric:tabular-nums}
.up-ring small{font-size:14px;font-weight:600;margin-inline-start:1px}
.up-pt{display:flex;flex-direction:column;gap:3px;min-width:0}
.up-pt b{font-size:19px;font-weight:800}
.up-pt span{color:var(--text);font:500 14px var(--f-meta);font-variant-numeric:tabular-nums;text-align:end;align-self:flex-start}
.up-pt small{color:var(--muted);font:400 13.5px/1.45 var(--f-meta)}
.up-pt small.e{color:#FF9B8C}
.up-prog .up-row,.up-prog .up-bar{grid-column:1/-1}
.up-bar{display:block;height:6px;border-radius:3px;background:rgba(255,255,255,.12);overflow:hidden}
.up-bar i{display:block;height:100%;background:linear-gradient(90deg,#FFD36E,#EDA132);transition:width .4s var(--lg-spring);margin-inline-start:0}
.up-prog.err .up-ring{background:radial-gradient(closest-side,rgba(8,18,30,.92) 78%,transparent 80% 100%),conic-gradient(#FF8A7A var(--p),rgba(255,255,255,.14) 0)}
.up-done{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:28px 18px}
.up-ok{display:grid;place-items:center;width:72px;height:72px;border-radius:50%;color:#0B2A1E;background:linear-gradient(145deg,#8EF0C6,#3CC48A);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 14px 30px -12px rgba(60,196,138,.8);animation:pop .7s var(--lg-spring) both}
.up-ok svg{width:40px;height:40px}
.up-done>b{font-size:24px;font-weight:800}
.up-done p{margin:0 0 8px;color:var(--muted);font:400 15px/1.55 var(--f-meta);max-width:44ch}
@media (prefers-reduced-motion:reduce){.up-dot,.up-ok{animation:none}}
/* ארכיון: שנה ← כיתה (שיעור א׳–ד׳, כללי) — אותם פסים כמו השנים */
.ybands.cls .yb-n{font-size:clamp(38px,10vw,58px)}
.yband.gen{border-color:rgba(255,255,255,.2);background:var(--glass-fill)}
.yband.gen .yb-n{color:#fff}
.yhead small a+a{margin-inline-start:0}

/* בחירת גופן (הגדרות): אסיסטנט במקום אופק */
html[data-font=assistant]{--f-body:Assistant,system-ui,"Segoe UI",sans-serif;--f-meta:Assistant,system-ui,sans-serif}
.hello{position:relative}
.hello>div{flex:1;min-width:0}
.hello .set-b{flex:none;width:44px;height:44px;opacity:.75;margin-inline-start:auto;align-self:center;border-radius:50%}
.hello p span{white-space:nowrap}
@media(max-width:430px){.hello{gap:10px}.hello .logo{width:52px;height:52px;border-radius:16px}.hello p{font-size:14px}.hello .set-b{width:40px;height:40px;margin-inline-end:-6px}}
.hello .set-b svg{width:22px;height:22px}
@media(min-width:1100px){.hello .set-b{display:none}}
.fnt-dot{width:18px;height:18px;border-radius:50%;border:2px solid rgba(255,255,255,.55);flex:none;box-sizing:border-box}
.fnt-dot.on{border:5px solid #F9AE00}
.fnt-s{display:block;opacity:.65;font-size:13px;margin-top:2px}
.fnt-on{margin-inline-start:auto;color:#FFD36B;font-size:13px;font-weight:700}

/* תקציר שיעור (שם ותקציר שאושרו בלוח הבקרה) */
.row .sum{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;margin-top:2px;color:var(--muted);font-size:var(--t-meta);line-height:1.45;white-space:normal;max-width:70ch}
@media (max-width:999px){.list:not(.tracks) .row .sum{display:none}}
.sheet-next .row .sum{display:none}
.sheet-sum{margin:var(--s2) 0 var(--s3);color:var(--muted);font-size:14px;line-height:1.55}
.sheet-sum[hidden]{display:none}
.row .t .ref{display:inline-block;margin-inline-end:6px;padding:0 6px;border-radius:6px;background:rgba(249,174,0,.16);color:#FFD36B;font-weight:700;font-size:.85em;line-height:1.5;vertical-align:1px}

/* הכי נשמעים */
.row .meta .plc{display:inline!important;opacity:.8}
.prow{display:flex;align-items:center;gap:var(--s3);text-decoration:none;color:inherit}
.prow .idx{flex:none;min-width:28px;text-align:center}
.prow .lead,.prow .body{flex:1;min-width:0}
.tx-lvl:empty{display:none}

/* ---- מהירות: חלונית זכוכית (לחיצה ארוכה / קליק ימני) ---- */
#pSpeed,#sSpeed{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;overflow:hidden}
.spd-pop{position:fixed;z-index:70;min-width:168px;padding:8px;border-radius:22px;display:flex;flex-direction:column;gap:2px;
  background:linear-gradient(180deg,rgba(26,46,72,.82),rgba(9,19,32,.9));border:1px solid rgba(255,255,255,.24);color:#fff;
  -webkit-backdrop-filter:blur(26px) saturate(170%);backdrop-filter:blur(26px) saturate(170%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 24px 50px -16px rgba(0,0,0,.85);animation:spdIn .32s var(--lg-spring) both}
.spd-pop.out{animation:spdOut .16s ease-in both;pointer-events:none}
@keyframes spdIn{from{opacity:0;transform:scale(.82) translateY(6px)}}
@keyframes spdOut{to{opacity:0;transform:scale(.9)}}
.spd-pop small{padding:4px 12px 6px;font:500 12.5px/1.3 var(--f-meta);color:rgba(255,255,255,.62)}
.spd-pop button{display:flex;align-items:center;gap:8px;height:42px;padding:0 12px;border-radius:14px;font:600 16px/1 var(--f-meta);color:#fff;text-align:start;font-variant-numeric:tabular-nums;transition:background .15s}
.spd-pop button span{direction:ltr;min-width:3.4ch;text-align:end}
.spd-pop button em{font:400 12.5px/1 var(--f-meta);color:rgba(255,255,255,.55);font-style:normal}
.spd-pop button i{margin-inline-start:auto;width:18px;height:18px;border-radius:50%;border:2px solid rgba(255,255,255,.28);transition:all .2s}
.spd-pop button:hover,.spd-pop button:focus-visible{background:rgba(255,255,255,.12);outline:none}
.spd-pop button.on{color:#FFD36B;background:rgba(249,174,0,.16)}
.spd-pop button.on i{border-color:#F9AE00;background:radial-gradient(circle,#F9AE00 0 4px,transparent 5px)}
@media (prefers-reduced-motion:reduce){.spd-pop,.spd-pop.out{animation:none}}
#sSum{white-space:pre-line}

/* אהבתי */
.ic.lk.on,.ic.lk.on svg{color:#FF5C7A}
.ic.lk.on{animation:lkpop .28s ease}
@keyframes lkpop{50%{transform:scale(1.25)}}
.row .acts .ic.lk.on{opacity:1}
@media (min-width:1000px){.row:has(.lk.on) .acts{opacity:1}.row .acts .ic:not(.lk){visibility:visible}}
#sLike{display:inline-flex;align-items:center;gap:4px;width:auto;min-width:44px;padding:0 8px}
#sLike .lkn{font:600 13px/1 var(--f-meta);font-variant-numeric:tabular-nums;color:var(--muted)}
.rn-box{padding:0 var(--s3) var(--s2)}
.rn-in{width:100%;box-sizing:border-box;min-height:48px;padding:0 var(--s3);border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.08);color:var(--text);font:inherit;font-size:var(--t-title)}
.rn-in:focus{outline:2px solid var(--primary);outline-offset:1px}
@media (prefers-reduced-motion:reduce){.ic.lk.on{animation:none}}
.backdrop{inset:-6vh 0;transform:translate3d(0,var(--py,0px),0) scale(var(--pz,1.06));transform-origin:50% 30%;will-change:transform;transition:transform .12s linear}
@media (prefers-reduced-motion:reduce){.backdrop{transform:none;inset:0}}
/* טלפון (לאורך): תמונה חדה בחיתוך לאורך סביב פינת הבניין */
@media (orientation:portrait){:root{--romano:url(img/romano-p.jpg)}}
@supports (background-image:image-set(url("img/romano-p.avif") type("image/avif"))){@media (orientation:portrait){:root{--romano:image-set(url("img/romano-p.avif") type("image/avif"),url("img/romano-p.jpg") type("image/jpeg"))}}}

/* ===== עיצוב רגוע: בית, עמוד רב, ארכיון ===== */
.hello{margin-bottom:var(--s4)}
.hello p{font-size:16px}
.hero{margin:var(--s3) 0 var(--s2);padding:16px}
.hero .cv{width:92px;height:92px;border-radius:22px}
.hero b{font-size:22px}
.sec{margin:var(--s7,36px) 0 var(--s2)}
.rstrip{display:flex;gap:6px;overflow-x:auto;scroll-snap-type:x proximity;margin:0 calc(-1*var(--gutter));padding:4px var(--gutter) 8px;scrollbar-width:none}
.rstrip::-webkit-scrollbar{display:none}
.rcard{flex:none;width:112px;display:flex;flex-direction:column;align-items:center;gap:8px;padding:10px 4px;border-radius:20px;text-align:center;scroll-snap-align:start;transition:transform .3s var(--lg-spring),background .2s}
.rcard:hover{background:var(--hover);transform:translateY(-3px)}
.rcard:active{transform:scale(.95)}
.rcard .cv{width:96px;height:96px;box-shadow:var(--sh-2),0 0 0 2px rgba(255,255,255,.22)}
.rcard b{font-size:15px;font-weight:700;line-height:1.3;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.rcard small{color:var(--muted);font-size:13px;margin-top:-6px}
@media (min-width:1000px){.rcard{width:140px}.rcard .cv{width:120px;height:120px}.rcard b{font-size:16px}}
.rstrip.sm .rcard{width:84px;padding:6px 2px;gap:6px}
.rstrip.sm .rcard .cv{width:64px;height:64px}
.rstrip.sm .rcard b{font-size:13px;font-weight:600}
.homelinks{display:flex;flex-wrap:wrap;gap:var(--s2);margin:var(--s6) 0 0}
.homelinks a{display:inline-flex;align-items:center;min-height:44px;padding:0 var(--s4);border-radius:14px;background:var(--glass-fill);border:1px solid rgba(255,255,255,.18);font-weight:700;font-size:15px}
.homelinks a:hover{background:var(--hover)}
.arch-strip{padding:6px 16px;min-height:56px;margin:var(--s4) 0 0;border-radius:18px;background:var(--glass-fill);border-color:rgba(255,255,255,.18)}
.arch-strip .as-ic{width:36px;height:36px;border-radius:12px}
.arch-strip .as-ic svg{width:20px;height:20px}
.arch-strip .as-t b{font-size:17px}

/* עמוד רב */
.rhead{display:flex;align-items:center;gap:var(--s4);padding:var(--s2) 0 var(--s4)}
.rhead .cv{width:72px;height:72px;box-shadow:var(--sh-2),0 0 0 2px rgba(255,255,255,.22)}
.rhead h1{flex:1;margin:0;font-size:clamp(28px,6vw,48px);font-weight:700;letter-spacing:-.015em;line-height:1.15}
.rhead .ic{color:var(--muted)}
.seg{display:inline-flex;max-width:100%;overflow-x:auto;gap:4px;padding:4px;margin:0 0 var(--s5);border-radius:18px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);scrollbar-width:none}
.seg::-webkit-scrollbar{display:none}
.seg a{flex:none;display:inline-flex;align-items:center;min-height:44px;padding:0 var(--s4);border-radius:14px;font-weight:700;font-size:15px;color:var(--muted);transition:background .2s,color .2s}
.seg a:hover{color:var(--text)}
.seg a.on{background:linear-gradient(145deg,#FFD36E,#EDA132);color:#231400}
@media (hover:none){.grid.albums.pl .fab{display:grid;opacity:1;transform:none;width:44px;height:44px}}
.grid.albums.pl .fab{opacity:1;transform:none}
.singles{margin-top:var(--s6)}
.singles summary{display:flex;align-items:center;justify-content:space-between;min-height:56px;padding:0 var(--s4);border-radius:18px;background:var(--glass-fill);border:1px solid rgba(255,255,255,.18);cursor:pointer;font-weight:700;font-size:17px;list-style:none}
.singles summary::-webkit-details-marker{display:none}
.singles summary em{font-style:normal;color:var(--muted);font-weight:500}
.singles[open] summary{margin-bottom:var(--s2)}

/* סדרה: כפתור ניגון גדול */
.acts-row{gap:var(--s4);padding:var(--s2) 0 var(--s5)}
.acts-row .bigplay{width:72px;height:72px}
.acts-row .bigplay svg{width:36px;height:36px}
.acts-row .resume{font-size:20px;font-weight:700;color:var(--text);flex:1}
.row .sum{-webkit-line-clamp:1}
@media (max-width:999px){.row .sum{display:none}}

/* ארכיון */
.yhead h1{font-size:clamp(40px,9vw,64px)}
.yrows{display:grid;gap:var(--s3)}
.yrow{border-radius:26px;padding:var(--s3) var(--s4);display:grid;gap:var(--s2);grid-template-columns:minmax(0,1fr)}
.yr-main{display:flex;align-items:center;gap:var(--s4);min-height:64px}
.yr-main .yb-n{font-size:clamp(40px,10vw,56px);font-weight:200;line-height:1;color:#FFE7B0;letter-spacing:-.02em}
.yr-main .yb-c{flex:1;font:500 15px/1.4 var(--f-meta);color:var(--muted)}
.yrow .rstrip{margin:0 calc(-1*var(--s4));padding:2px var(--s4) 4px}
@media (min-width:1000px){
  .yrow{grid-template-columns:260px minmax(0,1fr);align-items:center;gap:var(--s5)}
  .yr-main{flex-direction:column;align-items:flex-start;gap:var(--s1)}
  .yr-main .as-go{display:none}
  .yrow .rstrip{margin:0;padding:2px 0 4px}
}
.tx-plain p{margin:0 0 .9em;line-height:1.85;color:rgba(255,255,255,.88)}

/* ---- שיעור וידאו (יוטיוב בלבד): הסרטון במקום העטיפה; בנגן הקטן — תמונת הסרטון ותג ---- */
.yt-box{width:min(92vw,640px);aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:#000;box-shadow:var(--sh-3)}
.yt-box iframe,.yt-box>div{width:100%;height:100%;border:0;display:block}
.sheet-in:has(.sheet-tx:not([hidden])) .yt-box{width:min(92vw,560px)}
.np-cover{position:relative}
.np-cover .yt-thumb{display:block;background:#000 center/cover no-repeat}
.vbadge{position:absolute;inset-inline-end:-3px;bottom:-3px;width:18px;height:18px;border-radius:50%;background:#e53935;display:grid;place-items:center;box-shadow:0 1px 3px rgba(0,0,0,.4)}
.vbadge svg{width:11px;height:11px;fill:#fff}
.txb.vtag{background:rgba(229,57,53,.16);color:#ff8a80}
.sheet.is-video #sDl,.player.is-video #pDl,.sheet.is-video #sTools{display:none}
#sYt svg{fill:#ff5a52}

/* ---- מתג וידאו / אודיו בלבד (נגן מלא) ---- */
.avsw{display:flex;justify-self:center;align-self:center;gap:2px;padding:3px;margin:0 auto 10px;border-radius:999px;background:rgba(255,255,255,.12);width:max-content;max-width:100%}
.avsw button{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 14px;border:0;border-radius:999px;background:transparent;color:inherit;font:600 13px/1 var(--f-meta,inherit);cursor:pointer;opacity:.75}
.avsw button svg{width:16px;height:16px;fill:currentColor}
.avsw button[aria-pressed=true]{background:#fff;color:#111;opacity:1}
.avsw[hidden]{display:none}
.sheet.yt-on .cv-art{display:none}
/* וידאו במצב אודיו בלבד: הנגן ממשיך לרוץ בתמונה קטנה וגלויה (לפחות 200px גובה, כנדרש ביוטיוב) מתחת לכיסוי הגדול */
.sheet.yt-mini #sCover{display:flex;flex-direction:column;align-items:center;gap:12px}
.sheet.yt-mini #sCover .cv{width:min(70vw,300px,26vh);height:min(70vw,300px,26vh)}
.sheet.yt-mini #sCover .yt-box{width:min(100%,356px);height:200px;aspect-ratio:auto;border-radius:12px;box-shadow:var(--sh-2,0 4px 14px rgba(0,0,0,.4))}
/* מסך נמוך: העטיפה והסרטון הקטן לא נכנסים יחד (העטיפה נחתכה למעלה) — רק הסרטון הקטן */
@media (max-height:760px){.sheet.yt-mini #sCover .cv{display:none}.sheet.yt-mini #sCover .yt-box{height:min(200px,30vh)}}

/* חיפוש: "מומלץ" — הסדרה המלאה ביותר */
.rec{position:relative;display:grid;grid-template-columns:132px 1fr;gap:18px;align-items:center;margin:14px 0 22px;padding:16px;border-radius:22px;overflow:hidden;
  /* cm-fallback */
  background:linear-gradient(135deg,var(--a),var(--b));
  background:linear-gradient(135deg,color-mix(in srgb,var(--a) 55%,transparent),color-mix(in srgb,var(--b) 70%,transparent));box-shadow:0 18px 44px -22px var(--b)}
.rec::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 80% at 100% 0,rgba(255,255,255,.16),transparent 60%);pointer-events:none}
.rec-art{display:block;width:132px;aspect-ratio:1;border-radius:14px;overflow:hidden;box-shadow:0 10px 28px rgba(0,0,0,.35)}
.rec-art>*{width:100%;height:100%}
.rec-b{display:flex;flex-direction:column;gap:6px;min-width:0;position:relative;z-index:1;color:#fff}
.rec-tag{align-self:flex-start;font-size:13px;font-weight:800;letter-spacing:.02em;padding:3px 10px;border-radius:999px;background:rgba(255,255,255,.2)}
.rec-t{font-size:clamp(22px,5vw,30px);font-weight:800;line-height:1.15;color:#fff}
.rec-m{font-size:15px;opacity:.9}
.rec-f{display:flex;flex-wrap:wrap;gap:6px}.rec-f i{font-style:normal;font-size:13px;font-weight:700;padding:2px 9px;border-radius:999px;background:rgba(0,0,0,.22)}
.rec-a{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.rec-a .btn{min-height:42px}.rec-a .btn:not(.pri){background:rgba(255,255,255,.16);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}
.rec-y{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:2px}.rec-y small{opacity:.85}
.rec-y .chip{background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.25)}
@media (max-width:560px){.rec{grid-template-columns:96px 1fr;gap:12px;padding:12px}.rec-art{width:96px}}
/* שלי */
.mylist .gh{display:flex;align-items:center;gap:10px}.mylist .gh-a{margin-inline-start:auto;display:flex;gap:6px}
.ic.on svg{fill:var(--accent)}
.pad{padding:8px 14px}

/* ---- רענון: תמונות רבנים, כותרות, כרטיסים ---- */
.cv.ph img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.02)}
.cv.ph{background:#0b1a2b}
.card .art .cv.ph::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(4,12,22,.55));pointer-events:none}
.rcard .cv{/* cm-fallback */box-shadow:0 0 0 3px rgba(255,255,255,.9),0 0 0 6px var(--warm),0 10px 26px rgba(0,0,0,.35);box-shadow:0 0 0 3px rgba(255,255,255,.9),0 0 0 6px color-mix(in srgb,var(--warm) 70%,transparent),0 10px 26px rgba(0,0,0,.35)}
.rcard .cv.ph{box-shadow:0 0 0 3px rgba(255,255,255,.95),0 0 0 6px var(--warm),0 12px 28px rgba(0,0,0,.4)}
.sec h2{position:relative;padding-inline-start:14px}
.sec h2::before{content:"";position:absolute;inset-inline-start:0;top:.18em;bottom:.18em;width:5px;border-radius:4px;background:linear-gradient(180deg,#FFD36E,#EDA132)}
.shelf .card{transition:transform .18s ease}
.shelf .card:hover{transform:translateY(-3px)}
.card .art .cv{box-shadow:0 12px 28px -10px rgba(0,0,0,.55)}
.hello .h{font-size:clamp(28px,7vw,40px);letter-spacing:-.01em}
.cv.alb .alb-ph{position:absolute;inset-inline-start:7%;bottom:7%;width:34%;aspect-ratio:1;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px rgba(255,255,255,.9),0 6px 16px rgba(0,0,0,.4)}

/* ===== דף הבית — עיצוב חדש ===== */
.home-search{display:flex;align-items:center;gap:10px;margin:14px 0 4px;padding:0 18px;height:52px;border-radius:999px;
  background:rgba(255,255,255,.12);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.22),0 12px 30px -16px rgba(0,0,0,.6);color:rgba(255,255,255,.82);font:500 16px/1 var(--f-meta)}
.home-search svg{width:22px;height:22px;fill:currentColor;opacity:.9}
.home-search:active{transform:scale(.99)}
.feat{position:relative;display:grid;grid-template-columns:minmax(120px,38%) 1fr;gap:16px;align-items:center;margin:6px 0 14px;padding:14px;border-radius:24px;overflow:hidden;isolation:isolate;
  /* cm-fallback */
  background:linear-gradient(135deg,var(--a),var(--b));
  background:linear-gradient(135deg,color-mix(in srgb,var(--a) 60%,#06121f),color-mix(in srgb,var(--b) 80%,#03080f));box-shadow:0 22px 50px -24px rgba(0,0,0,.8)}
.feat-bg{position:absolute;inset:-30px;z-index:-1;background-size:cover;background-position:center;filter:blur(28px) saturate(1.4) brightness(.55);transform:scale(1.1)}
.feat-art{display:block;aspect-ratio:1;border-radius:16px;overflow:hidden;box-shadow:0 14px 34px rgba(0,0,0,.5)}
.feat-art>.cv{width:100%;height:100%;border-radius:16px}
.feat-b{display:flex;flex-direction:column;gap:6px;min-width:0;color:#fff}
.feat-tag{align-self:flex-start;font:800 12px/1 var(--f-meta);letter-spacing:.04em;padding:5px 10px;border-radius:999px;background:linear-gradient(145deg,#FFD36E,#EDA132);color:#231400}
.feat-t{font-size:clamp(22px,6vw,32px);font-weight:800;line-height:1.1;color:#fff}
.feat-m{display:flex;align-items:center;gap:8px;font-size:15px;opacity:.92}
.feat-m img{width:28px;height:28px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px rgba(255,255,255,.85)}
.feat-f{font:600 13px/1.3 var(--f-meta);opacity:.8}
.feat-a{display:flex;align-items:center;gap:8px;margin-top:4px}
.feat-a .btn{min-height:44px}.feat-a .ic{width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.14);color:#fff}
.feat-a .ic svg{fill:#fff}
.shelf.big{grid-auto-columns:clamp(150px,44vw,210px)}
/* חדש השבוע / שיעורים: כרטיסים עם עומק */
.card .art{border-radius:18px}
.card .art .cv{border-radius:18px}
.card b{margin-top:2px}
@media (min-width:900px){.feat{grid-template-columns:240px 1fr;padding:20px}}
.adm-up{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}
/* כרטיס סדרה (אריח): תמונת הרב ישרה, משמאל למטה; הטקסט לא נכנס מתחתיה */
.tile{padding-inline-end:92px}
.tile .cv{transform:none;inset-inline-start:auto;inset-inline-end:10px;bottom:10px;width:72px;height:72px;border-radius:14px;z-index:0;box-shadow:0 8px 18px rgba(0,0,0,.35)}
.tile .cv.ph{box-shadow:0 0 0 2px rgba(255,255,255,.85),0 8px 18px rgba(0,0,0,.35)}
/* התחברות */
.acct-box{display:flex;flex-direction:column;gap:var(--s3);padding:var(--s5);border-radius:22px;max-width:460px;margin:var(--s4) 0}
.acct-box p{margin:0}
.acct-box .gbtn{background:#fff;color:#1f1f1f;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.acct-box form{display:flex;flex-direction:column;gap:var(--s2)}
.acct-box input{min-height:48px;border-radius:14px;padding:0 var(--s4);border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.06);color:#fff;font:inherit;font-size:16px;direction:rtl;text-align:right}
/* מייל וסיסמה: מקלידים משמאל לימין, אבל השדה מיושר לימין כמו כל הדף */
.acct-box input:not(:placeholder-shown){direction:ltr;text-align:right;unicode-bidi:plaintext}
.acct-box input::placeholder{color:rgba(255,255,255,.82);opacity:1;font-weight:400}
.acct-box input:focus{outline:none;border-color:var(--gold,#E8B54D);background:rgba(255,255,255,.1)}
.acct-box,.acct-box p,.acct-box .lnk{color:#fff;text-align:right}
.acct-or{display:flex;align-items:center;gap:var(--s3);color:rgba(255,255,255,.85);font-size:14px}
.acct-or::before,.acct-or::after{content:"";flex:1;height:1px;background:var(--line)}
.acct-box .btn:not(.pri):not(.gbtn){background:transparent;color:var(--text);box-shadow:inset 0 0 0 1px var(--line)}
.acct-strip{margin:var(--s3) 0 var(--s4)}

.hol-ic{color:var(--accent)}

/* פרטים קטנים: אחרי תגית (תמלול / וידאו) אין נקודה מפרידה; "לפי הסדר" בשורה אחת */
.row .meta>.txb+span::before,.row .meta>.ok+span::before{content:none;margin:0}
.row .meta>.txb,.row .meta>.ok{margin-inline-end:6px}
.sort{white-space:nowrap}

/* ===== סבב עיצוב: אור מן האבן =====
   טקסט מודגש (קישורים, תוויות) — שמנת חמה, לא צהוב על כחול. הזהב שמור לכפתור הניגון ולהתקדמות. */
:root{--cream:#F6E9CF}
.sec a,.hero small,.as-t small{color:var(--cream)}
.as-t small{letter-spacing:0;font-weight:500;opacity:.85}
/* כפתור הניגון: אור מבפנים והילה זהובה */
.bigplay,.page-in.arch .bigplay{background:radial-gradient(circle at 35% 30%,#FFE9A8 0%,#F7C255 45%,#E39A2B 100%);color:#231400;
  box-shadow:0 8px 24px -4px rgba(242,169,59,.55),0 0 0 1px rgba(255,255,255,.35) inset,0 1px 0 rgba(255,255,255,.7) inset}
/* "להמשיך להאזין": הכרטיס בצבעי העטיפה, וההתקדמות — טבעת סביב כפתור הניגון */
.hero.tint{/* cm-fallback */background:linear-gradient(225deg,var(--a),var(--b));background:linear-gradient(225deg,color-mix(in srgb,var(--a) 90%,transparent),color-mix(in srgb,color-mix(in srgb,var(--b) 65%,#06121f) 95%,transparent));
  border:1px solid rgba(255,255,255,.2);box-shadow:0 14px 34px -14px rgba(0,0,0,.6);backdrop-filter:none;-webkit-backdrop-filter:none;color:#fff}
.hero.tint::after{display:none}
.hero.tint .hm{color:rgba(255,255,255,.85)}
.hero.tint .hbar{display:none}
.hero .ringp{flex:none;display:grid;place-items:center;width:68px;height:68px;border-radius:50%;
  background:conic-gradient(#FFD98A calc(var(--p)*1%),rgba(255,255,255,.2) 0);-webkit-mask:radial-gradient(circle,transparent 0,transparent 0) ;mask:none;position:relative}
.hero .ringp::before{content:"";position:absolute;inset:3px;border-radius:50%;/* cm-fallback */background:var(--b);background:color-mix(in srgb,var(--b) 60%,#06121f)}
.hero .ringp .bigplay{position:relative;width:52px;height:52px}

/* בלי צהוב על כחול: טקסט מודגש בשמנת, הלשונית הנבחרת בלבן */
html:root:not(#x){--warm:#F6E9CF}
.tabs a.on svg{color:#fff}

/* ===== מצב קל (אייפון / מעט זיכרון): בלי טשטוש רקע — משטחים אטומים למחצה, בלי ברק נע ===== */
.lowfx *,.lowfx *::before,.lowfx *::after{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.lowfx .glass,.lowfx .tabs,.lowfx .player,.lowfx .sheet,.lowfx .menu,.lowfx .home-search,.lowfx .chip,.lowfx .list:not(.group .list){background-color:rgba(18,36,58,.86)}
.lowfx .glass::after{display:none}
.lowfx .page-in{animation:none}
/* דף הבית מהפעם הקודמת, עד שהספרייה נטענת */
#page.pre{pointer-events:auto}

/* ===== מסכים צרים וטקסט גדול: שום כפתור לא נמתח, ושום שם לא נחתך באמצע ===== */
.bigplay,.fab,.ic{flex:none;aspect-ratio:1}
.acts-row{flex-wrap:wrap;row-gap:var(--s2)}
.acts-row .sort{margin-inline-start:auto}
@media (max-width:700px){
  /* שם שיעור: עד שתי שורות במקום חיתוך בשלוש נקודות */
  .row .t{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .card b,.card .ct{overflow-wrap:anywhere}
}
@media (max-width:380px){
  .hero{gap:var(--s3);padding:12px}
  .hero .cv{width:60px;height:60px;border-radius:14px}
  .hero b{font-size:17px}
  .hero .ringp{width:58px;height:58px}.hero .ringp .bigplay{width:44px;height:44px}
  .hero .hm{white-space:normal}
  .acts-row{gap:var(--s2)}
  .acts-row .bigplay{width:60px;height:60px}
  .tabs a{font-size:11px}
}
@media (max-width:420px){ .acts-row .resume{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.25;min-width:5.5em} }

.row .meta>.txb.nt{background:rgba(255,255,255,.12);color:var(--muted);flex-shrink:1;min-width:0}

/* דף חג: כותרת לכל רב עם התמונה שלו */
.sec.rsec{gap:12px;scroll-margin-top:80px}
.sec.rsec .cv{width:44px;height:44px;flex:none}
.sec.rsec h2{flex:1;min-width:0}
button.rcard{background:none;border:0;color:inherit;font:inherit;cursor:pointer;padding:0}

/* מנהל: עורך תמונה / סדר ותאריכים */
.ped{border:0;border-radius:20px;padding:0;width:min(560px,calc(100vw - 32px));max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);color:var(--text);background:var(--card);box-shadow:var(--sh-3)}
.ped::backdrop{background:var(--scrim,rgba(4,10,18,.55))}
.ped form{display:flex;flex-direction:column;gap:12px;padding:20px;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);box-sizing:border-box}
.ped h3{margin:0;font-size:var(--t-h3)}
.ped canvas{width:100%;max-width:360px;aspect-ratio:1;align-self:center;border-radius:16px;background:var(--raise)}
.ped label{display:grid;gap:4px;font-size:var(--t-meta);color:var(--muted)}
.ped input[type=range]{width:100%}
.ped-st{margin:0;min-height:1.2em;font-size:var(--t-meta);color:var(--muted);text-align:center}
.ped-seg{display:flex;flex-wrap:wrap;gap:8px}
.ped-seg button{flex:1 1 auto;min-height:40px;padding:0 12px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--text);font:inherit;cursor:pointer}
.ped-seg button[aria-pressed=true]{background:var(--primary);color:var(--onPrimary);border-color:transparent}
.ped-act{display:flex;gap:8px;justify-content:flex-start;padding-top:4px}
.ord form{min-height:0}
.o-list{list-style:none;margin:0;padding:0;overflow:auto;min-height:0;flex:1;display:grid;gap:6px}
.o-list li{display:grid;grid-template-columns:28px minmax(0,1fr) auto;grid-template-areas:"n t mv" "n d mv";gap:4px 8px;align-items:center;padding:8px 10px;border-radius:12px;background:var(--raise)}
.o-n{grid-area:n;font-variant-numeric:tabular-nums;color:var(--muted);text-align:center}
.o-t{grid-area:t;min-width:0;display:grid}
.o-t b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.o-t small{color:var(--muted);font-size:13px}
.o-d{grid-area:d;min-width:0;height:34px;border-radius:8px;border:1px solid var(--line);background:var(--card);color:var(--text);padding:0 8px;font:inherit;font-size:14px}
.o-mv{grid-area:mv;display:flex;flex-direction:column;gap:2px}
.o-mv .ic{width:36px;height:30px;border-radius:8px;border:0;background:transparent;color:var(--text);cursor:pointer}
.o-mv .ic:disabled{opacity:.25;cursor:default}

/* הנגן: "מתנגן מתוך" ושם הסדרה — קישורים */
.sheet-from a{display:block;font-weight:700;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:inherit;text-decoration:none}
.sheet-from a:hover{text-decoration:underline}
#sSer:not([hidden]){display:block;margin-top:2px;font-size:15px}
#sRabbi:hover,#sSer:hover{opacity:1;text-decoration:underline}

/* תפריטים: נפתחים בקפיץ רך ונסגרים בירידה */
.menu-in{animation:menuUp .34s cubic-bezier(.22,1,.36,1) both}
.menu.closing{animation:menuFade .19s ease-in both}
.menu.closing .menu-in{animation:menuDown .19s ease-in both}
@keyframes menuUp{from{transform:translateY(28px);opacity:0}}
@keyframes menuDown{to{transform:translateY(28px);opacity:0}}
@keyframes menuFade{to{opacity:0}}
/* לשוניות: המעבר בין לשוניות חלק */
.tabs a{transition:color .22s ease,background-color .28s cubic-bezier(.22,1,.36,1),box-shadow .28s ease}
.tabs a.on svg{animation:tabPop .32s cubic-bezier(.22,1.4,.36,1)}
@keyframes tabPop{from{transform:scale(.82)}}
@media (prefers-reduced-motion:reduce){.menu-in,.menu.closing,.menu.closing .menu-in,.tabs a.on svg{animation:none}}

/* חלון ההתקנה */
.inst-pop{display:flex;gap:14px;align-items:flex-start;padding:14px 12px 12px;border-bottom:1px solid var(--line);margin-bottom:8px}
.inst-pop img{border-radius:14px;flex:none}
.inst-pop b{display:block;font-size:17px;line-height:1.35;margin-bottom:4px}
.inst-pop p,.inst-pop small{margin:4px 0 0;color:var(--muted);font-size:14.5px;line-height:1.55}
.inst-pop ol{margin:6px 0 4px;padding-inline-start:20px;font-size:15px;line-height:1.7}
.inst-pop ol b{display:inline;font-size:inherit;margin:0}

.name-sug{display:block;margin:6px 0 0;font-size:14px;color:var(--primary);text-align:start}
.inst-pop svg{display:inline-block;vertical-align:-3px}

/* ---- חלון ההתקנה ---- */
.ipop{position:fixed;inset:0;z-index:60;display:flex;align-items:flex-end;justify-content:center;padding:0 10px calc(10px + env(safe-area-inset-bottom));background:rgba(4,10,18,.62);animation:ipFade .25s ease both}
.ipop.out{animation:ipFade .2s ease-in reverse both}
.ipop-card{position:relative;width:100%;max-width:420px;border-radius:28px;padding:30px 20px 14px;text-align:center;color:#fff;
  background:radial-gradient(120% 60% at 50% -10%,rgba(249,174,0,.16),transparent 60%),linear-gradient(180deg,rgba(22,44,70,.97),rgba(9,22,38,.98));
  border:1px solid rgba(255,255,255,.14);box-shadow:0 30px 60px -20px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.12);animation:ipUp .42s cubic-bezier(.22,1,.36,1) both}
.ipop.out .ipop-card{animation:ipUp .2s ease-in reverse both}
@keyframes ipFade{from{opacity:0}}
@keyframes ipUp{from{transform:translateY(40px) scale(.98);opacity:0}}
.ipop-x{position:absolute;top:12px;inset-inline-end:12px;width:36px;height:36px;border-radius:50%;border:0;background:rgba(255,255,255,.08);color:rgba(255,255,255,.75);display:grid;place-items:center;cursor:pointer}
.ipop-x svg{width:18px;height:18px;fill:currentColor}
.ipop-icon{width:84px;height:84px;margin:0 auto 14px;border-radius:22px;padding:6px;background:linear-gradient(145deg,rgba(255,255,255,.18),rgba(255,255,255,.04));box-shadow:0 12px 30px -8px rgba(249,174,0,.45),inset 0 1px 0 rgba(255,255,255,.3)}
.ipop-icon img{width:72px;height:72px;border-radius:17px;display:block}
.ipop-card h2{margin:0;font-size:21px;font-weight:700;line-height:1.3}
.ipop-sub{margin:6px auto 0;max-width:30ch;font-size:14.5px;line-height:1.5;color:rgba(255,255,255,.72)}
.ipop-perks{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;list-style:none;margin:18px 0 6px;padding:0}
.ipop-perks li{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 4px;border-radius:16px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.07);font-size:12.5px;line-height:1.3;color:rgba(255,255,255,.82)}
.ipop-perks svg{width:22px;height:22px;fill:#F9AE00}
.ipop-steps{list-style:none;margin:14px 0 4px;padding:0;display:grid;gap:8px;text-align:start}
.ipop-steps li{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:16px;background:rgba(255,255,255,.06);font-size:15px;line-height:1.4}
.ipop-steps li span{flex:1;min-width:0}
.ipop-steps li b{color:#fff;font-weight:700}
.ipop-steps i{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-weight:700;font-size:14px;color:#231400;background:#F9AE00}
.ipop-steps em{flex:none;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:rgba(10,132,255,.16);color:#4DA3FF}
.ipop-steps em.ok{background:rgba(52,199,89,.16);color:#4CD964}
.ipop-steps em svg{width:22px;height:22px;fill:currentColor}
.ipop-steps.sm li{padding:9px 12px;font-size:14px;color:rgba(255,255,255,.8)}
.ipop-note{margin:12px 0 0;padding:10px 12px;border-radius:14px;background:rgba(249,174,0,.12);color:#FFE2A0;font-size:14px;line-height:1.5}
.ipop-go{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:52px;margin-top:14px;border-radius:16px;font-size:17px;font-weight:700;text-decoration:none}
.ipop-go svg{width:22px;height:22px;fill:currentColor}
.ipop-meta{margin:8px 0 0;font-size:13px;color:rgba(255,255,255,.6)}
.ipop-never{margin-top:8px;border:0;background:none;color:rgba(255,255,255,.55);font:inherit;font-size:13.5px;padding:10px 14px;cursor:pointer}
@media (prefers-reduced-motion:reduce){.ipop,.ipop-card,.ipop.out,.ipop.out .ipop-card{animation:none}}

.ipop-card{max-height:calc(100vh - 20px - env(safe-area-inset-bottom) - var(--st));max-height:calc(100dvh - 20px - env(safe-area-inset-bottom) - var(--st));overflow-y:auto;overscroll-behavior:contain;padding:24px 18px 10px}
.ipop-icon{width:72px;height:72px;border-radius:19px;padding:5px;margin-bottom:12px}
.ipop-icon img{width:62px;height:62px;border-radius:15px}
.ipop-card h2{font-size:20px}
.ipop-perks{margin:14px 0 4px}
.ipop-perks li{padding:9px 4px;font-size:12px}
.ipop-steps{gap:7px;margin-top:12px}
.ipop-steps li{padding:9px 11px;font-size:14.5px}
.ipop-steps em{width:34px;height:34px}
.ipop-go{min-height:50px;margin-top:12px}
@media (max-height:700px){.ipop-perks{display:none}.ipop-sub{margin-top:4px}}
.ipop-sub,.ipop-card h2,.ipop-perks li span{text-wrap:balance}

/* ---- מחשב: אותו מראה כמו בטלפון ---- */
@media (min-width:1000px){
  /* סרגל הצד — אותה זכוכית כהה כמו סרגל הלשוניות בטלפון */
  .panel.nav,.panel.lib{background:linear-gradient(180deg,rgba(10,26,44,.62),rgba(8,20,34,.7)),var(--glass-fill)}
  .nav-a{color:rgba(255,255,255,.72)}
  .nav-a:hover{background:rgba(255,255,255,.07);color:#fff}
  .nav-a.on{color:#fff;background:rgba(255,255,255,.16)}
  /* בבית: חיפוש אחד (הגדול שבתוך הדף) */
  .at-home .tb-search{visibility:visible}
  /* רבנים בבית: עיגולים בגודל סביר */
  .rcard{width:124px}.rcard .cv{width:100px;height:100px}.rcard b{font-size:15px}
}

/* מסך נמוך: תפריט צפוף יותר */
@media (min-width:1000px) and (max-height:820px){
  .nav-a{padding:7px 12px;font-size:16px}
  .nav-a svg{width:22px;height:22px}
  .brand{padding-block:6px}
  .s-item{padding:6px 8px}
  .s-item .cv{width:40px;height:40px}
}

/* ---- עורך התמונה: חיתוך בגרירה ---- */
.ped-cv{position:relative;align-self:center;width:100%;max-width:360px;aspect-ratio:1;border-radius:16px;overflow:hidden;touch-action:none}
.ped-cv canvas{max-width:none;width:100%;height:100%;cursor:grab;display:block}
.ped.dragging .ped-cv canvas{cursor:grabbing}
.ped-grid{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .2s;
  background:linear-gradient(90deg,transparent calc(33.33% - .5px),rgba(255,255,255,.55) calc(33.33% - .5px),rgba(255,255,255,.55) calc(33.33% + .5px),transparent calc(33.33% + .5px),transparent calc(66.66% - .5px),rgba(255,255,255,.55) calc(66.66% - .5px),rgba(255,255,255,.55) calc(66.66% + .5px),transparent calc(66.66% + .5px)),
  linear-gradient(0deg,transparent calc(33.33% - .5px),rgba(255,255,255,.55) calc(33.33% - .5px),rgba(255,255,255,.55) calc(33.33% + .5px),transparent calc(33.33% + .5px),transparent calc(66.66% - .5px),rgba(255,255,255,.55) calc(66.66% - .5px),rgba(255,255,255,.55) calc(66.66% + .5px),transparent calc(66.66% + .5px));
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.7)}
.ped.dragging .ped-grid,.ped-cv:hover .ped-grid{opacity:1}
.ped-hint{margin:-4px 0 0;text-align:center;font-size:13px;color:var(--muted)}

/* ---- סרגל הצד במחשב: הרבנים — בריחוף העכבר נפתח חלון צף קטן, משבצות עם תמונות ---- */
@media (min-width:1000px){
  .side{position:relative;z-index:30;overflow:visible}
  .lib-slot{position:relative;flex:1;min-height:150px;z-index:20}
  .lib-slot .panel.lib{position:absolute;top:0;right:0;width:100%;height:100%;display:flex;flex-direction:column;
    transition:width .45s cubic-bezier(.22,1,.36,1),height .45s cubic-bezier(.22,1,.36,1),top .45s cubic-bezier(.22,1,.36,1),box-shadow .35s,background .35s}
  .lib-slot .side-list{overflow-y:auto;scroll-behavior:smooth;overscroll-behavior:contain;
    -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 12px,#000 calc(100% - 24px),transparent);mask-image:linear-gradient(180deg,transparent 0,#000 12px,#000 calc(100% - 24px),transparent)}
  /* פתוח: חלון קטן שצף שמאלה — לא יותר מ-600 גובה, ונשאר בתוך המסך */
  .lib-slot.open .panel.lib{width:min(470px,40vw);top:var(--libDy,0px);height:var(--libH,560px);
    background:linear-gradient(180deg,rgba(12,30,50,.88),rgba(7,18,32,.94)),var(--glass-fill);
    box-shadow:-24px 20px 70px -20px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.14),inset 0 1px 0 rgba(255,255,255,.16)}
  .lib-slot.open .side-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));grid-auto-rows:max-content;gap:8px;align-content:start;padding:4px 4px 20px}
  .lib-slot.open .s-item{position:relative;flex-direction:column;text-align:center;gap:7px;padding:12px 6px 10px;border-radius:16px;overflow:hidden;min-height:max-content;
    background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);transition:transform .3s cubic-bezier(.22,1,.36,1),background .25s,box-shadow .25s}
  .lib-slot.open .s-item>span:last-child{flex:none;width:100%}
  .lib-slot.open .s-item b{white-space:normal;font-size:13.5px;line-height:1.25}
  .lib-slot.open .s-item small{font-size:11.5px}
  .lib-slot.open .s-item .cv{width:64px;height:64px;transition:transform .3s cubic-bezier(.22,1,.36,1);
    transform:perspective(400px) rotateX(var(--ry,0deg)) rotateY(var(--rx,0deg));box-shadow:0 0 0 2px rgba(255,255,255,.85),0 0 0 4px rgba(249,174,0,.5),0 10px 22px -8px rgba(0,0,0,.6)}
  .lib-slot.open .s-item::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .25s;
    background:radial-gradient(150px circle at var(--mx,50%) var(--my,50%),rgba(249,174,0,.22),transparent 62%)}
  .lib-slot.open .s-item:hover{transform:translateY(-4px);background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(249,174,0,.4),0 14px 30px -14px rgba(0,0,0,.7)}
  .lib-slot.open .s-item:hover::before{opacity:1}
  .lib-slot.open .s-item:hover .cv{transform:perspective(400px) rotateX(var(--ry,0deg)) rotateY(var(--rx,0deg)) scale(1.08)}
  .lib-slot.open .s-arch{grid-column:1/-1;flex-direction:row;text-align:start}
  .lib-slot.open .s-arch .cv{width:44px;height:44px}
  .view{transition:filter .35s}
  html.lib-open .view{filter:brightness(.78)}
  @supports (animation-timeline:view()){
    .lib-slot.open .s-item{animation:sRise linear both;animation-timeline:view();animation-range:entry 0% entry 55%}
    @keyframes sRise{from{opacity:0;transform:translateY(18px) scale(.92)}}
  }
}
@media (prefers-reduced-motion:reduce){.lib-slot .panel.lib,.lib-slot.open .s-item,.lib-slot.open .s-item .cv{transition:none;animation:none}}

/* מנהל: עיפרון על תמונת הרב / העטיפה */
.ed-able{position:relative}
.ed-pen{position:absolute;inset:0;margin:auto;width:38px;height:38px;border-radius:50%;border:0;display:grid;place-items:center;cursor:pointer;
  color:#231400;background:linear-gradient(145deg,#FFD36E,#EDA132);box-shadow:0 6px 16px -4px rgba(0,0,0,.6),0 0 0 2px rgba(255,255,255,.85);
  opacity:0;transform:scale(.7);transition:opacity .2s,transform .25s cubic-bezier(.22,1.4,.36,1);z-index:3}
.ed-pen svg{width:18px;height:18px;fill:currentColor}
.ed-able:hover .ed-pen,.ed-pen:focus-visible{opacity:1;transform:none}
.ed-able:hover>img,.ed-able:hover>.ph{filter:brightness(.85)}
@media (hover:none){.ed-pen{opacity:1;transform:none;width:34px;height:34px}}

/* שמירת סדרה (כמו בספוטיפיי) */
.save-s svg { width: 28px; height: 28px; transition: transform .2s; }
.save-s.on { color: var(--accent, #F2B13C); }
.save-s.on svg { animation: savePop .3s ease; }
@keyframes savePop { 0% { transform: scale(.7); } 60% { transform: scale(1.15); } 100% { transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { .save-s.on svg { animation: none; } }

/* עמוד רב — לפי סדרה: בחירת שנה */
.seg.vw{margin-bottom:var(--s3)}
.yrs-tag{background:rgba(0,0,0,.55);backdrop-filter:blur(6px)}
.yrpick{display:grid;gap:10px;margin-bottom:var(--s5)}
.yp{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:18px;color:inherit;text-decoration:none;transition:transform .18s ease,background .18s ease}
.yp:hover{transform:translateY(-1px)}
.yp:active{transform:scale(.985)}
.yp-y{font-family:var(--f-head,inherit);font-size:1.45rem;font-weight:800;min-width:4.6em;color:var(--accent)}
.yp-m{flex:1;display:flex;flex-direction:column;min-width:0}
.yp-m b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.yp-m small{opacity:.75}
.yp-rec{font-size:.78rem;font-weight:800;padding:4px 10px;border-radius:999px;background:var(--accent);color:#1B1206;white-space:nowrap}
.yp.best{/* cm-fallback */box-shadow:0 0 0 1.5px var(--accent),0 10px 30px -12px var(--accent);box-shadow:0 0 0 1.5px color-mix(in srgb,var(--accent) 70%,transparent),0 10px 30px -12px color-mix(in srgb,var(--accent) 60%,transparent)}
.yp-go svg{width:20px;height:20px;opacity:.6}

/* העטיפה שעוברת בין העמודים — תנועה רכה ומעוגלת */
::view-transition-group(morph){animation-duration:.42s;animation-timing-function:cubic-bezier(.2,.8,.2,1)}
::view-transition-old(morph),::view-transition-new(morph){height:100%;object-fit:cover;border-radius:18px;overflow:hidden}
::view-transition-old(morph){animation:none;opacity:0}
::view-transition-new(morph){animation:none}
/* פרטים קטנים: לחיצה על כרטיס — שקיעה קלה; ברק זכוכית שעובר על הכרטיס כשמרחפים */
.card,.alb-card,.rcard,.yp,.arch-strip{-webkit-tap-highlight-color:transparent}
.alb-card:active .art,.rcard:active img,.rcard:active .cv{transform:scale(.965);transition:transform .12s ease}
@media (hover:hover){
  .alb-card .art{position:relative;overflow:hidden}
  .alb-card .art::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
    background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.22) 50%,transparent 65%);transform:translateX(-120%);transition:transform .7s cubic-bezier(.2,.8,.2,1)}
  .alb-card:hover .art::after{transform:translateX(120%)}
}
@media (prefers-reduced-motion:reduce){.alb-card .art::after{display:none}}
/* עמוד החיפוש — אריחי הסדרות: רחבים מספיק לשם מלא; שם עד 2 שורות, שם הרב בשורה אחת */
.browse{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.tile{height:96px;padding-inline-end:78px;display:flex;flex-direction:column;justify-content:center;font-size:clamp(15px,1.25vw,18px)}
.tile>small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tile{-webkit-line-clamp:unset}
.tile .cv{width:60px;height:60px;bottom:18px}
@media (max-width:520px){.browse{grid-template-columns:repeat(2,minmax(0,1fr))}.tile{padding-inline-end:64px}.tile .cv{width:50px;height:50px;bottom:23px}}

/* ---- גלילה מיוחדת ---- */
/* מחשב: שורות השנים / הכיתות / התצוגה נשברות לכמה שורות במקום גלילה הצידה (בעכבר אי אפשר לגלול הצידה) */
@media (hover:hover) and (pointer:fine) and (min-width:700px){
  .chips,.chips.yrs{flex-wrap:wrap;overflow:visible;margin-inline:0;padding-inline:0}
  .seg{flex-wrap:wrap;overflow:visible}
}
/* מדפים אופקיים בטלפון: נעצרים בדיוק על כרטיס (כמו בקרוסלה) */
@media (pointer:coarse){
  .shelf{scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter,16px);overscroll-behavior-x:contain}
  .shelf>*{scroll-snap-align:start}
}
/* כותרת השנה נשארת למעלה בזמן הגלילה (זכוכית) */
.sticky-sec{position:sticky;top:0;z-index:5;margin-inline:calc(-1*var(--s3,12px));padding:10px var(--s3,12px);border-radius:16px;
  /* cm-fallback */
  background:var(--bg,#0B1B2E);
  background:color-mix(in srgb,var(--bg,#0B1B2E) 62%,transparent);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4)}
.ser-year{margin-bottom:var(--s5,24px)}
/* עולים פעם אחת כשנכנסים למסך (כמו whileInView באתר הארמית) */
.rv{opacity:0;transform:translateY(18px) scale(.985)}
.rv.in{opacity:1;transform:none;transition:opacity .55s cubic-bezier(.2,.8,.2,1),transform .65s cubic-bezier(.2,.8,.2,1)}
/* Lenis */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}
.alb-card small.alb-n{opacity:.7;margin-top:1px}

/* ---- בורר שנים: כפתור חי + חלון זכוכית צף ---- */
.ypk{position:relative;display:inline-block;margin:0 0 var(--s5,24px);z-index:20}
.ypk-b{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:6px 18px 6px 14px;border-radius:18px;cursor:pointer;color:var(--text,#fff);font:inherit;
  background:linear-gradient(145deg,rgba(255,255,255,.16),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.22);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 10px 30px -14px rgba(0,0,0,.6);backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);
  transition:transform .18s ease,box-shadow .25s ease,background .25s ease}
.ypk-b:hover{transform:translateY(-1px);/* cm-fallback */box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 0 0 1px transparent,0 14px 34px -14px var(--accent);box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 0 0 1px color-mix(in srgb,var(--accent) 45%,transparent),0 14px 34px -14px color-mix(in srgb,var(--accent) 55%,transparent)}
.ypk-b:active{transform:scale(.97)}
.ypk-l{font-size:13px;opacity:.7}
.ypk-b b{font-size:22px;font-weight:800;letter-spacing:.3px;background:linear-gradient(145deg,#FFD36E,#EDA132);-webkit-background-clip:text;background-clip:text;color:transparent}
.ypk-n{font-size:12px;padding:3px 8px;border-radius:99px;background:rgba(255,255,255,.12);opacity:.85}
.ypk-c svg{width:18px;height:18px;transform:rotate(-90deg);transition:transform .3s cubic-bezier(.2,.8,.2,1);opacity:.8}
.ypk.open .ypk-c svg{transform:rotate(90deg)}
.ypk-pop{position:absolute;top:calc(100% + 10px);inset-inline-start:0;width:min(560px,calc(100vw - 32px));max-height:min(62vh,520px);overflow:auto;padding:12px;border-radius:22px;
  /* cm-fallback */
  background:#0B1B2E;
  background:color-mix(in srgb,#0B1B2E 88%,transparent);backdrop-filter:blur(26px) saturate(1.5);-webkit-backdrop-filter:blur(26px) saturate(1.5);
  border:1px solid rgba(255,255,255,.18);box-shadow:0 30px 70px -20px rgba(0,0,0,.75),inset 0 1px 0 rgba(255,255,255,.18);
  transform-origin:top right;opacity:0;transform:translateY(-8px) scale(.96);transition:opacity .2s ease,transform .25s cubic-bezier(.2,.8,.2,1);scrollbar-width:thin}
.ypk.open .ypk-pop{opacity:1;transform:none}
.ypk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(122px,1fr));gap:8px}
.ypk-t{position:relative;display:flex;flex-direction:column;gap:2px;padding:12px 12px 10px;border-radius:16px;color:inherit;text-decoration:none;overflow:hidden;
  background:linear-gradient(160deg,rgba(255,255,255,.1),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.1);
  opacity:0;transform:translateY(8px);transition:background .2s,border-color .2s,transform .2s}
.ypk.open .ypk-t{animation:ypkIn .38s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i) * 22ms)}
@keyframes ypkIn{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}
.ypk-t:hover{background:linear-gradient(160deg,rgba(255,255,255,.18),rgba(255,255,255,.06));border-color:rgba(255,255,255,.28);transform:translateY(-2px)}
.ypk-t b{font-size:20px;font-weight:800}
.ypk-t small{font-size:12px;opacity:.7}
.ypk-t.on{/* cm-fallback */border-color:var(--accent);border-color:color-mix(in srgb,var(--accent) 75%,transparent);/* cm-fallback */box-shadow:0 0 0 1px var(--accent),0 10px 24px -12px var(--accent);box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 50%,transparent),0 10px 24px -12px color-mix(in srgb,var(--accent) 70%,transparent)}
.ypk-t.on b{color:#F5B85A}
.ypk-cv{display:flex;gap:4px;margin-top:8px;min-height:30px}
.ypk-cv .cv{width:30px;height:30px;border-radius:8px;flex:none;box-shadow:0 4px 10px rgba(0,0,0,.35)}
@media (max-width:560px){.ypk-pop{position:fixed;top:auto;bottom:calc(env(safe-area-inset-bottom,0px) + 96px);inset-inline:12px;width:auto;max-height:60vh;transform-origin:bottom center}
  .ypk-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (prefers-reduced-motion:reduce){.ypk-pop,.ypk-t,.ypk-c svg{transition:none;animation:none!important;opacity:1;transform:none}}

/* ---- ראש דף הבית ---- */
.hello.hx{display:block;position:relative;padding:6px 2px 10px;margin:0 0 10px}
.hx-aura{position:absolute;inset:-60px -40px auto -40px;height:230px;z-index:-1;pointer-events:none;filter:blur(30px);opacity:.75;
  background:radial-gradient(40% 60% at 80% 40%,rgba(245,184,90,.35),transparent 70%),radial-gradient(45% 70% at 25% 50%,rgba(79,165,219,.32),transparent 70%);
  animation:hxAura 12s ease-in-out infinite alternate}
@keyframes hxAura{to{transform:translateX(-30px) scale(1.08);opacity:.95}}
.hx-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.hx-eyebrow{display:inline-flex;align-items:center;gap:8px;font:600 12.5px/1 var(--f-meta);letter-spacing:.06em;color:rgba(255,255,255,.78);
  padding:7px 12px;border-radius:99px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.hx-eyebrow i{width:7px;height:7px;border-radius:50%;background:#F5B85A;box-shadow:0 0 0 0 rgba(245,184,90,.7);animation:hxPulse 2.4s ease-out infinite}
@keyframes hxPulse{0%{box-shadow:0 0 0 0 rgba(245,184,90,.6)}100%{box-shadow:0 0 0 10px rgba(245,184,90,0)}}
.hello.hx h1.hx-title{margin:14px 0 0;font-size:clamp(40px,9vw,64px);line-height:1.02;font-weight:800;letter-spacing:-.03em;
  background:linear-gradient(100deg,#fff 30%,#FFE2A3 48%,#fff 66%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:hxShine 6s ease-in-out 1.2s infinite;text-shadow:none;filter:drop-shadow(0 4px 22px rgba(0,0,0,.35))}
@keyframes hxShine{0%,60%{background-position:100% 0}100%{background-position:-150% 0}}
.hello.hx .hx-date{margin:6px 0 0;font:400 16px/1.3 var(--f-meta);color:rgba(255,255,255,.75)}
.hx-stats{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 4px}
.hx-stats span{display:inline-flex;align-items:baseline;gap:6px;padding:8px 14px;border-radius:14px;font:500 13px/1 var(--f-meta);color:rgba(255,255,255,.8);
  background:linear-gradient(160deg,rgba(255,255,255,.12),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.14)}
.hx-stats b{font:800 18px/1 var(--f-head,inherit);color:#F5B85A;font-variant-numeric:tabular-nums}
.intro .hello.hx .hx-eyebrow{animation:rise .7s var(--lg-spring) both}
.intro .hello.hx .hx-title{animation:rise .8s var(--lg-spring) .06s both,hxShine 6s ease-in-out 1.4s infinite}
.intro .hello.hx .hx-date{animation:rise .8s var(--lg-spring) .14s both}
.intro .hello.hx .hx-stats{animation:rise .8s var(--lg-spring) .22s both}
@media (prefers-reduced-motion:reduce){.hx-aura,.hx-eyebrow i,.hello.hx h1.hx-title{animation:none}}

.trm{display:grid;grid-template-columns:1fr auto;gap:8px 10px;align-items:end;padding:4px 14px 8px}
.trm label{display:flex;flex-direction:column;gap:4px;font:500 13px var(--f-meta);opacity:.9}
.trm .rn-in{direction:ltr;text-align:center;font-variant-numeric:tabular-nums}
/* ראש הדף: "ספריית השיעורים" באותיות מרווחות עם קו אור — בלי מסגרת */
.hx-eyebrow{background:none!important;border:0!important;padding:0!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  font:700 12.5px/1 var(--f-meta);letter-spacing:.42em;color:transparent;background-image:linear-gradient(90deg,#FFE2A3,#F5B85A 60%,#E58A2A)!important;-webkit-background-clip:text;background-clip:text;gap:12px}
.hx-eyebrow i{order:2;width:42px;height:1px;border-radius:1px;background:linear-gradient(270deg,#F5B85A,transparent);box-shadow:0 0 8px rgba(245,184,90,.7);animation:hxLine 3.6s ease-in-out infinite}
@keyframes hxLine{0%,100%{width:26px;opacity:.6}50%{width:56px;opacity:1}}
.nl-form{display:flex;gap:8px;padding:6px 14px 10px;align-items:center}
.nl-form .rn-in{flex:1;min-width:0}
.nl-form .btn{flex:none;white-space:nowrap}
/* ראש הדף, גרסה נקייה: לוגו בפינה הימנית, חיפוש בפינה השמאלית, בלי מסגרות ובלי מספרים */
.hx-top{min-height:48px}
.hx-brand{display:inline-flex;align-items:center;gap:10px;color:#fff;text-decoration:none}
.hx-brand img{width:44px;height:44px;border-radius:13px;background:#fff;padding:3px;object-fit:contain;box-shadow:0 8px 22px -10px rgba(0,0,0,.7)}
.hx-brand span{font:700 17px/1.1 var(--f-head,inherit);letter-spacing:0;color:rgba(255,255,255,.92)}
.hx-acts{display:flex;align-items:center;gap:2px}
.hx-search{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 10px;color:rgba(255,255,255,.85);text-decoration:none;font:500 15px var(--f-meta);border-radius:22px;transition:background .2s,color .2s}
.hx-search svg{width:22px;height:22px;fill:currentColor}
.hx-search:hover{background:rgba(255,255,255,.08);color:#fff}
.hx-search:active{transform:scale(.96)}
@media(max-width:700px){.hx-search span{display:none}.hx-search{width:44px;padding:0;justify-content:center}}
@media(min-width:1100px){.hx-brand img{width:40px;height:40px}}
.hello.hx h1.hx-title{margin-top:18px}
/* v2: לוגו גדול בפינה עם הילה לבנה רכה (בלי ריבוע); חיפוש במסגרת. במחשב — החיפוש בשורת החצים והלוגו בצד */
.hx-top{align-items:center;min-height:64px}
.hx-brand{position:relative;padding:4px}
.hx-brand::before{content:"";position:absolute;inset:-26px -34px;z-index:-1;border-radius:50%;
  background:radial-gradient(closest-side,rgba(255,255,255,.95),rgba(255,255,255,.7) 45%,rgba(255,255,255,0));filter:blur(2px)}
.hx-brand img{width:84px;height:auto;border-radius:0;background:none;padding:0;box-shadow:none}
.hx-search{height:44px;padding:0 16px 0 14px;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:rgba(8,22,38,.38);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);font:500 14px var(--f-meta);gap:8px}
.hx-search svg{width:20px;height:20px}
@media(max-width:700px){.hx-search{width:auto;padding:0 14px 0 12px;justify-content:flex-start}.hx-search span{display:inline}
  .hx-search span{font-size:0}.hx-search span::after{content:"חיפוש";font-size:14px}}
.hello.hx h1.hx-title{margin-top:20px}
@media(min-width:1000px){.hello.hx .hx-top{display:none}.hello.hx h1.hx-title{margin-top:4px}}
/* זוהר ראש הדף בלי filter:blur — כרום חותך את הטשטוש בקו ישר לפעמים; הגרדיאנטים רכים מספיק לבד */
.hx-aura{filter:none!important;inset:-90px -60px auto -60px;height:320px;opacity:.7;
  background:radial-gradient(38% 50% at 80% 50%,rgba(245,184,90,.28),transparent 100%),radial-gradient(42% 55% at 25% 55%,rgba(79,165,219,.26),transparent 100%)}
.cv.fly img{width:100%;height:100%;object-fit:cover;display:block}
/* הלוגו בתפריט הצד: בלי ריבוע לבן — הילה לבנה רכה מאחוריו, וקצת יותר גדול */
.brand{position:relative;isolation:isolate}
.brand img{width:64px!important;height:auto!important;background:none!important;padding:0!important;border-radius:0!important;box-shadow:none!important;position:relative}
.brand::before{content:"";position:absolute;z-index:-1;width:120px;height:96px;inset-inline-start:-18px;top:50%;transform:translateY(-50%);border-radius:50%;
  background:radial-gradient(closest-side,rgba(255,255,255,.92),rgba(255,255,255,.55) 50%,rgba(255,255,255,0));pointer-events:none}
.hx-brand::before{inset:-30px -40px;background:radial-gradient(closest-side,rgba(255,255,255,.92),rgba(255,255,255,.55) 50%,rgba(255,255,255,0));filter:none}
/* הלוגו בצבעים המקוריים (בעל הבית, 15.11.2026) — על הילה לבנה רכה, כדי שייראה על הרקע הכהה */
.brand img,.hx-brand img{filter:none!important;background:none!important;box-shadow:none!important;padding:0!important;border-radius:0!important}
.brand img{width:58px!important}
/* בלי לוגו בראש דף הבית (הוא בתפריט/בפתיחה), ובלי הזוהר הצהוב שנחתך */
.hx-brand{display:none!important}
.hx-top{justify-content:flex-end}
.hx-aura{display:none!important}
.lnk-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
#lnkF{display:flex;gap:8px}#lnkF .rn-in{flex:1;min-width:0}
#lnkU{width:100%;font-size:13px}
/* חצים למדפים (מחשב) */
.shw{position:relative}
.sh-arw{position:absolute;top:calc(50% - 40px);z-index:3;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.25);
  background:rgba(8,22,38,.72);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fff;display:grid;place-items:center;cursor:pointer;
  opacity:0;transition:opacity .2s,transform .2s;box-shadow:0 8px 22px -8px rgba(0,0,0,.7)}
.sh-arw svg{width:24px;height:24px;fill:currentColor}
.sh-arw.nx{left:6px}.sh-arw.pv{right:6px}
.shw:hover .sh-arw:not([hidden]){opacity:1}
.sh-arw:hover{transform:scale(1.08);background:rgba(8,22,38,.9)}
.sh-arw[hidden]{display:none}
.lst-acts{display:flex;gap:10px;flex-wrap:wrap;margin:6px 0 18px}
.acct-sub{color:#fff}

/* ---- חשבון: כפתור בראש הדף, מסך כניסה / הרשמה, "החשבון שלי" ---- */
.acct-av{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#F2C66B,#D9A23E);color:#1B1408;font:800 15px/1 var(--f-ui,inherit);text-decoration:none;box-shadow:0 0 0 2px rgba(255,255,255,.35),0 4px 14px rgba(0,0,0,.25);transition:transform .15s}
.acct-av:active{transform:scale(.92)}
.acct-in-b{flex:none;display:inline-flex;align-items:center;height:40px;padding:0 16px;border-radius:20px;background:rgba(255,255,255,.14);color:#fff;font:700 14px/1 var(--f-ui,inherit);text-decoration:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.28);white-space:nowrap}
.acct-in-b:active{transform:scale(.95)}
.acct-hero{margin-bottom:var(--s2)}
.acct-tabs{display:grid;grid-template-columns:1fr 1fr;padding:4px;border-radius:16px;background:rgba(0,0,0,.25);gap:4px}
.acct-tabs button{min-height:42px;border:0;border-radius:12px;background:transparent;color:rgba(255,255,255,.8);font:700 15px/1 inherit;cursor:pointer;transition:background .2s,color .2s}
.acct-tabs button[aria-selected=true]{background:rgba(255,255,255,.16);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}
.acct-box label{display:flex;flex-direction:column;gap:6px;color:#fff;font:600 13px/1.2 inherit}
.acct-box label>span{opacity:.9}
.acct-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s2)}.acct-row>label{min-width:0}.acct-box input{width:100%;min-width:0;box-sizing:border-box}
.acct-pw{position:relative}
.acct-eye{position:absolute;left:8px;bottom:9px;height:30px;padding:0 10px;border:0;border-radius:10px;background:rgba(255,255,255,.12);color:#fff;font:600 12px/1 inherit;cursor:pointer}
.acct-err{margin:0;padding:10px 12px;border-radius:12px;background:rgba(220,70,60,.18);color:#FFD9D4;font:600 14px/1.35 inherit;box-shadow:inset 0 0 0 1px rgba(255,120,110,.35)}
.acct-fine{margin:0;color:rgba(255,255,255,.8);font-size:13px;text-align:center!important}
.acct-me{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;margin:var(--s4) 0 var(--s2)}
.acct-me .h,.acct-me .sub{text-align:center}
.acct-me-av{width:84px;height:84px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#F2C66B,#D9A23E);color:#1B1408;font:800 30px/1 inherit;box-shadow:0 0 0 3px rgba(255,255,255,.3),0 10px 30px rgba(0,0,0,.35);margin-bottom:var(--s2)}
.acct-ok{margin:6px 0 0;color:#BFE8C4;font:600 14px/1.4 inherit}
.acct-warn{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:var(--s2);padding:14px 16px;border-radius:16px;background:rgba(232,181,77,.14);box-shadow:inset 0 0 0 1px rgba(232,181,77,.4);color:#fff;max-width:420px}
.acct-warn span{font-size:14px;opacity:.9}
.acct-me+.acct-box{margin-inline:auto}
@media (max-width:360px){.acct-row{grid-template-columns:1fr}.acct-in-b{padding:0 12px;font-size:13px}}

/* ---- מצב לילה: שחור עמוק, בלי תמונת הרקע, זכוכית עמומה — נוח לעיניים בחושך (נבחר בהגדרות, נשמר במכשיר) ---- */
html.night{--romano:none;--glass-fill:linear-gradient(135deg,rgba(255,255,255,.07),rgba(255,255,255,.025));--glass-edge:rgba(255,255,255,.1);--glass-shadow:0 12px 30px -18px rgba(0,0,0,.9)}
html.night body,html.night .sheet{background:#000}
html.night .backdrop{background:radial-gradient(120% 50% at 50% -10%,rgba(232,181,77,.07),transparent 60%),#000}
html.night .sheet-bg{/* cm-fallback */background:linear-gradient(180deg,#000 0%,#050505 55%,#000 100%);background:linear-gradient(180deg,color-mix(in srgb,var(--c1) 22%,#000) 0%,#050505 55%,#000 100%)}
html.night img,html.night .cv{filter:brightness(.88)}

/* סדרה נעולה לאורחים; מחיקת חשבון */
.lock-note{display:flex;align-items:center;gap:12px;margin:0 0 var(--s4);padding:12px 14px;border-radius:18px;color:#fff}
.lock-note>svg{flex:none;width:22px;height:22px;color:#E8B54D}
.lock-note span{flex:1;display:flex;flex-direction:column;font-size:14px;line-height:1.35}
.lock-note b{font-size:15px}
.menu-head b svg{vertical-align:-2px;color:#E8B54D}
.adm-up .btn svg{margin-inline-end:4px;vertical-align:-3px}
.acct-del{color:#FFB4AC!important;font-size:13px;margin-top:4px;align-self:center}

/* מסכים צרים (טלפונים קטנים / כשרים, 320px): הכותרת בנגן המלא מקבלת שורה מלאה, הכפתורים יורדים מתחת */
@media (max-width:380px){.sheet-meta{flex-wrap:wrap;row-gap:var(--s2)}.sheet-meta>div{flex:1 1 100%}.sheet-meta h2{font-size:21px}}
/* מצב קל (בלי טשטוש): הסרגל העליון והנגן המלא אטומים — אחרת התוכן נראה דרכם */
.lowfx .topbar.solid{background:rgba(8,22,38,.96)}
.lowfx .sheet{background-color:#0B1B2E}

/* מסכים נמוכים (טלפונים קטנים, 480px): ראש דף הבית קומפקטי — יותר תוכן נראה */
@media (max-height:560px){.hello.hx .hx-title{font-size:30px;line-height:1.1;margin-top:4px}.hello.hx .hx-date{margin-bottom:6px;font-size:14px}.hello.hx .hx-top{margin-bottom:6px}}

/* ================= תנועה ותחושה (סבב עיצוב) — עדין, מהיר, מכבד "הפחתת תנועה" ================= */
:root{--spring:cubic-bezier(.22,1.28,.36,1);--ease-out:cubic-bezier(.16,1,.3,1)}
/* חלונות נפתחים (תפריט שיעור, הגדרות, נעילה): רקע מטושטש שנכנס, גיליון קופצני, ידית, פריטים אחד אחרי השני */
.menu{background:rgba(2,8,16,.55);animation:menuFade .22s ease both}
.menu-in{position:relative;animation:menuUp .46s var(--spring) both;transform-origin:50% 100%;box-shadow:0 -18px 50px -20px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.14)}
.menu-in::before{content:"";display:block;width:38px;height:4px;border-radius:4px;background:rgba(255,255,255,.28);margin:2px auto 8px}
.menu-in>button,.menu-in>a{animation:itemIn .38s var(--ease-out) both;transition:background .15s,transform .15s}
.menu-in>button:active,.menu-in>a:active{transform:scale(.98)}
.menu-in>:nth-child(2){animation-delay:.03s}.menu-in>:nth-child(3){animation-delay:.06s}.menu-in>:nth-child(4){animation-delay:.09s}
.menu-in>:nth-child(5){animation-delay:.12s}.menu-in>:nth-child(6){animation-delay:.15s}.menu-in>:nth-child(7){animation-delay:.18s}
.menu-in>:nth-child(8){animation-delay:.21s}.menu-in>:nth-child(n+9){animation-delay:.24s}
.menu.closing{animation:menuFadeOut .19s ease both}.menu.closing .menu-in{animation:menuDown .19s ease-in both}
@keyframes menuFade{from{opacity:0}}@keyframes menuFadeOut{to{opacity:0}}
@keyframes menuUp{from{transform:translateY(60%) scale(.96);opacity:0}}
@keyframes menuDown{to{transform:translateY(40%);opacity:0}}
@keyframes itemIn{from{opacity:0;transform:translateY(10px)}}
@media (min-width:1000px){.menu-in{transform-origin:50% 50%}.menu-in::before{display:none}@keyframes menuUp{from{transform:scale(.92);opacity:0}}}
/* הודעה קופצת: קפיצה קלה פנימה */
.toast{transition:opacity .2s ease,transform .45s var(--spring)!important;box-shadow:0 14px 40px -12px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.14);font-weight:600}
.toast:not(.on){transform:translate(-50%,24px) scale(.94)!important}
/* כפתורים: לחיצה מתכווצת וחוזרת בקפיצה; כפתור ראשי — ברק עדין שעובר במעבר עכבר */
.btn,.ic,.fab,.chip,.tab{transition:transform .35s var(--spring),background .2s,box-shadow .2s,opacity .2s}
.btn:active,.ic:active,.chip:active,.tab:active{transform:scale(.94);transition-duration:.08s}
.btn.pri,.btn:not(.ghost):not(.sm){position:relative;overflow:hidden;isolation:isolate}
.btn.pri::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.45) 50%,transparent 65%);transform:translateX(-120%);transition:transform .7s ease}
@media (hover:hover){.btn.pri:hover::after{transform:translateX(120%)}}
/* כרטיסים: במחשב — מתרוממים במעבר עכבר; בטלפון — מתכווצים בלחיצה */
.alb-card,.card,.row,.feat,.hero,.arch-strip{transition:transform .4s var(--spring),box-shadow .3s,background .2s}
@media (hover:hover){.alb-card:hover,.shelf>.card:hover{transform:translateY(-4px)}.alb-card:hover .cv,.shelf>.card:hover .cv{box-shadow:0 18px 34px -16px rgba(0,0,0,.85)}}
.alb-card:active,.card:active,.feat:active,.hero:active,.arch-strip:active{transform:scale(.97);transition-duration:.1s}
.cv img{transition:opacity .35s ease}
/* ---- מסך ההתחברות ---- */
.acct-hero{display:flex;flex-direction:column;align-items:center;text-align:center;margin:var(--s4) auto var(--s3);position:relative}
.acct-hero::before{content:"";position:absolute;z-index:-1;inset:-40px -20% -10px;background:radial-gradient(50% 60% at 50% 40%,rgba(232,181,77,.16),transparent 70%);animation:aura 7s ease-in-out infinite alternate}
@keyframes aura{to{transform:scale(1.15) translateY(8px);opacity:.7}}
.acct-logo{width:84px;height:84px;border-radius:24px;display:grid;place-items:center;background:#fff;box-shadow:0 0 0 1px rgba(255,255,255,.4),0 0 0 6px rgba(232,181,77,.18),0 18px 40px -14px rgba(0,0,0,.8);margin-bottom:var(--s3);animation:pop .6s var(--spring) both}
.acct-logo img{width:68px;height:auto}
.acct-hero .h{margin:0;font-size:30px;animation:rise .5s var(--ease-out) .08s both}
.acct-hero .acct-tag{margin:6px 0 0;color:rgba(255,255,255,.78);font-size:15px;animation:rise .5s var(--ease-out) .14s both}
.acct-box{margin-inline:auto!important;animation:rise .55s var(--ease-out) .2s both;box-shadow:0 30px 60px -30px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.16)}
.acct-tabs button{position:relative}
.acct-box .gbtn{transition:transform .35s var(--spring),box-shadow .2s}
.acct-box .gbtn:active{transform:scale(.96)}
.acct-box input{transition:border-color .2s,background .2s,box-shadow .2s}
.acct-box input:focus{box-shadow:0 0 0 4px rgba(232,181,77,.16)}
.acct-err{animation:shake .4s ease both}
@keyframes shake{20%,60%{transform:translateX(-5px)}40%,80%{transform:translateX(5px)}}
@media (prefers-reduced-motion:reduce){.menu,.menu-in,.menu-in>*,.toast,.acct-hero::before,.acct-logo,.acct-hero .h,.acct-hero .acct-tag,.acct-box,.acct-err{animation:none!important}.btn.pri::after{display:none}}

/* ================= חנוכה: חנוכייה מונפשת (כרטיס בדף הבית + ראש דף החג) ================= */
.menorah{position:relative;display:inline-flex;flex-direction:column;align-items:center;flex:none}
.menorah .cnds{display:flex;align-items:flex-end;gap:5px;height:46px}
.menorah .cnd{position:relative;width:6px;height:24px;border-radius:2px;background:linear-gradient(180deg,#FFF6E0,#E9D3A3)}
.menorah .cnd.sh{height:34px;margin:0 3px}
.menorah .mbase{display:block;width:100%;height:4px;margin-top:2px;border-radius:2px;background:linear-gradient(90deg,#B98A2E,#E8B54D,#B98A2E)}
.menorah .fl{position:absolute;left:50%;bottom:100%;width:9px;height:15px;margin-left:-4.5px;border-radius:50% 50% 45% 45%/60% 60% 40% 40%;
  background:radial-gradient(60% 55% at 50% 70%,#FFFFFF 0%,#FFE7A0 38%,#F2B544 72%,rgba(242,181,68,0) 100%);transform-origin:50% 100%;
  animation:flick 1.3s ease-in-out infinite alternate;animation-delay:var(--d,0s);filter:drop-shadow(0 0 6px rgba(255,200,90,.75))}
.menorah .fl::after{content:"";position:absolute;inset:-10px -8px -4px;border-radius:50%;background:radial-gradient(circle,rgba(255,210,110,.28),transparent 70%);animation:halo2 2.6s ease-in-out infinite alternate;animation-delay:var(--d,0s)}
@keyframes flick{0%{transform:scale(1,1) rotate(-2deg)}35%{transform:scale(.92,1.08) rotate(2deg)}70%{transform:scale(1.05,.95) rotate(-1deg)}100%{transform:scale(.96,1.04) rotate(1.5deg)}}
@keyframes halo2{to{opacity:.55;transform:scale(1.15)}}
.menorah.big .cnds{height:84px;gap:10px}.menorah.big .cnd{width:10px;height:44px}.menorah.big .cnd.sh{height:62px;margin:0 6px}
.menorah.big .fl{width:14px;height:24px;margin-left:-7px}.menorah.big .mbase{height:6px}
/* כרטיס בדף הבית */
.hk-card{display:flex;align-items:center;gap:16px;margin:0 0 var(--s4);padding:16px 18px 14px;border-radius:24px;color:#fff;text-decoration:none;
  background:radial-gradient(90% 120% at 85% 0%,rgba(232,181,77,.22),transparent 60%),linear-gradient(140deg,#1B2C44,#0B1626);
  box-shadow:inset 0 0 0 1px rgba(232,181,77,.38),0 18px 40px -22px rgba(0,0,0,.9);animation:rise .55s var(--ease-out,ease) both}
.hk-card .menorah{padding-top:14px}
.hk-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.hk-t small{color:#F3D58C}

.hk-t em{font-style:normal;color:rgba(255,255,255,.75);font-size:14px}
.hk-card .as-go{color:#F3D58C}
/* ראש דף החג */
.hk-hero{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;margin:var(--s3) 0 var(--s5);padding:30px 16px 22px;border-radius:28px;
  background:radial-gradient(70% 80% at 50% 0%,rgba(232,181,77,.2),transparent 70%),linear-gradient(180deg,#16263D,#0A1524);box-shadow:inset 0 0 0 1px rgba(232,181,77,.32)}
.hk-hero .menorah{margin-bottom:6px;animation:pop .7s var(--spring,ease) both}
.hk-hero .h{margin:0;animation:rise .5s var(--ease-out,ease) .1s both}
.hk-when{margin:0;color:#F3D58C;animation:rise .5s var(--ease-out,ease) .16s both}
.hk-hero .btn{margin-top:6px;animation:rise .5s var(--ease-out,ease) .22s both}
@media (max-width:360px){.menorah .cnds{gap:4px}.hk-card{gap:12px;padding:14px}.hk-t b{font-size:19px}}
@media (prefers-reduced-motion:reduce){.menorah .fl,.menorah .fl::after,.hk-card,.hk-hero *{animation:none!important}}
.lowfx .menorah .fl{filter:none}.lowfx .menorah .fl::after{display:none}

/* תיקון: אלמנט i מקבל עיצוב כללי באתר — הלהבה מוגדרת במפורש */
.menorah i.fl{display:block!important;width:9px!important;height:16px!important;min-width:0!important;padding:0!important;margin:0 0 0 -4.5px!important;border-radius:50% 50% 50% 50%/62% 62% 38% 38%!important;inset:auto auto 100% 50%!important}
.menorah.big i.fl{width:14px!important;height:26px!important;margin-left:-7px!important}
.menorah .fl::after{inset:-8px -7px -2px!important}
.hk-t b{font-weight:800;font-size:21px;line-height:1.15}
.hk-t small{font-weight:700;font-size:13px;line-height:1.2}
.hk-when{font-weight:700;font-size:15px}
@media (max-width:360px){.hk-t b{font-size:19px}}

/* ---- מצב קל (טלפונים חלשים / דפדפן ישן): גלילה חלקה בלי ריבועים שחורים ---- */
.lowfx *,.lowfx *::before,.lowfx *::after{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
.lowfx .backdrop{transform:none!important;transition:none!important;will-change:auto!important;inset:0}
.lowfx .sheet-in,.lowfx .backdrop{will-change:auto!important}
.lowfx .alb-card,.lowfx .card,.lowfx .row,.lowfx .feat,.lowfx .hero,.lowfx .arch-strip{transition:none}
.lowfx .rv,.lowfx .page-in{animation-duration:.18s!important}
.lowfx .menorah .fl{animation-duration:2.4s}
.lowfx .glass,.lowfx .topbar.solid,.lowfx .menu-in,.lowfx .toast,.lowfx .tabs,.lowfx .player{box-shadow:none}

/* ---- חנוכייה מצוירת (SVG) ---- */
.menorah{display:inline-block;flex:none;line-height:0}
.menorah svg{display:block;width:118px;height:auto;overflow:visible}
.menorah.big svg{width:min(270px,78vw)}
.hk-card .menorah{padding-top:0}
.mfl{transform-box:fill-box;transform-origin:50% 100%;animation:ignite .55s var(--spring,ease) both,flick2 1.7s ease-in-out infinite alternate;animation-delay:calc(var(--k)*.24s + .2s),calc(var(--k)*.24s + .75s)}
.mflame{fill:url(#mfg)}.mcore{fill:rgba(255,255,255,.92)}
.mglow{fill:url(#mgl);transform-box:fill-box;transform-origin:50% 60%;animation:glowp 2.4s ease-in-out infinite alternate}
@keyframes ignite{0%{transform:scale(0);opacity:0}65%{transform:scale(1.3,1.2);opacity:1}100%{transform:none;opacity:1}}
@keyframes flick2{0%{transform:none}25%{transform:scale(.93,1.07) skewX(2.5deg)}55%{transform:scale(1.05,.95) skewX(-2deg)}80%{transform:scale(.97,1.04) skewX(1deg)}100%{transform:scale(1.02,.98)}}
@keyframes glowp{to{transform:scale(1.25);opacity:.7}}
.lowfx .mglow{display:none}.lowfx .mfl{animation:ignite .4s ease both,flick2 2.6s ease-in-out infinite alternate}
@media (prefers-reduced-motion:reduce){.mfl,.mglow{animation:none!important}}

/* תמלול במסך צר: הכותרת לא נחתכת — "חזרה למקום" קצר, כפתורים קטנים יותר, בלי גלישה */
@media (max-width:380px){.sheet-tx>header{gap:6px;flex-wrap:nowrap;min-width:0}.sheet-tx>header>b{font-size:17px}.sheet-tx>header .tx-lvl{font-size:11px;padding:2px 7px}#sTxFollow{font-size:13px;white-space:nowrap;padding:0 4px}.sheet-tx>header .tx-sb{width:36px;height:36px;min-width:36px;flex:none}.sheet-tx>header .tx-sb svg{width:20px;height:20px}}

/* כרטיס "מומלץ להאזנה" במסך צר: עטיפה קטנה, טקסט בשורות מלאות */
@media (max-width:420px){.feat{grid-template-columns:104px minmax(0,1fr);gap:12px;padding:12px;align-items:start}.feat-t{font-size:20px;line-height:1.15}.feat-m{font-size:13px;gap:6px;flex-wrap:wrap}.feat-m img{width:22px;height:22px}.feat-f{font-size:12px}.feat-tag{font-size:11px;padding:4px 8px}.feat-a{margin-top:2px}.feat-a .btn{min-height:40px;padding:0 18px;font-size:15px}.feat-a .ic{width:40px;height:40px}}

/* ================= מסך ההתחברות: כפתורים "חיים" =================
   כל לחיצה מקבלת תגובה: הלשונית מחליקה, השדה מאיר והאייקון קופץ, הכפתור נלחץ פנימה ומראה נקודות בזמן שליחה, טעות — הכרטיס "מנענע ראש". */
.acct-hero{margin:var(--s3) auto 6px;max-width:460px}
.acct-hero::before{content:none!important;animation:none!important}
.acct-logo{width:84px;height:84px;margin:0 auto 12px;border-radius:50%;background:#fff;cursor:pointer;
  box-shadow:0 0 0 3px #06121F,0 0 0 5px rgba(232,181,77,.85),0 16px 34px -12px rgba(0,0,0,.8);animation:medal .55s cubic-bezier(.22,1.28,.36,1) both}
.acct-logo img{width:64px}
.acct-logo:active{animation:wobble .5s ease both}
@keyframes medal{from{transform:scale(.5);opacity:0}}
@keyframes wobble{25%{transform:rotate(-8deg) scale(.95)}55%{transform:rotate(6deg)}80%{transform:rotate(-2deg)}}
.acct-hero .h{font-size:28px;letter-spacing:-.01em;animation:none!important}
.acct-hero .acct-tag{animation:none!important;font-size:14px;color:#F6E9CF;opacity:.9}
.acct-box{animation:none!important;background:rgba(9,24,40,.74);border:1px solid rgba(232,181,77,.22);box-shadow:0 24px 50px -30px rgba(0,0,0,.9)}
.acct-box.oops{animation:shake .42s ease both!important}
/* לשוניות: "גלולה" קרם שמחליקה בין כניסה להרשמה */
.acct-tabs{position:relative;background:rgba(0,0,0,.32);border:1px solid rgba(255,255,255,.08)}
.acct-tabs button{position:relative;z-index:1;display:grid;place-items:center;text-align:center;padding:0 8px;background:transparent!important;box-shadow:none!important;transition:color .3s}
.acct-tabs button[aria-selected=true]{color:#1B1408}
.acct-tabs button:active{transform:scale(.94)}
.acct-pill{position:absolute;top:4px;bottom:4px;right:4px;width:calc(50% - 6px);border-radius:12px;background:linear-gradient(180deg,#FFF4DD,#F2DDB2);
  box-shadow:0 6px 16px -6px rgba(232,181,77,.6),inset 0 1px 0 #fff}
.acct-tabs[data-on=up] .acct-pill{transform:translateX(calc(-100% - 4px))}
.acct-tabs.slid[data-on=up] .acct-pill{animation:pillTo .5s cubic-bezier(.3,1.35,.5,1) both}
.acct-tabs.slid[data-on=in] .acct-pill{animation:pillBack .5s cubic-bezier(.3,1.35,.5,1) both}
@keyframes pillTo{from{transform:none}}
@keyframes pillBack{from{transform:translateX(calc(-100% - 4px))}}
/* גוגל: מתרומם, ובלחיצה ה-G מסתובב */
.acct-box .gbtn{transition:transform .35s cubic-bezier(.3,1.4,.5,1),box-shadow .25s}
.acct-box .gbtn svg{transition:transform .5s cubic-bezier(.3,1.5,.5,1)}
@media (hover:hover){.acct-box .gbtn:hover{transform:translateY(-2px);box-shadow:0 10px 24px -10px rgba(0,0,0,.6)}.acct-box .gbtn:hover svg{transform:rotate(-14deg) scale(1.12)}}
.acct-box .gbtn:active{transform:scale(.95)}
.acct-box .gbtn:active svg{transform:rotate(-200deg) scale(1.15)}
/* שדות עם אייקון שמאיר וקופץ בפוקוס */
.acct-in{position:relative;display:block}
.acct-in input{padding-right:44px!important}
.acct-pw .acct-in input{padding-left:50px!important}
.acct-ic{position:absolute;right:14px;top:50%;width:20px;height:20px;margin-top:-10px;fill:none;stroke:rgba(255,255,255,.55);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;pointer-events:none;transition:stroke .2s}
.acct-in:focus-within .acct-ic{stroke:#F2C66B;animation:icoPop .45s cubic-bezier(.3,1.6,.5,1)}
@keyframes icoPop{40%{transform:scale(1.3) rotate(-8deg)}}
.acct-box input:focus{border-color:#E8B54D;background:rgba(255,255,255,.09);box-shadow:0 0 0 4px rgba(232,181,77,.18)}
.acct-eye{left:6px!important;top:50%;bottom:auto!important;width:38px;height:38px;margin-top:-19px;padding:0!important;display:grid;place-items:center;border-radius:12px!important;background:transparent!important;transition:background .2s,transform .2s}
.acct-eye:active{transform:scale(.88);background:rgba(255,255,255,.12)!important}
.acct-eye svg{width:22px;height:22px;fill:none;stroke:rgba(255,255,255,.75);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.acct-slash{stroke-dasharray:23;stroke-dashoffset:0;transition:stroke-dashoffset .3s ease}
.acct-eye[aria-pressed=true] .acct-slash{stroke-dashoffset:23}
.acct-eye[aria-pressed=true] svg{stroke:#F2C66B}
/* הכפתור הראשי: זהב מבריק, נלחץ פנימה, ובזמן שליחה — שלוש נקודות קופצות */
.acct-go{position:relative;overflow:hidden;isolation:isolate;font-size:17px;background:linear-gradient(180deg,#FFD978,#E9A93A)!important;color:#1B1408!important;
  box-shadow:0 10px 24px -10px rgba(233,169,58,.75),inset 0 1px 0 rgba(255,255,255,.6)!important;transition:transform .3s cubic-bezier(.3,1.4,.5,1),box-shadow .2s}
.acct-go:active{transform:scale(.95) translateY(1px);box-shadow:0 4px 10px -6px rgba(233,169,58,.7),inset 0 2px 4px rgba(0,0,0,.12)!important}
.acct-go::after{animation:gleam 3.6s ease-in-out 1s infinite}
@keyframes gleam{0%,70%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
.acct-go-t{transition:opacity .2s,transform .2s}
.acct-dots{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:6px;opacity:0;pointer-events:none}
.acct-dots b{width:8px;height:8px;border-radius:50%;background:#1B1408}
.acct-go.busy{opacity:1!important}
.acct-go.busy .acct-go-t{opacity:0;transform:translateY(-8px)}
.acct-go.busy .acct-dots{opacity:1}
.acct-go.busy .acct-dots b{animation:dot .9s ease-in-out infinite}
.acct-go.busy .acct-dots b:nth-child(2){animation-delay:.12s}
.acct-go.busy .acct-dots b:nth-child(3){animation-delay:.24s}
@keyframes dot{0%,80%,100%{transform:translateY(0);opacity:.5}40%{transform:translateY(-7px);opacity:1}}
@media (max-height:600px){.acct-logo{width:64px;height:64px}.acct-logo img{width:48px}.acct-hero .h{font-size:24px}}
@media (prefers-reduced-motion:reduce){.acct-logo,.acct-pill,.acct-go::after,.acct-ic,.acct-box.oops{animation:none!important}}
/* סגירת הנגן הצף: × בפינה (וגם החלקה הצידה) */
.player{touch-action:pan-y}
.np-close{position:absolute;top:-8px;left:-6px;z-index:2;width:26px;height:26px;border-radius:50%;border:0;display:grid;place-items:center;padding:0;
  background:rgba(8,20,34,.92);color:#fff;box-shadow:0 0 0 1px rgba(255,255,255,.22),0 4px 10px rgba(0,0,0,.4);cursor:pointer}
.np-close:active{transform:scale(.88)}
@media (min-width:1000px){.np-close{display:none}}

/* פס ההתקדמות: מצויר על הקלט עצמו (לא על ::-webkit-slider-runnable-track — שבמעטפת האפליקציה לא הוצג, רק העיגול) */
input.seek{background:linear-gradient(90deg,var(--sk,var(--text)) var(--p),rgba(255,255,255,.2) var(--p)) center/100% 4px no-repeat;border-radius:4px}
input.seek::-webkit-slider-runnable-track{background:transparent!important}
input.seek::-moz-range-track{background:transparent!important}
input.seek::-moz-range-progress{background:transparent!important}
/* נגן במצב קל (טלפון חלש / האפליקציה): במקום רקע כהה אחיד — מעבר צבע לפי צבע השיעור (זול, בלי טשטוש) */
.lowfx .sheet{background:linear-gradient(180deg,var(--c1,#1d4470) 0%,#10243b 42%,#0B1B2E 100%)}
html.night.lowfx .sheet{background:linear-gradient(180deg,#141414 0%,#000 50%)}
.sheet.tx-min .tx-hide{display:none}
.sheet.tx-min #sTx header{cursor:pointer}
/* התמלול נסגר (×): המגירה נעלמת לגמרי; כפתור "תמלול" בשורת הכלים מחזיר אותה */
.sheet.tx-off #sTx,.sheet.tx-off #sTxSoon{display:none!important}
.sheet.tx-off{--peek:0px!important}
.sheet.tx-min .tx-hide{display:inline-grid}

/* כפתורי ניגון בתוך התמלול — לדלג בלי לסגור אותו */
.tx-ctl{display:flex;justify-content:center;align-items:center;gap:22px;padding:6px 0 2px;border-top:1px solid rgba(255,255,255,.1)}
.tx-ctl .ic{position:relative;width:44px;height:44px;color:#fff;border-radius:50%}
.tx-ctl .ic svg{width:26px;height:26px}
.tx-ctl .ic i{position:absolute;inset:0;display:grid;place-items:center;font:700 9px/1 var(--f-meta);font-style:normal;padding-top:3px}
.tx-ctl .tx-pp{background:var(--accent,#F9AE00);color:#111;width:48px;height:48px}
.tx-ctl .tx-pp svg{width:24px;height:24px}
.sheet-tx.tx-min .tx-ctl{display:none}

/* הלוגו הצבעוני בלי הילה: במקומה — הפינה הימנית העליונה של כרטיס הניווט בהירה יותר (גרדיאנט), כך שהצבעים נראים טוב */
.brand::before,.hx-brand::before{content:none!important;display:none!important}
/* הלוגו הצבעוני על "כותרת" לבנה בראש כרטיס הניווט; כל השאר — בצבע הכרטיס */
.panel.nav{overflow:hidden}
.panel.nav>.brand{background:linear-gradient(180deg,#FFFFFF,#EEF2F7);color:#0E2A47!important;margin:-12px -8px 10px!important;padding:16px 18px 14px!important;border-radius:0;box-shadow:0 1px 0 rgba(255,255,255,.4),0 6px 14px -10px rgba(0,0,0,.5)}
.panel.nav>.brand span{color:#0E2A47!important}
.panel.nav>.brand small{color:#4A6380!important}

/* דף החשבון: סיכום האזנה וקיצורי מנהל */
.acct-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px;max-width:640px;margin:14px auto;padding:12px;border-radius:20px}
.acct-stats>*{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 6px;border-radius:14px;color:inherit;text-decoration:none}
.acct-stats a:hover{background:rgba(255,255,255,.06)}
.acct-stats b{font:800 24px/1.1 var(--f-head,inherit);color:#FFD36B}
.acct-stats small{font-size:13px;color:var(--muted)}
.acct-adm{max-width:640px;margin:0 auto 14px;padding:14px 16px;border-radius:20px;display:flex;flex-direction:column;gap:6px;border:1px solid rgba(249,174,0,.35)}
.acct-adm small{color:var(--muted);line-height:1.5}
.acct-adm-a{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}