/* Zedulex Digital Platforms — carbon fiber / frosted glass themes */
:root{
 --identity-blue:#00AEEF;
 --identity-green:#12D98A;
 --identity-red:#FF405D;
 --brand-name-color:#F5F9FF;
 --brand-subtitle-color:#00D9FF;
 --glass-radius:18px;
 --glass-shadow:0 18px 42px rgba(0,0,0,.18);
 --glass-highlight:rgba(255,255,255,.24);
 --accent-amber:#FFB23F;
}

html[data-theme="dark"]{
 color-scheme:dark;
 --ui-bg:#050b13;
 --ui-bg-2:#091421;
 --carbon-a:#070d14;
 --carbon-b:#111c28;
 --carbon-c:#0a121c;
 --glass:rgba(17,34,51,.34);
 --glass-strong:rgba(8,23,38,.56);
 --glass-soft:rgba(31,52,72,.24);
 --glass-border:rgba(104,205,255,.38);
 --glass-border-soft:rgba(148,207,235,.18);
 --ui-text:#F5F8FF;
 --ui-muted:#9DB0C7;
 --ui-line:rgba(154,207,235,.18);
 --ui-input:rgba(9,27,45,.36);
 --ui-table:rgba(5,18,31,.30);
 --ui-nav:#F8FBFF;
 --ui-nav-text:#6E82A1;
 --ui-shadow:0 18px 52px rgba(0,0,0,.34);
 --bg:var(--ui-bg);
 --surface:rgba(12,29,45,.76);
 --surface-soft:rgba(24,45,64,.58);
 --surface-blue:rgba(0,174,239,.10);
 --line:var(--ui-line);
 --line-strong:rgba(116,202,239,.34);
 --text:var(--ui-text);
 --muted:var(--ui-muted);
 --primary:var(--identity-blue);
 --primary-dark:#38c8ff;
 --primary-soft:rgba(0,174,239,.14);
 --success:var(--identity-green);
 --success-soft:rgba(18,217,138,.14);
 --danger:var(--identity-red);
 --danger-soft:rgba(255,64,93,.14);
 --warning:var(--accent-amber);
 --warning-soft:rgba(255,178,63,.14);
}

html[data-theme="light"]{
 color-scheme:light;
 --ui-bg:#EDF3F9;
 --ui-bg-2:#F9FBFD;
 --carbon-a:#F9FCFF;
 --carbon-b:#E6EDF4;
 --carbon-c:#F0F5F9;
 --glass:rgba(255,255,255,.38);
 --glass-strong:rgba(247,251,255,.60);
 --glass-soft:rgba(255,255,255,.28);
 --glass-border:rgba(77,166,222,.30);
 --glass-border-soft:rgba(56,116,160,.15);
 --ui-text:#0B1730;
 --ui-muted:#566C87;
 --ui-line:rgba(55,111,151,.16);
 --ui-input:rgba(255,255,255,.40);
 --ui-table:rgba(255,255,255,.32);
 --ui-nav:#F9FBFF;
 --ui-nav-text:#60789B;
 --ui-shadow:0 18px 48px rgba(57,86,115,.18);
 --bg:var(--ui-bg);
 --surface:rgba(255,255,255,.76);
 --surface-soft:rgba(249,252,255,.68);
 --surface-blue:rgba(0,174,239,.08);
 --line:var(--ui-line);
 --line-strong:rgba(73,137,181,.28);
 --text:var(--ui-text);
 --muted:var(--ui-muted);
 --primary:var(--identity-blue);
 --primary-dark:#0079c9;
 --primary-soft:rgba(0,174,239,.12);
 --success:var(--identity-green);
 --success-soft:rgba(18,217,138,.12);
 --danger:var(--identity-red);
 --danger-soft:rgba(255,64,93,.12);
 --warning:#d88a14;
 --warning-soft:rgba(255,178,63,.16);
}

html,body{min-height:100%;background:var(--ui-bg);color:var(--ui-text)}
body{
 position:relative;
 background-color:var(--ui-bg);
 background-image:
  linear-gradient(115deg,transparent 0 38%,rgba(255,255,255,.14) 45%,transparent 54%),
  repeating-linear-gradient(45deg,var(--carbon-a) 0 8px,var(--carbon-b) 8px 16px),
  repeating-linear-gradient(-45deg,transparent 0 8px,rgba(255,255,255,.025) 8px 16px);
 background-attachment:fixed;
 background-size:190% 100%,32px 32px,32px 32px;
 animation:carbon-sheen 16s linear infinite;
}
html[data-theme="light"] body{
 background-image:
  linear-gradient(115deg,transparent 0 36%,rgba(255,255,255,.82) 45%,transparent 56%),
  repeating-linear-gradient(45deg,var(--carbon-a) 0 8px,var(--carbon-b) 8px 16px),
  repeating-linear-gradient(-45deg,transparent 0 8px,rgba(101,133,158,.05) 8px 16px);
}
@keyframes carbon-sheen{0%{background-position:130% 0,0 0,0 0}100%{background-position:-80% 0,0 0,0 0}}

