:root{color-scheme:light;--paper:#f9f9f6;--white:#fff;--ink:#20251e;--muted:#73786e;--line:#e4e7df;--green:#365b38;--tint:#eaf0e5;--sans:Geist,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}svg{display:block}.icon{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.icon-defs{position:absolute;width:0;height:0;overflow:hidden}.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}:focus-visible{outline:3px solid #7c9b60;outline-offset:4px}.skip-link{position:fixed;top:-80px;left:20px;z-index:50;background:var(--ink);color:white;padding:12px 20px;border-radius:6px}.skip-link:focus{top:12px}
.topbar{height:84px;position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:32px;padding:0 32px 0 26px;border-bottom:1px solid var(--line);background:rgba(249,249,246,.96);backdrop-filter:blur(16px)}.brand{display:flex;align-items:center;gap:10px;flex:0 0 194px;font-size:23px;font-weight:650;letter-spacing:-.8px;line-height:1.12}.brand-mark{width:37px;height:37px;border-radius:12px;background:var(--green);display:grid;place-items:center;color:white}.brand-mark svg{width:24px;height:24px;fill:currentColor;transform:translateX(-2px)}.brand-sub{display:block;font-size:9px;font-weight:500;letter-spacing:2.6px;margin:4px 0 0 1px}.search{max-width:570px;flex:1;display:flex;align-items:center;gap:12px;background:#f0f1ed;border:1px solid #e3e5dd;border-radius:24px;height:43px;padding:0 16px;margin:0 auto;color:var(--muted)}.search:focus-within{border-color:#879a79;box-shadow:0 0 0 2px #dce7d3}.search input{background:transparent;border:0;outline:none;width:100%;min-width:0;color:var(--ink);font-size:13px}.search input::placeholder{color:#7f857a}.search kbd{font:12px var(--sans);border:1px solid #d9dcd2;border-radius:4px;min-width:21px;text-align:center}.create-button{height:40px;display:flex;align-items:center;justify-content:center;gap:8px;background:var(--green);color:#fff;padding:0 17px;border-radius:8px;font-size:12px;font-weight:500;white-space:nowrap}.create-button:hover{background:#29492c}
.sidebar{position:fixed;top:84px;bottom:0;width:220px;padding:31px 18px 24px 20px;display:flex;flex-direction:column;border-right:1px solid var(--line);overflow-y:auto}.nav-label{font-size:9px;letter-spacing:1.8px;font-weight:600;color:#8a9084;margin:0 12px 14px}.nav-link{display:flex;align-items:center;gap:12px;padding:12px;border-radius:8px;color:#71766b;font-size:12px;margin:2px 0}.nav-link.active{background:var(--tint);color:var(--green);font-weight:600}.nav-link:hover{background:#eef0e9;color:var(--ink)}.nav-link.active .icon{stroke-width:1.9}.nav-link #nav-count{margin-left:auto;font-size:10px;font-weight:500;color:var(--green)}.nav-divider{height:1px;background:var(--line);margin:25px 10px}.sidebar-note{margin:38px 4px 30px;padding:18px 15px;background:#f0f2e9;border:1px solid #e3e7d9;border-radius:10px}.note-mark{font-size:30px;color:#83945c;line-height:1}.sidebar-note h2{font-size:15px;line-height:1.45;letter-spacing:-.3px;font-weight:500;margin:10px 0}.sidebar-note p{font-size:11px;line-height:1.7;color:var(--muted);margin:0 0 17px}.sidebar-note a{display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:500;color:var(--green)}.sidebar-note .icon{width:16px;height:16px}.sidebar-footer{margin-top:auto;padding:0 13px;color:#95998f;font-size:10px;line-height:1.8}.sidebar-footer a{display:block;margin-top:12px;color:#697261}
main{margin-left:220px;padding:36px 34px 24px;max-width:2100px;min-height:calc(100vh - 84px)}.intro{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:28px}.eyebrow{font-size:9px;letter-spacing:1.8px;font-weight:500;color:#7e8974;margin:0 0 9px;display:flex;align-items:center;gap:7px}.eyebrow span{width:5px;height:5px;background:#8ca77a;border-radius:50%}h1{font-size:29px;font-weight:500;line-height:1.25;letter-spacing:-1.1px;margin:0 0 9px}.intro-copy{font-size:12px;color:var(--muted);margin:0}.library-count{color:#8a9181;font-size:10px;white-space:nowrap;align-self:flex-end;padding-bottom:2px}.toolbar{display:flex;align-items:center;gap:15px;justify-content:space-between;margin-bottom:23px}.filters{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}.filter{border:1px solid #e4e7df;background:transparent;border-radius:7px;padding:7px 13px;white-space:nowrap;font-size:11px;color:#6b7363;transition:background .12s}.filter:hover{background:#eaf0e5}.filter.active{background:var(--ink);border-color:var(--ink);color:white}.sort{flex-shrink:0}.sort select{border:0;background:transparent;color:#70776a;font-size:11px;padding:6px 1px;cursor:pointer}.results-status{color:var(--muted);font-size:12px;margin:0}.results-status:not(:empty){margin-bottom:20px}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:33px 22px}.vcard{min-width:0}.thumbnail{aspect-ratio:16/9;position:relative;display:block;overflow:hidden;border-radius:11px;background:#e9ece2;border:1px solid #dce1d3}.thumbnail img{position:absolute;width:100%;height:100%;object-fit:contain;inset:0;transition:transform .25s ease;background:#e9ece2}.thumbnail:hover img{transform:scale(1.025)}.thumbnail-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:25px;background:radial-gradient(ellipse at 90% 5%,#d0debd,transparent 70%),#e4eadb;color:#5f714d;gap:12px;font-size:12px}.thumbnail-placeholder svg{width:34px;height:34px;fill:currentColor}.duration{position:absolute;bottom:8px;right:8px;color:white;background:rgba(24,29,22,.84);border-radius:4px;font-size:10px;font-weight:500;padding:2px 5px;letter-spacing:.2px;font-variant-numeric:tabular-nums}.play-overlay{position:absolute;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.12);opacity:0;transition:opacity .2s}.play-overlay svg{width:45px;height:45px;fill:white;filter:drop-shadow(0 1px 4px #0004)}.thumbnail:hover .play-overlay,.thumbnail:focus-visible .play-overlay{opacity:1}.vbody{display:flex;gap:10px;padding:12px 2px 0}.avatar{flex:0 0 29px;height:29px;border-radius:50%;display:grid;place-items:center;background:#e7eddf;color:#6d8157;font-size:17px;line-height:1;margin-top:1px}.vdetails{min-width:0;flex:1}.vtitle{font-size:13px;line-height:1.5;font-weight:550;letter-spacing:-.1px;margin:0 0 5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.vtitle a:hover{color:var(--green)}.vchannel{color:#7b8471;font-size:10px;display:flex;align-items:center;gap:4px}.verified{width:10px;height:10px;border-radius:50%;font-size:7px;background:#859575;color:white;display:inline-grid;place-items:center}.vmeta{color:#8b9184;font-size:10px;margin-top:2px;line-height:1.8}.vmeta a:hover{color:var(--green);text-decoration:underline}.revision-label{margin:5px 0 0;color:#7c876e;font-size:9px}.empty{border:1px dashed #d7ddcf;text-align:center;border-radius:12px;padding:75px 24px;color:var(--muted)}.empty h2{font-size:20px;font-weight:500;color:var(--ink);margin:0 0 8px}.empty p{font-size:13px;margin:0 0 22px}.empty button{border:0;background:var(--green);color:white;border-radius:7px;padding:9px 17px;font-size:12px}.loading-state{padding:65px 0;text-align:center;color:var(--muted)}.main-footer{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:48px;padding-top:20px;border-top:1px solid var(--line);color:#93998c;font-size:10px}.mobile-about{display:none}
@media(min-width:1700px){.grid{grid-template-columns:repeat(4,minmax(0,1fr))}main{padding:40px}.vtitle{font-size:14px}}
@media(max-width:1160px){.sidebar{width:190px;padding-left:12px;padding-right:12px}.topbar{gap:20px;padding-left:22px}.brand{flex-basis:170px}main{margin-left:190px;padding:28px 24px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px}.sidebar-note{padding:16px 12px}.library-count{display:none}}
@media(max-width:800px){.sidebar{display:none}main{margin-left:0;padding:28px 22px}.topbar{padding:0 22px;gap:18px;height:76px}.brand{flex-basis:auto;font-size:20px}.brand-mark{width:32px;height:32px;border-radius:10px}.brand-sub{font-size:8px;letter-spacing:2px}.search{max-width:none}.search kbd{display:none}.create-button{padding:0 10px}.create-button span{display:none}.intro{margin-bottom:24px}.grid{gap:28px 18px}.mobile-about{display:block}}
@media(max-width:540px){.topbar{height:auto;min-height:124px;display:grid;grid-template-columns:1fr auto;gap:14px;padding:16px 18px 14px}.brand{font-size:20px}.search{grid-column:1/-1;grid-row:2;width:100%;height:37px}.create-button{grid-column:2;grid-row:1;height:34px;padding:0 11px;font-size:10px}.create-button span{display:inline}.create-button .icon{width:15px;height:15px}main{padding:26px 18px}.intro{margin-bottom:22px}h1{font-size:27px}.intro-copy{font-size:11px}.eyebrow{font-size:8px;letter-spacing:1.5px}.toolbar{display:block;margin-bottom:17px}.filters{gap:6px;margin-right:-18px;padding-right:18px}.filter{font-size:10px;padding:7px 10px}.sort{text-align:right;margin-top:11px}.grid{grid-template-columns:1fr;gap:28px}.thumbnail{border-radius:10px}.vbody{padding-top:12px;gap:10px}.vtitle{font-size:14px}.vchannel,.vmeta{font-size:11px}.avatar{flex-basis:31px;height:31px}.main-footer{line-height:1.8}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important}}
