@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#0b0812;--panel:#171020;--line:#30213f;--purple:#9b5cff;--purple2:#6e35c8;--text:#f7f1ff;--muted:#b7a9c7}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% -20%,#382050 0,transparent 55%),var(--bg);color:var(--text);font-family:'IBM Plex Sans Arabic',system-ui,sans-serif;min-height:100vh}.shell{width:min(920px,100%);margin:auto;padding:22px 18px 34px}.topbar{display:flex;align-items:center;gap:12px;margin-bottom:34px}.brand-mark{width:46px;height:46px;border-radius:15px;background:linear-gradient(135deg,#bd8cff,#682bc1);display:grid;place-items:center;font-weight:700;color:white;box-shadow:0 8px 30px #8e43e855}.topbar strong,.topbar small{display:block}.topbar small{color:var(--muted);font-size:12px}.topbar .ghost{margin-right:auto}.panel{background:#171020ed;border:1px solid var(--line);border-radius:24px;padding:26px;max-width:520px;margin:30px auto;box-shadow:0 20px 70px #0006}.eyebrow{color:#c79cff;font-size:13px;font-weight:600}h1{font-size:clamp(27px,6vw,38px);margin:8px 0 10px}.muted{color:var(--muted);line-height:1.8;margin-top:0}label{display:block;margin:18px 0 8px;font-size:14px;color:#e9ddf7}input{width:100%;margin-top:8px;background:#0d0914;border:1px solid #49345d;border-radius:12px;padding:14px;color:white;font:inherit;outline:none}input:focus{border-color:var(--purple);box-shadow:0 0 0 3px #9b5cff22}button,.upload-btn{font:inherit;cursor:pointer;border:0;border-radius:12px;padding:12px 18px;color:white}.primary{width:100%;margin-top:18px;background:linear-gradient(100deg,#9b5cff,#6e35c8);font-weight:700}.secondary{background:#352248;border:1px solid #68418b}.ghost{background:transparent;border:1px solid var(--line)}.text-btn{display:block;margin:12px auto 0;background:transparent;color:#c79cff}.hidden{display:none!important}.msg{min-height:22px;color:#d9baff;font-size:13px}.welcome{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:20px}.notice{border:1px solid #674a28;background:#2a1e13;color:#f0d3a6;border-radius:13px;padding:13px 15px;font-size:13px;line-height:1.7;margin:18px 0}.toolbar{display:flex;gap:12px;align-items:center;margin:22px 0}.toolbar input{margin:0;flex:1}.upload-btn{white-space:nowrap;background:linear-gradient(100deg,#9b5cff,#6e35c8);font-weight:600}.video-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}.video-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:12px;min-width:0}.video-card video{width:100%;aspect-ratio:16/9;object-fit:cover;background:#08060b;border-radius:10px}.video-card strong{display:block;overflow-wrap:anywhere;margin:9px 0}.video-card button{background:#38234c;margin-top:5px}.empty{grid-column:1/-1;text-align:center;padding:45px 15px;border:1px dashed #49345d;border-radius:16px;color:var(--muted)}footer{text-align:center;color:#81738f;font-size:12px;margin-top:44px}footer span{color:var(--purple);padding:0 5px}dialog{width:min(900px,94vw);background:#100b19;border:1px solid var(--line);border-radius:18px;color:white;padding:16px}dialog::backdrop{background:#000c}dialog video{width:100%;max-height:75vh}.close{float:left;background:#392448;padding:6px 12px}@media(max-width:560px){.shell{padding:16px}.panel{padding:20px}.welcome{align-items:flex-start;flex-direction:column}.toolbar{align-items:stretch;flex-direction:column}.toolbar .upload-btn{text-align:center}}
