/* PUBLIC / FORM RESPONSIVE FINAL */
:root{
  --pub-blue:#1677ff;
  --pub-sky:#0ea5e9;
  --pub-navy:#08213f;
  --pub-muted:#64748b;
  --pub-line:#d9e8f7;
  --pub-soft:#f4f9ff;
  --pub-green:#10b981;
  --pub-shadow:0 22px 60px rgba(8,33,63,.14);
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,"Segoe UI",Roboto,Arial,sans-serif;background:#f4f9ff;color:var(--pub-navy);overflow-x:hidden}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
button,input,select,textarea{font:inherit}
.public-wrap{width:min(1320px,calc(100% - 48px));margin:0 auto}

/* topbar */
.public-topbar{position:sticky;top:0;z-index:3000;background:rgba(255,255,255,.97);backdrop-filter:blur(16px);border-bottom:1px solid var(--pub-line);box-shadow:0 8px 24px rgba(8,33,63,.06)}
.public-topbar-inner{height:84px;display:flex;align-items:center;justify-content:space-between;gap:22px}
.public-brand{display:flex;align-items:center;gap:14px;min-width:300px}
.public-brand img{width:52px;height:52px;border-radius:16px;box-shadow:0 14px 28px rgba(37,99,235,.22)}
.public-brand b{display:block;font-size:20px;line-height:1.05;font-weight:1000;color:#09264a}
.public-brand small{display:block;font-size:12px;color:#5f728d;font-weight:850;margin-top:4px}
.public-nav-links{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap}
.public-nav-links a{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:9px 12px;border-radius:13px;font-size:13.5px;font-weight:950;color:#173456;white-space:nowrap}
.public-nav-links a:hover,.public-nav-links a.active{background:#edf7ff;color:#0b63ce}
.public-menu-toggle{display:none;width:46px;height:46px;border:0;border-radius:16px;background:linear-gradient(135deg,#06b6d4,#2563eb);color:#fff;font-size:24px;font-weight:1000;box-shadow:0 14px 28px rgba(37,99,235,.26)}
.public-drawer-backdrop,.public-drawer{display:none}

/* public hero */
.public-hero{
  position:relative;overflow:hidden;color:#fff;
  background:
    linear-gradient(90deg,rgba(5,23,58,.96) 0%,rgba(6,36,88,.84) 38%,rgba(9,74,150,.36) 70%,rgba(0,0,0,.04) 100%),
    url("../img/hero-banner-full-bg.jpg"),
    linear-gradient(135deg,#082b68,#0ea5e9);
  background-size:cover,cover,cover;background-position:center,center,center;
  min-height:420px;padding:76px 0 92px;
}
.public-hero:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:64px;background:linear-gradient(180deg,rgba(244,249,255,0),#f4f9ff)}
.public-hero-content{position:relative;z-index:2;max-width:780px}
.public-badge{display:inline-flex;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.24);font-size:12px;font-weight:1000;letter-spacing:.05em}
.public-hero h1{font-size:clamp(36px,4vw,58px);line-height:1.02;margin:18px 0 14px;font-weight:1000;letter-spacing:-.055em;text-shadow:0 16px 34px rgba(0,0,0,.25)}
.public-hero p{max-width:680px;margin:0;font-size:17px;line-height:1.72;color:rgba(255,255,255,.94);font-weight:750}

/* page/card/form */
.public-page{padding:0 0 48px}
.public-card{position:relative;z-index:5;margin-top:-42px;background:#fff;border:1px solid var(--pub-line);border-radius:30px;box-shadow:var(--pub-shadow);padding:28px}
.public-section-title{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:22px}
.public-section-title span{display:inline-flex;padding:7px 12px;border-radius:999px;background:#eaf5ff;color:#0b6ee8;font-size:12px;font-weight:1000;letter-spacing:.04em}
.public-section-title h2{font-size:30px;line-height:1.16;margin:10px 0 8px;font-weight:1000;letter-spacing:-.035em;color:#091e3c}
.public-section-title p{max-width:760px;margin:0;color:#64748b;font-weight:750;line-height:1.65}
.public-form{display:grid;gap:18px}
.public-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.public-form-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.public-field{display:grid;gap:7px}
.public-field label,.public-field>span{font-size:13px;font-weight:950;color:#223854}
.public-field input,.public-field select,.public-field textarea,
.public-form input,.public-form select,.public-form textarea{
  width:100%;min-height:52px;border:1px solid #c9daf0;border-radius:14px;background:#fff;padding:0 14px;outline:0;color:#10233f;font-weight:800
}
.public-field textarea,.public-form textarea{min-height:116px;padding:14px;resize:vertical}
.public-field input:focus,.public-field select:focus,.public-field textarea:focus,
.public-form input:focus,.public-form select:focus,.public-form textarea:focus{border-color:#1677ff;box-shadow:0 0 0 4px rgba(22,119,255,.11)}
.public-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.public-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 22px;border-radius:16px;border:1px solid transparent;background:#fff;font-weight:950;cursor:pointer}
.public-btn-primary{background:linear-gradient(135deg,#2196ff,#0b75ef);color:#fff;box-shadow:0 18px 36px rgba(37,99,235,.24)}
.public-btn-outline{border-color:#bfd9f4;color:#0b63ce}
.public-note{background:#f1f8ff;border:1px solid #d9e8f7;border-radius:18px;padding:14px 16px;color:#52677f;font-weight:760;line-height:1.6}
.public-table-wrap{overflow:auto;border:1px solid var(--pub-line);border-radius:20px;background:#fff}
.public-table{width:100%;border-collapse:collapse;min-width:720px}
.public-table th,.public-table td{padding:13px 14px;border-bottom:1px solid #edf2f7;text-align:left;vertical-align:top}
.public-table th{background:#f8fbff;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:#48617c}
.public-table td{font-size:14px;color:#173456;font-weight:700}
.public-alert{padding:14px 16px;border-radius:16px;margin:0 0 16px;font-weight:800}
.public-alert.success{background:#ecfdf5;border:1px solid #bbf7d0;color:#166534}
.public-alert.error{background:#fef2f2;border:1px solid #fecaca;color:#991b1b}

/* Drawer */
@media(max-width:760px){
  .public-wrap{width:calc(100% - 24px)}
  .public-topbar-inner{height:76px}
  .public-brand{min-width:0;flex:1}
  .public-brand img{width:46px;height:46px}
  .public-brand b{font-size:16px;white-space:normal}
  .public-brand small{font-size:10.5px;line-height:1.15;white-space:normal}
  .public-nav-links{display:none}
  .public-menu-toggle{display:grid;place-items:center;flex:0 0 46px}
  body.public-drawer-open{overflow:hidden;position:fixed;width:100%}
  .public-drawer-backdrop{display:block;position:fixed;inset:0;background:rgba(4,14,31,.68);backdrop-filter:blur(5px);z-index:4000;opacity:0;pointer-events:none;transition:.22s}
  body.public-drawer-open .public-drawer-backdrop{opacity:1;pointer-events:auto}
  .public-drawer{display:flex;flex-direction:column;position:fixed;top:0;left:0;width:min(86vw,372px);height:100dvh;background:#fff;z-index:4010;box-shadow:28px 0 60px rgba(8,33,63,.28);transform:translateX(-110%);transition:.26s cubic-bezier(.2,.8,.2,1);border-radius:0 28px 28px 0;overflow:hidden}
  body.public-drawer-open .public-drawer{transform:translateX(0)}
  .public-drawer-head{min-height:96px;padding:18px 16px 14px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #e8f0fb;background:linear-gradient(135deg,#eff6ff,#f0fdfa)}
  .public-drawer-brand{display:flex;align-items:center;gap:12px;min-width:0}
  .public-drawer-brand img{width:48px;height:48px;border-radius:16px;box-shadow:0 12px 24px rgba(37,99,235,.24)}
  .public-drawer-brand b{display:block;color:#09264a;font-size:16px;font-weight:1000;line-height:1.05}
  .public-drawer-brand small{display:block;margin-top:3px;color:#64748b;font-size:11px;font-weight:850}
  .public-drawer-head button{width:40px;height:40px;border:0;border-radius:14px;background:#fff;color:#334155;font-size:26px;box-shadow:0 10px 22px rgba(8,33,63,.08)}
  .public-drawer-list{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:12px;background:linear-gradient(180deg,#fff,#f8fbff)}
  .public-drawer-list a{min-height:54px;padding:0 12px;margin:0 0 8px;display:grid;grid-template-columns:38px 1fr;align-items:center;gap:10px;color:#25364f;font-size:15px;font-weight:900;background:#fff;border:1px solid #e5eef8;border-radius:17px;box-shadow:0 9px 20px rgba(8,33,63,.055)}
  .public-drawer-list a span{width:34px;height:34px;display:grid;place-items:center;border-radius:12px;font-size:18px;background:#eaf5ff}
  .public-drawer-list a:nth-child(1) span{background:#e0f2fe;color:#0369a1}
  .public-drawer-list a:nth-child(2) span{background:#ede9fe;color:#6d28d9}
  .public-drawer-list a:nth-child(3) span{background:#f1f5f9;color:#64748b}
  .public-drawer-list a:nth-child(4) span{background:#f0f9ff;color:#0284c7}
  .public-drawer-list a:nth-child(5) span{background:#fce7f3;color:#db2777}
  .public-drawer-list a:nth-child(6) span{background:#e0f2fe;color:#0284c7}
  .public-drawer-list a:nth-child(7) span{background:#dbeafe;color:#1d4ed8}
  .public-drawer-list a:nth-child(8) span{background:#dcfce7;color:#16a34a}
  .public-drawer-list a:nth-child(9) span{background:#dcfce7;color:#047857}
  .public-drawer-list a:nth-child(10) span{background:#ede9fe;color:#7c3aed}

  .public-hero{min-height:auto;padding:44px 0 82px;background-position:center,center;background-size:cover,cover}
  .public-hero h1{font-size:34px;letter-spacing:-.055em}
  .public-hero p{font-size:14.5px}
  .public-badge{width:100%;justify-content:center;text-align:center;white-space:normal;font-size:11px}
  .public-card{margin-top:-34px;border-radius:24px;padding:18px}
  .public-section-title{display:block}
  .public-section-title h2{font-size:24px}
  .public-section-title p{font-size:14px}
  .public-form-grid,.public-form-grid.three{grid-template-columns:1fr}
  .public-actions{display:grid;grid-template-columns:1fr;gap:10px}
  .public-btn{width:100%}
}


/* DUPLICATE HEADER FOOTER GUARD FINAL */
/* Jika template lama menampilkan header/footer pendek, komponen publik tetap diprioritaskan. */
body:has(.public-topbar) .old-public-navbar,
body:has(.public-topbar) .legacy-navbar,
body:has(.public-topbar) .site-navbar-old{
  display:none !important;
}


/* =========================================================
   FIX V6 - PUBLIC NAVBAR PC FIXED
   Navbar public/register dibuat tetap terlihat saat scroll desktop.
   Mobile tetap drawer/sticky supaya tidak menutup layar kecil.
   ========================================================= */
@media (min-width:961px){
  body.public-body .public-main:has(.public-topbar){
    padding-top:84px!important;
  }
  body.public-body .public-topbar{
    position:fixed!important;
    top:0!important;
    left:0!important;
    right:0!important;
    width:100%!important;
    z-index:10000!important;
  }
  body.public-body .public-topbar-inner{
    height:84px!important;
  }
}

/* FIX V7 - Login glassmorphism premium */
body.public-body .ulp-login,
body.public-body .final-login,
body.public-body .travgo-login,
body.public-body .ota-login-card{
  background:linear-gradient(145deg, rgba(255,255,255,.86), rgba(255,255,255,.72)) !important;
  -webkit-backdrop-filter:blur(18px) saturate(145%) !important;
  backdrop-filter:blur(18px) saturate(145%) !important;
  border:1px solid rgba(255,255,255,.74) !important;
  box-shadow:0 34px 74px rgba(5,25,70,.26), inset 0 1px 0 rgba(255,255,255,.76) !important;
}
body.public-body .ulp-form input,
body.public-body .final-login input,
body.public-body .travgo-login-form input,
body.public-body .login-form input{
  background:rgba(255,255,255,.91) !important;
  border-color:rgba(186,210,238,.95) !important;
}
@media(max-width:640px){body.public-body .ulp-login,body.public-body .final-login,body.public-body .travgo-login,body.public-body .ota-login-card{background:rgba(255,255,255,.93) !important;}}

/* V15 - Registrasi Email Simulasi seperti Gmail, responsive dan premium */
.mail-register-page{background:#f4f8ff;min-height:100vh;overflow:hidden}
.mailreg-hero{position:relative;padding:clamp(34px,5vw,72px) 0;background:radial-gradient(circle at 12% 8%,rgba(37,99,235,.18),transparent 28%),radial-gradient(circle at 88% 20%,rgba(14,165,233,.18),transparent 26%),linear-gradient(135deg,#f8fbff 0%,#eef6ff 50%,#f7fbff 100%)}
.mailreg-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,520px);gap:clamp(24px,4vw,54px);align-items:center}
.mailreg-copy{padding:clamp(10px,2vw,18px)}
.mailreg-badge{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:999px;background:#eaf4ff;border:1px solid #cce5ff;color:#0757b9;font-weight:1000;font-size:12px;letter-spacing:.04em;margin-bottom:18px}
.mailreg-copy h1{font-size:clamp(34px,5vw,66px);line-height:.98;margin:0 0 18px;color:#08213f;font-weight:1000;letter-spacing:-.05em;max-width:820px}
.mailreg-copy p{font-size:clamp(15px,1.7vw,19px);line-height:1.7;color:#49647f;max-width:760px;margin:0 0 24px;font-weight:700}
.mailreg-flow{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:22px}
.mailreg-flow span{padding:10px 13px;border-radius:14px;background:#fff;border:1px solid #deebf7;box-shadow:0 12px 28px rgba(8,33,63,.07);font-weight:950;color:#173456;font-size:13px}.mailreg-flow i{font-style:normal;color:#2b7de9;font-weight:1000}
.gmail-card{position:relative;background:rgba(255,255,255,.94);backdrop-filter:blur(18px) saturate(130%);-webkit-backdrop-filter:blur(18px) saturate(130%);border:1px solid rgba(255,255,255,.9);box-shadow:0 28px 70px rgba(8,33,63,.18);border-radius:30px;padding:clamp(22px,3vw,34px);overflow:hidden}.gmail-card:before{content:"";position:absolute;inset:0 0 auto 0;height:8px;background:linear-gradient(90deg,#4285f4,#34a853,#fbbc05,#ea4335)}.gmail-card-head{display:flex;align-items:center;gap:14px;margin-bottom:20px}.gmail-logo{width:56px;height:56px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(135deg,#e8f2ff,#fff);box-shadow:0 14px 30px rgba(37,99,235,.18);font-size:25px}.gmail-card-head b{display:block;font-size:22px;color:#0b2545;font-weight:1000;letter-spacing:-.02em}.gmail-card-head small{display:block;color:#61758d;font-size:13px;font-weight:800;margin-top:3px}.gmail-name-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.gmail-field{display:flex;flex-direction:column;gap:7px;margin-bottom:13px}.gmail-field span{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:#47627d;font-weight:1000}.gmail-field input{height:52px;width:100%;border:1px solid #d6e4f2;background:#fff;border-radius:16px;padding:0 15px;font-size:15px;color:#0b2545;font-weight:800;outline:none;transition:.18s ease}.gmail-field input:focus{border-color:#2b7de9;box-shadow:0 0 0 4px rgba(43,125,233,.13)}.gmail-email-maker{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:0;margin-top:2px}.gmail-email-maker .gmail-field{margin-bottom:8px}.gmail-email-maker .email-prefix input{border-radius:16px 0 0 16px}.gmail-domain{height:52px;display:flex;align-items:center;justify-content:center;padding:0 16px;margin-bottom:8px;background:#edf6ff;border:1px solid #d6e4f2;border-left:0;border-radius:0 16px 16px 0;font-weight:1000;color:#0b63ce;white-space:nowrap}.gmail-hint{font-size:12px;color:#61758d;background:#f5f9ff;border:1px dashed #cbdff2;padding:11px 13px;border-radius:16px;line-height:1.55;margin-bottom:14px;font-weight:750}.gmail-privacy-box{display:grid;gap:4px;background:linear-gradient(135deg,#eef8ff,#f7fbff);border:1px solid #d8eaf8;border-radius:18px;padding:14px 16px;margin:6px 0 18px}.gmail-privacy-box b{color:#0b2545;font-size:14px}.gmail-privacy-box span{color:#526b84;font-size:13px;line-height:1.55;font-weight:750}.gmail-actions{display:flex;align-items:center;justify-content:space-between;gap:12px}.gmail-actions .public-btn{min-height:48px}.mailreg-info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px;margin-bottom:46px}.mailreg-info-grid article{background:#fff;border:1px solid #deebf7;border-radius:22px;padding:20px;box-shadow:0 18px 38px rgba(8,33,63,.07)}.mailreg-info-grid b{display:block;color:#0b2545;font-size:16px;margin-bottom:8px}.mailreg-info-grid span{display:block;color:#5d738a;line-height:1.6;font-weight:750}
@media(max-width:980px){.mailreg-grid{grid-template-columns:1fr}.mailreg-copy{text-align:left}.gmail-card{max-width:620px;margin:0 auto}.mailreg-info-grid{grid-template-columns:1fr}}
@media(max-width:640px){.mailreg-hero{padding-top:22px}.public-wrap{width:min(100% - 24px,1320px)}.mailreg-copy h1{font-size:34px}.gmail-card{border-radius:22px;padding:20px}.gmail-name-row{grid-template-columns:1fr}.gmail-email-maker{grid-template-columns:1fr}.gmail-email-maker .email-prefix input{border-radius:16px}.gmail-domain{border-left:1px solid #d6e4f2;border-radius:16px;margin-top:-4px;justify-content:flex-start}.gmail-actions{flex-direction:column-reverse}.gmail-actions .public-btn{width:100%;justify-content:center}.mailreg-flow span{font-size:12px}.mailreg-flow i{display:none}}

/* =========================================================
   V16 - Email Simulasi Premium Google/Gmail Inspired UI
   Tidak memakai brand Google/Gmail resmi. Khusus SMK ULP.
   ========================================================= */
.email-pro-page{min-height:100vh;background:#f3f8ff;color:#10233f;overflow:hidden}
.email-pro-hero{position:relative;min-height:calc(100vh - 84px);padding:clamp(34px,5vw,66px) 0;background:radial-gradient(circle at 5% 22%,rgba(29,78,216,.12),transparent 30%),radial-gradient(circle at 96% 10%,rgba(14,165,233,.16),transparent 32%),linear-gradient(135deg,#f9fcff 0%,#edf6ff 56%,#f9fbff 100%)}
.email-pro-hero:before{content:"";position:absolute;left:0;top:0;bottom:0;width:220px;background-image:radial-gradient(#bfdbfe 1.3px,transparent 1.3px);background-size:17px 17px;opacity:.45}.email-pro-hero:after{content:"";position:absolute;left:45%;top:58px;width:172px;height:86px;background:radial-gradient(circle at 20% 25%,#93c5fd 0 6px,transparent 7px),linear-gradient(145deg,transparent 0 45%,rgba(147,197,253,.45) 46% 54%,transparent 55%);clip-path:polygon(0 32%,100% 0,61% 100%,45% 54%,19% 78%);opacity:.75;transform:rotate(-8deg)}
.email-pro-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(430px,650px);gap:clamp(28px,4vw,64px);align-items:center}.email-login-grid{grid-template-columns:minmax(0,1fr) minmax(410px,620px)}
.email-pro-left{min-width:0}.email-pill{display:inline-flex;align-items:center;gap:10px;border:1px solid #bed9f8;background:rgba(255,255,255,.86);box-shadow:0 12px 28px rgba(30,64,175,.08);color:#0b63ce;border-radius:999px;padding:10px 16px;font-size:13px;font-weight:1000;margin-bottom:24px}.email-pill i{width:26px;height:26px;border-radius:9px;display:grid;place-items:center;background:#eaf4ff;color:#2563eb;font-style:normal}.email-pro-left h1{font-size:clamp(22px,2.4vw,34px);line-height:1.06;margin:0 0 8px;font-weight:1000;color:#09264a;letter-spacing:-.04em}.email-pro-left h2{font-size:clamp(38px,5vw,64px);line-height:1.06;margin:0 0 20px;font-weight:1000;color:#0b2344;letter-spacing:-.055em;max-width:780px}.email-pro-left h2 em{font-style:normal;color:#166af2}.email-pro-left p{color:#536b87;font-size:clamp(15px,1.5vw,19px);line-height:1.72;font-weight:750;max-width:760px;margin:0 0 28px}.email-feature-grid{display:grid;gap:16px;margin:26px 0}.email-feature-grid.four{grid-template-columns:repeat(4,1fr)}.email-feature-grid.five{grid-template-columns:repeat(5,1fr)}.email-feature-grid article{min-height:128px;border:1px solid #e2edf8;background:rgba(255,255,255,.84);border-radius:20px;padding:18px 14px;text-align:center;box-shadow:0 18px 38px rgba(8,33,63,.08)}.email-feature-grid article span{width:50px;height:50px;display:grid;place-items:center;border-radius:16px;background:#eef6ff;margin:0 auto 12px;font-size:24px}.email-feature-grid article:nth-child(2) span{background:#ecfdf5}.email-feature-grid article:nth-child(3) span{background:#f3e8ff}.email-feature-grid article:nth-child(4) span{background:#fff7ed}.email-feature-grid article:nth-child(5) span{background:#fff1f2}.email-feature-grid b{display:block;color:#0a2a50;font-size:15px;font-weight:1000;margin-bottom:7px}.email-feature-grid small{display:block;color:#62748a;font-size:12.5px;line-height:1.45;font-weight:750}.developer-card-pro{display:grid;grid-template-columns:190px 1fr;gap:24px;align-items:center;background:rgba(255,255,255,.9);border:1px solid #deebf8;border-radius:28px;padding:20px;box-shadow:0 22px 56px rgba(8,33,63,.09);max-width:780px}.developer-photo-frame{position:relative;border-radius:20px;padding:7px;background:linear-gradient(135deg,#2563eb,#93c5fd,#fff);box-shadow:0 18px 38px rgba(37,99,235,.17)}.developer-photo-frame img{display:block;width:100%;height:218px;object-fit:cover;border-radius:16px;background:#eaf4ff}.developer-info-pro span{display:inline-flex;padding:7px 14px;border-radius:999px;background:#e7f1ff;color:#1462d6;font-size:13px;font-weight:1000;margin-bottom:11px}.developer-info-pro h3{margin:0 0 10px;color:#0b2344;font-size:24px;font-weight:1000;letter-spacing:-.03em}.developer-info-pro h3 i{display:inline-grid;place-items:center;width:22px;height:22px;background:#1d7cff;color:#fff;border-radius:50%;font-style:normal;font-size:13px}.developer-info-pro p{font-size:14.5px;line-height:1.72;margin:0 0 16px;color:#536b87;max-width:560px}.developer-contact-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.developer-contact-row a{display:flex;align-items:center;justify-content:center;min-height:48px;border-radius:14px;background:#f8fbff;border:1px solid #e1ecf7;color:#405a76;font-size:13px;font-weight:850;text-decoration:none}.email-register-card-pro,.email-login-card-pro{position:relative;background:rgba(255,255,255,.93);border:1px solid rgba(255,255,255,.96);border-radius:28px;padding:clamp(24px,3vw,36px);box-shadow:0 32px 80px rgba(8,33,63,.17);overflow:hidden}.email-card-accent{position:absolute;inset:0 0 auto;height:8px;background:linear-gradient(90deg,#1d65ff,#06b6d4,#22c55e,#f59e0b,#ef4444)}.email-form-title{display:flex;align-items:center;gap:18px;margin:14px 0 22px}.email-form-icon,.email-login-icon{width:70px;height:70px;border-radius:22px;display:grid;place-items:center;background:linear-gradient(135deg,#eaf4ff,#fff);box-shadow:0 16px 36px rgba(29,78,216,.18);font-size:32px;color:#1d65ff}.email-form-title h2,.email-login-title h2{margin:0;color:#0b2344;font-size:27px;font-weight:1000;letter-spacing:-.035em}.email-form-title p,.email-login-title p{margin:5px 0 0;color:#6a7f97;font-weight:750}.email-form-row.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}.email-form-row label,.email-form-field,.email-domain-field label{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}.email-form-row span,.email-form-field span,.email-domain-field span{color:#405a76;font-size:12.5px;text-transform:uppercase;letter-spacing:.04em;font-weight:1000}.email-form-row input,.email-form-field input,.email-domain-field input{width:100%;height:54px;border:1px solid #d7e4f2;background:#fff;border-radius:15px;padding:0 17px;color:#0b2344;font-size:15px;font-weight:850;outline:none;transition:.18s}.email-form-row input:focus,.email-form-field input:focus,.email-domain-field input:focus{border-color:#1d7cff;box-shadow:0 0 0 5px rgba(29,124,255,.12)}.email-domain-field{display:grid;grid-template-columns:minmax(0,1fr) 170px;align-items:end;margin-bottom:10px}.email-domain-field label{margin:0}.email-domain-field input{border-radius:15px 0 0 15px}.email-domain-field strong{height:54px;display:flex;align-items:center;justify-content:center;border:1px solid #d7e4f2;border-left:0;border-radius:0 15px 15px 0;background:#edf6ff;color:#0b63ce;font-weight:1000}.email-helper{display:block;color:#6a7f97;font-size:12.5px;line-height:1.55;margin:-2px 0 16px}.email-register-actions{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:10px}.email-primary-btn,.email-secondary-btn{border:0;text-decoration:none;min-height:52px;border-radius:15px;font-size:16px;font-weight:1000;display:flex;align-items:center;justify-content:center;gap:10px;cursor:pointer}.email-primary-btn{background:linear-gradient(135deg,#1168f5,#0b82ff);color:#fff;box-shadow:0 16px 32px rgba(17,104,245,.26)}.email-secondary-btn{background:#fff;color:#0b63ce;border:2px solid #2e7bff}.email-primary-btn.full,.email-secondary-btn.full{width:100%}.email-safe-note{margin:16px 0 0;text-align:center;color:#788ba0;font-size:12.8px!important;line-height:1.45!important}.email-login-card-pro{padding:clamp(30px,4vw,54px);max-width:650px}.email-login-title{text-align:center;margin:10px 0 28px}.email-login-icon{margin:0 auto 16px}.email-login-extra{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:2px 0 22px;color:#526b84;font-weight:800}.email-login-extra label{display:flex;gap:8px;align-items:center}.email-login-extra input{width:20px;height:20px;accent-color:#1d7cff}.email-login-extra a{color:#0b77ff;font-weight:900;text-decoration:none}.email-or{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px;margin:24px 0}.email-or span{height:1px;background:#dce8f5}.email-or b{color:#7d8da1;font-weight:850}
@media(max-width:1180px){.email-pro-grid,.email-login-grid{grid-template-columns:1fr}.email-register-card-pro,.email-login-card-pro{max-width:720px;margin:0 auto}.email-feature-grid.five{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.email-pro-hero{padding-top:24px}.email-pro-left h2{font-size:34px}.email-feature-grid.four,.email-feature-grid.five{grid-template-columns:1fr 1fr}.developer-card-pro{grid-template-columns:1fr;text-align:center}.developer-photo-frame{max-width:210px;margin:0 auto}.developer-contact-row,.email-register-actions,.email-form-row.two{grid-template-columns:1fr}.email-domain-field{grid-template-columns:1fr}.email-domain-field input{border-radius:15px}.email-domain-field strong{border-left:1px solid #d7e4f2;border-radius:15px;margin-top:8px;justify-content:flex-start;padding-left:17px}.email-login-extra{align-items:flex-start;flex-direction:column}.email-pro-left h1{font-size:22px}}
@media(max-width:460px){.email-feature-grid.four,.email-feature-grid.five{grid-template-columns:1fr}.email-register-card-pro,.email-login-card-pro{border-radius:22px;padding:22px 16px}.email-form-title{align-items:flex-start}.email-form-icon{width:58px;height:58px}.email-form-title h2,.email-login-title h2{font-size:22px}}

/* V16 mail app dashboard */
body:has(.mailapp-page) .commercial-topbar,body:has(.mailapp-page) .page-banner{display:none!important}body:has(.mailapp-page) .main{padding:0!important;max-width:none!important;background:#f5f9ff!important}.mailapp-page{min-height:100vh;background:#f5f9ff;color:#10233f;font-family:inherit}.mailapp-topbar{height:88px;position:sticky;top:0;z-index:30;display:grid;grid-template-columns:300px minmax(280px,620px) 1fr;gap:24px;align-items:center;padding:0 26px;background:rgba(255,255,255,.94);backdrop-filter:blur(16px);border-bottom:1px solid #e3edf8}.mailapp-brand{display:flex;align-items:center;gap:14px;min-width:0}.mailapp-brand img{width:54px;height:54px;border-radius:16px;box-shadow:0 14px 26px rgba(37,99,235,.22)}.mailapp-brand b{display:block;color:#0b2545;font-size:22px;font-weight:1000;letter-spacing:-.04em;line-height:1.04}.mailapp-brand span{display:block;color:#0b63ce;font-weight:900}.mailapp-search{height:52px;border:1px solid #d7e4f2;background:#fff;border-radius:16px;display:flex;align-items:center;gap:10px;padding:0 14px;box-shadow:0 8px 20px rgba(8,33,63,.04)}.mailapp-search input{border:0;outline:0;background:transparent;flex:1;color:#0b2545;font-weight:800}.mailapp-search kbd{border:1px solid #d5e3f2;background:#f8fbff;border-radius:8px;padding:4px 8px;color:#71839a}.mailapp-user{display:flex;align-items:center;justify-content:flex-end;gap:18px}.mailapp-user .shield{display:grid;grid-template-columns:auto 1fr;gap:6px;align-items:center;color:#0f766e}.mailapp-user .shield small{grid-column:2;color:#7b8da0;font-size:12px}.mail-bell{position:relative;font-style:normal}.mail-bell em{position:absolute;right:-8px;top:-12px;background:#ef4444;color:#fff;border-radius:999px;font-size:11px;padding:2px 6px;font-style:normal}.mailapp-user img{width:48px;height:48px;border-radius:50%;object-fit:cover;border:3px solid #fff;box-shadow:0 10px 22px rgba(8,33,63,.12)}.mailapp-user strong{display:flex;flex-direction:column;color:#0b2545;font-size:14px}.mailapp-user strong small{color:#64748b}.mailapp-shell{display:grid;grid-template-columns:260px minmax(330px,520px) minmax(480px,1fr) 280px;gap:0;min-height:calc(100vh - 88px)}.mailapp-sidebar{background:#fff;border-right:1px solid #e5edf7;padding:24px 18px;display:flex;flex-direction:column;gap:18px;position:sticky;top:88px;height:calc(100vh - 88px);overflow:auto}.compose-btn{height:54px;border-radius:14px;background:linear-gradient(135deg,#1168f5,#0b82ff);color:#fff;text-decoration:none;display:flex;align-items:center;justify-content:center;font-weight:1000;box-shadow:0 16px 30px rgba(17,104,245,.24)}.mailapp-sidebar nav{display:flex;flex-direction:column;gap:4px}.mailapp-sidebar nav a{min-height:44px;border-radius:12px;display:grid;grid-template-columns:26px 1fr auto;align-items:center;gap:10px;padding:0 12px;text-decoration:none;color:#1c3352;font-weight:850}.mailapp-sidebar nav a.active,.mailapp-sidebar nav a:hover{background:#eef6ff;color:#0b63ce}.mailapp-sidebar nav b{background:#dbeafe;color:#0b63ce;border-radius:999px;padding:3px 8px;font-size:12px}.mailapp-sidebar hr{width:100%;border:0;border-top:1px solid #e8f0f8;margin:10px 0}.mail-storage{margin-top:auto;border-top:1px solid #e8f0f8;padding-top:18px;display:grid;gap:6px;color:#526b84;font-size:12px;font-weight:850}.mail-storage i{height:8px;background:#e7eff8;border-radius:999px;overflow:hidden}.mail-storage i em{display:block;height:100%;background:#176dff;border-radius:999px}.mailapp-list-pane{background:#f8fbff;border-right:1px solid #e5edf7;padding:24px 20px;overflow:auto}.mailapp-list-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px}.mailapp-list-head h2{margin:0;color:#0b2545;font-size:24px}.mailapp-list-head p{margin:4px 0 0;color:#64748b;font-weight:750}.mailapp-list-head div:last-child{display:flex;gap:8px;flex-wrap:wrap}.mailapp-list-head button{border:1px solid #d7e4f2;background:#fff;color:#1c3352;border-radius:12px;min-height:40px;padding:0 13px;font-weight:900}.mail-list{display:grid;gap:8px}.mail-row{position:relative;min-height:92px;display:grid;grid-template-columns:10px 48px 1fr auto;gap:12px;align-items:center;background:#fff;border:1px solid #e3edf8;border-radius:16px;padding:10px 12px;text-decoration:none;color:#10233f;box-shadow:0 8px 20px rgba(8,33,63,.04)}.mail-row.selected{border-color:#2e7bff;background:#f4f9ff}.mail-row i{width:8px;height:8px;border-radius:50%;background:#cbd5e1}.mail-row.unread i{background:#1477ff}.mail-avatar{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#176dff;color:#fff;font-style:normal;font-weight:1000}.mail-avatar.bp{background:#7c3aed}.mail-avatar.voucher{background:#f97316}.mail-avatar.cancel{background:#ef4444}.mail-avatar.mice{background:#8b5cf6}.mail-avatar.wa{background:#22c55e}.mail-avatar.welcome{background:#0f766e}.mail-row span{min-width:0}.mail-row span b{display:block;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#0b2545}.mail-row span small{display:block;margin-top:5px;color:#6b7d93;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mail-row time{align-self:start;color:#64748b;font-size:12px;font-weight:850}.mail-row em{position:absolute;right:12px;bottom:8px;border-radius:999px;background:#eef6ff;color:#0b63ce;font-size:11px;font-weight:1000;padding:4px 8px;font-style:normal}.mailapp-read-pane{background:#f5f9ff;padding:24px 18px;overflow:auto}.read-toolbar{height:60px;background:#fff;border:1px solid #e3edf8;border-radius:18px 18px 0 0;display:flex;align-items:center;gap:18px;padding:0 18px;color:#334155}.read-toolbar b{margin-left:auto;font-size:12px;color:#334155}.read-card{background:#fff;border:1px solid #e3edf8;border-top:0;border-radius:0 0 18px 18px;padding:30px;box-shadow:0 18px 42px rgba(8,33,63,.06)}.read-subject{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:22px}.read-subject h1{font-size:25px;line-height:1.2;color:#0b2545;margin:0;font-weight:1000;letter-spacing:-.03em}.tag{border-radius:999px;padding:6px 10px;font-size:11px;font-weight:1000;background:#eaf4ff;color:#0b63ce}.tag.cancel{background:#fee2e2;color:#dc2626}.tag.bp{background:#f3e8ff;color:#7c3aed}.tag.voucher{background:#fff7ed;color:#f97316}.tag.mice{background:#f3e8ff;color:#7c3aed}.tag.wa{background:#dcfce7;color:#16a34a}.star{margin-left:auto;color:#f59e0b}.read-sender{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid #eef2f7;padding-bottom:18px;margin-bottom:22px}.read-sender strong{color:#0b2545}.read-sender small{color:#64748b;font-weight:750}.read-sender time{color:#64748b;font-size:13px;font-weight:850}.ticket-preview-box{display:grid;grid-template-columns:1fr 1fr;gap:12px;border:1px solid #bed9f8;background:#f8fbff;border-radius:16px;padding:16px;margin:16px 0}.ticket-preview-box div{display:flex;flex-direction:column;gap:4px}.ticket-preview-box span{font-size:28px}.ticket-preview-box b{color:#0b2545}.ticket-preview-box small{color:#667d95;font-weight:750}.mail-body-text{white-space:normal;line-height:1.8;color:#203852;font-weight:650}.green-note{margin-top:20px;background:#ecfdf5;border:1px solid #bbf7d0;color:#047857;border-radius:14px;padding:14px;font-weight:850}.read-actions{display:flex;gap:10px;margin-top:24px;flex-wrap:wrap}.read-actions a{min-height:42px;padding:0 14px;display:flex;align-items:center;border:1px solid #cfe2f7;border-radius:12px;text-decoration:none;color:#0b63ce;font-weight:900;background:#fff}.empty-read{border-radius:18px!important;border-top:1px solid #e3edf8!important}.mailapp-rightbar{background:#f8fbff;padding:24px 20px;display:grid;align-content:start;gap:16px;overflow:auto}.mailapp-rightbar section{background:#fff;border:1px solid #e3edf8;border-radius:18px;padding:18px;box-shadow:0 12px 30px rgba(8,33,63,.05)}.mailapp-rightbar h3{margin:0 0 14px;color:#0b2545}.mailapp-rightbar p{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 13px;color:#405a76;font-weight:850}.quick{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:38px;padding:0 10px;border-radius:12px;margin-bottom:8px;font-weight:900}.quick.ticket{background:#dcfce7;color:#047857}.quick.bp{background:#f3e8ff;color:#7c3aed}.quick.voucher{background:#ffedd5;color:#ea580c}.quick.cancel{background:#fee2e2;color:#dc2626}.quick.wa{background:#dcfce7;color:#16a34a}.dev-mini-card div{display:grid;grid-template-columns:80px 1fr;gap:12px;align-items:center}.dev-mini-card img{width:80px;height:100px;object-fit:cover;border-radius:14px}.dev-mini-card p{display:block;margin:0}.dev-mini-card p small,.dev-mini-card p span{display:block;color:#64748b;font-size:12px;line-height:1.45}.dev-mini-card p b{display:block;color:#0b2545;font-size:13px}.dev-mini-card a{display:block;margin-top:10px;color:#405a76;font-size:12px;font-weight:850}.mail-empty{background:#fff;border:1px dashed #b9d8f8;border-radius:16px;padding:22px;color:#536b84;display:grid;gap:6px}
@media(max-width:1500px){.mailapp-shell{grid-template-columns:240px 430px 1fr}.mailapp-rightbar{display:none}.mailapp-topbar{grid-template-columns:280px 1fr auto}.mailapp-user .shield{display:none}}
@media(max-width:1120px){.mailapp-shell{grid-template-columns:220px 1fr}.mailapp-read-pane{grid-column:2}.mailapp-list-pane{grid-column:2}.mailapp-sidebar{grid-row:1 / span 2}.mailapp-topbar{grid-template-columns:1fr}.mailapp-search,.mailapp-user{display:none}.mailapp-brand b{font-size:18px}}
@media(max-width:760px){body:has(.mailapp-page) .main{margin-left:0!important}.mailapp-topbar{height:auto;padding:14px;position:relative}.mailapp-shell{display:block}.mailapp-sidebar{position:relative;top:auto;height:auto;max-height:none}.mailapp-list-pane,.mailapp-read-pane{padding:14px}.read-card{padding:18px}.ticket-preview-box{grid-template-columns:1fr}.read-sender{display:block}.mail-row{grid-template-columns:8px 40px 1fr}.mail-row time{display:none}.mailapp-brand img{width:44px;height:44px}.mailapp-brand b{font-size:16px}.mailapp-brand span{font-size:12px}}

/* V17: Email simulator registration/login - remove feature-card clutter and strengthen developer narrative */
.email-purpose-card{
  margin-top:26px;
  max-width:860px;
  border-color:#cfe2ff;
  background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(239,247,255,.92));
}
.email-purpose-card .developer-info-pro p{
  max-width:620px;
  font-size:15px;
  line-height:1.82;
  color:#415a76;
}
.email-purpose-card .developer-info-pro p strong{
  color:#0b2545;
  font-weight:1000;
}
.email-purpose-card .developer-info-pro p b{
  color:#0b63ce;
  font-weight:1000;
}
@media (max-width: 860px){
  .email-purpose-card{grid-template-columns:1fr;text-align:center;padding:18px;margin-top:20px}
  .email-purpose-card .developer-photo-frame{max-width:190px;margin:0 auto}
  .email-purpose-card .developer-contact-row{grid-template-columns:1fr}
}

/* V18: Gmail-style email simulator polish - remove personal email chip, use branded mail mark */
.email-pro-hero{
  background:
    radial-gradient(circle at 12% 12%, rgba(66,133,244,.15), transparent 28%),
    radial-gradient(circle at 86% 14%, rgba(52,168,83,.10), transparent 25%),
    radial-gradient(circle at 78% 78%, rgba(251,188,5,.09), transparent 26%),
    linear-gradient(135deg,#ffffff 0%,#eef6ff 52%,#fbfdff 100%) !important;
}
.email-pro-hero:before{opacity:.30!important}
.email-pro-hero:after{opacity:.58!important}
.email-purpose-card{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(135deg,rgba(255,255,255,.98),rgba(245,249,255,.95)) !important;
  border:1px solid rgba(191,219,254,.9) !important;
  box-shadow:0 24px 60px rgba(15,23,42,.10) !important;
}
.email-purpose-card:before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:5px;
  background:linear-gradient(90deg,#4285f4,#ea4335,#fbbc05,#34a853,#4285f4);
}
.email-system-signature{
  display:grid;
  grid-template-columns:auto 1px minmax(0,1fr);
  align-items:center;
  gap:16px;
  margin-top:16px;
  padding:14px 16px;
  border-radius:18px;
  background:linear-gradient(135deg,#ffffff,#f1f7ff);
  border:1px solid #dfeaf7;
  box-shadow:0 12px 24px rgba(37,99,235,.08);
  max-width:520px;
}
.gmail-sim-mark{
  width:72px;
  height:56px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:#fff;
  box-shadow:0 12px 24px rgba(66,133,244,.14);
}
.gmail-sim-mark img{width:58px;height:auto;display:block}
.signature-divider{width:1px;height:42px;background:#dbe7f5;display:block}
.email-system-signature b{display:block;color:#0b2545;font-weight:1000;font-size:14px;margin-bottom:4px}
.email-system-signature small{display:block;color:#5f7188;font-size:12.5px;line-height:1.5;font-weight:800}
.email-form-icon,.email-login-icon{
  background:linear-gradient(135deg,#ffffff,#edf6ff)!important;
  position:relative;
  color:transparent!important;
}
.email-form-icon:before,.email-login-icon:before{
  content:"";
  width:52px;height:40px;
  background:url('../img/gmail-simulasi-mark.svg') center/contain no-repeat;
  display:block;
}
.email-register-card-pro,.email-login-card-pro{
  background:rgba(255,255,255,.96)!important;
  border:1px solid rgba(219,234,254,.92)!important;
}
.email-card-accent{background:linear-gradient(90deg,#4285f4,#34a853,#fbbc05,#ea4335)!important}
.mail-mini-signature{
  margin-top:12px;
  padding:12px;
  border-radius:14px;
  background:#f6faff;
  border:1px solid #dce9f8;
  display:grid;
  grid-template-columns:48px 1fr;
  gap:10px;
  align-items:center;
}
.mail-mini-signature img{width:48px;height:auto;display:block}
.mail-mini-signature span{font-size:12px;color:#526b84;font-weight:850;line-height:1.45}
.dev-mini-card>a{display:none!important}
@media(max-width:760px){
  .email-system-signature{grid-template-columns:1fr;text-align:center;justify-items:center;gap:10px}
  .signature-divider{display:none}
  .gmail-sim-mark{width:78px;height:58px}
}

/* V30 - Webmail Simulasi Aktif seperti Gmail/industri, tanpa meniru brand Google */
.mail-no-account{max-width:980px;margin:42px auto!important;padding:34px!important;border-radius:28px!important;text-align:center;background:linear-gradient(135deg,#fff,#f4f9ff)!important;border:1px solid #dcecff!important;box-shadow:0 24px 60px rgba(8,33,63,.10)!important}.mail-no-icon{width:82px;height:82px;margin:0 auto 18px;border-radius:28px;display:grid;place-items:center;background:linear-gradient(135deg,#0b75ef,#14d3a2);font-size:38px;box-shadow:0 22px 44px rgba(14,117,239,.22)}.mail-no-account h2{margin:0 0 10px;font-size:30px;color:#09264a;font-weight:1000;letter-spacing:-.04em}.mail-no-account p{max-width:760px;margin:0 auto;color:#52677f;line-height:1.7;font-weight:750}.mail-no-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:22px}.v30-register-mail-btn{min-height:46px;border-radius:14px;background:#eefdf7;border:1px solid #b8f0d5;color:#047857;text-decoration:none;display:flex;align-items:center;justify-content:center;font-weight:1000}.v30-mail-shell{grid-template-columns:260px minmax(360px,520px) minmax(520px,1fr) 280px}.v30-mail-tabs{display:flex;gap:8px;margin:0 0 14px;overflow:auto}.v30-mail-tabs a{padding:10px 14px;border-radius:999px;background:#fff;border:1px solid #dbeafe;color:#1d4ed8;font-weight:950;text-decoration:none;white-space:nowrap}.v30-mail-tabs a.active{background:#0b75ef;color:#fff;border-color:#0b75ef}.v30-tool{min-height:40px;padding:0 13px;display:inline-flex;align-items:center;border:1px solid #d7e4f2;background:#fff;color:#1c3352;border-radius:12px;font-weight:900;text-decoration:none}.v30-read-toolbar a,.v30-read-toolbar button{border:0;background:transparent;color:#334155;font-weight:1000;text-decoration:none;cursor:pointer;font-size:18px}.v30-read-toolbar form{display:inline-flex;margin:0}.v30-compose-card{border-radius:20px!important;border-top:1px solid #e3edf8!important}.v30-compose-card h1{margin:0 0 8px;color:#0b2545;font-size:30px;font-weight:1000;letter-spacing:-.04em}.v30-muted{margin:0 0 18px;color:#64748b;font-weight:750;line-height:1.65}.v30-compose-form{display:grid;gap:13px}.v30-compose-form label{display:grid;gap:7px;color:#223854;font-size:13px;font-weight:950}.v30-compose-form input,.v30-compose-form select,.v30-compose-form textarea{width:100%;border:1px solid #c9daf0;border-radius:14px;background:#fff;padding:13px 14px;outline:0;color:#10233f;font-weight:800;font-family:inherit}.v30-compose-form input,.v30-compose-form select{height:50px}.v30-compose-form textarea{resize:vertical;line-height:1.6}.v30-compose-form input:focus,.v30-compose-form select:focus,.v30-compose-form textarea:focus{border-color:#1677ff;box-shadow:0 0 0 4px rgba(22,119,255,.11)}.v30-compose-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.v30-compose-actions .btn,.v30-reply-box .btn{min-height:44px;border:1px solid #cfe2f7;border-radius:12px;text-decoration:none;color:#0b63ce;font-weight:950;background:#fff;display:inline-flex;align-items:center;justify-content:center;padding:0 16px;cursor:pointer}.v30-compose-actions .btn-primary,.v30-reply-box .btn-primary{background:linear-gradient(135deg,#1168f5,#0b82ff);color:#fff;border-color:#1168f5}.v30-reply-box{margin-top:24px;border:1px solid #e3edf8;border-radius:16px;padding:14px;background:#f8fbff}.v30-reply-box summary{cursor:pointer;font-weight:1000;color:#0b63ce}.v30-reply-box .small{margin-top:14px}.mail-avatar.personal{background:#0ea5e9}.mail-row.unread span b{font-weight:1000}.mail-row.unread{box-shadow:0 12px 28px rgba(22,119,255,.09);border-color:#cfe5ff}.v30-mail-rightbar .quick{text-decoration:none}.v30-mail-page .btn{font-family:inherit}.v30-mail-page .btn-primary{background:linear-gradient(135deg,#1168f5,#0b82ff);color:#fff!important;border-color:#1168f5!important}
@media(max-width:1500px){.v30-mail-shell{grid-template-columns:240px 440px 1fr}.v30-mail-rightbar{display:none}}
@media(max-width:1120px){.v30-mail-shell{grid-template-columns:220px 1fr}.v30-mail-read-pane,.v30-mail-list-pane{grid-column:2}.v30-mail-sidebar{grid-row:1 / span 2}}
@media(max-width:760px){.v30-mail-shell{display:block}.v30-mail-topbar{position:relative;height:auto;padding:14px}.v30-mail-sidebar{position:relative;top:auto;height:auto}.v30-mail-list-pane,.v30-mail-read-pane{padding:14px}.v30-compose-card h1{font-size:24px}.v30-compose-actions .btn{width:100%}.v30-mail-tabs{padding-bottom:3px}.read-toolbar{border-radius:16px!important;overflow:auto}.read-card{border-radius:16px!important;border-top:1px solid #e3edf8!important;padding:20px}.ticket-preview-box{grid-template-columns:1fr}.mail-no-account{margin:20px 14px!important;padding:24px 18px!important}}