@import url("./lesson-player.css?v=ft14-20261029");
/* Shared header/footer visual contract across app, legal, privacy and admin pages. */
.li-shared-header{position:relative;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;padding:12px 18px;background:#f9f1e3;color:#2d2a26}
.li-shared-header .brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#2d2a26;font-size:24px;font-weight:900}
.li-shared-header .brand b{color:#9b5e17}
.li-shared-header .lion{display:flex;width:48px;height:53px;flex:none;align-items:center;justify-content:center}
.li-shared-header .li-p12-lion{width:48px;height:53px;object-fit:contain}
.li-shared-header .brand-lockup{display:grid;gap:1px}
.li-shared-header .brand-lockup small{color:#66513e;font-size:11px;line-height:1.2}
.li-shared-header .site-menu-toggle{min-height:44px;min-width:48px;border-radius:12px;background:#fffbf2;border:2px solid #2d2a26;color:#2d2a26}
.li-shell-header-label{color:#594d3f;font-weight:700;font-size:13px}
.li-shell-static-drawer{display:flex;flex-wrap:wrap;gap:8px;padding:12px;background:#fffbf2;border:1px solid #e7d8c2;border-radius:14px}
.li-shell-static-drawer[hidden]{display:none!important}
.li-shell-static-drawer a{display:inline-flex;align-items:center;padding:9px 12px;min-height:40px;text-decoration:none;font-weight:700;color:#375e59;background:#fff7e8;border:1px solid #e5d6bd;border-radius:10px}
.li-legal-footer{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;padding:22px 16px;background:#fffbf2;color:#564d42;border:1px solid #e2d9c9;border-radius:20px}
.li-legal-footer p{margin:0;color:#564d42;line-height:1.55}
.li-legal-footer nav{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px}
.li-legal-footer nav a{display:inline-flex;align-items:center;padding:8px 13px;min-height:35px;font-size:12px;font-weight:750;color:#564532;text-decoration:none;background:#fff9eb;border:1px solid #e0d4c2;border-radius:999px}
.li-legal-footer .li-sal-link{display:inline-flex;align-items:center;justify-content:center;width:250px;max-width:100%;height:50px;min-height:50px;line-height:0;padding:0;border:0;overflow:visible}
.li-legal-footer .li-sal-link img{display:block!important;width:250px!important;height:50px!important;max-width:100%!important;object-fit:contain!important;aspect-ratio:5/1!important;border:0!important}
.li-legal-footer .li-sal-caption{position:absolute!important;width:1px!important;height:1px!important;clip-path:inset(50%)!important;overflow:hidden!important}
.li-legal-footer small{font-size:12px;line-height:1.6;color:#635d55;max-width:700px}
.li-legal-footer small a{color:#375e59}
.li-shared-header a:focus-visible,.li-shared-header button:focus-visible,.li-legal-footer a:focus-visible,.li-shell-static-drawer a:focus-visible{outline:3px solid #375e59;outline-offset:3px}
@media(max-width:540px){.li-shared-header{padding:10px 12px}.li-shared-header .brand{font-size:21px}.li-shell-header-label{flex:1 1 100%;order:3}.li-legal-footer{border-radius:18px;padding:18px 12px 22px}.li-legal-footer nav a{font-size:12px}}
@media(prefers-reduced-motion:reduce){.li-legal-footer *, .li-shared-header *{animation:none!important;transition:none!important}}

/* Admin setup retains full-height shared shell with the same footer. */
.li-admin-page-layout{display:flex;flex-direction:column;min-height:100vh;min-height:100dvh;width:min(100%,1120px);margin:0 auto;padding:12px}
.li-admin-page-layout>.admin-wrap{flex:1 0 auto;width:100%}
.li-admin-page-layout>.li-legal-footer{margin-top:auto}


/* Navigation: controls must remain hidden when adult session is absent. */
#site-drawer [hidden],.site-drawer [hidden]{display:none!important}
#site-drawer .li-drawer-family-settings{display:flex;align-items:center;gap:10px}
#site-drawer .li-drawer-family-settings:focus-visible{outline:3px solid #375e59;outline-offset:3px}

/* Clay navigation: one shared asset mapping, real button labels and native scrolling. */
:root{--li-nav-paper:#fffbf2;--li-nav-ink:#2d2a26;--li-nav-pink:#ffd6e0}
.li-shared-masthead{position:sticky;top:0;z-index:1300;isolation:isolate;flex:0 0 auto;margin-bottom:20px;min-width:0}
.li-shared-masthead .li-shared-header{position:relative!important;top:auto!important;margin:0;min-height:68px;padding:10px 12px;background:#f9f1e3;border-radius:0 0 20px 20px}
.li-shared-header .site-menu-toggle{border:3px solid var(--li-nav-ink);border-radius:18px;background:var(--li-nav-paper);box-shadow:0 3px 0 var(--li-nav-ink);font-size:25px;color:var(--li-nav-ink);cursor:pointer}
.li-shared-masthead #site-drawer{position:absolute!important;top:calc(100% + 8px)!important;right:0!important;box-sizing:border-box;width:min(370px,calc(100vw - 24px));max-width:100%;max-height:min(68dvh,650px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;background:var(--li-nav-paper);border:3px solid var(--li-nav-ink);border-radius:24px;padding:12px;box-shadow:0 7px 0 var(--li-nav-ink),0 18px 35px #2d2a2620}
.li-clay-icon{display:grid!important;place-items:center;flex:0 0 48px;box-sizing:border-box;width:48px;height:48px;min-width:48px;border-radius:16px;background:#fff;border:2px solid #2d2a2612;box-shadow:inset 0 -3px 0 #2d2a2608;overflow:hidden;line-height:0}
.li-clay-icon img{display:block;width:44px!important;height:44px!important;max-width:100%;object-fit:contain;transition:transform .16s ease}
#site-drawer.li-clay-menu{display:grid;gap:10px}
#site-drawer.li-clay-menu>button{display:flex;align-items:center;gap:12px;width:100%;min-width:0;min-height:76px;margin:0;padding:9px 10px;text-align:left;white-space:normal;line-height:1.3;background:#fff;border:2px solid #e5e4e1;border-radius:20px;color:var(--li-nav-ink);box-shadow:0 3px 0 #2d2a2610;cursor:pointer;font:inherit}
#site-drawer.li-clay-menu>button.active{background:var(--li-nav-pink);border-color:var(--li-nav-ink);box-shadow:0 3px 0 var(--li-nav-ink)}
#site-drawer.li-clay-menu>button:hover{background:#fff0e1;border-color:#b8a899}
#site-drawer.li-clay-menu>button.active:hover{background:var(--li-nav-pink);border-color:var(--li-nav-ink)}
.li-menu-copy{display:grid;gap:4px;min-width:0;flex:1;overflow-wrap:anywhere}
.li-menu-copy strong{font-size:15px;font-weight:900;color:var(--li-nav-ink)}
.li-menu-copy small{font-size:12px;color:#6e655d;line-height:1.35}
.li-menu-arrow{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#f8f1e5;flex:none;font-size:22px;color:#71675c}
#site-drawer .active .li-menu-arrow{background:var(--li-nav-ink);color:#fff}
.li-shell-static-drawer{gap:8px}
.li-shell-static-drawer>a{gap:10px;white-space:normal;line-height:1.4;max-width:100%;overflow-wrap:anywhere}
/* Compact clay bottom navigation: labels cross the button's dark lower border.
   Shared adult 4-tab dock and child 6-tab horizontally scrollable dock. */
body > nav.kid-bottom-nav.kid-nav-portal.li-clay-dock,
.family-bottom-nav.li-clay-dock,
.kid-world.kid-v9 > nav.kid-bottom-nav.li-clay-dock{
 position:fixed!important;
 inset:auto 0 calc(8px + env(safe-area-inset-bottom,0px))!important;
 transform:none!important;
 display:flex!important;
 flex-direction:row!important;
 flex-wrap:nowrap!important;
 align-items:stretch;
 justify-content:flex-start;
 box-sizing:border-box!important;
 width:min(530px,calc(100vw - 20px))!important;
 max-width:530px!important;
 min-width:0!important;
 margin:0 auto!important;
 padding:4px 5px 8px!important;
 gap:4px!important;
 overflow-x:auto!important;
 overflow-y:hidden!important;
 scrollbar-width:none;
 -ms-overflow-style:none;
 overscroll-behavior-x:contain;
 scroll-snap-type:x proximity;
 scroll-padding-inline:8px;
 background:var(--li-nav-paper)!important;
 border:3px solid var(--li-nav-ink)!important;
 border-radius:23px!important;
 box-shadow:0 4px 0 var(--li-nav-ink),0 8px 21px #2d2a2620!important;
 z-index:1100!important;
 backdrop-filter:none!important;
 opacity:1!important;
 visibility:visible!important;
 pointer-events:auto!important;
}
.li-clay-dock::-webkit-scrollbar{display:none}
body > nav.kid-bottom-nav.kid-nav-portal.li-clay-dock > .kid-tab,
.family-bottom-nav.li-clay-dock > .tab,
.kid-world.kid-v9 > .li-clay-dock > .kid-tab{
 display:flex!important;
 position:relative;
 flex:1 0 80px!important;
 flex-direction:column;
 align-items:center;
 justify-content:flex-start;
 box-sizing:border-box!important;
 min-width:80px!important;
 min-height:72px!important;
 height:72px!important;
 margin:0!important;
 padding:2px 2px 3px!important;
 gap:0!important;
 overflow:visible;
 border:2px solid var(--li-nav-ink)!important;
 border-radius:18px!important;
 background:var(--li-nav-paper)!important;
 box-shadow:inset 0 -2px 0 #2d2a2610!important;
 color:var(--li-nav-ink)!important;
 line-height:1.1!important;
 scroll-snap-align:center;
 cursor:pointer;
}
body > nav.kid-bottom-nav.kid-nav-portal.li-clay-dock > .kid-tab.active,
.family-bottom-nav.li-clay-dock > .tab.active,
.kid-world.kid-v9 > .li-clay-dock > .kid-tab.active{
 background:var(--li-nav-pink)!important;
 border-color:var(--li-nav-ink)!important;
 box-shadow:inset 0 -2px 0 #2d2a2618!important;
}
/* Keep the four-button adult dock as narrow as its icons allow, instead of
   spreading four 60px icons over a 620px bar. Child dock holds six icons. */
.family-bottom-nav.li-clay-dock{
 width:min(378px,calc(100vw - 20px))!important;
 max-width:378px!important;
}
/* Dock only: increase the actual clay PNG from 44 to 60px without touching menu assets. */
.li-clay-dock .li-clay-nav-item > .li-clay-icon{
 display:grid!important;
 place-items:center;
 flex:0 0 60px!important;
 box-sizing:border-box!important;
 width:60px!important;
 height:60px!important;
 min-width:0!important;
 min-height:0!important;
 max-width:calc(100% - 2px);
 margin:0!important;
 padding:0!important;
 border:0!important;
 border-radius:0!important;
 background:transparent!important;
 box-shadow:none!important;
 overflow:visible;
 line-height:0;
}
.li-clay-dock .li-clay-nav-item > .li-clay-icon > img{
 display:block!important;
 width:100%!important;
 height:100%!important;
 max-width:100%!important;
 max-height:100%!important;
 object-fit:contain!important;
}
.li-clay-dock .li-clay-nav-item > small{
 display:block!important;
 position:absolute;
 z-index:2;
 left:50%;
 bottom:-7px;
 transform:translateX(-50%);
 box-sizing:border-box;
 width:max-content;
 max-width:calc(100% + 6px);
 margin:0!important;
 padding:0 5px!important;
 border-radius:4px;
 background:var(--li-nav-paper)!important;
 color:var(--li-nav-ink)!important;
 font-size:13px!important;
 font-weight:1000!important;
 line-height:17px!important;
 letter-spacing:0!important;
 text-align:center;
 white-space:nowrap!important;
 word-break:normal!important;
 overflow-wrap:normal!important;
}
.li-clay-dock .li-clay-nav-item.active > small{background:var(--li-nav-pink)!important}
.li-clay-dock button:hover .li-clay-icon img,#site-drawer button:hover .li-clay-icon img{transform:translateY(-2px) rotate(-3deg)}
.li-clay-dock button:focus-visible,#site-drawer button:focus-visible,#site-drawer a:focus-visible{outline:3px solid #375e59!important;outline-offset:-3px}
/* Compact reserve replacing the old 145px blank area. */
body.kid-nav-visible .layout,body.li-adult-nav-visible .layout{padding-bottom:calc(110px + env(safe-area-inset-bottom,0px))!important}
@media(max-width:380px){
 #site-drawer.li-clay-menu{padding:9px;gap:8px}
 #site-drawer.li-clay-menu>button{gap:9px;padding:8px}
 .li-menu-copy strong{font-size:14px}
 .li-menu-arrow{display:none}
 .li-clay-dock .li-clay-nav-item > small{font-size:12px!important;padding-inline:3px!important}
}
@media(prefers-reduced-motion:reduce){.li-clay-icon img{transition:none!important;transform:none!important}}

/* FT-08: a link styled as a button participates in flow with its full padded height. */
a.btn{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:44px;max-width:100%;gap:8px;white-space:normal;overflow-wrap:anywhere;text-align:center;vertical-align:top;line-height:1.4;text-decoration:none}
.buttons{align-items:stretch}.buttons>*{min-width:0;max-width:100%}
.li-p14-family-requests{display:grid;gap:18px;min-width:0}
.li-p14-family-requests>p,.li-p14-family-requests>h2,.li-p14-family-requests>h3{margin:0;line-height:1.45;overflow-wrap:anywhere}
.li-p14-family-requests .form{width:min(100%,570px);min-width:0;margin:0}
.li-p14-request-list{display:grid;gap:10px;padding-inline-start:22px;margin:0;overflow-wrap:anywhere}
.li-family-export-action{display:flex;align-items:center;flex-wrap:wrap;gap:10px 16px;min-width:0}
.li-family-export-action small{max-width:100%;line-height:1.5}
.li-p14-legal-docs{display:grid;gap:18px;padding-inline-start:22px}
.li-p14-legal-docs>li{min-width:0;overflow-wrap:anywhere}.li-p14-legal-docs .form{margin-top:12px}

.li-signup-resources{display:grid;gap:10px;margin:14px 0;padding-inline-start:22px;line-height:1.5}
.li-signup-resources a{overflow-wrap:anywhere;text-decoration-thickness:1.5px;text-underline-offset:3px}
.li-legal-step{display:grid;gap:14px;min-width:0}.li-legal-step h2{margin:0}.li-legal-step p{margin:0}
.form [data-signup-details]{display:grid;gap:16px;min-width:0;max-width:100%;margin:0;padding:0;border:0}
.form [data-signup-details] label{display:grid;gap:7px}
.form [data-legal-step][hidden],.form [data-signup-details][hidden]{display:none!important}

/* At the footer the adult dock is hidden; its viewport reserve must disappear too. */
html.li-footer-in-view body.li-adult-nav-visible .layout{padding-bottom:12px!important}
html.li-footer-in-view body.li-adult-nav-visible .li-legal-footer{margin-bottom:0!important}