/* AD30 members - video lessons ("Add a lesson"). Scoped: #lxTop / .lx-fig / .lx-gen (full timeline),
   .lx-simple (simple view), .lx-admin (group leader view). */

/* ---------- shared ---------- */
.lx-new{display:inline-block; font:800 10.5px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif; letter-spacing:.5px;
  color:#fff; background:#c2410c; border-radius:4px; padding:0 6px; vertical-align:1px; white-space:nowrap}
.lx-thumb{position:relative; display:block; width:100%; aspect-ratio:16/9; overflow:hidden; background:#111; border-radius:10px}
.lx-thumb img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block}
.lx-play{position:absolute; left:50%; top:50%; width:56px; height:40px; margin:-20px 0 0 -28px; border-radius:12px; background:rgba(204,0,0,.9)}
.lx-play::after{content:""; position:absolute; left:22px; top:11px; border-left:16px solid #fff; border-top:9px solid transparent; border-bottom:9px solid transparent}
.lx-thumb .lx-new{position:absolute; left:8px; top:8px}
.lx-vn{font-size:.7em; font-style:normal; font-weight:700; opacity:.75; margin:0 1px 0 2px}
.lx-text p{margin:6px 0}
.lx-text p:first-child{margin-top:2px}

/* ---------- full timeline (index.html) ---------- */
.kL{background:#55606e}
#lxTop .lx-strip{display:flex; gap:12px; overflow-x:auto; -webkit-overflow-scrolling:touch; scroll-snap-type:x mandatory;
  padding:4px 2px 12px; margin:0 -2px}
#lxTop .lx-card{flex:0 0 72%; max-width:260px; scroll-snap-align:start; display:block; text-decoration:none; color:inherit;
  background:#fff; border:1px solid #e0d6c6; border-radius:12px; padding:8px; -webkit-tap-highlight-color:rgba(184,155,114,.25)}
#lxTop .lx-card:focus-visible{outline:3px solid var(--V,#0f7c86); outline-offset:2px}
#lxTop .lx-ct{display:block; font-weight:700; font-size:16px; line-height:1.25; margin:8px 2px 2px; color:#2a1d10;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
#lxTop .lx-cw{display:block; font-family:var(--sans,sans-serif); font-size:12.5px; color:#7a6a58; margin:0 2px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
#lxTop .lx-strip:only-child{margin-bottom:6px}
.lx-fig{border:1px solid #d9dde3; border-left:4px solid #55606e; border-radius:10px; padding:8px 10px 6px; background:#fcfcfd; margin:8px 0 12px}
.lx-fig figcaption .tag{margin-right:5px}
.lx-fig .lx-sum{background:#f4f5f7; border-left:3px solid #55606e; padding:4px 8px 2px; border-radius:0 6px 6px 0}
.lx-fig .lx-sum .lx-text{font-size:15.5px; line-height:1.45}
.lx-fig .lx-refonly .ref{white-space:normal}
.lx-gen .dt .lx-new{margin-right:4px}

/* ---------- simple view (simple.html) ---------- */
.lx-simple{margin:8px 0 48px}
.lx-simple .lx-h{font-weight:500; font-size:28px; margin:0 0 6px; text-align:center}
.lx-simple .lx-sub{color:var(--muted,#9a9fa8); font-size:15px; text-align:center; margin:0 0 22px}
.lx-simple .lx-list{list-style:none; margin:0; padding:0}
.lx-sc{background:var(--panel,#171b22); border:1px solid var(--line,#2a303a); border-radius:20px; padding:14px; margin:0 0 20px}
.lx-sc.lx-flash{border-color:var(--gold,#d9b870)}
.lx-sc .lx-media{margin:0}
.lx-sc button.lx-thumb{border:0; padding:0; cursor:pointer; border-radius:14px; -webkit-tap-highlight-color:transparent}
.lx-sc button.lx-thumb:focus-visible{outline:3px solid var(--gold,#d9b870); outline-offset:3px}
.lx-sc .lx-play{width:72px; height:52px; margin:-26px 0 0 -36px; border-radius:16px}
.lx-sc .lx-play::after{left:28px; top:14px; border-left-width:20px; border-top-width:12px; border-bottom-width:12px}
.lx-yt{position:relative; width:100%; aspect-ratio:16/9; background:#000; border-radius:14px; overflow:hidden}
.lx-yt iframe, .lx-yt > div{position:absolute; inset:0; width:100%; height:100%; border:0}
.lx-sc-t{font-weight:500; font-size:24px; line-height:1.25; margin:14px 2px 0}
.lx-sc-d{color:var(--muted,#9a9fa8); font-size:15px; margin:6px 2px 0}
.lx-more-btn{display:block; width:100%; min-height:52px; margin:14px 0 0; border-radius:14px; border:1px solid var(--line,#2a303a);
  background:#1d222b; color:var(--text,#ece8df); font:inherit; font-size:17px; cursor:pointer}
.lx-more-btn:focus-visible{outline:2px solid var(--gold,#d9b870); outline-offset:3px}
.lx-more{margin:6px 2px 0}
.lx-simple .lx-k{margin:18px 0 4px; font-size:12px; text-transform:uppercase; letter-spacing:.14em; color:var(--gold,#d9b870)}
.lx-simple .lx-text{font-size:17px; line-height:1.55}
.lx-simple .lx-verses .ln{margin:10px 0}
.lx-simple .lx-verses .tag{display:none}
.lx-simple .lx-verses .ref{display:block; color:var(--gold,#d9b870); font-size:14px; letter-spacing:.03em}
.lx-simple .lx-verses .q{font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif; font-size:20px; line-height:1.5}
.lx-sc-l{margin:14px 2px 0; font-size:15px}
.lx-sc-l a{display:inline-flex; align-items:center; min-height:44px; text-decoration:none}

/* ---------- group leader view (admin.html) ---------- */
.lx-admin{background:var(--panel,#171b22); border:1px solid var(--gold,#d9b870); border-radius:20px; padding:18px 18px 22px; margin:24px 0 0; max-width:640px}
.admin .lx-admin h2{margin:0 0 6px; font-size:28px}
.lx-admin .lx-tip{background:var(--gold-soft,rgba(217,184,112,.14)); border-radius:12px; padding:10px 14px; font-size:16px; margin:8px 0 4px}
.lx-admin label.lx-l{display:block; font-size:17px; color:var(--text,#ece8df); margin:20px 0 8px; font-weight:600}
.lx-admin label.lx-l small{font-weight:400; color:var(--muted,#9a9fa8); font-size:15px}
.lx-admin .field{font-size:18px}
.lx-admin textarea.field{min-height:150px; padding:12px 16px; line-height:1.45; resize:vertical}
.lx-admin select.field{background-image:linear-gradient(45deg,transparent 50%,var(--gold,#d9b870) 50%),linear-gradient(135deg,var(--gold,#d9b870) 50%,transparent 50%);
  background-position:calc(100% - 22px) 50%,calc(100% - 16px) 50%; background-size:6px 6px; background-repeat:no-repeat; padding-right:40px}
.lx-admin .lx-row{display:flex; gap:10px; align-items:stretch}
.lx-admin .lx-row .field{flex:1 1 auto; min-width:0}
.lx-admin .lx-paste{flex:0 0 auto; min-height:56px; padding:0 16px; border-radius:14px; border:1px solid var(--line,#2a303a); background:#232833;
  color:var(--text,#ece8df); font:inherit; font-size:16px; cursor:pointer}
.lx-admin .lx-help{color:var(--muted,#9a9fa8); font-size:15px; margin:8px 0 0}
.lx-admin .lx-warn{color:#f0a58f; font-size:16px; margin:8px 0 0}
.lx-admin .lx-good{color:#9fd49a; font-size:16px; margin:8px 0 0}
.lx-admin .lx-preview{margin:12px 0 0; display:flex; gap:12px; align-items:center}
.lx-admin .lx-preview .lx-thumb{flex:0 0 46%; max-width:240px}
.lx-admin .lx-preview p{margin:0; font-size:15px; color:var(--muted,#9a9fa8); overflow-wrap:anywhere}
.lx-admin .lx-preview b{color:var(--text,#ece8df); font-weight:600}
.lx-admin .lx-vp{margin:10px 0 0}
.lx-admin .lx-vp .lx-v{background:#11151b; border:1px solid var(--line,#2a303a); border-radius:12px; padding:10px 14px; margin:0 0 8px}
.lx-admin .lx-vp .lx-v.bad{border-color:#8a4a3a}
.lx-admin .lx-vp .lx-vr{font-size:14px; font-weight:700; color:var(--gold,#d9b870)}
.lx-admin .lx-vp .lx-vr.bad{color:#f0a58f}
.lx-admin .lx-vp .lx-vt{font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif; font-size:18px; line-height:1.5; margin:4px 0 0}
.lx-admin .lx-vp .lx-lab{font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted,#9a9fa8); margin:0 0 6px}
.lx-admin .btn{min-height:60px; font-size:19px; margin-top:22px}
.lx-admin .lx-cancel{display:block; width:100%; min-height:48px; margin:8px 0 0; font-size:16px; opacity:.9}
.lx-admin .lx-mail{margin:16px 0 0; padding:10px 14px; border:1px dashed var(--line,#2a303a); border-radius:12px; font-size:15px; color:var(--muted,#9a9fa8)}
.lx-admin .msg{font-size:17px}
.lx-admin .msg.ok{color:#9fd49a}
.lx-admin h3{font-weight:500; font-size:22px; margin:32px 0 10px}
.lx-admin .lx-items{list-style:none; margin:0; padding:0}
.lx-admin .lx-item{border:1px solid var(--line,#2a303a); border-radius:16px; padding:12px; margin:0 0 12px; background:#11151b}
.lx-admin .lx-item.hidden-l{opacity:.75; border-style:dashed}
.lx-admin .lx-item-top{display:flex; gap:12px; align-items:flex-start}
.lx-admin .lx-item .lx-thumb{flex:0 0 38%; max-width:180px; border-radius:8px}
.lx-admin .lx-item-t{font-size:18px; font-weight:600; line-height:1.3; margin:0; overflow-wrap:anywhere}
.lx-admin .lx-item-m{font-size:14px; color:var(--muted,#9a9fa8); margin:4px 0 0; overflow-wrap:anywhere}
.lx-admin .lx-state{display:inline-block; font-size:13px; font-weight:700; border-radius:8px; padding:1px 8px; margin:6px 0 0}
.lx-admin .lx-state.on{background:rgba(159,212,154,.15); color:#9fd49a}
.lx-admin .lx-state.off{background:rgba(240,165,143,.15); color:#f0a58f}
.lx-admin .lx-acts{display:flex; gap:8px; margin:12px 0 0}
.lx-admin .lx-acts button{flex:1 1 0; min-height:50px; border-radius:12px; border:1px solid var(--line,#2a303a); background:#232833; color:var(--text,#ece8df);
  font:inherit; font-size:16px; cursor:pointer}
.lx-admin .lx-acts button.del{color:#f0a58f; border-color:#5a3a32}
.lx-admin .lx-acts button:disabled{opacity:.5}
.lx-admin .lx-view{display:inline-flex; align-items:center; min-height:40px; font-size:15px}
.lx-admin .lx-empty{color:var(--muted,#9a9fa8); font-size:16px}
@media (max-width:640px){
  .lx-admin{padding:16px 14px 20px; margin-left:-4px; margin-right:-4px}
  .lx-admin .lx-preview{flex-direction:column; align-items:stretch}
  .lx-admin .lx-preview .lx-thumb{max-width:none}
}

/* v2 staging "dark background" option (html.fx-dark) - harmless on version 1 */
html.fx-dark #lxTop .lx-card{background:#1b1e24; border-color:#343a44}
html.fx-dark #lxTop .lx-ct{color:#f1e7d6}
html.fx-dark #lxTop .lx-cw{color:#b9b2a6}
html.fx-dark .lx-fig{background:#1b1e24; border-color:#343a44; border-left-color:#8c97a6}
html.fx-dark .lx-fig .lx-sum{background:#232830; border-left-color:#8c97a6}

/* ---------- [drive-resources] Google Drive lesson videos ---------- */
.lx-thumb.lx-nothumb{background:radial-gradient(circle at 50% 45%,#3a4250 0,#1a1e25 70%)}
.lx-dbox > button.lx-dposter{position:absolute; inset:0; width:100%; height:100%; aspect-ratio:auto; border:0; padding:0; margin:0; cursor:pointer; border-radius:0;
  -webkit-tap-highlight-color:transparent}
.lx-dbox > .lx-yt{position:absolute; inset:0; border-radius:0}
.lx-admin .lx-also{margin-top:2px; font-size:14px}
.lx-admin .lx-dprev{margin:14px 0 0}
.lx-admin .lx-dprev .lx-yt{border-radius:12px; border:1px solid var(--line,#2a303a)}
.lx-admin .lx-share{margin:12px 0 0; padding:12px 14px; border:2px solid #e0a33a; border-radius:14px; background:rgba(224,163,58,.12); color:var(--text,#ece8df); font-size:16px; line-height:1.45}
.lx-admin .lx-share p{margin:8px 0 0}
.lx-admin .lx-share p.lx-share-h{margin:0; font-size:17px; font-weight:700; color:#f3c46b}
@media (min-width:900px){
  .lx-admin .lx-dprev{display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:14px; align-items:start}
  .lx-admin .lx-dprev .lx-share{margin:0}
}