body,.app-shell,.app-workspace,.app-main,.guest{color:var(--ui-text)}
a{color:var(--identity-blue)}
p,.muted,.small-text{color:var(--ui-muted)}
h1,h2,h3,strong,dt,dd,label{color:var(--ui-text)}
.eyebrow{color:var(--brand-subtitle-color)}
.panel,.card,.kpi-card,.update-process-panel,.update-version-card,.installer-stepper,.package-identities>div,.requirement-list fieldset{
 background:
  linear-gradient(135deg,var(--glass-highlight),transparent 34%),
  var(--glass);
 border:1px solid var(--glass-border);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.22),var(--ui-shadow);
 backdrop-filter:blur(26px) saturate(160%);
 -webkit-backdrop-filter:blur(26px) saturate(160%);
}
.panel,.card{border-radius:var(--glass-radius)}
input,select,textarea,.search-field,.identity-upload-button{
 background:var(--ui-input);
 border-color:var(--glass-border);
 color:var(--ui-text);
 backdrop-filter:blur(12px);
}
input::placeholder,textarea::placeholder{color:color-mix(in srgb,var(--ui-muted) 78%,transparent)}
input:focus,select:focus,textarea:focus{border-color:var(--identity-blue);outline:3px solid color-mix(in srgb,var(--identity-blue) 18%,transparent)}
.table-wrap,.data-table{border-color:var(--ui-line)}
.data-table{background:var(--ui-table);color:var(--ui-text)}
.data-table th{background:color-mix(in srgb,var(--glass-strong) 84%,transparent);color:var(--ui-muted);border-color:var(--ui-line)}
.data-table td{border-color:var(--ui-line);color:var(--ui-text)}
.quick-links a,.mobile-sheet-link{background:var(--glass-soft);border-color:var(--glass-border-soft);color:var(--ui-text)}
.summary-list>div,.activity-item{border-color:var(--ui-line)}
.status-info{background:color-mix(in srgb,var(--identity-blue) 18%,transparent);color:var(--identity-blue)}
.status-success{background:color-mix(in srgb,var(--identity-green) 18%,transparent);color:var(--identity-green)}
.status-danger{background:color-mix(in srgb,var(--identity-red) 18%,transparent);color:var(--identity-red)}
.status-warning{background:rgba(255,178,63,.16);color:var(--accent-amber)}

