:root{
  --blue:#0B6CF6;
  --blue-strong:#034DD6;
  --blue-deep:#003BB6;
  --blue-soft:#E9F2FF;
  --blue-soft-2:#DBEAFE;
  --cyan:#35C8EA;
  --ink:#111827;
  --ink-2:#1E293B;
  --muted:#64748B;
  --muted-2:#94A3B8;
  --line:#E6EBF3;
  --panel:#FFFFFF;
  --bg:#F4F7FC;
  --green:#069A63;
  --green-bg:#DDF8EC;
  --amber:#C77B00;
  --amber-bg:#FFF3D4;
  --red:#C23B32;
  --red-bg:#FFE9E7;
  --shadow:0 8px 24px rgba(30,64,175,.07);
  --shadow-strong:0 14px 34px rgba(15,23,42,.13);
  --r-sm:12px;
  --r-md:16px;
  --r-lg:22px;
  --safe:env(safe-area-inset-bottom,0px);
}
*{box-sizing:border-box;min-width:0}
html,body{margin:0;min-height:100%;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:#EAF0F7;-webkit-font-smoothing:antialiased}
body{overflow-x:hidden}
button,input,textarea,select{font:inherit}
button{border:0}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
.desktop-backdrop{position:fixed;inset:0;background:radial-gradient(circle at 20% 10%,rgba(11,108,246,.13),transparent 30%),radial-gradient(circle at 88% 86%,rgba(52,200,234,.12),transparent 30%),#EEF3F9;z-index:-1}
.app-shell{width:100%;max-width:390px;min-height:100svh;margin:0 auto;background:var(--bg);position:relative;overflow-x:hidden;box-shadow:0 0 0 1px rgba(15,23,42,.04),0 24px 64px rgba(15,23,42,.12)}
.screen{min-height:100svh;background:var(--bg);padding-bottom:calc(82px + var(--safe));overflow-x:hidden}
.screen.no-nav{padding-bottom:24px;background:#fff}
.page-body{padding:16px 16px 28px}
.page-body.compact{padding-top:10px}
.page-body.flush{padding:0 0 28px}
.topbar{height:64px;background:rgba(255,255,255,.96);backdrop-filter:blur(16px);display:flex;align-items:center;gap:10px;padding:8px 14px;position:sticky;top:0;z-index:30;border-bottom:1px solid var(--line)}
.topbar.blue{background:linear-gradient(135deg,#28A9E9 0%,#0864EF 72%,#0B5DE6 100%);color:#fff;border-bottom:0}
.topbar-title{font-weight:750;font-size:16px;line-height:1.25;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topbar-sub{font-size:11px;font-weight:500;opacity:.82;margin-top:2px}
.icon-btn{width:42px;height:42px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line);cursor:pointer;transition:.16s ease;flex:0 0 auto}
.icon-btn:active{transform:scale(.96)}
.topbar.blue .icon-btn{background:rgba(255,255,255,.16);color:#fff;box-shadow:none}
.bottom-nav{position:fixed;left:50%;bottom:0;transform:translateX(-50%);width:100%;max-width:390px;height:calc(74px + var(--safe));padding:8px 8px var(--safe);background:rgba(255,255,255,.985);border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(5,1fr);z-index:40}
.nav-item{height:56px;background:transparent;color:#94A3B8;border-radius:12px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;font-size:10.5px;font-weight:650;cursor:pointer;white-space:nowrap;padding:0 3px}
.nav-item i{font-size:18px}
.nav-item.active{color:#1D77FF}
.nav-item.active::before{content:"";position:absolute;transform:translateY(-33px);width:42px;height:2px;background:#1D77FF;border-radius:99px}
.brand{display:flex;align-items:center;gap:7px;font-size:16px;font-weight:800;letter-spacing:-.02em}
.brand .brand-mark{font-size:20px}
.btn{min-height:48px;border-radius:12px;padding:0 16px;font-size:14px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;transition:transform .14s ease,filter .14s ease,box-shadow .14s ease;max-width:100%}
.btn:active{transform:translateY(1px) scale(.995)}
.btn-primary{background:#064FD1;color:#fff;box-shadow:0 8px 20px rgba(6,79,209,.22)}
.btn-primary:hover{filter:brightness(1.03)}
.btn-light{background:#EEF2FF;color:#111827}
.btn-white{background:#fff;color:#0753D6;box-shadow:inset 0 0 0 1px rgba(255,255,255,.25)}
.btn-outline{background:#fff;color:#064FD1;box-shadow:inset 0 0 0 1px #C9DBFF}
.btn-soft{background:#E9F2FF;color:#0753D6}
.btn-danger{background:var(--red-bg);color:var(--red)}
.btn-block{width:100%}
.btn-sm{min-height:38px;border-radius:11px;padding:0 12px;font-size:12px}
.btn-icon-round{width:36px;height:36px;border-radius:50%;padding:0}
.section{margin-top:24px}
.section:first-child{margin-top:0}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.section-title{font-size:15px;font-weight:750;letter-spacing:-.01em;margin:0;line-height:1.3}
.section-caption{font-size:11px;color:var(--muted-2)}
.link{background:transparent;color:#0657E7;font-weight:650;font-size:12px;padding:5px 0;cursor:pointer;white-space:nowrap}
.card{background:#fff;border:1px solid #EEF1F6;border-radius:16px;box-shadow:0 3px 12px rgba(32,56,117,.045);padding:14px;overflow:hidden}
.card + .card{margin-top:10px}
.card.blue-card{background:#DCEAFF;border-color:#DCEAFF}
.card.flat{box-shadow:none}
.card.soft{background:#F8FAFD}
.muted{color:var(--muted)}
.small{font-size:11.5px;line-height:1.45}
.text-body{font-size:13px;line-height:1.55;color:#475569}
.row{display:flex;align-items:center;gap:10px}
.row.start{align-items:flex-start}
.row.between{justify-content:space-between}
.grow{flex:1;min-width:0}
.divider{height:1px;background:var(--line);margin:14px 0}
.badge{display:inline-flex;align-items:center;gap:5px;min-height:22px;padding:4px 8px;border-radius:999px;font-size:10.5px;font-weight:650;background:#F2F5FA;color:#475569;white-space:nowrap;max-width:100%}
.badge.blue{background:#E8F0FF;color:#1762D2}
.badge.green{background:#DDF8EC;color:#08764F}
.badge.amber{background:#FFF4D8;color:#A96400}
.badge.red{background:#FFECE9;color:#A4342D}
.chip-row{display:flex;gap:8px;overflow-x:auto;padding:0 16px 8px;margin:0 -16px;scrollbar-width:none}
.chip-row::-webkit-scrollbar{display:none}
.chip{min-height:32px;padding:0 13px;border-radius:999px;background:#fff;border:1px solid #E5E9F0;color:#3D4655;font-size:11.5px;font-weight:550;white-space:nowrap;display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.chip.active{background:#2A6DF3;color:#fff;border-color:#2A6DF3;font-weight:650}
.input-wrap{position:relative}
.input-label{display:block;font-size:12px;font-weight:650;color:#1F2937;margin:0 0 7px}
.input,.textarea,.select{width:100%;border:1px solid transparent;background:#F0F2FF;color:#182032;border-radius:12px;outline:none;transition:.15s ease}
.input{height:49px;padding:0 42px 0 13px}
.textarea{min-height:122px;padding:13px;resize:vertical;line-height:1.55}
.select{height:49px;padding:0 13px}
.input:focus,.textarea:focus,.select:focus{border-color:#A9C6FF;background:#F7F9FF;box-shadow:0 0 0 3px rgba(29,119,255,.08)}
.input-icon{position:absolute;right:13px;bottom:15px;color:#8B93A7}
.helper{font-size:10.5px;color:#8A94A6;margin-top:6px;line-height:1.4}
.form-group + .form-group{margin-top:15px}
.sticky-action{position:sticky;bottom:calc(74px + var(--safe));z-index:24;background:linear-gradient(180deg,rgba(244,247,252,0),rgba(244,247,252,.95) 22%,#F4F7FC 55%);padding:20px 16px 14px;margin:0 -16px -28px}
.no-nav .sticky-action{bottom:0;background:linear-gradient(180deg,rgba(255,255,255,0),#fff 40%)}
.stepper{display:flex;align-items:center;gap:6px;margin-bottom:18px}
.stepper span{height:4px;border-radius:99px;background:#DDE4F0;flex:1}
.stepper span.active{background:#1D77FF}
.notice{border-radius:13px;padding:11px 12px;display:flex;gap:9px;font-size:11.5px;line-height:1.45;background:#EDF5FF;color:#275B9B;border:1px solid #D8E8FF}
.notice.success{background:#E8F8F0;border-color:#CBEFDE;color:#23694E}
.notice.warning{background:#FFF8E6;border-color:#F8E3AB;color:#7D5A11}
.notice.danger{background:#FFF0EE;border-color:#FFD6D1;color:#8F3D35}
.empty{padding:34px 20px;text-align:center}
.empty-icon{width:58px;height:58px;border-radius:20px;background:#EAF2FF;color:#1D77FF;display:flex;align-items:center;justify-content:center;font-size:22px;margin:0 auto 12px}
.empty h3{font-size:15px;margin:0 0 6px}
.empty p{font-size:12px;line-height:1.55;color:var(--muted);margin:0 0 16px}
.toast{position:fixed;left:50%;bottom:92px;transform:translate(-50%,14px);width:min(342px,calc(100% - 32px));background:#111827;color:#fff;border-radius:12px;padding:11px 13px;font-size:12px;line-height:1.45;opacity:0;pointer-events:none;transition:.2s ease;z-index:100;box-shadow:0 12px 28px rgba(15,23,42,.22)}
.toast.show{opacity:1;transform:translate(-50%,0)}
.modal-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.48);display:flex;align-items:flex-end;justify-content:center;z-index:90;padding-top:20px}
.modal-sheet{width:100%;max-width:390px;background:#fff;border-radius:22px 22px 0 0;padding:10px 16px calc(18px + var(--safe));max-height:86svh;overflow:auto}
.modal-grabber{width:42px;height:4px;border-radius:99px;background:#D7DDE8;margin:0 auto 15px}
.modal-title{font-size:18px;font-weight:800;margin:0 0 7px}
.modal-copy{font-size:12.5px;line-height:1.55;color:var(--muted);margin:0 0 16px}
/* Login */
.login-screen{background:#fff;min-height:100svh;overflow:hidden}
.login-hero{height:242px;background:url('../assets/ui/login-bg.svg') center top/cover no-repeat;color:#fff;padding:20px 16px 18px;position:relative}
.login-hero .brand{margin-top:2px}
.login-headline{position:absolute;left:16px;right:16px;bottom:44px;font-size:20px;line-height:1.08;font-weight:800;letter-spacing:-.035em;max-width:300px}
.login-card{position:relative;margin:-31px 20px 0;background:#fff;border-radius:20px 20px 0 0;box-shadow:0 -2px 0 rgba(255,255,255,.6),0 13px 32px rgba(15,23,42,.12);padding:22px 16px 28px;min-height:490px}
.login-title{font-size:20px;font-weight:800;margin:0 0 4px;letter-spacing:-.02em}
.login-sub{font-size:12px;color:#5F6675;margin:0 0 20px}
.login-row{display:flex;align-items:center;justify-content:space-between;margin:16px 0 18px;font-size:11.5px}
.checkbox{display:flex;align-items:center;gap:8px;color:#555F70}
.checkbox input{width:16px;height:16px}
.login-link{color:#004BD6;font-weight:650;cursor:pointer}
.or{display:flex;align-items:center;gap:10px;color:#737C8D;font-size:11px;margin:22px 0}
.or::before,.or::after{content:"";height:1px;background:#E3E7EE;flex:1}
.google-btn{height:47px;border:1px solid #D9DDE5;border-radius:12px;background:#fff;display:flex;align-items:center;justify-content:center;gap:10px;font-size:13px;font-weight:600;cursor:pointer}
.google-btn img{width:18px;height:18px;object-fit:contain}
/* User home */
.home-hero{height:216px;background:url('../assets/ui/home-bg.svg') center top/cover no-repeat;color:#fff;padding:16px 16px 0;position:relative;border-radius:0 0 20px 20px;overflow:hidden}
.home-hero .brand{font-size:14px}
.home-greeting{display:flex;align-items:center;gap:10px;margin-top:28px}
.avatar-sm{width:44px;height:44px;border-radius:50%;object-fit:cover;border:2px solid rgba(255,255,255,.7);flex:0 0 auto}
.greeting-title{font-size:15px;font-weight:750;line-height:1.25}
.greeting-sub{font-size:12.5px;opacity:.9;margin-top:3px}
.notification-button{margin-left:auto;width:35px;height:35px;background:#fff;color:#1F2937;border-radius:50%;display:flex;align-items:center;justify-content:center;position:relative;cursor:pointer}
.notification-dot{position:absolute;right:0;top:0;min-width:16px;height:16px;border-radius:9px;background:#F04438;color:#fff;font-size:8px;font-weight:700;display:flex;align-items:center;justify-content:center;border:2px solid #fff}
.home-search{position:absolute;left:16px;right:16px;bottom:43px;height:37px;border-radius:20px;background:#fff;color:#697386;display:flex;align-items:center;gap:9px;padding:0 15px;font-size:11.5px;cursor:pointer;overflow:hidden}
.home-search span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.launcher-wrap{height:105px;margin:-23px 16px 0;position:relative;z-index:4;background:#fff;border:1px solid #F1F5F9;border-radius:16px;box-shadow:0 2px 8px rgba(15,23,42,.055);overflow:hidden;padding:16px 10px 11px}
.launcher-grid{height:100%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:start;gap:2px}
.launcher-item{height:78px;padding:0 2px;background:transparent;color:#334155;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:9px;cursor:pointer;border-radius:12px;overflow:hidden;transition:background .14s ease,transform .14s ease}
.launcher-item:active{background:#F8FAFC;transform:scale(.985)}
.launcher-icon{width:50px;height:50px;border-radius:16px;background:#DBEAFE;color:#2563EB;display:flex;align-items:center;justify-content:center;font-size:22px;line-height:1;flex:0 0 auto;box-shadow:0 1px 3px rgba(37,99,235,.08)}
.launcher-text{display:block;width:100%;font-size:10.5px;font-weight:550;line-height:1.15;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home-content{padding:16px 16px 26px}
.nearest-card{background:#D9E8FF;border-radius:16px;padding:10px 12px 12px}
.nearest-head{display:flex;align-items:center;gap:8px}
.nearest-head img{width:40px;height:40px;border-radius:50%;object-fit:cover}
.nearest-title{font-size:12px;font-weight:750;line-height:1.35}
.nearest-sub{font-size:10.5px;margin-top:2px}
.schedule-strip{margin-top:8px;background:#0E6BF8;color:#fff;border-radius:12px;height:47px;padding:7px 10px;display:flex;align-items:center;gap:8px}
.schedule-phone{width:31px;height:31px;border-radius:9px;background:#fff;color:#0E6BF8;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.schedule-meta{font-size:9px;line-height:1.3;flex:1}
.schedule-meta strong{display:block;font-size:10.5px;margin-top:2px}
.schedule-status{background:#fff;color:#2866D8;border-radius:999px;padding:4px 8px;font-size:9px;font-weight:650}
.join-btn{margin-top:8px;height:31px;border-radius:11px;background:#fff;color:#3D6FD7;display:flex;align-items:center;justify-content:center;font-size:10.5px;font-weight:600;gap:5px;cursor:pointer}
.promo-asset{width:100%;border-radius:16px;overflow:hidden;cursor:pointer}
.promo-asset img{width:100%;height:auto}
.expert-scroll{display:flex;gap:9px;overflow-x:auto;margin:0 -16px;padding:0 16px 4px;scrollbar-width:none}
.expert-scroll::-webkit-scrollbar{display:none}
.home-expert{width:108px;flex:0 0 108px;background:#fff;border-radius:15px;padding:4px 4px 8px;border:1px solid #EEF1F6;cursor:pointer;overflow:hidden}
.home-expert-photo{height:62px;border-radius:12px;overflow:hidden;background:#DBEAFE}
.home-expert-photo img{width:100%;height:100%;object-fit:cover}
.rating-float{display:inline-flex;align-items:center;gap:2px;margin:-7px 0 0 4px;position:relative;background:#fff;border-radius:999px;padding:2px 5px;font-size:8.5px;color:#2E6DCE;box-shadow:0 2px 6px rgba(15,23,42,.12)}
.home-expert-name{font-size:10.5px;font-weight:750;margin:5px 2px 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home-expert-role{font-size:8.8px;color:#778196;margin:0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.online-pill{font-size:8px;color:#13724F;background:#DDF7E9;border-radius:999px;padding:2px 5px;display:inline-flex;align-items:center;gap:3px;margin:5px 2px 0}
.progress-card{padding:12px;border-radius:16px;background:#fff;border:1px solid #EEF1F6}
.progress-top{display:flex;align-items:center;gap:10px}
.course-icon{width:44px;height:44px;border-radius:11px;background:#E7EFFF;color:#2557C8;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;flex:0 0 auto}
.progress-track{height:7px;border-radius:99px;background:#E5EAF3;overflow:hidden;margin-top:10px}
.progress-bar{height:100%;background:#1169F5;border-radius:99px}
.service-work{padding:12px;border-radius:16px;background:#fff;border:1px solid #EEF1F6}
.stage-track{height:6px;background:#E8EDF4;border-radius:99px;overflow:hidden;margin:10px 0 5px}.stage-track span{display:block;height:100%;width:60%;background:#0BB784;border-radius:99px}
/* Consulting listing */
.consult-head{background:linear-gradient(135deg,#2BA9E8,#0F70F5 70%,#0B5CDB);padding-bottom:12px;color:#fff}
.consult-search{margin:2px 16px 0;height:37px;background:#fff;border-radius:22px;display:flex;align-items:center;gap:9px;padding:0 14px;color:#727C8D;font-size:11.5px;cursor:pointer}
.popular-wrap{padding:14px 16px 3px;background:#F4F7FC;border-bottom:1px solid #E5EAF2}
.tag-flow{display:flex;flex-wrap:wrap;gap:7px;margin-top:8px}
.tag{height:28px;padding:0 10px;border-radius:9px;background:#fff;border:1px solid #E1E6EF;display:flex;align-items:center;gap:5px;font-size:10px;color:#303948;box-shadow:0 2px 5px rgba(15,23,42,.03)}
.consult-card{background:#fff;border-radius:16px;padding:10px;border:1px solid #EEF1F6;margin-top:10px}
.consult-top{display:flex;gap:10px}
.consult-photo{width:74px;height:82px;border-radius:13px;overflow:hidden;background:#DCE9FC;flex:0 0 auto}
.consult-photo img{width:100%;height:100%;object-fit:cover}
.consult-name{font-size:12px;font-weight:800;line-height:1.3;display:flex;align-items:center;gap:4px}
.verified{color:#075ED7;font-size:12px}
.consult-role{font-size:9.5px;color:#344052;margin-top:2px;line-height:1.35}
.consult-rating{font-size:9.5px;margin-top:4px;color:#5E6675}
.consult-rating .star{color:#F7A600}
.consult-mode{font-size:9.5px;color:#344052;margin-top:5px;display:flex;align-items:center;gap:5px}
.consult-availability{margin-left:auto;align-self:flex-start}
.consult-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px}
.consult-price{font-size:17px;font-weight:800;color:#0A4FCC}.consult-price span{font-size:9px;font-weight:500;color:#737C8D;margin-left:2px}
.consult-tags{display:flex;flex-wrap:wrap;gap:5px;margin:7px 0 0}.consult-tags span{font-size:8.5px;color:#3768C6;background:#EDF4FF;border-radius:5px;padding:3px 6px}
.consult-cta{height:40px;border-radius:11px;background:#064FD1;color:#fff;padding:0 15px;font-size:11px;font-weight:650;cursor:pointer;white-space:nowrap}
.advisor-card{margin-top:13px;border-radius:16px;padding:16px;background:linear-gradient(120deg,#243DF1 0%,#2646EC 54%,#2FD1C4 100%);color:#fff;display:flex;align-items:center;gap:12px}
.advisor-icon{width:42px;height:42px;border-radius:11px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);display:flex;align-items:center;justify-content:center;color:#FFD34F;font-size:18px;flex:0 0 auto}
.advisor-title{font-size:12px;font-weight:750;line-height:1.3}.advisor-copy{font-size:10px;line-height:1.45;margin-top:2px;opacity:.92}.advisor-arrow{width:34px;height:34px;border-radius:50%;background:#fff;color:#1463D8;display:flex;align-items:center;justify-content:center;margin-left:auto;flex:0 0 auto}
/* Expert detail */
.profile-cover{height:248px;background:linear-gradient(135deg,#23A8E7,#0D69EF);position:relative;color:#fff;overflow:hidden}
.profile-cover::before{content:"";position:absolute;inset:0;background:url('../assets/ui/hero.svg') center/cover no-repeat;opacity:.9}
.profile-actions{position:absolute;top:14px;left:14px;right:14px;display:flex;justify-content:space-between;z-index:2}
.profile-person{position:absolute;left:18px;right:18px;bottom:16px;z-index:2;display:flex;align-items:flex-end;gap:13px}
.profile-photo{width:96px;height:120px;border-radius:18px;overflow:hidden;border:3px solid #fff;background:#fff;box-shadow:0 10px 24px rgba(0,39,103,.24);flex:0 0 auto}.profile-photo img{width:100%;height:100%;object-fit:cover}
.profile-name{font-size:18px;font-weight:800;line-height:1.25}.profile-role{font-size:11px;line-height:1.4;margin-top:4px;opacity:.9}.profile-rating{font-size:10px;margin-top:7px;display:flex;align-items:center;gap:6px}
.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.stat-card{background:#fff;border:1px solid #EEF1F6;border-radius:13px;padding:11px;text-align:center}.stat-value{font-size:14px;font-weight:800;color:#0B4ECB}.stat-label{font-size:9.5px;color:#778196;margin-top:3px}
.service-option{display:flex;align-items:center;gap:10px;padding:12px;border-radius:14px;border:1px solid #E8EDF4;background:#fff;cursor:pointer}.service-option-icon{width:42px;height:42px;border-radius:13px;background:#E6F0FF;color:#1768E7;display:flex;align-items:center;justify-content:center;flex:0 0 auto}.service-option-title{font-size:12px;font-weight:750}.service-option-sub{font-size:10px;color:#758095;margin-top:2px;line-height:1.4}.service-option-price{font-size:12px;font-weight:750;color:#0A4FCC;white-space:nowrap}
/* Booking */
.page-title{font-size:20px;font-weight:800;letter-spacing:-.025em;margin:0 0 5px}.page-subtitle{font-size:12px;line-height:1.5;color:#64748B;margin:0}
.package-card{position:relative;border:1px solid #E5EAF3;border-radius:16px;background:#fff;padding:14px;cursor:pointer}.package-card.selected{border-color:#2A74F3;box-shadow:0 0 0 2px rgba(42,116,243,.09)}.package-card + .package-card{margin-top:10px}.recommended-ribbon{position:absolute;right:10px;top:10px;background:#FFF2C9;color:#9A6500;border-radius:999px;padding:4px 7px;font-size:9px;font-weight:700}.package-name{font-size:13px;font-weight:800}.package-desc{font-size:10.5px;line-height:1.5;color:#6F7A8D;margin-top:4px;padding-right:55px}.package-meta{display:flex;align-items:center;justify-content:space-between;margin-top:11px}.package-duration{font-size:10.5px;color:#5C6676}.package-price{font-size:16px;font-weight:800;color:#064FD1}
.calendar{background:#fff;border-radius:16px;border:1px solid #E8EDF4;padding:13px}.cal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;font-size:12px;font-weight:750}.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;text-align:center}.dow{font-size:9px;color:#94A3B8;padding:4px 0}.day{height:34px;border-radius:10px;background:#F7F9FC;display:flex;align-items:center;justify-content:center;font-size:10px;color:#334155;cursor:pointer}.day.muted-day{color:#C2C8D2;background:transparent}.day.available{background:#EEF5FF;color:#1F64D3}.day.selected{background:#176DF2;color:#fff;font-weight:700}
.slot-group{margin-top:12px}.slot-label{font-size:11px;font-weight:700;margin-bottom:8px}.slot-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.slot{height:38px;border-radius:11px;background:#fff;border:1px solid #DDE5F1;color:#324056;font-size:11px;cursor:pointer}.slot.selected{background:#1168F3;color:#fff;border-color:#1168F3;font-weight:700}.slot.unavailable{background:#F3F5F8;color:#BAC1CC;cursor:not-allowed;text-decoration:line-through}
.summary-list{display:flex;flex-direction:column;gap:11px}.summary-row{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.summary-key{font-size:10.5px;color:#7A8495;flex:0 0 90px}.summary-val{font-size:11.5px;font-weight:600;text-align:right;line-height:1.45;color:#263245}.price-row{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#64748B;margin-top:8px}.price-row.total{padding-top:10px;border-top:1px solid #E6EBF3;font-size:13px;font-weight:800;color:#111827}.price-row.total span:last-child{font-size:18px;color:#064FD1}
.payment-method{display:flex;align-items:center;gap:11px;padding:12px;border:1px solid #E3E9F2;border-radius:14px;background:#fff;cursor:pointer}.payment-icon{width:40px;height:40px;border-radius:12px;background:#EAF2FF;color:#1264E8;display:flex;align-items:center;justify-content:center;flex:0 0 auto}.payment-title{font-size:12px;font-weight:750}.payment-sub{font-size:9.5px;color:#7A8495;margin-top:3px}
.success-hero{padding:38px 22px 20px;text-align:center}.success-icon{width:68px;height:68px;border-radius:50%;background:#DDF8EC;color:#0A9B64;display:flex;align-items:center;justify-content:center;font-size:28px;margin:0 auto 14px;box-shadow:0 7px 18px rgba(10,155,100,.12)}.success-title{font-size:20px;font-weight:800;margin:0 0 6px}.success-copy{font-size:12px;line-height:1.55;color:#6F798B;margin:0}
/* Engagement/session */
.engagement-hero{background:linear-gradient(135deg,#115EEB,#1E7AF6);color:#fff;border-radius:0 0 22px 22px;padding:18px 16px 20px}.engagement-badge{display:inline-flex;padding:4px 8px;border-radius:999px;background:rgba(255,255,255,.15);font-size:9px;font-weight:650}.engagement-title{font-size:18px;font-weight:800;line-height:1.25;margin:10px 0 4px}.engagement-expert{font-size:11px;opacity:.9}.engagement-progress{display:flex;align-items:center;gap:10px;margin-top:14px}.engagement-progress-track{height:6px;border-radius:99px;background:rgba(255,255,255,.2);flex:1;overflow:hidden}.engagement-progress-track span{display:block;height:100%;background:#fff;border-radius:99px}.engagement-progress-label{font-size:9.5px;white-space:nowrap}
.tabbar{display:flex;gap:4px;background:#fff;padding:6px;border-radius:13px;border:1px solid #E8EDF4;overflow-x:auto;scrollbar-width:none}.tabbar::-webkit-scrollbar{display:none}.tabbtn{height:34px;padding:0 11px;border-radius:9px;background:transparent;color:#6D778A;font-size:10px;font-weight:600;white-space:nowrap;cursor:pointer}.tabbtn.active{background:#EAF2FF;color:#1264E8;font-weight:700}
.timeline{position:relative;padding-left:18px}.timeline::before{content:"";position:absolute;left:4px;top:5px;bottom:5px;width:1px;background:#DCE3ED}.timeline-item{position:relative;padding:0 0 15px}.timeline-item::before{content:"";position:absolute;left:-18px;top:3px;width:9px;height:9px;border-radius:50%;background:#CDD5E1;border:2px solid #fff;box-shadow:0 0 0 1px #CDD5E1}.timeline-item.done::before{background:#1D77FF;box-shadow:0 0 0 1px #1D77FF}.timeline-title{font-size:11px;font-weight:700}.timeline-sub{font-size:9.5px;color:#7A8495;margin-top:2px}
.waiting-panel{margin:18px 16px 0;background:#fff;border-radius:18px;padding:18px;border:1px solid #E8EDF4}.camera-preview{height:198px;border-radius:16px;background:linear-gradient(140deg,#DDE7F4,#BFD3EB);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}.camera-preview img{width:100%;height:100%;object-fit:cover;filter:saturate(.9)}.camera-label{position:absolute;left:10px;bottom:10px;background:rgba(15,23,42,.68);color:#fff;border-radius:8px;padding:5px 7px;font-size:9px}.control-row{display:flex;justify-content:center;gap:12px;margin:16px 0}.control{width:46px;height:46px;border-radius:50%;background:#EEF2F7;color:#334155;display:flex;align-items:center;justify-content:center;font-size:16px;cursor:pointer}.control.off{background:#FDECEA;color:#C03931}.live-wrap{min-height:100svh;background:#0B1220;color:#fff;padding-bottom:20px}.live-top{height:58px;display:flex;align-items:center;padding:0 14px;gap:10px}.live-time{margin-left:auto;font-size:11px;color:#B9C3D4}.live-stage{padding:8px 12px}.remote-video{height:430px;border-radius:18px;overflow:hidden;background:#15223A;position:relative}.remote-video img{width:100%;height:100%;object-fit:cover}.remote-name{position:absolute;left:12px;bottom:12px;background:rgba(15,23,42,.72);padding:6px 8px;border-radius:9px;font-size:10px}.self-video{position:absolute;right:12px;top:12px;width:93px;height:126px;border-radius:14px;overflow:hidden;border:2px solid rgba(255,255,255,.85);box-shadow:0 8px 18px rgba(0,0,0,.24)}.self-video img{width:100%;height:100%;object-fit:cover}.live-controls{display:flex;justify-content:center;gap:13px;margin-top:18px}.live-control{width:50px;height:50px;border-radius:50%;background:#1E293B;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer}.live-control.leave{background:#E54A43}
/* Messages */
.conversation-card{display:flex;gap:10px;padding:12px 0;border-bottom:1px solid #EDF1F6;cursor:pointer}.conversation-card:last-child{border-bottom:0}.conversation-avatar{width:46px;height:46px;border-radius:14px;object-fit:cover;flex:0 0 auto}.conversation-name{font-size:11.5px;font-weight:750}.conversation-context{font-size:9.5px;color:#3471D8;margin-top:2px}.conversation-preview{font-size:10.5px;color:#6D7789;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.conversation-time{font-size:9px;color:#9AA3B1;white-space:nowrap}.chat-screen{min-height:100svh;background:#F5F7FC;padding-bottom:76px}.chat-context{padding:9px 14px;background:#EDF4FF;border-bottom:1px solid #DDE9FB;font-size:10px;color:#3F6EB8;display:flex;align-items:center;justify-content:space-between;gap:10px}.chat-body{padding:14px;display:flex;flex-direction:column;gap:8px}.bubble{max-width:78%;border-radius:14px;padding:9px 11px;font-size:11px;line-height:1.5}.bubble.them{background:#fff;border:1px solid #E7ECF3;align-self:flex-start;border-bottom-left-radius:5px}.bubble.me{background:#1068F2;color:#fff;align-self:flex-end;border-bottom-right-radius:5px}.bubble-time{font-size:8px;opacity:.65;margin-top:3px}.composer{position:fixed;left:50%;bottom:0;transform:translateX(-50%);width:100%;max-width:390px;padding:9px 10px calc(9px + var(--safe));background:#fff;border-top:1px solid #E4E9F1;display:flex;gap:8px;align-items:flex-end;z-index:45}.composer input{height:43px;border-radius:13px;background:#F2F5F9;border:0;padding:0 12px;flex:1;outline:none;font-size:11.5px}.send-btn{width:43px;height:43px;border-radius:13px;background:#075BD9;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer}
/* Profile/action rows */
.profile-card-main{background:linear-gradient(135deg,#1D78F6,#0B57D4);color:#fff;border-radius:18px;padding:16px;display:flex;align-items:center;gap:12px}.profile-card-main img{width:58px;height:58px;border-radius:16px;object-fit:cover;border:2px solid rgba(255,255,255,.65)}.profile-main-name{font-size:15px;font-weight:800}.profile-main-sub{font-size:10px;opacity:.9;margin-top:3px}.action-list{background:#fff;border-radius:16px;border:1px solid #EBEFF5;overflow:hidden}.action-row{width:100%;min-height:58px;background:#fff;display:flex;align-items:center;gap:11px;padding:10px 12px;border-bottom:1px solid #EEF2F6;cursor:pointer;text-align:left;color:#1F2937}.action-row:last-child{border-bottom:0}.row-icon{width:36px;height:36px;border-radius:11px;background:#EAF2FF;color:#1768E7;display:flex;align-items:center;justify-content:center;flex:0 0 auto}.row-title{display:block;font-size:11.5px;font-weight:700}.row-sub{display:block;font-size:9.5px;color:#7A8495;margin-top:2px;line-height:1.35}.chev{color:#A3ACBA;margin-left:auto}
/* Expert senior workspace */
.expert-screen{font-size:16px}.expert-screen .section-title{font-size:17px}.expert-screen .card{border-radius:17px;padding:15px}.expert-header{background:linear-gradient(135deg,#27A6E7,#0A65E8);color:#fff;padding:17px 16px 22px;border-radius:0 0 20px 20px}.expert-header-top{display:flex;align-items:center;gap:10px}.expert-header img{width:48px;height:48px;border-radius:15px;object-fit:cover;border:2px solid rgba(255,255,255,.55)}.expert-greet{font-size:16px;font-weight:800}.expert-date{font-size:12px;opacity:.86;margin-top:3px}.availability-toggle{margin-left:auto;background:rgba(255,255,255,.17);border:1px solid rgba(255,255,255,.25);border-radius:999px;padding:8px 10px;font-size:11px;font-weight:700;display:flex;align-items:center;gap:6px}.expert-next{margin-top:17px;background:#fff;color:#1F2937;border-radius:17px;padding:14px;box-shadow:0 10px 24px rgba(0,53,133,.15)}.expert-next-kicker{font-size:11px;color:#697386;font-weight:700}.expert-next-time{font-size:24px;color:#064FD1;font-weight:800;margin-top:7px}.expert-next-title{font-size:14px;font-weight:750;margin-top:3px}.expert-next-user{font-size:11.5px;color:#687386;margin-top:3px}.expert-action-card{display:flex;align-items:center;gap:12px;min-height:64px}.expert-action-icon{width:44px;height:44px;border-radius:13px;background:#EAF2FF;color:#1768E7;display:flex;align-items:center;justify-content:center;flex:0 0 auto}.expert-action-count{font-size:18px;font-weight:800;color:#064FD1}.expert-action-label{font-size:12px;font-weight:700}.earnings-panel{background:#fff;border-radius:18px;border:1px solid #E8EDF4;padding:16px}.earnings-label{font-size:12px;color:#697386}.earnings-value{font-size:28px;font-weight:800;color:#0A4FCC;letter-spacing:-.03em;margin-top:5px}.earnings-sub{font-size:11px;color:#7A8495;margin-top:2px}.expert-list-row{display:flex;align-items:center;gap:12px;padding:12px;background:#fff;border:1px solid #E8EDF4;border-radius:15px;margin-top:9px;cursor:pointer}.expert-list-row img{width:50px;height:50px;border-radius:14px;object-fit:cover}.expert-list-title{font-size:13px;font-weight:750}.expert-list-sub{font-size:11px;color:#6E788B;margin-top:3px;line-height:1.45}.expert-primary-btn{min-height:52px;border-radius:14px;font-size:15px;font-weight:750}.request-summary{display:grid;grid-template-columns:1fr;gap:10px}.info-box{padding:13px;border-radius:14px;background:#F7F9FC;border:1px solid #E9EDF3}.info-label{font-size:10.5px;color:#7A8495}.info-value{font-size:13px;font-weight:650;line-height:1.45;margin-top:4px;color:#263247}.earnings-stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.earn-stat{background:#fff;border:1px solid #E9EDF4;border-radius:15px;padding:13px}.earn-stat-label{font-size:10px;color:#7A8495}.earn-stat-value{font-size:16px;font-weight:800;margin-top:5px;color:#172034}.withdraw-hero{background:linear-gradient(135deg,#0757DA,#1A79F7);color:#fff;border-radius:18px;padding:18px}.withdraw-amount{font-size:28px;font-weight:800;letter-spacing:-.03em;margin-top:5px}
/* Responsive / safety */
@media(min-width:700px){.app-shell{margin-top:18px;margin-bottom:18px;min-height:calc(100svh - 36px);border-radius:22px}.bottom-nav,.composer{bottom:18px;border-radius:0 0 22px 22px}.screen{min-height:calc(100svh - 36px)}.login-screen{min-height:calc(100svh - 36px)}}
@media(max-width:350px){.page-body,.home-content{padding-left:12px;padding-right:12px}.launcher-wrap{margin-left:12px;margin-right:12px}.home-expert{width:104px;flex-basis:104px}.btn{padding-left:12px;padding-right:12px}.consult-photo{width:68px}.consult-cta{padding:0 11px}}

/* =========================================================
   Phase 02 — Moderator Workspace
   ========================================================= */
.moderator-screen{background:#F5F8FC;color:#162033}
.moderator-screen .topbar{background:rgba(255,255,255,.98)}
.moderator-screen .section-title{font-size:15px}
.moderator-hero{height:188px;background:url('../assets/ui/home-bg.svg') center top/cover no-repeat;color:#fff;padding:15px 16px 24px;border-radius:0 0 22px 22px;overflow:hidden;position:relative}
.moderator-hero::after{content:"";position:absolute;right:-50px;bottom:-76px;width:188px;height:188px;border-radius:50%;background:rgba(255,255,255,.07)}
.moderator-brand{display:flex;align-items:center;justify-content:space-between;gap:10px;position:relative;z-index:2}
.moderator-brand .brand{font-size:13px}
.moderator-role-pill{height:27px;padding:0 10px;border-radius:999px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.26);display:inline-flex;align-items:center;font-size:10px;font-weight:700;letter-spacing:.01em}
.moderator-welcome{display:flex;align-items:center;gap:10px;margin-top:43px;position:relative;z-index:2}
.moderator-greet{font-size:18px;line-height:1.2;font-weight:800;letter-spacing:-.02em}
.moderator-shift{font-size:11px;opacity:.88;margin-top:5px}
.moderator-notif{background:#fff;color:#18314E;box-shadow:0 6px 18px rgba(0,55,135,.15)}
.moderator-content{padding:0 16px 28px;margin-top:-19px;position:relative;z-index:3}
.moderator-next-card{background:#fff;border:1px solid #E8EEF6;border-radius:18px;padding:15px;box-shadow:0 10px 26px rgba(16,55,105,.09);overflow:hidden}
.moderator-next-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.eyebrow{display:block;font-size:9.5px;font-weight:800;letter-spacing:.09em;color:#6D7D92}
.moderator-next-time{font-size:29px;line-height:1;font-weight:850;letter-spacing:-.04em;color:#085AD8;margin-top:6px}
.moderator-next-title{font-size:14px;line-height:1.4;font-weight:800;margin-top:12px;color:#1B2738}
.moderator-next-meta{display:flex;flex-wrap:wrap;gap:7px 13px;margin-top:8px;color:#607086;font-size:10.5px}
.moderator-next-meta span{display:inline-flex;align-items:center;gap:5px;min-width:0}
.moderator-date-row{margin-top:13px;padding:10px 11px;border-radius:13px;background:#F4F8FF;display:flex;align-items:center;gap:10px;color:#25344A}
.moderator-calendar-icon{width:38px;height:38px;border-radius:11px;background:#DDEBFF;color:#1165E9;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.moderator-date-row strong{display:block;font-size:11.5px;margin-top:2px}
.moderator-primary{min-height:48px;border-radius:13px;font-size:13px;font-weight:750}
.moderator-next-card .moderator-primary{margin-top:13px}
.moderator-kpis{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:11px}
.moderator-kpi{min-height:98px;background:#fff;border:1px solid #E9EEF5;border-radius:16px;padding:12px;display:grid;grid-template-columns:34px 1fr;grid-template-rows:auto auto;column-gap:9px;align-items:center;overflow:hidden}
.moderator-kpi-icon{grid-row:1/3;width:34px;height:34px;border-radius:10px;background:#E8F1FF;color:#1364E3;display:flex;align-items:center;justify-content:center}
.moderator-kpi-icon.warning{background:#FFF2D5;color:#B56B00}
.moderator-kpi strong{font-size:22px;line-height:1;font-weight:800;letter-spacing:-.03em;color:#162033}
.moderator-kpi small{font-size:9.5px;line-height:1.3;color:#7A8798}
.moderator-readiness-card{display:flex;align-items:center;gap:13px;padding:13px;background:#fff;border:1px solid #E9EEF5;border-radius:16px}
.readiness-ring{width:54px;height:54px;border-radius:50%;border:6px solid #DDEAFF;background:#fff;display:flex;align-items:baseline;justify-content:center;gap:1px;padding-top:10px;color:#1261D8;flex:0 0 auto}
.readiness-ring strong{font-size:16px;line-height:1;font-weight:850}
.readiness-ring span{font-size:9px;font-weight:700}
.moderator-card-title{font-size:11.5px}
.mini-progress{height:6px;border-radius:99px;background:#E8EDF4;overflow:hidden;margin-top:9px}
.mini-progress span{display:block;height:100%;border-radius:99px;background:#1670F2;transition:width .2s ease}
.moderator-clear{display:flex;align-items:center;gap:11px;padding:13px;border:1px solid #DCEFE7;background:#F3FBF7;border-radius:15px;color:#245C47}
.moderator-clear>span{width:38px;height:38px;border-radius:12px;background:#DDF6E9;display:flex;align-items:center;justify-content:center;color:#098356;flex:0 0 auto}
.moderator-clear strong{font-size:11.5px}
.moderator-guide{display:grid;grid-template-columns:1fr 14px 1fr 14px 1fr;align-items:center;background:#fff;border:1px solid #E9EEF5;border-radius:16px;padding:13px 10px;gap:4px;text-align:center}
.moderator-guide>div{min-width:0}
.moderator-guide>div span{width:27px;height:27px;border-radius:9px;margin:0 auto;background:#E9F2FF;color:#1568E8;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:800}
.moderator-guide p{font-size:8.8px;line-height:1.25;color:#627087;margin:6px 0 0}
.moderator-guide>i{font-size:8px;color:#B2BDCB}
.moderator-empty-card{text-align:center;padding:23px 17px}
.moderator-empty-card h3{font-size:13px;margin:9px 0 5px}.moderator-empty-card p{font-size:10.5px;color:#738094;line-height:1.5;margin:0}
.moderator-page{padding-top:14px}
.moderator-page-intro{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin:3px 0 15px}
.moderator-page-intro h1{font-size:19px;margin:0;font-weight:820;letter-spacing:-.025em}.moderator-page-intro p{font-size:11px;line-height:1.45;color:#788598;margin:4px 0 0}
.moderator-status-banner{background:linear-gradient(135deg,#E7F1FF,#F6FAFF);border:1px solid #D8E6F8;border-radius:17px;padding:14px;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;overflow:hidden}
.moderator-status-banner h1{font-size:15px;line-height:1.35;margin:6px 0 0;max-width:225px}
.moderator-person-row{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #E9EEF5;border-radius:15px;padding:10px;margin-top:8px;overflow:hidden}
.moderator-person-row img{width:45px;height:45px;border-radius:13px;object-fit:cover;flex:0 0 auto}.moderator-person-row strong{display:block;font-size:11.5px}.moderator-person-row span:not(.badge){display:block;font-size:9.5px;color:#7B8798;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.moderator-session-card{width:100%;display:flex;align-items:center;gap:11px;background:#fff;border:1px solid #E8EEF5;border-radius:16px;padding:12px;text-align:left;color:#172236;cursor:pointer;box-shadow:0 3px 10px rgba(31,59,93,.035);overflow:hidden}
.session-time-block{width:54px;min-height:62px;border-radius:13px;background:#E8F1FF;color:#0759D4;display:flex;flex-direction:column;align-items:center;justify-content:center;flex:0 0 auto}.session-time-block strong{font-size:15px}.session-time-block span{font-size:8.5px;margin-top:3px}
.moderator-session-card>.grow strong{font-size:11.5px;line-height:1.35}.moderator-session-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:7px;color:#7A8697;font-size:9px}.moderator-session-meta span{display:inline-flex;align-items:center;gap:4px}
.moderator-session-header{background:linear-gradient(145deg,#E9F3FF 0%,#F9FBFF 100%);border-bottom:1px solid #DDE7F2;padding:14px 16px 15px}.moderator-session-header h1{font-size:16px;line-height:1.35;margin:10px 0 4px}.moderator-session-header p{font-size:10.5px;color:#718095;margin:0}.moderator-session-clock{display:flex;align-items:center;gap:6px;margin-top:11px;font-size:10px;font-weight:650;color:#315B90}
.moderator-tabs{display:flex;gap:4px;overflow-x:auto;padding:8px 12px;background:#fff;border-bottom:1px solid #E9EEF5;scrollbar-width:none}.moderator-tabs::-webkit-scrollbar{display:none}.moderator-tabs button{height:34px;padding:0 11px;border-radius:10px;background:transparent;color:#758296;font-size:10px;font-weight:650;white-space:nowrap;cursor:pointer}.moderator-tabs button.active{background:#E8F1FF;color:#0E62DF}
.moderator-tab-title{margin-bottom:12px}.moderator-tab-title h2{font-size:15px;margin:0;font-weight:800}.moderator-tab-title p{font-size:10.5px;line-height:1.5;color:#7A8798;margin:4px 0 0}
.moderator-overview-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.moderator-overview-item{min-height:80px;background:#fff;border:1px solid #E8EEF5;border-radius:15px;padding:10px;display:flex;align-items:center;gap:9px;overflow:hidden}.moderator-overview-item>span{width:34px;height:34px;border-radius:10px;background:#E8F1FF;color:#1264E4;display:flex;align-items:center;justify-content:center;flex:0 0 auto}.moderator-overview-item small{display:block;color:#8490A1;font-size:8.8px}.moderator-overview-item strong{display:block;color:#202C3D;font-size:10.5px;line-height:1.3;margin-top:3px}
.moderator-checklist{display:flex;flex-direction:column;gap:8px}.moderator-check{width:100%;min-height:68px;display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #E6ECF4;border-radius:15px;padding:10px;text-align:left;color:#1F2A3B;cursor:pointer}.moderator-check.done{border-color:#CFE8DD;background:#F7FCF9}.check-icon{width:38px;height:38px;border-radius:11px;background:#EBF3FF;color:#1465E4;display:flex;align-items:center;justify-content:center;flex:0 0 auto}.moderator-check.done .check-icon{background:#E1F5EA;color:#078357}.moderator-check strong{display:block;font-size:11.5px}.moderator-check small{display:block;font-size:9px;color:#7F8B9C;line-height:1.4;margin-top:3px}.check-circle{width:24px;height:24px;border-radius:50%;border:1.5px solid #C8D2DF;color:#fff;display:flex;align-items:center;justify-content:center;font-size:9px;flex:0 0 auto}.moderator-check.done .check-circle{background:#0B9A63;border-color:#0B9A63}
.attendance-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-bottom:11px}.attendance-summary>div{background:#fff;border:1px solid #E8EEF5;border-radius:14px;padding:10px;text-align:center}.attendance-summary strong{display:block;font-size:18px}.attendance-summary span{display:block;font-size:8.5px;color:#7D899A;margin-top:2px}.attendance-list{display:flex;flex-direction:column;gap:8px}.attendance-card{display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:9px;align-items:center;background:#fff;border:1px solid #E8EEF5;border-radius:15px;padding:10px;overflow:hidden}.attendance-avatar{width:38px;height:38px;border-radius:11px;background:#E8F1FF;color:#1265E6;display:flex;align-items:center;justify-content:center}.attendance-card strong{display:block;font-size:10.8px}.attendance-card .grow>span{display:block;font-size:8.5px;color:#8691A1;margin-top:3px}.attendance-actions{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding-top:7px;border-top:1px solid #EDF1F6}.attendance-actions button{height:31px;border-radius:9px;background:#F3F6FA;color:#64748B;cursor:pointer}.attendance-actions button:first-child{background:#E6F7EE;color:#087C54}.attendance-actions button:nth-child(2){background:#FFF4D9;color:#A86700}.attendance-actions button:last-child{background:#FDEBE9;color:#B33B32}
.control-room{background:#132033;color:#fff;border-radius:18px;padding:15px;overflow:hidden}.control-room.live{background:#0C1728}.control-room-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.control-room .eyebrow{color:#91A2B9}.control-room h2{font-size:15px;margin:5px 0 0}.live-dot{width:10px;height:10px;border-radius:50%;background:#526176;margin-top:2px;box-shadow:0 0 0 5px rgba(82,97,118,.15)}.live-dot.on{background:#15C77A;box-shadow:0 0 0 5px rgba(21,199,122,.13)}.control-time{font-size:31px;font-weight:800;letter-spacing:.04em;text-align:center;margin:22px 0;color:#F8FBFF}.control-status-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.control-status-grid>div{background:#1B2B41;border:1px solid rgba(255,255,255,.06);border-radius:13px;padding:10px}.control-status-grid span{display:flex;width:27px;height:27px;border-radius:8px;background:rgba(255,255,255,.08);align-items:center;justify-content:center;color:#A9CAFF}.control-status-grid small{display:block;font-size:8px;color:#92A2B6;margin-top:8px}.control-status-grid strong{display:block;font-size:11px;margin-top:2px}.control-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.control-actions .btn{min-width:0;padding:0 9px;font-size:10.5px}
.moderator-issue-card{width:100%;min-height:62px;background:#fff;border:1px solid #E8EEF5;border-radius:15px;padding:10px;display:flex;align-items:center;gap:9px;text-align:left;color:#1F2A3B;cursor:pointer;margin-top:8px;overflow:hidden}.issue-severity{width:5px;height:38px;border-radius:99px;background:#AFC0D3;flex:0 0 auto}.issue-severity.medium{background:#ECA71A}.issue-severity.high{background:#E36C3E}.issue-severity.critical{background:#C93F37}.issue-severity.low{background:#4A91E8}.moderator-issue-card .row-title{font-size:10.8px}.moderator-issue-card .row-sub{max-width:205px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.issue-detail-hero{background:#FFF6F3;border:1px solid #F7DBD5;border-radius:17px;padding:14px}.issue-detail-hero h1{font-size:16px;margin:12px 0 5px}.issue-detail-hero p{font-size:10.5px;line-height:1.5;color:#755850;margin:0}.issue-timeline{padding-left:18px;position:relative}.issue-timeline::before{content:"";position:absolute;left:5px;top:4px;bottom:4px;width:1px;background:#DCE4EE}.issue-timeline>div{position:relative;display:flex;gap:10px;padding-bottom:14px}.issue-timeline>div>span{position:absolute;left:-18px;top:2px;width:10px;height:10px;border-radius:50%;background:#1569E8;border:2px solid #fff;box-shadow:0 0 0 1px #1569E8}.issue-timeline strong{display:block;font-size:10.5px}.issue-timeline small{display:block;font-size:8.8px;color:#8591A1;margin-top:3px}
.moderator-notification-row{border:1px solid #E8EEF5;border-radius:14px;margin-bottom:8px}.moderator-profile-card{background:linear-gradient(135deg,#0C62E8,#2D99E5)}.moderator-profile-avatar{width:58px;height:58px;border-radius:16px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.26);display:flex;align-items:center;justify-content:center;font-size:21px;flex:0 0 auto}.moderator-shift-card strong{font-size:13px}.moderator-notes{min-height:160px;background:#fff;border-color:#E1E8F1}

@media(max-width:350px){
  .moderator-content,.moderator-page{padding-left:12px;padding-right:12px}
  .moderator-next-title{font-size:13px}
  .moderator-kpi{padding:10px}
  .moderator-session-card{padding:10px}
  .moderator-tabs{padding-left:8px;padding-right:8px}
}

/* =========================================================
   Full Mobile v1 — Extended User / Expert Workspaces
   ========================================================= */
.compact-search{position:static!important;height:46px;border:1px solid #E4E9F1;background:#fff;color:#64748B}
.service-intro{display:flex;align-items:flex-start;gap:13px;background:linear-gradient(135deg,#E9F4FF,#F8FBFF);border:1px solid #DCEBFF;border-radius:18px;padding:16px;overflow:hidden}
.service-intro-icon{width:48px;height:48px;flex:0 0 auto;border-radius:15px;background:#0B6CF6;color:#fff;display:flex;align-items:center;justify-content:center;font-size:19px;box-shadow:0 8px 18px rgba(11,108,246,.18)}
.service-intro h1{font-size:19px;margin:0 0 5px;letter-spacing:-.025em}.service-intro p{font-size:11.5px;line-height:1.5;color:#5E6B7C;margin:0}
.program-stack{display:grid;gap:11px}.program-card{width:100%;padding:0;background:#fff;border:1px solid #E9EDF4;border-radius:18px;overflow:hidden;text-align:left;box-shadow:0 4px 15px rgba(31,58,111,.05);cursor:pointer;color:#162033}
.program-cover{height:132px;position:relative;overflow:hidden;background:#DFE9F6}.program-cover img{width:100%;height:100%;object-fit:cover;object-position:center 25%}.program-cover::after{content:"";position:absolute;inset:auto 0 0;height:68px;background:linear-gradient(transparent,rgba(8,26,56,.48))}.program-type{position:absolute;left:11px;bottom:10px;z-index:2;background:rgba(255,255,255,.94);color:#135DD3;border-radius:999px;padding:6px 9px;font-size:9.5px;font-weight:750;display:inline-flex;gap:5px;align-items:center}
.program-card-body{padding:13px}.program-title{font-size:13.5px;font-weight:800;line-height:1.4}.program-expert{font-size:10.5px;color:#687488;margin-top:3px}.program-meta{display:flex;gap:10px;flex-wrap:wrap;margin-top:9px;font-size:9.5px;color:#697386}.program-meta i{color:#2B72E8}.program-price{font-size:14px;font-weight:800;color:#064FD1}
.program-detail-hero{height:232px;position:relative;background:#DDE8F5;overflow:hidden}.program-detail-hero img{width:100%;height:100%;object-fit:cover;object-position:center 18%}.program-detail-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,23,48,.05),rgba(7,23,48,.78))}.program-detail-overlay{position:absolute;z-index:2;left:16px;right:16px;bottom:17px;color:#fff}.program-detail-overlay h1{font-size:21px;line-height:1.16;margin:9px 0 5px;letter-spacing:-.03em}.program-detail-overlay p{font-size:11px;margin:0;opacity:.9}
.metric-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#E7ECF4;border:1px solid #E7ECF4;border-radius:15px;overflow:hidden}.metric-strip>div{background:#fff;text-align:center;padding:11px 5px}.metric-strip strong{display:block;font-size:14px;color:#14213A}.metric-strip span{display:block;font-size:9px;color:#7B8798;margin-top:3px}.metric-strip.inside{margin-top:14px}
.detail-list{display:grid;gap:8px}.detail-row{display:flex;align-items:center;gap:11px;background:#fff;border:1px solid #E9EDF3;border-radius:14px;padding:11px}.detail-index{width:30px;height:30px;border-radius:10px;background:#E9F2FF;color:#1766DF;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;flex:0 0 auto}.detail-row strong{display:block;font-size:11.5px}.detail-row small{display:block;font-size:9.5px;color:#7B8798;margin-top:3px}
.journey-hero{background:url('../assets/ui/home-bg.svg') center/cover no-repeat;color:#fff;padding:18px 16px 22px;border-radius:0 0 22px 22px}.journey-hero h1{font-size:20px;line-height:1.2;letter-spacing:-.025em;margin:10px 0 5px}.journey-hero p{font-size:11px;opacity:.9;margin:0}.journey-progress{margin-top:17px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.2);border-radius:14px;padding:11px}.journey-progress .progress-track{background:rgba(255,255,255,.24)}.journey-progress .progress-bar{background:#fff}.journey-progress span,.journey-progress strong{font-size:10.5px}
.workspace-tabs{display:grid;grid-template-columns:repeat(3,1fr);background:#fff;border-bottom:1px solid #E6EBF3;position:sticky;top:0;z-index:20}.workspace-tab{height:47px;background:#fff;color:#8791A1;font-size:10.5px;font-weight:700;border-bottom:2px solid transparent;cursor:pointer}.workspace-tab.active{color:#1265E2;border-color:#1265E2}.action-row.standalone{width:100%;background:#fff;border:1px solid #E9EDF4;border-radius:15px;text-align:left;margin-bottom:0}.document-preview{height:148px;border-radius:15px;background:linear-gradient(145deg,#F3F6FB,#E7EDF7);display:flex;align-items:center;justify-content:center;font-size:48px;color:#D8453E}.certificate-card{min-height:420px;background:#fff;border:1px solid #DBE3EF;border-radius:22px;padding:36px 22px;text-align:center;box-shadow:0 12px 30px rgba(29,58,110,.08);position:relative;overflow:hidden}.certificate-card::before,.certificate-card::after{content:"";position:absolute;border:1px solid #D9E7FF;inset:10px;border-radius:16px}.certificate-card::after{inset:16px}.certificate-card>*{position:relative;z-index:2}.certificate-mark{width:58px;height:58px;border-radius:18px;background:#E9F2FF;color:#0B63E7;display:flex;align-items:center;justify-content:center;font-size:27px;margin:0 auto 20px}.certificate-card h1{font-size:22px;color:#0C397D;margin:14px 0 20px}.certificate-card p{font-size:11px;color:#748096;margin:0 0 7px}.certificate-card strong{font-size:18px;color:#17253F}.certificate-card span{font-size:10px;color:#728096}
.growth-card{width:100%;background:#fff;border:1px solid #E8EDF4;border-radius:17px;padding:14px;text-align:left;color:#172033;box-shadow:0 4px 14px rgba(32,56,117,.04);cursor:pointer}.growth-title{font-size:13px;font-weight:800;line-height:1.4;margin-top:10px}.growth-arrow{color:#1D77FF}.done-icon{background:#DDF8EC!important;color:#08764F!important}
.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.settings-grid button{min-height:102px;border-radius:16px;background:#fff;border:1px solid #E8EDF4;padding:14px;text-align:left;color:#1F2937;cursor:pointer}.settings-grid button span{width:37px;height:37px;border-radius:12px;background:#EAF2FF;color:#1768E7;display:flex;align-items:center;justify-content:center;margin-bottom:12px}.settings-grid button strong{font-size:12px}
.setting-toggle,.availability-row{width:100%;min-height:58px;background:#fff;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 13px;border-bottom:1px solid #EEF2F6;color:#273348;text-align:left}.setting-toggle:last-child,.availability-row:last-child{border-bottom:0}.setting-toggle>span:first-child{font-size:11.5px;font-weight:700}.availability-row strong{display:block;font-size:12px}.availability-row small{display:block;font-size:9.5px;color:#7E8999;margin-top:3px}.toggle{width:42px;height:24px;border-radius:999px;background:#D4DCE7;padding:3px;display:inline-flex;align-items:center;transition:.18s}.toggle i{width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 2px 5px rgba(15,23,42,.18);transition:.18s}.toggle.on{background:#1870EC}.toggle.on i{transform:translateX(18px)}
.expert-service-card{width:100%;background:#fff;border:1px solid #E8EDF4;border-radius:17px;padding:14px;text-align:left;color:#1C273A;cursor:pointer}.expert-service-title{font-size:13px;font-weight:800;line-height:1.4;margin:11px 0 12px}
@media(max-width:350px){.program-detail-overlay h1{font-size:18px}.service-intro{padding:13px}.program-cover{height:120px}.settings-grid{grid-template-columns:1fr}}
.goal-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:14px}.goal-grid button{min-height:105px;border-radius:16px;background:#fff;border:1px solid #E8EDF4;padding:13px;text-align:left;color:#1D293D;cursor:pointer}.goal-grid button span{width:36px;height:36px;border-radius:11px;background:#EAF2FF;color:#1768E7;display:flex;align-items:center;justify-content:center;margin-bottom:12px}.goal-grid button strong{font-size:11px;line-height:1.4;display:block}.partners-asset{width:100%;height:auto;border-radius:16px;background:#fff;border:1px solid #EEF1F6;padding:4px}