:root{
  --bg:#0f1220; --card:#141834; --muted:#8ea0c9; --text:#e9eefb;
  --brand:#243D80; --brand2:#8ba875; --chip:#1d2242; --chipA:#2a2f5a;
}
*{box-sizing:border-box}
.qwp-root{
  font-family:'Tajawal',system-ui,-apple-system,Segoe UI,Roboto,Tahoma,Arial;
  color:var(--text);
  background:linear-gradient(180deg,#0b0e1a,#0f1220 30%);
  min-height:70vh
}
.qwp-wrap{max-width:520px;margin:0 auto;padding:16px}
.qwp-card{background:linear-gradient(180deg,#141834,#101431);border:1px solid #1f2549;border-radius:16px;box-shadow:0 10px 30px rgba(0,0,0,.25);padding:16px}

/* رأس التطبيق */
.qwp-header{position:sticky;top:0;background:rgba(15,18,32,.7);backdrop-filter: blur(10px);z-index:10;border-bottom:1px solid #1e2447}
.qwp-header .bar{display:flex;align-items:center;gap:10px;padding:14px 16px}
.qwp-logo{font-weight:800;letter-spacing:.2px}
.qwp-pill{margin-inline-start:auto;padding:6px 10px;border-radius:999px;background:#1c1f3f;border:1px solid #2d3270;color:#b9c4ea;font-size:12px}

/* بحث */
.qwp-search{display:flex;gap:8px;margin:12px 16px 0}
.qwp-input{flex:1;background:#121538;border:1px solid #2a2f5a;border-radius:10px;color:#e9eefb;padding:10px 12px}
.qwp-btn{background:linear-gradient(180deg,var(--brand),#1b2250);border:1px solid #2a3c92;border-radius:10px;padding:10px 14px;color:#fff;cursor:pointer}

/* شبكة العناصر */
.qwp-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:12px 16px 110px}
.qwp-item{background:#13173a;border:1px solid #232756;border-radius:12px;overflow:hidden;cursor:pointer;display:flex;flex-direction:column}
.qwp-thumb{height:110px;background:#0b0f2c;display:flex;align-items:center;justify-content:center}
.qwp-thumb img{max-width:100%;max-height:100%}
.qwp-meta{padding:10px}
.qwp-title{font-size:14px;font-weight:800;line-height:1.5;min-height:38px}
.qwp-sub{color:#9fb1e8;font-size:12px;margin-top:4px}
.qwp-chipbar{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.qwp-chip{background:var(--chip);border:1px solid var(--chipA);color:#b7c3f3;border-radius:999px;font-size:11px;padding:4px 8px}

/* شريط سفلي */
.qwp-bottom{position:fixed;left:0;right:0;bottom:0;background:rgba(15,18,32,.95);backdrop-filter:blur(8px);border-top:1px solid #1e2447}
.qwp-nav{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:10px}
.qwp-nav .btn{background:#171b39;border:1px solid #232756;color:#cfd9ff;border-radius:12px;padding:10px 8px;text-align:center;font-size:12px;cursor:pointer}
.qwp-nav .btn.active{background:linear-gradient(180deg,var(--brand),#1b2250);border-color:#2a3c92}

/* شاشة الدخول */
.qwp-login{padding:16px}
.qwp-form{display:flex;flex-direction:column;gap:10px}
.qwp-h1{font-weight:800;font-size:20px;margin-bottom:10px}
.qwp-note{font-size:13px;color:#9fb1e8}
.qwp-link{color:var(--brand2);text-decoration:none}
.qwp-otp-grid{display:flex;gap:8px}
.qwp-otp-grid input{width:100%;text-align:center;font-size:20px;padding:12px;border-radius:12px;background:#121538;border:1px solid #2a2f5a;color:#fff}

/* المشغّل */
.qwp-player{position:fixed;left:0;right:0;bottom:64px;background:#0b0e1f;border-top:1px solid #1e2447}
.qwp-player .box{padding:10px 16px}
.qwp-player video{width:100%;border-radius:12px;background:#000;max-height:52vh}
.qwp-row{display:flex;align-items:center;justify-content:space-between;margin-top:8px}
.qwp-mini{font-size:12px;color:#9fb1e8}

/* شاشة Hub (3 بطاقات) */
.qwp-hero{padding:22px 16px 8px}
.qwp-hero h1{margin:0;font-size:22px;font-weight:800}
.qwp-hero p{margin:6px 0 0;color:#9fb1e8;font-size:13px}
.qwp-tiles{display:grid;gap:12px;margin:12px 16px 110px}
.qwp-tile{display:flex;align-items:center;justify-content:space-between;padding:16px;border-radius:16px;background:#171b39;border:1px solid #232756;cursor:pointer}
.qwp-tile .t-left{display:flex;align-items:center;gap:12px}
.qwp-tile .ico{width:42px;height:42px;border-radius:12px;background:linear-gradient(180deg,var(--brand),#1b2250);display:flex;align-items:center;justify-content:center;font-weight:800}
.qwp-tile .t-title{font-weight:800}
.qwp-tile .t-sub{font-size:12px;color:#9fb1e8;margin-top:2px}
.qwp-tile .count{font-size:12px;color:#b7c3f3}

/* تصنيفات القسم */
.qwp-chips{position:sticky;top:88px;z-index:9;display:flex;gap:8px;flex-wrap:nowrap;overflow:auto;padding:10px 16px;background:rgba(15,18,32,.75);backdrop-filter:blur(6px);border-bottom:1px solid #1e2447}
.qwp-chips .chip{white-space:nowrap;padding:6px 10px;border-radius:999px;background:#13173a;border:1px solid #232756;color:#cfd9ff;font-size:12px;cursor:pointer}
.qwp-chips .chip.active{background:linear-gradient(180deg,var(--brand2),#5b7353);border-color:#6c8b62;color:#0c111a}

/* رأس القسم + زر رجوع */
.qwp-sec-head{position:sticky;top:0;z-index:11;background:rgba(15,18,32,.85);backdrop-filter:blur(8px);border-bottom:1px solid #1e2447;padding:10px 16px;display:flex;align-items:center;gap:10px}
.qwp-back{cursor:pointer;background:#171b39;border:1px solid #232756;border-radius:10px;padding:8px 10px}
.qwp-sec-title{font-weight:800}

@media(min-width:768px){
  .qwp-grid{grid-template-columns:repeat(3,1fr)}
}


/* OTP UX */
.qwp-otp-grid{direction:ltr}
.qwp-otp-grid input{
  caret-color:#fff;          /* مو ضروري، تحسّن بسيط */
}

.qwp-check{display:flex;align-items:center;gap:.5rem;margin-top:10px;user-select:none;cursor:pointer;opacity:.9}
.qwp-check input{accent-color:#3fa3ff;width:18px;height:18px}
.qwp-check:hover{opacity:1}