/* Mutqinin shared theme: mobile first. Logo sources: Wawan, 11 September 2026. */
:root{--mq-brand:#3794d1;--mq-accent:#5ac3e1;--mq-action:#176994;--mq-action-hover:#105574;--mq-ink:#173447;--mq-muted:#536b79;--mq-line:#dce7ed;--mq-soft:#edf6fa;--mq-paper:#fff;--mq-bg:#f6f9fb;--tutor-color-primary:var(--mq-action);--tutor-color-primary-hover:var(--mq-action-hover)}
.mq-portal.mqp-alif{--mq-brand:#008001;--mq-action:#006d15;--mq-action-hover:#005812;--mq-soft:#edf7ef;--tutor-color-primary:#006d15}
.mq-portal{background:var(--mq-bg);color:var(--mq-ink);font:400 16px/1.65 system-ui,-apple-system,"Segoe UI",sans-serif;margin:0}
.mq-portal *{box-sizing:border-box}.mq-portal [hidden]{display:none!important}.mq-portal img{max-width:100%;height:auto}.mq-portal h1,.mq-portal h2,.mq-portal h3{font-family:inherit;letter-spacing:-.02em;color:var(--mq-ink);font-weight:650;line-height:1.3}.mq-portal h1{font-size:clamp(28px,3vw,38px)}.mq-portal h2{font-size:24px}.mq-portal h3{font-size:19px}.mq-portal p{margin:0 0 16px}.mq-portal a{color:var(--mq-action)}.mq-portal button,.mq-portal input,.mq-portal textarea,.mq-portal select{font:inherit}
.mq-portal a:focus-visible,.mq-portal button:focus-visible,.mq-portal input:focus-visible,.mq-portal select:focus-visible,.mq-portal textarea:focus-visible,.mq-portal summary:focus-visible{outline:3px solid var(--mq-action);outline-offset:3px}
.mq-portal #content>.col-full{max-width:1248px;margin:0 auto;padding:24px 16px 48px;width:100%}.mq-portal #primary{float:none;width:100%;margin:0}.mq-portal #secondary{display:none}.mq-portal .site-main{margin:0}.mq-portal .entry-content{margin:0}.mq-portal .entry-header{padding:8px 0 20px}.mq-portal .hentry{margin:0}.mq-portal .col-full:before,.mq-portal .col-full:after{display:none}
.mqp-site-header{background:#fff;border-bottom:1px solid var(--mq-line);position:relative;z-index:30;color:var(--mq-ink)}.mqp-header-inner{max-width:1248px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 16px;min-height:80px}.mqp-brand{display:flex;align-items:center;gap:10px;text-decoration:none!important;flex-shrink:0}.mqp-brand img{width:62px;height:62px;object-fit:contain}.mqp-brand-copy{display:flex;flex-direction:column;font-size:12px;line-height:1.4;color:var(--mq-muted)}.mqp-brand-copy strong{font-size:18px;color:var(--mq-ink)}
.mqp-primary-nav{display:none;gap:28px}.mqp-primary-nav a{font-weight:550;font-size:15px;text-decoration:none;padding:12px 0;color:var(--mq-ink)}.mqp-header-actions{display:flex;gap:8px;align-items:center}.mqp-account-link{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;text-decoration:none;border:1px solid var(--mq-line);border-radius:8px;padding:10px 12px;min-height:46px}.mqp-account-link svg{width:19px;height:19px}.mqp-menu-toggle{display:flex;align-items:center;gap:6px;min-height:46px;padding:10px;border:0;background:var(--mq-soft);color:var(--mq-ink);border-radius:8px;cursor:pointer;font-size:14px}.mqp-menu-toggle svg{width:17px;height:17px}.mqp-mobile-menu{border-top:1px solid var(--mq-line);display:grid;max-width:1248px;margin:auto;padding:12px 16px;gap:4px}.mqp-mobile-menu a{padding:10px 12px;text-decoration:none;border-radius:6px}.mqp-mobile-menu a:hover{background:var(--mq-soft)}.mqp-skip{position:fixed;top:-120px;left:16px;z-index:999999;background:#fff;padding:12px}.mqp-skip:focus{top:12px}
.mqp-site-footer{padding:28px 16px;border-top:1px solid var(--mq-line);background:#fff;font-size:14px;color:var(--mq-muted);display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px}.mqp-site-footer>div,.mqp-site-footer>nav{max-width:560px}.mqp-site-footer p{margin:6px 0 0}.mqp-site-footer nav{display:flex;flex-wrap:wrap;gap:8px 22px}.mqp-site-footer a{padding:8px 0}
.mqp-workspace{display:grid;gap:20px;align-items:start}.mq-portal main.mqj{min-width:0;width:100%;max-width:none;margin:0;padding:0;color:var(--mq-ink);font:inherit}.mqp-page-heading{margin:0 0 24px}.mqp-page-heading h1{margin:12px 0 8px}.mqp-page-heading>p{color:var(--mq-muted);max-width:720px}.mqp-breadcrumb{display:flex!important;align-items:center;gap:10px;font-size:13px;color:var(--mq-muted);margin:0!important;padding:0!important}.mqp-breadcrumb a{border:0!important;padding:0!important;background:transparent!important}
.mq-portal .mqp-sidebar{min-width:0}.mq-portal .mqp-room-menu{margin:0;border:1px solid var(--mq-line);border-radius:10px;background:#fff;padding:0}.mqp-room-menu>summary{padding:12px 16px;min-height:48px;font-weight:600;cursor:pointer}.mqp-room-links{padding:4px 10px 14px}.mqp-room-links a{display:flex;align-items:center;gap:10px;padding:11px 12px;min-height:46px;text-decoration:none!important;color:var(--mq-muted);border-radius:7px;font-size:14px}.mqp-room-links a[aria-current],.mqp-room-links a:hover{background:var(--mq-soft);color:var(--mq-action);font-weight:650}.mqp-room-links svg{width:19px;height:19px;flex-shrink:0}.mqp-nav-label{font-size:12px;font-weight:650;color:#637987;margin:16px 12px 6px!important;text-transform:uppercase;letter-spacing:.07em}
.mq-portal .mqj section,.mq-portal .mqj article{border:1px solid var(--mq-line);background:#fff;border-radius:12px;padding:20px;margin:20px 0;box-shadow:none}.mq-portal .mqj section h2:first-child,.mq-portal .mqj article h2:first-child{margin-top:0}.mq-portal .mqj section section,.mq-portal .mqj section article{border-radius:8px}.mq-portal .mqj .grid{display:grid;grid-template-columns:1fr;gap:16px}.mq-portal .mqj .grid>article{margin:0;min-width:0}.mq-portal .mqj h2{font-size:23px}.mq-portal .mqj h3{font-size:18px}.mq-portal .mqj p,.mq-portal .mqj a{overflow-wrap:anywhere}.mq-portal .mqj label{display:block;font-weight:500;margin:14px 0}.mq-portal .mqj input:not([type=checkbox]):not([type=radio]):not([type=submit]),.mq-portal .mqj select,.mq-portal .mqj textarea{display:block;width:100%;min-height:48px;border:1px solid #a9bdca;border-radius:7px;background:#fff;color:var(--mq-ink);padding:11px 12px;font-size:16px;line-height:1.5;box-shadow:none;margin-top:6px;max-width:100%}.mq-portal .mqj input[type=checkbox],.mq-portal .mqj input[type=radio]{width:20px;height:20px;min-height:20px;vertical-align:middle;margin:0 9px 0 0;flex-shrink:0}.mq-portal .mqj label:has(>[type=checkbox]){display:flex;align-items:flex-start;font-weight:400;gap:4px}.mq-portal .mqj label:has(>[type=checkbox]) input{margin-top:4px}.mq-portal .mqj fieldset{background:var(--mq-soft);border:1px solid var(--mq-line);border-radius:8px;min-width:0;padding:16px;margin:20px 0}.mq-portal .mqj legend{font-weight:600;padding:0 5px}
.mq-portal .mqj button,.mq-portal .mqj .button,.mq-portal .mqp-secondary,.mq-portal .mqj input[type=submit]{display:inline-flex;align-items:center;justify-content:center;min-height:48px;max-width:100%;border:1px solid var(--mq-action);border-radius:8px;padding:11px 18px;margin:8px 0;background:var(--mq-action);color:#fff;font:600 15px/1.4 system-ui,sans-serif;text-decoration:none!important;cursor:pointer;text-align:center;white-space:normal}.mq-portal .mqj .button:hover,.mq-portal .mqj button:hover{background:var(--mq-action-hover);color:#fff}.mq-portal .mqj .secondary,.mq-portal .mqp-secondary{background:#fff;color:var(--mq-action);border-color:#a9c8d9}.mq-portal .mqj .tag{display:inline-flex;align-items:center;font-size:13px;font-weight:550;line-height:1.5;background:var(--mq-soft);color:var(--mq-action);border-radius:5px;padding:4px 9px}.mq-portal .mqj details{padding:10px 0;min-width:0}.mq-portal .mqj summary{cursor:pointer;min-height:44px;padding:10px 0;font-weight:600}.mq-portal .mqj small,.mqp-small{font-size:14px;color:var(--mq-muted)}.mq-portal .mqj .feedback,.mq-portal .mqj .message,.mqp-note{border:1px solid #b8dbe7;border-left:4px solid var(--mq-action);padding:16px;background:var(--mq-soft);border-radius:8px;margin:20px 0;color:var(--mq-ink)}.mq-portal .mqj .error{background:#fff3f1;border-color:#b95648;color:#793226}.mq-portal .mqj .feedback:empty{display:none}
.mq-portal .mqj nav:not(.mqp-breadcrumb){display:flex;flex-wrap:wrap;gap:8px;margin:0 0 20px}.mq-portal .mqj nav:not(.mqp-breadcrumb) a{display:inline-flex;align-items:center;min-height:44px;border:1px solid var(--mq-line);background:#fff;padding:8px 12px;text-decoration:none;border-radius:7px;font-size:14px}.mqp-table-wrap{width:100%;overflow-x:auto;margin:16px 0}.mq-portal .mqj table{width:100%;border-collapse:collapse;line-height:1.6;font-size:15px}.mq-portal .mqj th,.mq-portal .mqj td{padding:12px;text-align:left;border-bottom:1px solid var(--mq-line);vertical-align:top}.mq-portal .mqj th{background:var(--mq-soft)}
.mqp-auth{display:grid;gap:24px;max-width:1050px;margin:0 auto}.mq-portal .mqj .mqp-auth-form{margin:0;padding:24px}.mq-portal .mqj .mqp-auth-story{display:none;margin:0;background:var(--mq-soft);border:0;padding:32px}.mqp-auth-form h2{font-size:26px!important}.mqp-auth-form #loginform{margin:0}.mqp-auth-form #loginform p{margin:14px 0}.mqp-auth-form input[type=submit]{width:100%;margin-top:4px!important}.mqp-auth-form .login-remember label{font-weight:400}.mqp-auth-story img{width:100%;aspect-ratio:3/2;object-fit:contain;border-radius:12px;margin-top:12px}.mqp-auth-story small{display:block;text-align:right}.mqp-kicker{font-size:13px;color:var(--mq-action);font-weight:650;display:block;margin-bottom:18px}.mqp-benefits{list-style:none;margin:20px 0;padding:0}.mqp-benefits li{display:flex;gap:12px;align-items:center;margin:12px 0}.mqp-benefits svg{width:20px;height:20px;flex-shrink:0}.mqp-google{display:flex;gap:12px;align-items:center;justify-content:center;border:1px solid #a9bdca;min-height:48px;border-radius:8px;text-decoration:none;font-weight:600}.mqp-google span{font-size:22px;color:#4285f4}.mqp-divider{display:flex;align-items:center;gap:12px;color:var(--mq-muted);font-size:13px;margin:20px 0!important}.mqp-divider:before,.mqp-divider:after{content:"";height:1px;flex:1;background:var(--mq-line)}.mq-portal .nsl-container{max-width:100%;padding:10px 0}.mq-portal .nsl-container-buttons{width:100%;max-width:100%}.mq-portal .nsl-container-buttons>a{max-width:100%}
.mq-portal .mqj .mqp-filter,.mq-portal .mqj .mqp-student-picker{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px;background:#fff;border:1px solid var(--mq-line);border-radius:10px;padding:16px;margin-bottom:18px}.mq-portal .mqj .mqp-filter label,.mq-portal .mqj .mqp-student-picker label{flex:1 1 240px;min-width:0;margin:0}.mq-portal .mqj .mqp-filter button,.mq-portal .mqj .mqp-student-picker button{margin:0}.mq-portal .mqj .mqp-schedule{display:grid;gap:16px}.mqp-schedule-icon,.mqp-empty-icon{display:grid;place-items:center;width:54px;height:54px;border-radius:12px;background:var(--mq-soft);color:var(--mq-action)}.mqp-schedule-icon svg,.mqp-empty-icon svg{width:28px;height:28px}.mqp-schedule h2{margin:12px 0 8px}.mqp-schedule-action{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;border-top:1px solid var(--mq-line);padding-top:16px}.mqp-schedule-action strong{font-size:21px}.mqp-schedule-action strong span{display:block;font-size:13px;font-weight:400;color:var(--mq-muted)}.mq-portal .mqj .mqp-empty{padding:32px 22px;text-align:center;max-width:840px;margin:24px auto}.mqp-empty-icon{margin:0 auto 20px;width:64px;height:64px}.mqp-empty p{max-width:480px;margin:12px auto}.mqp-empty h2{margin:0}.mqp-stats{display:grid;grid-template-columns:1fr;gap:12px;margin:20px 0}.mqp-stats a{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px;background:#fff;border:1px solid var(--mq-line);border-radius:10px;text-decoration:none}.mqp-stats span{font-size:14px;color:var(--mq-muted)}.mqp-stats strong{font-size:22px;color:var(--mq-ink)}.mqp-section-title{margin:24px 0 8px}.mqp-registration-steps{display:flex;gap:10px;flex-wrap:wrap;list-style:none;margin:0 0 20px;padding:0;font-size:14px}.mqp-registration-steps li{padding:8px 12px;border-radius:6px;background:var(--mq-soft);color:var(--mq-muted)}.mqp-registration-steps li[aria-current]{color:var(--mq-action);font-weight:650;border-bottom:2px solid var(--mq-action)}
/* Native Tutor components remain intact; use the shared theme for their surrounding pages. */
.mq-portal .tutor-wrap,.mq-portal .tutor-container{font-family:inherit}.mq-portal .tutor-btn{min-height:46px;border-radius:8px}.mq-portal .tutor-dashboard{background:#fff;border:1px solid var(--mq-line);border-radius:10px}.mq-portal .tutor-course-card{border-radius:10px;overflow:hidden}.mq-portal .tutor-course-name{font-size:20px}.mq-portal .tutor-course-thumbnail img{object-fit:contain}.mq-portal .mqtl-practice legend{line-height:1.9;overflow:visible}.mq-portal .tutor-course-topic-title{line-height:1.55}.mq-portal .mqtl-history-empty{background:#fff;border:1px solid var(--mq-line);padding:28px;border-radius:12px}.mq-portal .mqj .certificate{border:6px double var(--mq-brand);text-align:center;padding:32px}.mq-portal .mqj .proof{max-height:480px;object-fit:contain}.mq-portal .mq-fab{z-index:20}
.mq-portal .mqp-program-content{--brand:var(--mq-brand);--action:var(--mq-action);--deep:var(--mq-ink);--muted:var(--mq-muted);--tint:var(--mq-soft)}.mq-portal .mqp-program-content .wrap{padding:0;max-width:1160px}.mq-portal .mqp-program-content .hero{padding:24px 0 40px}.mq-portal .mqp-program-content .hero-grid{gap:36px}.mq-portal .mqp-program-content h1{font-size:clamp(30px,4vw,48px);line-height:1.18}.mq-portal .mqp-program-content .section{padding:36px 0;border-color:var(--mq-line)}.mq-portal .mqp-program-content h2{font-size:clamp(25px,3vw,32px)}.mq-portal .mqp-program-content p{color:var(--mq-muted)}.mq-portal .mqp-program-content .btn{background:var(--mq-action);border-color:var(--mq-action);color:#fff}.mq-portal .mqp-program-content .btn.secondary{background:#fff;color:var(--mq-action)}.mq-portal .mqp-program-content .summary,.mq-portal .mqp-program-content .mq-guide{background:var(--mq-soft);border-color:var(--mq-line)}.mq-portal .mqp-program-content .card{border-color:var(--mq-line)}.mq-portal .mqp-program-content .eyebrow,.mq-portal .mqp-program-content .tag{color:var(--mq-action)}.mq-portal .mqp-program-content .filter button{min-height:46px;border-radius:8px}.mq-portal .mqp-program-content .filter button[aria-pressed=true]{background:var(--mq-action)}.mq-portal .mqp-primary-nav{align-items:center}.mq-portal .mqp-mobile-menu{align-items:stretch;font-size:15px}.mq-portal .mqp-room-menu{border-bottom:1px solid var(--mq-line)}
@media(min-width:700px){.mq-portal #content>.col-full{padding:32px 24px 56px}.mqp-header-inner{padding:12px 24px}.mqp-primary-nav{display:flex}.mqp-auth{grid-template-columns:1fr 1fr}.mq-portal .mqj .mqp-auth-story{display:block}.mq-portal .mqj .mqp-auth-form{padding:32px}.mq-portal .mqj .grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mqp-stats{grid-template-columns:repeat(3,minmax(0,1fr))}.mqp-stats a{align-items:flex-start;flex-direction:column;gap:10px}.mq-portal .mqj .mqp-schedule{grid-template-columns:54px 1fr auto;align-items:start}.mqp-schedule-action{border:0;padding:0;flex-direction:column;align-items:flex-end}.mqp-site-footer{padding:32px max(24px,calc((100vw - 1200px)/2))}}
@media(min-width:1000px){.mqp-workspace.has-sidebar{grid-template-columns:224px minmax(0,1fr);gap:32px}.mqp-sidebar{position:sticky;top:24px}.mqp-room-menu>summary{display:none}.mqp-room-menu{border:0!important;background:transparent!important}.mqp-room-links{padding:0}.mqp-mobile-menu{grid-template-columns:repeat(3,1fr)}}
@media(max-width:699px){.mq-portal .mqp-account-link svg{display:none}.mq-portal .mqp-site-header .mqp-brand-copy>span{display:none}.mqp-brand-copy strong{font-size:16px}.mqp-brand img{width:48px;height:48px}.mqp-header-inner{gap:8px}.mqp-header-actions{gap:6px}.mqp-account-link{padding:8px 10px}.mqp-menu-toggle{font-size:13px}.mqp-menu-toggle svg{display:none}.mq-portal .mqj section,.mq-portal .mqj article{padding:18px}.mq-portal .mqj .mqp-auth-form{padding:20px}.mq-portal .mqj .mqp-filter button,.mq-portal .mqj .mqp-student-picker button{width:100%}.mq-portal .mqj button,.mq-portal .mqj .button{min-height:48px}.mq-portal .tutor-dashboard .tutor-dashboard-content{padding:16px}.mqp-site-footer nav{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.mq-portal .mqj .mqp-breadcrumb span:last-child{overflow-wrap:anywhere}.mq-portal .mqj input[type=file]{font-size:14px!important}.mqp-registration-steps{gap:5px;font-size:12px}.mqp-registration-steps li{padding:7px}}
@media print{.mqp-site-header,.mqp-site-footer,.mqp-sidebar,.no-print,.mq-fab,.mqp-skip{display:none!important}.mq-portal{background:#fff}.mq-portal #content>.col-full{padding:0}.mqp-workspace{display:block!important}.mq-portal .mqj .certificate{break-inside:avoid}.mq-portal .mqj form{display:none}}
