:root {
    --bg: #f3f8fc;
    --surface: rgba(255,255,255,.92);
    --surface-strong: #ffffff;
    --text: #10283a;
    --muted: #667d8d;
    --line: rgba(16,56,84,.12);
    --brand: #39abe2;
    --brand-strong: #177fb8;
    --brand-soft: #e9f7fd;
    --danger: #b53d48;
    --shadow: 0 28px 80px rgba(16,56,84,.11);
    --radius-lg: 26px;
    --radius-md: 16px;
    --font: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html, body { min-height: 100%; }
body { margin: 0; font-family: var(--font); color: var(--text); background: var(--bg); -webkit-font-smoothing: antialiased; }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }

.auth-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(420px, 1.05fr) minmax(500px, .95fr); background: #fff; }
.brand-panel { position: relative; overflow: hidden; padding: 64px clamp(44px,7vw,110px); color: #fff; display: flex; flex-direction: column; justify-content: center; background: radial-gradient(circle at 82% 18%, rgba(90,200,242,.25), transparent 26%), linear-gradient(145deg,#071f35 0%,#0a4d78 50%,#168fc9 100%); }
.brand-panel::after { content:""; position:absolute; inset:0; background-image: linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px); background-size: 44px 44px; mask-image: linear-gradient(to bottom right,#000,transparent 75%); }
.brand-content { position: relative; z-index: 2; max-width: 660px; }
.brand-logo { width: 164px; height: auto; display: block; margin-bottom: 64px; }
.brand-kicker,.eyebrow { text-transform: uppercase; letter-spacing: .16em; font-size: 11px; font-weight: 800; }
.brand-kicker { color: #8ed9f6; margin-bottom: 16px; }
.brand-content h1 { margin: 0; font-size: clamp(48px,6vw,82px); line-height: .98; letter-spacing: -.055em; font-weight: 620; }
.brand-content h1 span { color: #b3e7fa; }
.brand-content p { margin: 28px 0 0; max-width: 540px; color: rgba(255,255,255,.72); font-size: 17px; line-height: 1.7; }
.brand-foot { position: absolute; left: clamp(44px,7vw,110px); bottom: 42px; z-index: 2; font-size: 12px; letter-spacing: .08em; color: rgba(255,255,255,.48); }
.brand-orbit { position:absolute; border:1px solid rgba(255,255,255,.11); border-radius:50%; }
.orbit-one { width:520px; height:520px; right:-250px; bottom:-190px; }
.orbit-two { width:340px; height:340px; right:-80px; top:-160px; }

.auth-main { min-height: 100vh; display:flex; flex-direction:column; align-items:center; justify-content:center; padding: 54px clamp(28px,6vw,92px) 24px; background: radial-gradient(circle at 50% 0,#f6fbfe 0,transparent 42%),#fff; }
.auth-card { width: min(100%, 470px); }
.mobile-logo { display:none; }
.eyebrow { color: var(--brand); margin-bottom: 13px; }
.auth-card h2,.selection-intro h1,.dashboard-placeholder h1 { margin:0; font-size: clamp(36px,4vw,54px); letter-spacing:-.045em; line-height:1.04; font-weight: 650; }
.lead,.selection-intro p,.dashboard-placeholder>p { margin:14px 0 36px; color:var(--muted); line-height:1.65; }
.auth-form { display:grid; gap:20px; }
.field { display:grid; gap:8px; font-size:13px; font-weight:700; color:#2c424c; }
.field-control { position:relative; display:flex; align-items:center; min-height:58px; border:1px solid var(--line); background:#fff; transition:.22s ease; }
.field-control:focus-within { border-color: rgba(57,171,226,.78); box-shadow:0 0 0 4px rgba(57,171,226,.10); }
.field-control>svg { width:20px; margin-left:17px; fill:none; stroke:#809098; stroke-width:1.7; }
.field-control input { width:100%; height:56px; padding:0 16px; border:0; outline:0; background:transparent; color:var(--text); }
.field-control input::placeholder { color:#a7b2b8; }
.reveal-password { width:48px; height:56px; border:0; background:transparent; cursor:pointer; display:grid; place-items:center; }
.reveal-password svg { width:20px; fill:none; stroke:#809098; stroke-width:1.7; }
.field-error,.validation-summary { color:var(--danger); font-size:12px; font-weight:600; }
.validation-summary:empty { display:none; }
.validation-summary ul { margin:0; padding-left:18px; }
.alert { margin-bottom:20px; padding:13px 15px; border:1px solid rgba(181,61,72,.18); background:#fff5f6; color:#963541; font-size:13px; }
.primary-action { min-height:58px; margin-top:5px; padding:0 20px; border:0; background:var(--brand); color:#fff; font-weight:800; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:10px; transition:.22s ease; box-shadow:0 12px 24px rgba(57,171,226,.22); text-decoration:none; }
.primary-action:hover { background:var(--brand-strong); transform:translateY(-1px); }
.primary-action svg { width:19px; fill:none; stroke:currentColor; stroke-width:2; }
.primary-action.is-loading { opacity:.72; cursor:wait; }
.primary-action.is-loading span::after { content:"…"; }
.security-note { margin-top:22px; display:flex; align-items:center; gap:9px; color:#829097; font-size:12px; line-height:1.45; }
.status-dot { width:8px; height:8px; border-radius:50%; background:#3dbc86; box-shadow:0 0 0 4px rgba(61,188,134,.12); }
.auth-footer { margin-top:auto; padding-top:42px; color:#98a4aa; font-size:11px; }

.selection-shell { min-height:100vh; background:radial-gradient(circle at 50% -10%,#e8f6fd 0,transparent 33%),#f7f9fa; }
.selection-header,.app-header { height:88px; padding:0 clamp(24px,6vw,88px); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); background:rgba(255,255,255,.72); backdrop-filter:blur(18px); }
.selection-header img,.app-brand img { width:104px; height:auto; }
.secure-pill { display:flex; align-items:center; gap:8px; font-size:12px; color:#61737d; border:1px solid var(--line); padding:9px 12px; background:#fff; }
.secure-pill span { width:7px;height:7px;border-radius:50%;background:#35b87b; }
.selection-main { width:min(1100px,calc(100% - 48px)); margin:0 auto; padding:90px 0; }
.selection-intro { margin-bottom:40px; }
.selection-intro h1 { font-size:clamp(38px,5vw,60px); }
.company-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(310px,1fr)); gap:16px; margin-bottom:34px; }
.company-grid form { margin:0; }
.company-card { width:100%; min-height:118px; border:1px solid var(--line); background:rgba(255,255,255,.9); padding:22px; display:flex; align-items:center; text-align:left; gap:16px; cursor:pointer; transition:.22s ease; box-shadow:0 8px 30px rgba(16,56,84,.04); }
.company-card:hover { transform:translateY(-3px); border-color:rgba(57,171,226,.40); box-shadow:0 18px 44px rgba(16,56,84,.09); }
.company-mark { flex:0 0 50px; height:50px; display:grid; place-items:center; background:var(--brand-soft); color:var(--brand); font-size:19px; font-weight:850; }
.company-copy { display:grid; gap:6px; min-width:0; flex:1; }
.company-copy strong { font-size:16px; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.company-copy small { color:#7b8b93; font-size:11px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.company-arrow { color:var(--brand); font-size:22px; transition:transform .2s ease; }
.company-card:hover .company-arrow { transform:translateX(4px); }
.text-link { color:var(--brand-strong); text-decoration:none; font-weight:750; font-size:13px; }

.app-shell { min-height:100vh; background:#f5f7f8; }
.app-brand { display:flex; align-items:center; gap:14px; font-weight:800; color:#52646e; }
.app-brand span { padding-left:14px; border-left:1px solid var(--line); }
.app-actions { display:flex; align-items:center; gap:20px; }
.company-chip { display:grid; gap:2px; text-align:right; }
.company-chip small { color:#87949b; font-size:10px; text-transform:uppercase; letter-spacing:.08em; }
.company-chip strong { font-size:13px; }
.ghost-button { height:38px; padding:0 14px; border:1px solid var(--line); background:#fff; color:#4e626c; cursor:pointer; font-weight:700; font-size:12px; }
.dashboard-stage { min-height:calc(100vh - 88px); display:grid; place-items:center; padding:44px; }
.dashboard-placeholder { width:min(920px,100%); padding:clamp(38px,6vw,76px); background:#fff; border:1px solid var(--line); box-shadow:var(--shadow); }
.placeholder-icon { width:64px;height:64px;display:grid;place-items:center;background:var(--brand-soft);margin-bottom:32px; }
.placeholder-icon svg { width:30px;fill:none;stroke:var(--brand);stroke-width:1.7; }
.dashboard-placeholder>p { max-width:700px; }
.context-grid { display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--line); margin-top:32px; }
.context-grid>div { padding:18px; display:grid; gap:6px; border-right:1px solid var(--line); }
.context-grid>div:last-child { border-right:0; }
.context-grid small { color:#85939a; font-size:10px; text-transform:uppercase; letter-spacing:.08em; }
.context-grid strong { font-size:14px; }
.next-step { margin-top:24px; padding-top:20px; border-top:1px solid var(--line); color:#77878f; font-size:12px; }

.message-shell { min-height:100vh;display:grid;place-items:center;padding:30px;background:#f5f7f8; }
.message-card { width:min(480px,100%);background:#fff;border:1px solid var(--line);padding:48px;text-align:center;box-shadow:var(--shadow); }
.message-card img { width:120px;margin-bottom:28px; }
.message-code { width:58px;height:58px;margin:0 auto 22px;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand);font-weight:900;font-size:20px; }
.message-card h1 { margin:0;font-size:30px;letter-spacing:-.04em; }
.message-card p { color:var(--muted);line-height:1.6;margin:14px 0 28px; }
.inline-action { display:inline-flex; min-height:46px; }

@media (max-width: 900px) {
    .auth-shell { grid-template-columns:1fr; }
    .brand-panel { display:none; }
    .auth-main { padding:36px 24px 22px; }
    .mobile-logo { display:block; margin-bottom:48px; }
    .mobile-logo img { width:120px; }
    .auth-footer { padding-top:50px; text-align:center; }
    .context-grid { grid-template-columns:repeat(2,1fr); }
    .context-grid>div:nth-child(2) { border-right:0; }
    .context-grid>div:nth-child(-n+2) { border-bottom:1px solid var(--line); }
}

@media (max-width: 620px) {
    .selection-header,.app-header { height:auto; min-height:76px; padding:16px 20px; }
    .selection-main { width:calc(100% - 32px); padding:58px 0; }
    .company-grid { grid-template-columns:1fr; }
    .app-header { align-items:flex-start; gap:18px; }
    .app-actions { flex-direction:column; align-items:flex-end; gap:8px; }
    .company-chip { display:none; }
    .dashboard-stage { padding:18px; }
    .dashboard-placeholder { padding:30px 22px; }
    .context-grid { grid-template-columns:1fr; }
    .context-grid>div,.context-grid>div:nth-child(2) { border-right:0; border-bottom:1px solid var(--line); }
    .context-grid>div:last-child { border-bottom:0; }
}

@media (prefers-reduced-motion: reduce) {
    *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; }
}

/* Workspace / dashboard library */
.workspace-shell { min-height:100vh; background:linear-gradient(180deg,#f7fbfe 0,#f2f7fb 46%,#f6f8fa 100%); }
.workspace-header { min-height:68px; padding:10px clamp(16px,3vw,40px); display:flex; align-items:center; justify-content:space-between; gap:16px; border-bottom:1px solid rgba(16,56,84,.09); background:rgba(255,255,255,.88); backdrop-filter:blur(18px); position:sticky; top:0; z-index:20; }
.workspace-brand { display:flex; align-items:center; gap:12px; color:#607684; text-decoration:none; min-width:0; }
.workspace-brand img { width:96px; height:auto; flex:none; }
.workspace-brand span { border-left:1px solid var(--line); padding-left:12px; font-size:10px; text-transform:uppercase; letter-spacing:.12em; font-weight:800; white-space:nowrap; }
.workspace-actions { display:flex; align-items:center; gap:10px; min-width:0; }
.workspace-company { max-width:220px; padding:7px 11px; border:1px solid var(--line); background:#fff; font-size:11px; color:#385263; font-weight:750; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.profile-menu { display:flex; align-items:center; gap:8px; min-width:0; }
.profile-avatar { width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:linear-gradient(145deg,var(--brand),#137eb7); color:#fff; font-size:12px; font-weight:850; box-shadow:0 8px 20px rgba(57,171,226,.18); }
.profile-copy { display:grid; gap:0; min-width:0; }
.profile-copy strong { max-width:160px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; }
.profile-copy span { color:#8a9aa4; font-size:10px; }
.icon-button { width:36px; height:36px; border:1px solid var(--line); background:#fff; display:grid; place-items:center; cursor:pointer; color:#617681; transition:.2s ease; }
.icon-button:hover { color:var(--brand-strong); border-color:rgba(57,171,226,.38); background:var(--brand-soft); }
.icon-button svg { width:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.workspace-main { width:min(1280px,calc(100% - 32px)); margin:0 auto; padding:28px 0 42px; }
.workspace-intro { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:24px; margin-bottom:24px; }
.workspace-intro .eyebrow { margin-bottom:10px; }
.workspace-intro h1 { margin:0; font-size:clamp(30px,3.3vw,46px); line-height:1.02; letter-spacing:-.048em; font-weight:680; color:#10283a; }
.workspace-intro h1 span { color:var(--brand); }
.workspace-intro p { max-width:760px; margin:10px 0 0; color:var(--muted); font-size:14px; line-height:1.48; }
.workspace-summary { min-width:132px; padding:14px 16px; border:1px solid var(--line); background:rgba(255,255,255,.78); display:grid; gap:5px; box-shadow:0 8px 26px rgba(16,56,84,.04); }
.workspace-summary span { color:#7a8d98; font-size:10px; text-transform:uppercase; letter-spacing:.1em; font-weight:800; }
.workspace-summary strong { color:var(--brand-strong); font-size:28px; line-height:1; letter-spacing:-.04em; }
.dashboard-library { padding-top:2px; }
.library-toolbar { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom:16px; }
.section-kicker { color:var(--brand-strong); font-size:10px; font-weight:850; text-transform:uppercase; letter-spacing:.13em; }
.library-toolbar h2 { margin:3px 0 0; font-size:20px; letter-spacing:-.03em; }
.library-search { width:min(300px,38vw); height:42px; display:flex; align-items:center; gap:8px; padding:0 12px; border:1px solid var(--line); background:#fff; transition:.2s ease; }
.library-search:focus-within { border-color:rgba(57,171,226,.68); box-shadow:0 0 0 4px rgba(57,171,226,.08); }
.library-search svg { width:17px; fill:none; stroke:#8799a4; stroke-width:1.7; flex:none; }
.library-search input { width:100%; height:38px; border:0; outline:0; background:transparent; color:var(--text); font-size:14px; }
.library-search input::placeholder { color:#9eabb3; }
.dashboard-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.dashboard-card { min-width:0; border:1px solid rgba(16,56,84,.10); background:#fff; overflow:hidden; box-shadow:0 7px 24px rgba(16,56,84,.04); transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease; }
.dashboard-card:hover { transform:translateY(-3px); box-shadow:0 16px 34px rgba(16,56,84,.085); border-color:rgba(57,171,226,.26); }
.dashboard-card[hidden] { display:none; }
.dashboard-card-visual { height:104px; position:relative; overflow:hidden; background:linear-gradient(145deg,#072d47,#0c668f 58%,#139fd4); }
.dashboard-card-visual::before { content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px); background-size:24px 24px; }
.visual-glow { position:absolute; width:150px; height:150px; right:-36px; top:-56px; border-radius:50%; background:rgba(113,225,248,.20); filter:blur(1px); }
.mini-chart { position:absolute; z-index:2; }
.mini-chart-bars { left:20px; bottom:18px; width:86px; height:58px; display:flex; align-items:flex-end; gap:6px; }
.mini-chart-bars i { flex:1; background:rgba(255,255,255,.83); min-height:18%; box-shadow:0 0 0 1px rgba(255,255,255,.08) inset; }
.mini-chart-bars i:nth-child(1) { height:34%; opacity:.56; }
.mini-chart-bars i:nth-child(2) { height:62%; opacity:.72; }
.mini-chart-bars i:nth-child(3) { height:46%; opacity:.62; }
.mini-chart-bars i:nth-child(4) { height:88%; }
.mini-chart-line { right:18px; bottom:28px; width:110px; height:48px; border-bottom:1px solid rgba(255,255,255,.22); }
.mini-chart-line::before { content:""; position:absolute; left:0; right:0; bottom:10px; height:2px; background:linear-gradient(100deg,transparent 0,transparent 4%,#9ff5e7 5%,#9ff5e7 26%,transparent 27%,transparent 32%,#9ff5e7 33%,#9ff5e7 56%,transparent 57%,transparent 62%,#9ff5e7 63%,#9ff5e7 100%); transform:skewY(-13deg); transform-origin:center; opacity:.95; }
.mini-chart-line span { position:absolute; right:8px; top:8px; width:8px; height:8px; border-radius:50%; background:#9ff5e7; box-shadow:0 0 0 5px rgba(159,245,231,.14); }
.dashboard-card-body { padding:14px; }
.dashboard-card-title-row { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.dashboard-card h3 { margin:0; min-width:0; font-size:15px; line-height:1.24; letter-spacing:-.018em; overflow-wrap:anywhere; }
.dashboard-card-arrow { width:24px; height:24px; border-radius:50%; display:grid; place-items:center; flex:none; background:var(--brand-soft); color:var(--brand-strong); font-size:12px; }
.dashboard-card p { margin:6px 0 12px; color:#8a99a2; font-size:10px; }
.dashboard-open-button { width:100%; min-height:36px; border:1px solid rgba(57,171,226,.26); background:#f7fcff; color:var(--brand-strong); font-weight:800; font-size:11px; cursor:pointer; opacity:1; display:flex; align-items:center; justify-content:center; text-decoration:none; transition:background .18s ease,border-color .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease; }
.dashboard-open-button:hover { background:var(--brand); border-color:var(--brand); color:#fff; transform:translateY(-1px); box-shadow:0 8px 20px rgba(57,171,226,.20); }
.dashboard-open-button:focus-visible { outline:3px solid rgba(57,171,226,.22); outline-offset:3px; }
.friendly-notice { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:14px; padding:15px 16px; border:1px solid rgba(181,61,72,.14); background:#fff; box-shadow:0 10px 28px rgba(16,56,84,.04); }
.friendly-notice-icon { width:30px; height:30px; display:grid; place-items:center; border-radius:50%; background:#fff1f2; color:#b53d48; font-weight:900; }
.friendly-notice strong { font-size:12px; }
.friendly-notice p { margin:2px 0 0; color:#7c8d97; font-size:11px; }
.friendly-notice a { color:var(--brand-strong); font-size:11px; font-weight:800; text-decoration:none; }
.empty-library { min-height:220px; padding:34px; border:1px solid var(--line); background:#fff; display:flex; align-items:center; justify-content:center; gap:18px; text-align:left; box-shadow:0 12px 38px rgba(16,56,84,.04); }
.empty-library-icon { width:54px; height:54px; display:grid; place-items:center; flex:none; background:var(--brand-soft); }
.empty-library-icon svg { width:25px; fill:none; stroke:var(--brand); stroke-width:1.65; }
.empty-library h2 { margin:0 0 6px; font-size:19px; letter-spacing:-.03em; }
.empty-library p { margin:0; color:var(--muted); line-height:1.45; font-size:12px; }
.search-empty { padding:34px 16px; text-align:center; color:#687d89; }
.search-empty strong,.search-empty span { display:block; }
.search-empty strong { color:#253e4e; margin-bottom:6px; }
.search-empty span { font-size:12px; }

@media (max-width: 1180px) {
    .dashboard-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 1020px) {
    .profile-copy { display:none; }
    .workspace-main { width:calc(100% - 24px); padding:22px 0 34px; }
    .workspace-intro { grid-template-columns:minmax(0,1fr); align-items:start; gap:12px; margin-bottom:18px; }
    .workspace-intro h1 { font-size:clamp(28px,5vw,38px); }
    .workspace-intro p { font-size:13px; line-height:1.42; }
    .workspace-summary { width:126px; min-width:0; }
}
@media (max-width: 760px) {
    .workspace-header { min-height:62px; padding:10px 12px; gap:10px; }
    .workspace-brand { gap:8px; }
    .workspace-brand span,.workspace-company,.workspace-summary,.workspace-intro p { display:none; }
    .workspace-brand img { width:86px; }
    .workspace-actions { gap:7px; }
    .profile-avatar { width:30px; height:30px; font-size:11px; }
    .icon-button { width:32px; height:32px; }
    .icon-button svg { width:16px; }
    .workspace-main { width:calc(100% - 20px); padding:16px 0 28px; }
    .workspace-intro { margin-bottom:12px; }
    .workspace-intro .eyebrow { margin-bottom:6px; font-size:9px; }
    .workspace-intro h1 { font-size:clamp(24px,8vw,30px); }
    .library-toolbar { display:block; margin-bottom:12px; }
    .library-toolbar h2 { font-size:18px; }
    .library-search { margin-top:10px; width:100%; height:38px; }
    .library-search input { height:34px; font-size:13px; }
    .dashboard-grid { grid-template-columns:1fr; gap:12px; }
    .dashboard-card-visual { height:88px; }
    .dashboard-card-body { padding:12px; }
    .dashboard-card h3 { font-size:14px; }
    .dashboard-open-button { min-height:34px; }
    .empty-library { text-align:center; flex-direction:column; padding:28px 18px; }
    .friendly-notice { grid-template-columns:auto 1fr; gap:10px; padding:12px; }
    .friendly-notice a { grid-column:2; }
}

/* v19 · Tema global Fomplus */
html { color-scheme: light; }
html[data-fomplus-dark="true"] { color-scheme: dark; }
:root {
    --app-bg: #f5f9fc;
    --app-surface: #ffffff;
    --app-surface-soft: #f7fbfe;
    --app-text: #10283a;
    --app-muted: #698090;
    --app-line: rgba(16,56,84,.12);
    --app-shadow: rgba(16,56,84,.08);
    --app-brand: #39abe2;
    --app-brand-strong: #177fb8;
    --app-accent: #8ce8da;
}
html[data-fomplus-theme="softblue"] { --app-bg:#eef7fc; --app-surface:#fff; --app-surface-soft:#f2faff; --app-brand:#337ab7; --app-brand-strong:#1f659f; --app-accent:#80cceb; }
html[data-fomplus-theme="carmine"] { --app-bg:#fbf5f7; --app-surface:#fff; --app-surface-soft:#fff7f9; --app-brand:#c94d6d; --app-brand-strong:#9e3451; --app-accent:#ec9bb2; }
html[data-fomplus-theme="dark"] { --app-bg:#181b1f; --app-surface:#23272c; --app-surface-soft:#1e2328; --app-text:#edf5f9; --app-muted:#9eb0bc; --app-line:rgba(255,255,255,.12); --app-shadow:rgba(0,0,0,.30); --app-brand:#57bce8; --app-brand-strong:#78cdf0; --app-accent:#7de1d0; }
html[data-fomplus-theme="darkmoon"] { --app-bg:#111827; --app-surface:#182235; --app-surface-soft:#141e2f; --app-text:#eef6ff; --app-muted:#9cafc4; --app-line:rgba(151,180,211,.16); --app-shadow:rgba(0,0,0,.34); --app-brand:#69b7ff; --app-brand-strong:#8cc8ff; --app-accent:#9b8cff; }

body { background:var(--app-bg); color:var(--app-text); }
.workspace-shell { background:var(--app-bg); color:var(--app-text); }
.workspace-header { background:color-mix(in srgb,var(--app-surface) 92%,transparent); border-bottom-color:var(--app-line); }
.workspace-company,.icon-button,.dashboard-card,.library-search,.workspace-summary,.friendly-notice,.empty-library { background:var(--app-surface); border-color:var(--app-line); color:var(--app-text); }
.workspace-intro h1,.library-toolbar h2,.dashboard-card h3,.empty-library h2,.search-empty strong,.profile-copy strong { color:var(--app-text); }
.workspace-intro p,.dashboard-card p,.empty-library p,.search-empty,.profile-copy span { color:var(--app-muted); }
.library-search input { color:var(--app-text); }
.dashboard-open-button { background:var(--app-surface-soft); }
html[data-fomplus-dark="true"] .dashboard-card-visual { filter:saturate(.88) brightness(.82); }
html[data-fomplus-dark="true"] .workspace-brand img,
html[data-fomplus-dark="true"] .mobile-logo img { filter:drop-shadow(0 0 0 transparent); }

.auth-main { background:var(--app-surface); color:var(--app-text); }
.auth-card h2,.field>span,.security-note { color:var(--app-text); }
.auth-card .lead,.auth-footer { color:var(--app-muted); }
.field-control { background:var(--app-surface-soft); border-color:var(--app-line); }
.field-control input { color:var(--app-text); }
html[data-fomplus-theme="softblue"] .brand-panel { background:linear-gradient(145deg,#082d4b 0%,#0f5b8c 52%,#268fc3 100%); }
html[data-fomplus-theme="carmine"] .brand-panel { background:linear-gradient(145deg,#3c1020 0%,#7b2944 52%,#b54f70 100%); }
html[data-fomplus-theme="dark"] .brand-panel { background:linear-gradient(145deg,#090d11 0%,#182b38 55%,#174b66 100%); }
html[data-fomplus-theme="darkmoon"] .brand-panel { background:linear-gradient(145deg,#0b1020 0%,#15284b 55%,#443a8d 100%); }

.app-theme-picker { position:fixed; right:18px; bottom:18px; z-index:80; display:flex; align-items:center; gap:8px; padding:8px 10px; border:1px solid var(--app-line); background:color-mix(in srgb,var(--app-surface) 94%,transparent); box-shadow:0 12px 34px var(--app-shadow); backdrop-filter:blur(16px); }
.app-theme-picker span { font-size:10px; font-weight:850; letter-spacing:.08em; text-transform:uppercase; color:var(--app-muted); }
.app-theme-picker select { height:30px; border:1px solid var(--app-line); background:var(--app-surface); color:var(--app-text); font:inherit; font-size:12px; font-weight:750; padding:0 26px 0 8px; }
@media(max-width:720px){ .app-theme-picker { right:10px; bottom:10px; } .app-theme-picker span { display:none; } }

/* Vincula las variables históricas de la app con el tema global seleccionado. */
html[data-fomplus-theme="light"] { --bg:#f3f8fc; --surface:rgba(255,255,255,.92); --surface-strong:#fff; --text:#10283a; --muted:#667d8d; --line:rgba(16,56,84,.12); --brand:#39abe2; --brand-strong:#177fb8; --brand-soft:#e9f7fd; }
html[data-fomplus-theme="softblue"] { --bg:#edf6fb; --surface:rgba(255,255,255,.94); --surface-strong:#fff; --text:#153349; --muted:#667f90; --line:rgba(28,91,132,.14); --brand:#337ab7; --brand-strong:#1f659f; --brand-soft:#e4f2fb; }
html[data-fomplus-theme="carmine"] { --bg:#faf3f5; --surface:rgba(255,255,255,.94); --surface-strong:#fff; --text:#38232b; --muted:#806b73; --line:rgba(126,53,76,.14); --brand:#c94d6d; --brand-strong:#9e3451; --brand-soft:#fbe7ed; }
html[data-fomplus-theme="dark"] { --bg:#181b1f; --surface:rgba(35,39,44,.94); --surface-strong:#23272c; --text:#edf5f9; --muted:#9eb0bc; --line:rgba(255,255,255,.12); --brand:#57bce8; --brand-strong:#78cdf0; --brand-soft:#233d4a; --shadow:0 28px 80px rgba(0,0,0,.30); }
html[data-fomplus-theme="darkmoon"] { --bg:#111827; --surface:rgba(24,34,53,.94); --surface-strong:#182235; --text:#eef6ff; --muted:#9cafc4; --line:rgba(151,180,211,.16); --brand:#69b7ff; --brand-strong:#8cc8ff; --brand-soft:#233554; --shadow:0 28px 80px rgba(0,0,0,.34); }
html[data-fomplus-dark="true"] .auth-main,
html[data-fomplus-dark="true"] .selection-shell,
html[data-fomplus-dark="true"] .selection-header,
html[data-fomplus-dark="true"] .app-header,
html[data-fomplus-dark="true"] .company-card,
html[data-fomplus-dark="true"] .secure-pill,
html[data-fomplus-dark="true"] .field-control { background:var(--surface-strong); color:var(--text); border-color:var(--line); }
html[data-fomplus-dark="true"] .auth-main { background:radial-gradient(circle at 50% 0,color-mix(in srgb,var(--brand) 10%,transparent) 0,transparent 42%),var(--bg); }


/* Apertura protegida de tableros ------------------------------------------------ */
.dashboard-opening-overlay[hidden] { display:none; }
.dashboard-opening-overlay { position:fixed; inset:0; z-index:1000; display:grid; place-items:center; padding:24px; background:color-mix(in srgb,var(--app-bg,#f7fafc) 82%,transparent); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.dashboard-opening-card { min-width:min(390px,calc(100vw - 36px)); display:flex; align-items:center; gap:16px; padding:22px 24px; border:1px solid var(--app-line,rgba(16,56,84,.10)); background:var(--app-surface,#fff); color:var(--app-text,#10283a); box-shadow:0 24px 70px rgba(15,48,77,.18); }
.dashboard-opening-card > div { min-width:0; display:grid; gap:4px; }
.dashboard-opening-card strong { font-size:15px; letter-spacing:-.01em; }
.dashboard-opening-card span:not(.dashboard-opening-spinner) { min-height:16px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--app-muted,#718794); font-size:11px; }
.dashboard-opening-spinner { width:34px; height:34px; flex:none; border:3px solid color-mix(in srgb,var(--app-brand,#39abe2) 20%,transparent); border-top-color:var(--app-brand,#39abe2); border-radius:50%; animation:fomplus-dashboard-opening-spin .72s linear infinite; }
@keyframes fomplus-dashboard-opening-spin { to { transform:rotate(360deg); } }
html.is-opening-dashboard,html.is-opening-dashboard body { cursor:progress; }
html.is-opening-dashboard .dashboard-open-button { pointer-events:none; }
.dashboard-open-button.is-loading { opacity:.72; cursor:progress; }
.dashboard-open-button.is-blocked { opacity:.42; }


/* v29 · catálogo más compacto y tarjetas clicables */
.dashboard-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.dashboard-card {
    display:grid;
    grid-template-columns:96px minmax(0,1fr);
    align-items:stretch;
    min-height:88px;
    cursor:pointer;
    position:relative;
}
.dashboard-card:focus-visible {
    outline:3px solid rgba(57,171,226,.22);
    outline-offset:2px;
}
.dashboard-card-visual { height:auto; min-height:88px; }
.dashboard-card-body {
    padding:10px 12px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-width:0;
}
.dashboard-card-title-row { gap:8px; align-items:flex-start; }
.dashboard-card h3 { font-size:14px; line-height:1.2; }
.dashboard-card p { margin:4px 0 0; font-size:10px; }
.dashboard-card-arrow { width:22px; height:22px; font-size:11px; }
.dashboard-open-button { display:none !important; }
.mini-chart-bars { left:14px; bottom:14px; width:54px; height:40px; gap:5px; }
.mini-chart-line { right:12px; bottom:20px; width:52px; height:32px; }
.visual-glow { width:110px; height:110px; right:-28px; top:-42px; }
.dashboard-card.is-blocked { opacity:.66; pointer-events:none; }
.dashboard-card.is-loading { border-color:rgba(57,171,226,.42); box-shadow:0 0 0 3px rgba(57,171,226,.10), 0 16px 34px rgba(16,56,84,.085); }

@media (max-width: 1180px) {
    .dashboard-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 760px) {
    .dashboard-grid { grid-template-columns:1fr; gap:8px; }
    .dashboard-card { grid-template-columns:84px minmax(0,1fr); min-height:80px; }
    .dashboard-card-visual { min-height:80px; }
    .dashboard-card-body { padding:9px 10px; }
    .dashboard-card h3 { font-size:13px; }
    .dashboard-card p { font-size:10px; }
    .mini-chart-bars { left:12px; bottom:12px; width:48px; height:34px; gap:4px; }
    .mini-chart-line { right:10px; bottom:18px; width:46px; height:26px; }
}

/* v33 · bordes redondeados globales */
:root {
  --fomplus-radius-xs: 8px;
  --fomplus-radius-sm: 10px;
  --fomplus-radius-md: 14px;
  --fomplus-radius-lg: 18px;
  --fomplus-radius-xl: 22px;
}

.login-shell,
.login-panel,
.company-shell,
.company-card,
.dashboard-card,
.empty-library,
.friendly-notice,
.workspace-company,
.library-search,
.primary-action,
.ghost-action,
.icon-button,
.app-theme-picker,
.app-theme-picker select,
.search-empty,
.dashboard-open-button,
input,
select,
textarea,
button {
  border-radius: var(--fomplus-radius-md);
}

.profile-avatar,
.dashboard-card-arrow,
.friendly-notice-icon,
.empty-library-icon {
  border-radius: 999px;
}

.workspace-summary,
.primary-action.is-loading,
.company-option,
.login-side,
.login-form,
.login-field,
.password-toggle,
.login-submit,
.company-select,
.library-search input {
  border-radius: var(--fomplus-radius-sm);
}

.dashboard-card,
.company-card,
.login-panel,
.empty-library,
.friendly-notice {
  overflow: hidden;
}

.login-field,
.company-option,
.company-select,
.library-search,
.workspace-company {
  overflow: clip;
}

/* v34 · redondeo sutil y uniforme */
:root {
  --fomplus-radius-xs: 4px;
  --fomplus-radius-sm: 6px;
  --fomplus-radius-md: 6px;
  --fomplus-radius-lg: 8px;
  --fomplus-radius-xl: 10px;
}

.field-control,
.field-control input,
.reveal-password,
.primary-action,
.workspace-company,
.library-search,
.library-search input,
.workspace-summary,
.dashboard-card,
.friendly-notice,
.empty-library,
.company-option,
.company-select,
.icon-button,
.app-theme-picker,
.app-theme-picker select,
input,
select,
textarea,
button {
  border-radius: 6px;
}

/* El contenedor es quien dibuja el borde del login. */
.field-control {
  overflow: hidden;
}

/* Mantener circulares únicamente los elementos que semánticamente lo son. */
.profile-avatar,
.dashboard-card-arrow,
.friendly-notice-icon,
.status-dot {
  border-radius: 999px;
}

/* v36 · página de estado controlada */
.status-page-shell {
  min-height: 100dvh;
  display: grid;
  place-items: center;
  padding: 24px;
  background: var(--app-bg, #f5f9fc);
  color: var(--app-text, #10283a);
}
.status-page-card {
  width: min(520px, 100%);
  padding: clamp(28px, 5vw, 46px);
  border: 1px solid var(--app-line, rgba(16,56,84,.12));
  border-radius: 8px;
  background: var(--app-surface, #fff);
  text-align: center;
  box-shadow: 0 18px 48px rgba(16,56,84,.08);
}
.status-page-logo {
  display: block;
  width: 118px;
  height: auto;
  margin: 0 auto 28px;
}
.status-page-code {
  margin-bottom: 8px;
  color: var(--app-brand, #39abe2);
  font-size: clamp(38px, 9vw, 64px);
  font-weight: 850;
  line-height: 1;
  letter-spacing: -.05em;
}
.status-page-card h1 {
  margin: 0;
  font-size: clamp(24px, 5vw, 34px);
  line-height: 1.12;
  letter-spacing: -.035em;
}
.status-page-card p {
  max-width: 400px;
  margin: 14px auto 24px;
  color: var(--app-muted, #718692);
  font-size: 14px;
  line-height: 1.55;
}
.status-page-action {
  display: inline-flex;
  width: auto;
  min-width: 190px;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  padding: 0 20px;
  border-radius: 6px;
  text-decoration: none;
}
@media (max-width: 560px) {
  .status-page-shell { padding: 14px; }
  .status-page-card { padding: 28px 20px; }
  .status-page-logo { width: 100px; margin-bottom: 22px; }
  .status-page-action { width: 100%; }
}

/* v38 · agrupación de tableros propios y compartidos */
.dashboard-group { margin-top: 14px; }
.dashboard-group + .dashboard-group { margin-top: 22px; }
.dashboard-group-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin-bottom:10px; }
.dashboard-group-heading h3 { margin:2px 0 0; font-size:16px; line-height:1.2; letter-spacing:-.02em; }
.dashboard-group-count { min-width:28px; height:24px; padding:0 8px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; background:var(--brand-soft); color:var(--brand-strong); font-size:10px; font-weight:850; }
.dashboard-card--shared { border-style:dashed; }
.dashboard-card-shared-mark { flex:none; align-self:flex-start; padding:3px 6px; border-radius:5px; background:var(--brand-soft); color:var(--brand-strong); font-size:8px; line-height:1.2; font-weight:850; white-space:nowrap; }
.dashboard-card-shared-owner { margin-top:4px; color:var(--muted); font-size:9px; line-height:1.3; letter-spacing:.01em; }
.dashboard-card-shared-owner span { font-weight:600; }
.dashboard-card-shared-owner strong { color:var(--text); font-weight:750; }
html[data-fomplus-dark="true"] .dashboard-card-shared-mark { background:rgba(57,171,226,.12); color:#72c9ef; }
@media(max-width:760px){
  .dashboard-group + .dashboard-group { margin-top:18px; }
  .dashboard-group-heading h3 { font-size:15px; }
  .dashboard-card-shared-mark { font-size:7px; padding:3px 5px; }
}


/* v46: creación de tableros y toolbar compacta */
.library-toolbar-actions { display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.dashboard-create-form { margin:0; }
.dashboard-create-button { min-height:42px; display:inline-flex; align-items:center; gap:8px; padding:0 14px; border:1px solid color-mix(in srgb,var(--brand) 45%,var(--app-line)); border-radius:6px; background:var(--brand); color:#fff; font:inherit; font-weight:700; cursor:pointer; white-space:nowrap; }
.dashboard-create-button svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; }
.dashboard-create-button:hover { filter:brightness(.96); }
.dashboard-create-button:focus-visible { outline:2px solid color-mix(in srgb,var(--brand) 45%,transparent); outline-offset:2px; }
@media (max-width:760px) { .library-toolbar-actions { width:100%; justify-content:stretch; } .dashboard-create-form { flex:1 1 auto; } .dashboard-create-button { width:100%; justify-content:center; } .library-search { flex:1 1 100%; } }

/* v48 · preferencias compactas y selección de empresa en el login */
.quick-preferences { display:inline-flex; align-items:center; gap:6px; }
.quick-preferences--fixed { position:fixed; top:14px; right:14px; z-index:1200; padding:4px; border:1px solid var(--app-line,rgba(16,56,84,.12)); border-radius:8px; background:color-mix(in srgb,var(--app-surface,#fff) 92%,transparent); box-shadow:0 8px 24px var(--app-shadow,rgba(16,56,84,.10)); backdrop-filter:blur(14px); }
.workspace-shell ~ .quick-preferences--fixed { display:none; }
.quick-language-form { margin:0; display:inline-flex; }
.quick-preference-button { width:34px; height:34px; padding:0; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--app-line,rgba(16,56,84,.12)); border-radius:6px; background:var(--app-surface,#fff); color:var(--app-text,#10283a); cursor:pointer; box-shadow:none; transition:background .16s ease,border-color .16s ease,transform .16s ease; }
.quick-preference-button:hover { background:var(--app-surface-soft,#f5f9fc); border-color:color-mix(in srgb,var(--app-brand,#39abe2) 35%,var(--app-line)); }
.quick-preference-button:active { transform:translateY(1px); }
.quick-preference-button:focus-visible { outline:2px solid color-mix(in srgb,var(--app-brand,#39abe2) 40%,transparent); outline-offset:2px; }
.quick-preference-button svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.quick-language-button span { font-size:17px; line-height:1; }
.workspace-actions .quick-preferences { flex:none; }

.field-control--select select { width:100%; height:56px; padding:0 42px 0 16px; border:0; outline:0; background:transparent; color:var(--app-text,var(--text)); font:inherit; appearance:auto; }
.field-control--select select:invalid { color:var(--app-muted,#718692); }
.field-control--verified { background:color-mix(in srgb,var(--app-brand,#39abe2) 5%,var(--app-surface-soft,#f5f9fc)); }
.field-control--verified input { cursor:default; }
.verified-mark { flex:none; width:24px; height:24px; margin-right:14px; display:inline-flex; align-items:center; justify-content:center; border-radius:999px; background:color-mix(in srgb,var(--app-brand,#39abe2) 14%,transparent); color:var(--app-brand-strong,#177fb8); font-size:12px; font-weight:900; }
.auth-change-account { justify-self:center; color:var(--app-muted,#718692); font-size:12px; font-weight:700; text-decoration:none; }
.auth-change-account:hover { color:var(--app-brand-strong,#177fb8); }
.auth-form--company { gap:16px; }
@media(max-width:720px){ .quick-preferences--fixed { top:10px; right:10px; } .quick-preference-button { width:32px; height:32px; } }


/* v49 · login centrado y selector de empresa premium */
.auth-main { position:relative; justify-content:center; padding-top:54px; padding-bottom:54px; }
.auth-footer { position:absolute; left:0; right:0; bottom:22px; margin:0; padding:0 24px; text-align:center; }
.company-combo-field { position:relative; }
.company-combobox { position:relative; width:100%; }
.company-combobox-trigger { width:100%; min-height:58px; display:flex; align-items:center; gap:12px; padding:0 14px 0 16px; border:1px solid var(--app-line,var(--line)); border-radius:6px; background:var(--app-surface-soft,#f7fbfe); color:var(--app-text,var(--text)); text-align:left; cursor:pointer; transition:border-color .18s ease,box-shadow .18s ease,background .18s ease; }
.company-combobox-trigger:hover { border-color:color-mix(in srgb,var(--app-brand,#39abe2) 34%,var(--app-line)); }
.company-combobox-trigger:focus-visible,.company-combobox.is-open .company-combobox-trigger { outline:0; border-color:color-mix(in srgb,var(--app-brand,#39abe2) 72%,var(--app-line)); box-shadow:0 0 0 4px color-mix(in srgb,var(--app-brand,#39abe2) 11%,transparent); }
.company-combobox-icon { width:23px; height:23px; flex:none; display:grid; place-items:center; color:var(--app-muted,#718692); }
.company-combobox-icon svg,.company-option-building svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.company-combobox-text { min-width:0; flex:1; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-weight:600; }
.company-combobox-chevron { width:18px; height:18px; flex:none; fill:none; stroke:var(--app-muted,#718692); stroke-width:1.8; transition:transform .18s ease; }
.company-combobox.is-open .company-combobox-chevron { transform:rotate(180deg); }
.company-combobox-menu { position:absolute; z-index:1300; left:0; right:0; top:calc(100% + 7px); max-height:286px; overflow:auto; padding:6px; border:1px solid var(--app-line,rgba(16,56,84,.12)); border-radius:8px; background:var(--app-surface,#fff); box-shadow:0 18px 46px rgba(16,56,84,.16); }
.company-combobox-menu[hidden] { display:none; }
.company-combobox-option { width:100%; min-height:54px; display:grid; grid-template-columns:36px minmax(0,1fr) 22px; align-items:center; gap:10px; padding:8px 10px; border:0; border-radius:6px; background:transparent; color:var(--app-text,var(--text)); text-align:left; cursor:pointer; }
.company-combobox-option:hover,.company-combobox-option:focus-visible { outline:0; background:var(--app-surface-soft,#f5f9fc); }
.company-combobox-option[aria-selected="true"] { background:color-mix(in srgb,var(--app-brand,#39abe2) 10%,var(--app-surface)); }
.company-option-building { width:34px; height:34px; display:grid; place-items:center; border-radius:6px; background:color-mix(in srgb,var(--app-brand,#39abe2) 10%,transparent); color:var(--app-brand-strong,#177fb8); }
.company-option-copy { min-width:0; display:grid; gap:2px; }
.company-option-copy strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; }
.company-option-copy small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--app-muted,#718692); font-size:10px; font-weight:600; }
.company-option-check { opacity:0; color:var(--app-brand-strong,#177fb8); font-weight:900; }
.company-combobox-option[aria-selected="true"] .company-option-check { opacity:1; }
.primary-action:disabled { opacity:.52; cursor:not-allowed; transform:none; box-shadow:none; }
@media(max-height:700px){ .auth-main { justify-content:flex-start; padding-top:80px; padding-bottom:72px; } .auth-footer { bottom:14px; } }
@media(max-width:900px){ .auth-main { min-height:100dvh; padding-top:72px; padding-bottom:72px; } .auth-footer { bottom:16px; } }
@media(max-width:560px){ .company-combobox-menu { max-height:240px; } }