.button.primary,button.primary,button:not(.secondary):not(.ghost):not(.mobile-tab){
 background:linear-gradient(135deg,#29d7ff 0,var(--identity-blue) 48%,#1168f6 100%);
 color:white;
 border-color:rgba(116,232,255,.66);
 box-shadow:0 8px 24px color-mix(in srgb,var(--identity-blue) 34%,transparent),inset 0 1px rgba(255,255,255,.45);
}
.button.secondary,button.secondary{
 background:var(--glass-soft);
 border-color:var(--glass-border);
 color:var(--ui-text);
 backdrop-filter:blur(12px);
}
.button.danger,button.danger{background:linear-gradient(135deg,#ff6678,var(--identity-red))!important}

/* Brand identity */
.brand-identity,.header-brand{color:var(--ui-text)}
.brand-logo{width:54px;height:54px;object-fit:contain;filter:drop-shadow(0 0 10px color-mix(in srgb,var(--identity-blue) 65%,transparent))}
.brand-identity strong,.header-brand strong{color:var(--brand-name-color)}
.brand-identity small,.header-brand small{color:var(--brand-subtitle-color);text-transform:uppercase;letter-spacing:.13em}
.sidebar .brand-identity{align-items:center;padding:5px 5px 22px}
.sidebar .brand-identity>span:last-child{display:flex;flex-direction:column;line-height:1}
.sidebar .brand-identity strong{font-size:1.3rem}
.sidebar .brand-identity small{font-size:.62rem;margin-top:6px}

/* Application shell */
.app-shell{background:transparent}
.sidebar{
 background:linear-gradient(150deg,var(--glass-highlight),transparent 28%),var(--glass-strong);
 border-color:var(--glass-border-soft);
 box-shadow:12px 0 36px rgba(0,0,0,.12);
 backdrop-filter:blur(20px) saturate(130%);
}
.sidebar-help,.environment-pill{background:var(--glass-soft);border-color:var(--glass-border-soft);color:var(--ui-text)}
.sidebar-footer,.sidebar-label{color:var(--ui-muted)}
.nav-item,.nav-group>summary{color:var(--ui-muted)}
.nav-submenu a{color:var(--ui-muted)}
.app-header{
 height:84px;
 background:linear-gradient(110deg,var(--glass-highlight),transparent 40%),var(--glass-strong);
 border-color:var(--glass-border);
 box-shadow:0 8px 28px rgba(0,0,0,.12);
 backdrop-filter:blur(20px) saturate(140%);
}
.header-brand{display:flex;align-items:center;gap:10px;margin-right:18px}
.header-brand img{width:48px;height:48px;object-fit:contain;filter:drop-shadow(0 0 9px color-mix(in srgb,var(--identity-blue) 55%,transparent))}
.header-brand>span{display:flex;flex-direction:column;line-height:1}
.header-brand strong{font-size:1.05rem}
.header-brand small{font-size:.54rem;margin-top:5px}
.header-search{background:var(--glass-soft);border-color:var(--glass-border-soft);color:var(--ui-muted)}
.header-version-chip{background:color-mix(in srgb,var(--identity-blue) 13%,var(--glass));border-color:color-mix(in srgb,var(--identity-blue) 50%,transparent);color:var(--identity-blue)}
.header-icon{color:var(--ui-muted);background:transparent}
.header-icon:hover{background:var(--glass-soft);color:var(--identity-blue)}
.theme-toggle-icon{border:0;padding:0;min-height:36px}
button.theme-toggle-icon:not(.secondary):not(.ghost):not(.mobile-tab){background:transparent!important;box-shadow:none!important;border-color:transparent!important;color:var(--ui-muted)!important}
button.theme-toggle-icon:not(.secondary):not(.ghost):not(.mobile-tab):hover{background:var(--glass-soft)!important;color:var(--identity-blue)!important}
.user-chip{border-color:var(--ui-line)}
.avatar{overflow:hidden;background:color-mix(in srgb,var(--identity-blue) 16%,transparent);border:1px solid color-mix(in srgb,var(--identity-blue) 50%,transparent)}
.avatar img{width:100%;height:100%;object-fit:contain}
.app-main{position:relative;z-index:1}

/* Dashboard */
.dashboard-hero{
 position:relative;
 overflow:hidden;
 min-height:190px;
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:22px;
 padding:30px;
 margin-bottom:18px;
 border:1px solid var(--glass-border);
 border-radius:24px;
 background:
  radial-gradient(circle at 82% 38%,color-mix(in srgb,var(--identity-blue) 25%,transparent),transparent 26%),
  linear-gradient(125deg,var(--glass-highlight),transparent 42%),
  var(--glass);
 box-shadow:inset 0 1px rgba(255,255,255,.26),var(--ui-shadow);
 backdrop-filter:blur(20px) saturate(135%);
}
.dashboard-hero::after{
 content:"";
 position:absolute;
 right:-72px;top:-92px;
 width:350px;height:350px;border-radius:50%;
 opacity:.52;
 background:
  radial-gradient(circle at 33% 42%,transparent 0 38%,color-mix(in srgb,var(--identity-blue) 55%,transparent) 39% 40%,transparent 41%),
  repeating-radial-gradient(circle at center,transparent 0 17px,color-mix(in srgb,var(--identity-blue) 20%,transparent) 18px 19px);
 pointer-events:none;
}
.dashboard-hero-copy,.dashboard-hero-status{position:relative;z-index:1}
.dashboard-hero-copy h1{font-size:clamp(2rem,4vw,3.2rem);margin:.1rem 0 .45rem}
.dashboard-hero-copy p:last-child{max-width:650px;margin:0;color:var(--ui-muted);font-size:1rem}
.dashboard-hero-status{min-width:155px;text-align:right}
.dashboard-hero-status>span{display:block;color:var(--ui-muted)}
.dashboard-hero-status>strong{display:block;font-size:2rem;line-height:1.05;margin:4px 0 9px}
.dashboard-hero-status small{display:flex;justify-content:flex-end;align-items:center;gap:7px;font-weight:750}
.dashboard-hero-status small i{width:9px;height:9px;border-radius:50%;background:currentColor;box-shadow:0 0 12px currentColor}
.dashboard-hero-status small.online{color:var(--identity-green)}
.dashboard-hero-status small.attention{color:var(--identity-red)}

.dashboard-action-row{display:grid;grid-template-columns:1.15fr .85fr;gap:14px;margin-bottom:16px}
.dashboard-action{
 min-height:72px;
 display:grid;
 grid-template-columns:auto 1fr auto;
 align-items:center;
 gap:12px;
 padding:14px 20px;
 border-radius:20px;
 border:1px solid var(--glass-border);
 box-shadow:inset 0 1px rgba(255,255,255,.25),var(--glass-shadow);
 backdrop-filter:blur(16px);
 color:var(--ui-text);
}
.dashboard-action:hover{color:var(--ui-text);transform:translateY(-1px)}
.dashboard-action-primary{background:linear-gradient(135deg,#2be1ff,var(--identity-blue) 48%,#1164f7);color:white!important;border-color:#84ecff}
.dashboard-action-secondary{background:linear-gradient(135deg,var(--glass-highlight),transparent 48%),var(--glass)}
.dashboard-action-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;font-size:1.4rem;background:rgba(255,255,255,.18)}

.dashboard-kpi-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}
.futuristic-kpis .kpi-card{
 min-height:118px;
 display:grid;
 grid-template-columns:auto 1fr auto;
 align-items:center;
 gap:13px;
 padding:18px;
 border-radius:20px;
 overflow:hidden;
 position:relative;
}
.futuristic-kpis .kpi-card::after{content:"";position:absolute;inset:auto -30px -45px auto;width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,currentColor 0,transparent 68%);opacity:.12}
.futuristic-kpis .kpi-icon{width:52px;height:52px;border-radius:50%;font-size:1.35rem;background:color-mix(in srgb,currentColor 14%,transparent);border:1px solid color-mix(in srgb,currentColor 52%,transparent);box-shadow:0 0 22px color-mix(in srgb,currentColor 25%,transparent)}
.futuristic-kpis .kpi-card>div{min-width:0}
.futuristic-kpis .kpi-card strong{font-size:1.9rem;margin:0}
.futuristic-kpis .kpi-label{margin-top:4px;color:var(--ui-muted)}
.kpi-chevron{font-size:1.8rem;color:var(--ui-muted)}
.kpi-green{color:var(--identity-green)}
.kpi-blue{color:var(--identity-blue)}
.kpi-red{color:var(--identity-red)}
.kpi-amber{color:var(--accent-amber)}
.futuristic-kpis .kpi-card strong,.futuristic-kpis .kpi-card .kpi-label{color:var(--ui-text)}
.dashboard-sites-block{margin-bottom:18px}
.dashboard-sites-block .microsites{border-radius:24px}
.dashboard-sites-block .section-heading h2{font-size:1.35rem}
.dashboard-lower-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(300px,.8fr);gap:18px}
.dashboard-side{display:grid;gap:18px;align-content:start}

/* Login */
.guest-body .guest{display:block;min-height:100vh;padding:0;background:transparent}
.login-shell{
 position:relative;
 width:min(100%,980px);
 min-height:100vh;
 margin:0 auto;
 padding:42px 28px 34px;
 display:flex;
 flex-direction:column;
 align-items:center;
 justify-content:center;
}
.login-shell::before{
 content:"";
 position:absolute;inset:8% 2% auto;
 height:420px;
 background:
  radial-gradient(circle at 50% 42%,color-mix(in srgb,var(--identity-blue) 22%,transparent),transparent 42%),
  linear-gradient(115deg,transparent 45%,color-mix(in srgb,var(--identity-red) 11%,transparent) 46% 47%,transparent 48%);
 pointer-events:none;
}
.login-theme-toggle{position:absolute;right:28px;top:28px;z-index:5;width:42px;height:42px;padding:0;border-radius:50%;background:var(--glass);border:1px solid var(--glass-border);color:var(--ui-text);backdrop-filter:blur(14px)}
button.login-theme-toggle:not(.secondary):not(.ghost):not(.mobile-tab){background:var(--glass)!important;border-color:var(--glass-border)!important;color:var(--ui-text)!important;box-shadow:0 8px 24px rgba(0,0,0,.16)!important}
.login-brand{position:relative;z-index:1;width:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;justify-items:center;margin-bottom:12px}
.login-brand-logo{grid-column:2;width:180px;height:180px;object-fit:contain;filter:drop-shadow(0 0 24px color-mix(in srgb,var(--identity-blue) 55%,transparent))}
.login-brand-copy{grid-column:2;display:flex;flex-direction:column;align-items:center;margin-top:-20px}
.login-brand-copy strong{font-size:clamp(2.4rem,7vw,4.2rem);line-height:1;color:var(--brand-name-color);letter-spacing:-.04em}
.login-brand-copy span{margin-top:9px;color:var(--brand-subtitle-color);font-size:.95rem;font-weight:800;letter-spacing:.28em;text-transform:uppercase}
.login-brand-kicker{position:absolute;top:42px;color:var(--ui-muted);font-size:.72rem;line-height:1.7;letter-spacing:.28em}
.login-brand-kicker-left{left:0;text-align:left}
.login-brand-kicker-right{right:0;text-align:right}

.login-glass-card{
 position:relative;z-index:1;
 width:min(100%,720px);
 padding:38px;
 border:1px solid color-mix(in srgb,var(--identity-blue) 55%,var(--glass-border));
 border-radius:28px;
 background:linear-gradient(135deg,var(--glass-highlight),transparent 38%),var(--glass);
 box-shadow:inset 0 1px rgba(255,255,255,.45),0 24px 70px rgba(0,0,0,.30),0 0 26px color-mix(in srgb,var(--identity-blue) 14%,transparent);
 backdrop-filter:blur(24px) saturate(145%);
}
.login-welcome{margin:0 0 8px;color:var(--ui-muted);font-size:.74rem;font-weight:800;letter-spacing:.27em}
.login-glass-card h1{font-size:clamp(2rem,6vw,3.1rem);margin:0 0 8px}
.login-glass-card h1 span{color:var(--identity-blue)}
.login-intro{max-width:570px;color:var(--ui-muted);font-size:1rem;margin-bottom:24px}
.login-form{display:grid;gap:16px}
.login-field{position:relative;display:grid;grid-template-columns:44px 1fr;grid-template-rows:auto auto;column-gap:10px;align-items:center;padding:12px 16px;border:1px solid var(--glass-border);border-radius:16px;background:var(--ui-input);box-shadow:inset 0 1px rgba(255,255,255,.18);backdrop-filter:blur(14px)}
.login-field:focus-within{border-color:var(--identity-blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--identity-blue) 14%,transparent),inset 0 1px rgba(255,255,255,.2)}
.login-field-icon{grid-row:1/3;display:grid;place-items:center;font-size:1.25rem;color:var(--ui-muted)}
.login-field-label{font-size:.68rem;color:var(--ui-muted);text-transform:uppercase;letter-spacing:.12em}
.login-field input{grid-column:2;min-height:34px;padding:2px 0;border:0!important;background:transparent!important;outline:0!important;box-shadow:none!important}
.login-submit{width:100%;min-height:64px;display:grid!important;grid-template-columns:auto 1fr auto;border-radius:18px!important;font-size:1.02rem!important;margin-top:2px}
.login-security-note{display:flex;align-items:center;gap:12px;margin-top:20px;padding:15px 16px;border:1px solid color-mix(in srgb,var(--identity-green) 38%,var(--glass-border));border-radius:16px;background:color-mix(in srgb,var(--identity-green) 8%,var(--glass-soft))}
.login-security-shield{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;color:var(--identity-green);border:1px solid var(--identity-green);box-shadow:0 0 22px color-mix(in srgb,var(--identity-green) 28%,transparent);font-weight:900}
.login-security-note>div{display:flex;flex-direction:column}
.login-security-note strong{color:var(--identity-green)}
.login-security-note small{color:var(--ui-muted)}
.login-version{text-align:right;margin-top:14px;color:var(--ui-muted);font-size:.72rem}
.login-footer{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:5px;margin-top:26px;color:var(--ui-muted);font-size:.65rem;letter-spacing:.24em;text-align:center}
.login-footer strong{color:var(--ui-muted);font-weight:750}
.login-progress-dialog{background:linear-gradient(135deg,var(--glass-highlight),transparent 40%),var(--glass-strong)!important;border-color:var(--glass-border)!important;color:var(--ui-text)!important;backdrop-filter:blur(24px)}
.login-progress-dialog p:not(.eyebrow),.login-progress-dialog small{color:var(--ui-muted)!important}
.login-progress-logo{width:84px;height:84px;object-fit:contain;margin:0 auto 8px;filter:drop-shadow(0 0 16px color-mix(in srgb,var(--identity-blue) 55%,transparent))}

