:root{
  --bg:#050505;--panel:#0c0c0c;--panel2:#121212;--panel3:#171717;
  --line:#2c2c2c;--line-gold:#544600;--yellow:#f6c700;--yellow2:#ffdc45;
  --green:#58d642;--red:#e73528;--text:#f5f5f5;--muted:#b6b6b6;--muted2:#7f7f7f;
  --radius:12px;--header-h:66px;--status-h:28px;--sidebar-w:292px;
  --shadow:0 16px 40px rgba(0,0,0,.28)
}
*{box-sizing:border-box}
html,body{width:100%;height:100%;margin:0;background:var(--bg);color:var(--text);font-family:Inter,"Segoe UI",Arial,sans-serif}
body{overflow:hidden;background:radial-gradient(circle at 16% -18%,rgba(246,199,0,.11),transparent 32rem),#050505}
button,input{font:inherit}
button{touch-action:manipulation}
.hidden{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.app-shell{height:100dvh;display:grid;grid-template-rows:var(--header-h) minmax(0,1fr) var(--status-h)}
.topbar{height:var(--header-h);border-bottom:1px solid var(--line-gold);background:rgba(5,5,5,.97);display:flex;align-items:center;gap:18px;padding:8px 18px;box-shadow:0 8px 30px rgba(0,0,0,.22);z-index:10}
.brand{display:flex;align-items:center;gap:11px;min-width:330px}.brand img{width:190px;height:auto;display:block}.brand-copy{display:flex;flex-direction:column;min-width:0}.brand-copy strong{color:var(--yellow);font-size:15px;letter-spacing:.06em;white-space:nowrap}.brand-copy span{color:var(--muted2);font-size:11px;margin-top:2px;white-space:nowrap}
.header-stats{margin-left:auto;display:flex;align-items:center;gap:8px}.stat{height:42px;min-width:78px;border:1px solid var(--line);border-radius:8px;background:#0b0b0b;display:grid;grid-template-columns:auto auto;align-items:center;justify-content:center;gap:6px;padding:0 10px}.stat b{color:var(--yellow);font-size:18px}.stat small{color:var(--muted2);font-size:9px;font-weight:800;letter-spacing:.08em}.status-pill{height:42px;border:1px solid #235c1a;border-radius:8px;background:#0d1c0a;color:#bfffb4;display:flex;align-items:center;gap:7px;padding:0 11px;font-size:11px;font-weight:900;letter-spacing:.06em}.status-pill i,.statusbar i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 9px rgba(88,214,66,.5)}
.top-actions{display:flex;gap:7px}.action-btn{height:42px;border:1px solid #3b3b3b;border-radius:8px;background:#121212;color:#eee;padding:0 13px;font-size:11px;font-weight:900;cursor:pointer;letter-spacing:.04em}.action-btn:hover,.action-btn:focus-visible{border-color:var(--yellow);outline:none;color:var(--yellow)}.phone-lessons-btn{display:none}
.workspace{min-height:0;display:grid;grid-template-columns:var(--sidebar-w) minmax(0,1fr);gap:10px;padding:10px;width:100%;max-width:none;margin:0}
.catalog,.viewer{min-height:0;border:1px solid var(--line);border-radius:var(--radius);background:rgba(10,10,10,.98);box-shadow:var(--shadow);overflow:hidden}
.catalog{display:grid;grid-template-rows:auto auto auto minmax(0,1fr) auto;padding:12px;gap:10px}.catalog-title{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;padding:1px 2px 3px}.catalog-title>div{display:flex;flex-direction:column;gap:3px}.catalog-title strong{font-size:18px}.kicker{color:var(--green);font-size:10px;font-weight:900;letter-spacing:.13em;text-transform:uppercase}.read-only{border:1px solid #4f4300;color:var(--yellow);background:#171300;border-radius:999px;padding:5px 7px;font-size:9px;font-weight:900;white-space:nowrap}
.search-wrap{position:relative}.search-wrap input{width:100%;height:42px;border:1px solid #383838;border-radius:8px;background:#151515;color:#fff;padding:0 38px 0 12px;font-size:13px}.search-wrap input::placeholder{color:#858585}.search-wrap input:focus{border-color:var(--yellow);outline:2px solid rgba(246,199,0,.12)}.search-wrap span{position:absolute;right:12px;top:10px;color:#aaa;font-size:17px}
.section-tabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:thin;padding-bottom:1px}.section-btn{flex:none;border:1px solid #373737;background:#121212;color:#ddd;border-radius:999px;padding:7px 10px;font-weight:900;font-size:10px;cursor:pointer}.section-btn[aria-selected="true"]{background:var(--yellow);border-color:var(--yellow);color:#050505}.section-btn:focus-visible{outline:2px solid rgba(246,199,0,.35);outline-offset:1px}
.lesson-list{min-height:0;overflow:auto;padding-right:2px;scrollbar-color:#504300 #111}.lesson-card{width:100%;border:1px solid #2d2d2d;background:#121212;color:#fff;border-radius:9px;padding:10px 10px 10px 12px;margin:0 0 7px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;text-align:left;cursor:pointer}.lesson-card:hover,.lesson-card:focus-visible{border-color:#766300;outline:none}.lesson-card.active{border-color:var(--yellow);background:linear-gradient(90deg,#1b1700,#111 72%);box-shadow:inset 4px 0 var(--yellow)}.lesson-title{font-weight:850;font-size:13px;line-height:1.25}.lesson-sub{margin-top:4px;color:#8d8d8d;font-size:10px}.progress-dot{width:18px;height:18px;border:1px solid #555;border-radius:50%;display:grid;place-items:center;font-size:10px}.progress-dot.done{background:var(--green);border-color:var(--green);color:#061004;font-weight:900}.empty-list{padding:22px 8px;color:var(--muted);font-size:12px;text-align:center}.catalog-foot{border-top:1px solid #242424;padding:8px 2px 0;display:flex;justify-content:space-between;gap:8px;align-items:center}.catalog-foot strong{font-size:9px;color:var(--yellow);letter-spacing:.08em}.catalog-foot span{font-size:9px;color:#777;text-align:right}
.viewer{display:block}.lesson-view{height:100%;display:grid;grid-template-rows:auto 34px minmax(0,1fr) 58px}.lesson-head{min-height:104px;padding:14px 18px 10px;border-bottom:1px solid #222;background:linear-gradient(180deg,#101010,#0b0b0b)}.lesson-topline{display:flex;align-items:center;justify-content:space-between;gap:12px}.lesson-head h1{margin:4px 0 4px;color:var(--yellow);font-size:clamp(25px,2.3vw,36px);line-height:1.04;letter-spacing:-.02em}.lesson-summary{margin:0;color:#a9a9a9;font-size:12px;line-height:1.35;max-width:1200px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.approved-badge{flex:none;border:1px solid #25651b;background:#0e240b;color:#8df179;padding:5px 8px;border-radius:999px;font-size:9px;font-weight:900;letter-spacing:.05em;white-space:nowrap}
.progress-row{display:flex;align-items:center;gap:12px;padding:0 18px;background:#0a0a0a;border-bottom:1px solid #222}.step-meter{height:5px;flex:1;background:#242424;border-radius:999px;overflow:hidden}.step-meter span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--yellow),#ffea88);transition:width .2s ease}.step-count{font-size:10px;font-weight:900;color:#adadad;white-space:nowrap;letter-spacing:.05em}
.lesson-scroll{min-height:0;overflow:auto;scrollbar-color:#4a3d00 #101010;padding:12px 14px}.lesson-scroll.media-mode{overflow:hidden}.content-card{min-height:100%;max-width:1420px;margin:0 auto;border:1px solid #242424;border-radius:10px;background:#0d0d0d;padding:18px;display:grid;grid-template-columns:minmax(0,1fr);align-content:start;gap:18px}.content-card.with-media{height:100%;min-height:0;grid-template-columns:minmax(300px,.72fr) minmax(440px,1.28fr);align-items:stretch;align-content:stretch}.copy-pane{min-width:0}.content-card.with-media .copy-pane{min-height:0;overflow:auto;padding-right:4px;scrollbar-color:#4a3d00 #101010}.block-type{display:inline-flex;align-items:center;min-height:24px;border:1px solid #275f20;border-radius:999px;background:#0e1d0c;color:#7ce76b;padding:0 9px;font-size:9px;font-weight:950;letter-spacing:.11em;text-transform:uppercase;margin-bottom:8px}.content-card h2{margin:0 0 10px;font-size:clamp(24px,2.1vw,34px);line-height:1.07;letter-spacing:-.01em}.body-text{color:#ededed;font-size:clamp(15px,1.12vw,18px);line-height:1.5;max-width:78ch}.body-text p{margin:0 0 12px}.body-text p:last-child{margin-bottom:0}.body-text ul{margin:8px 0 12px;padding-left:1.2rem}.body-text li{margin:4px 0;padding-left:2px}.body-text li::marker{color:var(--yellow)}.body-text.warning{border:1px solid #704700;background:#211600;color:#ffe1a0;border-radius:9px;padding:12px 14px;max-width:none}.body-text.tip{border:1px solid #285e20;background:#0c2009;color:#bdf8b3;border-radius:9px;padding:12px 14px;max-width:none}
.media-frame{min-width:0;min-height:0;height:100%;border:1px solid var(--line-gold);border-radius:10px;background:#070707;padding:9px;align-self:stretch;display:flex;flex-direction:column;overflow:hidden}.media-frame img,.media-frame video{display:block;width:100%;height:100%;min-height:0;max-height:none;flex:1 1 auto;object-fit:contain;border-radius:6px;background:#000}.media-frame video{min-height:0}.media-caption{flex:0 0 auto;padding:7px 3px 1px;color:#9e9e9e;font-size:10px;line-height:1.25;white-space:normal;overflow:hidden;text-overflow:ellipsis}
.step-actions{display:grid;grid-template-columns:minmax(140px,1fr) minmax(170px,260px) minmax(140px,1fr);gap:9px;padding:8px 12px;border-top:1px solid #2a2a2a;background:#0a0a0a}.btn{height:42px;border:1px solid #454545;border-radius:8px;background:#151515;color:#fff;font-size:12px;font-weight:950;letter-spacing:.025em;cursor:pointer;padding:0 14px}.btn:hover,.btn:focus-visible{border-color:var(--yellow);outline:none}.btn.primary{background:#6e5900;border-color:#8d7200;color:#fff}.btn.primary:hover,.btn.primary:focus-visible{background:var(--yellow);color:#050505}.btn.next{background:#171717;border-color:#6b5800}.btn.next:not(:disabled){color:#fff}.btn.success{background:#173f12;border-color:#358229;color:#caffc2}.btn:disabled{opacity:.32;cursor:not-allowed}
.splash{height:100%;display:grid;place-items:center;grid-template-columns:auto minmax(0,600px);gap:22px;padding:40px;text-align:left}.splash-mark{width:72px;height:72px;border-radius:14px;border:1px solid var(--line-gold);display:grid;place-items:center;color:var(--yellow);font-size:27px;font-weight:950;background:#151200}.splash h1{font-size:34px;margin:7px 0 6px;color:var(--yellow)}.splash p{margin:0;color:var(--muted);line-height:1.5}
.statusbar{height:var(--status-h);border-top:1px solid #204f19;background:#050805;display:flex;align-items:center;gap:20px;padding:0 14px;color:#858585;font-size:9px;white-space:nowrap;overflow:hidden}.statusbar span:first-child{display:flex;align-items:center;gap:6px;color:#72dd62;font-weight:850}.statusbar b{color:#b7b7b7;font-weight:600}.status-note{margin-left:auto}
@media (min-width:1180px) and (max-height:820px){:root{--header-h:58px;--status-h:24px;--sidebar-w:270px}.topbar{padding:6px 14px}.brand img{width:166px}.brand-copy strong{font-size:13px}.brand-copy span{font-size:10px}.stat,.status-pill,.action-btn{height:36px}.workspace{padding:7px;gap:7px}.catalog{padding:9px;gap:7px}.catalog-title strong{font-size:16px}.search-wrap input{height:38px}.lesson-head{min-height:86px;padding:10px 14px 8px}.lesson-head h1{font-size:28px}.lesson-summary{font-size:11px;-webkit-line-clamp:1}.progress-row{height:30px;padding:0 14px}.lesson-scroll{padding:9px 10px}.content-card{padding:14px;gap:14px}.content-card.with-media{grid-template-columns:minmax(300px,.75fr) minmax(420px,1.25fr)}.body-text{font-size:15px;line-height:1.42}.media-frame img,.media-frame video{max-height:none}.step-actions{height:50px;padding:5px 10px}.btn{height:38px}}
@media(max-width:1120px){body{overflow:auto}.app-shell{min-height:100dvh;height:auto;grid-template-rows:auto auto auto}.topbar{height:auto;min-height:60px;position:sticky;top:0}.brand{min-width:0}.brand img{width:174px}.brand-copy span{display:none}.header-stats .stat{display:none}.workspace{grid-template-columns:1fr;min-height:auto}.catalog{grid-template-rows:auto auto auto auto;gap:8px}.catalog-title,.catalog-foot{display:none}.lesson-list{display:flex;gap:8px;overflow-x:auto;padding:0 0 3px}.lesson-card{flex:0 0 245px;margin:0;padding:9px}.viewer{min-height:calc(100dvh - 220px)}.lesson-view{height:auto;min-height:calc(100dvh - 220px);grid-template-rows:auto 34px minmax(360px,1fr) 58px}.lesson-scroll,.lesson-scroll.media-mode{overflow:visible}.content-card.with-media{height:auto;grid-template-columns:1fr;align-items:start}.content-card.with-media .copy-pane{overflow:visible;padding-right:0}.media-frame{height:auto;display:block;overflow:visible}.media-frame img,.media-frame video{width:100%;height:auto;max-height:52dvh}.media-frame video{min-height:220px}.statusbar{height:auto;min-height:26px;flex-wrap:wrap;padding:5px 10px}.status-note{margin-left:0}}
@media(min-width:621px) and (max-width:1120px){body{overflow:hidden}.app-shell{height:100dvh;min-height:0;grid-template-rows:60px minmax(0,1fr) 26px}.topbar{position:relative;height:60px;min-height:60px;padding:7px 12px;gap:10px}.brand img{width:160px}.brand-copy strong{font-size:13px}.header-stats{gap:6px}.status-pill,.action-btn{height:36px}.workspace{height:100%;min-height:0;display:grid;grid-template-columns:1fr;grid-template-rows:94px minmax(0,1fr);gap:8px;padding:8px}.catalog{min-height:0;height:94px;padding:8px;gap:7px;display:grid;grid-template-columns:245px minmax(0,1fr);grid-template-rows:36px 36px;align-items:center}.search-wrap{grid-column:1;grid-row:1 / span 2;align-self:stretch;display:flex;align-items:center}.search-wrap input{height:42px}.section-tabs{grid-column:2;grid-row:1;align-self:center;min-width:0}.lesson-list{grid-column:2;grid-row:2;display:flex;min-width:0;gap:7px;overflow-x:auto;overflow-y:hidden;padding:0 0 1px}.lesson-card{flex:0 0 220px;height:36px;min-height:36px;margin:0;padding:5px 8px;align-items:center;border-radius:7px}.lesson-title{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lesson-sub{display:none}.progress-dot{width:16px;height:16px}.viewer{height:100%;min-height:0}.lesson-view{height:100%;min-height:0;grid-template-rows:92px 32px minmax(0,1fr) 56px}.lesson-head{min-height:0;height:92px;padding:10px 14px 8px}.lesson-head h1{font-size:28px;margin:3px 0}.lesson-summary{font-size:11px;line-height:1.3;-webkit-line-clamp:1}.progress-row{height:32px;padding:0 14px}.lesson-scroll{min-height:0;overflow:auto;padding:10px 12px}.lesson-scroll.media-mode{overflow:hidden}.content-card{min-height:100%;height:auto;max-width:none;padding:14px;gap:14px}.content-card.with-media{height:100%;min-height:0;grid-template-columns:minmax(260px,.78fr) minmax(0,1.22fr);align-items:stretch;align-content:stretch}.content-card.with-media .copy-pane{min-height:0;overflow:auto;padding-right:3px}.content-card h2{font-size:28px}.body-text{font-size:15px;line-height:1.44}.media-frame{display:flex;height:100%;min-height:0;overflow:hidden;padding:7px}.media-frame img,.media-frame video{width:100%;height:100%;min-height:0;max-height:none;object-fit:contain}.media-frame video{min-height:0}.media-caption{font-size:9px;padding-top:5px}.step-actions{height:56px;grid-template-columns:1fr minmax(150px,220px) 1fr;gap:7px;padding:6px 10px}.btn{height:42px}.statusbar{height:26px;min-height:26px;flex-wrap:nowrap;padding:0 10px;font-size:8px}.status-note{margin-left:auto}}
@media(max-width:620px){
html,body{height:100%;overflow:hidden}
.app-shell{height:100dvh;min-height:0;grid-template-rows:52px minmax(0,1fr) 22px}
.topbar{position:relative;height:52px;min-height:52px;padding:5px 7px;gap:4px}
.brand{min-width:0;gap:0}.brand img{width:108px}.brand-copy{display:none}
.header-stats{margin-left:auto;gap:4px}.status-pill{height:32px;padding:0 7px;font-size:8px;gap:5px}.status-pill i{width:6px;height:6px}
.top-actions{gap:4px}.action-btn{height:32px;padding:0 7px;font-size:8px;border-radius:7px}.phone-lessons-btn{display:inline-flex;align-items:center;justify-content:center;min-width:54px;border-color:#6b5800;color:var(--yellow)}
.workspace{height:100%;min-height:0;display:block;padding:5px;position:relative}
.viewer{height:100%;min-height:0;border-radius:9px;overflow:hidden}
.lesson-view{height:100%;min-height:0;display:grid;grid-template-rows:58px 28px minmax(0,1fr) 52px}
.lesson-head{height:58px;min-height:0;padding:7px 10px 5px}.lesson-topline{gap:7px}.lesson-head h1{font-size:21px;line-height:1;margin:3px 0 0}.lesson-summary{display:none}.kicker{font-size:8px}.approved-badge{font-size:7px;padding:3px 5px}
.progress-row{height:28px;padding:0 10px;gap:8px}.step-meter{height:4px}.step-count{font-size:8px}
.lesson-scroll,.lesson-scroll.media-mode{min-height:0;overflow:auto;padding:7px;overscroll-behavior:contain}
.content-card{min-height:100%;height:auto;max-width:none;padding:10px;gap:10px;border-radius:8px}
.content-card.with-media{height:auto;min-height:100%;grid-template-columns:1fr;align-items:start;align-content:start}.content-card.with-media .copy-pane{overflow:visible;padding-right:0}
.block-type{min-height:20px;padding:0 7px;font-size:8px;margin-bottom:6px}.content-card h2{font-size:21px;line-height:1.08;margin-bottom:7px}.body-text{font-size:15px;line-height:1.4}.body-text p{margin-bottom:8px}.body-text ul{margin:6px 0 8px}
.media-frame{height:auto;min-height:0;display:block;overflow:hidden;padding:5px;margin-top:2px}.media-frame img,.media-frame video{width:100%;height:auto;min-height:0;max-height:44dvh;object-fit:contain}.media-frame video{min-height:0}.media-caption{font-size:8px;line-height:1.2;padding:5px 2px 0}
.step-actions{height:52px;grid-template-columns:1fr 1.08fr 1fr;gap:5px;padding:5px;border-top:1px solid #2a2a2a}.btn{height:42px;padding:0 5px;font-size:9px;border-radius:7px}
.statusbar{height:22px;min-height:22px;flex-wrap:nowrap;padding:0 7px;font-size:7px;gap:6px}.statusbar span:nth-child(2){display:none}.status-note{margin-left:auto;max-width:165px;overflow:hidden;text-overflow:ellipsis}
.catalog{display:none;position:fixed;z-index:60;left:6px;right:6px;top:58px;bottom:28px;width:auto;height:auto;min-height:0;padding:10px;gap:8px;border-radius:10px;background:#0a0a0a;box-shadow:0 22px 70px rgba(0,0,0,.72);grid-template-rows:auto auto auto minmax(0,1fr);overflow:hidden}
body.phone-catalog-open .catalog{display:grid}
body.phone-catalog-open::before{content:"";position:fixed;z-index:55;inset:52px 0 22px;background:rgba(0,0,0,.68);backdrop-filter:blur(2px)}
.catalog-title{display:flex;align-items:center;padding:0 1px 2px}.catalog-title strong{font-size:16px}.read-only{font-size:8px;padding:4px 6px}
.search-wrap{display:block}.search-wrap input{height:40px;font-size:13px}.section-tabs{display:flex;min-width:0}.section-btn{padding:6px 9px}
.lesson-list{display:block;min-height:0;overflow-y:auto;overflow-x:hidden;padding:0 2px 2px 0}.lesson-card{width:100%;height:auto;min-height:54px;display:grid;grid-template-columns:minmax(0,1fr) auto;flex:none;margin:0 0 7px;padding:9px 10px 9px 12px}.lesson-title{font-size:13px;white-space:normal}.lesson-sub{display:block;font-size:9px}.progress-dot{width:18px;height:18px}.catalog-foot{display:none}
.splash{height:100%;grid-template-columns:1fr;padding:24px;text-align:center}.splash-mark{margin:auto}.splash h1{font-size:26px}
}
@media print{body{overflow:visible;background:white;color:black}.topbar,.catalog,.progress-row,.step-actions,.statusbar{display:none}.app-shell{display:block;height:auto}.workspace{display:block;padding:0}.viewer{border:0;box-shadow:none;background:white}.lesson-head{background:white;color:black;border:0}.lesson-head h1{color:black}.lesson-summary{color:#333}.lesson-scroll{overflow:visible;padding:0}.content-card,.content-card.with-media{display:block;border:0;background:white;padding:0}.body-text{color:black;max-width:none}.media-frame{border:0;background:white;padding:10px 0}.media-frame img,.media-frame video{max-height:none}}
