/* ========================================================== RUTSS V15 — MOBILE NAV + ACCOUNT + PROFILE REPAIR Loaded last on purpose. Desktop design remains unchanged. ========================================================== */ /* Drawer is portaled to by rutss-mobile-v15.js */ .mobile-drawer-backdrop.rutss-v15-mobile-ui{ position:fixed !important; inset:0 !important; width:100vw !important; height:100dvh !important; background:rgba(3,13,25,.62) !important; backdrop-filter:blur(2px); opacity:0; visibility:hidden; pointer-events:none; z-index:2147483000 !important; transition:opacity .2s ease,visibility .2s ease; } .mobile-drawer-backdrop.rutss-v15-mobile-ui.open{ opacity:1 !important; visibility:visible !important; pointer-events:auto !important; } .mobile-drawer.rutss-v15-mobile-ui{ position:fixed !important; top:0 !important; right:0 !important; bottom:0 !important; left:auto !important; width:min(86vw,330px) !important; max-width:330px !important; height:100dvh !important; margin:0 !important; padding:18px !important; box-sizing:border-box !important; overflow:hidden !important; background:#071625 !important; color:#fff !important; transform:translate3d(105%,0,0) !important; opacity:1 !important; visibility:visible !important; z-index:2147483001 !important; box-shadow:-24px 0 65px rgba(0,0,0,.34) !important; transition:transform .24s ease !important; display:flex !important; flex-direction:column !important; } .mobile-drawer.rutss-v15-mobile-ui.open{ transform:translate3d(0,0,0) !important; } html[dir="rtl"] .mobile-drawer.rutss-v15-mobile-ui{ right:auto !important; left:0 !important; transform:translate3d(-105%,0,0) !important; box-shadow:24px 0 65px rgba(0,0,0,.34) !important; } html[dir="rtl"] .mobile-drawer.rutss-v15-mobile-ui.open{ transform:translate3d(0,0,0) !important; } .mobile-drawer.rutss-v15-mobile-ui .mobile-drawer-head{ flex:0 0 auto; padding:0 0 17px !important; margin:0 0 10px !important; } .mobile-drawer.rutss-v15-mobile-ui .mobile-nav{ display:flex !important; flex-direction:column !important; gap:2px !important; flex:1 1 auto !important; overflow-y:auto !important; overflow-x:hidden !important; overscroll-behavior:contain; padding:4px 0 12px !important; } .mobile-drawer.rutss-v15-mobile-ui .mobile-nav a{ display:flex !important; align-items:center !important; width:100% !important; min-height:46px !important; padding:0 10px !important; margin:0 !important; border-radius:9px !important; color:#e8eff7 !important; text-decoration:none !important; font-size:14px !important; font-weight:500 !important; box-sizing:border-box !important; } .mobile-drawer.rutss-v15-mobile-ui .mobile-nav a:hover{ background:#102840 !important; } .mobile-drawer.rutss-v15-mobile-ui .mobile-scan-cta{ flex:0 0 auto !important; width:100% !important; min-height:46px !important; margin:8px 0 0 !important; border-radius:10px !important; } body.rutss-v15-menu-locked{ overflow:hidden !important; } /* ---------------------------------------------------------- ACCOUNT / LOGIN — mobile: AUTH FIRST ---------------------------------------------------------- */ @media(max-width:700px){ .rich-account-shell{ overflow:visible !important; padding:18px 0 38px !important; } .rich-account-shell > .container, .rich-account-grid{ width:calc(100% - 24px) !important; max-width:none !important; margin-left:auto !important; margin-right:auto !important; padding-left:0 !important; padding-right:0 !important; box-sizing:border-box !important; } .rich-account-grid{ display:flex !important; flex-direction:column !important; gap:16px !important; align-items:stretch !important; } /* Requested order: login/register before marketing/benefits */ .rich-account-card{ order:1 !important; width:100% !important; max-width:none !important; min-width:0 !important; margin:0 !important; padding:20px !important; border-radius:18px !important; box-sizing:border-box !important; } .account-experience{ order:2 !important; width:100% !important; min-width:0 !important; } .account-visual-card{ width:100% !important; min-width:0 !important; min-height:0 !important; margin:0 !important; padding:20px !important; border-radius:18px !important; box-sizing:border-box !important; } .account-card-head{ margin-bottom:16px !important; } .account-card-kicker{ font-size:10px !important; font-weight:500 !important; letter-spacing:.08em !important; } .rich-account-card h2{ margin:5px 0 7px !important; font-size:27px !important; line-height:1.15 !important; font-weight:500 !important; } .rich-account-card p{ font-size:13px !important; line-height:1.55 !important; font-weight:400 !important; } .social-auth-stack{ gap:8px !important; } .rich-account-card .social-auth{ width:100% !important; min-height:46px !important; margin:0 !important; border-radius:10px !important; box-sizing:border-box !important; font-size:13px !important; font-weight:500 !important; } .rich-account-tabs{ width:100% !important; grid-template-columns:1fr 1fr !important; } .rich-account-tabs button{ font-size:12px !important; font-weight:500 !important; } .account-access-form{ width:100% !important; min-width:0 !important; } .account-access-form label{ display:block !important; width:100% !important; min-width:0 !important; font-size:11px !important; font-weight:500 !important; } .account-access-form input{ width:100% !important; min-width:0 !important; min-height:45px !important; padding:0 12px !important; box-sizing:border-box !important; font-size:16px !important; /* prevents iOS form zoom */ } .account-access-form .btn{ width:100% !important; min-height:46px !important; font-weight:500 !important; } .account-card-foot{ margin-top:14px !important; padding:12px !important; border-radius:11px !important; } /* Secondary information comes after authentication */ .account-visual-top{ margin-bottom:18px !important; } .account-visual-copy{ margin-top:0 !important; } .account-visual-copy h1{ max-width:none !important; margin:0 !important; font-size:27px !important; line-height:1.2 !important; font-weight:500 !important; } .account-visual-copy p{ margin:10px 0 0 !important; font-size:13px !important; line-height:1.6 !important; } .account-dashboard-preview{ margin-top:18px !important; padding:14px !important; } .account-score-grid{ grid-template-columns:1fr 1fr !important; gap:8px !important; } .rich-benefits{ grid-template-columns:1fr !important; gap:7px !important; } .account-trust-row{ display:flex !important; gap:6px !important; flex-wrap:wrap !important; } } /* ---------------------------------------------------------- PROFILE WORKSPACE — mobile cleanup ---------------------------------------------------------- */ @media(max-width:700px){ .profile-v617{ padding:18px 0 40px !important; overflow:visible !important; } .profile-v617 > .container{ width:calc(100% - 24px) !important; max-width:none !important; margin:0 auto !important; padding:0 !important; box-sizing:border-box !important; } .profile-hero{ width:100% !important; margin:0 0 14px !important; padding:20px !important; gap:16px !important; border-radius:17px !important; box-sizing:border-box !important; } .profile-hero-copy h1{ margin:0 !important; font-size:27px !important; line-height:1.2 !important; font-weight:500 !important; } .profile-hero-copy p{ margin-top:8px !important; font-size:13px !important; line-height:1.55 !important; } .profile-hero-actions{ display:grid !important; grid-template-columns:1fr 1fr !important; gap:8px !important; } .profile-hero-actions .profile-primary-action{ grid-column:1/-1 !important; } .profile-hero-actions a{ width:100% !important; min-height:43px !important; box-sizing:border-box !important; font-weight:500 !important; } .profile-layout-modern{ display:flex !important; flex-direction:column !important; width:100% !important; min-width:0 !important; gap:14px !important; } .profile-side-modern{ position:static !important; width:100% !important; min-width:0 !important; margin:0 !important; padding:18px !important; border-radius:17px !important; box-sizing:border-box !important; } .profile-user-top{ align-items:center !important; } .profile-user-meta h2{ font-size:18px !important; font-weight:500 !important; } .profile-user-meta p{ overflow-wrap:anywhere !important; } .profile-side-stats{ margin:14px 0 !important; } .profile-side-links{ grid-template-columns:1fr !important; } .profile-main{ width:100% !important; min-width:0 !important; } .profile-kpis-modern{ display:grid !important; grid-template-columns:1fr 1fr !important; gap:9px !important; } .profile-kpis-modern article{ min-width:0 !important; min-height:82px !important; padding:13px !important; } .profile-kpis-modern article:last-child{ grid-column:1/-1 !important; } .profile-kpis-modern strong{ font-size:24px !important; font-weight:500 !important; } .profile-grid-modern{ display:grid !important; grid-template-columns:1fr !important; gap:12px !important; } .profile-panel-modern{ width:100% !important; min-width:0 !important; padding:17px !important; box-sizing:border-box !important; } .profile-panel-modern h2{ font-size:19px !important; font-weight:500 !important; } .modern-project-form{ grid-template-columns:1fr !important; } .modern-project-form input, .profile-form-modern input{ width:100% !important; min-width:0 !important; font-size:16px !important; box-sizing:border-box !important; } .modern-project-form .btn, .profile-form-modern .btn{ width:100% !important; } .profile-field-grid{ grid-template-columns:1fr !important; } .modern-report-row{ grid-template-columns:38px minmax(0,1fr) auto !important; } .report-open{ display:none !important; } } @media(max-width:390px){ .profile-kpis-modern{ grid-template-columns:1fr !important; } .profile-kpis-modern article:last-child{ grid-column:auto !important; } .profile-hero-actions{ grid-template-columns:1fr !important; } .profile-hero-actions .profile-primary-action{ grid-column:auto !important; } }