/* Yiddish Library theme — loads after style.css. All rules are scoped to body.lib */
body.lib{
  --wood-dk:#2f1a0f; --wood:#5b331c; --wood-md:#7a4a28; --wood-lt:#a46c3c;
  --wall:#efe2c4; --paper:#fffaf0; --ink:#2b1d14; --ink-soft:#6b5747;
  --green:#1f4d3a; --green-dk:#163a2b; --burgundy:#7a2331; --gold:#d4a843; --gold-dk:#a37a22; --stamp:#a8323e;
  margin:0;color:var(--ink);font-family:Nunito,Arial,sans-serif;
  background:
    linear-gradient(rgba(255,240,200,.35),transparent 300px),
    repeating-linear-gradient(90deg,rgba(122,35,49,.055) 0 3px,transparent 3px 34px),
    var(--wall);
  min-height:100vh;
}
body.lib h2,body.lib h3{font-family:Fraunces,Georgia,serif}
body.lib [lang=yi],body.lib .yi{font-family:"Frank Ruhl Libre",serif}

/* ---------- Header ---------- */
body.lib > header{
  background:repeating-linear-gradient(90deg,rgba(0,0,0,.08) 0 2px,transparent 2px 60px),linear-gradient(var(--wood-md),var(--wood));
  border-bottom:8px solid var(--wood-dk);box-shadow:0 4px 0 var(--gold-dk),0 10px 18px rgba(0,0,0,.25);
  padding:12px 16px 14px;gap:10px;
}
body.lib > header{display:flex;justify-content:space-between;align-items:center}
body.lib > header .lib-sign{margin:0 auto}
body.lib > header a{color:#f6e3bd;font-weight:800;text-decoration:none;font-size:.95rem}
body.lib > header .lib-sign{
  background:linear-gradient(var(--green),var(--green-dk));color:var(--gold);border:3px solid var(--gold);border-radius:8px;
  padding:6px 20px;font-family:Fraunces,serif;font-weight:900;font-size:1.3rem;letter-spacing:.05em;
  box-shadow:0 0 0 3px var(--green-dk),0 6px 12px rgba(0,0,0,.35);text-shadow:0 1px 0 #000;white-space:nowrap;
}
body.lib > header .lib-sign b{font-family:"Frank Ruhl Libre",serif;font-size:1.4rem;margin-right:6px;letter-spacing:0}

body.lib main{max-width:1080px;margin:auto;padding:24px 16px 120px}
body.lib #lesson{display:grid;gap:26px}
body.lib #lesson[hidden]{display:none}
body.lib #blastgame{border-color:var(--wood-md);background:var(--paper);box-shadow:0 10px 20px rgba(62,36,22,.15)}
body.lib #blastgame .blast-prompt strong{font-family:Fraunces,Georgia,serif;color:var(--ink)}
body.lib #lesson > *,body.lib #toolbar > *{min-width:0}

/* ---------- Brass plaque ---------- */
body.lib .lib-plaque{display:inline-flex;align-items:center;gap:10px;background:linear-gradient(#f0d27a,#c79a35 55%,#a37a22);
  color:#3a240f;border-radius:6px;padding:6px 16px;font-family:Fraunces,serif;font-weight:900;font-size:1.15rem;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),inset 0 -2px 0 rgba(0,0,0,.2),0 3px 6px rgba(0,0,0,.25)}
body.lib .lib-plaque::before,body.lib .lib-plaque::after{content:"";width:6px;height:6px;border-radius:50%;background:#7a5615;flex:none}
body.lib .lib-plaque small,body.lib .lib-plaque #title{font:800 .78rem Nunito,Arial,sans-serif;letter-spacing:.06em;opacity:.85;margin:0;text-transform:uppercase}

/* ---------- Library card (student-meta + section map) ---------- */
body.lib .student-meta{background:#fdf6e3;border:2px solid #d9c49a;border-bottom:0;border-radius:4px 4px 0 0;padding:16px 18px 4px;
  display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0;position:relative}
body.lib .student-meta::before{content:"LIBRARY CARD";flex-basis:100%;font:800 .75rem Nunito,Arial;letter-spacing:.2em;color:var(--burgundy)}
body.lib #who{margin:0;font:800 1.5rem Fraunces,Georgia,serif}
body.lib #notice{margin:0}
body.lib .student-meta:has(+ #login:not([hidden])){border-bottom:2px solid #d9c49a;border-radius:4px;padding-bottom:16px;margin-bottom:20px}
body.lib .section-map{background:#fdf6e3;border:2px solid #d9c49a;border-top:0;border-radius:0 0 4px 4px;padding:6px 18px 18px;margin:0;
  box-shadow:0 10px 20px rgba(62,36,22,.15);position:relative;
  background-image:repeating-linear-gradient(transparent 0 31px,rgba(214,190,140,.45) 31px 32px)}
body.lib .section-map-label{font:800 .72rem Nunito,Arial;letter-spacing:.16em;color:var(--ink-soft);margin:4px 0 0}
body.lib #segments{display:grid;grid-template-columns:repeat(8,1fr);gap:8px;margin:10px 0 0}
body.lib #segments button{aspect-ratio:1;max-height:64px;min-height:52px;padding:4px;border-radius:6px;font:800 .8rem Nunito,Arial;line-height:1.1;
  background:rgba(168,50,62,.06);color:var(--stamp);border:3px double var(--stamp);transform:rotate(-5deg);box-shadow:none}
body.lib #segments button:nth-child(even){transform:rotate(4deg)}
body.lib #segments button.active{background:var(--green);color:#fff;border:3px solid var(--green);transform:none;box-shadow:0 0 0 4px rgba(31,77,58,.2)}
body.lib #segments button:disabled{background:transparent;color:#b9a47c;border:2px dashed #ccb68a;transform:none;opacity:.65}
body.lib .section-map #stats{position:absolute;top:-30px;right:18px;padding:0!important;margin:0;font:800 1rem Nunito,Arial;color:var(--green)!important;gap:6px;background:none!important;border:0!important;box-shadow:none!important;border-radius:0;width:auto;min-height:0}
body.lib .section-map #stats *{background:none!important;color:inherit!important;border:0!important;box-shadow:none!important;padding:0!important}
body.lib #stats::before{content:"📚"}

/* ---------- Story map link (moved into Story Corner) ---------- */
body.lib #readStory{display:inline-block;margin-top:auto;align-self:flex-start;padding:13px 22px;border-radius:999px;
  background:var(--burgundy);color:#fff;font:900 1.02rem Nunito,Arial;text-decoration:none;box-shadow:0 4px 0 rgba(0,0,0,.28);border:0;transition:transform .1s}
body.lib #readStory[hidden]{display:none}
body.lib #readStory:hover{transform:translateY(-2px)}

/* ---------- New Arrivals display (#words) ---------- */
body.lib .lib-display{background:linear-gradient(#6b3d21,#4e2b16);border-radius:10px;padding:16px 16px 0;
  box-shadow:inset 0 0 0 5px var(--wood-lt),0 10px 20px rgba(0,0,0,.2)}
body.lib .lib-display:has(#words[hidden]){display:none}
body.lib .lib-display .lib-ledge{height:18px;background:linear-gradient(var(--wood-lt),var(--wood-md));margin:14px -16px 0;border-radius:0 0 10px 10px;box-shadow:0 5px 0 var(--wood-dk)}
body.lib #words{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px;margin-top:14px;padding:0 4px}
body.lib #words .word{position:relative;background:#7a2331;color:#fff;border:0;border-radius:3px 8px 8px 3px;padding:16px 10px 14px 18px;text-align:center;
  box-shadow:inset 8px 0 0 rgba(0,0,0,.22),inset 10px 0 0 rgba(255,255,255,.12),0 8px 12px rgba(0,0,0,.35);transition:transform .15s;
  display:flex;flex-direction:column;align-items:center;gap:2px;outline:2px solid rgba(255,230,170,.55);outline-offset:-12px}
body.lib #words .word:nth-of-type(4n+2){background:#1f4d3a}
body.lib #words .word:nth-of-type(4n+3){background:#2f4f7a}
body.lib #words .word:nth-of-type(4n+4){background:#8a5a1c}
body.lib #words .word::before,body.lib #words .word::after{display:none!important}
body.lib #words .word:hover{transform:translateY(-6px) rotate(-1deg)}
body.lib #words .word .status{background:var(--gold);color:#3a240f;font:900 .66rem Nunito,Arial;letter-spacing:.12em;text-transform:uppercase;padding:2px 8px;border-radius:3px;margin-top:6px}
body.lib #words .word .status.learned{background:#9fd6a8;color:#163a2b}
body.lib #words .word .status.practicing{background:#f4c6a0;color:#5b2a12}
body.lib #words .word .yi{font-size:2.5rem;font-weight:900;line-height:1.35;color:#fff3d6;text-shadow:0 2px 0 rgba(0,0,0,.3)}
body.lib #words .word > div:last-child{font:800 1.05rem Fraunces,Georgia,serif;color:#f6e3bd;margin-bottom:6px}
body.lib #words > p{grid-column:1/-1;color:#e6cc9c;margin:0;font-weight:700}

/* ---------- Toolbar: rooms + shelf ---------- */
body.lib #toolbar{display:grid;gap:26px;padding:0;background:none;border:0;box-shadow:none;margin:0}
body.lib #toolbar[hidden]{display:none}
body.lib .lib-rooms{display:grid;grid-template-columns:1.35fr 1fr;gap:20px}
body.lib .lib-rooms > *{min-width:0}
body.lib .lib-room{border-radius:14px;overflow:hidden;background:var(--paper);display:flex;flex-direction:column;
  border:6px solid var(--wood-md);box-shadow:0 0 0 2px var(--wood-dk),0 12px 24px rgba(62,36,22,.25)}
body.lib .lib-room:has(#readStory[hidden]){display:none}
body.lib .lib-room svg{display:block;width:100%;height:auto}
body.lib .lib-room-body{padding:16px 18px 20px;display:flex;flex-direction:column;gap:8px;flex:1;position:relative}
body.lib .lib-step{display:inline-flex;align-items:center;gap:8px;font:900 .8rem Nunito,Arial;letter-spacing:.14em;text-transform:uppercase}
body.lib .lib-step b{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:1rem;letter-spacing:0}
body.lib .lib-room h3{font-size:1.45rem;margin:0}
body.lib .lib-room p{margin:0;color:var(--ink-soft);font-weight:700;font-size:1rem}
body.lib .story-room .lib-step{color:var(--burgundy)} body.lib .story-room .lib-step b{background:var(--burgundy)}
body.lib .study-room .lib-step{color:var(--green)}   body.lib .study-room .lib-step b{background:var(--green)}
body.lib .lib-badge{position:absolute;top:-20px;right:16px;background:var(--gold);color:#3a240f;font-weight:900;padding:5px 12px;border-radius:999px;
  box-shadow:0 3px 0 var(--gold-dk);transform:rotate(4deg);animation:libBob 2.4s ease-in-out infinite}
@keyframes libBob{50%{transform:rotate(4deg) translateY(-4px)}}
@keyframes libFlicker{50%{opacity:.8}}
body.lib .lib-glow{animation:libFlicker 3s ease-in-out infinite}
body.lib #start{margin-top:auto;align-self:flex-start;padding:13px 24px;border-radius:999px;background:var(--green);color:#fff;
  font:900 1.05rem Nunito,Arial;box-shadow:0 4px 0 rgba(0,0,0,.28);border:0;transition:transform .1s}
body.lib #start:hover:not(:disabled){transform:translateY(-2px)}

/* ---------- Bookcase (.activity-grid) ---------- */
body.lib .lib-bookcase{background:var(--wood-md);border-radius:12px 12px 6px 6px;padding:0 18px 18px;
  background-image:repeating-linear-gradient(90deg,rgba(0,0,0,.06) 0 2px,transparent 2px 9px);
  box-shadow:0 0 0 3px var(--wood-dk),0 14px 26px rgba(0,0,0,.28)}
body.lib .lib-crown{height:22px;margin:0 -18px 14px;background:linear-gradient(var(--wood-lt),var(--wood));border-radius:12px 12px 0 0;border-bottom:4px solid var(--wood-dk)}
body.lib .lib-bookcase-head{display:flex;justify-content:center;margin:-2px 0 12px}
body.lib .lib-tier{background:linear-gradient(#2a170c,#3d2313 70%);border-radius:4px;padding:14px 10px 0;box-shadow:inset 0 8px 14px rgba(0,0,0,.5)}
body.lib .lib-board{height:16px;background:linear-gradient(var(--wood-lt),var(--wood));margin:0 -10px;border-top:2px solid #c48a52}
body.lib #toolbar .activity-grid{display:flex;align-items:flex-end;gap:4px;overflow-x:auto;padding:0;margin:0;grid-template-columns:none;scrollbar-width:thin}
body.lib .lib-filler{flex:0 0 auto;border-radius:3px 3px 1px 1px;box-shadow:inset -3px 0 0 rgba(0,0,0,.25),inset 2px 0 0 rgba(255,255,255,.15)}
body.lib .lib-filler::before{content:"";display:block;height:5px;margin-top:12px;border-top:2px solid rgba(255,220,150,.5);border-bottom:2px solid rgba(255,220,150,.5)}
body.lib .lib-bookend{flex:0 0 auto;width:26px;height:70px;background:linear-gradient(#c79a35,#8b6418);border-radius:4px 4px 0 0;margin-left:6px}

body.lib #toolbar .activity-card{flex:0 0 auto;width:124px;height:190px;min-height:0;margin:0 4px;padding:12px 10px 10px;border:0;border-radius:5px 5px 2px 2px;
  color:#fff;text-align:left;display:flex;flex-direction:column;align-items:stretch;gap:0;
  box-shadow:inset -7px 0 0 rgba(0,0,0,.22),inset 4px 0 0 rgba(255,255,255,.14),0 -2px 8px rgba(0,0,0,.3);transition:transform .15s}
body.lib #toolbar .activity-card:hover:not(:disabled){transform:translateY(-12px)}
body.lib #toolbar .activity-card .activity-icon{background:none;width:auto;height:auto;padding:0;font-size:1.6rem;box-shadow:none;display:block;text-align:left;
  border-bottom:2px solid rgba(255,225,160,.6);padding-bottom:10px;margin-bottom:auto}
body.lib #toolbar .activity-card .activity-text{display:block;margin-top:auto}
body.lib #toolbar .activity-card strong{display:block;font:800 1.05rem/1.15 Fraunces,Georgia,serif}
body.lib #toolbar .activity-card small{display:block;font:700 .74rem Nunito,Arial;opacity:.9;margin-top:4px;color:#fff}
body.lib #toolbar .activity-card .activity-arrow{display:none}
body.lib #toolbar #blastStart{background:#6a3fa0;height:196px}
body.lib #toolbar #sentenceStart{background:#a33a5e;height:178px}
body.lib #toolbar #soundStart{background:#a8661c;height:204px}
body.lib #toolbar #storyQuizStart{background:#2f6497;height:186px}
body.lib #toolbar #friendsStart{background:#1f4d3a;height:200px}
body.lib #toolbar #all{background:#4b3a2a;height:182px}

/* Teacher preview / gallery / audio floaters added by other scripts need room */
body.lib{padding-bottom:70px}

@media (max-width:820px){
  body.lib .lib-rooms{grid-template-columns:1fr}
  body.lib #segments{grid-template-columns:repeat(4,1fr)}
  body.lib #stats{position:static;padding:4px 0 0}
  body.lib > header .lib-sign{font-size:1rem;padding:6px 10px}
  body.lib > header .lib-sign b{font-size:1.1rem}
  body.lib > header a{font-size:.85rem}
  body.lib #words{grid-template-columns:repeat(2,1fr)}
}

/* Shelf fit: books share the width, no visible scrollbar */
body.lib #toolbar .activity-grid{scrollbar-width:none;padding-top:14px}
body.lib #toolbar .activity-grid::-webkit-scrollbar{display:none}
body.lib #toolbar .activity-card{flex:1 1 110px;width:auto;min-width:92px;max-width:130px}
body.lib .lib-filler{flex:0 1 auto;min-width:6px}
body.lib #toolbar .activity-card .activity-icon{border:0;border-bottom:2px solid rgba(255,225,160,.6);border-radius:0}
@media (max-width:1000px){
  body.lib #toolbar .activity-grid > .lib-filler:nth-child(n+3){display:none}
  body.lib #toolbar .activity-grid > .lib-filler:nth-last-child(-n+3){display:block}
}
@media (max-width:1000px){ body.lib #toolbar .activity-card{min-width:82px} }
/* Phones: two-level bookcase instead of sideways scrolling */
@media (max-width:600px){
  body.lib #toolbar .activity-grid{flex-wrap:wrap;overflow:visible;row-gap:16px;column-gap:0;padding-top:0;align-items:flex-end;
    background:repeating-linear-gradient(transparent 0 170px,#a46c3c 170px 186px)}
  body.lib #toolbar .activity-grid > .lib-filler,body.lib #toolbar .activity-grid > .lib-bookend{display:none!important}
  body.lib #toolbar .activity-card{flex:1 1 28%;max-width:none;min-width:0;height:170px!important;margin:0 3px}
}
