:root{
  --jw-purple:#5f3b8c;
  --jw-purple-dark:#432b63;
  --jw-purple-mid:#7759a3;
  --jw-purple-soft:#ede7f4;
  --jw-blue-link:#4774b7;
  --jw-blue-soft:#eaf2ff;
  --bg-main:#f2f2f2;
  --bg-page:#ffffff;
  --bg-soft:#eeeeee;
  --text-main:#191b1f;
  --text-muted:#62656b;
  --border-light:#d9d9d9;
  --border-soft:#ececec;
  --shadow:0 16px 42px rgba(0,0,0,.12);
  --font: "Segoe UI", Roboto, Arial, sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:var(--font);color:var(--text-main);background:var(--bg-main)}
button,input{font:inherit}
button{cursor:pointer}
.hidden{display:none!important}

/* Login */
.login-view{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f7f7f7 0%,#ece8f2 100%);padding:30px}
.login-shell{width:min(980px,100%);background:#fff;border-radius:28px;padding:42px;box-shadow:var(--shadow)}
.login-brand{display:flex;gap:22px;align-items:center;margin-bottom:34px}
.brand-mark{width:70px;height:70px;border-radius:18px;background:var(--jw-purple);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:24px;letter-spacing:.02em}
.eyebrow{text-transform:uppercase;color:var(--jw-purple);font-size:13px;font-weight:700;letter-spacing:.08em;margin:0 0 6px}
h1{font-size:clamp(28px,4vw,46px);line-height:1.08;margin:0;color:#17181a}.login-subtitle{margin:10px 0 0;color:var(--text-muted);font-size:18px}.profile-grid{display:grid;grid-template-columns:repeat(2,minmax(220px,1fr));gap:22px}.profile-card{border:1px solid var(--border-soft);border-radius:22px;background:#fafafa;padding:26px;display:flex;flex-direction:column;align-items:center;gap:14px;transition:.2s}.profile-card:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(0,0,0,.08);border-color:#d4c4e8}.profile-card img{width:118px;height:118px;border-radius:50%;object-fit:cover}.profile-card strong{font-size:20px}.password-card{margin:auto;max-width:440px;background:#fbfbfb;border:1px solid var(--border-soft);border-radius:24px;padding:24px}.selected-profile{display:flex;align-items:center;gap:14px;margin:12px 0 22px}.selected-profile img{width:58px;height:58px;border-radius:50%}.password-card label{display:block;font-weight:700;margin-bottom:8px}.password-card input{width:100%;padding:15px 16px;border:1px solid #ccc;border-radius:12px;background:#fff;outline:none}.password-card input:focus{border-color:var(--jw-purple);box-shadow:0 0 0 3px rgba(95,59,140,.12)}.primary-button,.ghost-button,.top-button,.small-button{border:0;border-radius:10px;padding:11px 15px}.primary-button{width:100%;background:var(--jw-purple);color:#fff;font-weight:700;margin-top:14px}.ghost-button{background:transparent;color:var(--jw-purple);padding-left:0}.login-message{min-height:18px;color:#b3261e;font-size:14px}.login-note{color:var(--text-muted);font-size:13px;text-align:center;margin-bottom:0}

/* App shell */
.app-view{min-height:100vh}.topbar{position:fixed;top:0;left:0;right:0;height:64px;background:var(--jw-purple);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 16px;z-index:30;box-shadow:0 2px 8px rgba(0,0,0,.16)}.topbar-left{display:flex;align-items:center;gap:12px;min-width:0}.topbar-left strong{display:block;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar-left span{display:block;font-size:12px;opacity:.86}.topbar-actions{display:flex;align-items:center;gap:9px}.icon-button{width:40px;height:40px;border:0;border-radius:10px;background:rgba(255,255,255,.12);color:inherit;font-size:21px;display:flex;align-items:center;justify-content:center}.icon-button:hover{background:rgba(255,255,255,.2)}.top-button{background:#fff;color:var(--jw-purple);font-weight:700}.search-box{width:min(380px,34vw);height:40px;background:rgba(255,255,255,.16);border-radius:12px;display:flex;align-items:center;gap:8px;padding:0 12px}.search-box input{width:100%;height:100%;border:0;background:transparent;color:#fff;outline:0}.search-box input::placeholder{color:rgba(255,255,255,.78)}
.sidebar{position:fixed;top:64px;bottom:0;left:0;width:232px;background:#e5e5e5;border-right:1px solid #cfcfcf;z-index:25;display:flex;flex-direction:column;transition:.2s}.sidebar nav{padding:14px 10px;display:flex;flex-direction:column;gap:5px}.nav-item{border:0;background:transparent;color:#333;text-align:left;border-radius:12px;padding:12px 13px;display:flex;align-items:center;gap:12px;font-weight:600}.nav-item span{width:28px;height:28px;border-radius:8px;background:#d8d8d8;display:flex;align-items:center;justify-content:center;color:var(--jw-purple);font-weight:800}.nav-item.active,.nav-item:hover{background:#fff}.nav-item.active span{background:var(--jw-purple);color:#fff}.sidebar-user{margin-top:auto;padding:14px;border-top:1px solid #d0d0d0;display:flex;align-items:center;gap:10px;font-size:14px}.sidebar-user img{width:38px;height:38px;border-radius:50%}.sidebar-source{font-size:11px;color:#777;padding:0 14px 14px}.main-content{padding:92px 32px 40px 264px;min-height:100vh;transition:.2s}.main-content.panel-open{padding-right:calc(var(--panel-width, 420px) + 28px)}

/* Index */
.page-header{max-width:1100px;margin:0 auto 28px}.course-title{font-size:34px;margin:0 0 10px}.page-subtitle{color:var(--text-muted);font-size:16px;margin:0}.day-block{max-width:1060px;margin:0 auto 46px}.day-title{font-size:24px;margin:0 0 12px;text-transform:uppercase}.lesson-list{background:#fff;border-radius:18px;border:1px solid var(--border-soft);overflow:hidden}.lesson-row{display:grid;grid-template-columns:76px 1fr auto;gap:16px;align-items:center;padding:14px 18px;border-bottom:1px solid var(--border-soft);background:#fff}.lesson-row:last-child{border-bottom:0}.lesson-row:hover{background:#fbfbff}.lesson-thumb{width:62px;height:62px;border-radius:4px;background:#d8d8d8;display:flex;align-items:center;justify-content:center;color:#777;font-weight:800}.lesson-meta{font-size:12px;color:#555;text-transform:uppercase;margin-bottom:4px}.lesson-link{color:#7aa3df;font-size:16px;background:transparent;border:0;padding:0;text-align:left}.lesson-status{display:flex;align-items:center;gap:8px;color:var(--text-muted);font-size:13px}.status-pill{border-radius:999px;background:#f0f0f0;padding:6px 10px}.status-pill.done{background:#e7f2eb;color:#256b3f}.kebab{font-size:24px;color:#666}.empty-state{max-width:960px;margin:0 auto;background:#fff;border-radius:16px;padding:24px;color:var(--text-muted)}

/* Lesson */
.lesson-page{max-width:920px;margin:0 auto;background:#fff;padding:36px 42px 70px;border-radius:18px;border:1px solid var(--border-soft);box-shadow:0 3px 14px rgba(0,0,0,.04)}.lesson-kicker{color:#555;font-weight:800;text-transform:uppercase;letter-spacing:.02em}.lesson-title{font-size:38px;line-height:1.1;margin:14px 0 32px}.section-title{font-size:29px;text-transform:uppercase;margin:34px 0 20px}.subsection-title{font-size:24px;margin:30px 0 16px}.lesson-page p{font-size:19px;line-height:1.48;margin:0 0 22px}.lesson-page ul{font-size:19px;line-height:1.5;margin:0 0 22px 22px}.lesson-page li{margin-bottom:8px}.callout{font-size:19px;line-height:1.55;margin:24px 0 28px;padding-left:32px;position:relative}.callout:before{content:"◆";position:absolute;left:0;color:#222}.read-text{font-size:18px;font-style:italic;margin:22px 0;color:#333}.question-card{border-top:1px solid #e9e9e9;padding:18px 0 20px}.question-card.indent{margin-left:38px}.question-row{display:flex;gap:12px;align-items:flex-start}.question-text{font-size:19px;line-height:1.48;flex:1}.ref-link{color:var(--jw-blue-link);background:transparent;border:0;padding:0;text-align:left;text-decoration:none;border-bottom:1px solid rgba(71,116,183,.25);font-size:inherit}.ref-link:hover{color:#245da0;border-bottom-color:#245da0}.prepared-button{min-width:34px;height:34px;border-radius:50%;border:1px solid #d0d0d0;background:#fff;color:#777;font-size:16px}.prepared-button.active{background:var(--jw-purple);color:#fff;border-color:var(--jw-purple)}.note-toggle-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:13px}.note-toggle{border:1px solid #ddd;background:#f7f7f7;border-radius:12px;padding:10px 12px;color:#333}.note-toggle.has-content{background:var(--jw-purple-soft);border-color:#d7c6ec;color:var(--jw-purple-dark)}.note-area{margin-top:14px;border:1px solid #ddd;border-radius:14px;overflow:hidden;background:#fff}.note-area-title{display:flex;align-items:center;justify-content:space-between;background:#f5f5f5;padding:10px 12px;border-bottom:1px solid #ddd}.note-area-title strong{font-size:14px}.saving-state{font-size:12px;color:#777}.editor-toolbar{display:flex;gap:4px;flex-wrap:wrap;padding:8px;border-bottom:1px solid #eee;background:#fafafa}.editor-toolbar button,.editor-toolbar select{border:1px solid #ddd;background:#fff;border-radius:7px;padding:6px 8px;min-width:32px}.editor-toolbar button:hover{background:#f0f0f0}.rich-editor{min-height:110px;padding:14px 16px;font-size:17px;line-height:1.5;outline:0}.rich-editor:empty:before{content:attr(data-placeholder);color:#9a9a9a}.rich-editor blockquote{margin:14px 0;padding:14px 16px 14px 42px;background:#f2f2f2;border-left:4px solid #777;color:#3a3a3a;position:relative}.rich-editor blockquote:before{content:"“";position:absolute;left:12px;top:2px;font-size:42px;color:#777}.inline-ref-list{display:inline}.scripture-list{margin:18px 0 18px 32px;display:flex;flex-direction:column;gap:14px}.scripture-list .ref-link{font-size:19px;align-self:flex-start}.subquestion-list{margin:12px 0 0 0;display:flex;flex-direction:column;gap:16px}.content-pending{border:1px dashed #ccc;border-radius:14px;padding:20px;background:#fafafa;color:#777;margin-top:24px}.lesson-tools{display:flex;gap:10px;flex-wrap:wrap;margin:-12px 0 28px}.lesson-tools button{border:1px solid #ddd;border-radius:10px;background:#f9f9f9;padding:10px 12px;color:#333}.lesson-tools button:hover{background:#fff}

/* Panel */
.reference-panel{position:fixed;top:64px;right:0;bottom:0;width:var(--panel-width,420px);min-width:320px;max-width:70vw;background:#fff;border-left:1px solid #bbb;z-index:22;transform:translateX(100%);transition:.2s;box-shadow:-10px 0 26px rgba(0,0,0,.08);display:flex;flex-direction:column}.reference-panel.open{transform:translateX(0)}.panel-resizer{position:absolute;left:-5px;top:0;width:9px;height:100%;cursor:ew-resize;background:transparent}.panel-header{height:66px;border-bottom:1px solid #e0e0e0;display:flex;align-items:center;gap:10px;padding:0 14px}.panel-header .icon-button{background:#f3f3f3;color:var(--jw-purple)}.panel-header strong{display:block}.panel-header span{font-size:12px;color:#666}.panel-actions{display:flex;gap:8px;padding:10px 14px;border-bottom:1px solid #eee}.small-button{background:#f1f1f1;color:#333;text-decoration:none;font-size:13px}.panel-body{flex:1;overflow:auto;padding:16px}.ref-card{background:#f7f7f7;border:1px solid #e4e4e4;border-radius:14px;padding:16px;margin-bottom:14px}.ref-card h3{margin:0 0 8px}.ref-card p{line-height:1.48}.iframe-wrap{height:calc(100vh - 226px);border:1px solid #ddd;border-radius:12px;overflow:hidden;background:#fafafa}.iframe-wrap iframe{width:100%;height:100%;border:0}.iframe-warning{font-size:13px;color:#666;margin-top:10px;line-height:1.35}

/* Search */
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:50;display:flex;align-items:flex-start;justify-content:center;padding:88px 18px 24px}.search-modal{width:min(760px,100%);max-height:78vh;background:#fff;border-radius:18px;box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-bottom:1px solid #eee}.modal-header h2{margin:0}.search-results{overflow:auto;padding:8px}.search-result{border-bottom:1px solid #eee;padding:14px}.search-result button{background:transparent;border:0;padding:0;text-align:left;color:var(--jw-blue-link);font-weight:700}.search-result p{margin:6px 0 0;color:#666;line-height:1.35}

/* Fullscreen */
.fullscreen-editor{position:fixed;inset:0;background:#fff;z-index:70;display:flex;flex-direction:column}.fullscreen-toolbar{height:64px;background:var(--jw-purple);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 18px}.fullscreen-toolbar span{display:block;font-size:12px;opacity:.88}.fullscreen-editor-host{flex:1;overflow:auto;padding:22px}.fullscreen-editor-host .note-area{height:100%;display:flex;flex-direction:column}.fullscreen-editor-host .rich-editor{flex:1;min-height:60vh;font-size:20px}

@media(max-width:900px){
  .search-box{display:none}.sidebar{transform:translateX(-100%);width:250px}.sidebar.open{transform:translateX(0)}.main-content{padding:88px 16px 32px}.main-content.panel-open{padding-right:16px}.lesson-page{padding:26px 20px;border-radius:14px}.lesson-title{font-size:31px}.section-title{font-size:25px}.question-card.indent{margin-left:16px}.lesson-row{grid-template-columns:62px 1fr}.lesson-status{grid-column:2}.reference-panel{top:64px;width:100vw;max-width:100vw}.profile-grid{grid-template-columns:1fr}.login-shell{padding:28px}.login-brand{align-items:flex-start}.topbar-actions{gap:6px}.top-button{padding:9px 10px}.course-title{font-size:28px}.main-content .page-header,.day-block{max-width:100%}
}
@media print{.topbar,.sidebar,.reference-panel,.lesson-tools,.note-toggle-row,.editor-toolbar,.prepared-button{display:none!important}.main-content{padding:0}.lesson-page{box-shadow:none;border:0;border-radius:0;max-width:none}}

/* v3 refinements */
.sidebar.collapsed{transform:translateX(-100%)}
body.sidebar-collapsed .main-content{padding-left:32px}
body.sidebar-collapsed .main-content.panel-open{padding-left:32px;padding-right:calc(var(--panel-width, 420px) + 28px)}
.apple-toolbar select{font-weight:600;color:#333;background:#fff;min-width:112px}
.apple-toolbar button[data-cmd="highlight"]{background:#fff8c7;border-color:#eadc84;color:#514600;font-weight:700}
.apple-toolbar button[data-cmd="indentCustom"],.apple-toolbar button[data-cmd="outdentCustom"]{font-weight:800;color:var(--jw-purple)}
.rich-editor h1{font-size:25px;line-height:1.2;margin:14px 0 8px;font-weight:800}
.rich-editor h2{font-size:20px;line-height:1.25;margin:12px 0 8px;font-weight:750;color:#333}
.rich-editor p,.rich-editor div{margin:0 0 8px}
.apple-note-block{background:#f4f4f4;border-left:4px solid #c7c7c7;border-radius:10px;margin:12px 0;padding:12px 14px;color:#333}
.scripture-plain{white-space:pre-wrap;background:#fff;border:1px solid #e6e6e6;border-radius:12px;padding:12px 14px;margin:10px 0 12px;line-height:1.5;color:#1f1f1f}
.question-text .ref-link{font-weight:500}
@media(max-width:860px){body.sidebar-collapsed .main-content{padding-left:16px}.sidebar.collapsed{transform:translateX(-100%)}.sidebar.open{transform:translateX(0)}}


/* v4 refinements */
.lesson-page{width:90%;max-width:1240px;transition:max-width .2s, width .2s}
.main-content.panel-open .lesson-page{width:100%;max-width:980px}
.lesson-tools{margin:-16px 0 30px}.lesson-tools button:disabled{opacity:.42;cursor:not-allowed}
.toolbar-divider{width:1px;height:28px;background:#dedede;margin:2px 5px}
.apple-toolbar button[data-format]{font-weight:700;color:#333;min-width:38px;background:#fff}
.apple-toolbar button[data-format="p"]{font-weight:600}
.editor-toolbar button.active{background:var(--jw-purple-soft)!important;border-color:#b99add!important;color:var(--jw-purple-dark)!important;box-shadow:inset 0 0 0 1px rgba(95,59,140,.12)}
.rich-editor{font-size:10pt;line-height:1.45;color:#222}
.rich-editor p,.rich-editor div{font-size:10pt;line-height:1.45;margin:0 0 7px;font-weight:400}
.rich-editor h1{font-size:14pt;line-height:1.25;margin:10px 0 7px;font-weight:400;color:#222}
.rich-editor h2{font-size:12pt;line-height:1.3;margin:9px 0 6px;font-weight:400;color:#333}
.rich-editor ul,.rich-editor ol{font-size:10pt;line-height:1.45;margin-top:4px;margin-bottom:8px}
.rich-editor blockquote,.apple-note-block{margin:10px 0;padding:10px 12px 10px 38px;background:#f2f2f2;border-left:4px solid #777;border-radius:10px;color:#333;position:relative;font-size:10pt;line-height:1.45}
.rich-editor blockquote:before,.apple-note-block:before{content:'“';position:absolute;left:10px;top:-2px;font-size:38px;line-height:1;color:#777;font-family:Georgia,serif}
.fullscreen-editor-host .rich-editor{font-size:12pt}.fullscreen-editor-host .rich-editor h1{font-size:17pt}.fullscreen-editor-host .rich-editor h2{font-size:14pt}
.ref-text-editor{margin-top:14px;padding-top:12px;border-top:1px solid #ddd;display:flex;flex-direction:column;gap:8px}.ref-text-editor.compact{padding-top:8px}.ref-text-editor label{font-weight:700;font-size:13px;color:#555}.ref-text-editor textarea{width:100%;min-height:130px;resize:vertical;border:1px solid #ccc;border-radius:10px;padding:10px;font-family:var(--font);font-size:14px;line-height:1.45}
.scripture-plain{font-size:15px;line-height:1.5;background:#fffef7;border-color:#eadc84}
@media(max-width:900px){.lesson-page{width:100%}.main-content.panel-open .lesson-page{width:100%}}

/* v6 refinements */
.profile-grid{align-items:stretch}.profile-card{cursor:pointer}
.rich-editor{font-size:10pt;line-height:1.5}.rich-editor p,.rich-editor div{font-size:10pt;font-weight:400}.rich-editor h1{font-size:15pt;font-weight:400;line-height:1.25;margin:.25em 0}.rich-editor h2{font-size:13pt;font-weight:400;line-height:1.28;margin:.25em 0}.editor-toolbar button.active{background:#e8ddf2;border-color:#8a68ad;color:#432b63;box-shadow:inset 0 0 0 1px rgba(67,43,99,.12)}
.summary-block{margin-top:42px;border-top:1px solid #e5e5e5;padding-top:24px}.summary-block .section-title{margin-top:0}.lesson-bottom-nav{display:flex;gap:10px;justify-content:space-between;flex-wrap:wrap;margin:28px 0 0}.lesson-bottom-nav button{border:1px solid #ddd;border-radius:10px;background:#f9f9f9;padding:11px 13px;color:#333}.lesson-bottom-nav button:disabled{opacity:.42;cursor:not-allowed}.lesson-page{width:90%;max-width:1320px}.main-content.panel-open .lesson-page{width:100%;max-width:980px}
@media(max-width:860px){
  .login-view{padding:16px}.login-shell{padding:22px 16px;border-radius:22px;min-height:auto}.login-brand{gap:12px;margin-bottom:24px;align-items:center}.brand-mark{width:48px;height:48px;font-size:18px;flex:0 0 auto}.eyebrow{font-size:11px}.login-brand h1{font-size:25px;line-height:1.12}.login-subtitle{font-size:14px}.profile-grid{grid-template-columns:1fr;gap:12px}.profile-card{display:grid;grid-template-columns:56px 1fr;grid-template-rows:auto;align-items:center;text-align:left;padding:14px 16px;border-radius:17px;min-height:84px}.profile-card img{width:56px;height:56px;grid-row:1}.profile-card strong{font-size:17px}.password-card{padding:18px;border-radius:18px}.selected-profile img{width:50px;height:50px}.topbar-left #topTitle{max-width:120px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar-left #topSubtitle{display:none}.topbar-actions{gap:4px}.top-button{font-size:12px;padding:8px 9px}.icon-button{min-width:36px}.lesson-page{width:100%;padding:24px 18px}.lesson-title{font-size:28px}.lesson-tools{gap:7px}.lesson-tools button{font-size:12px;padding:9px 10px}.summary-block{margin-top:32px}.lesson-bottom-nav button{flex:1 1 auto;font-size:13px}.profile-card:hover{transform:none}
}


/* v11 chat + navigation refinements */

.cache-button{background:#efe7f8;color:#432b63;border:1px solid rgba(255,255,255,.35);white-space:nowrap}
.cache-button:disabled{opacity:.72;cursor:wait}
@media(max-width:860px){.cache-button{font-size:11px;padding:8px 8px;max-width:96px;overflow:hidden;text-overflow:ellipsis}}


/* v11 internal chat */
.chat-widget{position:fixed;right:18px;bottom:18px;z-index:65}
.chat-fab{width:56px;height:56px;border:0;border-radius:50%;background:var(--jw-purple);color:#fff;box-shadow:0 12px 28px rgba(0,0,0,.25);display:flex;align-items:center;justify-content:center;position:relative;font-size:24px}
.chat-fab:hover{background:var(--jw-purple-dark)}
.chat-fab-icon{line-height:1;font-size:23px}
.chat-badge{position:absolute;right:-3px;top:-4px;min-width:22px;height:22px;border-radius:999px;background:#d93025;color:#fff;border:2px solid #fff;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;padding:0 5px}
.chat-panel{position:absolute;right:0;bottom:70px;width:360px;max-width:calc(100vw - 32px);height:520px;max-height:calc(100vh - 110px);background:#fff;border:1px solid #ddd;border-radius:20px;box-shadow:0 18px 46px rgba(0,0,0,.25);overflow:hidden;display:flex;flex-direction:column}
.chat-header{height:62px;background:var(--jw-purple);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 14px 0 18px}
.chat-header strong{display:block;font-size:16px}
.chat-header span{display:block;font-size:12px;opacity:.85;margin-top:2px}
.chat-header .icon-button{background:rgba(255,255,255,.16);color:#fff}
.chat-recipient-row{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid #eee;background:#fafafa}
.chat-recipient-row label{font-size:13px;font-weight:700;color:#555}
.chat-recipient-row select{flex:1;border:1px solid #d0d0d0;border-radius:10px;background:#fff;padding:9px 10px;outline:0}
.chat-messages{flex:1;overflow:auto;padding:14px;background:#f3f3f3;display:flex;flex-direction:column;gap:10px}
.chat-empty{margin:auto;color:#777;text-align:center;font-size:14px;line-height:1.35}
.chat-message{max-width:88%;border-radius:14px;padding:9px 11px;box-shadow:0 2px 8px rgba(0,0,0,.05)}
.chat-message.mine{align-self:flex-end;background:#ede7f4;border-bottom-right-radius:5px}
.chat-message.theirs{align-self:flex-start;background:#fff;border-bottom-left-radius:5px}
.chat-message-meta{font-size:11px;color:#666;margin-bottom:4px}
.chat-message-text{font-size:14px;line-height:1.35;white-space:pre-wrap;overflow-wrap:anywhere}
.chat-form{display:flex;gap:8px;padding:12px;border-top:1px solid #eee;background:#fff}
.chat-form input{flex:1;border:1px solid #ccc;border-radius:12px;padding:12px 12px;outline:0}
.chat-form input:focus{border-color:var(--jw-purple);box-shadow:0 0 0 3px rgba(95,59,140,.12)}
.chat-form button{border:0;border-radius:12px;background:var(--jw-purple);color:#fff;font-weight:700;padding:0 14px}
@media(max-width:860px){
  .chat-widget{right:14px;bottom:14px}
  .chat-fab{width:52px;height:52px}
  .chat-panel{width:calc(100vw - 28px);height:min(500px,calc(100vh - 96px));bottom:64px;border-radius:18px}
}


/* v13 usability fixes: no iOS zoom, sticky toolbar, highlight colors, private chat view */
.note-area{overflow:visible}
.note-area .editor-toolbar{position:sticky;top:64px;z-index:18;box-shadow:0 2px 0 rgba(0,0,0,.04)}
.fullscreen-editor-host .editor-toolbar{top:0;z-index:25}
.editor-toolbar button[data-cmd="highlightBlue"]{background:#e8f9ff;border-color:#30d2ff;color:#005a72;font-weight:700}
.editor-toolbar button[data-cmd="highlightBlue"].active{background:#8eeaff!important;border-color:#00bff0!important;color:#004c62!important}
.chat-recipient-row select{font-weight:600}.chat-panel{overscroll-behavior:contain}
@media(max-width:1024px){
  input, textarea, select, .rich-editor, .chat-form input, .password-card input{font-size:16px!important;touch-action:manipulation}
  .rich-editor p,.rich-editor div,.rich-editor li{font-size:16px!important;line-height:1.48}
  .rich-editor h1{font-size:21px!important}.rich-editor h2{font-size:18px!important}
  .editor-toolbar{top:64px;gap:5px;padding:8px 6px;overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch}
  .editor-toolbar button{flex:0 0 auto;min-height:36px}
  .fullscreen-editor-host{padding:0 14px 18px}.fullscreen-editor-host .note-area{border-left:0;border-right:0;border-radius:0}.fullscreen-editor-host .editor-toolbar{top:0}
}


/* v15 PDF/editor/completion refinements */
.lesson-complete-block{margin:30px 0 6px;padding:18px 0 4px;border-top:1px solid #e5e5e5;display:flex;align-items:center;gap:12px;color:#555;font-weight:700}
.lesson-prepared-button{width:38px;height:38px;min-width:38px;font-size:18px;flex:0 0 auto}


/* v18: PDF text rendering fix lives in JS. Fullscreen editor restored/fixed: no artificial bottom margin, content grows inside the frame. */
.fullscreen-editor-host{
  flex:1;
  overflow:auto;
  padding:22px;
  background:#fff;
}
.fullscreen-editor-host .note-area{
  height:auto!important;
  min-height:calc(100vh - 108px);
  display:block!important;
  overflow:visible!important;
}
.fullscreen-editor-host .rich-editor{
  display:block!important;
  flex:initial!important;
  width:100%;
  min-height:calc(100vh - 230px);
  height:auto!important;
  overflow:visible!important;
  padding-bottom:18px!important;
  margin-bottom:0!important;
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:normal;
}
.fullscreen-editor-host .rich-editor:after{content:none!important;display:none!important;height:0!important}
@media(max-width:1024px){
  .fullscreen-editor-host{padding:0 14px 18px!important}
  .fullscreen-editor-host .note-area{min-height:calc(100vh - 88px)}
  .fullscreen-editor-host .rich-editor{min-height:calc(100vh - 210px);padding-bottom:18px!important}
}


/* v22 lateral lesson navigation */
.lesson-page{touch-action:pan-y}
.lesson-swipe-toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,18px);z-index:90;background:rgba(67,43,99,.94);color:#fff;border-radius:999px;padding:10px 16px;font-weight:800;font-size:14px;box-shadow:0 10px 30px rgba(0,0,0,.18);opacity:0;pointer-events:none;transition:opacity .18s ease, transform .18s ease}
.lesson-swipe-toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:860px){.lesson-swipe-toast{bottom:18px;font-size:13px;padding:9px 14px}}

/* v23 gif chat + visible lesson arrows */
.lesson-nav-hints{position:fixed;inset:64px 0 0 0;pointer-events:none;z-index:24}
.lesson-hint-arrow{position:fixed;top:50%;transform:translateY(-50%);width:34px;height:64px;border:0;border-radius:0 14px 14px 0;background:rgba(67,43,99,.16);color:#5f3b8c;font-size:30px;font-weight:800;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 24px rgba(0,0,0,.10);backdrop-filter:blur(3px);pointer-events:auto;transition:.18s ease}
.lesson-hint-arrow.right{right:0;left:auto;border-radius:14px 0 0 14px}
.lesson-hint-arrow.left{left:0}
.lesson-hint-arrow:hover{background:rgba(67,43,99,.28);color:#432b63}
.lesson-hint-arrow:disabled{opacity:.35;cursor:not-allowed}
@media(max-width:860px){.lesson-hint-arrow{width:30px;height:54px;font-size:26px;top:54%}}

.gif-picker{border-top:1px solid #ededed;background:#fbfbfb;padding:10px 12px;display:flex;flex-direction:column;gap:10px;max-height:260px}
.gif-picker-search{display:flex;gap:8px}
.gif-picker-search input{flex:1;border:1px solid #d0d0d0;border-radius:10px;padding:10px 12px;outline:0;font-size:14px}
.gif-picker-search input:focus{border-color:var(--jw-purple);box-shadow:0 0 0 3px rgba(95,59,140,.12)}
.gif-picker-search button,.chat-gif-button{border:1px solid #d6c8ea;background:#f1eaff;color:var(--jw-purple);font-weight:800;border-radius:12px;padding:0 12px;min-width:52px}
.chat-gif-button.active{background:var(--jw-purple);color:#fff;border-color:var(--jw-purple)}
.gif-picker-results{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;overflow:auto;min-height:84px}
.gif-picker-empty{grid-column:1/-1;color:#777;font-size:13px;text-align:center;padding:12px 4px}
.gif-result{border:1px solid #e1e1e1;background:#fff;border-radius:12px;overflow:hidden;padding:0;cursor:pointer;min-height:74px}
.gif-result img{display:block;width:100%;height:100%;object-fit:cover;aspect-ratio:1/1;background:#eee}
.gif-result:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(0,0,0,.08)}
.chat-message-gif{display:block;max-width:220px;width:100%;border-radius:10px;background:#eee}
.chat-message-text + .chat-message-gif,.chat-message-gif + .chat-message-text{margin-top:8px}
@media(max-width:860px){
  .gif-picker{max-height:220px;padding:9px 10px}
  .gif-picker-results{grid-template-columns:repeat(2,1fr)}
  .chat-message-gif{max-width:180px}
}
