/* Slide Studio speaking notes — compact, high-contrast, dual-screen friendly. */
@font-face { font-family:"Notes Text"; src:local("Crimson Pro"),local("Georgia"); }
@font-face { font-family:"Notes UI"; src:local("Atkinson Hyperlegible"),local("Inter"),local("Noto Sans"); }
:root { color-scheme:dark; --bg:#07101a; --rail:#02070c; --surface:#0d1926; --card:#0d1926; --border:#33485d; --ink:#edf2f4; --muted:#9baab8; --accent:#bca36a; --bright:#d8c48f; --cue:#07101a; }
body[data-theme="paper"] { color-scheme:light; --bg:#f4f0e7; --rail:#ded7cb; --surface:#e9e1d3; --card:#fffdf8; --border:#c8bca9; --ink:#25221e; --muted:#726b61; --accent:#9b6637; --bright:#81512d; --cue:#f4f0e7; }
body[data-theme="westside"] { color-scheme:light; --bg:#f8f7f2; --rail:#deddd6; --surface:#eeece4; --card:#fff; --border:#c9c8bc; --ink:#49453d; --muted:#77766b; --accent:#898a55; --bright:#6f7042; --cue:#f8f7f2; }
body[data-theme="aubergine"] { --bg:#17131b; --rail:#0e0a10; --surface:#241d29; --card:#241d29; --border:#4d3e50; --ink:#f1eaee; --muted:#ab9da7; --accent:#c3957d; --bright:#dfb29b; --cue:#17131b; }
body[data-theme="ohtobelikethee"] { --bg:#091612; --rail:#06100d; --surface:#19332c; --card:#10231f; --border:#3f594f; --ink:#f7f1df; --muted:#b9c2b5; --accent:#d9b56d; --bright:#e8c77f; --cue:#0c1d18; }
body[data-theme="sermons"] { --bg:#090909; --rail:#030303; --surface:#1d2021; --card:#141414; --border:#48443a; --ink:#f7f3e8; --muted:#aaa79f; --accent:#e7ad52; --bright:#f3c879; --cue:#0d0d0d; }
body[data-theme="temple"] { --bg:#0d0906; --rail:#080503; --surface:#241a0f; --card:#15100a; --border:#544329; --ink:#f5ecd8; --muted:#b8a98f; --accent:#d6ad58; --bright:#e7c77f; --cue:#120d08; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; font-size:20px; }
html.speaker-embed { font-size:22.5px; }
body { margin:0; min-height:100vh; color:var(--ink); background:var(--bg); font-family:"Notes Text",Georgia,serif; }
code { padding-right:.2em; font-family:"Maple Mono NF",monospace; }
.sn-shell { display:grid; grid-template-columns:minmax(220px,28%) minmax(0,1fr); min-height:100vh; }
.sn-rail { position:sticky; top:0; height:100vh; overflow:auto; padding:1.2rem .9rem; background:var(--rail); border-right:1px solid var(--border); }
.sn-rail h1 { margin:0 0 .3rem; color:var(--bright); font:700 1.35rem/1.05 "Notes UI",sans-serif; }
.sn-subtitle { margin:0 0 1rem; color:var(--muted); font:.78rem/1.3 "Notes UI",sans-serif; }
.sn-rail ol { margin:0; padding:0; list-style:none; }
.sn-rail a { display:block; padding:.38rem .55rem; border-left:3px solid transparent; color:var(--muted); font:.78rem/1.2 "Notes UI",sans-serif; text-decoration:none; }
.sn-rail a:hover,.sn-rail a.is-active { color:var(--ink); background:rgba(251,241,199,.06); border-left-color:var(--accent); }
.sn-main { min-width:0; width:100%; max-width:62rem; padding:1.35rem clamp(1rem,3vw,2.5rem) 75vh; }
.sn-title { margin:0 0 1rem; color:var(--accent); font:700 clamp(2rem,5vw,3.6rem)/1 "Notes UI",sans-serif; letter-spacing:-.04em; }
.sn-section { margin:0 0 1.35rem; border:1px solid var(--border); border-radius:10px; background:var(--card); box-shadow:0 8px 22px rgba(0,0,0,.28); overflow:hidden; opacity:.62; transition:opacity .18s,border-color .18s; }
.sn-section.is-active { opacity:1; border-color:var(--accent); }
.sn-section header { padding:.55rem .8rem; background:var(--surface); }
.sn-section h2 { margin:0; color:var(--ink); font:750 1.35rem/1.12 "Notes UI",sans-serif; }
.sn-kicker { margin:0 0 .18rem; color:var(--bright); font:700 .68rem/1 "Notes UI",sans-serif; letter-spacing:.13em; text-transform:uppercase; }
.sn-body { padding:.7rem .9rem 1rem; font-size:1.05rem; line-height:1.35; }
.sn-body p { margin:.45rem 0; }
.sn-body ul,.sn-body ol { margin:.45rem 0; padding-left:1.4rem; }
.sn-body li { margin:.25rem 0; }
.sn-body blockquote { margin:.7rem 0; padding:.6rem .8rem; border-left:3px solid var(--accent); background:var(--surface); color:#d5c4a1; }
.sn-body h3,.sn-body h4 { margin:1.05rem 0 .35rem; color:var(--bright); font-family:"Notes UI",sans-serif; line-height:1.15; }
.sn-slide-cue { position:relative; margin:.85rem 0; padding:.8rem 1rem .9rem; border:1px solid var(--border); border-left:5px solid var(--accent); border-radius:8px; background:var(--cue); box-shadow:0 8px 18px rgba(0,0,0,.24); font-family:"Notes UI",sans-serif; transition:background .18s,box-shadow .18s,outline-color .18s,transform .18s; }
.sn-slide-cue.is-active { outline:5px solid var(--bright); outline-offset:4px; border-color:var(--bright); border-left-width:9px; border-left-color:var(--bright); background:color-mix(in srgb,var(--accent) 28%,var(--cue)); box-shadow:0 0 0 11px color-mix(in srgb,var(--accent) 38%,transparent),0 20px 46px rgba(0,0,0,.62); transform:translateX(8px) scale(1.01); }
.sn-slide-cue.is-active .sn-slide-label { padding:.3rem .45rem; border-radius:999px; background:var(--bright); color:var(--rail); box-shadow:0 3px 10px rgba(0,0,0,.35); }
.sn-slide-content[contenteditable="true"] { border-radius:5px; outline:1px dashed transparent; cursor:text; }
.sn-slide-content[contenteditable="true"]:hover { outline-color:color-mix(in srgb,var(--accent) 55%,transparent); outline-offset:4px; }
.sn-slide-content[contenteditable="true"]:focus { outline:2px solid var(--accent); outline-offset:5px; }
.sn-slide-content mark {
  padding:.04em .22em;
  border-radius:.3em;
  color:inherit;
  box-decoration-break:clone;
  -webkit-box-decoration-break:clone;
}
.sn-slide-label { position:absolute; top:.55rem; right:.65rem; color:var(--muted); font:700 .58rem/1 "Notes UI",sans-serif; letter-spacing:.12em; text-transform:uppercase; }
.sn-slide-kicker { margin:0 4rem .22rem 0!important; color:var(--bright); font:750 .62rem/1 "Notes UI",sans-serif; letter-spacing:.13em; text-transform:uppercase; }
.sn-slide-cue h3 { margin:0 4rem .35rem 0; color:var(--ink); font:750 1.18rem/1.08 "Notes UI",sans-serif; }
.sn-slide-body { color:#d5c4a1; font-size:.82rem; line-height:1.25; }
.sn-slide-body p,.sn-slide-body ul,.sn-slide-body ol,.sn-slide-body blockquote { margin:.3rem 0; }
.sn-slide-body blockquote { padding:.35rem .55rem; }
.sn-slide-body table {
  width:100%;
  border:0;
  border-collapse:separate;
  border-spacing:0;
  background:transparent;
}
.sn-slide-body .ss-table-card {
  width:max-content;
  max-width:100%;
  overflow:auto;
  border:1px solid color-mix(in srgb,var(--accent) 24%,transparent);
  border-radius:9px;
  background:color-mix(in srgb,var(--surface) 88%,var(--bg));
  box-shadow:0 10px 24px rgba(0,0,0,.3),0 2px 6px rgba(0,0,0,.2);
}
.sn-slide-body th,.sn-slide-body td {
  padding:.48rem .62rem;
  border-right:1px solid color-mix(in srgb,var(--ink) 8%,transparent);
  border-bottom:1px solid color-mix(in srgb,var(--ink) 9%,transparent);
  text-align:left;
}
.sn-slide-body th:last-child,.sn-slide-body td:last-child { border-right:0; }
.sn-slide-body tr:last-child td { border-bottom:0; }
.sn-slide-body thead:last-child tr:last-child th { border-bottom:0; }
.sn-slide-cue.layout-questions .sn-slide-body ol { display:grid; gap:.38rem; }
.sn-slide-cue.layout-questions .sn-slide-body li { margin:0; }
.sn-slide-cue.layout-questions .ss-question-response {
  min-height:1.45rem;
  margin:.24rem 0 0;
  padding:.2rem .4rem;
  border:1px solid color-mix(in srgb,var(--accent) 28%,transparent);
  border-radius:7px;
  outline:none;
  background:color-mix(in srgb,var(--surface) 72%,transparent);
  color:var(--ink);
  cursor:text;
}
.sn-slide-cue.layout-questions .ss-question-response:focus {
  border-color:color-mix(in srgb,var(--accent) 76%,transparent);
  box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 20%,transparent);
}
.sn-slide-body:empty { display:none; }
.sn-empty { color:var(--muted); font-style:italic; }
.sn-status { position:fixed; right:.7rem; bottom:.7rem; padding:.35rem .55rem; border:1px solid var(--border); border-radius:999px; background:rgba(22,24,25,.9); color:var(--muted); font:.68rem "Notes UI",sans-serif; }
.sn-highlight-palette { position:fixed; z-index:20; display:none; gap:8px; padding:8px; border:1px solid var(--border); border-radius:10px; background:var(--surface); box-shadow:0 14px 40px rgba(0,0,0,.45); }
.sn-highlight-palette.is-visible { display:flex; }
.sn-highlight-color { width:34px; height:34px; padding:0; border:3px solid var(--ink); border-radius:50%; color:var(--ink); font:900 .68rem/1 "Notes UI",sans-serif; text-shadow:0 1px 2px rgba(0,0,0,.9); cursor:pointer; }
.sn-highlight-color:hover,.sn-highlight-color:focus { outline:2px solid var(--ink); outline-offset:2px; transform:scale(1.1); }
body.speaker-embed .sn-shell { display:block; }
body.speaker-embed .sn-rail,body.speaker-embed .sn-title { display:none; }
body.speaker-embed .sn-main { max-width:none; padding:2.6rem .8rem 70vh; }
body.speaker-embed { scrollbar-width:thin; scrollbar-color:color-mix(in srgb,var(--muted) 55%,transparent) transparent; }
body.speaker-embed::-webkit-scrollbar { width:6px; }
body.speaker-embed::-webkit-scrollbar-track { background:transparent; }
body.speaker-embed::-webkit-scrollbar-thumb { border-radius:999px; background:color-mix(in srgb,var(--muted) 55%,transparent); }
body.speaker-embed::-webkit-scrollbar-thumb:hover { background:var(--muted); }
@media (max-width:760px) { html{font-size:18px}.sn-shell{grid-template-columns:1fr}.sn-rail{position:sticky;height:auto;max-height:31vh;z-index:4;border-right:0;border-bottom:1px solid var(--border)}.sn-main{padding-top:1rem}.sn-title{display:none} }
/* Portrait laptops such as the vertically rotated MiniBook X report a wider
   CSS viewport than the 760px phone breakpoint, but still benefit from a
   single reading column and a compact, touch-friendly index. */
@media (orientation:portrait) and (min-width:761px) and (max-width:1300px) {
  html { font-size:clamp(18px,2vw,21px); }
  .sn-shell { display:block; }
  .sn-rail {
    position:sticky;
    top:0;
    z-index:4;
    display:block;
    height:auto;
    max-height:26vh;
    overflow:auto;
    padding:.85rem clamp(1rem,4vw,2rem) .7rem;
    border-right:0;
    border-bottom:1px solid var(--border);
  }
  .sn-rail h1 { margin-bottom:.18rem; font-size:1.2rem; }
  .sn-subtitle { margin-bottom:.55rem; }
  .sn-rail ol { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.18rem .55rem; }
  .sn-rail a { min-height:2.2rem; display:flex; align-items:center; padding:.48rem .65rem; font-size:.78rem; line-height:1.18; }
  .sn-title { display:none; }
  .sn-main { max-width:72rem; padding:1rem clamp(1rem,4vw,2rem) 60vh; }
  .sn-section { margin-bottom:1rem; }
  .sn-section header { padding:.68rem .9rem; }
  .sn-section h2 { font-size:1.22rem; line-height:1.16; }
  .sn-body { padding:.8rem .95rem 1.1rem; font-size:1.04rem; line-height:1.45; }
  .sn-body p { margin:.62rem 0; }
  .sn-body li { margin:.35rem 0; }
  .sn-body blockquote { margin:.85rem 0; padding:.72rem .85rem; }
  .sn-slide-cue { margin:1.05rem 0; padding:1rem 1.1rem 1.1rem; }
  .sn-slide-cue.is-active { transform:translateX(4px) scale(1.005); }
  .sn-slide-cue h3 { font-size:1.22rem; line-height:1.14; }
  .sn-slide-body { font-size:.9rem; line-height:1.4; }
  .sn-slide-body p,.sn-slide-body ul,.sn-slide-body ol,.sn-slide-body blockquote { margin:.42rem 0; }
  .sn-slide-body blockquote { padding:.48rem .65rem; }
  .sn-slide-body th,.sn-slide-body td { padding:.55rem .7rem; }
  .sn-status { right:max(.7rem,env(safe-area-inset-right)); bottom:max(.7rem,env(safe-area-inset-bottom)); }
}
@media print { .sn-rail,.sn-status{display:none}.sn-shell{display:block}.sn-main{max-width:none;padding:0}.sn-section{break-inside:avoid;opacity:1;box-shadow:none} }

@media (prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none!important; animation:none!important; scroll-behavior:auto!important; } }
