/* ── Figma Design System — Медтехника Платформа 2026 ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
--green:#16a34a;--green-light:#e9f8ef;--green-soft:#f3fbf6;
--blue:#2f6df6;--blue-soft:#edf4ff;
--purple:#7d3df2;--purple-soft:#f3edff;
--orange:#f4b53f;--orange-soft:#fff5e5;
--red:#ef4444;--red-soft:#fff0f0;
--text:#17233c;--muted:#667085;--border:#e5e7eb;--bg:#f7f8fa;
--shadow:0 1px 3px rgba(0,0,0,.06);
--sidebar-w:265px;--radius:12px;--radius-sm:8px;
}
body{font-family:system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--text);line-height:1.5}
a{color:var(--green);text-decoration:none}
svg{stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}

/* ── Layout ── */
.wrapper{display:flex;min-height:100vh}

/* ── Sidebar ── */
.sidebar{width:var(--sidebar-w);border-right:1px solid var(--border);background:#fff;display:flex;flex-direction:column;position:fixed;top:0;left:0;bottom:0;z-index:100}
.logo{padding:22px 28px;border-bottom:1px solid var(--border)}
.logo-wrap{display:flex;gap:14px;align-items:center}
.logo-icon{width:38px;height:auto;color:var(--green);object-fit:contain}
.logo h2{font-size:20px;line-height:1.1}
.logo small{color:var(--green);display:block;margin-top:4px;font-size:13px;font-weight:600}
.menu{padding:18px;flex:1;overflow-y:auto}
.menu-title{font-size:12px;font-weight:700;color:#5c6d91;text-transform:uppercase;margin:22px 10px 12px}
.nav-item{display:flex;align-items:center;gap:14px;padding:14px;border-radius:var(--radius-sm);color:#18346f;text-decoration:none;margin-bottom:6px;transition:.25s;font-weight:500;cursor:pointer;font-size:15px}
.nav-item:hover{background:#f5f7f8}
.nav-item.active{background:#e8f7ef;color:var(--green);font-weight:700}
.nav-item svg{width:22px;height:22px;flex-shrink:0}
.sidebar-footer{margin-top:auto;padding:22px;border-top:1px solid var(--border)}
.version{color:#6f7e9d;font-size:14px;line-height:1.8;margin-top:18px;padding:0 10px}

/* ── Main ── */
.main{flex:1;margin-left:var(--sidebar-w);padding:22px 28px;background:var(--bg);min-height:100vh}

/* ── Topbar ── */
.topbar{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:26px}
.page-title h1{font-size:26px;font-weight:800;line-height:1.2;margin-bottom:4px}
.page-title p{color:#7c89a8;font-size:15px;margin-top:4px}
.top-actions{display:flex;align-items:center;gap:18px}
.search{width:290px;height:44px;border:1px solid var(--border);border-radius:var(--radius-sm);background:#fff;display:flex;align-items:center;padding:0 14px;gap:10px;color:#8fa0be}
.search input{border:none;outline:none;flex:1;font-size:14px;background:transparent}
.icon-btn{position:relative;width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#203a71}
.badge{position:absolute;top:2px;right:0;width:18px;height:18px;border-radius:50%;background:#ff3434;color:#fff;font-size:11px;display:flex;align-items:center;justify-content:center}
.profile{display:flex;align-items:center;gap:14px}
.avatar{width:48px;height:48px;border-radius:50%;background:#e9f8ef;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:24px;color:var(--green)}
.profile-info strong{display:block;font-size:15px}
.profile-info span{color:#5d6880;font-size:14px}

/* ── Cards ── */
.card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
.card-header{padding:20px 22px 0;display:flex;justify-content:space-between;align-items:center}
.card-title{font-size:18px;font-weight:700}
.card-body{padding:20px 22px}
.dots{width:22px;color:#55688e;flex-shrink:0}

/* ── Buttons ── */
.btn{height:44px;border:none;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;gap:10px;font-size:15px;font-weight:700;cursor:pointer;transition:.25s;padding:0 20px}
.btn svg{width:18px;height:18px}
.btn-green{background:var(--green);color:#fff}
.btn-blue{background:var(--blue);color:#fff}
.btn-purple{background:var(--purple);color:#fff}
.btn-outline{background:#fff;border:1px solid #d7dce4;color:#46546f}
.btn-sm{height:34px;padding:0 14px;font-size:13px}

/* ── Tables ── */
.table-card{margin-top:18px;overflow:hidden}
.table-header{padding:20px 22px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border)}
.table-header strong{font-size:16px}
.table-wrap{padding:0 22px 18px}
table{width:100%;border-collapse:collapse;font-size:14px}
th{text-align:left;padding:12px 10px;color:var(--muted);font-weight:700;font-size:13px;border-bottom:1px solid #edf0f2}
td{padding:14px 10px;border-bottom:1px solid #f0f2f4;color:#334766}
tr:hover td{background:#fafbfc}
.table-footer{padding:18px 22px;display:flex;justify-content:space-between;align-items:center;font-size:14px;color:var(--muted)}
.pagination{display:flex;gap:8px}
.page{width:34px;height:34px;border-radius:var(--radius-sm);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:14px;cursor:pointer}
.page.active{background:var(--green);border-color:var(--green);color:#fff}

/* ── Status ── */
.status{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:700}
.status-success{background:#ebf8ef;color:#199a48}
.status-error{background:#fff0f0;color:#e23f3f}
.status-warning{background:#fff7e8;color:#f59e0b}
.status-pending{background:#eef4ff;color:#2563eb}
.status-badge{display:inline-flex;padding:5px 10px;border-radius:6px;font-size:12px;font-weight:700}
.status-badge.active{background:#e8f8ee;color:var(--green)}
.status-badge.archived{background:#eef1f4;color:#56627a}

/* ── Side Stats ── */
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin-bottom:26px}
.stat-card{padding:22px}
.stat-top{display:flex;justify-content:space-between;align-items:flex-start}
.stat-icon{width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center}
.stat-icon svg{width:28px;height:28px}
.stat-icon.green-bg{background:var(--green-soft);color:var(--green)}
.stat-icon.orange-bg{background:var(--orange-soft);color:var(--orange)}
.stat-icon.red-bg{background:var(--red-soft);color:var(--red)}
.stat-icon.blue-bg{background:var(--blue-soft);color:var(--blue)}
.stat-icon.purple-bg{background:var(--purple-soft);color:var(--purple)}
.stat-label{font-size:14px;color:#5d6f93;margin-top:12px}
.stat-number{font-size:54px;font-weight:800;line-height:1;margin:10px 0}
.stat-desc{color:#6f7e9d;font-size:14px}
.green-t{color:var(--green)}.orange-t{color:var(--orange)}.red-t{color:var(--red)}

/* ── Progress / Circle ── */
.circle{width:210px;height:210px;border-radius:50%;display:flex;align-items:center;justify-content:center}
.circle-inner{width:160px;height:160px;background:#fff;border-radius:50%;display:flex;flex-direction:column;justify-content:center;align-items:center}
.circle-inner strong{font-size:58px;line-height:1}
.circle-inner span{margin-top:10px;color:#394c78}
.big-number{font-size:60px;font-weight:800;line-height:1}
.sub{color:#273b69;font-size:16px;margin-top:10px}
.progress-line{display:flex;gap:5px;margin:28px 0}
.progress-line span{width:18px;height:18px;border-radius:4px;background:#e6ebf3}
.progress-line span.active{background:var(--green)}
.legend{display:flex;gap:30px;color:#5d6f93;font-size:14px}
.legend i{width:12px;height:12px;border-radius:50%;display:inline-block;margin-right:8px}
.update{color:#6f7e9d;display:flex;align-items:center;gap:10px;margin-top:24px}

/* ── Events ── */
.events{padding:22px}
.event{display:flex;justify-content:space-between;margin:18px 0}
.event-left{display:flex;gap:14px}
.event-title{font-weight:700;margin-bottom:4px}
.event-sub{color:#6d7c9b}
.event-time{color:#5f7298;text-align:right;font-weight:600}

/* ── Quick Links ── */
.links{padding:22px}
.link-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.quick{border:1px solid var(--border);border-radius:14px;padding:18px;display:flex;gap:14px;align-items:flex-start}
.quick h5{color:#168f57;margin-bottom:4px;font-size:16px}
.quick p{color:#6f7e9d;font-size:14px}

/* ── Sidebar Content Grid ── */
.grid{display:grid;grid-template-columns:2fr 1.8fr;gap:20px}
.lower{margin-top:20px;display:grid;grid-template-columns:1.6fr 1.1fr;gap:20px}

/* ── Two Column ── */
.content-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:22px}

/* ── Action Grid ── */
.action-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding:20px 22px}
.action-box{border:1px solid var(--border);border-radius:16px;padding:26px;text-align:center}
.action-box h4{margin-top:20px}
.action-box p{margin-top:10px;color:#6d7c9b;line-height:1.6}

/* ── Forms ── */
.form-group{margin-bottom:16px}
.form-group label{display:block;font-size:13px;font-weight:700;margin-bottom:6px;color:#42547a}
.form-control{width:100%;height:40px;border:1px solid #dfe6f1;border-radius:var(--radius-sm);padding:0 12px;font-size:14px;background:#fff;outline:none}
.form-control:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(22,163,74,.12)}
textarea.form-control{height:auto;padding:10px 12px;resize:vertical;min-height:80px}
select.form-control{appearance:none}

/* ── Filters ── */
.filters{display:grid;grid-template-columns:200px 180px 200px 1fr 140px;gap:14px;margin-bottom:24px}
.field{height:44px;border:1px solid #dde5f0;border-radius:var(--radius-sm);display:flex;align-items:center;padding:0 14px;justify-content:space-between;background:#fff;gap:10px}
.field span{font-size:14px;color:#2f436d}
.field svg{width:18px;height:18px;color:#6d7a97;flex-shrink:0}

/* ── File Upload ── */
.upload-zone{border:2px dashed #d1d5db;border-radius:var(--radius);padding:3rem 2rem;text-align:center;cursor:pointer;transition:.2s}
.upload-zone:hover{border-color:var(--green);background:var(--green-soft)}
.upload-text{font-size:1rem;color:#475569}

/* ── Alerts ── */
.alert{padding:14px 18px;border-radius:var(--radius-sm);font-size:14px;margin-bottom:18px;display:flex;align-items:center;gap:10px}
.alert-success{background:#f0fdf4;color:#166534;border:1px solid #bbf7d0}
.alert-error{background:#fef2f2;color:#991b1b;border:1px solid #fecaca}

/* ── State ── */
.empty-state{text-align:center;padding:3rem;color:var(--muted)}
.empty-state svg{width:48px;height:48px;color:#cbd5e1;margin-bottom:1rem}
.empty-state p{font-size:14px}

/* ── Tabs ── */
.tabs{display:flex;gap:32px;border-bottom:1px solid var(--border);margin-bottom:0;padding:0 22px}
.tab{padding:14px 0;font-size:14px;font-weight:600;color:#5d6f93;cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-1px;transition:.2s}
.tab:hover{color:var(--text)}
.tab.active{color:var(--green);border-bottom-color:var(--green)}
.tab-content{display:none;padding:22px}
.tab-content.active{display:block}

/* ── Auth ── */
.auth-page{background:#f5f7fb;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}
.auth-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:36px;width:400px;max-width:100%;box-shadow:var(--shadow)}
.auth-card h1{text-align:center;font-size:24px;margin-bottom:6px}
.auth-card p{text-align:center;color:var(--muted);margin-bottom:20px;font-size:14px}
.auth-logo{display:block;margin:0 auto 16px;width:100px;height:auto}
@media(max-width:480px){
.auth-card{padding:24px 20px}
.auth-logo{width:80px}
.auth-card h1{font-size:20px}
}

/* ── Validation ── */
.validation-grid{display:grid;grid-template-columns:repeat(4,1fr);padding:20px;gap:0}
.validation-item{display:flex;align-items:center;gap:16px;padding:10px 14px;border-right:1px solid #eef0f3}
.validation-item:last-child{border-right:none}
.validation-icon{width:48px;height:48px;background:#eefaf2;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--green)}
.validation-icon svg{width:24px;height:24px}
.validation-title{font-size:13px;color:var(--muted)}
.validation-value{font-size:18px;font-weight:800;color:var(--green)}
.notice{background:#eef9f2;border:1px solid #d9f0df;border-radius:var(--radius-sm);padding:12px 16px;display:flex;align-items:center;gap:10px;font-size:14px;margin:0 20px 20px}
.notice svg{width:18px;height:18px;color:var(--green);flex-shrink:0}

/* ── Three-dot dropdown ── */
.dots-wrap{position:relative;display:inline-flex}
.dots{cursor:pointer;padding:4px;border-radius:6px;transition:.2s;color:#55688e;flex-shrink:0;line-height:1}
.dots:hover{background:#f0f2f5;color:#203a71}
.dots svg{width:20px;height:20px;display:block}
.dot-menu{position:absolute;top:100%;right:0;min-width:200px;background:#fff;border:1px solid var(--border);border-radius:var(--radius-sm);box-shadow:0 8px 24px rgba(0,0,0,.1);z-index:200;display:none;padding:6px;margin-top:4px}
.dot-menu.open{display:block}
.dot-menu-item{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:6px;font-size:14px;font-weight:500;color:var(--text);text-decoration:none;cursor:pointer;transition:.15s;border:none;background:none;width:100%;text-align:left}
.dot-menu-item:hover{background:#f5f7fa;color:var(--green)}
.dot-menu-item svg{width:18px;height:18px;flex-shrink:0;color:#55688e}
.dot-menu-item.danger{color:var(--red)}
.dot-menu-item.danger:hover{background:#fff0f0;color:var(--red)}
.dot-menu-divider{height:1px;background:var(--border);margin:4px 8px}

/* ── Sidebar toggle ── */
.sidebar-toggle{position:absolute;top:50%;right:-14px;width:28px;height:28px;border-radius:50%;background:#fff;border:1px solid var(--border);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:150;box-shadow:var(--shadow);color:#55688e;transform:translateY(-50%);transition:.3s}
.sidebar-toggle:hover{color:var(--green);border-color:var(--green)}
.sidebar-toggle svg{width:14px;height:14px;transition:transform .3s}
.sidebar.collapsed .sidebar-toggle svg{transform:rotate(180deg)}
.sidebar.collapsed{width:60px}
.sidebar.collapsed .logo{padding:14px 10px}
.sidebar.collapsed .logo-wrap{gap:0;justify-content:center}
.sidebar.collapsed .logo h2{display:none}
.sidebar.collapsed .logo small{display:none}
.sidebar.collapsed .logo-icon{width:30px;height:36px}
.sidebar.collapsed .menu-title{display:none}
.sidebar.collapsed .nav-item{justify-content:center;padding:12px 0;font-size:0;gap:0}
.sidebar.collapsed .nav-item svg{width:22px;height:22px}
.sidebar.collapsed .version{display:none}
.sidebar.collapsed .sidebar-footer{padding:12px 0;display:flex;flex-direction:column;align-items:center}
.sidebar.collapsed ~ .main{margin-left:60px}
.sidebar.collapsed + .main{margin-left:60px}

/* ── Collapsible block ── */
.collapsible-header{display:flex;justify-content:space-between;align-items:center;cursor:pointer;user-select:none}
.collapsible-header:hover{opacity:.85}
.collapsible-body{overflow:hidden;transition:max-height .3s ease}
.collapsible-body.closed{max-height:0 !important;padding-top:0 !important;padding-bottom:0 !important;margin:0 !important}

/* ── Compact sidebar ── */
.sidebar .menu{padding:10px 12px}
.sidebar .menu-title{margin:14px 8px 8px}
.sidebar .nav-item{padding:10px 12px;margin-bottom:2px;font-size:14px}
.sidebar .logo{padding:14px 20px}
.sidebar .logo-icon{width:32px;height:40px}
.sidebar .logo h2{font-size:17px}
.sidebar .logo small{font-size:11px;margin-top:2px}
.sidebar .sidebar-footer{padding:14px 16px}
.sidebar .version{font-size:12px;margin-top:10px}

/* ── Fix input overflow ── */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px 28px;width:100%}
.form-grid > div{min-width:0}
.form-grid .form-control{width:100%;max-width:100%}

/* ── Top-actions dropdown ── */
.topbar .dots-wrap{position:relative}
.topbar .dot-menu{right:0;left:auto}
.switch-row{display:flex;justify-content:space-between;align-items:center;padding:14px 0}
.switch-text strong{display:block;font-size:14px;margin-bottom:2px}
.switch-text span{font-size:12px;color:#7c8ca7}
.switch{width:34px;height:20px;border-radius:20px;background:#e1e7ef;position:relative;flex-shrink:0}
.switch.on{background:var(--green)}
.switch::after{content:'';width:16px;height:16px;background:#fff;border-radius:50%;position:absolute;top:2px;left:2px}
.switch.on::after{left:16px}

/* ── File Bar ── */
.bar{width:110px;height:10px;background:#edf1f7;border-radius:999px;overflow:hidden;display:inline-block;vertical-align:middle}
.bar span{display:block;height:100%}

/* ── Profile dropdown ── */
.profile{position:relative;cursor:pointer;user-select:none}
.profile-info{cursor:pointer}
.profile-dropdown{position:absolute;top:100%;right:0;min-width:240px;background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 8px 30px rgba(0,0,0,.1);z-index:300;display:none;margin-top:10px;padding:8px;overflow:hidden}
.profile-dropdown.open{display:block}
.profile-dropdown .pd-header{display:flex;align-items:center;gap:14px;padding:14px;border-bottom:1px solid var(--border);margin-bottom:4px}
.profile-dropdown .pd-header .avatar{width:42px;height:42px;font-size:18px}
.profile-dropdown .pd-header .pd-name{font-weight:700;font-size:15px}
.profile-dropdown .pd-header .pd-role{font-size:13px;color:var(--muted)}
.profile-dropdown .pd-item{display:flex;align-items:center;gap:14px;padding:12px 14px;border-radius:8px;font-size:14px;color:var(--text);text-decoration:none;cursor:pointer;transition:.15s;border:none;background:none;width:100%;text-align:left;font-weight:500}
.profile-dropdown .pd-item:hover{background:#f5f7fa;color:var(--green)}
.profile-dropdown .pd-item svg{width:18px;height:18px;flex-shrink:0;color:#55688e}
.profile-dropdown .pd-item.danger{color:var(--red)}
.profile-dropdown .pd-item.danger:hover{background:#fff0f0;color:var(--red)}
.profile-dropdown .pd-divider{height:1px;background:var(--border);margin:4px 8px}
.avatar-person{width:48px;height:48px;border-radius:50%;background:#e9f8ef;display:flex;align-items:center;justify-content:center;color:var(--green);flex-shrink:0}
.avatar-person svg{width:26px;height:26px}
.profile .avatar{transition:.2s}
.profile:hover .avatar{border:2px solid var(--green)}

/* ── Notification dropdown ── */
.icon-btn.notif{position:relative;cursor:pointer}
.notif-dropdown{position:absolute;top:100%;right:0;min-width:320px;max-height:400px;overflow-y:auto;background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 8px 30px rgba(0,0,0,.1);z-index:300;display:none;margin-top:10px;padding:8px}
.notif-dropdown.open{display:block}
.notif-dropdown .nd-header{padding:12px 14px 8px;font-weight:700;font-size:15px;color:var(--text);border-bottom:1px solid var(--border);margin-bottom:4px}
.notif-dropdown .nd-item{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border-radius:8px;font-size:13px;color:var(--text);transition:.15s;cursor:default}
.notif-dropdown .nd-item:hover{background:#f9fafb}
.notif-dropdown .nd-item .nd-icon{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.notif-dropdown .nd-item .nd-icon svg{width:16px;height:16px}
.notif-dropdown .nd-item .nd-title{font-weight:600;margin-bottom:2px}
.notif-dropdown .nd-item .nd-time{color:var(--muted);font-size:12px}
.notif-dropdown .nd-empty{padding:24px 14px;text-align:center;color:var(--muted);font-size:14px}
.nd-icon.green{background:var(--green-light);color:var(--green)}
.nd-icon.orange{background:var(--orange-soft);color:var(--orange)}
.nd-icon.blue{background:var(--blue-soft);color:var(--blue)}
.nd-icon.red{background:var(--red-soft);color:var(--red)}
.notif-badge{position:absolute;top:2px;right:0;width:18px;height:18px;border-radius:50%;background:#ff3434;color:#fff;font-size:11px;display:flex;align-items:center;justify-content:center;font-weight:700}

/* ── Search expand ── */
.search{width:240px;height:44px;border:1px solid var(--border);border-radius:var(--radius-sm);background:#fff;display:flex;align-items:center;padding:0 14px;gap:10px;color:#8fa0be;transition:all .3s ease;position:relative}
.search:focus-within{border-color:var(--green);box-shadow:0 0 0 3px rgba(22,163,74,.1);width:360px}
.search input{border:none;outline:none;flex:1;font-size:14px;background:transparent;color:var(--text)}
.search .search-icon{flex-shrink:0;transition:transform .3s ease}
.search:focus-within .search-icon{transform:scale(1.15);color:var(--green)}
.search .search-clear{display:none;border:none;background:none;cursor:pointer;color:#8fa0be;padding:4px;border-radius:50%}
.search .search-clear:hover{color:var(--text);background:#f0f2f5}
.search.has-text .search-clear{display:flex}

/* ── Dashboard card fix ── */
.stat-card .stat-top{padding:0}
.stat-card .stat-label{padding:0 4px}
.stat-card .stat-number{padding:0 4px}
.stat-card .stat-desc{padding:0 4px}

/* ── Side card padding fix ── */
.side-card{padding:20px 22px}
.side-card .ring{margin:0 auto}
.side-card .legend{display:flex;flex-direction:column;gap:8px}
.side-card .legend .dot{width:10px;height:10px;border-radius:50%;display:inline-block;margin-right:6px}
.side-card .upload{display:flex;gap:14px;align-items:center}

/* ── Responsive ── */
@media(max-width:768px){
.sidebar{width:100%;position:relative}
.main{margin-left:0}.wrapper{flex-direction:column}
.grid,.lower,.stats-grid,.content-grid,.link-grid,.action-grid,.validation-grid,.filters{grid-template-columns:1fr}
.filters .field{width:100%}
.ring{width:155px;height:155px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:conic-gradient(#14a44d 0 75%,#f5a623 75% 85%,#ef4444 85% 92%,#3b82f6 92% 100%)}
.ring-inner{width:110px;height:110px;background:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column}
.ring-inner strong{font-size:48px;line-height:1}
.upload{display:flex;gap:14px;align-items:flex-start}
.upload-icon{width:40px;height:40px;border-radius:10px;background:#e8f8ee;display:flex;align-items:center;justify-content:center;color:var(--green);flex-shrink:0}
}
@media(max-width:480px){
.main{padding:16px}.page-title h1{font-size:24px}
}