:root{--ink:#fff;--muted:#d0d5e2;--accent:var(--gold);--primary:var(--gold);--primary-dark:var(--gold-dark);--dark:var(--navy);--line:rgba(201,168,76,.3);--paper:#12244e;--bg:var(--navy);--soft:rgba(201,168,76,.12);--error:#ffb4ac;--radius:25px;color-scheme:dark;font-family:Cairo,Tajawal,sans-serif;background:var(--navy);color:white;line-height:1.9}
body{background:var(--navy);color:white;min-height:100vh;overflow-x:hidden!important;max-width:100%}
h1,h2,h3,button{font-family:Changa,Cairo,sans-serif;letter-spacing:normal}
h1{font-size:clamp(1.35rem,3vw,2rem)}
h2{font-size:1.35rem;color:var(--gold-light)}
p,input,select,textarea{font-family:Tajawal,Cairo,sans-serif}
p{line-height:2}
.eyebrow,.step-meta,.subtle{font-family:Almarai,Cairo,sans-serif}
.eyebrow{color:var(--gold-light)}
.muted,.subtle,.save-note{color:var(--muted)}

.geo-bg{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse 80% 60% at 20% 20%,rgba(201,168,76,.08),transparent 60%),radial-gradient(ellipse 60% 80% at 80% 80%,rgba(26,47,107,.6),transparent 60%),linear-gradient(135deg,#050D1F 0%,#0D1B3E 40%,#121E4A 100%)}
.pattern-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(201,168,76,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(201,168,76,.04) 1px,transparent 1px);background-size:60px 60px}
.floating-shapes{position:absolute;inset:0;overflow:hidden}
.shape{position:absolute;width:500px;height:500px;border:1px solid #c9a84c20;border-radius:50%;background:transparent!important;filter:none!important;animation:bilal-float 40s ease-in-out infinite alternate}
.shape-1{top:-200px;right:-200px}
.shape-2{width:350px;height:350px;top:-120px;right:-120px}
.shape-3{bottom:-300px;left:-300px;width:800px;height:800px}
.shape-4{bottom:-50px;left:20%;width:300px;height:300px}

.topbar,.shell,.site-foot{position:relative;z-index:1}
.topbar{display:flex;flex-direction:column;justify-content:center;text-align:center;gap:3px;background:var(--gradient-navy);border-bottom:var(--border-gold);padding:15px 20px}
.brand{font-family:Amiri,serif;color:var(--gold-light);font-size:1.35rem}
.brand small{font-family:Tajawal;font-size:.9rem;color:#e3e7f0;display:block}
.edition{display:block!important;color:var(--gold-light);font-size:.85rem}
.shell{max-width:1100px;margin:0 auto;padding:30px 20px}
.admin-shell{max-width:1400px}
.site-foot{padding:20px 15px;border-top:var(--border-gold);background:#050d1f88;margin:25px 0 0;color:#d0d5e2;text-align:center}
.site-foot p{margin-bottom:4px}
.footer-researcher,.copyright{color:var(--gold-light)}

.panel,.official-cover{background:linear-gradient(135deg,rgba(26,47,107,.85),rgba(13,27,62,.95));border:var(--border-gold);border-radius:25px;box-shadow:var(--shadow-lg),0 0 40px #c9a84c20}
.panel{padding:40px;text-align:center}
.official-cover{overflow:hidden}
.survey-header{background:var(--gradient-navy);padding:60px 40px 50px;text-align:center;position:relative;overflow:hidden;border-bottom:2px solid var(--gold)}
.header-pattern{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 20% 50%,#c9a84c19,transparent 50%),radial-gradient(circle at 80% 50%,#c0392b19,transparent 50%)}
.survey-header>*:not(.header-pattern){position:relative}
.university-badge{width:130px;height:130px;margin:0 auto 25px;background:var(--gradient-gold);border:3px solid #ffffff33;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 40px #c9a84c80;color:var(--navy);animation:bilal-pulse 2s ease-in-out 3}
.university-badge svg{width:70px;height:70px}
.university-name{font:700 1.4rem Amiri,serif;color:var(--gold-light)}
.faculty-name{color:var(--gold-light);font-size:.95rem}
.survey-header h1{font:600 clamp(1.2rem,2.5vw,1.6rem)/1.9 Changa,sans-serif;color:white;max-width:850px;margin:20px auto}
.subtitle{color:#d0d5e2}
.badge-pill{display:inline-block;background:var(--gradient-crimson);padding:10px 28px;border-radius:50px;font-family:Changa;box-shadow:0 5px 20px #c0392b66;color:white}
.cover-content{padding:40px}

.researcher-card{background:linear-gradient(135deg,#8b1a1a33,#0d1b3eb3);border:1px solid #c0392b4d;border-radius:20px;padding:30px;text-align:center;margin-bottom:25px}
.researcher-card h3{font-size:1.4rem;color:var(--gold-light)}
.researcher-card p{margin-bottom:8px}
.supervision-title{text-align:center;color:var(--teal-light);margin:24px auto}
.supervisors-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-bottom:35px}
.supervisor-box{background:linear-gradient(135deg,#0e749033,#0d1b3eb3);border:1px solid #22d3ee4d;border-inline-start:3px solid var(--teal-light);border-radius:20px;padding:25px;text-align:center}
.supervisor-box h3{color:var(--teal-light);line-height:1.9}
.supervisor-box p{font-size:.95rem;margin-bottom:10px}
.info-cards,.kpi-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:25px 0 35px}
.info-card{background:linear-gradient(135deg,#1a2f6bb3,#0d1b3ecc);border:1px solid #c9a84c33;border-radius:20px;padding:25px;text-align:center;position:relative;overflow:hidden;transition:transform .3s,border-color .3s}
.info-card h3{color:var(--gold-light)}
.info-card strong{font:700 1.4rem Changa;overflow-wrap:anywhere}
.info-card-icon{width:70px;height:70px;border-radius:50%;margin:0 auto 15px;display:flex;align-items:center;justify-content:center;font:700 2rem Changa;background:var(--gradient-gold);color:var(--navy)}
.info-card:nth-child(2) .info-card-icon{background:var(--gradient-crimson);color:white}
.info-card:nth-child(3) .info-card-icon{background:var(--gradient-teal);color:white}
.info-card p{color:var(--muted)}

button{display:inline-flex;align-items:center;justify-content:center;text-align:center;gap:12px;border-radius:50px;padding:14px 30px;background:linear-gradient(145deg,#253C82,#1A2F6B);border:var(--border-gold);color:var(--gold-light);transition:transform .25s,box-shadow .25s;position:relative;max-width:100%;font-family:Changa,Cairo,sans-serif;font-size:1rem;cursor:pointer}
button.primary,button.primary:hover{background:var(--gradient-gold);color:var(--navy);border-color:var(--gold);font-weight:700;box-shadow:0 10px 30px #c9a84c40}
button.btn-success,button.btn-success:hover{background:var(--gradient-crimson);color:white;border-color:var(--crimson-light);box-shadow:0 10px 30px #c0392b40}
button:disabled{opacity:0.5;cursor:not-allowed}

.navigation{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:15px;border-top:2px dashed #c9a84c33;padding-top:30px;margin-top:25px}
.navigation button{min-width:160px}
.field{max-width:750px;margin:0 auto 24px;text-align:center}
.field input,.field select,.field textarea,textarea{background:#0d1b3ecc;color:white;border:2px solid #c9a84c40;border-radius:12px;padding:16px 20px;text-align:center;width:100%;max-width:100%;font-family:Tajawal,Cairo,sans-serif;font-size:1rem}
.field select option{background:var(--navy);color:white}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--gold);box-shadow:0 0 0 4px #c9a84c26;outline:none}
.field>span{font-family:Changa;display:block;margin-bottom:8px}
.welcome-box{background:linear-gradient(135deg,#c9a84c26,#0d1b3ecc);border:var(--border-gold);border-radius:25px;padding:35px;margin:25px 0}
.research-info-box{background:linear-gradient(135deg,#8b1a1a33,#0d1b3eb3);border:1px solid #c0392b4d;border-radius:20px;padding:25px}
.instructions-card{background:linear-gradient(135deg,#0e749026,#0d1b3ecc);border:1px solid #22d3ee4d;border-radius:20px;padding:35px;margin:25px 0}
.notice{background:#c9a84c15;color:#f6e8bf;border:var(--border-gold);border-radius:12px;padding:15px 20px;text-align:center;margin:15px 0}
.notice.error{background:linear-gradient(135deg,#8b1a1ae6,#c0392be6);color:white;border-color:var(--crimson-light)}

.stage-head{padding:35px;background:linear-gradient(135deg,#1a2f6b99,#0d1b3ed9);border:var(--border-gold);border-radius:20px;text-align:center;margin-bottom:25px}
.axis-number{width:65px;height:65px;display:flex;align-items:center;justify-content:center;margin:0 auto 20px;border-radius:50%;background:var(--gradient-gold);color:var(--navy);font:700 1.8rem Changa}
.step-meta{display:flex;justify-content:center;gap:15px;color:var(--gold-light);font-size:.9rem;margin-top:10px}
.progress{height:12px;background:#0d1b3ecc;border:1px solid #c9a84c33;border-radius:50px;box-shadow:inset 0 2px 5px #0005;margin:15px 0}
.progress>span{display:block;height:100%;background:var(--gradient-gold);border-radius:50px;transition:width .5s;position:relative;overflow:hidden}
.question{background:linear-gradient(135deg,#1a2f6b99,#0d1b3ed9);border:1px solid #c9a84c33;border-inline-start:4px solid var(--gold);border-radius:20px;padding:28px;margin-bottom:28px}
.question legend{font-family:Cairo;color:white;text-align:right;font-size:1.05rem;line-height:1.9;margin-bottom:12px;display:block}
.qcode{border-radius:10px;background:var(--gradient-gold);color:var(--navy);padding:3px 12px;font-family:Changa;font-weight:700;direction:ltr;display:inline-block;margin-inline-end:10px;font-size:.9rem}
.choices{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:10px}
.choice{background:#0d1b3e99;border:2px solid #c9a84c33;border-radius:12px;min-height:65px;color:#eef1f8;font-family:Almarai;display:flex;align-items:center;justify-content:center;gap:8px;padding:10px;cursor:pointer;transition:transform .2s,box-shadow .2s}
.choice input{accent-color:var(--gold)}
.choice:has(input:checked){background:var(--gradient-gold);border-color:var(--gold);color:var(--navy);box-shadow:0 5px 15px #c9a84c40;transform:translateY(-2px)}
.question.missing{border-color:var(--crimson-light)}
.scale-guide{display:block;text-align:center;color:var(--gold-light);font-size:.9rem;margin:15px 0;padding:12px;background:#c9a84c10;border:1px dashed var(--line);border-radius:12px}

.review-values{background:#0d1b3e80;border-radius:15px;padding:20px;text-align:center;margin-bottom:15px}
.review-values dt,.review-row span:first-child{color:var(--gold-light)}
.review-row{display:flex;justify-content:space-between;align-items:center;padding:10px 15px;border-bottom:1px dashed var(--line)}
.review-row strong{color:var(--gold-light)}
.btn-review-edit{padding:6px 16px;font-size:.85rem;border-radius:30px;min-width:0;background:linear-gradient(145deg,#253C82,#1A2F6B);border:var(--border-gold);color:var(--gold-light)}
.review-answers{padding:18px;border:var(--border-gold);border-radius:15px;margin-top:14px;text-align:right}
.review-answers summary{cursor:pointer;font-family:Changa;color:var(--gold-light);padding:10px}
.review-answers p{padding:15px 0;border-bottom:1px dashed var(--line)}
.review-answers strong{display:block;color:var(--gold-light)}
.success .seal{width:150px;height:150px;border-radius:50%;background:var(--gradient-gold);color:var(--navy);display:flex;align-items:center;justify-content:center;margin:0 auto 25px;box-shadow:var(--shadow-gold)}
.success .seal svg{width:80px;height:80px}
.researcher-signature{display:flex;flex-direction:column;gap:10px;margin-top:30px;color:var(--gold-light);font-family:Amiri;font-size:1.3rem;text-align:center}

dialog{background:var(--gradient-navy);color:white;border:var(--border-gold);border-radius:25px;padding:35px;text-align:center;max-width:600px;max-height:85vh;overflow:auto;box-shadow:var(--shadow-gold)}
dialog::backdrop{background:#050d1fd9}
#detail{max-width:1000px}

.login-panel{max-width:650px;margin:40px auto}
.admin-tabs{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin:25px 0}
.admin-tabs button{font-size:.85rem;padding:10px 18px}
.admin-tabs button[aria-current=true]{background:var(--gradient-gold);color:var(--navy)}
.filters{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:25px 0 35px}
.filters .field{width:100%;min-width:0;margin:0}
#admin-content{min-width:0}
.table-wrap{margin:20px 0;overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain}
table{width:100%;border-collapse:collapse;border-spacing:0}
th{background:#223667;color:var(--gold-light);padding:12px 8px;font-size:.85rem}
td{background:#0d1b3e80;padding:10px 8px;overflow-wrap:anywhere;max-width:480px;font-size:.9rem;border-bottom:1px solid #c9a84c15}
th,td{text-align:center}

@keyframes bilal-float{to{transform:translate(20px,30px)}}
@keyframes bilal-pulse{50%{transform:scale(1.04);box-shadow:0 15px 45px #c9a84c66}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes highlight{50%{box-shadow:0 0 0 5px #9a283815}}

@media(hover:hover){
  button:not(:disabled):hover{transform:translateY(-3px);box-shadow:0 10px 30px #c9a84c30}
  .info-card:hover{transform:translateY(-5px);border-color:var(--gold)}
  .choice:hover{border-color:var(--gold)}
}

@media(max-width:768px){
  .shell{padding:0 12px}
  .panel,.cover-content{padding:25px 18px}
  .survey-header{padding:35px 20px}
  .supervisors-grid{grid-template-columns:1fr}
  .navigation{flex-direction:column}
  .navigation button{width:100%}
  .filters{grid-template-columns:1fr}
  .kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .welcome-box,.instructions-card{padding:24px 18px}
  .question{padding:22px 12px}
  .choices{grid-template-columns:1fr 1fr}
  .choices .choice:last-child{grid-column:1/-1}
  .stage-head{padding:25px 18px}
  .admin-tabs button{flex:1 1 120px}
  .review-row strong{width:100%}
  .review-row{justify-content:center;text-align:center;flex-wrap:wrap}
  .edition{font-size:.75rem}
}

@media(max-width:480px){
  .info-cards{grid-template-columns:1fr}
  .university-badge{width:105px;height:105px}
  .university-badge svg{width:55px;height:55px}
  .kpi-grid{gap:10px}
  .kpi-grid .info-card{padding:16px 8px}
  .kpi-grid h3{font-size:.9rem}
  .panel{padding:22px 14px}
  .choices{grid-template-columns:1fr}
  .choices .choice:last-child{grid-column:auto}
  .choice{min-height:50px;padding:12px 18px;font-size:.95rem;justify-content:flex-start}
  .field input,.field select{font-size:16px;padding:14px 16px}
}


@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}