*{box-sizing:border-box}
html,body{margin:0;background:#0d0d0f;color:#f4f4f5;font-family:Arial,sans-serif}
.site-header{height:56px;display:flex;align-items:center;padding:0 16px;background:#151518;border-bottom:1px solid #29292e;position:sticky;top:0;z-index:10}
.brand{font-size:19px;font-weight:700}
.container{width:min(100%,720px);margin:0 auto;padding:14px}
.video-list{display:flex;flex-direction:column;gap:14px}
.video-card{background:#17171a;border:1px solid #29292e;border-radius:10px;padding:10px}
.video-title{font-size:16px;font-weight:600;margin:2px 2px 10px}
video{width:100%;display:block;background:#000;border-radius:7px;max-height:55vh}
.actions{display:flex;gap:8px;margin-top:10px}
.actions a,.panel button{flex:1;text-align:center;text-decoration:none;border:0;border-radius:7px;padding:11px 10px;background:#fff;color:#111;font-weight:700;cursor:pointer}
.actions a.download{background:#2a2a2f;color:#fff}
.pagination{display:flex;gap:7px;justify-content:center;flex-wrap:wrap;padding:20px 0 35px}
.pagination a{min-width:38px;text-align:center;padding:9px 11px;border-radius:7px;background:#202024;color:#fff;text-decoration:none}
.pagination a.active{background:#fff;color:#111}
.panel{background:#17171a;border:1px solid #29292e;border-radius:10px;padding:14px;margin-bottom:14px}
.panel h1{font-size:20px;margin:0 0 14px}
input{width:100%;padding:12px;margin:0 0 9px;border:1px solid #33343a;background:#0f0f11;color:#fff;border-radius:7px}
.panel button{width:100%;margin-top:2px}
.panel button.secondary{background:#2a2a2f;color:#fff}
.msg{min-height:20px;color:#bdbdc5}
.hidden{display:none!important}
.admin-item{border-top:1px solid #2c2c31;padding:12px 0}
.admin-item strong{display:block;margin-bottom:8px}
.admin-actions{display:flex;gap:8px}
.admin-actions button{margin:0}
@media(min-width:721px){body:after{content:"Mobile optimized";position:fixed;right:10px;bottom:10px;background:#222;padding:6px 8px;border-radius:6px;font-size:11px;color:#aaa}}
