:root{--background:oklch(.16 .01 30);--foreground:oklch(.96 .01 80);--card:oklch(.21 .012 30);--primary:oklch(.64 .23 28);--primary-foreground:oklch(.98 0 0);--secondary:oklch(.27 .012 30);--muted:oklch(.7 .02 60);--border:oklch(.3 .012 30);--shadow:0 12px 45px oklch(0 0 0 / .4)}
*{box-sizing:border-box;letter-spacing:0}body{margin:0;background:var(--background);color:var(--foreground);font:16px 'Space Grotesk',system-ui,sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button,.pill{cursor:pointer;border:0;border-radius:8px;background:var(--secondary);color:var(--foreground);padding:9px 15px;white-space:nowrap}button:hover,.pill:hover{filter:brightness(1.15)}.primary,.active{background:var(--primary);color:var(--primary-foreground)}input,select,textarea{width:100%;min-width:0;border:1px solid var(--border);border-radius:6px;padding:10px 12px;background:var(--background);color:var(--foreground)}input:focus,select:focus,textarea:focus{outline:1px solid var(--primary)}[hidden]{display:none!important}.container{max-width:1280px;margin:0 auto;padding-left:16px;padding-right:16px}header{position:sticky;top:0;z-index:10;background:var(--background);border-bottom:1px solid var(--border)}.topbar{display:flex;align-items:center;gap:16px;padding-top:12px;padding-bottom:12px}.brand{display:flex;align-items:center;gap:8px;font-size:20px;font-weight:700;overflow-wrap:anywhere}.brand img{width:32px;height:32px;border-radius:6px;object-fit:cover}.brand-icon{background:var(--primary);color:var(--primary-foreground);padding:3px 8px;border-radius:6px}.search{display:flex;flex:1;min-width:0}.search input{border-radius:24px 0 0 24px;background:var(--secondary)}.search button{border-radius:0 24px 24px 0}.categories{display:flex;gap:8px;overflow-x:auto;padding-bottom:12px}.pill{display:inline-block;border-radius:24px;font-size:14px}.categories .pill{flex-shrink:0}main{min-height:60vh;padding-top:24px;padding-bottom:32px}.video-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}.video-card img,.video-card video{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:8px;background:var(--card)}h1{font-size:24px}h2{font-size:19px}h3{font-size:16px;margin:8px 0 4px}.video-card p,.muted,small{color:var(--muted);font-size:14px}.video-card p{margin:0}.player-page{max-width:1024px}.player{position:relative}.player video{display:block;width:100%;aspect-ratio:16/9;background:var(--card);border-radius:8px}.watermark{position:absolute;top:12px;right:12px;max-width:70%;overflow-wrap:anywhere;padding:6px 12px;border-radius:6px;background:var(--background);opacity:.8;font-weight:700;pointer-events:none}.description{background:var(--secondary);padding:16px;border-radius:8px;white-space:pre-line;overflow-wrap:anywhere}#comments{margin-top:32px}.row{display:flex;align-items:center;gap:8px}.row>input{flex:1}.comment-form{display:grid;gap:8px}.comment-form>input.remember-name{max-width:260px}.comments{list-style:none;padding:0}.comments li{margin-top:20px;overflow-wrap:anywhere}.comments p{white-space:pre-line;margin:6px 0}footer{border-top:1px solid var(--border);background:var(--card);font-size:14px;color:var(--muted)}.footer-row{display:flex;justify-content:space-between;gap:16px;padding-top:24px;padding-bottom:24px}.footer-row nav{display:flex;gap:16px}.chat-toggle{position:fixed;bottom:16px;right:16px;z-index:20;width:56px;height:56px;border-radius:50%;font-size:24px;box-shadow:var(--shadow)}.chat{position:fixed;bottom:84px;right:16px;width:360px;max-width:calc(100% - 32px);height:70vh;max-height:520px;z-index:20;background:var(--card);border:1px solid var(--border);border-radius:8px;box-shadow:var(--shadow);display:flex;flex-direction:column}.chat-heading{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--border)}.chat-heading button{padding:4px 8px}.chat-messages{flex:1;overflow:auto;padding:16px;font-size:14px}.chat-messages p{overflow-wrap:anywhere}.chat-messages strong{color:var(--primary)}#chat-form{padding:12px;border-top:1px solid var(--border);display:grid;gap:8px}#chat-error:empty,.upload-error:empty{display:none}.age-gate{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:16px;background:var(--background)}.age-box{width:100%;max-width:380px;padding:24px;border:1px solid var(--border);border-radius:8px;background:var(--card);text-align:center}.age-box button{display:block;width:100%;margin-top:8px}.age-number{font-size:40px;font-weight:700;color:var(--primary);margin:0}.admin-page{max-width:900px}.admin-heading{justify-content:space-between;margin-bottom:24px}.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}.form-panel{border:1px solid var(--border);background:var(--card);border-radius:8px;padding:20px;display:grid;gap:12px;margin-bottom:32px}.form-panel h2,.form-panel h1{margin-top:0}.form-panel label{display:grid;gap:6px;font-size:14px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}fieldset{border:1px solid var(--border);border-radius:6px}label.inline{display:inline-flex;align-items:center;margin-right:12px}label.inline input{width:auto}.login{max-width:380px;margin:40px auto}.admin-list{list-style:none;padding:0}.admin-list>li{border:1px solid var(--border);border-radius:8px;padding:12px;display:flex;justify-content:space-between;align-items:center;gap:12px;margin:10px 0}.admin-list>li>div:first-child{min-width:0;overflow-wrap:anywhere}.admin-list p{margin:4px 0}.danger,.error{color:var(--primary)}.empty{text-align:center;padding:60px 16px;grid-column:1/-1}body.age-locked{overflow:hidden}
@media(max-width:1000px){.video-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:760px){.video-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.category-item{flex-wrap:wrap}}@media(max-width:480px){.video-grid{grid-template-columns:1fr}.topbar{flex-wrap:wrap}.brand{max-width:100%}.search{flex-basis:100%}.form-grid{grid-template-columns:1fr}.footer-row{flex-direction:column;align-items:center;text-align:center}.admin-list>li{flex-wrap:wrap}.category-item>form{width:100%}.row button{padding:9px 12px}}
