/* Shared page chrome and catalog geometry follow Hola Mundo. */
:root {
  --ink: #0f172a;
  --muted: #475569;
  --accent: #b4480b;
  --green: var(--accent);
  --pale: #fff3e6;
  --line: #e2e8f0;
  --paper: #fff;
}
body { background: linear-gradient(140deg,#fff7ed 0,white 32rem); min-height:100vh; }
.site-main, .site-footer, .masthead-inner { width:min(72rem,100%); margin-inline:auto; padding-inline:clamp(1rem,3vw,2rem); }
.reader-control { font-size:.9rem; font-weight:600; border:1px solid #cbd5e1; border-radius:999px; background:white; padding:.45rem 1rem; }
.crumbs { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; margin:2rem 0 1rem; font-size:.85rem; color:var(--muted); }
.crumbs a:hover, .reader-nav a:hover { color:var(--accent); text-decoration:underline; }
.hub-heading { display:grid; grid-template-columns:minmax(0,1fr) minmax(16rem,22rem); align-items:center; gap:2rem; margin-bottom:1.5rem; }
.hub-heading>div:only-child { grid-column:1/-1; max-width:48rem; }
.hub-heading h1, .story-heading h1 { font-size:clamp(2rem,4.5vw,3rem); font-weight:800; margin:0 0 .7rem; line-height:1.08; }
.hub-heading p, .story-heading p { color:var(--muted); margin:.35rem 0; }
.resume-card, .shelf-tools, .book-card, .reader-board, .topic-pager a { border:1px solid var(--line); background:white; border-radius:1rem; box-shadow:0 2px 4px #0f172a0a; }
.resume-card { display:flex; gap:.8rem; align-items:center; padding:1rem; border-color:#fed7aa; background:linear-gradient(110deg,#fff7ed,white,#fffbeb); line-height:1.4; }
.resume-card small, .parallel-labels { display:block; font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.12em; color:var(--accent); }
.resume-card>span:last-child { margin-left:auto; color:var(--accent); }
.shelf-tools { padding:.65rem; display:flex; flex-wrap:wrap; align-items:center; gap:.75rem; margin:1rem 0 1.75rem; }
.shelf-tools nav, .shelf-options { display:flex; align-items:center; gap:.45rem; }
.shelf-tools nav { overflow-x:auto; min-width:0; }
.shelf-tools nav a, .shelf-options label, .topic-reading { white-space:nowrap; border-radius:999px; padding:.35rem .7rem; font-size:.83rem; font-weight:600; }
.shelf-tools nav a { background:#f1f5f9; }
.shelf-tools [aria-current=page], .topic-reading { background:var(--pale); color:#9a3412; }
.shelf-options { flex-wrap:wrap; margin-left:auto; }
.shelf-options label { border:1px solid #cbd5e1; cursor:pointer; }
.shelf-options input { accent-color:var(--accent); }
.shelf-section>summary { display:flex; align-items:center; gap:.75rem; flex-wrap:wrap; list-style:none; margin-bottom:1rem; }
.shelf-section>summary::after { content:'⌄'; margin-left:auto; }
.shelf-section[open]>summary::after { content:'⌃'; }
.shelf-section h2 { font-size:1.55rem; margin:0; }
.shelf-count, .subtitle, .book-bottom { color:var(--muted); font-size:.85rem; }
.shelf-section progress { width:5rem; height:.35rem; margin:0; }
.book-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.15rem; }
.book-wrap { position:relative; }
.book-card { display:flex; flex-direction:column; height:100%; padding:1.2rem; border-top:4px solid var(--card-color,#ea751d); transition:transform .15s, box-shadow .15s; }
.book-card:hover { transform:translateY(-2px); box-shadow:0 8px 24px #0f172a12; }
.book-top,.story-meta,.book-bottom { display:flex; align-items:center; gap:.75rem; }
.story-icon { display:grid; place-items:center; flex-shrink:0; width:2.8rem; height:2.8rem; background:var(--pale); border-radius:.75rem; font-size:1.45rem; }
.book-card h3,.topic-card h2 { margin:0; font-size:1.14rem; font-weight:750; line-height:1.25; }
.book-card .subtitle { margin:.2rem 0 0; }
.synopsis { margin:.85rem 0; font-size:.9rem; color:var(--muted); }
.book-bottom { margin-top:auto; padding-top:.8rem; font-size:.77rem; }
.book-bottom strong { margin-left:auto; color:var(--accent); font-size:.88rem; }
.read-check { position:absolute; top:.35rem; right:.35rem; border-radius:50%; background:#047857; color:white; width:1.7rem; }
.compact-shelf .synopsis, .compact-shelf .book-bottom { display:none; }
.compact-shelf .book-card { padding:.7rem; }
.topic-grid { margin-top:1.5rem; }
.topic-card small,.topic-status { color:var(--accent); font-size:.85rem; font-weight:650; }
.topic-card p,.topic-example { border-left:3px solid #fdba74; padding-left:.8rem; margin:1rem 0; }
.topic-pager { display:flex; flex-wrap:wrap; gap:1rem; margin:2rem 0; }
.topic-pager a { flex:1 1 13rem; padding:1rem; }
.topic-pager small,.topic-pager strong { display:block; }
.topic-pager small { color:var(--accent); }
.topic-body { max-width:52rem; }
.story-heading { margin-bottom:1.5rem; }
.story-meta { color:var(--muted); font-size:.85rem; margin-bottom:.85rem; }
.story-heading .story-subtitle { font-size:1.3rem; }
.reader-board { border-radius:1.5rem; padding:clamp(1rem,3vw,2rem); }
.reader-toolbar { display:flex; align-items:center; justify-content:space-between; gap:1rem; border-bottom:1px solid var(--line); padding-bottom:1rem; margin-bottom:1rem; }
.reader-toolbar p { margin:0; color:var(--muted); font-size:.9rem; }
.reader-control { flex-shrink:0; }
.parallel-paragraph,.parallel-labels { display:grid; grid-template-columns:1fr 1fr; gap:2.5rem; }
.parallel-labels { color:#64748b; margin-bottom:1rem; }
.parallel-paragraph { margin:1.2rem 0; }
.parallel-paragraph p { margin:0; font-size:1.16rem; line-height:1.85; }
.parallel-paragraph [lang=ru] { color:var(--muted); }
.parallel-paragraph .reading-seg { display:inline; font:inherit; text-align:left; }
.word-token { font:inherit; }
.read-sentinel { height:1px; }
.reading-position { position:fixed; top:0; left:0; width:100%; height:3px; z-index:7; margin:0; }
.reading-position::-webkit-progress-value { background:linear-gradient(90deg,#fb923c,#dc2626); }
.word-dialog { position:fixed; inset:auto; margin:0; width:min(22rem,calc(100vw - 16px)); max-height:calc(100dvh - 20px); padding:1rem; border-radius:1rem; box-shadow:0 12px 48px #0f172a33; z-index:8; }
.word-dialog [data-reader-target=form] { font-weight:750; color:var(--accent); }
.word-dialog .reader-control { background:#fff7ed; }
.reader-end { margin-top:1.5rem; }
.reader-nav { border-top:1px solid var(--line); padding-top:1rem; }
.button:hover { background:#9a3412; }
.dialogue-line.reply { background:#ffedd5; }
@media(max-width:900px){.hub-heading {grid-template-columns:1fr;gap:1rem}.book-grid {grid-template-columns:repeat(2,minmax(0,1fr))}.shelf-options{margin-left:0}}
@media(max-width:700px){
  .parallel-labels {display:none;}
  .book-grid,.parallel-paragraph {grid-template-columns:minmax(0,1fr);}
  .parallel-paragraph {gap:.2rem;}
  .reader-toolbar {align-items:start;flex-direction:column;}
  .shelf-tools {display:grid;gap:.5rem;}
  .crumbs {margin-top:1.3rem;}
  .shelf-section progress {width:3rem;}
}
@media(prefers-reduced-motion:reduce){.book-card{transition:none;}}

.home-intro { padding:clamp(2rem,5vw,4rem) 0 2rem; }
.home-intro h1 { font-size:clamp(2.5rem,5vw,3.6rem); font-weight:800; margin-bottom:1rem; }
.home-actions { display:flex; align-items:center; gap:.75rem; flex-wrap:wrap; margin:1.25rem 0; }
.home-actions .button { border-radius:999px; }
.home-actions .reader-control { padding:.7rem 1rem; }
.home-sections { padding-block:1rem 2.5rem; }
.home-sections h2 { font-size:1.4rem; }
.home-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr)); gap:1rem; }
.home-grid p { margin:.5rem 0 0; font-size:.9rem; color:var(--muted); }
.book-wrap:nth-child(4n + 2) { --card-color:#0891b2; }
.book-wrap:nth-child(4n + 3) { --card-color:#7c3aed; }
.book-wrap:nth-child(4n) { --card-color:#059669; }

.first-grammar { display:grid; gap:1.25rem; }
.first-grammar h2 { font-size:clamp(1.4rem,3vw,1.8rem); margin-bottom:1rem; }
.first-grammar .topic-example { background:var(--pale); padding:1rem; }
.first-grammar .topic-example p, .speaker-lines p { margin:0; }
.first-grammar .topic-example [lang=de], .speaker-lines [lang=de] { font-size:1.35rem; }
.speaker-switch { display:flex; gap:.5rem; flex-wrap:wrap; margin:1.25rem 0; }
.speaker-switch button { border:1px solid var(--line); border-radius:999px; padding:.6rem 1rem; background:white; }
.speaker-switch [aria-pressed=true] { background:var(--pale); border-color:var(--accent); color:var(--accent); }
.speaker-lines { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr)); gap:.8rem; margin-bottom:1rem; }
.speaker-lines>div { padding:1rem; background:#f8fafc; border-radius:.75rem; }
.speaker-lines small, .speaker-lines span { color:var(--muted); }
.speaker-lines b { color:var(--accent); }
.sein-question { margin:1.4rem 0; padding:0; min-width:0; }
.sein-question legend { margin-bottom:.6rem; }
.sein-option { display:inline-flex; gap:.45rem; align-items:center; padding:.55rem .8rem; border:1px solid var(--line); border-radius:.55rem; margin:0 .3rem .35rem 0; cursor:pointer; }
.sein-question input[type=radio] { accent-color:var(--accent); }
.sein-question .feedback { margin:.6rem 0; }
.topic-reading-list { margin:1.6rem 0; }
#sein-practice { scroll-margin-top:6rem; }
