/* HackerTube's sky library: shared 0mvp window language, content-first density. */
:root{--paper:#fff4dc;--surface:#fffaf0;--ink:#3a241b;--muted:#70533c;--line:#dcc5a0;--edge:#633719;--edge-dark:#3a1c10;--gold:#ffe1a4}
body{background:#a4dcf8 url('/sky-world/cloudscape.webp') center top/cover fixed;font-synthesis:none}
header{gap:24px;border-bottom:3px solid #613b23;box-shadow:0 3px 0 #071e3b33}
.search{min-width:80px}.search input{border:2px solid #976e42;background:#fffaf0;box-shadow:inset 0 2px 0 #e9d6b7}
.topright{display:flex;align-items:center;gap:12px;flex:none;min-width:0}
#account-root{min-width:0}.account{min-width:0}.account-name{color:#e5f3ff;max-width:130px}.account-status{display:block;max-width:150px;color:#d3e6f6;font-size:12px}
.account>button{display:inline-flex;align-items:center;justify-content:center;min-height:40px;width:auto;flex:none;border:2px solid #9a6338;border-radius:8px;background:var(--gold);color:#3a241b;box-shadow:0 3px 0 #030e20;font:700 14px Fredoka,sans-serif;padding:8px 14px}
.topright>#theme{width:40px;height:40px;flex:none;border-width:2px;border-radius:8px}
.layout{gap:24px;padding-right:24px}.sidebar{width:218px;border-right:3px solid #355574;padding:24px 14px 20px}.nav{font:700 16px Fredoka,sans-serif;min-height:49px;border-radius:8px}.nav.active{background:var(--gold);border-color:#8e5b30;box-shadow:0 3px 0 #020e20,inset 0 2px 0 #fff4d5}.side-label{font-size:11px}.sidebar-world{min-height:90px;padding-top:16px}.sidebar-world img{width:140px;height:110px}.side-note{font-size:12px;padding:8px 0 0}.side-note p{display:none}
main{margin:24px 0 30px;padding:0 0 22px;background:var(--paper);border:3px solid var(--edge);border-radius:14px;box-shadow:0 5px 0 var(--edge-dark);overflow:hidden}
.pageintro{margin:0;border:0;border-bottom:3px solid var(--edge);border-radius:10px 10px 0 0;min-height:158px;padding:26px 28px;background-position:center 43%}.pageintro:before{background:linear-gradient(90deg,#dcf4fff5,#dcf4ffdf 47%,#dcf4ff00 85%)}.pageintro:after{right:145px;width:180px;height:154px;bottom:-14px}.pageintro h1{font-size:34px}.pageintro p{font-size:14px}.intro-copy{max-width:64%}
.shuffle,.more{font:700 14px Fredoka,sans-serif;border-radius:8px}.shuffle{position:relative;z-index:1}
.video-library{padding:0 24px}.toolbar{padding:18px 0 14px;margin:0;gap:10px}.filter-toggle,.chip,.toolbar select{font:700 14px Fredoka,sans-serif;border:2px solid #996b3c;border-radius:7px;background:#fff6e3;min-height:40px;box-shadow:0 2px 0 #cfaf7e}.toolbar #filterSummary{font-size:13px}.toolbar select{max-width:220px}.chip.active{background:var(--gold);color:#3a241b;border-color:#91551e;box-shadow:0 2px 0 #633719}.filters{padding-top:2px;padding-bottom:14px}.sectionhead{margin:0 -24px 20px;padding:12px 24px;border-top:2px solid var(--edge);border-bottom:2px solid var(--edge);background:linear-gradient(#c85308,#a73a05);color:#fff}.sectionhead h2{font-size:23px;color:#fff;text-shadow:0 2px 0 #6e340e}.sectionhead small{color:#fff3dc;font-size:13px;white-space:nowrap}
.grid{gap:26px 18px;grid-template-columns:repeat(3,minmax(0,1fr))}.thumb{border:2px solid #754a2e;border-radius:8px;background:#d9e7e8;box-shadow:0 3px 0 #ddc4a0}.thumb img{display:block}.thumb:hover{border-color:#b51d54}.count{background:#071e3bef;border:1px solid #ffffff55;padding:3px 7px;border-radius:4px;font-size:11px}.details{gap:5px;padding-top:12px}.card h3{font:700 15px/1.4 Nunito,sans-serif;margin-bottom:5px}.meta{font-size:12px;line-height:1.7}.meta a{display:inline-block;margin-top:3px;color:#a6174a;font-weight:700;font-size:12px;text-decoration:none}.meta a:hover{text-decoration:underline}.save{width:32px;height:36px;border:1px solid #ddc5a1;border-radius:6px;color:#76583c;background:#fff9ed}.save:hover{background:var(--gold)}.thumb-fallback{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;background:#163c5a;color:#d5e7f2;font-size:12px}.thumb-fallback svg{fill:#f5ce85;width:32px;height:32px}.thumb-fallback+img[hidden]{display:none}
.community{margin:18px 24px 0;padding:0;background:#fffaed;border:2px solid #9a6c3e;border-radius:8px;color:var(--ink);box-shadow:0 3px 0 #e1c399}.community-head{display:flex;min-height:52px;gap:12px;padding:9px 14px;cursor:pointer;list-style:none;background:#ffe5b5;border-radius:6px;font:700 17px Fredoka,sans-serif}.community-head::-webkit-details-marker{display:none}.chat-heading{display:flex;align-items:center;gap:9px;color:#3a241b}.chat-heading img{width:28px;height:28px;object-fit:contain}.community-head .chat-heading{font:700 17px Fredoka,sans-serif}.community-head .chat-heading>span{font:inherit;color:inherit}.community-head .chat-summary{margin-left:auto;font:400 12px Nunito,sans-serif;color:#634830}.community-head .chat-chevron{font-size:24px;color:#633719;line-height:1}.community[open] .community-head{border-radius:6px 6px 0 0;border-bottom:2px solid #b58a58}.community[open] .chat-chevron{transform:rotate(180deg)}.community-body{padding:0 14px 14px}.chat-feed{max-height:210px}.chat-line{padding:9px 0;border-bottom:1px solid var(--line)}.chat-line p{color:var(--ink)}.chat-form input{border:2px solid #b99c77;background:#fffdf7;min-height:44px;font-size:16px}.chat-form button{font:700 15px Fredoka,sans-serif;border:2px solid #87133d;border-radius:8px;box-shadow:0 2px 0 #87133d;min-width:68px;background:#c91b59}.chat-form button:disabled{opacity:.6;cursor:default}.chat-note{font-size:12px;line-height:1.5;color:var(--muted)}
.builder-badge{display:flex;align-items:center;justify-content:center;gap:9px;margin:20px 0 0;padding:10px 8px;border:2px solid #b1864b;border-radius:9px;background:#122b45;color:#ffebc7;font:700 13px Fredoka,sans-serif;text-decoration:none;box-shadow:0 3px 0 #020e20;flex:none}.builder-badge img{display:block;object-fit:contain;width:90px;height:34px}.builder-badge:hover{background:#234462;border-color:#ffce7a}.site-footer{margin:28px 24px 0;padding-top:20px;border-top:1px solid var(--line);font-size:12px;line-height:1.7;color:var(--muted)}.site-footer p{max-width:720px;margin-bottom:0}.site-footer>.builder-badge{display:none}
.auth-dialog{border:3px solid var(--edge);border-radius:12px;background:#fff4dc;box-shadow:0 6px 0 var(--edge-dark);max-height:calc(100dvh - 40px);overflow:auto}.auth-dialog h2{padding-right:26px;color:#3a241b}.auth-dialog p{color:#70533c}.auth-dialog button{width:auto;height:auto;display:block;font-family:Fredoka,sans-serif}.auth-dialog .auth-submit{min-height:44px;border:2px solid #87133d;border-radius:8px;box-shadow:0 3px 0 #87133d}.auth-dialog .auth-close{width:36px;height:36px;display:grid;place-items:center;padding:0;top:14px;right:12px}.auth-dialog .auth-switch{white-space:normal;min-height:44px}.auth-dialog input{border:2px solid #b99c77}.auth-dialog .auth-error{position:static;background:transparent;padding:0;color:#9d1e28}
.dark{--paper:#142e45;--ink:#e5f3ff;--muted:#bbcee0;--line:#426078;--edge:#66869b;--edge-dark:#071523;background:#0b2139 url('/sky-world/cloudscape.webp') center top/cover fixed;background-blend-mode:multiply}.dark .pageintro:before{background:linear-gradient(90deg,#102e50f5,#102e50de 47%,#102e5030 85%)}.dark .sectionhead{background:linear-gradient(#a83c09,#852d06);border-color:#6b402e}.dark .thumb{border-color:#56728b;box-shadow:0 3px 0 #071e3b}.dark .meta a{color:#ffacd0}.dark .save{background:#234563;border-color:#51728a;color:#d7e8f7}.dark .community{background:#19374e;border-color:#64839a;box-shadow:0 3px 0 #071e3b}.dark .community-head{background:#25465e}.dark .community-head :is(.chat-heading,.chat-summary,.chat-chevron){color:#e5f3ff}.dark .community[open] .community-head{border-color:#64839a}.dark .filter-toggle,.dark .toolbar select,.dark .chip{box-shadow:0 2px 0 #071e3b}.dark .chip.active{background:#ffe1a4}.dark .auth-dialog{--edge:#633719;--edge-dark:#3a1c10}
@media(min-width:1450px){.grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(min-width:1900px){.grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:1100px){.layout{gap:18px;padding-right:18px}.sidebar{width:192px;padding-inline:10px}.nav{font-size:15px;padding-inline:9px}main{margin-top:18px}.video-library{padding-inline:20px}.sectionhead{margin-inline:-20px;padding-inline:20px}.community{margin-inline:20px}.pageintro{padding:24px}.pageintro h1{font-size:30px}.pageintro:after{right:65px;opacity:.7}.account-name{max-width:85px}.grid{gap:24px 15px;grid-template-columns:repeat(2,minmax(0,1fr))}.builder-badge{gap:5px;font-size:12px}.builder-badge img{width:80px}}
@media(max-width:850px){header{gap:14px;padding-inline:16px}.account-name{display:none}.pageintro:after{right:-20px}.intro-copy{max-width:82%}.shuffle{width:42px;height:42px;padding:8px;flex:none}.shuffle span{display:none}.shuffle svg{width:20px;height:20px}.sidebar{width:178px}.nav{font-size:14px}.search input{padding-right:12px}.pageintro h1{font-size:28px}}
@media(max-width:700px){header{height:auto;min-height:112px;flex-wrap:wrap;padding:12px 16px;gap:12px}.logo{font-size:25px}.topright{margin-left:auto;gap:10px}.account>button{min-height:38px;padding:7px 12px;font-size:14px}.topright>#theme{height:38px;width:38px}.search{order:3;flex-basis:100%;max-width:none;margin:0}.search input{min-height:40px;font-size:16px;padding:8px 12px 8px 36px}.search>span{top:12px}.account-status{font-size:11px;max-width:100px}.layout{display:block;padding:0 12px 95px}.sidebar{height:calc(74px + env(safe-area-inset-bottom));padding:6px 8px calc(6px + env(safe-area-inset-bottom));width:100%;border-right:0;border-top-color:#a47b49}.sidebar>.builder-badge{display:none}.sidebar .nav{font:700 12px Nunito,sans-serif;min-height:56px}.sidebar-world{display:none}main{margin:16px 0 0;padding-bottom:20px;border-radius:11px}.pageintro{min-height:142px;border-radius:7px 7px 0 0;padding:20px 18px;gap:10px;align-items:center}.pageintro h1{font-size:29px}.pageintro p{font-size:13px}.pageintro:after{opacity:.45}.intro-copy{max-width:80%}.video-library{padding-inline:16px}.community{margin:16px 16px 0}.community-head{padding:8px 10px;gap:8px;min-height:50px}.community-head .chat-heading{font-size:16px;gap:6px}.chat-heading img{width:24px;height:24px}.community-head .chat-summary{font-size:11px}.toolbar{gap:8px;flex-wrap:wrap;padding:16px 0}.toolbar select{font-size:12px;max-width:190px;padding-inline:8px}.filter-toggle,.chip{font-size:13px}.toolbar #filterSummary{display:none}.sectionhead{margin-inline:-16px;padding:11px 16px;gap:10px}.sectionhead h2{font-size:21px}.sectionhead small{font-size:12px}.grid{gap:24px 14px}.card h3{font-size:14px}.meta{font-size:12px}.meta a{font-size:12px}.details{gap:5px}.save{width:30px;height:36px}.count{font-size:10px;right:5px;bottom:5px}.site-footer{margin-inline:16px}.site-footer>.builder-badge{display:flex;width:max-content;margin:0 0 20px;padding:10px 15px;gap:10px;font-size:14px}.site-footer>.builder-badge img{width:100px;height:36px}}
@media(max-width:420px){.grid{grid-template-columns:1fr}.thumb{aspect-ratio:16/9}.card h3{font-size:16px}.meta{font-size:13px}.count{font-size:12px}.pageintro h1{font-size:27px}.pageintro p{font-size:13px}.intro-copy{max-width:78%}.community-head .chat-summary{font-size:0}.community-head .chat-summary:after{content:'Public';font-size:11px}.sectionhead h2{font-size:20px}.sectionhead small{font-size:11px}}
@media(prefers-reduced-motion:reduce){.thumb:hover img{transform:none}}
/* A shared tactile control language, including secondary and dialog actions. */
:is(.nav,.shuffle,.more,.filter-toggle,.chip,.save,.actions button,.close,.account>button,.auth-submit,.chat-form button,#theme,.builder-badge){transition:background-color .14s,box-shadow .14s,transform .14s,border-color .14s}
:is(.filter-toggle,.chip,.actions button,.close):hover{background:#ffe1a4;border-color:#633719}
:is(.shuffle,.more,.auth-submit,.chat-form button):not(:disabled):hover{background:#ab1549;border-color:#6f1032}
.account>button:hover{background:#ffcc77;border-color:#d6a155}
.account>button::before{content:'';width:18px;height:18px;margin-right:6px;background:url('/sky-world/key.webp') center/contain no-repeat;flex:none}
#theme:hover{background:#315b80;border-color:#a8c8dd}
:is(.filter-toggle,.chip,.actions button,.close):active{transform:translateY(2px);box-shadow:0 0 0 transparent}
:is(.nav,.account>button,.save,#theme,.builder-badge):active{transform:translateY(2px)}
:is(.shuffle,.more,.auth-submit,.chat-form button):not(:disabled):active{transform:translateY(2px);box-shadow:0 1px 0 #87133d}
:is(button,a,input,select,summary):focus-visible{outline:3px solid #c91b59;outline-offset:3px}
header :is(button,a,input):focus-visible,.sidebar :is(button,a):focus-visible,.dark :is(button,a,input,select,summary):focus-visible{outline-color:#ffbd4c}
button:disabled{cursor:not-allowed}
.community-head:hover{background:#ffdda2}.community-head:focus-visible{outline-offset:4px}.dark .community-head:hover{background:#31566f}
.toolbar select{appearance:none;padding-right:34px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23633719' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-size:16px;background-position:right 10px center}.toolbar select:hover{border-color:#633719;background-color:#ffeac4}.dark .toolbar select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23e5f3ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}.dark .toolbar select:hover{background-color:#31566f;border-color:#aac6d8}
.save{box-shadow:0 2px 0 #d4b78d}.save.on{background:#ffe0ec;border-color:#c85882;box-shadow:0 2px 0 #c88c9e;color:#a8174f}.dark .save{box-shadow:0 2px 0 #071e3b}.dark .save.on{background:#63304d;border-color:#a96c89;color:#ffc6db}.save.on svg{fill:currentColor}
.play svg{padding:10px;width:52px;height:52px;background:#c91b59;border:2px solid #ffb8d2;border-radius:12px;box-shadow:0 3px 0 #87133d}.title-button{border-radius:3px}.title-button:active{color:#9f1547}
.dialog{border:3px solid var(--edge);box-shadow:0 6px 0 var(--edge-dark);border-radius:12px}.info{border-top:3px solid var(--edge)}.actions button,.close{font:700 15px Fredoka,sans-serif;border:2px solid #996b3c;border-radius:7px;background:#fff0d0;box-shadow:0 3px 0 #cfaf7e;min-height:42px}.close{min-width:42px;font-size:25px}.actions button.on{border-color:#b64270;background:#ffe0ec;box-shadow:0 3px 0 #cb95a9}.dark .actions button,.dark .close{box-shadow:0 3px 0 #071e3b}.actions a{padding:10px 2px}.auth-dialog .auth-close{border:2px solid #ae8151;background:#ffe4b0;box-shadow:0 2px 0 #c49a6b;color:#573219}.auth-dialog .auth-close:hover{background:#ffd18b}.auth-dialog .auth-switch{border-top:1px solid #dcc5a0;border-radius:0;margin-top:14px;padding:14px 0 0;color:#a6174a}.auth-dialog .auth-switch:hover{text-decoration:underline;text-underline-offset:4px}.auth-dialog .auth-submit{font-size:16px}.auth-overlay{z-index:1000}
@media(max-width:700px){.account>button::before{display:none}.save{width:40px;height:40px}.toolbar select{padding-right:30px}.auth-dialog{padding:24px}}
@media(max-width:350px){header{padding-inline:12px;gap:10px}.logo{font-size:21px;gap:5px}.mark{width:27px;height:26px}.topright{gap:7px}.account>button{padding-inline:9px;font-size:13px}.topright>#theme{width:34px}.pageintro{padding-inline:14px}.video-library{padding-inline:12px}.sectionhead{margin-inline:-12px;padding-inline:12px}.sectionhead h2{font-size:18px}.community{margin-inline:12px}}
/* One live iframe, two layouts: minimize and expand never replace the player. */
.modal{z-index:20}.player-controls{display:flex;align-items:center;gap:7px;padding:9px 12px;background:#071e3b;color:#fff;border-bottom:2px solid var(--edge)}.player-controls>span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:700 14px Nunito,sans-serif}.player-controls button{width:36px;height:34px;flex:none;border:2px solid #a87b46;border-radius:7px;background:#ffe1a4;color:#3a241b;box-shadow:0 2px 0 #020e20;font:700 23px/1 Nunito,sans-serif}.player-controls button:hover{background:#ffce7b}.player-controls button:active{transform:translateY(2px);box-shadow:none}.player-controls button:focus-visible{outline-color:#ffbc4a}.player-controls #stopPlayer{background:#c91b59;color:#fff;border-color:#ff8cb7}.player-controls #stopPlayer:hover{background:#a8174f}.modal.mini{inset:auto 22px 22px auto;display:block;width:min(380px,calc(100vw - 28px));padding:0;background:none;pointer-events:none}.modal.mini .dialog{pointer-events:auto;width:100%;overflow:hidden;box-shadow:0 5px 0 #3a1c10,0 12px 30px #071e3b66;border-color:#633719}.modal.mini .info{display:none}.modal.mini .player-controls{padding:7px 9px}.modal.mini .player-controls>span{font-size:12px}.modal.mini .player-controls button{width:34px;height:32px}.modal.mini .player{aspect-ratio:16/9}
@media(max-width:700px){.modal.mini{right:12px;bottom:calc(88px + env(safe-area-inset-bottom));width:min(300px,calc(100vw - 24px))}.modal.mini .player-controls button{width:40px;height:36px}.player-controls button{width:40px;height:36px}.modal.mini .player-controls{padding:6px 8px}}
.dark .toolbar select{background-repeat:no-repeat;background-size:16px;background-position:right 10px center}
.dark :is(.filter-toggle,.chip,.actions button,.close):hover{background-color:#31566f;border-color:#aac6d8;color:#e5f3ff}.dark .chip.active:hover{background:#ffcc77;color:#3a241b}.auth-dialog .auth-close{border-radius:7px}.auth-submit:focus-visible,.auth-switch:focus-visible,.auth-close:focus-visible{outline-color:#c91b59}
@media(max-width:350px){.toolbar select{max-width:165px;font-size:11px}.toolbar{gap:6px}.filter-toggle{padding-inline:8px}}
/* Wayfinding stays visible while moving between the shelves and reading rooms. */
.logo{text-decoration:none;color:#fff}.dark .logo{color:#fff}.archive-nav{text-decoration:none}.sidebar .nav{flex-shrink:0}.sidebar-world{flex-shrink:0}.document-content[hidden]{display:none}.document-content h1:focus,.pageintro h1:focus{outline:none}.document-content .cards article{min-width:0}.document-content+.site-footer{margin-top:12px}.card h3,.comment-context,.hn-comment p,.chat-line p{overflow-wrap:anywhere}.layout{max-width:2200px;margin-inline:auto}.category-card{min-width:0;overflow-wrap:anywhere}.pageintro h1{overflow-wrap:anywhere}
@media(max-width:700px){.sidebar .nav[data-view=categories]{display:flex}.sidebar .archive-nav{display:none}.sidebar .nav{width:20%;font-size:10px;gap:3px}.sidebar .nav img{width:24px;height:24px}.sidebar .nav[data-view=about]{display:none}.pageintro h1{font-size:clamp(24px,5vw,29px)}.document-content .cards{grid-template-columns:repeat(2,minmax(0,1fr))}.modal.mini{width:min(270px,calc(100vw - 24px))}}
@media(max-width:540px){.document-content .cards{grid-template-columns:1fr}}
@media(max-height:700px) and (min-width:701px){.sidebar-world{display:none}.sidebar{padding-top:14px}.browse-label{margin-top:10px;padding-top:12px}.sidebar .nav{min-height:43px}.builder-badge{margin-top:12px}}
/* Keep the document height natural. Focused links can scroll above the floating player. */
@media(max-width:700px){html:has(.modal.mini){scroll-padding-bottom:280px}.site-footer a{scroll-margin-bottom:280px}}

/* Persistent wayfinding on long pages without extending the document. */
.scroll-tools{position:fixed;z-index:15;left:calc(218px + 28px);bottom:22px;display:flex;gap:8px;align-items:center}.scroll-tools[hidden]{display:none}.scroll-tools button{min-height:42px;padding:8px 14px;border:2px solid #996b3c;border-radius:9px;background:#ffe1a4;color:#3a241b;box-shadow:0 3px 0 #633719,0 6px 16px #071e3b44;font:700 14px Fredoka,sans-serif}.scroll-tools button:hover{background:#ffca78}.scroll-tools button:focus-visible{outline:3px solid #c91b59;outline-offset:3px}.scroll-tools button[hidden]{display:none}body:has(.modal.open:not(.mini)) .scroll-tools{visibility:hidden}@media(max-width:700px){.scroll-tools{left:12px;bottom:calc(84px + env(safe-area-inset-bottom));gap:6px}.scroll-tools button{font-size:12px;min-height:40px;padding:7px 10px}body:has(.modal.mini) .scroll-tools{bottom:calc(88px + env(safe-area-inset-bottom) + 205px)}}
