/* MIIM PRINTING login — scoped design, no dependency on external CDN */
:root { color-scheme: light; --navy: #0a2855; --ink: #0b2448; --electric: #0877f7; --muted: #6d7f9e; }
*,*::before,*::after { box-sizing: border-box; }
html { min-height: 100%; }
body { margin:0; min-width:320px; min-height:100vh; min-height:100svh; font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; }
button,input { font:inherit; }
.page-shell { min-height:100vh; min-height:100svh; position:relative; isolation:isolate; overflow:hidden; background:radial-gradient(ellipse 48% 61% at 52% 74%,rgba(23,84,164,.65),transparent 76%),radial-gradient(ellipse 62% 73% at 92% 4%,rgba(26,87,165,.73),transparent 77%),linear-gradient(115deg,#061f43 0%,#0a2a59 54%,#0d3879 100%); }
.page-shell::after { content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(3,18,42,.34),rgba(3,18,42,.10) 40%,transparent 72%),radial-gradient(circle at 2% 100%,rgba(0,8,26,.42),transparent 62%),linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,0)); }
.decor-dots { position:absolute;left:3.1%;top:6%;width:120px;height:120px;z-index:-1;opacity:.52;background-image:radial-gradient(circle, #2582e9 3px, transparent 3.6px);background-size:32px 36px; }
.decor-swirl { position:absolute;z-index:-1;pointer-events:none;transform:rotate(-43deg);border-radius:100px; }
.decor-swirl-one {inset:0;width:100%;height:100%;right:auto;top:0;left:0;transform:none;border:0;border-radius:0;box-shadow:none;background:url('../images/login-ribbons.svg') center center / cover no-repeat;}
.decor-swirl-two {display:none;}
.hero-photo {position:absolute;z-index:-1;pointer-events:none;left:38.27%;bottom:0;width:min(18.7vw,312px);aspect-ratio:312 / 641;height:auto;background:url('../images/login-printer-blended.webp') center / 100% 100% no-repeat;opacity:.95;}
.login-layout {position:relative;width:100%;max-width:1800px;min-height:100vh;min-height:100svh;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) clamp(390px,35vw,584px);align-items:center;gap:clamp(46px,11.7vw,196px);padding:40px clamp(28px,8.1vw,135px) 40px clamp(28px,7vw,117px);}
.hero {width:100%;max-width:650px;color:#fff;align-self:center;transform:translateY(20px);}
.hero-logo {display:block;object-fit:contain;width:100px;height:auto;max-height:146px;margin:0 0 27px 82px;filter:drop-shadow(0 4px 5px rgba(0,12,37,.15));}
.hero-eyebrow {margin:0 0 8px;color:#168efb;font-size:clamp(13px,1.05vw,18px);font-weight:700;letter-spacing:.42em;white-space:nowrap;}
.hero h1 {margin:0;line-height:1.13;font-size:clamp(37px,3.8vw,67px);font-weight:850;letter-spacing:-.045em;text-shadow:0 4px 7px rgba(0,0,0,.13);white-space:nowrap;}
.hero-tagline {margin:6px 0 24px;font-size:clamp(16px,1.46vw,24px);font-weight:750;letter-spacing:.10em;color:#218efb;white-space:nowrap;}
.hero-description {font-size:clamp(15px,1.15vw,18px);line-height:1.6;color:#d5e1f2;max-width:510px;margin:0;}
.feature-list {display:grid;grid-template-columns:1fr 1fr;gap:23px 12px;width:100%;max-width:510px;margin-top:31px;}
.feature {display:flex;gap:18px;align-items:center;font-size:clamp(14px,1.1vw,18px);font-weight:500;line-height:1.45;white-space:nowrap;}
.feature-icon {display:grid;place-items:center;flex:0 0 68px;width:68px;height:68px;border:1.5px solid rgba(42,163,255,.38);border-radius:17px;background:rgba(7,97,181,.18);color:#0799f9;box-shadow:inset 0 0 13px rgba(4,91,190,.12);}
.feature-icon svg {width:33px;height:33px;}
.feature-purple .feature-icon {color:#866dff;border-color:rgba(139,112,255,.38);background:rgba(96,69,195,.14);}
.feature-green .feature-icon {color:#17d79c;border-color:rgba(10,229,165,.33);background:rgba(0,154,110,.11);}
.feature-orange .feature-icon {color:#ffa62b;border-color:rgba(255,162,30,.37);background:rgba(219,137,19,.10);}
.hero-footer {display:flex;align-items:center;gap:22px;margin:65px 0 0;color:#d2dcee;font-size:13px;white-space:nowrap;}
.hero-footer-line {display:inline-block;width:55px;height:3px;background:#168dfb;flex:none;}
.login-card {position:relative;width:100%;max-width:584px;padding:68px clamp(29px,3.1vw,52px) 40px;border-radius:23px;overflow:hidden;background:#fff;box-shadow:0 24px 80px rgba(0,16,48,.24),0 0 0 1px rgba(202,218,243,.6);animation:card-arrive .55s cubic-bezier(.2,.8,.2,1) both;}
.login-card::before {content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(125deg,rgba(245,249,255,.28),transparent 30%);}
.card-head {position:relative;text-align:center;}
.card-logo {display:block;width:88px;height:144px;object-fit:contain;margin:-3px auto 0;}
.card-head h2 {font-size:clamp(25px,2.1vw,33px);font-weight:820;letter-spacing:-.045em;line-height:1.12;color:#08244c;margin:10px 0 5px;}
.card-subtitle {font-size:clamp(12px,1vw,15px);font-weight:750;letter-spacing:.09em;margin:0;color:#0577f4;white-space:nowrap;}
.title-rule {height:1px;background:#edf1f8;margin:23px auto 17px;position:relative;width:88%;}
.title-rule span {position:absolute;top:-1px;left:calc(50% - 20px);width:40px;height:2px;background:#b2c0d5;}
.card-intro {margin:0 auto 35px;color:#617699;font-size:15px;font-weight:450;line-height:1.55;max-width:390px;}
.login-error {position:relative;display:flex;align-items:flex-start;gap:10px;margin:-8px 0 17px;padding:12px 14px;border:1px solid #fecaca;border-radius:11px;background:#fff1f2;color:#9d2637;font-size:13px;line-height:1.4;}
.login-error svg {width:19px;height:19px;flex:none;}
.login-form {position:relative;}
.form-field {margin:0 0 22px;}
.form-field label {display:block;font-size:13px;line-height:1.5;font-weight:750;color:#536786;margin-bottom:8px;}
.input-frame {display:flex;align-items:center;gap:16px;width:100%;min-height:58px;border:1.5px solid #dfe7f2;border-radius:13px;padding:0 15px;background:#fff;box-shadow:0 4px 15px rgba(31,69,116,.035);transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;}
.input-frame:focus-within {border-color:#1489fc;box-shadow:0 0 0 4px rgba(11,127,244,.115);}
.field-icon {width:26px;height:26px;flex:none;color:#8296b4;}
.input-frame input {outline:none;border:0;background:transparent;min-width:0;width:100%;height:55px;color:#142f57;font-size:15px;}
.input-frame input::placeholder {color:#8b9bb5;opacity:1;}
.password-frame {gap:14px;padding-right:10px;}
.password-toggle {display:grid;place-items:center;cursor:pointer;flex:none;width:40px;height:40px;padding:8px;color:#8296b4;border:none;border-radius:9px;background:transparent;transition:color .2s,background .2s;}
.password-toggle svg {width:24px;height:24px;}
.password-toggle:hover {color:#097df8;background:#eaf3ff;}
.password-toggle:focus-visible {outline:3px solid #188cf6;outline-offset:1px;}
.icon-eye-open {display:none;}
.password-toggle[aria-pressed="true"] .icon-eye-open {display:block;}
.password-toggle[aria-pressed="true"] .icon-eye-closed {display:none;}
.caps-warning {margin:7px 0 -5px;color:#ae6904;font-size:12px;}
.submit-button {width:100%;height:63px;display:flex;justify-content:center;align-items:center;gap:14px;border:0;border-radius:13px;background:linear-gradient(105deg,#0469e5,#097cf7);color:#fff;box-shadow:0 8px 17px rgba(7,106,236,.13);font-size:16px;font-weight:750;cursor:pointer;margin-top:35px;transition:transform .16s ease,filter .16s ease,box-shadow .16s ease;}
.submit-button:hover {background:linear-gradient(105deg,#005bcb,#036de4);transform:translateY(-1px);box-shadow:0 11px 20px rgba(7,106,236,.2);}
.submit-button:active {transform:translateY(0);}
.submit-button:focus-visible {outline:3px solid #8acaff;outline-offset:3px;}
.button-arrow {width:22px;height:22px;}
.button-spinner {display:none;width:20px;height:20px;border:2.5px solid rgba(255,255,255,.36);border-top-color:#fff;border-radius:50%;animation:spinner .8s linear infinite;}
.submit-button.is-loading {cursor:progress;filter:saturate(.84);}
.submit-button.is-loading .button-arrow {display:none;}
.submit-button.is-loading .button-spinner {display:block;}
.submit-button:disabled {cursor:progress;}
.submit-status {min-height:0;color:#5e779c;text-align:center;font-size:12px;margin:0;}
.submit-status:not(:empty) {margin-top:10px;}
@keyframes spinner {to{transform:rotate(360deg)}}
@keyframes card-arrive {from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}
@media (max-height: 790px) and (min-width: 921px) {.login-layout{padding-top:24px;padding-bottom:24px}.hero-logo{width:78px;max-height:116px;margin-bottom:16px}.hero-tagline{margin-bottom:16px}.feature-list{gap:13px;margin-top:22px}.feature-icon{width:58px;height:58px;flex-basis:58px}.hero-footer{margin-top:25px}.login-card{padding-top:24px;padding-bottom:24px}.card-logo{width:72px;height:103px}.card-intro{margin-bottom:18px}.form-field{margin-bottom:16px}}
@media (max-width:1170px) and (min-width:921px) {.login-layout{padding-inline:42px;gap:38px;grid-template-columns:minmax(0,1fr) clamp(360px,35vw,455px)}.hero h1{font-size:clamp(34px,3.7vw,49px)}.hero-logo{margin-left:40px}.hero-tagline{font-size:16px}.hero-description{font-size:15px}.feature{gap:10px}.feature-icon{flex-basis:54px;width:54px;height:54px}.feature-icon svg{width:27px;height:27px}.feature-list{gap:14px 9px}.hero-footer{white-space:normal}.hero-photo{left:38%;width:19%;height:auto;opacity:.93}}
@media (max-width:920px) {.login-layout{min-height:100svh;grid-template-columns:minmax(0,584px);justify-content:center;gap:25px;padding:32px 20px 42px;align-content:center}.hero{text-align:center;max-width:584px;transform:none}.hero-logo{width:80px;max-height:110px;margin:0 auto 10px}.hero-eyebrow{font-size:11px;letter-spacing:.33em;margin-bottom:5px}.hero h1{font-size:clamp(29px,5vw,43px)}.hero-tagline{font-size:13px;margin:2px 0 0}.hero-description,.feature-list,.hero-footer{display:none}.hero-photo{left:30%;width:40%;height:auto;bottom:2%;opacity:.22}.decor-swirl-one{background-position:61% center}.login-card{margin:0 auto;padding:31px 34px 32px;max-width:500px}.card-logo{width:70px;height:100px}.card-head h2{font-size:27px}.card-intro{margin-bottom:22px}.form-field{margin-bottom:19px}.submit-button{margin-top:22px}}
@media (max-width:520px) {.login-layout{padding:20px 15px 30px;gap:20px}.hero-logo{width:60px;max-height:85px;margin-bottom:7px}.hero-eyebrow{font-size:10px}.hero h1{font-size:30px}.hero-tagline{font-size:11px;letter-spacing:.08em}.login-card{border-radius:20px;padding:24px 22px 25px}.card-logo{width:61px;height:87px}.card-head h2{font-size:24px;margin-top:7px}.card-subtitle{font-size:10.5px}.title-rule{margin:17px auto 13px}.card-intro{font-size:13px;margin-bottom:22px}.form-field{margin-bottom:17px}.form-field label{font-size:12px}.input-frame{min-height:54px;gap:11px}.input-frame input{font-size:14px;height:51px}.field-icon{width:22px;height:22px}.submit-button{height:56px;font-size:15px;margin-top:23px}.decor-dots{left:-30px;top:20px;opacity:.3}}
@media (max-width:370px) {.hero h1{font-size:26px}.login-card{padding-left:15px;padding-right:15px}.desktop-only{display:none}}
@media (prefers-reduced-motion:reduce) {*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}