*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:20px}body{margin:0;background:radial-gradient(ellipse at 70% 0%,#0c3c6d,#03142b 70%);color:#06264d;font-family:Arial,sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:#0068d8}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #fb9f22;outline-offset:3px}.library-shell{max-width:1180px;margin:18px auto;padding:0 16px}.library-nav{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:15px}.library-nav img{width:210px;display:block}.library-nav nav{display:flex;gap:25px;flex-wrap:wrap}.library-nav a{color:#e5f5ff;text-decoration:none;font-size:16px;font-weight:bold}.library-nav a[aria-current=page]{color:#ceff24}.library-main{background:linear-gradient(120deg,#edf8ff,#d4ebff 55%,#e9f6ff);border:2px solid #bfdeff;border-radius:29px;padding:24px 30px;box-shadow:0 12px 60px #0006}.library-top{display:flex;justify-content:space-between;align-items:center;gap:25px;margin-bottom:12px}.title-art{width:min(440px,55%);margin:0}.title-art svg{width:100%;display:block;height:auto;aspect-ratio:7.7;overflow:hidden}.searchbox{border:1px solid #9ec6ea;background:#fff9;border-radius:25px;padding:11px 18px;font-size:16px;max-width:310px;width:100%;color:#17446b}.library-intro{color:#527699;margin:4px 0 20px;font-size:16px;line-height:1.5}.library-tabs{display:flex;gap:9px;flex-wrap:wrap;margin:15px 0 25px}.library-tabs button{border:1px solid #a5c9ef;border-radius:28px;padding:9px 15px;background:linear-gradient(#e3f1ff,#bfdcff);color:#0b315a;font-size:14px;font-weight:800;box-shadow:inset 0 1px #fff}.library-tabs button.active{background:linear-gradient(#fff88b,#ffcd32);border:2px solid #f4ac19;color:#102e50}.topic-row{display:grid;grid-template-columns:minmax(200px,31%) 1fr;gap:25px;padding:25px 0;border-top:2px solid #a9cfee;scroll-margin:20px}.topic-identity h2{font-family:"Arial Black",Arial,sans-serif;font-size:27px;font-weight:900;letter-spacing:-.6px;margin:0 0 20px;line-height:1.15}.topic-icon{width:100px;height:100px;display:grid;place-items:center;color:#fff;font-weight:900;font-size:72px;background:linear-gradient(145deg,#32bdff,#0366d6);border:3px solid #c3f0ff;border-radius:22px;box-shadow:inset 0 3px #ffffff77,0 5px 0 #12558b,0 8px 15px #16416722;text-shadow:1px 3px #003a7c;transform:rotate(-5deg);margin:10px 0 10px 15px}.topic-row:nth-child(3n+2) .topic-icon{background:linear-gradient(145deg,#d4f750,#64b600);text-shadow:1px 3px #4a7c00}.topic-row:nth-child(3n+3) .topic-icon{background:linear-gradient(145deg,#ffb54a,#f06a12);text-shadow:1px 3px #b35100}.topic-icon.smalltype{font-size:38px}.lesson-list{display:flex;flex-direction:column;gap:0}.lesson-row{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:13px 5px;border-bottom:1px solid #bdd9ef}.lesson-row:last-child{border-bottom:0}.lesson-title{font-size:21px;font-weight:600;color:#16446b;text-decoration:none;line-height:1.35}.lesson-title:hover{text-decoration:underline;color:#006cda}.lesson-meta{font-size:12px;color:#537fa2;display:block;margin-top:4px}.status{font-size:11px;border-radius:20px;background:#e4edf4;color:#59748e;white-space:nowrap;padding:5px 9px}.status.ready{background:#d7f6b8;color:#336000}.empty{padding:25px;text-align:center;color:#527699}.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}.preview-note{padding:12px 16px;background:#fff1bb;color:#735310;border:1px solid #f6d06e;border-radius:12px;font-size:14px;margin-bottom:20px}.player-controls{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:15px 0}.player-controls a,.pill{background:#d1eaff;color:#0a548c;border:1px solid #9cc5e8;border-radius:25px;padding:9px 15px;text-decoration:none;font-size:14px}.video-box{aspect-ratio:16/9;max-width:900px;margin:20px auto;background:linear-gradient(135deg,#0a2649,#061328);border-radius:18px;overflow:hidden;display:grid;place-items:center;color:#d4ecff;border:2px solid #8fc3eb;text-align:center;padding:0}.video-box iframe{width:100%;height:100%;border:0}.video-placeholder{padding:30px}.video-placeholder b{font-size:26px}.video-placeholder p{font-size:16px;line-height:1.6;color:#a6c9e5}.lesson-page-title{font-size:clamp(25px,3vw,36px);font-weight:900;letter-spacing:-1px;margin:10px 0 8px}.lesson-description{font-size:17px;line-height:1.6;color:#466e91}.lesson-actions{display:flex;gap:15px;flex-wrap:wrap;margin:15px 0 25px}.lesson-actions a{background:linear-gradient(#dfff63,#a5e514);border:2px solid #83bd17;border-radius:28px;color:#244600;font-weight:bold;text-decoration:none;padding:11px 20px}.lesson-actions a.secondary{background:#d4eaff;border-color:#97c5ed;color:#125687}.materials{border-top:2px solid #abcfe9;padding:18px 0;margin-top:20px}.materials h2{margin:0 0 10px;font-size:25px}.materials p{color:#527699}.editor-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px}.editor-card{background:#ffffff88;border:1px solid #accde5;border-radius:18px;padding:22px}.editor-card h2{margin:0 0 16px}.field{display:block;margin:12px 0;font-weight:bold;font-size:14px}.field input,.field select,.field textarea{display:block;border:1px solid #9abdd8;border-radius:8px;padding:10px 12px;width:100%;background:#fff;color:#183d5f;margin-top:6px}.field textarea{min-height:80px;resize:vertical}.editor-buttons{display:flex;gap:10px;flex-wrap:wrap}.editor-buttons button{background:#b9ed2e;color:#173800;border:1px solid #87b813;border-radius:24px;font-weight:bold;padding:10px 16px}.editor-buttons button.secondary{background:#d3e9fc;color:#184a72;border-color:#9fc5e5}.editor-buttons button.danger{background:#fff1e9;color:#9c3e1d;border-color:#e5bda3}.editor-note{font-size:14px;line-height:1.6;color:#456c90}.editor-entry{display:flex;gap:10px;justify-content:space-between;align-items:center;border-top:1px solid #bfd5e5;padding:10px 0}.editor-entry strong{font-size:15px}.editor-entry small{display:block;color:#60819d;margin-top:4px}.editor-entry button{border:1px solid #b0cee4;background:#e7f4ff;color:#194d72;border-radius:20px;font-size:12px;padding:7px 10px}.save-status{padding:12px;margin:15px 0;color:#1f5a00;background:#def4c7;border-radius:10px;font-size:14px;min-height:40px}.editor-toolbar{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}.editor-toolbar button,.editor-toolbar a,.file-button{background:#135ba3;color:white;border:1px solid #054d94;border-radius:25px;text-decoration:none;padding:10px 16px;font-size:14px;font-weight:bold;cursor:pointer}.file-button input{display:none}.topic-manager{margin:25px 0}.topic-manager form{display:flex;align-items:end;gap:15px;flex-wrap:wrap}.topic-manager .field{flex:1;min-width:160px}.topic-manager button{padding:11px 16px;margin-bottom:12px;border:1px solid #87b813;border-radius:25px;background:#bbee33}.player-pending{font-size:14px;color:#597b99}#topic-records{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}#topic-records span{background:#e2f1fc;border:1px solid #abcce6;border-radius:20px;padding:7px 12px;font-size:13px}[hidden]{display:none!important}@media(max-width:750px){.library-shell{padding:0 10px;margin-top:10px}.library-nav{display:block}.library-nav img{width:175px;margin:0 auto 16px}.library-nav nav{justify-content:center;gap:15px}.library-nav a{font-size:13px}.library-main{padding:20px 16px;border-radius:22px}.library-top{display:block}.title-art{width:min(440px,100%);margin-bottom:18px}.searchbox{max-width:none}.topic-row{grid-template-columns:1fr;gap:10px;padding:22px 0}.topic-identity{display:flex;align-items:center;gap:20px}.topic-identity h2{font-size:24px;flex:1;margin:0}.topic-icon{width:55px;height:55px;font-size:37px;order:-1;border-radius:12px;margin:0}.topic-icon.smalltype{font-size:21px}.lesson-title{font-size:18px}.library-tabs{gap:7px}.library-tabs button{font-size:12px;padding:8px 12px}.editor-grid{grid-template-columns:1fr}.player-controls a{font-size:12px;padding:8px 10px}.video-placeholder b{font-size:20px}.video-placeholder p{font-size:14px}}

/* Contain the title crop and give the supplied logo its own clear header row. */
.library-nav{display:flex;flex-direction:column;align-items:center;gap:14px;padding:14px 18px 16px;margin-bottom:18px;border:1px solid #346a9a;border-radius:24px;background:linear-gradient(120deg,#0c2a4e,#06172f);box-shadow:0 8px 25px #0003}
.library-nav>a{display:block;max-width:100%;line-height:0}.library-nav img{display:block;width:clamp(220px,37vw,390px);max-width:100%;height:auto;max-height:155px;object-fit:contain;margin:0}
.library-nav nav{display:flex;justify-content:center;align-items:center;gap:12px 30px;flex-wrap:wrap}.library-nav nav a{display:block;font-size:16px;padding:7px 4px;line-height:1.3}
.library-top{min-width:0;align-items:center}.title-art{display:block;flex:0 1 440px;min-width:0;max-width:100%;overflow:hidden;line-height:0}.title-art svg{display:block;width:100%;height:auto;overflow:hidden;aspect-ratio:370/49}.searchbox{flex:1 1 240px;min-width:0}
@media(max-width:750px){.library-nav{display:flex;padding:12px;gap:10px}.library-nav img{width:min(280px,75vw);height:auto;max-height:112px;margin:0}.library-nav nav{gap:8px 18px}.library-nav nav a{font-size:14px;padding:6px 2px}.library-top{display:block}.title-art{width:min(440px,100%);margin:0 0 18px}.searchbox{width:100%;max-width:none}}
/* Simple lesson browsing: six categories, natural page scrolling. */
html,body{height:auto;min-height:100%;overflow-y:auto;overflow-x:hidden}
.library-list-tools{display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:14px;color:#5a7a98;margin:0 0 10px}
.library-list-tools button{background:transparent;border:0;text-decoration:underline;color:#0066be;padding:6px;font-size:14px}
.library-tabs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.library-tabs button{padding:11px 8px;white-space:normal;font-size:14px;min-height:44px}
.record-actions{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end;flex-shrink:0}
#lesson-records{max-height:660px;overflow-y:auto;padding-right:5px}
@media(max-width:950px){.library-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:550px){.library-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.editor-entry{align-items:flex-start;flex-direction:column;gap:8px}.record-actions{justify-content:flex-start}#lesson-records{max-height:none;overflow:visible}}

.walkthrough-tools{display:flex;align-items:center;gap:15px;flex-wrap:wrap;margin:0 0 20px;padding:13px 16px;border:1px solid #abcfe8;border-radius:16px;background:#f4fbff99}.walkthrough-tools button{border:2px solid #8fc2e9;border-radius:27px;padding:11px 19px;background:linear-gradient(#e1f4ff,#bddfff);color:#075388;font-weight:800;font-size:15px;white-space:nowrap}.walkthrough-tools button.active{background:linear-gradient(#daff62,#a9e52e);border-color:#7bb91a;color:#245000}.walkthrough-tools p{margin:0;color:#527699;font-size:14px;line-height:1.5}.walkthrough-check{display:block;background:#eef8e5;border:1px solid #c4dfa6;border-radius:12px;padding:13px;margin:17px 0;font-weight:bold;font-size:14px}.walkthrough-check input{margin-right:8px;width:17px;height:17px;vertical-align:middle}.walkthrough-check span{display:block;font-weight:normal;color:#536e44;font-size:12px;line-height:1.6;margin:8px 0 0 27px}.walkthrough-back{display:inline-block;color:#0568ba;font-size:14px;font-weight:bold;margin:6px 0 12px}