/* Identity */
.identity-page{max-width:1040px;margin:0 auto}
.identity-heading{align-items:center}
.identity-preview-panel{margin-bottom:18px}
.identity-preview{display:flex;align-items:center;justify-content:center;gap:28px;min-height:210px;padding:22px;margin-top:14px;border:1px solid var(--glass-border);border-radius:20px;background:linear-gradient(135deg,var(--glass-highlight),transparent 45%),var(--glass-soft)}
.identity-preview-logo{width:150px;height:150px;object-fit:contain;filter:drop-shadow(0 0 18px color-mix(in srgb,var(--identity-blue) 50%,transparent))}
.identity-preview-copy{display:flex;flex-direction:column}
.identity-preview-copy strong{font-size:2.7rem;line-height:1;color:var(--brand-name-color);letter-spacing:-.04em}
.identity-preview-copy span{margin-top:9px;color:var(--brand-subtitle-color);font-size:.9rem;text-transform:uppercase;letter-spacing:.23em;font-weight:800}
.identity-form{display:grid;gap:0;padding:0;overflow:hidden}
.identity-form-section{padding:24px;border-bottom:1px solid var(--ui-line)}
.identity-form-section:last-of-type{border-bottom:0}
.identity-section-title{display:flex;align-items:flex-start;gap:12px;margin-bottom:16px}
.identity-section-title h2{margin:0 0 3px}
.identity-section-title p{margin:0;color:var(--ui-muted);font-size:.82rem}
.identity-section-icon{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;border:1px solid var(--glass-border);border-radius:11px;background:var(--glass-soft);color:var(--identity-blue);font-weight:850}
.identity-two-column,.identity-color-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}
.identity-color-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.identity-color-grid input[type=color]{height:48px;padding:5px;cursor:pointer}
.identity-logo-row{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center}
.identity-logo-current{display:flex;align-items:center;gap:14px;padding:12px;border:1px solid var(--glass-border-soft);border-radius:16px;background:var(--glass-soft)}
.identity-logo-current img{width:74px;height:74px;object-fit:contain}
.identity-logo-current>div{display:flex;flex-direction:column}
.identity-logo-current span{color:var(--ui-muted);font-size:.78rem;margin-top:3px}
.identity-upload-button{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:10px 16px;border-radius:12px;cursor:pointer;color:white;background:linear-gradient(135deg,#28d8ff,var(--identity-blue),#1266f5);box-shadow:0 7px 20px color-mix(in srgb,var(--identity-blue) 28%,transparent)}
.identity-upload-button input{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}
.identity-logo-preview{display:flex;align-items:center;gap:12px;margin-top:12px;color:var(--ui-muted)}
.identity-logo-preview img{width:62px;height:62px;object-fit:contain;border-radius:12px;background:var(--glass-soft)}
.theme-choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.theme-choice{position:relative;display:grid;grid-template-columns:84px 1fr;grid-template-rows:auto auto;column-gap:14px;padding:14px;border:1px solid var(--glass-border-soft);border-radius:16px;background:var(--glass-soft);cursor:pointer}
.theme-choice input{position:absolute;right:12px;top:12px;width:auto;min-height:auto}
.theme-choice-preview{grid-row:1/3;width:84px;height:58px;border-radius:12px;border:1px solid var(--glass-border);box-shadow:inset 0 1px rgba(255,255,255,.25)}
.theme-choice-dark{background:repeating-linear-gradient(45deg,#07101a 0 7px,#152536 7px 14px)}
.theme-choice-light{background:repeating-linear-gradient(45deg,#fff 0 7px,#dfe8f0 7px 14px)}
.theme-choice small{color:var(--ui-muted)}
.identity-actions{display:flex;justify-content:flex-end;padding:20px 24px}
.identity-reset-form{margin-top:12px;text-align:right}

/* Mobile tab bar — same structure, refined material only */
.mobile-tabbar{
 background:rgba(249,252,255,.94)!important;
 border-color:rgba(176,205,229,.76)!important;
 box-shadow:0 16px 38px rgba(10,32,58,.22),inset 0 1px rgba(255,255,255,.82)!important;
 backdrop-filter:blur(20px) saturate(145%)!important;
}
.mobile-tab,button.mobile-tab.mobile-tab-trigger:not(.secondary):not(.ghost){color:var(--ui-nav-text)!important}
.mobile-tab.active,button.mobile-tab.mobile-tab-trigger.active:not(.secondary):not(.ghost){color:#078ee5!important;background:rgba(220,245,255,.96)!important;border-color:#9edfff!important;box-shadow:inset 0 -3px 0 #16b7f1!important}
.mobile-nav-sheet{background:var(--glass-strong)!important;border-color:var(--glass-border)!important;color:var(--ui-text)!important;backdrop-filter:blur(22px)!important}

/* Responsive */
@media(max-width:1100px){
 .dashboard-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .dashboard-lower-grid{grid-template-columns:1fr}
 .header-search{display:none}
}
@media(max-width:760px){
 body{animation-duration:22s}
 .app-main{padding:16px 12px calc(112px + env(safe-area-inset-bottom))!important}
 .app-header{height:82px;padding:0 12px!important}
 .header-brand{display:flex;margin-right:auto}
 .header-brand img{width:44px;height:44px}
 .header-brand strong{font-size:.98rem}
 .header-brand small{font-size:.5rem}
 .header-actions{width:auto!important}
 .header-actions .header-icon:not(.theme-toggle-icon){display:none}
 .header-version-chip{margin-right:0!important}
 .user-chip{display:none!important}
 .dashboard-hero{min-height:170px;padding:22px 18px}
 .dashboard-hero-copy h1{font-size:2rem}
 .dashboard-hero-status{min-width:118px}
 .dashboard-hero-status>strong{font-size:1.7rem}
 .dashboard-hero::after{width:260px;height:260px;right:-100px}
 .dashboard-action-row{grid-template-columns:1.1fr .9fr;gap:10px}
 .dashboard-action{min-height:66px;padding:10px 13px}
 .dashboard-action-icon{width:38px;height:38px}
 .dashboard-kpi-grid{grid-template-columns:1fr 1fr!important;gap:10px}
 .dashboard-kpi-grid .kpi-card{grid-column:auto!important;min-width:0!important;min-height:105px;padding:14px!important}
 .dashboard-kpi-grid .kpi-card:nth-child(n){grid-column:auto!important}
 .futuristic-kpis .kpi-icon{width:44px;height:44px;font-size:1.1rem}
 .futuristic-kpis .kpi-card strong{font-size:1.6rem!important}
 .futuristic-kpis .kpi-label{font-size:.75rem!important}
 .dashboard-sites-block .table-wrap{overflow-x:auto}
 .dashboard-sites-block .data-table{min-width:720px}
 .login-shell{padding:28px 16px 26px;justify-content:flex-start}
 .login-theme-toggle{right:16px;top:16px}
 .login-brand{margin-top:26px}
 .login-brand-logo{width:132px;height:132px}
 .login-brand-copy{margin-top:-14px}
 .login-brand-copy strong{font-size:2.8rem}
 .login-brand-copy span{font-size:.72rem}
 .login-brand-kicker{top:28px;font-size:.58rem;letter-spacing:.22em}
 .login-glass-card{padding:25px 20px;border-radius:24px}
 .login-glass-card h1{font-size:2.2rem}
 .login-footer{margin-top:20px;font-size:.56rem}
 .identity-preview{gap:14px;min-height:160px;padding:16px}
 .identity-preview-logo{width:100px;height:100px}
 .identity-preview-copy strong{font-size:1.9rem}
 .identity-preview-copy span{font-size:.66rem}
 .identity-two-column,.identity-color-grid,.theme-choice-grid{grid-template-columns:1fr}
 .identity-logo-row{grid-template-columns:1fr}
 .identity-upload-button{width:100%}
 .identity-form-section{padding:18px}
 .identity-actions{padding:18px}
}
@media(max-width:520px){
 .login-brand-kicker{display:none}
 .login-brand{grid-template-columns:1fr}
 .login-brand-logo,.login-brand-copy{grid-column:1}
 .login-brand-copy strong{font-size:2.45rem}
 .dashboard-hero{display:block}
 .dashboard-hero-status{margin-top:14px;text-align:left}
 .dashboard-hero-status small{justify-content:flex-start}
 .dashboard-action strong{font-size:.82rem}
 .dashboard-action-icon{width:34px;height:34px}
 .identity-preview{flex-direction:column;text-align:center}
}
@media(prefers-reduced-motion:reduce){body{animation:none}}


/* 3.0 visual review — stronger frosted glass and smaller mobile login */
@media(max-width:760px){
 .login-shell{min-height:100svh;padding:14px 12px 14px;justify-content:flex-start}
 .login-theme-toggle{right:12px;top:12px;width:36px;height:36px}
 .login-brand{margin-top:8px;margin-bottom:7px}
 .login-brand-logo{width:98px;height:98px}
 .login-brand-copy{margin-top:-9px}
 .login-brand-copy strong{font-size:2.05rem}
 .login-brand-copy span{margin-top:6px;font-size:.58rem;letter-spacing:.20em}
 .login-brand-kicker{display:none}
 .login-glass-card{width:min(100%,620px);padding:17px 15px;border-radius:20px}
 .login-welcome{margin-bottom:5px;font-size:.62rem;letter-spacing:.20em}
 .login-glass-card h1{font-size:1.82rem;margin-bottom:5px}
 .login-intro{font-size:.84rem;line-height:1.42;margin-bottom:14px}
 .login-form{gap:10px}
 .login-field{grid-template-columns:32px 1fr;column-gap:8px;padding:8px 11px;border-radius:13px}
 .login-field-icon{font-size:.98rem}
 .login-field-label{font-size:.58rem}
 .login-field input{min-height:28px;font-size:.88rem}
 .login-submit{min-height:52px;border-radius:14px!important;font-size:.88rem!important}
 .login-security-note{gap:10px;margin-top:12px;padding:10px 11px;border-radius:13px}
 .login-security-shield{width:36px;height:36px}
 .login-security-note strong{font-size:.79rem}
 .login-security-note small{font-size:.70rem;line-height:1.35}
 .login-version{margin-top:8px;font-size:.63rem}
 .login-footer{margin-top:11px;gap:3px;font-size:.48rem;letter-spacing:.16em}

 .panel,.card,.kpi-card,.dashboard-hero,.dashboard-action-secondary,.login-glass-card,.identity-preview,
 .app-header,.mobile-nav-sheet{
  backdrop-filter:blur(28px) saturate(165%)!important;
  -webkit-backdrop-filter:blur(28px) saturate(165%)!important;
 }
}


/* 3.8 presentation polish — explicit theme contrast for selection + long-running delete */
html[data-theme="dark"] .site-choice-card:has(input:checked){
 background:
  linear-gradient(135deg,rgba(18,217,138,.16),rgba(0,174,239,.08) 58%,rgba(8,23,38,.92)),
  rgba(12,29,45,.92)!important;
 border-color:rgba(58,225,164,.72)!important;
 color:var(--ui-text)!important;
 box-shadow:inset 0 -4px 0 rgba(18,217,138,.46),0 14px 34px rgba(0,0,0,.28)!important;
}
html[data-theme="dark"] .site-choice-card:has(input:checked) strong{color:#F7FBFF!important}
html[data-theme="dark"] .site-choice-card:has(input:checked) small{color:#B7C8DA!important}
html[data-theme="dark"] .site-choice-card:has(input:checked) input{accent-color:var(--identity-green)}

html[data-theme="light"] .site-choice-card:has(input:checked){
 background:linear-gradient(135deg,#EAFBF4,#EAF7FF)!important;
 border-color:#54C99A!important;
 color:#0B1730!important;
 box-shadow:inset 0 -4px 0 rgba(18,166,101,.38),0 12px 28px rgba(35,69,104,.10)!important;
}
html[data-theme="light"] .site-choice-card:has(input:checked) strong{color:#0B1730!important}
html[data-theme="light"] .site-choice-card:has(input:checked) small{color:#566C87!important}
html[data-theme="light"] .site-choice-card:has(input:checked) input{accent-color:#0B8A63}

html[data-theme="dark"] .delete-progress-dialog{
 background:
  linear-gradient(145deg,rgba(255,255,255,.06),transparent 38%),
  rgba(10,25,40,.96)!important;
 border-color:rgba(255,92,112,.52)!important;
 color:#F7FAFF!important;
 box-shadow:0 30px 90px rgba(0,0,0,.46)!important;
 backdrop-filter:blur(22px) saturate(145%);
 -webkit-backdrop-filter:blur(22px) saturate(145%);
}
html[data-theme="dark"] .delete-progress-dialog h2{color:#F7FAFF!important}
html[data-theme="dark"] .delete-progress-dialog p{color:#C1D0E0!important}
html[data-theme="dark"] .delete-progress-dialog small{color:#91A6BD!important}
html[data-theme="dark"] .delete-progress-spinner{
 border-color:rgba(255,96,116,.24)!important;
 border-top-color:#FF405D!important;
}

html[data-theme="light"] .delete-progress-dialog{
 background:rgba(255,255,255,.97)!important;
 border-color:#EAB7BE!important;
 color:#172033!important;
 box-shadow:0 28px 80px rgba(17,24,39,.22)!important;
}
html[data-theme="light"] .delete-progress-dialog h2{color:#172033!important}
html[data-theme="light"] .delete-progress-dialog p{color:#52617A!important}
html[data-theme="light"] .delete-progress-dialog small{color:#7A899C!important}
html[data-theme="light"] .delete-progress-spinner{
 border-color:#F1CDD2!important;
 border-top-color:#B42332!important;
}