/* K-Vault premium interface layer — loaded after all legacy styles. */
:root {
  --ui-bg: #f5f7fb;
  --ui-panel: rgba(255, 255, 255, .88);
  --ui-panel-solid: #fff;
  --ui-ink: #172033;
  --ui-muted: #68738a;
  --ui-line: #e6eaf1;
  --ui-brand: #6d5dfc;
  --ui-brand-deep: #5145e5;
  --ui-cyan: #16b8c8;
  --ui-soft: #f0efff;
  --ui-radius: 18px;
  --ui-radius-lg: 28px;
  --ui-shadow: 0 18px 45px rgba(34, 42, 72, .08);
  --ui-shadow-hover: 0 24px 60px rgba(34, 42, 72, .14);
}
[data-theme="dark"] {
  --ui-bg: #0c1019;
  --ui-panel: rgba(21, 27, 40, .88);
  --ui-panel-solid: #151b28;
  --ui-ink: #f4f6fb;
  --ui-muted: #9ca6ba;
  --ui-line: #293244;
  --ui-brand: #9187ff;
  --ui-brand-deep: #7468ff;
  --ui-cyan: #35cad7;
  --ui-soft: rgba(109, 93, 252, .14);
  --ui-shadow: 0 18px 45px rgba(0, 0, 0, .22);
  --ui-shadow-hover: 0 24px 60px rgba(0, 0, 0, .34);
}

html, body { background: var(--ui-bg) !important; color: var(--ui-ink) !important; }
body::before { content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(circle at 12% 0, rgba(109,93,252,.10), transparent 30rem), radial-gradient(circle at 92% 12%, rgba(22,184,200,.08), transparent 28rem); }
.app-content { min-width: 0; }

/* Global component language */
.el-button { min-height: 40px; padding: 10px 18px; border-radius: 11px !important; letter-spacing: .01em; transition: transform .18s ease, box-shadow .18s ease, filter .18s ease !important; }
.el-button:not(.is-disabled):hover { transform: translateY(-1px) !important; }
.el-button--primary { border: 0 !important; background: linear-gradient(135deg, var(--ui-brand), var(--ui-brand-deep)) !important; box-shadow: 0 8px 20px rgba(109,93,252,.22) !important; }
.el-button--default { border-color: var(--ui-line) !important; background: var(--ui-panel-solid) !important; color: var(--ui-ink) !important; }
.el-input__inner, .el-textarea__inner { border: 1px solid var(--ui-line) !important; border-radius: 12px !important; background: color-mix(in srgb, var(--ui-panel-solid) 92%, var(--ui-bg)) !important; color: var(--ui-ink) !important; transition: border-color .2s, box-shadow .2s, background .2s !important; }
.el-input__inner { height: 46px; }
.el-input__inner:focus, .el-textarea__inner:focus { border-color: var(--ui-brand) !important; background: var(--ui-panel-solid) !important; box-shadow: 0 0 0 4px rgba(109,93,252,.11) !important; }
.el-form-item__label { color: var(--ui-ink) !important; font-weight: 650; }
.el-card, .el-dialog, .el-dropdown-menu { background: var(--ui-panel-solid) !important; border-color: var(--ui-line) !important; color: var(--ui-ink) !important; }
.el-dialog { border-radius: 22px !important; box-shadow: 0 30px 90px rgba(20,25,44,.22) !important; }
.el-dialog__title { color: var(--ui-ink) !important; font-weight: 750; }
.el-tabs__nav-wrap::after { height: 1px !important; background: var(--ui-line) !important; }
.el-tabs__item { height: 48px; color: var(--ui-muted) !important; font-weight: 650; }
.el-tabs__item.is-active { color: var(--ui-brand) !important; }
.el-tabs__active-bar { height: 3px !important; border-radius: 3px; background: linear-gradient(90deg, var(--ui-brand), var(--ui-cyan)) !important; }
.el-table, .el-table th, .el-table tr { background: transparent !important; color: var(--ui-ink) !important; }
.el-table th { color: var(--ui-muted) !important; font-weight: 700; }
.el-table td, .el-table th.is-leaf { border-color: var(--ui-line) !important; }
.el-table--enable-row-hover .el-table__body tr:hover > td { background: var(--ui-soft) !important; }
.el-pagination button, .el-pager li { background: transparent !important; color: var(--ui-muted) !important; }
.el-pager li.active { color: var(--ui-brand) !important; }
.el-message { border: 1px solid var(--ui-line) !important; border-radius: 14px !important; box-shadow: var(--ui-shadow) !important; }

/* Shell */
.app-header { border-bottom: 1px solid rgba(230,234,241,.75) !important; background: color-mix(in srgb, var(--ui-panel-solid) 78%, transparent) !important; backdrop-filter: blur(22px) saturate(140%) !important; }
.header-inner { padding-inline: 28px !important; }
.logo { font-size: 22px !important; color: var(--ui-ink) !important; }
.logo::before { width: 11px; height: 11px; background: linear-gradient(135deg, var(--ui-brand), var(--ui-cyan)); }
.header-btn, .user-menu { transition: background .2s, transform .2s !important; }
.header-btn:hover, .user-menu:hover { transform: translateY(-1px); background: var(--ui-soft) !important; }
.app-sidebar { padding: 22px 14px !important; border-right-color: var(--ui-line) !important; background: color-mix(in srgb, var(--ui-panel-solid) 90%, transparent) !important; }
.sidebar-item { height: 46px !important; margin-bottom: 4px !important; border-radius: 13px !important; }
.sidebar-item.active { color: var(--ui-brand) !important; background: linear-gradient(90deg, var(--ui-soft), transparent) !important; box-shadow: inset 3px 0 var(--ui-brand) !important; }

/* Authentication */
.guest-layout .app-content { padding: 0 !important; }
.auth-page { min-height: calc(100vh - var(--header-h)) !important; padding: 38px !important; display: grid !important; place-items: center; }
.auth-shell { width: min(1080px, 100%); min-height: min(650px, calc(100vh - 140px)); display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(380px, .88fr); overflow: hidden; border: 1px solid rgba(255,255,255,.55); border-radius: 32px; background: var(--ui-panel-solid); box-shadow: 0 35px 100px rgba(37,43,72,.15); }
.auth-showcase { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; justify-content: center; padding: 64px; color: #fff; background: linear-gradient(145deg, #252444 0%, #5145e5 55%, #19aebe 120%); }
.auth-showcase::before, .auth-showcase::after { content: ''; position: absolute; z-index: -1; border-radius: 50%; filter: blur(1px); }
.auth-showcase::before { width: 360px; height: 360px; right: -130px; top: -100px; background: rgba(255,255,255,.12); }
.auth-showcase::after { width: 260px; height: 260px; left: -80px; bottom: -110px; border: 60px solid rgba(255,255,255,.07); }
.auth-brand-mark { width: 54px; height: 54px; display: grid; place-items: center; margin-bottom: 34px; border: 1px solid rgba(255,255,255,.25); border-radius: 17px; background: rgba(255,255,255,.14); box-shadow: inset 0 1px rgba(255,255,255,.2); font-size: 24px; backdrop-filter: blur(12px); }
.auth-kicker { margin-bottom: 16px; font-size: 11px; font-weight: 800; letter-spacing: .18em; opacity: .7; }
.auth-showcase h1 { max-width: 520px; margin: 0; font-size: clamp(40px, 4.5vw, 62px); line-height: 1.08; letter-spacing: -.055em; }
.auth-showcase > p { max-width: 480px; margin-top: 24px; font-size: 15px; line-height: 1.85; color: rgba(255,255,255,.72); }
.auth-feature-list { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 38px; }
.auth-feature-list span { display: inline-flex; align-items: center; gap: 7px; padding: 9px 13px; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; background: rgba(255,255,255,.10); font-size: 12px; backdrop-filter: blur(10px); }
.auth-card { max-width: none !important; padding: 64px 54px !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; display: flex; flex-direction: column; justify-content: center; background: var(--ui-panel-solid) !important; }
.auth-card::before { display: none !important; }
.auth-card-head { margin-bottom: 32px; }
.auth-mobile-brand { display: none; color: var(--ui-brand); font-size: 13px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.auth-title { margin: 0 0 10px !important; color: var(--ui-ink) !important; background: none !important; -webkit-text-fill-color: currentColor !important; text-align: left !important; font-size: 32px !important; letter-spacing: -.04em; }
.auth-subtitle { margin: 0 !important; color: var(--ui-muted) !important; text-align: left !important; font-size: 14px !important; }
.auth-card .el-form-item { margin-bottom: 20px !important; }
.auth-card .el-form-item__label { padding-bottom: 6px; line-height: 20px; font-size: 13px; }
.auth-card .el-input__inner { height: 50px !important; padding-left: 42px; }
.auth-submit-item { margin-top: 8px !important; margin-bottom: 0 !important; }
.auth-submit { width: 100%; min-height: 50px !important; font-size: 15px; }
.auth-divider { display: flex; align-items: center; gap: 14px; margin: 28px 0 18px; color: var(--ui-muted); font-size: 12px; }
.auth-divider::before, .auth-divider::after { content: ''; flex: 1; height: 1px; background: var(--ui-line); }
.auth-links { margin: 0 !important; text-align: center; }
.auth-links a { display: inline-flex; align-items: center; gap: 6px; color: var(--ui-brand) !important; font-weight: 700; }
.invite-info { margin-top: 8px; padding: 9px 12px !important; border-radius: 9px; background: rgba(16,185,129,.09); color: #059669 !important; }

/* Home and discovery */
.home-page, .discover-page { max-width: 1460px !important; }
.home-announcement { border: 0 !important; border-left: 3px solid var(--ui-brand) !important; border-radius: 14px !important; background: var(--ui-panel) !important; box-shadow: 0 8px 24px rgba(34,42,72,.05) !important; }
.welcome-card { min-height: 360px !important; padding: 58px !important; border: 0 !important; border-radius: var(--ui-radius-lg) !important; background: linear-gradient(125deg, #25243f 0%, #5145e5 58%, #16a8b9 130%) !important; color: #fff !important; box-shadow: 0 28px 70px rgba(57,54,139,.24) !important; }
.welcome-card::before { display: block !important; content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 85% 15%, rgba(255,255,255,.18), transparent 24rem); pointer-events: none; }
.welcome-card h3 { color: #fff !important; letter-spacing: -.05em; }
.welcome-card > p { color: rgba(255,255,255,.7) !important; }
.hero-eyebrow { color: #c7f8ff !important; }
.hero-pills span { border-color: rgba(255,255,255,.14) !important; background: rgba(255,255,255,.10) !important; color: rgba(255,255,255,.82) !important; }
.welcome-btn { background: #fff !important; color: #4136c8 !important; box-shadow: 0 10px 30px rgba(0,0,0,.16) !important; }
.feed-grid { gap: 22px !important; }
.feed-card { overflow: hidden; border: 1px solid var(--ui-line) !important; border-radius: 19px !important; background: var(--ui-panel-solid) !important; box-shadow: 0 8px 24px rgba(34,42,72,.045) !important; }
.feed-card:hover { border-color: rgba(109,93,252,.28) !important; box-shadow: var(--ui-shadow-hover) !important; transform: translateY(-6px) !important; }
.feed-cover { aspect-ratio: 4 / 3 !important; }
.feed-cover::after { content: ''; position: absolute; inset: auto 0 0; height: 35%; pointer-events: none; background: linear-gradient(transparent, rgba(10,14,25,.18)); }
.feed-body { padding: 15px 16px 16px !important; }
.feed-title { color: var(--ui-ink); font-size: 14px !important; line-height: 1.5; }
.feed-meta { color: var(--ui-muted); }
.discover-search { padding: 12px !important; border: 1px solid var(--ui-line) !important; border-radius: 17px !important; background: var(--ui-panel-solid) !important; box-shadow: var(--ui-shadow) !important; }
.discover-search .el-input__inner { height: 54px !important; border: 0 !important; background: transparent !important; box-shadow: none !important; font-size: 15px; }
.section { padding: 24px; border: 1px solid var(--ui-line); border-radius: var(--ui-radius); background: var(--ui-panel); }
.section-title { color: var(--ui-ink); }
.hot-tag, .user-card, .tag-result-item { border-color: var(--ui-line) !important; background: var(--ui-panel-solid) !important; transition: transform .2s, border-color .2s, box-shadow .2s; }
.hot-tag:hover, .user-card:hover, .tag-result-item:hover { transform: translateY(-2px); border-color: rgba(109,93,252,.35) !important; box-shadow: var(--ui-shadow); }

/* Profile */
.profile-page { max-width: 1100px !important; }
.profile-header { border: 0 !important; border-radius: 24px !important; box-shadow: var(--ui-shadow) !important; }
.profile-banner { min-height: 240px !important; background-color: #383563; background-image: linear-gradient(120deg, #2f2d52, #6558ea 62%, #19a9b9) !important; }
.profile-info { position: relative; padding: 0 32px 32px !important; }
.profile-avatar-wrap { filter: drop-shadow(0 10px 18px rgba(30,35,60,.18)); }
.profile-name { color: var(--ui-ink); letter-spacing: -.035em; }
.profile-username, .profile-bio, .stat-label { color: var(--ui-muted) !important; }
.profile-stats { padding: 16px 0; border-block: 1px solid var(--ui-line); }
.stat-num { color: var(--ui-ink); }
.btn-follow, .btn-outline { min-height: 40px; padding: 0 17px; border-radius: 11px !important; }
.btn-follow { border: 0 !important; background: linear-gradient(135deg, var(--ui-brand), var(--ui-brand-deep)) !important; box-shadow: 0 8px 18px rgba(109,93,252,.2); }
.btn-outline { border-color: var(--ui-line) !important; background: var(--ui-panel-solid) !important; color: var(--ui-ink) !important; }
.profile-content { margin-top: 18px; border-radius: 20px !important; box-shadow: var(--ui-shadow) !important; }

/* Publish and settings */
.publish-page, .settings-page { max-width: 960px !important; }
.publish-title, .settings-title { margin-bottom: 20px !important; color: var(--ui-ink) !important; font-size: 30px !important; letter-spacing: -.04em; }
.publish-form, .settings-page > .el-tabs { padding: 30px !important; border: 1px solid var(--ui-line) !important; border-radius: 22px !important; background: var(--ui-panel-solid) !important; box-shadow: var(--ui-shadow) !important; }
.el-upload--picture-card, .el-upload-dragger { border: 1px dashed rgba(109,93,252,.42) !important; border-radius: 16px !important; background: var(--ui-soft) !important; }
.el-upload-dragger:hover { border-color: var(--ui-brand) !important; }
.tag-input-wrap, .invite-code-item, .verification-status-card { border-color: var(--ui-line) !important; border-radius: 12px !important; background: color-mix(in srgb, var(--ui-bg) 70%, var(--ui-panel-solid)) !important; }
.copy-btn { border: 0; border-radius: 8px; background: var(--ui-soft); color: var(--ui-brand); font-weight: 700; }

/* Work detail */
.work-detail { max-width: 1120px !important; }
.media-viewer { overflow: hidden; border: 0 !important; border-radius: 22px !important; background: #080b12 !important; box-shadow: 0 28px 70px rgba(5,8,15,.25) !important; }
.work-info, .comments-section { border: 1px solid var(--ui-line) !important; border-radius: 20px !important; background: var(--ui-panel-solid) !important; box-shadow: var(--ui-shadow) !important; }
.work-info { margin-top: 18px !important; padding: 28px !important; }
.work-title-text { color: var(--ui-ink); letter-spacing: -.04em; }
.work-desc, .work-author-time { color: var(--ui-muted) !important; }
.work-tag { border: 0 !important; border-radius: 999px !important; background: var(--ui-soft) !important; color: var(--ui-brand) !important; }
.action-bar { gap: 9px; }
.action-item { min-height: 52px; border-color: var(--ui-line) !important; border-radius: 13px !important; background: var(--ui-panel-solid) !important; }
.action-item:hover, .action-item.liked, .action-item.favorited { border-color: rgba(109,93,252,.35) !important; background: var(--ui-soft) !important; color: var(--ui-brand) !important; }
.comments-section { padding: 28px !important; }
.comment-input-wrap { border: 1px solid var(--ui-line); border-radius: 14px; background: color-mix(in srgb, var(--ui-bg) 65%, var(--ui-panel-solid)); }
.comment-input { background: transparent !important; color: var(--ui-ink); }
.comment-send { border-radius: 10px !important; background: var(--ui-brand) !important; }
.comment-item { border-color: var(--ui-line) !important; }

/* Messages and notifications */
.messages-page { max-width: 1220px !important; }
.msg-layout, .message-layout { min-height: 700px; overflow: hidden; border: 1px solid var(--ui-line) !important; border-radius: 22px !important; background: var(--ui-panel-solid) !important; box-shadow: var(--ui-shadow) !important; }
.conv-panel { border-right: 1px solid var(--ui-line) !important; background: color-mix(in srgb, var(--ui-bg) 54%, var(--ui-panel-solid)) !important; }
.conv-header, .chat-header { border-color: var(--ui-line) !important; background: transparent !important; }
.conv-item { margin: 4px 9px; padding: 12px !important; border-radius: 14px !important; }
.conv-item:hover { background: var(--ui-panel-solid) !important; }
.conv-item.active { background: var(--ui-soft) !important; box-shadow: inset 3px 0 var(--ui-brand); }
.conv-name, .chat-title { color: var(--ui-ink) !important; font-weight: 750; }
.conv-preview, .conv-time, .msg-time { color: var(--ui-muted) !important; }
.chat-panel, .chat-messages { background: var(--ui-panel-solid) !important; }
.msg-content { border: 0 !important; border-radius: 5px 16px 16px 16px !important; background: color-mix(in srgb, var(--ui-bg) 78%, var(--ui-panel-solid)) !important; color: var(--ui-ink) !important; }
.chat-msg.own .msg-content { border-radius: 16px 5px 16px 16px !important; background: linear-gradient(135deg, var(--ui-brand), var(--ui-brand-deep)) !important; color: #fff !important; }
.chat-input { border-color: var(--ui-line) !important; background: var(--ui-panel-solid) !important; }
.notifications-page { max-width: 860px !important; }
.page-header { margin-bottom: 18px; }
.page-header h2 { color: var(--ui-ink); font-size: 30px; letter-spacing: -.04em; }
.notification-list { overflow: hidden; border: 1px solid var(--ui-line) !important; border-radius: 20px !important; background: var(--ui-panel-solid) !important; box-shadow: var(--ui-shadow) !important; }
.notification-item { padding: 18px 20px !important; border-color: var(--ui-line) !important; }
.notification-item:hover { background: color-mix(in srgb, var(--ui-soft) 45%, var(--ui-panel-solid)) !important; }
.notification-item.unread { background: var(--ui-soft) !important; }
.notif-icon { border-radius: 13px !important; }
.notif-time { color: var(--ui-muted) !important; }

/* Points */
.points-page { max-width: 1000px !important; }
.points-card { position: relative; overflow: hidden; padding: 36px !important; border: 0 !important; border-radius: 24px !important; background: linear-gradient(125deg, #25243f, #5145e5 62%, #16a8b9 125%) !important; color: #fff !important; box-shadow: 0 28px 65px rgba(62,57,148,.24) !important; }
.points-card::before { content: ''; position: absolute; width: 280px; height: 280px; right: -90px; top: -130px; border-radius: 50%; background: rgba(255,255,255,.1); }
.points-label, .points-streak { color: rgba(255,255,255,.72) !important; }
.points-value { color: #fff !important; text-shadow: 0 8px 25px rgba(0,0,0,.15); }
.points-task-section, .points-history-section { padding: 26px !important; border: 1px solid var(--ui-line) !important; border-radius: 20px !important; background: var(--ui-panel-solid) !important; box-shadow: var(--ui-shadow) !important; }
.points-task-item { border: 1px solid var(--ui-line) !important; border-radius: 15px !important; background: color-mix(in srgb, var(--ui-bg) 62%, var(--ui-panel-solid)) !important; }
.task-icon { border-radius: 13px !important; background: var(--ui-soft) !important; color: var(--ui-brand) !important; }

/* Verification and admin */
.verify-shell { border: 1px solid var(--ui-line) !important; border-radius: 28px !important; background: var(--ui-panel-solid) !important; box-shadow: var(--ui-shadow-hover) !important; }
.verify-content { color: var(--ui-ink); }
.verify-lead, .verify-instruction p { color: var(--ui-muted) !important; }
.admin-page { max-width: 1540px !important; }
.admin-overview-grid { gap: 16px !important; }
.stat-card, .metric { border: 1px solid var(--ui-line) !important; border-radius: 17px !important; background: var(--ui-panel-solid) !important; box-shadow: 0 8px 25px rgba(34,42,72,.05) !important; transition: transform .2s, box-shadow .2s; }
.stat-card:hover, .metric:hover { transform: translateY(-3px); box-shadow: var(--ui-shadow) !important; }
.stat-card > i { border-radius: 13px !important; background: var(--ui-soft) !important; color: var(--ui-brand) !important; }
.admin-page > .el-tabs, .next-card, .admin-table-shell, .next-page-head { border: 1px solid var(--ui-line) !important; border-radius: 20px !important; background: var(--ui-panel-solid) !important; box-shadow: var(--ui-shadow) !important; }
.admin-table-shell { overflow: hidden; }
.admin-toolbar { padding: 14px !important; border-radius: 14px; background: color-mix(in srgb, var(--ui-bg) 70%, var(--ui-panel-solid)); }

/* Empty and loading states */
.el-empty { padding: 52px 0 !important; }
.el-empty__description p, .chat-empty { color: var(--ui-muted) !important; }
.skeleton { background: linear-gradient(90deg, var(--ui-line), color-mix(in srgb, var(--ui-line) 45%, var(--ui-panel-solid)), var(--ui-line)) !important; background-size: 200% 100% !important; }

@media (max-width: 1000px) {
  .auth-shell { grid-template-columns: .9fr 1fr; }
  .auth-showcase { padding: 42px; }
  .auth-showcase h1 { font-size: 44px; }
  .auth-card { padding: 48px 38px !important; }
}

@media (max-width: 760px) {
  .guest-layout .app-content { padding: 0 !important; }
  .auth-page { min-height: calc(100vh - var(--header-h)); padding: 16px !important; }
  .auth-shell { min-height: 0; display: block; border-radius: 24px; box-shadow: var(--ui-shadow); }
  .auth-showcase { display: none; }
  .auth-card { padding: 36px 24px 30px !important; }
  .auth-mobile-brand { display: inline-block; margin-bottom: 24px; }
  .auth-title { font-size: 28px !important; }
  .auth-card-head { margin-bottom: 28px; }
  .welcome-card { min-height: 300px !important; padding: 34px 24px !important; border-radius: 22px !important; }
  .welcome-card h3 { font-size: 34px !important; }
  .feed-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 10px !important; }
  .feed-card { border-radius: 15px !important; }
  .feed-card:hover { transform: none !important; }
  .section { padding: 15px; border-radius: 16px; }
  .profile-header, .profile-content, .publish-form, .settings-page > .el-tabs, .work-info, .comments-section, .notification-list, .points-task-section, .points-history-section { border-radius: 17px !important; }
  .profile-banner { min-height: 150px !important; }
  .profile-info { padding: 0 17px 22px !important; }
  .publish-title, .settings-title, .page-header h2 { font-size: 25px !important; }
  .publish-form, .settings-page > .el-tabs { padding: 18px !important; }
  .work-info, .comments-section { padding: 18px !important; }
  .msg-layout, .message-layout { min-height: calc(100vh - 145px); border-radius: 17px !important; }
  .notification-item { padding: 15px !important; }
  .points-card { padding: 26px 22px !important; border-radius: 20px !important; }
  .points-task-section, .points-history-section { padding: 18px !important; }
  .el-dialog { width: calc(100% - 20px) !important; margin: 10vh auto 0 !important; border-radius: 20px !important; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* Precision pass: admin workspace + mobile auth geometry */
.admin-page { width: 100%; }
.admin-workspace-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 22px; padding: 26px 30px; border: 1px solid var(--ui-line); border-radius: 22px; background: linear-gradient(120deg, color-mix(in srgb, var(--ui-panel-solid) 96%, var(--ui-brand)), var(--ui-panel-solid)); box-shadow: var(--ui-shadow); }
.admin-eyebrow { display: block; margin-bottom: 8px; color: var(--ui-brand); font-size: 10px; font-weight: 850; letter-spacing: .18em; }
.admin-workspace-head h1 { margin: 0; color: var(--ui-ink); font-size: clamp(24px, 3vw, 34px); letter-spacing: -.05em; }
.admin-workspace-head p { margin: 8px 0 0; color: var(--ui-muted); font-size: 13px; }
.admin-head-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.admin-head-actions .el-button { margin: 0 !important; }
.admin-page > .el-tabs { min-width: 0; overflow: hidden; }
.admin-page > .el-tabs > .el-tabs__header.is-left { width: 172px; min-width: 172px; padding: 12px 8px; background: color-mix(in srgb, var(--ui-bg) 72%, var(--ui-panel-solid)) !important; border-right: 1px solid var(--ui-line); }
.admin-page > .el-tabs > .el-tabs__header.is-left .el-tabs__item { margin: 3px 0; padding: 0 14px !important; border-radius: 10px; text-align: left; }
.admin-page > .el-tabs > .el-tabs__header.is-left .el-tabs__item.is-active { background: var(--ui-soft) !important; }
.admin-page > .el-tabs > .el-tabs__content { min-width: 0; padding: 24px !important; }
.admin-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; min-height: 58px; margin-bottom: 14px; }
.admin-toolbar .el-input { max-width: 300px; }
.admin-table-shell { width: 100%; overflow-x: auto; }
.admin-table-shell > .el-table, .admin-page .el-table { min-width: 720px; }
.admin-page .el-table .cell { line-height: 1.45; }
.admin-page .el-button--mini { min-height: 30px; padding: 6px 10px; border-radius: 8px !important; }
.admin-page .el-tag { border: 0 !important; font-weight: 700; }
.admin-mobile-block { display: none; }

@media (max-width: 760px) {
  .auth-page { min-height: calc(100svh - var(--header-h)) !important; padding: 10px !important; align-items: start !important; }
  .auth-shell { width: 100%; margin-top: 10px; border-radius: 22px !important; }
  .auth-card { padding: 28px 20px 24px !important; }
  .auth-card-head { margin-bottom: 23px !important; }
  .auth-mobile-brand { margin-bottom: 18px; }
  .auth-title { font-size: 26px !important; line-height: 1.2; }
  .auth-subtitle { font-size: 13px !important; line-height: 1.6; }
  .auth-card .el-form-item { margin-bottom: 16px !important; }
  .auth-card .el-form-item__label { font-size: 12px; padding-bottom: 4px; }
  .auth-card .el-input__inner { height: 48px !important; }
  .auth-submit { min-height: 48px !important; }
  .auth-divider { margin: 22px 0 15px; }

  .admin-page > :not(.admin-mobile-block) { display: none !important; }
  .admin-mobile-block { min-height: calc(100svh - 120px); display: flex; align-items: center; flex-direction: column; justify-content: center; padding: 24px; text-align: center; }
  .admin-mobile-icon { display: grid; width: 66px; height: 66px; place-items: center; margin-bottom: 20px; border-radius: 20px; background: var(--ui-soft); color: var(--ui-brand); font-size: 30px; }
  .admin-mobile-block h2 { margin: 0 0 10px; color: var(--ui-ink); font-size: 21px; }
  .admin-mobile-block p { max-width: 300px; margin: 0; color: var(--ui-muted); font-size: 13px; line-height: 1.75; }
  .admin-mobile-back { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; margin-top: 24px; padding: 0 20px; border-radius: 11px; background: linear-gradient(135deg, var(--ui-brand), var(--ui-brand-deep)); color: #fff !important; font-size: 13px; font-weight: 700; }
}