:root{
  --bg:#071014;
  --bg-2:#0b1820;
  --panel:#111f28;
  --panel-2:#142733;
  --text:#eef6f8;
  --muted:#90a7b3;
  --line:rgba(255,255,255,.09);
  --accent:#2ee0a1;
  --accent-2:#4bb9ff;
  --warning:#f7b955;
  --danger:#ff6a6a;
  --info:#8f8dff;
  --shadow:0 22px 65px rgba(0,0,0,.38);
  --radius:24px;
  --surface-a:rgba(255,255,255,.052);
  --surface-b:rgba(255,255,255,.020);
}

*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--text)}
button,input,select,textarea{font:inherit}
button{cursor:pointer;border:0}
.hidden{display:none!important}
.eyebrow{margin:0 0 8px;color:var(--accent);text-transform:uppercase;letter-spacing:.14em;font-size:12px;font-weight:800}
.muted{color:var(--muted)}
.login-screen{min-height:100vh;position:relative;overflow:hidden;display:grid;place-items:center;padding:34px}
.login-bg{position:absolute;inset:0;background:radial-gradient(circle at 15% 18%,rgba(255,255,255,.10),transparent 28%),radial-gradient(circle at 85% 5%,rgba(255,255,255,.07),transparent 32%),linear-gradient(135deg,#061015,#0c171d 54%,#031014);z-index:0;overflow:hidden}
.login-bg: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:46px 46px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.9),transparent);z-index:1}
.rotating-sgs-mark{position:absolute;width:min(760px,56vw);aspect-ratio:1;right:5%;top:7%;border-radius:50%;background:repeating-conic-gradient(from 0deg,rgba(255,255,255,.22) 0deg 4deg,transparent 4deg 8deg);-webkit-mask:radial-gradient(circle,transparent 0 22%,#000 23% 42%,transparent 43%);mask:radial-gradient(circle,transparent 0 22%,#000 23% 42%,transparent 43%);opacity:.42;animation:sgsSpin 45s linear infinite;filter:drop-shadow(0 0 28px rgba(255,255,255,.08));z-index:0}.rotating-sgs-mark.small{width:360px;left:4%;top:10%;right:auto;opacity:.20;animation-duration:62s;animation-direction:reverse}@keyframes sgsSpin{to{transform:rotate(360deg)}}
.login-shell{position:relative;z-index:1;width:min(1180px,100%);display:grid;grid-template-columns:1.25fr .75fr;gap:26px;align-items:stretch}
.login-brand-panel,.login-card,.panel,.kpi-card{border:1px solid var(--line);background:linear-gradient(180deg,var(--surface-a),var(--surface-b));box-shadow:var(--shadow);backdrop-filter:blur(12px)}
.login-brand-panel{border-radius:34px;padding:42px;min-height:620px;display:flex;flex-direction:column;justify-content:space-between}
.brand-lockup{display:flex;gap:16px;align-items:center}.brand-lockup.compact{padding:20px 18px;border-bottom:1px solid var(--line)}
.brand-mark{width:52px;height:52px;display:grid;place-items:center;border-radius:18px;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#031014;font-weight:900;letter-spacing:-.04em}
.brand-lockup h1,.brand-lockup h2{margin:0}.brand-lockup p{margin:3px 0 0;color:var(--muted);font-size:13px}
.login-brand-panel h2{font-size:48px;line-height:1.03;letter-spacing:-.05em;max-width:790px;margin:auto 0 18px}
.login-brand-panel>.muted{font-size:18px;max-width:680px;line-height:1.65}
.login-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:30px}.login-metrics div{padding:18px;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.045)}.login-metrics strong{font-size:30px;display:block}.login-metrics span{color:var(--muted);font-size:13px}
.login-card{border-radius:34px;padding:32px;align-self:center}.login-card-head{display:flex;gap:8px;align-items:center;color:var(--muted);font-size:13px}.status-dot{width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 16px var(--accent)}
.login-card h3{font-size:34px;margin:18px 0 22px}.login-card label,.form-grid label{display:flex;flex-direction:column;gap:8px;color:#c9d7dd;font-size:13px;font-weight:700}.login-card input,.form-grid input,.form-grid select,.form-grid textarea,.mini-select{width:100%;border:1px solid var(--line);border-radius:14px;background:rgba(4,12,16,.64);color:var(--text);padding:13px 14px;outline:none}.login-card input:focus,.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus,.mini-select:focus{border-color:rgba(46,224,161,.75);box-shadow:0 0 0 4px rgba(46,224,161,.08)}
.login-card label+label{margin-top:16px}.hint{font-size:12px;line-height:1.55;color:var(--muted)}
.primary-btn,.secondary-btn,.ghost-btn,.logout-btn{border-radius:14px;padding:12px 16px;font-weight:800;transition:.2s ease}.primary-btn{margin-top:4px;color:#031014;background:linear-gradient(135deg,var(--accent),#7af1cb)}.primary-btn:hover,.secondary-btn:hover,.ghost-btn:hover,.logout-btn:hover{transform:translateY(-1px)}.ghost-btn{background:transparent;border:1px solid var(--line);color:var(--text)}.secondary-btn{background:rgba(255,255,255,.06);border:1px solid var(--line);color:var(--text)}
.login-card .primary-btn,.login-card .ghost-btn{width:100%;margin-top:16px}.app-screen{min-height:100vh;display:grid;grid-template-columns:290px 1fr}.sidebar{position:sticky;top:0;height:100vh;background:rgba(6,15,20,.86);border-right:1px solid var(--line);display:flex;flex-direction:column}.nav-menu{padding:18px;display:grid;gap:10px}.nav-btn{padding:14px 14px;border-radius:16px;text-align:left;background:transparent;color:var(--muted);font-weight:800;border:1px solid transparent}.nav-btn.active,.nav-btn:hover{background:rgba(46,224,161,.1);border-color:rgba(46,224,161,.25);color:var(--text)}.sidebar-note{margin:16px 18px auto;padding:16px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.04)}.sidebar-note span{font-size:12px;color:var(--accent);font-weight:900;text-transform:uppercase}.sidebar-note p{color:var(--muted);line-height:1.5;font-size:13px}.logout-btn{margin:18px;background:rgba(255,255,255,.05);color:var(--text);border:1px solid var(--line)}
.main-content{min-width:0;padding:26px;background:radial-gradient(circle at 80% 10%,rgba(255,255,255,.06),transparent 25%),linear-gradient(180deg,var(--bg-2),var(--bg));position:relative;overflow:hidden}.main-content:before{content:"";position:fixed;width:520px;aspect-ratio:1;right:4%;bottom:3%;border-radius:50%;background:repeating-conic-gradient(from 0deg,rgba(255,255,255,.13) 0deg 4deg,transparent 4deg 8deg);-webkit-mask:radial-gradient(circle,transparent 0 22%,#000 23% 42%,transparent 43%);mask:radial-gradient(circle,transparent 0 22%,#000 23% 42%,transparent 43%);opacity:.16;animation:sgsSpin 54s linear infinite;pointer-events:none}.main-content>*{position:relative;z-index:1}.topbar{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:22px}.topbar h1{margin:0;font-size:32px;letter-spacing:-.04em}.topbar-actions{display:flex;gap:10px;flex-wrap:wrap}.view{display:none}.active-view{display:block}.kpi-grid{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:14px;margin-bottom:16px}.kpi-card{border-radius:var(--radius);padding:20px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.035))}.kpi-card p{margin:0;color:var(--muted);font-weight:800}.kpi-card strong{display:block;font-size:32px;margin:8px 0 4px}.kpi-card small{color:var(--muted);line-height:1.4}.primary-kpi strong{font-size:46px}.alert{border-color:rgba(247,185,85,.28)}.danger{border-color:rgba(255,106,106,.30)}.bar{height:10px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden;margin:14px 0}.bar span{display:block;height:100%;width:0%;background:linear-gradient(90deg,var(--accent),var(--accent-2));border-radius:inherit;transition:.3s ease}
.dashboard-grid{display:grid;grid-template-columns:1.6fr .8fr;gap:16px}.panel{border-radius:var(--radius);padding:20px;margin-bottom:16px}.panel-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:18px}.panel-head h2{margin:0;font-size:20px}.panel-head p{margin:4px 0 0;color:var(--muted);font-size:13px}.mini-select{width:auto;min-width:190px;padding:10px 12px}.progress-list{display:grid;gap:12px}.location-row{display:grid;grid-template-columns:1.3fr .8fr 1.2fr auto;gap:12px;align-items:center;padding:14px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.035)}.location-row h3{font-size:15px;margin:0}.location-row p{margin:4px 0 0;color:var(--muted);font-size:12px}.progress-mini{min-width:160px}.progress-mini span{font-weight:900}.risk-stack{display:grid;gap:12px}.risk-item{padding:14px;border-radius:18px;border:1px solid var(--line);background:rgba(255,255,255,.035);display:flex;justify-content:space-between}.risk-item b{font-size:22px}.form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.form-grid textarea{min-height:110px;resize:vertical}.span-2{grid-column:span 2}.table-wrap{margin-top:18px;overflow:auto}.data-table{width:100%;border-collapse:separate;border-spacing:0 10px}.data-table th{color:var(--muted);font-size:12px;text-align:left;padding:0 12px}.data-table td{background:rgba(255,255,255,.035);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:13px 12px;font-size:13px}.data-table td:first-child{border-left:1px solid var(--line);border-radius:14px 0 0 14px}.data-table td:last-child{border-right:1px solid var(--line);border-radius:0 14px 14px 0}.chip{display:inline-flex;padding:6px 9px;border-radius:999px;font-weight:800;font-size:11px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:#dbe9ee}.chip.green{color:var(--accent);border-color:rgba(46,224,161,.25)}.chip.red{color:var(--danger);border-color:rgba(255,106,106,.26)}.chip.yellow{color:var(--warning);border-color:rgba(247,185,85,.26)}.chip.blue{color:var(--accent-2);border-color:rgba(75,185,255,.25)}.table-action{padding:8px 10px;border-radius:10px;background:rgba(255,255,255,.055);color:var(--text);border:1px solid var(--line);font-weight:800}.matrix-wrap{overflow:auto}.matrix-table{min-width:980px;width:100%;border-collapse:collapse}.matrix-table th,.matrix-table td{border:1px solid var(--line);padding:10px;text-align:center;font-size:12px}.matrix-table th:first-child,.matrix-table td:first-child{text-align:left;position:sticky;left:0;background:#101e27}.matrix-cell{display:block;border-radius:9px;padding:6px 7px;background:rgba(255,255,255,.04)}.matrix-cell.done{background:rgba(46,224,161,.16);color:var(--accent)}.matrix-cell.gap{background:rgba(247,185,85,.14);color:var(--warning)}
.reference-strip{padding:12px 14px;background:rgba(75,185,255,.08);border:1px solid rgba(75,185,255,.18);border-radius:16px;margin-bottom:16px;color:#cbeeff;font-size:13px;line-height:1.5}.pill{padding:8px 11px;border:1px solid rgba(46,224,161,.25);color:var(--accent);border-radius:999px;font-size:12px;font-weight:900}.checklist-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}.summary-card{padding:14px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.035)}.summary-card span{display:block;color:var(--muted);font-size:12px}.summary-card strong{font-size:24px}.checklist-container{display:grid;gap:12px}.check-item{padding:16px;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.035)}.check-top{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:start}.check-number{width:34px;height:34px;border-radius:12px;background:rgba(46,224,161,.12);color:var(--accent);display:grid;place-items:center;font-weight:900}.check-item h3{margin:0 0 8px;font-size:15px;line-height:1.45}.check-meta{display:flex;gap:8px;flex-wrap:wrap}.answer-row{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}.answer-option input{display:none}.answer-option span{display:inline-flex;padding:9px 10px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.04);font-size:12px;font-weight:800}.answer-option input:checked+span{border-color:rgba(46,224,161,.55);background:rgba(46,224,161,.12);color:var(--accent)}.check-note{width:100%;min-height:70px;border:1px solid var(--line);border-radius:14px;background:rgba(4,12,16,.55);color:var(--text);padding:12px;outline:none}.submit-row{display:flex;gap:10px;margin-top:18px}.finding-list{display:grid;gap:12px}.finding-card{border:1px solid var(--line);border-radius:20px;padding:16px;background:rgba(255,255,255,.035)}.finding-card-head{display:flex;justify-content:space-between;gap:12px;align-items:start}.finding-card h3{margin:0 0 6px;font-size:16px}.finding-card p{color:#d4e2e8;line-height:1.55}.finding-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.filter-row{display:flex;gap:8px;flex-wrap:wrap}.toast{position:fixed;right:22px;bottom:22px;background:#f5fffb;color:#061014;padding:14px 16px;border-radius:16px;box-shadow:var(--shadow);font-weight:800;z-index:20}.empty-state{padding:20px;border:1px dashed var(--line);border-radius:18px;color:var(--muted);text-align:center}.danger-text{color:var(--danger)}.warning-text{color:var(--warning)}.success-text{color:var(--accent)}
@media(max-width:1100px){.login-shell{grid-template-columns:1fr}.login-brand-panel{min-height:auto}.login-brand-panel h2{font-size:36px}.app-screen{grid-template-columns:1fr}.sidebar{height:auto;position:relative}.nav-menu{grid-template-columns:repeat(3,1fr)}.main-content{padding:18px}.kpi-grid,.dashboard-grid,.form-grid,.checklist-summary{grid-template-columns:1fr}.span-2{grid-column:auto}.location-row{grid-template-columns:1fr}.topbar{align-items:flex-start;flex-direction:column}.sidebar-note{display:none}}
@media(max-width:620px){.login-screen{padding:16px}.login-brand-panel,.login-card{border-radius:24px;padding:24px}.login-metrics{grid-template-columns:1fr}.nav-menu{grid-template-columns:1fr}.panel-head{flex-direction:column}.topbar-actions{width:100%}.topbar-actions button{width:100%}.submit-row{flex-direction:column}.secondary-btn,.primary-btn,.ghost-btn{width:100%}}

/* Controlled-access additions */
.company-logo{width:274px;height:58px;object-fit:contain;display:block;flex:0 0 auto;filter:brightness(0) invert(1);opacity:.92}.brand-lockup.compact .company-logo{width:220px;height:48px}.access-badge{display:inline-flex;align-items:center;min-height:42px;padding:10px 14px;border:1px solid rgba(46,224,161,.25);border-radius:14px;background:rgba(46,224,161,.08);color:#dffcf4;font-size:12px;font-weight:900;letter-spacing:.02em}.admin-only.hidden{display:none!important}select:disabled,input:disabled,textarea:disabled{opacity:.85;cursor:not-allowed;background:rgba(255,255,255,.045)!important}.item-ref{display:inline-flex;align-items:center;padding:7px 10px;border-radius:999px;background:rgba(75,185,255,.12);border:1px solid rgba(75,185,255,.25);color:#bfe8ff;font-size:11px;font-weight:900;white-space:nowrap}.answer-row{display:flex;flex-wrap:wrap;gap:12px;margin:14px 0}.answer-row label{display:inline-flex;align-items:center;gap:7px;padding:9px 12px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.04);font-size:13px;color:var(--text);font-weight:800}.answer-row input{accent-color:#2ee0a1}.checklist-item textarea.item-note{width:100%;min-height:74px;border:1px solid var(--line);border-radius:14px;background:rgba(4,12,16,.64);color:var(--text);padding:12px;outline:none}.finding-meta{display:flex;flex-wrap:wrap;gap:8px;align-items:center}@media(max-width:620px){.company-logo,.brand-lockup.compact .company-logo{width:190px;height:44px}.access-badge{width:100%;justify-content:center}}

.role-key{color:var(--accent);border-color:rgba(46,224,161,.35)}
.role-admin{color:var(--accent-2);border-color:rgba(75,185,255,.35)}
.role-supervisor{color:#dbe9ee}
body[data-role="Supervisor"] .supervisor-hidden{display:none!important}
.locked-field-note{font-size:11px;color:var(--muted);margin-top:4px}


/* v9 layout/transparency/SQS background refinements */
body{background:linear-gradient(135deg,#041015,#0a1820 48%,#061015);}
.login-bg{background:radial-gradient(circle at 12% 18%,rgba(255,255,255,.08),transparent 30%),radial-gradient(circle at 88% 8%,rgba(255,255,255,.06),transparent 32%),linear-gradient(135deg,#041015,#0a171f 55%,#031014)}
.login-brand-panel,.login-card,.panel,.kpi-card{background:linear-gradient(180deg,rgba(17,31,40,.56),rgba(13,25,33,.38));border-color:rgba(255,255,255,.11);box-shadow:0 24px 70px rgba(0,0,0,.34);backdrop-filter:blur(14px) saturate(115%)}
.login-brand-panel{background:linear-gradient(180deg,rgba(17,31,40,.50),rgba(13,25,33,.34));}
.login-card{background:linear-gradient(180deg,rgba(18,34,43,.58),rgba(12,24,32,.42));}
.app-screen{position:relative;isolation:isolate;min-height:100vh;background:radial-gradient(circle at 16% 18%,rgba(255,255,255,.045),transparent 27%),radial-gradient(circle at 86% 6%,rgba(255,255,255,.045),transparent 30%),linear-gradient(135deg,#041015,#0a171f 56%,#041014)}
.global-watermark{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}.sidebar,.main-content{position:relative;z-index:1}.sidebar{background:rgba(4,13,18,.66);backdrop-filter:blur(14px);border-right:1px solid rgba(255,255,255,.11)}.main-content{background:transparent;overflow:visible}.main-content:before{display:none}.topbar,.panel,.kpi-card,.sidebar-note{background:linear-gradient(180deg,rgba(18,33,42,.58),rgba(11,23,30,.34));backdrop-filter:blur(13px)}.topbar{border:1px solid rgba(255,255,255,.09);border-radius:24px;padding:16px 18px;margin-bottom:18px}.panel{padding:22px}.kpi-grid{grid-template-columns:1.25fr repeat(4,minmax(150px,1fr));align-items:stretch}.dashboard-grid{grid-template-columns:minmax(0,1.45fr) minmax(320px,.75fr)}.form-grid{gap:16px}.checklist-summary{grid-template-columns:repeat(5,minmax(0,1fr));margin:8px 0 18px}.summary-card{min-height:78px;display:flex;flex-direction:column;justify-content:center;background:rgba(255,255,255,.045)}.summary-card strong{font-size:18px;line-height:1.25;word-break:break-word}.summary-card span{text-transform:uppercase;letter-spacing:.08em;margin-top:5px}.check-item,.finding-card,.location-row,.risk-item,.data-table td{background:rgba(255,255,255,.042)}.reference-strip{background:rgba(75,185,255,.10)}
.sqs-shape{position:absolute;display:block;width:clamp(520px,70vw,1180px);aspect-ratio:1;border-radius:50%;pointer-events:none;opacity:.14;animation:sqsRotate 88s linear infinite;filter:drop-shadow(0 0 24px rgba(255,255,255,.05))}.sqs-shape::before{content:"SQS";position:absolute;inset:0;display:grid;place-items:center;color:rgba(255,255,255,.30);font-size:clamp(130px,17vw,300px);font-weight:900;letter-spacing:-.12em;transform:translateX(-.06em)}.sqs-shape::after{content:"";position:absolute;inset:2%;border-radius:50%;background:repeating-conic-gradient(from 0deg,rgba(255,255,255,.22) 0deg 3deg,transparent 3deg 8deg);-webkit-mask:radial-gradient(circle,transparent 0 18%,#000 19% 34%,transparent 35% 100%);mask:radial-gradient(circle,transparent 0 18%,#000 19% 34%,transparent 35% 100%)}.login-shape-main{left:-12%;top:3%;}.login-shape-side{right:-15%;bottom:-14%;width:clamp(480px,58vw,920px);opacity:.17;animation-duration:104s;animation-direction:reverse}.shape-one{left:-18%;top:10%;width:clamp(620px,62vw,1120px);opacity:.11}.shape-two{right:-24%;top:5%;width:clamp(620px,60vw,1080px);opacity:.13;animation-direction:reverse}.shape-three{left:30%;bottom:-34%;width:clamp(760px,78vw,1280px);opacity:.07;animation-duration:130s}.company-watermark{position:absolute;left:8%;bottom:7%;font-size:clamp(88px,16vw,240px);font-weight:900;letter-spacing:-.10em;color:rgba(255,255,255,.045);z-index:0;user-select:none}.login-bg .sqs-shape,.global-watermark .sqs-shape,.company-watermark{z-index:0}.login-shell,.sidebar,.main-content{z-index:1}@keyframes sqsRotate{to{transform:rotate(360deg)}}
.login-card input:-webkit-autofill,.login-card input:-webkit-autofill:hover,.login-card input:-webkit-autofill:focus{-webkit-text-fill-color:#071014;transition:background-color 9999s ease-in-out 0s;box-shadow:0 0 0 1000px #eaf2ff inset}
@media(max-width:1100px){.checklist-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.kpi-grid,.dashboard-grid{grid-template-columns:1fr}.shape-one{left:-45%;top:18%}.shape-two{right:-55%;top:12%}.shape-three{left:2%;bottom:-28%}}
@media(max-width:620px){.checklist-summary{grid-template-columns:1fr}.sqs-shape{width:760px}.login-shape-main{left:-70%;top:4%}.login-shape-side{right:-85%;bottom:-28%}.company-watermark{font-size:120px;left:4%}.topbar{border-radius:18px}.panel{padding:18px}.login-brand-panel h2{font-size:31px}}

/* v10 layout and background standardization */
.login-bg{background:radial-gradient(circle at 16% 14%,rgba(255,255,255,.07),transparent 28%),linear-gradient(135deg,#041015,#0b171d 54%,#061015)}
.login-bg .sqs-background-shape,.global-watermark .sqs-background-shape{position:absolute;z-index:0;pointer-events:none;object-fit:contain;filter:brightness(0) invert(1);opacity:.115;mix-blend-mode:screen;animation:sqsRotate 105s linear infinite;transform-origin:center center;}
.login-bg .sqs-background-shape{width:min(1180px,92vw);height:min(1180px,92vw);right:-14vw;top:50%;transform:translateY(-50%);}
.global-watermark .sqs-background-shape{position:fixed;width:min(1320px,86vw);height:min(1320px,86vw);right:-22vw;top:50%;transform:translateY(-50%);opacity:.105;}
.login-brand-panel,.login-card,.panel,.kpi-card,.topbar,.sidebar-note{background:linear-gradient(180deg,rgba(18,32,40,.46),rgba(8,20,27,.28));border-color:rgba(255,255,255,.105);backdrop-filter:blur(10px) saturate(115%);}
.login-brand-panel{justify-content:flex-start;gap:30px;padding:44px;min-height:620px;}
.login-logo-row{display:block;margin:0 0 26px;}
.login-title-block{display:block;max-width:760px;}
.login-title-block .eyebrow{margin:0 0 8px;}
.login-title-block h1{margin:0;font-size:clamp(42px,5vw,78px);line-height:.98;letter-spacing:-.065em;max-width:850px;}
.login-brand-panel h2{display:none;}
.login-brand-panel>.muted{margin:8px 0 0;font-size:18px;max-width:780px;line-height:1.62;}
.login-metrics{margin-top:auto;}
.field-instruction{font-size:11px;line-height:1.45;color:var(--muted);font-weight:600;margin-top:-2px;}
.company-logo{filter:brightness(0) invert(1);opacity:.96;}
.brand-lockup.compact{gap:10px;align-items:flex-start;}
.brand-lockup.compact .company-logo{width:210px;height:45px;}
.brand-lockup.compact h2{font-size:16px;line-height:1.2;}
.brand-lockup.compact p{font-size:12px;}
.checklist-summary{grid-template-columns:repeat(5,minmax(170px,1fr));gap:12px;}
.summary-card{padding:14px 15px;border:1px solid rgba(255,255,255,.11);border-radius:16px;background:rgba(255,255,255,.055)!important;min-height:82px;overflow:hidden;}
.summary-card strong{display:block;font-size:17px!important;line-height:1.3;word-break:break-word;margin-bottom:6px;}
.summary-card span{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em;}
.checklist-item{padding:18px;border:1px solid rgba(255,255,255,.11);border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.052),rgba(255,255,255,.028));box-shadow:0 12px 32px rgba(0,0,0,.16);}
.checklist-item-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;}
.checklist-item h3{margin:0 0 10px;font-size:17px;line-height:1.45;letter-spacing:-.015em;}
.checklist-item p{margin:0;color:#d6e3e9;line-height:1.5;}
@media(max-width:1100px){.login-bg .sqs-background-shape{right:-40vw;width:1150px;height:1150px}.global-watermark .sqs-background-shape{right:-42vw;width:1180px;height:1180px}.checklist-summary{grid-template-columns:repeat(2,minmax(0,1fr));}.login-title-block h1{font-size:44px}.login-brand-panel{min-height:auto}}
@media(max-width:620px){.login-bg .sqs-background-shape{right:-92vw;width:880px;height:880px;opacity:.09}.global-watermark .sqs-background-shape{right:-90vw;width:900px;height:900px;opacity:.09}.login-title-block h1{font-size:36px}.login-brand-panel,.login-card{padding:24px}.checklist-summary{grid-template-columns:1fr}.checklist-item-head{flex-direction:column}.item-ref{white-space:normal}.login-metrics{grid-template-columns:1fr}}


/* v11 final standardization: black-green theme, one SQS PNG watermark, full Key User tabs */
:root{
  --bg:#020806;
  --bg-2:#06110d;
  --panel:#08130f;
  --panel-2:#0c1b15;
  --text:#e8ece9;
  --muted:#aeb8b3;
  --line:rgba(232,236,233,.13);
  --accent:#147a52;
  --accent-2:#2c9b70;
  --warning:#d5a94f;
  --danger:#d86a66;
  --info:#9aa6a0;
  --surface-a:rgba(12,28,21,.64);
  --surface-b:rgba(4,12,9,.38);
  --shadow:0 24px 70px rgba(0,0,0,.48);
}
body{
  background:linear-gradient(135deg,#010403,#04100b 45%,#010806);
  color:var(--text);
}
.eyebrow{
  color:#c9d1cc;
  letter-spacing:.16em;
}
.login-bg,.app-screen{
  background:
    radial-gradient(circle at 16% 18%,rgba(20,122,82,.14),transparent 30%),
    radial-gradient(circle at 88% 10%,rgba(255,255,255,.045),transparent 34%),
    linear-gradient(135deg,#010403,#05130d 56%,#010806);
}
.login-bg:after{
  background-image:
    linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);
  opacity:.55;
}
.login-brand-panel,.login-card,.panel,.kpi-card,.topbar,.sidebar-note,.program-identity{
  background:linear-gradient(180deg,rgba(10,25,18,.54),rgba(4,12,9,.28));
  border-color:rgba(232,236,233,.13);
  backdrop-filter:blur(12px) saturate(110%);
}
.topbar{
  background:linear-gradient(180deg,rgba(10,25,18,.50),rgba(4,12,9,.24));
}
.sidebar{
  background:rgba(2,8,6,.78);
  border-right:1px solid rgba(232,236,233,.12);
}
.main-content{
  background:transparent;
}
.company-logo{
  filter:brightness(0) invert(1);
  opacity:.98;
}
.logo-only{
  padding:22px 18px 10px!important;
  border-bottom:0!important;
}
.logo-only .company-logo{
  width:230px!important;
  height:auto!important;
  max-height:54px;
  object-fit:contain;
}
.program-identity{
  margin:0 18px 18px;
  padding:16px;
  border:1px solid var(--line);
  border-radius:18px;
}
.program-identity h2{
  margin:0 0 6px;
  font-size:16px;
  line-height:1.2;
  color:var(--text);
}
.program-identity p{
  margin:0;
  color:var(--muted);
  font-size:12px;
  line-height:1.45;
}
.nav-menu{
  gap:8px;
}
.nav-btn.active,.nav-btn:hover{
  background:rgba(20,122,82,.22);
  border-color:rgba(70,170,125,.38);
  color:var(--text);
}
.sidebar-note span,.chip.green{
  color:#cbd7d1;
}
.access-badge{
  color:#e6ece8;
  background:rgba(20,122,82,.18);
  border-color:rgba(70,170,125,.35);
}
.primary-btn{
  color:#f4f7f5;
  background:linear-gradient(135deg,#116d49,#1b8c60);
}
.secondary-btn,.ghost-btn,.logout-btn,.table-action{
  background:rgba(232,236,233,.055);
  color:var(--text);
  border-color:var(--line);
}
.login-card input,.form-grid input,.form-grid select,.form-grid textarea,.mini-select{
  background:rgba(1,6,4,.72);
  color:var(--text);
  border-color:rgba(232,236,233,.13);
}
.login-card input:focus,.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus,.mini-select:focus{
  border-color:rgba(70,170,125,.65);
  box-shadow:0 0 0 4px rgba(20,122,82,.18);
}
.login-bg .sqs-background-shape,.global-watermark .sqs-background-shape{
  filter:none!important;
  opacity:.118;
  mix-blend-mode:screen;
  pointer-events:none;
}
.login-bg .sqs-background-shape{
  width:min(1280px,102vw);
  height:min(1280px,102vw);
  right:-22vw;
  top:50%;
  animation:sqsRotateCentered 115s linear infinite!important;
}
.global-watermark .sqs-background-shape{
  width:min(1450px,92vw);
  height:min(1450px,92vw);
  right:-25vw;
  top:50%;
  opacity:.105;
  animation:sqsRotateCentered 130s linear infinite!important;
}
@keyframes sqsRotateCentered{
  from{transform:translateY(-50%) rotate(0deg);}
  to{transform:translateY(-50%) rotate(360deg);}
}
.login-title-block h1{
  font-size:clamp(42px,5.2vw,76px);
  max-width:860px;
}
.login-brand-panel>.muted{
  color:#b8c2bd;
}
.login-metrics div,.location-row,.risk-item,.checklist-item,.finding-card,.checklist-control-card,.logic-card,.summary-card,.data-table td{
  background:rgba(232,236,233,.045);
  border-color:rgba(232,236,233,.12);
}
.kpi-card strong,.summary-card strong,.risk-item b{
  color:#f0f3f1;
}
.kpi-card p,.panel-head p,.location-row p,.hint,.field-instruction,.muted{
  color:var(--muted);
}
.dashboard-grid{
  grid-template-columns:minmax(0,1.5fr) minmax(330px,.7fr);
}
.target-metrics{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin-bottom:16px;
}
.logic-stack,.control-list{
  display:grid;
  gap:12px;
}
.logic-card,.checklist-control-card{
  border:1px solid var(--line);
  border-radius:18px;
  padding:14px;
}
.logic-card b,.logic-card span{
  display:block;
}
.logic-card span{
  color:var(--muted);
  margin-top:5px;
  line-height:1.45;
}
.checklist-control-card{
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:flex-start;
}
.checklist-control-card h3{
  margin:10px 0 8px;
  font-size:16px;
  line-height:1.4;
}
.checklist-control-card p{
  margin:0;
  color:var(--muted);
  line-height:1.5;
}
.control-group h3{
  margin:0 0 6px;
}
.empty-state{
  border:1px dashed rgba(232,236,233,.18);
  border-radius:18px;
  padding:18px;
  color:var(--muted);
  background:rgba(232,236,233,.025);
}
.sag-card{
  border-color:rgba(70,170,125,.25);
}
.reference-strip{
  background:rgba(20,122,82,.12);
  border-color:rgba(70,170,125,.25);
  color:#d7dedb;
}
.pill{
  color:#dfe8e4;
  border-color:rgba(70,170,125,.35);
  background:rgba(20,122,82,.16);
}
.chip.blue{color:#c7d3cd;border-color:rgba(232,236,233,.20)}
.chip.red{color:#e8b0ad;border-color:rgba(216,106,102,.35)}
.chip.yellow{color:#e7d3a6;border-color:rgba(213,169,79,.35)}
.bar span{
  background:linear-gradient(90deg,#116d49,#2c9b70);
}
.matrix-cell.done{background:rgba(20,122,82,.28);border-color:rgba(70,170,125,.35)}
.matrix-cell.gap{background:rgba(232,236,233,.045);border-color:rgba(232,236,233,.13)}
@media(max-width:1100px){
  .global-watermark .sqs-background-shape{right:-58vw;width:1150px;height:1150px;}
  .dashboard-grid,.target-metrics{grid-template-columns:1fr;}
  .app-screen{grid-template-columns:1fr}
  .sidebar{position:relative;height:auto}
}
@media(max-width:620px){
  .logo-only .company-logo{width:200px!important}
  .login-bg .sqs-background-shape{right:-100vw;width:940px;height:940px;opacity:.08}
  .global-watermark .sqs-background-shape{right:-105vw;width:980px;height:980px;opacity:.08}
  .checklist-control-card{flex-direction:column}
}

/* v12 mature reporting element refinements - layout preserved */
.topbar-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
}
.topbar-actions .access-badge{order:0;min-width:max-content}
.topbar-actions .secondary-btn{order:1;white-space:nowrap}
.panel-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end;align-items:center}
.full-btn{width:100%;justify-content:center;margin-top:4px}
.password-field{position:relative;display:flex;align-items:center;width:100%}
.password-field input{width:100%;padding-right:48px!important}
.password-toggle{
  position:absolute;right:10px;top:50%;transform:translateY(-50%);
  width:30px;height:30px;border-radius:999px;border:1px solid rgba(232,236,233,.22);
  background:rgba(232,236,233,.08);color:#b8c0bc;display:grid;place-items:center;
  cursor:pointer;font-size:13px;line-height:1;transition:.2s ease;
}
.password-toggle:hover,.password-toggle.active{background:rgba(232,236,233,.14);color:#e8ece9;border-color:rgba(232,236,233,.35)}
.guidelines-panel{display:grid;gap:12px;margin-top:12px}
.guideline-card{border:1px solid var(--line);border-radius:18px;background:rgba(232,236,233,.04);padding:14px}
.guideline-card h3{margin:0 0 8px;font-size:15px;color:var(--text)}
.guideline-card ul{margin:0;padding-left:18px;color:var(--muted);line-height:1.45;font-size:13px}
.noncompliance-extra{display:grid;grid-template-columns:1.4fr .8fr;gap:12px;margin-top:12px;border:1px solid rgba(216,106,102,.28);border-radius:18px;padding:12px;background:rgba(216,106,102,.055)}
.noncompliance-extra label{margin:0;color:#d8e0dc;font-weight:700;font-size:12px}
.noncompliance-extra textarea{min-height:88px;width:100%;margin-top:8px;background:rgba(1,6,4,.72);border:1px solid var(--line);border-radius:14px;color:var(--text);padding:12px;font:inherit}
.noncompliance-extra input[type="file"]{width:100%;margin-top:8px;background:rgba(1,6,4,.72);border:1px solid var(--line);border-radius:14px;color:var(--muted);padding:10px}
.risk-heatmap{overflow:auto}
.heatmap-wrap{overflow:auto;max-width:100%}
.heatmap-table{border-collapse:separate;border-spacing:6px;width:100%;min-width:1120px}
.heatmap-table th,.heatmap-table td{border:1px solid var(--line);border-radius:10px;padding:10px;text-align:center;font-size:12px;color:var(--text);background:rgba(232,236,233,.035)}
.heatmap-table th{font-weight:800;color:#d9dfdc;background:rgba(232,236,233,.055)}
.heatmap-table tbody th{text-align:left;position:sticky;left:0;z-index:1;background:rgba(8,19,15,.92)}
.heat-high{background:rgba(216,106,102,.42)!important;border-color:rgba(216,106,102,.55)!important;color:#fff!important}
.heat-med{background:rgba(213,126,54,.34)!important;border-color:rgba(213,126,54,.52)!important;color:#fff!important}
.heat-yellow{background:rgba(213,169,79,.30)!important;border-color:rgba(213,169,79,.48)!important;color:#fff!important}
.heat-low{background:rgba(20,122,82,.28)!important;border-color:rgba(70,170,125,.40)!important;color:#fff!important}
.heat-none{background:rgba(232,236,233,.03)!important;border-color:rgba(232,236,233,.10)!important;color:#9ca7a1!important}
.heatmap-legend{display:flex;gap:12px;flex-wrap:wrap;margin-top:12px;color:var(--muted);font-size:12px}
.heatmap-legend span{display:flex;align-items:center;gap:6px}.heatmap-legend i{width:14px;height:14px;border-radius:5px;display:inline-block}
.data-table th,.data-table td{vertical-align:top}
.data-table .table-action{margin:2px 0}
@media(max-width:760px){.noncompliance-extra{grid-template-columns:1fr}.panel-actions{justify-content:flex-start}.topbar-actions{justify-content:flex-start}}

/* v13 risk matrix + PDF reporting element updates, layout preserved */
.sidebar{
  position:sticky!important;
  top:0!important;
  height:100dvh!important;
  overflow-y:auto;
  align-self:start;
}
.stn-search-input{
  min-width:260px;
}
.risk-rating-row{
  display:grid;
  grid-template-columns: minmax(160px,.32fr) minmax(190px,.36fr) 1fr;
  gap:10px;
  align-items:end;
  margin:14px 0 4px;
  padding:12px;
  border:1px solid rgba(232,236,233,.12);
  border-radius:16px;
  background:rgba(232,236,233,.035);
}
.risk-rating-row label{
  display:flex;
  flex-direction:column;
  gap:6px;
  color:#c9d1cc;
  font-weight:800;
  font-size:12px;
}
.risk-rating-row select{
  width:100%;
  border:1px solid var(--line);
  border-radius:12px;
  background:rgba(1,6,4,.72);
  color:var(--text);
  padding:10px 12px;
}
.risk-rating-row span{
  color:var(--muted);
  font-size:12px;
  line-height:1.45;
}
.heatmap-note{
  margin-bottom:12px;
  padding:12px 14px;
  border:1px solid rgba(232,236,233,.12);
  border-radius:16px;
  background:rgba(232,236,233,.035);
  color:var(--muted);
  font-size:12px;
  line-height:1.45;
}
.heatmap-card-wrap{
  display:grid;
  gap:14px;
  max-height:720px;
  overflow:auto;
  padding-right:4px;
}
.heatmap-station-card{
  display:grid;
  gap:10px;
  border:1px solid rgba(232,236,233,.12);
  border-radius:18px;
  background:rgba(232,236,233,.035);
  padding:12px;
}
.heatmap-station-head{
  position:sticky;
  top:0;
  z-index:2;
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:center;
  padding:10px 12px;
  border:1px solid rgba(232,236,233,.12);
  border-radius:14px;
  background:rgba(3,12,8,.94);
  backdrop-filter:blur(10px);
}
.heatmap-station-head strong{
  font-size:18px;
  letter-spacing:.02em;
}
.heatmap-station-head span{
  color:var(--muted);
  font-size:12px;
  text-align:right;
}
.heatmap-area-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(132px,1fr));
  gap:8px;
}
.heatmap-cell{
  min-height:102px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:6px;
  border:1px solid var(--line);
  border-radius:14px;
  padding:10px;
  background:rgba(232,236,233,.035);
  color:var(--text);
}
.heatmap-cell span{
  font-size:11px;
  font-weight:800;
  line-height:1.25;
  color:#e2e7e4;
}
.heatmap-cell b{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  font-size:20px;
}
.heatmap-cell b em{
  font-style:normal;
  min-width:38px;
  padding:4px 6px;
  border-radius:10px;
  background:rgba(0,0,0,.18);
}
.heatmap-cell small{
  color:rgba(255,255,255,.80);
  font-size:11px;
  line-height:1.25;
}
.heatmap-card-wrap::-webkit-scrollbar,.table-wrap::-webkit-scrollbar,.matrix-wrap::-webkit-scrollbar{height:10px;width:10px}
.heatmap-card-wrap::-webkit-scrollbar-track,.table-wrap::-webkit-scrollbar-track,.matrix-wrap::-webkit-scrollbar-track{background:rgba(232,236,233,.04);border-radius:999px}
.heatmap-card-wrap::-webkit-scrollbar-thumb,.table-wrap::-webkit-scrollbar-thumb,.matrix-wrap::-webkit-scrollbar-thumb{background:rgba(232,236,233,.22);border-radius:999px}
@media(max-width:1100px){
  .sidebar{position:relative!important;height:auto!important;overflow:visible!important}
  .stn-search-input{width:100%;min-width:0}
  .risk-rating-row{grid-template-columns:1fr}
  .heatmap-card-wrap{max-height:none;overflow:visible}
}


/* v14: official report, risk matrix reference, and synchronized Area heat map */
.risk-matrix-reference{border:1px solid var(--line);border-radius:16px;background:rgba(232,236,233,.035);padding:12px;margin:0 0 14px;color:var(--muted)}
.risk-matrix-reference h3{margin:0 0 6px;color:var(--text);font-size:15px}.risk-matrix-reference p{margin:0 0 10px;font-size:12px;line-height:1.45}.risk-matrix-reference.compact .risk-matrix-table-wrap{max-height:220px;overflow:auto;border-radius:12px}.risk-ref-table{width:100%;min-width:740px;border-collapse:separate;border-spacing:5px}.risk-ref-table th,.risk-ref-table td{border:1px solid var(--line);border-radius:10px;padding:8px;text-align:center;font-size:11px;background:rgba(232,236,233,.035)}.risk-ref-table th{color:#dfe5e1;background:rgba(232,236,233,.055)}.risk-ref-table small{font-size:9px;color:var(--muted)}
.heatmap-legend .heat-yellow{background:rgba(213,169,79,.30)!important;border-color:rgba(213,169,79,.48)!important}
.risk-rating-row span{border:1px solid rgba(232,236,233,.10);border-radius:12px;background:rgba(232,236,233,.025);padding:9px 10px;color:#c6cfca!important}

/* v15 guideline library */
.guideline-library-head{display:grid;grid-template-columns:minmax(260px,1fr) minmax(260px,.9fr);gap:14px;align-items:end;margin-bottom:12px}
.guideline-library-head h3{margin:0 0 6px;font-size:17px;color:var(--text)}
.guideline-library-head p{margin:0;color:var(--muted);font-size:12px;line-height:1.45}
.guideline-search{width:100%;min-height:46px;border:1px solid var(--line);background:rgba(0,0,0,.32);color:var(--text);border-radius:14px;padding:10px 13px;outline:none;font-weight:700}
.guideline-results{display:grid;gap:12px}.guideline-group-card{border:1px solid var(--line);border-radius:18px;background:rgba(232,236,233,.035);padding:14px}.guideline-group-card h3{margin:0 0 12px;color:var(--text);font-size:15px}.guideline-item-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.guideline-item-card{border:1px solid rgba(232,236,233,.12);border-radius:16px;background:rgba(0,0,0,.22);padding:12px;display:flex;flex-direction:column;gap:8px}.guideline-item-card h4{margin:0;font-size:14px;color:var(--text);line-height:1.35}.guideline-item-card p{margin:0;color:var(--muted);line-height:1.45;font-size:12px}.guideline-link{display:inline-flex;align-self:flex-start;border:1px solid rgba(232,236,233,.22);background:rgba(232,236,233,.05);color:#e8ece9;text-decoration:none;border-radius:999px;padding:8px 10px;font-size:12px;font-weight:900}.guideline-link:hover{border-color:rgba(40,201,139,.55);color:#fff}
.heatmap-legend span{font-weight:700}
@media(max-width:900px){.guideline-library-head,.guideline-item-grid{grid-template-columns:1fr}}

/* v17: restore v15 desktop, add professional mobile application shell only, and hard-hide app before login */
.mobile-app-bar,.mobile-nav-backdrop{display:none}
body.auth-locked #appScreen{display:none!important;visibility:hidden!important;pointer-events:none!important}
body.auth-locked #loginScreen{display:grid!important}

@media(min-width:861px){
  /* Preserve the v15 desktop web layout exactly */
  .mobile-app-bar,.mobile-nav-backdrop{display:none!important}
}

@media(max-width:860px){
  html,body{height:auto;min-height:100%;overflow-x:hidden}
  body{background:#020806;color:var(--text)}
  .login-screen{padding:18px 14px;align-items:start;place-items:stretch;min-height:100dvh;overflow-y:auto}
  .login-bg .sqs-background-shape{width:980px;height:980px;right:-560px;top:52%;opacity:.12}
  .login-shell{width:100%;display:grid;grid-template-columns:1fr;gap:14px;align-items:start}
  .login-brand-panel{min-height:auto;border-radius:24px;padding:22px;gap:16px;background:linear-gradient(180deg,rgba(10,25,18,.72),rgba(4,12,9,.42))}
  .login-logo-row{margin:0 0 12px}.login-logo-row .company-logo{width:210px;max-width:80%;height:auto}
  .login-title-block h1{font-size:34px;line-height:1.02;letter-spacing:-.055em}
  .login-title-block .eyebrow{font-size:10px;letter-spacing:.13em}
  .login-brand-panel>.muted{font-size:13px;line-height:1.55;margin:0}
  .login-metrics{grid-template-columns:1fr;gap:10px;margin-top:4px}
  .login-metrics div{padding:13px 14px;border-radius:16px}.login-metrics strong{font-size:24px}.login-metrics span{font-size:12px}
  .login-card{border-radius:24px;padding:22px;background:linear-gradient(180deg,rgba(10,25,18,.78),rgba(4,12,9,.48));box-shadow:0 18px 45px rgba(0,0,0,.42)}
  .login-card h3{font-size:28px;margin:14px 0 18px}.login-card input{min-height:48px;font-size:16px}
  .password-toggle{min-width:44px;min-height:44px}

  .app-screen{display:block;min-height:100dvh;padding-top:72px;background:radial-gradient(circle at 80% 6%,rgba(20,122,82,.16),transparent 34%),linear-gradient(135deg,#010403,#05130d 56%,#010806)}
  .app-screen.hidden{display:none!important}
  .mobile-app-bar{position:fixed;display:flex;align-items:center;gap:12px;top:0;left:0;right:0;height:72px;padding:12px 14px;z-index:80;background:rgba(2,8,6,.92);border-bottom:1px solid rgba(232,236,233,.13);backdrop-filter:blur(16px) saturate(120%)}
  .mobile-menu-btn{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:rgba(232,236,233,.06);border:1px solid rgba(232,236,233,.14);color:#e8ece9;font-size:24px;font-weight:900;line-height:1}
  .mobile-bar-logo{width:112px;height:auto;filter:brightness(0) invert(1);opacity:.98}
  .mobile-bar-title{display:flex;flex-direction:column;min-width:0}.mobile-bar-title strong{font-size:13px;line-height:1.2;color:#f2f6f3;white-space:nowrap}.mobile-bar-title span{font-size:10px;color:#aeb8b3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:170px}
  .mobile-nav-backdrop{position:fixed;display:block;inset:0;background:rgba(0,0,0,.48);z-index:65;opacity:0;pointer-events:none;transition:.22s ease}
  body.mobile-nav-open .mobile-nav-backdrop{opacity:1;pointer-events:auto}
  .sidebar{position:fixed!important;top:0;left:0;bottom:0;width:min(86vw,340px);height:100dvh!important;z-index:90;overflow-y:auto!important;transform:translateX(-105%);transition:transform .24s ease;background:rgba(2,8,6,.96);box-shadow:24px 0 60px rgba(0,0,0,.50);border-right:1px solid rgba(232,236,233,.16)}
  body.mobile-nav-open .sidebar{transform:translateX(0)}
  .logo-only{padding:24px 18px 12px!important}.logo-only .company-logo{width:205px!important;max-width:100%}
  .nav-menu{padding:12px 14px;gap:8px}.nav-btn{padding:13px 14px;border-radius:15px;font-size:14px}.sidebar-note,.program-identity,.logout-btn{margin-left:14px;margin-right:14px}.sidebar-note{margin-top:10px}.program-identity{margin-top:12px}.logout-btn{margin-bottom:18px;width:calc(100% - 28px)}
  .main-content{padding:14px;overflow:visible;background:transparent}.global-watermark .sqs-background-shape{width:920px;height:920px;right:-610px;top:54%;opacity:.10}
  .topbar{display:grid;grid-template-columns:1fr;gap:14px;border-radius:24px;padding:18px;margin-bottom:14px;background:linear-gradient(180deg,rgba(10,25,18,.68),rgba(4,12,9,.42));border:1px solid var(--line)}
  .topbar h1{font-size:28px;line-height:1.08}.topbar .eyebrow{font-size:10px}.topbar-actions{display:grid;grid-template-columns:1fr;gap:10px}.topbar-actions>*{width:100%;justify-content:center;text-align:center}.access-badge{white-space:normal;line-height:1.35;padding:10px 12px}
  .kpi-grid{grid-template-columns:1fr!important;gap:12px}.kpi-card{border-radius:22px;padding:18px}.primary-kpi strong{font-size:42px}.kpi-card strong{font-size:30px}
  .dashboard-grid{grid-template-columns:1fr!important;gap:14px}.panel{border-radius:24px;padding:16px;margin-bottom:14px;background:linear-gradient(180deg,rgba(10,25,18,.62),rgba(4,12,9,.36))}.panel-head{display:grid;grid-template-columns:1fr;gap:12px}.panel-head h2{font-size:19px}.panel-head p{font-size:12px}.mini-select,.stn-search-input{width:100%!important;min-width:0!important;min-height:46px;font-size:15px}
  .location-row{grid-template-columns:1fr;gap:10px;padding:14px;border-radius:18px}.progress-mini{min-width:0}.location-row .bar{margin:6px 0}.pill,.chip{white-space:normal}
  .form-grid{grid-template-columns:1fr!important;gap:12px}.span-2{grid-column:auto}.form-grid input,.form-grid select,.form-grid textarea{min-height:48px;font-size:16px}.form-grid textarea{min-height:116px}.primary-btn,.secondary-btn,.ghost-btn,.logout-btn{min-height:48px;font-size:15px}
  .panel-actions,.filter-row{display:grid;grid-template-columns:1fr;gap:10px;width:100%}.panel-actions button,.filter-row select{width:100%}
  .checklist-summary{grid-template-columns:1fr!important}.summary-card{min-height:auto}.checklist-item{border-radius:20px;padding:16px}.checklist-item h3{font-size:16px}.checklist-item p{font-size:13px}.checklist-options{display:grid;grid-template-columns:1fr;gap:8px}.option-row{display:grid;grid-template-columns:1fr;gap:8px}.option-row label{width:100%}
  .table-wrap,.matrix-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}.data-table{min-width:760px}.target-metrics{grid-template-columns:1fr!important}.logic-stack{display:grid;gap:10px}.guideline-library-head,.guideline-item-grid{grid-template-columns:1fr!important}.guideline-search{min-height:48px;font-size:15px}
  .risk-heatmap{max-width:100%;overflow:hidden}.heatmap-card-wrap{max-height:none;overflow:visible;padding-right:0}.heatmap-station-card{border-radius:18px}.heatmap-station-head{position:relative;top:auto}.heatmap-area-grid{grid-template-columns:1fr 1fr;gap:8px}.heatmap-cell{min-height:112px}.risk-ref-table{min-width:680px}.risk-matrix-table-wrap{overflow:auto;-webkit-overflow-scrolling:touch}
  .toast{left:14px;right:14px;bottom:18px;max-width:none;text-align:center}
}

@media(max-width:430px){
  .mobile-bar-title span{max-width:132px}.mobile-bar-logo{width:98px}.topbar h1{font-size:25px}.login-title-block h1{font-size:30px}.heatmap-area-grid{grid-template-columns:1fr}.panel{padding:14px}.main-content{padding:12px}.mobile-app-bar{height:68px}.app-screen{padding-top:68px}.mobile-menu-btn{width:42px;height:42px}
}


/* v18: professional mobile application visual layer only. Desktop >=861px remains untouched. */
@media (max-width: 860px){
  :root{--mobile-bar-h:calc(66px + env(safe-area-inset-top));}
  html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
  html,body{width:100%;max-width:100%;overflow-x:hidden;background:#020806;}
  body.auth-locked #appScreen,
  #appScreen.hidden{display:none!important;visibility:hidden!important;pointer-events:none!important;}
  body.mobile-nav-open{overflow:hidden;touch-action:none;}

  /* Login becomes a clean mobile entry screen, while preserving all desktop structure. */
  .login-screen{min-height:100dvh;padding:calc(14px + env(safe-area-inset-top)) 14px calc(18px + env(safe-area-inset-bottom));place-items:start stretch;background:#020806;}
  .login-shell{width:100%;max-width:520px;margin:0 auto;display:grid;grid-template-columns:1fr;gap:14px;}
  .login-brand-panel{min-height:0!important;border-radius:26px;padding:22px;background:linear-gradient(180deg,rgba(10,25,18,.76),rgba(4,12,9,.46));box-shadow:0 18px 44px rgba(0,0,0,.36);}
  .login-logo-row{margin:0 0 18px!important;}
  .login-logo-row .company-logo{width:196px!important;max-width:78%;height:auto!important;}
  .login-title-block h1{font-size:clamp(30px,9.3vw,42px)!important;line-height:1.02;letter-spacing:-.058em;max-width:11ch;}
  .login-title-block .eyebrow{font-size:10px;line-height:1.35;letter-spacing:.13em;}
  .login-brand-panel>.muted{font-size:13px!important;line-height:1.55;max-width:100%;}
  .login-metrics{display:grid;grid-template-columns:1fr;gap:10px;margin-top:6px;}
  .login-metrics div{padding:13px 14px;border-radius:17px;background:rgba(232,236,233,.055);}
  .login-metrics strong{font-size:23px;}
  .login-metrics span{font-size:12px;}
  .login-card{border-radius:26px;padding:22px;background:linear-gradient(180deg,rgba(10,25,18,.80),rgba(4,12,9,.50));box-shadow:0 20px 48px rgba(0,0,0,.42);}
  .login-card h3{font-size:29px;margin:14px 0 18px;}
  .login-card input{min-height:50px;font-size:16px;border-radius:15px;}
  .field-instruction{font-size:11px;line-height:1.45;}
  .password-field{position:relative;}
  .password-toggle{position:absolute;right:6px;top:50%;transform:translateY(-50%);min-width:42px;min-height:42px;border-radius:13px;}
  .password-field input{padding-right:54px;}
  .login-card .primary-btn{min-height:50px;border-radius:15px;font-size:15px;}

  /* App shell: drawer navigation, no desktop layout impact. */
  #appScreen:not(.hidden){display:block!important;width:100%;max-width:100vw;min-height:100dvh;padding-top:var(--mobile-bar-h)!important;background:radial-gradient(circle at 86% 8%,rgba(20,122,82,.16),transparent 34%),linear-gradient(135deg,#010403,#05130d 56%,#010806);}
  .mobile-app-bar{position:fixed;display:flex!important;align-items:center;gap:11px;top:0;left:0;right:0;height:var(--mobile-bar-h);padding:env(safe-area-inset-top) 13px 10px;z-index:120;background:rgba(2,8,6,.94);border-bottom:1px solid rgba(232,236,233,.13);backdrop-filter:blur(18px) saturate(125%);box-shadow:0 14px 36px rgba(0,0,0,.30);}
  .mobile-menu-btn{display:grid;place-items:center;flex:0 0 auto;width:44px;height:44px;border-radius:15px;background:rgba(232,236,233,.065);border:1px solid rgba(232,236,233,.16);color:#f2f6f3;font-size:22px;font-weight:900;}
  .mobile-bar-logo{width:104px;height:auto;filter:brightness(0) invert(1);opacity:.98;}
  .mobile-bar-title{min-width:0;display:flex;flex-direction:column;gap:2px;}
  .mobile-bar-title strong{font-size:13px;line-height:1.1;color:#f2f6f3;white-space:nowrap;}
  .mobile-bar-title span{font-size:10px;line-height:1.25;color:#aeb8b3;max-width:166px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .mobile-nav-backdrop{display:block!important;position:fixed;inset:0;background:rgba(0,0,0,.52);z-index:95;opacity:0;pointer-events:none;transition:opacity .22s ease;backdrop-filter:blur(2px);}
  body.mobile-nav-open .mobile-nav-backdrop{opacity:1;pointer-events:auto;}
  .sidebar{position:fixed!important;top:0!important;left:0!important;bottom:0!important;width:min(84vw,338px)!important;height:100dvh!important;z-index:130;display:flex;flex-direction:column;overflow-y:auto!important;transform:translateX(-105%);transition:transform .25s cubic-bezier(.22,.61,.36,1);background:rgba(2,8,6,.985);border-right:1px solid rgba(232,236,233,.16);box-shadow:26px 0 70px rgba(0,0,0,.56);padding-bottom:env(safe-area-inset-bottom);}
  body.mobile-nav-open .sidebar{transform:translateX(0);}
  .logo-only{padding:24px 18px 12px!important;}
  .logo-only .company-logo{width:205px!important;height:auto!important;}
  .nav-menu{padding:12px 14px 8px;display:grid!important;grid-template-columns:1fr!important;gap:8px;}
  .nav-btn{min-height:48px;padding:13px 14px;border-radius:16px;font-size:14px;text-align:left;}
  .sidebar-note,.program-identity{margin-left:14px!important;margin-right:14px!important;border-radius:18px;}
  .sidebar-note{margin-top:10px!important;}
  .program-identity{margin-top:12px!important;}
  .logout-btn{width:calc(100% - 28px)!important;margin:14px!important;min-height:48px;border-radius:16px;}

  /* Main content: native app spacing and readable cards. */
  .main-content{width:100%;max-width:100vw;min-width:0;padding:14px 14px calc(28px + env(safe-area-inset-bottom))!important;overflow:visible;background:transparent;}
  .global-watermark{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;}
  .global-watermark .sqs-background-shape{position:fixed!important;width:980px!important;height:980px!important;right:-650px!important;top:54%!important;opacity:.105!important;}
  .topbar{display:grid;grid-template-columns:1fr!important;gap:14px;margin:0 0 14px!important;padding:18px!important;border-radius:26px;background:linear-gradient(180deg,rgba(10,25,18,.70),rgba(4,12,9,.42));box-shadow:0 18px 45px rgba(0,0,0,.26);}
  .topbar h1{font-size:clamp(26px,7.3vw,34px);line-height:1.08;letter-spacing:-.04em;}
  .topbar .eyebrow{font-size:10px;line-height:1.35;letter-spacing:.13em;}
  .topbar-actions{display:grid!important;grid-template-columns:1fr 1fr;gap:10px;width:100%;}
  .topbar-actions .access-badge{grid-column:1/-1;width:100%;justify-content:center;text-align:center;white-space:normal;line-height:1.35;padding:10px 12px;}
  .topbar-actions .secondary-btn{width:100%;min-height:48px;border-radius:15px;justify-content:center;}

  .kpi-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px;}
  .kpi-card{min-width:0;padding:17px 16px;border-radius:24px;background:linear-gradient(180deg,rgba(10,25,18,.66),rgba(4,12,9,.38));}
  .kpi-card.primary-kpi{grid-column:1/-1;}
  .kpi-card p{font-size:13px;}
  .kpi-card strong{font-size:30px;line-height:1.05;}
  .primary-kpi strong{font-size:44px;}
  .kpi-card small{font-size:12px;line-height:1.45;}
  .dashboard-grid{display:grid!important;grid-template-columns:1fr!important;gap:14px;}
  .panel{padding:16px!important;border-radius:26px;margin-bottom:14px;background:linear-gradient(180deg,rgba(10,25,18,.63),rgba(4,12,9,.36));box-shadow:0 16px 44px rgba(0,0,0,.24);}
  .panel-head{display:grid!important;grid-template-columns:1fr!important;gap:12px;align-items:start;}
  .panel-head h2{font-size:20px;line-height:1.2;}
  .panel-head p{font-size:12px;line-height:1.45;}
  .panel-actions,.filter-row{display:grid!important;grid-template-columns:1fr!important;gap:10px;width:100%;}
  .panel-actions button,.filter-row select,.mini-select,.stn-search-input{width:100%!important;min-width:0!important;min-height:48px;font-size:15px;border-radius:15px;}

  /* Dense data stays usable on phone without changing information. */
  .location-row{grid-template-columns:1fr!important;gap:12px;padding:15px;border-radius:20px;}
  .location-row .bar{height:10px;margin:6px 0;}
  .progress-mini{min-width:0;width:100%;}
  .pill,.chip{white-space:normal;line-height:1.25;}
  .target-metrics,.checklist-summary{grid-template-columns:1fr!important;gap:10px;}
  .summary-card{min-height:auto;padding:14px;border-radius:18px;}
  .form-grid{display:grid!important;grid-template-columns:1fr!important;gap:12px;}
  .span-2{grid-column:auto!important;}
  .form-grid input,.form-grid select,.form-grid textarea{min-height:49px;font-size:16px;border-radius:15px;}
  .form-grid textarea{min-height:120px;}
  .primary-btn,.secondary-btn,.ghost-btn,.table-action{min-height:48px;border-radius:15px;font-size:15px;}
  .table-wrap,.matrix-wrap,.risk-matrix-table-wrap{overflow-x:auto!important;-webkit-overflow-scrolling:touch;border-radius:18px;}
  .data-table{min-width:780px;}
  .data-table th,.data-table td{font-size:12px;}

  /* Inspection execution: mobile-friendly assessment controls. */
  .checklist-item{padding:16px!important;border-radius:22px;}
  .checklist-item-head{display:grid!important;grid-template-columns:1fr;gap:10px;}
  .checklist-item h3{font-size:16px;line-height:1.42;}
  .checklist-item p{font-size:13px;line-height:1.5;}
  .answer-row{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}
  .answer-row label{justify-content:center;text-align:center;min-height:44px;padding:9px 8px;font-size:12px;}
  .risk-rating-row{grid-template-columns:1fr!important;gap:10px;border-radius:18px;}
  .noncompliance-extra{grid-template-columns:1fr!important;}

  /* Heat map optimized as a mobile card matrix. */
  .risk-heatmap{max-width:100%;overflow:hidden;}
  .heatmap-card-wrap{max-height:none!important;overflow:visible!important;padding-right:0!important;}
  .heatmap-station-card{border-radius:22px;padding:12px;}
  .heatmap-station-head{position:relative!important;top:auto!important;border-radius:16px;}
  .heatmap-area-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px;}
  .heatmap-cell{min-height:112px;padding:10px;border-radius:16px;}
  .heatmap-cell span{font-size:11px;}
  .heatmap-cell b{font-size:18px;}
  .heatmap-cell small{font-size:10.5px;}
  .heatmap-legend{display:flex;flex-wrap:wrap;gap:8px 10px;font-size:12px;}

  .guideline-library-head,.guideline-item-grid{grid-template-columns:1fr!important;}
  .guideline-search{min-height:49px;font-size:15px;border-radius:15px;}
  .guideline-item-card{border-radius:18px;}
  .toast{left:14px;right:14px;bottom:calc(18px + env(safe-area-inset-bottom));max-width:none;text-align:center;border-radius:16px;}
}

@media (max-width: 390px){
  .kpi-grid{grid-template-columns:1fr!important;}
  .answer-row{grid-template-columns:1fr!important;}
  .heatmap-area-grid{grid-template-columns:1fr!important;}
  .topbar-actions{grid-template-columns:1fr!important;}
  .mobile-bar-logo{width:92px;}
  .mobile-bar-title span{max-width:126px;}
  .login-title-block h1{font-size:29px!important;}
}

/* v19: professional mobile-only tab page refinement — desktop unchanged */
@media (max-width: 860px){
  *,*::before,*::after{box-sizing:border-box;}
  html,body,#appScreen,.main-content,.view,.dashboard-grid,.panel,.wide-panel,.table-wrap,.matrix-wrap{max-width:100%!important;min-width:0!important;}
  body{overscroll-behavior-x:none;}
  #appScreen:not(.hidden){overflow-x:hidden!important;}
  .main-content{padding:12px 12px calc(34px + env(safe-area-inset-bottom))!important;}

  /* Cleaner app header for iPhone widths */
  .mobile-app-bar{gap:10px;padding-left:12px;padding-right:12px;}
  .mobile-menu-btn{width:46px;height:46px;border-radius:16px;box-shadow:inset 0 1px 0 rgba(255,255,255,.05);}
  .mobile-bar-logo{width:118px;max-width:34vw;flex:0 1 auto;}
  .mobile-bar-title{flex:1 1 auto;min-width:0;}
  .mobile-bar-title strong{font-size:14px;overflow:hidden;text-overflow:ellipsis;}
  .mobile-bar-title span{max-width:100%;font-size:11px;}

  /* Tab/section pages fit the viewport, never the desktop table width */
  .topbar,.panel,.kpi-card,.summary-card,.logic-card,.checklist-item,.finding-card,.location-row,.heatmap-station-card{width:100%;max-width:100%;min-width:0;}
  .topbar{padding:17px!important;border-radius:24px;overflow:hidden;}
  .topbar h1{font-size:clamp(28px,8vw,40px)!important;max-width:100%;overflow-wrap:anywhere;}
  .topbar-actions{grid-template-columns:1fr!important;}
  .topbar-actions .secondary-btn,.topbar-actions .primary-btn,.topbar-actions .ghost-btn{width:100%;}
  .access-badge{display:flex!important;max-width:100%;overflow-wrap:anywhere;word-break:break-word;}

  .kpi-grid{grid-template-columns:1fr 1fr!important;gap:12px!important;margin-bottom:14px;}
  .kpi-card{padding:18px 16px!important;min-height:148px;display:flex;flex-direction:column;justify-content:flex-start;}
  .kpi-card.primary-kpi{min-height:172px;}
  .kpi-card p{font-size:13px;line-height:1.25;}
  .kpi-card small{margin-top:auto;line-height:1.45;}
  .primary-kpi strong{font-size:clamp(48px,16vw,74px)!important;}

  .dashboard-grid{display:grid!important;grid-template-columns:1fr!important;gap:14px!important;}
  .panel{padding:16px!important;border-radius:24px!important;overflow:hidden;}
  .panel-head{margin-bottom:14px!important;}
  .panel-head h2{font-size:21px!important;letter-spacing:-.02em;}
  .panel-head p{font-size:13px!important;}
  .panel-actions{grid-template-columns:1fr!important;}

  /* Annual Plan target form: no clipping on Save button */
  .target-form{display:grid!important;grid-template-columns:1fr!important;gap:12px!important;}
  .target-form label,.form-grid label{min-width:0;width:100%;}
  .target-form .primary-btn,.form-grid .primary-btn,.full-btn{width:100%!important;min-width:0!important;justify-content:center;text-align:center;white-space:normal;}
  .form-grid input,.form-grid select,.form-grid textarea{width:100%!important;max-width:100%!important;min-width:0!important;}
  select,input,textarea{max-width:100%!important;}

  /* Area progress rows become compact stacked mobile cards */
  .location-row{display:grid!important;grid-template-columns:1fr!important;align-items:start!important;gap:11px!important;padding:16px!important;border-radius:21px!important;}
  .location-row h3{font-size:15px!important;line-height:1.3;overflow-wrap:anywhere;}
  .location-row p{font-size:12px!important;line-height:1.4;}
  .location-row .chip{width:100%;justify-content:center;text-align:center;border-radius:14px;padding:9px 10px;}
  .progress-mini{width:100%!important;min-width:0!important;}

  /* Convert major tab tables into readable mobile cards while preserving all data */
  #targetDirectory.table-wrap,
  #userDirectory.table-wrap,
  #activityLogList.table-wrap{overflow:visible!important;margin-top:14px;}
  #targetDirectory .data-table,
  #userDirectory .data-table,
  #activityLogList .data-table{display:block!important;width:100%!important;min-width:0!important;border-spacing:0!important;}
  #targetDirectory .data-table thead,
  #userDirectory .data-table thead,
  #activityLogList .data-table thead{display:none!important;}
  #targetDirectory .data-table tbody,
  #targetDirectory .data-table tr,
  #targetDirectory .data-table td,
  #userDirectory .data-table tbody,
  #userDirectory .data-table tr,
  #userDirectory .data-table td,
  #activityLogList .data-table tbody,
  #activityLogList .data-table tr,
  #activityLogList .data-table td{display:block!important;width:100%!important;max-width:100%!important;}
  #targetDirectory .data-table tr,
  #userDirectory .data-table tr,
  #activityLogList .data-table tr{margin:0 0 12px;padding:14px;border:1px solid rgba(232,236,233,.13);border-radius:20px;background:linear-gradient(180deg,rgba(10,25,18,.58),rgba(4,12,9,.32));box-shadow:0 12px 32px rgba(0,0,0,.18);}
  #targetDirectory .data-table td,
  #userDirectory .data-table td,
  #activityLogList .data-table td{border:0!important;border-radius:0!important;background:transparent!important;padding:9px 0!important;font-size:13px!important;line-height:1.45;overflow-wrap:anywhere;}
  #targetDirectory .data-table td:not(:last-child),
  #userDirectory .data-table td:not(:last-child),
  #activityLogList .data-table td:not(:last-child){border-bottom:1px solid rgba(232,236,233,.08)!important;}
  #targetDirectory .data-table td::before,
  #userDirectory .data-table td::before,
  #activityLogList .data-table td::before{display:block;margin-bottom:4px;color:var(--muted);font-size:10px;font-weight:900;letter-spacing:.09em;text-transform:uppercase;}

  #targetDirectory .data-table td:nth-child(1)::before{content:'Location';}
  #targetDirectory .data-table td:nth-child(2)::before{content:'Status';}
  #targetDirectory .data-table td:nth-child(3)::before{content:'Monthly Target';}
  #targetDirectory .data-table td:nth-child(4)::before{content:'Annual Target';}
  #targetDirectory .data-table td:nth-child(5)::before{content:'Action';}

  #userDirectory .data-table td:nth-child(1)::before{content:'Email / PRN';}
  #userDirectory .data-table td:nth-child(2)::before{content:'Location';}
  #userDirectory .data-table td:nth-child(3)::before{content:'Area';}
  #userDirectory .data-table td:nth-child(4)::before{content:'Role / Status';}
  #userDirectory .data-table td:nth-child(5)::before{content:'Inspection Progress';}
  #userDirectory .data-table td:nth-child(6)::before{content:'Last Login';}
  #userDirectory .data-table td:nth-child(7)::before{content:'Actions';}

  #activityLogList .data-table td:nth-child(1)::before{content:'Date / Time';}
  #activityLogList .data-table td:nth-child(2)::before{content:'Area';}
  #activityLogList .data-table td:nth-child(3)::before{content:'Checklist / Area';}
  #activityLogList .data-table td:nth-child(4)::before{content:'Inspector';}
  #activityLogList .data-table td:nth-child(5)::before{content:'Result';}
  #activityLogList .data-table td:nth-child(6)::before{content:'Report';}

  #targetDirectory .table-action,
  #userDirectory .table-action,
  #activityLogList .table-action{width:100%;min-height:44px;margin-top:4px;}

  /* Annual matrix remains scrollable, but contained inside the card */
  .matrix-wrap,.risk-matrix-table-wrap{max-width:100%!important;overflow-x:auto!important;overflow-y:hidden;-webkit-overflow-scrolling:touch;padding-bottom:6px;}
  .matrix-table{min-width:860px!important;}
  .matrix-table th:first-child,.matrix-table td:first-child{min-width:148px;}

  .guidelines-panel,.guideline-group-card,.guideline-item-card{max-width:100%;min-width:0;}
  .guideline-link{width:100%;justify-content:center;text-align:center;}
}

@media (max-width: 430px){
  .main-content{padding-left:10px!important;padding-right:10px!important;}
  .mobile-bar-logo{width:106px;max-width:31vw;}
  .mobile-bar-title strong{font-size:13px;}
  .kpi-card{padding:16px 14px!important;min-height:142px;}
  .panel{padding:15px!important;border-radius:22px!important;}
  .topbar{padding:16px!important;}
}

@media (max-width: 370px){
  .kpi-grid{grid-template-columns:1fr!important;}
  .mobile-bar-logo{width:94px;}
  .mobile-menu-btn{width:43px;height:43px;}
}


/* v20 professional refinements */
.sidebar-user-panel{display:grid;gap:10px;margin-top:auto;margin-bottom:12px;padding:12px;border:1px solid rgba(232,236,233,.12);border-radius:22px;background:rgba(255,255,255,.025)}
.sidebar-user-panel .access-badge{width:100%;max-width:100%;justify-content:flex-start;white-space:normal;line-height:1.4;overflow-wrap:anywhere}
.sidebar-user-panel .secondary-btn{width:100%;min-height:44px;justify-content:center}
.topbar-actions-clean{display:none!important}
.login-brand-panel .muted{max-width:720px}
.target-smart-selector{margin-top:16px;border:1px solid rgba(232,236,233,.12);border-radius:24px;padding:16px;background:linear-gradient(180deg,rgba(10,35,25,.44),rgba(5,12,9,.26));box-shadow:0 18px 48px rgba(0,0,0,.18)}
.smart-selector-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,.7fr);gap:12px;align-items:end;margin-bottom:12px}
.smart-selector-head h3{margin:0 0 4px;font-size:18px;color:var(--text)}
.smart-selector-head p{margin:0;color:var(--muted);font-size:13px;line-height:1.45}
.smart-selector-head input{width:100%;min-height:46px;border-radius:16px;border:1px solid rgba(232,236,233,.16);background:rgba(0,0,0,.22);color:var(--text);padding:0 14px;font-weight:800}
.smart-selector-actions{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.smart-chip{border:1px solid rgba(232,236,233,.16);background:rgba(255,255,255,.04);color:var(--text);border-radius:999px;padding:9px 12px;font-weight:900;cursor:pointer}
.smart-chip.active,.smart-chip.accent{border-color:rgba(32,201,151,.55);background:rgba(32,201,151,.14)}
.smart-stn-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.smart-stn-btn{display:flex;flex-direction:column;align-items:flex-start;gap:5px;text-align:left;border:1px solid rgba(232,236,233,.12);border-radius:18px;padding:13px 14px;background:rgba(0,0,0,.20);color:var(--text);cursor:pointer;min-width:0;transition:transform .18s ease,border-color .18s ease,background .18s ease}
.smart-stn-btn:hover,.smart-stn-btn.selected{transform:translateY(-1px);border-color:rgba(32,201,151,.62);background:rgba(32,201,151,.10)}
.smart-stn-btn span{font-size:13px;line-height:1.3;overflow-wrap:anywhere}.smart-stn-btn small{color:var(--muted);font-weight:800}.smart-stn-btn.is-inactive{opacity:.58}
#targetDirectory tr[data-load-target-row]{cursor:pointer}
@media(max-width:768px){
  .sidebar-user-panel{margin-top:18px;margin-bottom:12px;padding:12px}.sidebar-user-panel .secondary-btn{min-height:48px}
  .target-smart-selector{padding:14px;border-radius:22px}.smart-selector-head{grid-template-columns:1fr}.smart-selector-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.smart-chip{width:100%;white-space:normal}.smart-stn-grid{grid-template-columns:1fr 1fr;gap:9px}.smart-stn-btn{padding:12px;border-radius:16px}.smart-stn-btn span{font-size:12px}.smart-stn-btn small{font-size:11px}
}
@media(max-width:430px){.smart-stn-grid{grid-template-columns:1fr}.smart-selector-actions{grid-template-columns:1fr}.login-title-block h1{font-size:32px!important}.login-brand-panel{padding-bottom:18px!important}}

/* v21: approved 28-Area correction, full-width professional heat map, and mobile alignment */
.risk-panel-wide{
  grid-column:1 / -1;
}
.risk-panel-wide .risk-heatmap{
  overflow:visible;
}
.risk-panel-wide .heatmap-card-wrap{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(520px,1fr));
  gap:16px;
  max-height:none;
  overflow:visible;
  padding-right:0;
  align-items:stretch;
}
.risk-panel-wide .heatmap-station-card{
  min-height:338px;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  gap:12px;
  padding:16px;
  border-radius:22px;
}
.risk-panel-wide .heatmap-station-head{
  position:relative;
  top:auto;
  min-height:54px;
  flex:0 0 auto;
}
.risk-panel-wide .heatmap-area-grid{
  flex:1 1 auto;
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:10px;
  align-items:stretch;
}
.risk-panel-wide .heatmap-cell{
  min-height:118px;
  justify-content:space-between;
}
.risk-panel-wide .heatmap-legend{
  position:sticky;
  bottom:0;
  z-index:3;
  padding:10px 0 0;
  background:linear-gradient(180deg,rgba(4,13,18,0),rgba(4,13,18,.92) 35%,rgba(4,13,18,.96));
}
.smart-stn-btn.selected{
  border-color:rgba(46,224,161,.70)!important;
  box-shadow:0 0 0 2px rgba(46,224,161,.12), 0 18px 40px rgba(0,0,0,.18);
  transform:translateY(-1px);
}
.smart-stn-btn{transition:border-color .18s ease, transform .18s ease, box-shadow .18s ease, background .18s ease;}
.smart-stn-btn:hover{border-color:rgba(46,224,161,.45);transform:translateY(-1px);}

@media (max-width: 1260px){
  .risk-panel-wide .heatmap-area-grid{grid-template-columns:repeat(4,minmax(0,1fr));}
}
@media (max-width: 980px){
  .risk-panel-wide .heatmap-card-wrap{grid-template-columns:1fr;}
  .risk-panel-wide .heatmap-area-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media (max-width: 860px){
  .risk-panel-wide{grid-column:auto;}
  .risk-panel-wide .heatmap-card-wrap{
    grid-template-columns:1fr!important;
    gap:12px!important;
    max-height:none!important;
    overflow:visible!important;
  }
  .risk-panel-wide .heatmap-station-card{
    min-height:auto!important;
    padding:14px!important;
    border-radius:22px!important;
  }
  .risk-panel-wide .heatmap-station-head{
    min-height:auto!important;
    align-items:flex-start!important;
  }
  .risk-panel-wide .heatmap-area-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;
  }
  .risk-panel-wide .heatmap-cell{
    min-height:112px!important;
  }
  .risk-panel-wide .heatmap-legend{
    position:relative!important;
    background:transparent!important;
  }
}
@media (max-width: 390px){
  .risk-panel-wide .heatmap-area-grid{grid-template-columns:1fr!important;}
}

/* v22 refinement: move guideline library to side panel view and free Annual Plan page space */
.sidebar .sidebar-note,
.sidebar .program-identity{display:none!important;}
.sidebar-user-panel-bottom{margin-top:auto;}
.guideline-page-panel{max-width:100%;}
.manual-access-note{display:grid;gap:6px;border:1px solid rgba(40,201,139,.24);background:rgba(40,201,139,.06);border-radius:18px;padding:14px 16px;margin:0 0 14px;color:var(--muted);line-height:1.45;}
.manual-access-note strong{color:var(--text);font-size:14px;}
.manual-access-note span{font-size:13px;}
#annualPlanView .dashboard-grid{grid-template-columns:1fr!important;}
#annualPlanView .wide-panel{width:100%;}
.guidelines-panel.hidden{display:grid!important;}
@media(max-width:860px){
  .sidebar-user-panel-bottom{margin-top:18px;}
  .manual-access-note{border-radius:16px;padding:13px;}
  .guideline-page-panel{padding:16px!important;}
  #annualPlanView .dashboard-grid{display:block;}
}


/* v24: final requested refinements — no smart Area buttons, internal publication library, aligned mobile canvas */
#targetSmartSelector,.target-smart-selector,.smart-selector-head,.smart-selector-actions,.smart-stn-grid{display:none!important;}
#targetDirectory tr[data-target-search]{cursor:default!important;}
.target-directory-toolbar{margin:16px 0 8px;display:flex;justify-content:flex-end;}
.target-directory-search{width:min(420px,100%);}
.target-directory-table td{height:68px;vertical-align:middle;}
.target-directory-table td:first-child{min-width:300px;}
#targetDirectory .data-table th:last-child,#targetDirectory .data-table td:last-child{border-radius:0 14px 14px 0;}
#targetDirectory .data-table td:nth-child(4){border-right:1px solid var(--line);}
.publication-grid{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));}
.guideline-dropdown{border:1px solid rgba(232,236,233,.13);border-radius:22px;background:linear-gradient(180deg,rgba(10,25,18,.50),rgba(4,12,9,.30));overflow:hidden;}
.guideline-dropdown+ .guideline-dropdown{margin-top:12px;}
.guideline-dropdown summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 18px;border-bottom:1px solid rgba(232,236,233,.10);}
.guideline-dropdown summary::-webkit-details-marker{display:none;}
.guideline-dropdown summary span{font-size:18px;font-weight:900;color:var(--text);}
.guideline-dropdown summary small{font-size:12px;color:var(--muted);line-height:1.45;text-align:right;}
.guideline-area-block{padding:14px 16px 18px;}
.guideline-area-block h4{margin:0 0 12px;color:var(--text);font-size:15px;letter-spacing:.01em;}
.publication-card{min-height:100%;gap:10px;}
.publication-card-top{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.publication-definition{margin:0;display:grid;gap:8px;}
.publication-definition dt{font-size:10px;text-transform:uppercase;letter-spacing:.10em;color:var(--muted);font-weight:900;margin-top:4px;}
.publication-definition dd{margin:0;color:#dbe5df;font-size:12.5px;line-height:1.5;}
.publication-definition ul{margin:0;padding-left:18px;display:grid;gap:4px;}
.guideline-link{display:none!important;}
.guideline-page-panel .panel-head{margin-bottom:16px;}
.mobile-bar-title strong,.mobile-bar-title span{overflow:hidden;text-overflow:ellipsis;}

@media (max-width: 860px){
  .target-directory-toolbar{margin:14px 0 10px;display:block;}
  .target-directory-search{width:100%!important;min-height:50px!important;}
  #targetDirectory .data-table td:nth-child(5),
  #targetDirectory .data-table th:nth-child(5){display:none!important;}
  #targetDirectory .data-table td:nth-child(4)::before{content:'Annual Target'!important;}
  #targetDirectory .data-table td:nth-child(5)::before{content:''!important;}
  #targetDirectory .data-table tr{min-height:0!important;}
  #targetDirectory .data-table td{padding:9px 0!important;}
  .guideline-dropdown{border-radius:20px;}
  .guideline-dropdown summary{padding:15px;align-items:flex-start;flex-direction:column;gap:5px;}
  .guideline-dropdown summary small{text-align:left;}
  .guideline-area-block{padding:13px;}
  .publication-grid,.guideline-item-grid{grid-template-columns:1fr!important;gap:11px!important;}
  .publication-card{border-radius:18px!important;padding:13px!important;}
  .publication-definition dd{font-size:12.5px;overflow-wrap:anywhere;}
  .publication-card-top .chip{max-width:100%;overflow-wrap:anywhere;}
  .guideline-page-panel .panel-head h2{font-size:20px;}
  .guideline-page-panel .panel-head p{font-size:12.5px;line-height:1.55;}
}

@media (max-width: 430px){
  .mobile-bar-title span{max-width:150px!important;}
  .guideline-dropdown summary span{font-size:17px;}
  .publication-definition dt{font-size:9.5px;}
  .publication-definition dd{font-size:12px;}
}


/* v25: desktop web alignment only — extend Area Progress card without touching mobile layout */
@media (min-width: 861px){
  #dashboardView .dashboard-grid{
    grid-template-columns:1fr!important;
    gap:18px!important;
    align-items:start;
  }
  #dashboardView .wide-panel,
  #dashboardView .risk-panel-wide{
    grid-column:1 / -1!important;
    width:100%!important;
    max-width:100%!important;
  }
  #dashboardView .wide-panel .panel-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(320px,420px)!important;
    align-items:center!important;
  }
  #dashboardView .stn-search-input{
    width:100%!important;
    min-width:0!important;
  }
  #dashboardView .progress-list{
    width:100%!important;
  }
  #dashboardView .location-row{
    grid-template-columns:minmax(360px,1.55fr) minmax(160px,.55fr) minmax(320px,1fr) minmax(140px,auto)!important;
    width:100%!important;
    align-items:center!important;
  }
  #dashboardView .location-row .bar,
  #dashboardView .progress-mini{
    width:100%!important;
  }
}


/* v26: login reliability, role-based tab permissions, and desktop-only Area Progress alignment */
.role-denied{display:none!important;}

@media (min-width: 861px){
  /* Center the login program title inside its visual card without altering application data. */
  .login-brand-panel{
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
    gap:28px!important;
  }
  .login-logo-row{
    width:100%;
    display:flex!important;
    justify-content:center!important;
    margin:0!important;
  }
  .login-title-block{
    width:100%;
    max-width:920px!important;
    margin:0 auto!important;
    text-align:center!important;
  }
  .login-title-block h1{
    margin:0 auto!important;
    max-width:13.5ch!important;
    text-align:center!important;
  }
  .login-brand-panel>.muted{
    margin:0 auto!important;
    text-align:center!important;
  }

  /* Dashboard web view: extend Area Progress and Risk Heat Map panels across the full available canvas. */
  body:not(.auth-locked) .app-screen{
    grid-template-columns:290px minmax(0,1fr)!important;
  }
  body:not(.auth-locked) .main-content{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
  }
  #dashboardView.active-view{
    width:100%!important;
    max-width:none!important;
  }
  #dashboardView .dashboard-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    width:100%!important;
    max-width:none!important;
    gap:18px!important;
  }
  #dashboardView .wide-panel,
  #dashboardView .risk-panel-wide{
    grid-column:1 / -1!important;
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
    box-sizing:border-box!important;
  }
  #dashboardView .wide-panel .panel-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(320px,460px)!important;
    align-items:center!important;
    width:100%!important;
  }
  #dashboardView .stn-search-input{
    width:100%!important;
    min-width:0!important;
  }
  #dashboardView .progress-list{
    width:100%!important;
    max-width:none!important;
  }
  #dashboardView .location-row{
    width:100%!important;
    max-width:none!important;
    grid-template-columns:minmax(420px,1.65fr) minmax(170px,.55fr) minmax(380px,1.25fr) minmax(150px,.45fr)!important;
    padding:16px 18px!important;
    box-sizing:border-box!important;
  }
}


/* v27 final controls: bilingual switch and export/import buttons */
.language-toggle {
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.06);
  color: #f6fff9;
  border-radius: 999px;
  padding: 10px 14px;
  font-weight: 800;
  letter-spacing: .02em;
  cursor: pointer;
  min-height: 42px;
}
.language-toggle:hover { border-color: rgba(38, 214, 143, .6); background: rgba(20, 160, 104, .16); }
.login-card-head { align-items: center; }
.login-lang-toggle { margin-left: auto; padding: 7px 12px; min-height: 34px; }
.mobile-lang-toggle { margin-left: auto; flex: 0 0 auto; padding: 8px 10px; min-height: 38px; }
.panel-actions, .filter-row { flex-wrap: wrap; }
body.rtl { direction: rtl; }
body.rtl .login-shell, body.rtl .form-grid, body.rtl .panel-head, body.rtl .dashboard-grid, body.rtl .kpi-grid { direction: rtl; }
body.rtl .data-table th, body.rtl .data-table td { text-align:right; }
body.rtl input, body.rtl textarea, body.rtl select { text-align: right; }
body.rtl .data-table th, body.rtl .data-table td { text-align: right; }
body.rtl .login-lang-toggle { margin-left: 0; margin-right: auto; }
@media (max-width: 860px) {
  .mobile-app-bar { gap: 10px; }
  .mobile-lang-toggle { font-size: 13px; padding: 7px 9px; }
  #exportActivityExcelBtn, #exportChecklistExcelBtn, #importChecklistExcelBtn { width: 100%; justify-content: center; }
}


/* v28 master permissions, bilingual details and page canvas */
.master-only.hidden{display:none!important}
.role-master{color:#d7fff1!important;border-color:rgba(46,224,161,.45)!important;background:rgba(46,224,161,.14)!important}
.canvas-hidden{display:none!important}
body[data-canvas-density="compact"] .panel{padding:16px!important}
body[data-canvas-density="compact"] .kpi-card{padding:15px!important;min-height:auto}
body[data-canvas-density="compact"] .location-row{padding:11px!important}
body[data-canvas-density="executive"] .kpi-card strong{font-size:38px}
body[data-canvas-density="executive"] .primary-kpi strong{font-size:56px}
.master-panel .reference-strip{margin-bottom:16px}
.canvas-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.canvas-card{border:1px solid rgba(232,236,233,.12);border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));padding:18px;display:grid;gap:12px}
.canvas-card h3{margin:0 0 4px;font-size:18px}
.canvas-card.span-2{grid-column:span 2}
.canvas-check{display:flex!important;align-items:center;gap:10px;border:1px solid rgba(232,236,233,.10);border-radius:14px;padding:11px 12px;background:rgba(255,255,255,.035);font-weight:800;color:var(--text)}
.canvas-check input{accent-color:#2ee0a1;width:18px;height:18px}
.canvas-card label{display:grid;gap:7px;color:var(--muted);font-weight:800;font-size:13px}
.canvas-card input,.canvas-card select{width:100%;border:1px solid var(--line);background:rgba(2,8,6,.62);color:var(--text);border-radius:14px;padding:12px;outline:none;font:inherit;font-weight:800}
.canvas-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:6px}
body.rtl .language-toggle{direction:ltr}
body.rtl .nav-btn{text-align:right}
@media(max-width:860px){.canvas-grid{grid-template-columns:1fr}.canvas-card.span-2{grid-column:auto}.canvas-actions .primary-btn,.canvas-actions .secondary-btn{width:100%}}

/* v30 final: approved single SVG shape, one-card login canvas, structured Best Practices idea capture, and real Master canvas engine */
:root{
  --canvas-risk-columns:4;
  --canvas-shape-opacity:.26;
  --canvas-shape-size:1040px;
  --canvas-shape-offset-x:-120px;
  --canvas-shape-speed:115s;
  --canvas-login-width:860px;
  --canvas-login-title-scale:1;
}

.login-screen{min-height:100vh;display:grid;place-items:center;padding:32px;overflow:hidden;background:#020806;}
.login-bg{background:radial-gradient(circle at 10% 12%,rgba(255,255,255,.055),transparent 28%),linear-gradient(135deg,#020806,#07150f 58%,#020806)!important;}
.login-bg:after{opacity:.56;}
.login-bg .sqs-background-shape{position:absolute!important;width:var(--canvas-shape-size)!important;height:var(--canvas-shape-size)!important;right:var(--canvas-shape-offset-x)!important;top:50%!important;object-fit:contain!important;filter:brightness(0) invert(1) drop-shadow(0 0 22px rgba(255,255,255,.18))!important;opacity:var(--canvas-shape-opacity)!important;mix-blend-mode:normal!important;animation:approvedSingleShapeRotate var(--canvas-shape-speed) linear infinite!important;transform-origin:center center!important;}
@keyframes approvedSingleShapeRotate{from{transform:translateY(-50%) rotate(0deg)}to{transform:translateY(-50%) rotate(360deg)}}
.login-single-shell{width:min(var(--canvas-login-width),94vw)!important;max-width:var(--canvas-login-width)!important;display:block!important;margin:0 auto!important;}
.login-one-card{position:relative;border-radius:34px!important;padding:44px 52px 40px!important;min-height:auto!important;display:flex;flex-direction:column;align-items:center;text-align:center;background:linear-gradient(180deg,rgba(18,32,24,.72),rgba(4,12,9,.56))!important;border:1px solid rgba(232,236,233,.18)!important;box-shadow:0 34px 90px rgba(0,0,0,.52), inset 0 1px 0 rgba(255,255,255,.10)!important;backdrop-filter:blur(16px) saturate(120%)!important;}
.login-top-language{position:absolute;top:22px;right:24px;display:flex;justify-content:flex-end;z-index:2;}
.login-one-card .login-logo-row{display:flex!important;justify-content:center!important;margin:8px 0 24px!important;width:100%;}
.login-one-card .company-logo{width:260px!important;max-width:66%!important;height:auto!important;}
.login-one-card .login-title-block{display:flex!important;flex-direction:column!important;align-items:center!important;max-width:780px!important;width:100%!important;}
.login-one-card .login-title-block .eyebrow{font-size:12px!important;letter-spacing:.22em!important;margin:0 0 12px!important;color:#5fe3ae!important;text-align:center!important;}
.login-one-card .login-title-block h1{font-size:calc(clamp(42px,4.8vw,66px) * var(--canvas-login-title-scale))!important;line-height:1.01!important;letter-spacing:-.065em!important;text-align:center!important;max-width:820px!important;margin:0!important;}
.login-one-card #loginSubtitle{font-size:16px!important;line-height:1.55!important;margin:18px auto 18px!important;max-width:680px!important;text-align:center!important;color:rgba(232,236,233,.78)!important;}
.centered-login-access{justify-content:center!important;margin:4px 0 14px!important;gap:9px!important;text-align:center!important;width:100%;}
.centered-login-access p{margin:0!important;color:rgba(232,236,233,.76)!important;}
.login-card-divider{width:100%;display:flex;align-items:center;gap:14px;margin:8px 0 18px;color:#22d18f;}
.login-card-divider:before,.login-card-divider:after{content:"";height:1px;flex:1;background:linear-gradient(90deg,transparent,rgba(232,236,233,.24),transparent)}
.login-card-divider span{display:grid;place-items:center;width:28px;height:28px;border-radius:999px;border:1px solid rgba(46,224,161,.35);background:rgba(46,224,161,.08);font-size:13px;}
.login-one-card h3{font-size:26px!important;margin:0 0 18px!important;text-align:center!important;}
.login-one-card label{width:min(580px,100%)!important;text-align:left!important;}
.login-one-card .field-instruction{font-size:12px!important;line-height:1.45!important;color:rgba(232,236,233,.64)!important;}
.login-one-card .primary-btn{width:min(580px,100%)!important;min-height:56px!important;border-radius:16px!important;margin-top:18px!important;}
body.rtl .login-top-language{right:auto;left:24px;}
body.rtl .login-one-card label{text-align:right!important;}

.global-watermark .sqs-background-shape{filter:brightness(0) invert(1) drop-shadow(0 0 18px rgba(255,255,255,.10))!important;opacity:calc(var(--canvas-shape-opacity) * .62)!important;width:calc(var(--canvas-shape-size) * 1.14)!important;height:calc(var(--canvas-shape-size) * 1.14)!important;right:calc(var(--canvas-shape-offset-x) - 170px)!important;top:52%!important;animation:approvedSingleShapeRotate var(--canvas-shape-speed) linear infinite!important;mix-blend-mode:normal!important;}

.sag-idea-capture{margin-top:18px;border:1px solid rgba(46,224,161,.28);border-radius:24px;background:linear-gradient(180deg,rgba(46,224,161,.075),rgba(255,255,255,.025));padding:20px;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.sag-idea-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:16px}
.sag-idea-head h3{font-size:22px;margin:10px 0 6px;letter-spacing:-.03em}
.sag-idea-head p{margin:0;color:var(--muted);line-height:1.55;max-width:980px}
.sag-topic-field{display:grid!important;gap:8px;margin-bottom:14px!important;font-weight:800;color:#dbe9ee!important}
.sag-topic-field input,.sag-subquestion textarea{width:100%;border:1px solid rgba(232,236,233,.14);border-radius:16px;background:rgba(2,8,6,.62);color:var(--text);padding:13px 14px;font:inherit;outline:none;}
.sag-topic-field input:focus,.sag-subquestion textarea:focus{border-color:rgba(46,224,161,.72);box-shadow:0 0 0 4px rgba(46,224,161,.08)}
.sag-subquestion-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.sag-subquestion{display:grid!important;gap:8px;border:1px solid rgba(232,236,233,.09);border-radius:18px;background:rgba(255,255,255,.032);padding:14px;color:#dbe9ee!important;font-weight:800!important}
.sag-subquestion span{color:#5fe3ae;font-size:13px;text-transform:uppercase;letter-spacing:.05em}
.sag-subquestion textarea{min-height:100px;resize:vertical;background:rgba(2,8,6,.54)}
.sag-structured-card .sag-detail-panel{display:grid;gap:10px;margin-top:12px;border:1px solid rgba(232,236,233,.10);border-radius:18px;background:rgba(255,255,255,.032);padding:14px}
.sag-detail-row{display:grid;gap:4px;border-bottom:1px solid rgba(232,236,233,.08);padding-bottom:9px}
.sag-detail-row:last-child{border-bottom:0;padding-bottom:0}
.sag-detail-row b{color:#5fe3ae;text-transform:uppercase;font-size:12px;letter-spacing:.06em}
.sag-detail-row p{margin:0;color:#dbe9ee;line-height:1.55}

body[data-canvas-density="compact"] .panel{padding:14px!important;border-radius:20px!important}
body[data-canvas-density="compact"] .kpi-grid{gap:10px!important;margin-bottom:12px!important}
body[data-canvas-density="compact"] .kpi-card{padding:12px!important;min-height:118px!important;border-radius:18px!important}
body[data-canvas-density="compact"] .location-row{padding:10px 12px!important;border-radius:15px!important}
body[data-canvas-density="compact"] .panel-head{margin-bottom:12px!important}
body[data-canvas-density="executive"] .panel{padding:28px!important;border-radius:30px!important}
body[data-canvas-density="executive"] .kpi-grid{gap:18px!important;margin-bottom:22px!important}
body[data-canvas-density="executive"] .location-row{padding:18px!important;border-radius:22px!important}
body[data-dashboard-layout="expanded"] #dashboardView .dashboard-grid{grid-template-columns:1fr!important}
body[data-dashboard-layout="expanded"] #dashboardView .wide-panel,body[data-dashboard-layout="expanded"] #dashboardView .risk-panel-wide{width:100%!important;max-width:100%!important;grid-column:1/-1!important}
body[data-dashboard-layout="executive"] #dashboardView .dashboard-grid{grid-template-columns:minmax(0,1fr)!important}
body[data-dashboard-layout="executive"] #dashboardView .risk-panel-wide{grid-column:1/-1!important}
body[data-kpi-size="large"] .kpi-card{min-height:190px!important;padding:26px!important}
body[data-kpi-size="large"] .kpi-card strong{font-size:44px!important}
body[data-kpi-size="large"] .primary-kpi strong{font-size:68px!important}
body[data-kpi-size="compact"] .kpi-card{min-height:104px!important;padding:12px!important}
body[data-kpi-size="compact"] .kpi-card strong{font-size:26px!important}
body[data-chart-style="compact"] .risk-panel-wide .heatmap-cell{min-height:86px!important;padding:9px!important}
body[data-chart-style="compact"] .risk-panel-wide .heatmap-cell span{font-size:10.5px!important}
body[data-chart-style="list"] .risk-panel-wide .heatmap-area-grid{grid-template-columns:1fr!important}
body[data-chart-style="list"] .risk-panel-wide .heatmap-cell{min-height:70px!important;display:grid;grid-template-columns:1.3fr .4fr 1fr;align-items:center;gap:8px;text-align:left!important}
.risk-panel-wide .heatmap-area-grid{grid-template-columns:repeat(var(--canvas-risk-columns),minmax(0,1fr))!important}
.canvas-range-row{display:flex;align-items:center;gap:12px}
.canvas-range-row input[type="range"]{flex:1;padding:0!important;accent-color:#2ee0a1;background:transparent!important;border:0!important}
.canvas-range-row output{min-width:66px;text-align:right;color:#5fe3ae;font-weight:900}
.canvas-two-col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.professional-canvas-grid .canvas-card p.muted{margin:0;color:var(--muted);line-height:1.55}

@media(max-width:1100px){
  .login-single-shell{width:min(760px,94vw)!important;}
  .login-one-card{padding:36px 34px!important;}
  .login-one-card .login-title-block h1{font-size:calc(clamp(38px,7vw,58px) * var(--canvas-login-title-scale))!important;}
  .sag-subquestion-grid{grid-template-columns:1fr}
}
@media(max-width:620px){
  .login-screen{padding:calc(14px + env(safe-area-inset-top)) 14px calc(18px + env(safe-area-inset-bottom));place-items:center!important;}
  .login-single-shell{width:100%!important;max-width:520px!important;}
  .login-one-card{border-radius:26px!important;padding:28px 22px 24px!important;}
  .login-top-language{top:14px;right:14px}.login-lang-toggle{min-height:34px;padding:7px 11px!important;}
  .login-one-card .company-logo{width:200px!important;max-width:72%!important;margin-top:14px;}
  .login-one-card .login-title-block h1{font-size:calc(clamp(30px,8.6vw,40px) * var(--canvas-login-title-scale))!important;max-width:12ch!important;}
  .login-one-card .login-title-block .eyebrow{font-size:10px!important;letter-spacing:.13em!important;}
  .centered-login-access{font-size:12px!important;line-height:1.35!important;}
  .login-card-divider{margin:6px 0 14px;}
  .login-bg .sqs-background-shape{width:900px!important;height:900px!important;right:-620px!important;opacity:calc(var(--canvas-shape-opacity) * .62)!important;}
  .sag-idea-capture{padding:15px;border-radius:20px}.sag-idea-head h3{font-size:18px}.sag-subquestion{padding:12px}.canvas-two-col{grid-template-columns:1fr}
}

/* v31 final accuracy pass: single approved shape, generic Best Practices idea question before every checklist, compact info tips, working dashboard canvas visuals */
:root{
  --risk-high:#e53935;
  --risk-medium:#f59e0b;
  --risk-low:#22c55e;
}
.login-bg .sqs-background-shape{
  filter:brightness(0) invert(1) grayscale(1) drop-shadow(0 0 24px rgba(255,255,255,.20))!important;
  opacity:var(--canvas-shape-opacity)!important;
  right:var(--canvas-shape-offset-x)!important;
  left:auto!important;
  top:50%!important;
}
.login-bg .sqs-shape,.login-bg .login-shape-main,.login-bg .login-shape-side,.login-bg .shape-one,.login-bg .shape-two,.login-bg .shape-three{display:none!important}
.login-single-shell{display:block!important;grid-template-columns:1fr!important}
.login-brand-panel{display:none!important}
.login-one-card{margin-inline:auto!important}

.reference-strip-compact{display:inline-flex!important;align-items:center!important;gap:8px!important;width:auto!important;max-width:max-content!important;padding:10px 14px!important;margin:8px 0 16px!important;border-radius:999px!important;background:rgba(46,224,161,.08)!important;border:1px solid rgba(46,224,161,.25)!important}
.reference-strip-compact>span:first-child{font-weight:900;color:#dfece8;font-size:13px}
.info-tip{display:inline-grid;place-items:center;position:relative;width:20px;height:20px;border-radius:50%;border:1px solid rgba(185,208,212,.5);color:#b9d0d4;background:rgba(255,255,255,.07);font-size:12px;font-weight:900;line-height:1;cursor:help;vertical-align:middle;z-index:9}
.info-tip-panel{position:absolute;left:50%;bottom:calc(100% + 10px);transform:translateX(-50%);width:min(430px,88vw);display:block;visibility:hidden;opacity:0;pointer-events:none;background:#111b26;color:#f5fbff;border:1px solid rgba(232,236,233,.18);border-radius:14px;padding:13px 15px;text-align:left;line-height:1.55;font-size:12px;font-weight:700;box-shadow:0 20px 48px rgba(0,0,0,.45);transition:.16s ease}
.info-tip-panel b{display:block;color:#fff;margin-bottom:6px;font-size:13px}
.info-tip:hover .info-tip-panel,.info-tip:focus .info-tip-panel{visibility:visible;opacity:1}
body.rtl .info-tip-panel{text-align:right}
.sag-idea-capture{order:-1;margin-top:0!important;margin-bottom:22px!important}
.sag-idea-rows{display:grid;gap:14px}
.sag-idea-entry{border:1px solid rgba(232,236,233,.12);border-radius:20px;background:rgba(0,0,0,.16);padding:16px}
.sag-idea-head .secondary-btn{width:auto;white-space:nowrap}
.compact-description{font-size:13px!important;margin-top:6px!important}
.sag-topic-field>span{display:flex;align-items:center;gap:6px;color:#dbe9ee;font-weight:900}
.sag-subquestion-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.sag-subquestion textarea{min-height:86px}

.visual-analytics-panel{margin-top:18px}
.dashboard-visual-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.visual-card{border:1px solid rgba(232,236,233,.12);border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.028));padding:18px;min-height:260px;display:flex;flex-direction:column;gap:14px}
.visual-card h3{margin:0;font-size:15px;color:#dce9e7}.visual-bar-row{display:grid;grid-template-columns:48px 1fr 52px;gap:10px;align-items:center;font-size:12px;color:#cddbd8}.visual-bar-track{height:24px;border-radius:8px;background:rgba(232,236,233,.09);overflow:hidden}.visual-bar-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#43a047,#8bc34a)}.donut{width:190px;height:190px;border-radius:50%;align-self:center;display:grid;place-items:center;box-shadow:inset 0 0 0 36px rgba(0,0,0,.26)}.donut span{display:grid;place-items:center;width:110px;height:110px;border-radius:50%;background:rgba(9,20,18,.95);text-align:center}.donut b{font-size:28px}.donut small{color:var(--muted)}.donut-legend{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;color:var(--muted);font-size:12px}.trend-bars{height:190px;display:flex;align-items:flex-end;gap:14px;padding:16px 8px 4px;border-left:1px solid rgba(232,236,233,.10);border-bottom:1px solid rgba(232,236,233,.10)}.trend-col{flex:1;height:100%;display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-direction:column;color:var(--muted);font-size:11px}.trend-col i{width:100%;max-width:38px;border-radius:10px 10px 0 0;background:linear-gradient(180deg,#2ee0a1,#4c8c43)}.visual-best strong{font-size:76px;line-height:1;color:#fff}.visual-best{justify-content:center}.visual-best p{max-width:340px}
body[data-visual-chart-type="bars"] .visual-donut,body[data-visual-chart-type="bars"] .visual-trend{display:none}body[data-visual-chart-type="bars"] .dashboard-visual-grid{grid-template-columns:1fr}.visual-bars{min-height:310px}
body[data-visual-chart-type="donut"] .visual-bars,body[data-visual-chart-type="donut"] .visual-best{display:none}body[data-visual-chart-type="donut"] .dashboard-visual-grid{grid-template-columns:1fr 1fr}
body[data-visual-chart-type="mixed"] .dashboard-visual-grid{grid-template-columns:1.2fr .8fr}
body[data-visual-color-mode="risk"] .visual-bar-track i{background:linear-gradient(90deg,var(--risk-low),var(--risk-medium),var(--risk-high))}
body[data-visual-color-mode="minimal"] .visual-bar-track i,body[data-visual-color-mode="minimal"] .trend-col i{background:rgba(255,255,255,.78)}
body[data-dashboard-layout="focused"] #dashboardView .kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}body[data-dashboard-layout="focused"] #dashboardView .dashboard-grid{grid-template-columns:1fr!important}body[data-dashboard-layout="focused"] #dashboardView .risk-panel-wide{display:none!important}

@media(max-width:1100px){.sag-subquestion-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-visual-grid{grid-template-columns:1fr}.visual-card{min-height:auto}}
@media(max-width:760px){.reference-strip-compact{max-width:100%!important;border-radius:16px!important}.sag-idea-head{flex-direction:column}.sag-idea-head .secondary-btn{width:100%}.sag-subquestion-grid{grid-template-columns:1fr}.info-tip-panel{left:auto;right:0;transform:none}.dashboard-visual-grid{grid-template-columns:1fr!important}.visual-card{padding:15px;border-radius:18px}.donut{width:160px;height:160px}.login-bg .sqs-background-shape{right:-560px!important;width:850px!important;height:850px!important}}


/* v32 audit fix: one approved white shape, real visible Best Practices idea block, working canvas controls */
.login-screen{padding:28px!important;display:grid!important;place-items:center!important;}
.login-bg{background:radial-gradient(circle at 18% 18%,rgba(46,224,161,.10),transparent 28%),linear-gradient(135deg,#020806,#07140f 58%,#020806)!important;}
.login-bg::before,.login-bg .sqs-shape,.login-bg .login-shape-main,.login-bg .login-shape-side,.login-bg .shape-one,.login-bg .shape-two,.login-bg .shape-three,.login-bg .rotating-sgs-mark{display:none!important;content:none!important;}
.login-bg .sqs-background-shape{display:block!important;position:absolute!important;z-index:0!important;width:var(--canvas-shape-size)!important;height:var(--canvas-shape-size)!important;right:var(--canvas-shape-offset-x)!important;top:50%!important;object-fit:contain!important;filter:brightness(0) invert(1) drop-shadow(0 0 24px rgba(255,255,255,.20))!important;opacity:var(--canvas-shape-opacity)!important;mix-blend-mode:screen!important;animation:approvedSingleShapeRotate var(--canvas-shape-speed) linear infinite!important;transform-origin:center center!important;}
.login-single-shell{width:min(var(--canvas-login-width),calc(100vw - 56px))!important;max-width:var(--canvas-login-width)!important;display:block!important;margin:auto!important;position:relative!important;z-index:2!important;}
.login-one-card{width:100%!important;max-width:100%!important;min-height:auto!important;margin:0!important;text-align:center!important;padding:44px clamp(26px,4vw,56px)!important;background:linear-gradient(180deg,rgba(10,28,22,.78),rgba(3,10,8,.86))!important;border:1px solid rgba(255,255,255,.20)!important;box-shadow:0 30px 90px rgba(0,0,0,.52), inset 0 1px 0 rgba(255,255,255,.08)!important;}
.login-one-card label{text-align:left!important}.login-one-card .brand-lockup{justify-content:center!important}.login-title-block h1{font-size:calc(clamp(42px,4.3vw,70px) * var(--canvas-login-title-scale))!important;text-align:center!important;margin-left:auto!important;margin-right:auto!important;max-width:900px!important}.login-title-block .eyebrow{text-align:center!important}.login-one-card #loginSubtitle{text-align:center!important;margin-left:auto!important;margin-right:auto!important}.centered-login-access{justify-content:center!important}.login-card-divider{display:flex!important;align-items:center!important;gap:18px!important;margin:20px 0!important}.login-card-divider:before,.login-card-divider:after{content:"";height:1px;background:rgba(255,255,255,.16);flex:1}.login-card-divider span{color:var(--accent)}
body:not(.auth-locked) .login-bg .sqs-background-shape{display:none!important}
.global-watermark .sqs-background-shape{filter:brightness(0) invert(1) drop-shadow(0 0 18px rgba(255,255,255,.10))!important;mix-blend-mode:screen!important;opacity:calc(var(--canvas-shape-opacity) * .40)!important;}
.sag-idea-capture-host{display:block!important;margin:18px 0 22px!important}.sag-idea-capture{display:block!important;position:relative!important;z-index:2!important}.sag-idea-head{align-items:flex-start!important}.sag-subquestion-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}.sag-subquestion{display:block!important;border:1px solid rgba(255,255,255,.10);border-radius:16px;padding:12px;background:rgba(0,0,0,.16)}.sag-subquestion span,.sag-topic-field span{display:block;font-weight:800;margin-bottom:7px}.sag-subquestion textarea{min-height:74px!important}.sag-topic-field input{width:100%!important}.compact-description{font-size:13px!important;line-height:1.45!important}.info-tip{display:inline-flex;align-items:center;justify-content:center;position:relative;width:18px;height:18px;border-radius:50%;border:1px solid rgba(160,184,190,.55);color:#bed1d4;font-size:11px;margin-left:6px;vertical-align:middle;background:rgba(255,255,255,.05);cursor:help}.info-tip-panel{display:none;position:absolute;left:50%;top:calc(100% + 8px);transform:translateX(-50%);width:min(440px,80vw);z-index:40;background:#101b24;color:#eef6f8;border:1px solid rgba(255,255,255,.18);box-shadow:0 18px 46px rgba(0,0,0,.42);border-radius:12px;padding:13px 14px;text-align:left;font-size:12px;line-height:1.55;font-weight:600}.info-tip:hover .info-tip-panel,.info-tip:focus .info-tip-panel{display:block}.info-tip-panel b{display:block;margin-bottom:6px;color:#fff}.checklist-item-head h3{line-height:1.5}.checklist-item-head p{display:none!important}.canvas-grid{align-items:stretch}.canvas-card input,.canvas-card select{width:100%;margin-top:8px}.canvas-card label{display:block;margin-top:12px}.canvas-actions{margin-top:16px}.canvas-hidden{display:none!important}
body[data-chart-style="compact"] .risk-tile,body[data-chart-style="compact"] .risk-item{min-height:72px!important;padding:10px!important}body[data-chart-style="list"] .risk-heatmap{display:block!important}body[data-chart-style="list"] .risk-stn-card{margin-bottom:14px!important}.dashboard-visual-grid{display:grid;gap:16px;grid-template-columns:repeat(2,minmax(0,1fr))}.visual-card{border:1px solid rgba(255,255,255,.12);border-radius:20px;background:rgba(255,255,255,.045);padding:18px;min-height:220px}.visual-bars .visual-bar-track{height:18px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}.visual-bars .visual-bar-track i{display:block;height:100%;background:linear-gradient(90deg,#147a52,#2ee0a1)}
@media(max-width:760px){.login-single-shell{width:calc(100vw - 28px)!important}.login-one-card{padding:26px 18px!important}.login-title-block h1{font-size:calc(32px * var(--canvas-login-title-scale))!important}.login-bg .sqs-background-shape{right:-610px!important;width:900px!important;height:900px!important;opacity:calc(var(--canvas-shape-opacity) * .62)!important}.sag-subquestion-grid{grid-template-columns:1fr!important}.dashboard-visual-grid{grid-template-columns:1fr!important}.info-tip-panel{left:auto;right:0;transform:none}}


/* v34 LOGIN ACCESS FIX: hidden login screen must win over later professional login layout rules. */
#loginScreen.hidden,
.login-screen.hidden,
body:not(.auth-locked) #loginScreen {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
body:not(.auth-locked) #appScreen:not(.hidden) {
  display: grid !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
@media (max-width: 860px) {
  body:not(.auth-locked) #appScreen:not(.hidden) {
    display: block !important;
  }
}

/* v35: Professional tooltip positioning, editable guidance, and Area visual builder */
.info-tip{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  position:relative!important;
  width:18px!important;
  height:18px!important;
  min-width:18px!important;
  border-radius:999px!important;
  border:1px solid rgba(185,208,212,.72)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.045))!important;
  color:#dcecef!important;
  font-size:11px!important;
  font-weight:950!important;
  line-height:1!important;
  vertical-align:middle!important;
  margin-left:6px!important;
  cursor:help!important;
  z-index:80!important;
}
.info-tip .info-tip-icon{display:block!important;transform:translateY(-.5px)}
.info-tip-panel{
  display:block!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
  position:absolute!important;
  left:50%!important;
  bottom:calc(100% + 12px)!important;
  top:auto!important;
  transform:translateX(-50%) translateY(4px)!important;
  width:min(520px,calc(100vw - 54px))!important;
  max-width:520px!important;
  border-radius:16px!important;
  padding:14px 16px!important;
  background:linear-gradient(180deg,#101923,#071014)!important;
  border:1px solid rgba(232,236,233,.20)!important;
  box-shadow:0 22px 54px rgba(0,0,0,.56),0 0 0 1px rgba(32,201,151,.08) inset!important;
  color:#eef6f8!important;
  text-align:left!important;
  font-size:12px!important;
  line-height:1.58!important;
  font-weight:650!important;
  letter-spacing:0!important;
  z-index:9999!important;
  white-space:normal!important;
}
.info-tip-panel:after{
  content:"";
  position:absolute;
  left:50%;
  top:100%;
  transform:translateX(-50%);
  width:12px;
  height:12px;
  background:#071014;
  border-right:1px solid rgba(232,236,233,.20);
  border-bottom:1px solid rgba(232,236,233,.20);
  rotate:45deg;
}
.info-tip-panel b{display:block!important;color:#fff!important;margin:0 0 7px!important;font-size:13px!important;font-weight:950!important;letter-spacing:.01em!important}
.info-tip-panel span{display:block!important;color:#d8e5e7!important;font-weight:650!important}
.info-tip:hover .info-tip-panel,.info-tip:focus .info-tip-panel,.info-tip:focus-within .info-tip-panel{visibility:visible!important;opacity:1!important;transform:translateX(-50%) translateY(0)!important}
.sag-idea-head h3,.sag-topic-field>span,.checklist-item-head h3{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.reference-strip-compact{display:inline-flex!important;align-items:center!important;gap:7px!important;width:max-content!important;max-width:100%!important;padding:10px 13px!important;line-height:1.25!important}
.reference-strip-compact .info-tip{margin-left:0!important}
body.rtl .info-tip{margin-left:0!important;margin-right:6px!important}
body.rtl .info-tip-panel{text-align:right!important}

.tip-editor textarea{min-height:116px!important;width:100%!important;resize:vertical!important;border-radius:16px!important;padding:12px 14px!important;background:rgba(0,0,0,.23)!important;color:var(--text)!important;border:1px solid rgba(232,236,233,.16)!important;line-height:1.5!important;font-weight:700!important}
.canvas-option-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}.canvas-option-grid .canvas-check{margin:0!important}

#dashboardView .panel-head h2,#dashboardView .panel-head p{transition:.18s ease}
.progress-list.stn-progress-cards{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));align-items:stretch}
.progress-list.stn-progress-executive{grid-template-columns:repeat(auto-fit,minmax(360px,1fr));align-items:stretch}
.stn-visual-card{display:flex!important;flex-direction:column!important;gap:14px!important;min-height:156px!important;justify-content:space-between!important}
.stn-card-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.stn-card-foot{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.stn-card-foot .chip{width:auto!important}
.stn-executive-mode{display:grid!important;grid-template-columns:86px minmax(0,1fr)!important;align-items:center!important;min-height:172px!important}.stn-executive-mode>div:last-child{min-width:0}.stn-ring{width:74px;height:74px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--accent) calc(var(--p)*1%),rgba(255,255,255,.10) 0);position:relative;box-shadow:0 0 0 1px rgba(32,201,151,.22) inset}.stn-ring:before{content:"";position:absolute;inset:8px;border-radius:50%;background:linear-gradient(180deg,rgba(13,29,24,.96),rgba(5,12,10,.96));box-shadow:inset 0 0 18px rgba(0,0,0,.35)}.stn-ring span{position:relative;z-index:1;font-weight:950;color:#fff;font-size:15px}.stn-compact-mode{grid-template-columns:minmax(220px,1.4fr) auto minmax(180px,1fr) auto!important;min-height:58px!important;padding:10px 12px!important;border-radius:16px!important}.stn-compact-mode h3{font-size:14px!important}.stn-compact-mode p{display:none!important}
body[data-stn-progress-card-size="large"] .stn-visual-card{min-height:190px!important;padding:20px!important}body[data-stn-progress-card-size="compact"] .stn-visual-card{min-height:124px!important;padding:12px!important}body[data-stn-progress-card-size="compact"] .stn-ring{width:62px;height:62px}
body[data-stn-progress-style="cards"] .progress-list,body[data-stn-progress-style="executive"] .progress-list{gap:14px!important}
body[data-stn-progress-style="cards"] #dashboardView .wide-panel,body[data-stn-progress-style="executive"] #dashboardView .wide-panel{grid-column:1 / -1!important}

@media(max-width:760px){
  .info-tip-panel{left:auto!important;right:-8px!important;bottom:calc(100% + 12px)!important;transform:none!important;width:min(360px,calc(100vw - 38px))!important}
  .info-tip:hover .info-tip-panel,.info-tip:focus .info-tip-panel,.info-tip:focus-within .info-tip-panel{transform:none!important}
  .info-tip-panel:after{left:auto;right:10px;transform:none}
  .canvas-option-grid{grid-template-columns:1fr!important}.progress-list.stn-progress-cards,.progress-list.stn-progress-executive{grid-template-columns:1fr!important}.stn-executive-mode,.stn-compact-mode{grid-template-columns:1fr!important}.stn-ring{margin-bottom:4px}.stn-card-top{flex-direction:column}.stn-card-foot{display:grid;grid-template-columns:1fr;align-items:stretch}.stn-card-foot .chip{width:100%!important;justify-content:center!important}
}
/* v35 tooltip placement refinement for left-side checklist guidance */
.sag-idea-capture .info-tip-panel,.reference-strip-compact .info-tip-panel{left:0!important;right:auto!important;transform:none!important}
.sag-idea-capture .info-tip:hover .info-tip-panel,.sag-idea-capture .info-tip:focus .info-tip-panel,.reference-strip-compact .info-tip:hover .info-tip-panel,.reference-strip-compact .info-tip:focus .info-tip-panel{transform:none!important}
.sag-idea-capture .info-tip-panel:after,.reference-strip-compact .info-tip-panel:after{left:14px!important;right:auto!important;transform:none!important}
.sag-idea-capture .compact-description{display:none!important}

/* v36 persistent auth + Best Practices integration + finding routing polish */
.finding-route-chip{border:1px solid rgba(255,255,255,.18);cursor:pointer;font:inherit;line-height:1.1;appearance:none}
.finding-route-chip:disabled{cursor:not-allowed;opacity:.82}
.target-chip-wrap{display:flex;align-items:center;gap:8px;min-width:0}
.target-status-square{display:inline-flex;width:14px;height:14px;min-width:14px;border-radius:4px;border:1px solid rgba(255,255,255,.35);box-shadow:0 0 0 3px rgba(255,255,255,.04);vertical-align:middle}
.target-status-square.target-met{background:#27d79b;border-color:#45f0b4;box-shadow:0 0 0 3px rgba(39,215,155,.12)}
.target-status-square.target-miss{background:#f29f22;border-color:#ffd27a;box-shadow:0 0 0 3px rgba(242,159,34,.14)}
.monthly-target-chip{display:inline-flex!important;align-items:center;gap:7px}
.stn-filter-banner{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;padding:12px 14px;border-radius:16px;background:rgba(46,224,161,.08);border:1px solid rgba(46,224,161,.28);color:var(--text)}
.finding-focus-pulse{outline:3px solid rgba(46,224,161,.78)!important;box-shadow:0 0 0 8px rgba(46,224,161,.12),0 24px 70px rgba(0,0,0,.35)!important;animation:findingFocusPulse 1.6s ease-in-out 2}
@keyframes findingFocusPulse{0%,100%{outline-color:rgba(46,224,161,.45)}50%{outline-color:rgba(255,255,255,.96)}}
.sag-evidence-field{display:block;margin-top:12px;padding:12px;border:1px dashed rgba(255,255,255,.16);border-radius:16px;background:rgba(255,255,255,.03)}
.sag-evidence-field input{margin-top:8px!important;width:100%}
.sag-evidence-preview{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin:12px 0}
.sag-evidence-preview figure{margin:0;border:1px solid rgba(255,255,255,.10);border-radius:14px;overflow:hidden;background:rgba(0,0,0,.18)}
.sag-evidence-preview img{width:100%;height:120px;object-fit:cover;display:block}
.sag-evidence-preview figcaption{font-size:11px;color:var(--muted);padding:7px 9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.canvas-card .canvas-actions{display:flex;flex-wrap:wrap;gap:10px}.danger-action{border-color:rgba(255,99,99,.35)!important;color:#ffb6b6!important}


/* v38: mobile login canvas alignment + iOS mailto/autofill safe layout */
@media (max-width: 760px){
  .login-screen{
    min-height:100svh!important;
    padding:calc(10px + env(safe-area-inset-top)) 12px calc(14px + env(safe-area-inset-bottom))!important;
    align-items:center!important;
    justify-items:center!important;
  }
  .login-single-shell{
    width:100%!important;
    max-width:430px!important;
  }
  .login-one-card{
    width:100%!important;
    max-height:calc(100svh - 24px)!important;
    overflow:auto!important;
    border-radius:24px!important;
    padding:20px 17px 18px!important;
    -webkit-overflow-scrolling:touch;
  }
  .login-one-card .company-logo{width:166px!important;max-width:66%!important;margin-top:2px!important;}
  .login-one-card .login-title-block .eyebrow{font-size:9px!important;letter-spacing:.12em!important;margin-top:10px!important;}
  .login-one-card .login-title-block h1{font-size:42px!important;line-height:.98!important;margin:8px auto 8px!important;max-width:100%!important;}
  .login-one-card #loginSubtitle{font-size:13px!important;line-height:1.45!important;margin:10px auto!important;max-width:280px!important;}
  .centered-login-access{font-size:10.5px!important;line-height:1.35!important;max-width:285px!important;margin:8px auto!important;}
  .login-card-divider{margin:10px 0 12px!important;}
  .login-card-divider span{width:24px!important;height:24px!important;font-size:11px!important;}
  .login-card h3{font-size:24px!important;margin:10px 0 15px!important;}
  .login-one-card label{font-size:12px!important;gap:7px!important;}
  .login-one-card label+label{margin-top:12px!important;}
  .login-card input{min-height:45px!important;font-size:15px!important;padding:11px 13px!important;}
  .password-field .password-toggle{width:36px!important;height:36px!important;right:5px!important;}
  .field-instruction{font-size:10px!important;line-height:1.35!important;}
  .login-card .primary-btn{min-height:48px!important;margin-top:14px!important;font-size:15px!important;}
  .login-top-language{top:12px!important;right:12px!important;}
  .login-lang-toggle{min-height:32px!important;font-size:12px!important;}
  .login-bg .sqs-background-shape{right:-690px!important;top:50%!important;width:980px!important;height:980px!important;opacity:calc(var(--canvas-shape-opacity) * .72)!important;}
}
.login-card input:-webkit-autofill,
.login-card input:-webkit-autofill:hover,
.login-card input:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--text)!important;
  caret-color:var(--text)!important;
  box-shadow:0 0 0 1000px rgba(4,12,16,.92) inset!important;
  border-color:rgba(46,224,161,.35)!important;
}

/* v41 refinements: shared findings traceability, mobile tooltip usability, and evidence previews */
.finding-evidence-preview,
.inspection-report-evidence,
.inspection-register-mini{
  display:grid;
  gap:10px;
}
.finding-evidence-preview{
  grid-template-columns:repeat(auto-fit,minmax(130px,1fr));
  margin:12px 0 14px;
}
.finding-evidence-preview figure{
  margin:0;
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  overflow:hidden;
  background:rgba(0,0,0,.18);
}
.finding-evidence-preview img{
  width:100%;
  height:120px;
  display:block;
  object-fit:cover;
}
.finding-evidence-preview figcaption{
  padding:7px 9px;
  font-size:11px;
  color:var(--muted);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.inspection-register-empty{
  text-align:left!important;
  line-height:1.55!important;
}
.inspection-register-mini{
  margin-top:12px;
}
.inspection-mini-card{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto auto;
  gap:10px;
  align-items:center;
  padding:13px 14px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:16px;
  background:rgba(255,255,255,.035);
}
.inspection-mini-card div span{
  display:block;
  margin-top:3px;
  color:var(--muted);
  font-size:12px;
}
.info-tip.info-tip-open .info-tip-panel{
  visibility:visible!important;
  opacity:1!important;
  display:block!important;
  pointer-events:auto!important;
}
.info-tip-panel{
  max-height:min(52vh,420px);
  overflow:auto;
}
@media(max-width:760px){
  .info-tip{width:22px!important;height:22px!important;margin-left:4px!important;z-index:80!important;touch-action:manipulation!important}
  .info-tip-panel{
    position:fixed!important;
    left:14px!important;
    right:14px!important;
    bottom:calc(env(safe-area-inset-bottom,0px) + 18px)!important;
    top:auto!important;
    transform:none!important;
    width:auto!important;
    max-width:none!important;
    max-height:44vh!important;
    border-radius:20px!important;
    padding:16px 17px!important;
    font-size:13px!important;
    line-height:1.6!important;
    box-shadow:0 26px 70px rgba(0,0,0,.58)!important;
    z-index:9999!important;
  }
  .info-tip-panel:after{display:none!important}
  .info-tip-panel b{font-size:14px!important;margin-bottom:8px!important}
  .info-tip-panel span{font-size:13px!important}
  .sag-idea-capture .info-tip-panel,
  .reference-strip-compact .info-tip-panel{left:14px!important;right:14px!important;width:auto!important;transform:none!important}
  .inspection-mini-card{grid-template-columns:1fr;align-items:start}
  .finding-evidence-preview{grid-template-columns:1fr 1fr}
  .finding-evidence-preview img{height:105px}
}


/* v42 refinements: risk heat map hidden, mobile Best Practices question flow, closure activity */
.risk-panel-wide{display:none!important}
.sag-idea-capture-host{margin-top:18px}
.sag-idea-choice-row{display:flex;flex-wrap:wrap;gap:12px;margin:14px 0 8px}.sag-idea-choice-row label{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:16px;padding:12px 14px;background:rgba(232,236,233,.045);font-weight:800}.sag-idea-fields-wrap.hidden{display:none!important}.activity-subtitle{margin:22px 0 10px;font-size:18px}.finding-card .danger-action{border-color:rgba(255,100,100,.35);color:#ffb0b0}.item-ref{white-space:nowrap}
@media(max-width:768px){
  .info-tip{position:relative;display:inline-flex;vertical-align:middle;margin-inline-start:6px}.info-tip-panel{display:none!important}.info-tip.info-tip-open:after,.info-tip.mobile-open:after{content:attr(data-mobile-tip);position:fixed;left:14px;right:14px;bottom:18px;z-index:9999;white-space:pre-wrap;background:rgba(8,18,14,.98);color:#eef6f2;border:1px solid rgba(46,224,161,.45);border-radius:18px;padding:18px 18px 20px;box-shadow:0 18px 55px rgba(0,0,0,.55);font-size:13px;line-height:1.55;text-align:start}.sag-idea-choice-row{display:grid;grid-template-columns:1fr;gap:10px}.sag-idea-capture{padding:14px}.sag-subquestion-grid{grid-template-columns:1fr!important}.checklist-item-head{align-items:flex-start}.item-ref{font-size:11px}.filter-row{width:100%;display:grid;grid-template-columns:1fr}.activity-subtitle{font-size:16px}
}


/* v47: professional visual analytics alignment + mobile Page Canvas usability */
.dashboard-visual-grid{
  grid-template-columns:repeat(2,minmax(360px,1fr));
  align-items:stretch;
}
.visual-card{
  min-height:300px;
  justify-content:flex-start;
  overflow:hidden;
}
.visual-card h3{
  font-size:16px;
  letter-spacing:-.01em;
}
.visual-bars-list,
.visual-area-bars{
  display:grid;
  gap:12px;
  width:100%;
  margin-top:4px;
}
.visual-bar-row{
  grid-template-columns:minmax(52px,145px) 1fr 46px;
  gap:12px;
  min-height:28px;
}
.visual-bar-row>span{
  min-width:0;
  white-space:normal;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  line-height:1.05;
}
.station-bar-row>span{
  font-weight:900;
  letter-spacing:.02em;
  white-space:nowrap;
}
.area-concern-row{
  grid-template-columns:minmax(112px,190px) 1fr 42px;
}
.visual-bar-track{
  height:18px;
  border-radius:999px;
  background:rgba(232,236,233,.105);
}
.visual-bar-track i{
  border-radius:999px;
  min-width:8px;
}
.visual-status-card{
  align-items:center;
  justify-content:space-between;
}
.visual-status-card h3{
  width:100%;
}
.status-donut-wrap{
  position:relative;
  width:210px;
  height:210px;
  display:grid;
  place-items:center;
  margin:4px auto 0;
}
.status-donut-svg{
  width:210px;
  height:210px;
  transform:rotate(-90deg);
  filter:drop-shadow(0 20px 32px rgba(0,0,0,.35));
}
.status-ring-base{
  fill:none;
  stroke:rgba(232,236,233,.10);
  stroke-width:7.4;
}
.status-ring{
  fill:none;
  stroke-width:7.4;
  stroke-linecap:butt;
  transition:stroke-dasharray .25s ease, stroke-dashoffset .25s ease;
}
.status-open{stroke:var(--risk-high)}
.status-closed{stroke:var(--brand)}
.status-voided{stroke:rgba(190,200,200,.70)}
.status-donut-center{
  position:absolute;
  inset:53px;
  border-radius:50%;
  display:grid;
  place-items:center;
  align-content:center;
  background:rgba(5,15,12,.92);
  box-shadow:inset 0 0 0 1px rgba(232,236,233,.08), 0 10px 28px rgba(0,0,0,.35);
  text-align:center;
}
.status-donut-center b{
  font-size:34px;
  line-height:1;
}
.status-donut-center small{
  color:var(--muted);
  margin-top:6px;
}
.status-chip-row{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:8px;
  width:100%;
}
.status-chip{
  border:1px solid rgba(232,236,233,.12);
  background:rgba(255,255,255,.035);
  border-radius:999px;
  padding:7px 10px;
  color:var(--muted);
  font-size:12px;
}
.status-chip b{color:#fff}
.status-chip.open{border-color:rgba(255,93,93,.28)}
.status-chip.closed{border-color:rgba(46,224,161,.28)}
.status-chip.voided{border-color:rgba(190,200,200,.28)}
.visual-area-card .visual-area-bars{
  align-content:start;
}

/* Mobile canvas: larger controls, single-column cards, easier touch operation */
@media(max-width:860px){
  .dashboard-visual-grid{
    grid-template-columns:1fr!important;
    gap:14px;
  }
  .visual-card{
    min-height:auto!important;
    padding:16px!important;
    border-radius:20px!important;
  }
  .visual-bar-row,
  .area-concern-row{
    grid-template-columns:86px 1fr 36px!important;
    gap:8px!important;
    font-size:11px!important;
  }
  .visual-bar-track{
    height:16px!important;
  }
  .status-donut-wrap,
  .status-donut-svg{
    width:174px!important;
    height:174px!important;
  }
  .status-donut-center{
    inset:44px!important;
  }
  .status-donut-center b{
    font-size:28px!important;
  }
  .status-chip-row{
    justify-content:flex-start;
  }

  #canvasControlPanel .professional-canvas-grid,
  #canvasControlPanel .canvas-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:14px!important;
  }
  #canvasControlPanel .canvas-card,
  #canvasControlPanel .canvas-card.span-2{
    grid-column:auto!important;
    padding:16px!important;
    border-radius:20px!important;
  }
  #canvasControlPanel .canvas-card h3{
    font-size:17px!important;
    line-height:1.2!important;
    position:sticky;
    top:72px;
    z-index:2;
    background:linear-gradient(180deg,rgba(8,20,15,.96),rgba(8,20,15,.88));
    border:1px solid rgba(232,236,233,.08);
    border-radius:14px;
    padding:10px 12px;
    margin:-4px -4px 6px;
  }
  #canvasControlPanel .canvas-two-col,
  #canvasControlPanel .canvas-option-grid,
  #canvasControlPanel .sag-subquestion-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:12px!important;
  }
  #canvasControlPanel label,
  #canvasControlPanel .canvas-check{
    font-size:13px!important;
  }
  #canvasControlPanel input,
  #canvasControlPanel select,
  #canvasControlPanel textarea{
    min-height:50px!important;
    font-size:15px!important;
    border-radius:15px!important;
  }
  #canvasControlPanel textarea{
    min-height:118px!important;
  }
  #canvasControlPanel .canvas-range-row{
    display:grid!important;
    grid-template-columns:1fr auto!important;
    align-items:center!important;
    gap:10px!important;
  }
  #canvasControlPanel input[type="range"]{
    min-height:34px!important;
  }
  #canvasControlPanel output{
    min-width:58px;
    text-align:center;
    border:1px solid rgba(232,236,233,.12);
    border-radius:999px;
    padding:7px 9px;
    color:#fff;
    background:rgba(255,255,255,.05);
  }
  #canvasControlPanel .canvas-actions{
    position:sticky;
    bottom:10px;
    z-index:5;
    padding:10px;
    border:1px solid rgba(232,236,233,.10);
    border-radius:18px;
    background:rgba(4,12,9,.92);
    box-shadow:0 16px 38px rgba(0,0,0,.35);
  }
  #canvasControlPanel .canvas-actions button{
    width:100%!important;
    min-height:48px!important;
  }
}

/* v48 advanced Area Progress dashboard: Area map, performance indicators, and mobile graph controls */
:root{
  --stn-map-marker-size:38px;
  --stn-map-glow:.55;
  --stn-map-pulse-speed:6s;
}
.stn-progress-map-card{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(232,236,233,.14);
  border-radius:28px;
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018));
  padding:20px;
  margin:4px 0 18px;
  box-shadow:0 24px 54px rgba(0,0,0,.22);
}
.stn-map-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}
.stn-map-head h3{margin:0;font-size:22px;letter-spacing:-.02em;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.stn-map-head p{margin:5px 0 0;color:var(--muted);font-size:13px;max-width:720px}
.stn-map-legend{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;font-size:11px;color:var(--muted);font-weight:850}
.stn-map-legend span{border:1px solid rgba(232,236,233,.12);border-radius:999px;padding:6px 9px;background:rgba(255,255,255,.035)}
.stn-map-legend .met{color:#74f4c4;border-color:rgba(46,224,161,.35)}
.stn-map-legend .behind{color:#ffc767;border-color:rgba(255,179,54,.35)}
.stn-map-legend .critical{color:#ff9999;border-color:rgba(255,90,90,.35)}
.stn-map-legend .none{color:#ccd6d6;border-color:rgba(220,230,230,.24)}
.stn-map-shell{
  position:relative;
  min-height:520px;
  border-radius:28px;
  border:1px solid rgba(232,236,233,.10);
  background:radial-gradient(circle at 50% 46%,rgba(46,224,161,.12),transparent 34%),linear-gradient(145deg,rgba(3,14,10,.92),rgba(4,11,9,.62));
  overflow:hidden;
  isolation:isolate;
}
.stn-map-shell:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:46px 46px;opacity:.65;z-index:0}
.stn-map-base{position:absolute;inset:5% 7%;width:86%;height:90%;object-fit:contain;filter:brightness(0) invert(1) drop-shadow(0 0 32px rgba(255,255,255,.24));opacity:.20;z-index:1;animation:ksaMapBreath 7s ease-in-out infinite}
@keyframes ksaMapBreath{0%,100%{opacity:.16;filter:brightness(0) invert(1) drop-shadow(0 0 18px rgba(255,255,255,.16))}50%{opacity:.30;filter:brightness(0) invert(1) drop-shadow(0 0 34px rgba(255,255,255,.34))}}
.stn-map-marker{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);width:var(--stn-map-marker-size);height:var(--stn-map-marker-size);border:0;background:transparent;color:#fff;cursor:pointer;z-index:4;display:grid;place-items:center;filter:drop-shadow(0 10px 14px rgba(0,0,0,.45));}
.stn-map-marker:before{content:"";position:absolute;inset:-7px;border-radius:50%;background:rgba(46,224,161,.15);transform:scale(.8);opacity:calc(var(--stn-map-glow));animation:stnPulse var(--stn-map-pulse-speed) ease-in-out infinite;z-index:-1}
@keyframes stnPulse{0%,100%{transform:scale(.78);opacity:calc(var(--stn-map-glow) * .35)}50%{transform:scale(1.55);opacity:calc(var(--stn-map-glow) * .75)}}
.stn-map-donut{position:absolute;inset:0;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--marker-color) calc(var(--p) * 1%),rgba(232,236,233,.16) 0);box-shadow:inset 0 0 0 2px rgba(4,13,10,.85),0 0 0 1px rgba(255,255,255,.12)}
.stn-map-donut:after{content:"";position:absolute;inset:8px;border-radius:50%;background:rgba(4,13,10,.94);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.stn-map-donut b{position:relative;z-index:2;font-size:10px;letter-spacing:.02em;font-weight:1000;line-height:1}
.stn-map-marker.met{--marker-color:#2ee0a1}.stn-map-marker.behind{--marker-color:#ffb336}.stn-map-marker.critical{--marker-color:#ff5d5d}.stn-map-marker.none{--marker-color:#8f9b9b}
.stn-map-label{position:absolute;left:50%;top:calc(100% + 5px);transform:translateX(-50%);font-size:10px;font-weight:950;color:#eafff7;text-shadow:0 2px 10px #000;letter-spacing:.02em;white-space:nowrap}
.stn-map-badge{position:absolute;right:-9px;top:-7px;z-index:5;min-width:18px;height:18px;display:grid;place-items:center;border-radius:999px;background:#ffb336;color:#1b1202;font-size:10px;font-weight:1000;border:1px solid rgba(255,255,255,.35)}
.stn-map-badge.critical{background:#ff5d5d;color:#fff}
.stn-map-target-square{position:absolute;left:-6px;bottom:-6px;width:14px;height:14px;border-radius:5px;border:1px solid rgba(255,255,255,.35);background:#8f9b9b;z-index:5}
.stn-map-target-square.met{background:#2ee0a1}.stn-map-target-square.behind{background:#ffb336}.stn-map-target-square.none{background:#8f9b9b}
.stn-map-detail{margin-top:14px;border:1px solid rgba(232,236,233,.11);border-radius:22px;background:rgba(255,255,255,.035);padding:16px;min-height:70px}
.stn-detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}.stn-detail-head h3{margin:0;font-size:18px}.stn-detail-head p{margin:4px 0 0;color:var(--muted)}
.stn-detail-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.stn-detail-grid span{border:1px solid rgba(232,236,233,.10);border-radius:16px;background:rgba(0,0,0,.18);padding:12px;display:grid;gap:4px}.stn-detail-grid b{font-size:18px}.stn-detail-grid small{color:var(--muted);font-weight:850}
.compact-stn-table-title{display:flex;align-items:end;justify-content:space-between;gap:12px;margin:18px 2px 10px}.compact-stn-table-title h3{margin:0}.compact-stn-table-title p{margin:0;color:var(--muted);font-size:13px}.compact-stn-table-list{display:grid;gap:10px}
.dashboard-visual-grid{grid-template-columns:repeat(4,minmax(260px,1fr));align-items:stretch}.visual-card{min-height:230px}.metric-visual strong{font-size:52px;line-height:1;margin-top:18px}.metric-visual.warning strong{color:#ffcc77}.metric-visual.danger strong{color:#ff9999}.visual-gauge{align-items:center}.quality-gauge{--size:168px;width:var(--size);height:var(--size);border-radius:50%;display:grid;place-items:center;margin:auto;background:conic-gradient(#2ee0a1 calc(var(--p) * 1%),rgba(232,236,233,.12) 0);position:relative}.quality-gauge:after{content:"";position:absolute;inset:16px;border-radius:50%;background:#06120e;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}.quality-gauge span{position:relative;z-index:1;text-align:center;display:grid}.quality-gauge b{font-size:30px}.quality-gauge small{color:var(--muted)}
.forecast-chip-grid{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 14px}.pipeline-flow,.lifecycle-funnel{display:flex;align-items:stretch;gap:10px;flex-wrap:wrap;margin:auto 0}.pipeline-flow span,.lifecycle-funnel span{flex:1 1 140px;border:1px solid rgba(232,236,233,.12);border-radius:18px;background:rgba(255,255,255,.04);padding:14px;text-align:center;color:var(--muted);font-weight:850}.pipeline-flow b,.lifecycle-funnel b{display:block;color:#fff;font-size:26px;margin-top:6px}.pipeline-flow i{width:20px;align-self:center;height:2px;background:rgba(46,224,161,.45);border-radius:99px}.matrix-mini{overflow:auto}.matrix-mini table{width:100%;border-collapse:separate;border-spacing:0 6px;font-size:12px}.matrix-mini th,.matrix-mini td{padding:8px 9px;border:1px solid rgba(232,236,233,.10);background:rgba(255,255,255,.035);text-align:center}.matrix-mini th:first-child{text-align:left}
.visual-card h3 .info-tip,.stn-map-head h3 .info-tip{vertical-align:middle;flex:0 0 auto}
@media(max-width:1180px){.dashboard-visual-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.stn-detail-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.stn-map-shell{min-height:500px}}
@media(max-width:760px){.stn-progress-map-card{padding:14px;border-radius:22px}.stn-map-head{display:grid}.stn-map-legend{justify-content:flex-start}.stn-map-shell{min-height:560px;overflow:auto}.stn-map-base{inset:4% -8%;width:116%;height:92%}.stn-map-marker{width:calc(var(--stn-map-marker-size) * .92);height:calc(var(--stn-map-marker-size) * .92)}.stn-map-label{font-size:9px}.stn-map-detail{position:sticky;bottom:10px;z-index:10;background:rgba(6,18,13,.96);box-shadow:0 -12px 36px rgba(0,0,0,.35)}.stn-detail-head{display:grid}.stn-detail-head .secondary-btn{width:100%}.stn-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.dashboard-visual-grid{grid-template-columns:1fr!important}.visual-card{min-height:auto}.metric-visual strong{font-size:42px}.pipeline-flow i{display:none}.compact-stn-table-title{display:grid}.visual-card h3{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.quality-gauge{--size:148px}}


/* v49 mature Area Progress and finding workflow */
.stn-map-shell{
  width:min(var(--stn-map-stage-width,840px),100%);
  margin:18px auto 0;
  aspect-ratio:1000/824;
  min-height:unset!important;
  height:auto!important;
}
.stn-map-base{
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
}
.stn-map-marker{
  transform:translate(-50%,-50%) scale(.96);
}
.stn-map-label{
  top:calc(100% + 3px);
}
.compact-stn-table-title{
  margin-top:22px;
}
.finding-workflow-action{
  display:grid;
  grid-template-columns:minmax(220px,1fr) auto;
  gap:10px;
  align-items:end;
  border:1px solid rgba(232,236,233,.10);
  border-radius:18px;
  padding:12px;
  margin-top:12px;
  background:rgba(255,255,255,.035);
}
.finding-workflow-action label{
  display:grid;
  gap:6px;
  font-size:12px;
  color:var(--muted);
  font-weight:850;
}
.finding-workflow-action textarea{
  min-height:72px;
  resize:vertical;
}
.rectification-action{
  grid-template-columns:minmax(180px,.75fr) minmax(260px,1fr) auto;
}
.finding-workflow-details{
  margin-top:14px;
  border:1px solid rgba(232,236,233,.10);
  border-radius:18px;
  background:rgba(0,0,0,.16);
  padding:10px 12px;
}
.finding-workflow-details summary{
  cursor:pointer;
  font-weight:950;
  color:#eafff7;
}
.finding-workflow-details h4{
  margin:14px 0 8px;
  font-size:13px;
  color:var(--brand);
}
.finding-workflow-log{
  margin:8px 0 0 20px;
  display:grid;
  gap:10px;
}
.finding-workflow-log li{
  padding:10px 12px;
  border:1px solid rgba(232,236,233,.10);
  border-radius:14px;
  background:rgba(255,255,255,.025);
}
.finding-workflow-log span{
  display:block;
  color:var(--muted);
  font-size:12px;
  margin:3px 0;
}
.finding-evidence-preview{
  margin:10px 0;
}
.finding-evidence-preview figure{
  min-height:110px;
}
.finding-workflow-report article{
  border:1px solid #d9dfdc;
  border-radius:10px;
  padding:12px;
  margin:10px 0;
}
@media(max-width:860px){
  .stn-map-shell{
    width:100%!important;
    max-width:100%!important;
    aspect-ratio:1000/824;
    overflow:auto;
  }
  .stn-map-marker{
    --stn-map-marker-size:30px!important;
  }
  .stn-map-label{
    font-size:8px!important;
  }
  .finding-workflow-action,
  .rectification-action{
    grid-template-columns:1fr!important;
  }
  .finding-card-head{
    align-items:flex-start!important;
  }
}


/* v50 authentication gate: protected shell is not mounted until login */
body.auth-locked #appScreen,
body.auth-locked .app-screen{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}


/* v51 executive map / guidance correction */
.executive-map-card{padding:22px!important;overflow:visible!important}
.executive-map-card .stn-map-head{margin-bottom:12px!important}
.azure-style-map{
  width:min(1120px,100%);
  margin:18px auto 0!important;
  aspect-ratio:1.38/1;
  min-height:0!important;
  height:auto!important;
  border-radius:30px!important;
  background:
    radial-gradient(circle at 52% 44%,rgba(46,224,161,.18),transparent 32%),
    radial-gradient(circle at 18% 82%,rgba(46,224,161,.08),transparent 22%),
    linear-gradient(145deg,rgba(4,18,13,.96),rgba(2,8,7,.72))!important;
  box-shadow:inset 0 0 0 1px rgba(232,236,233,.08),0 24px 65px rgba(0,0,0,.28);
}
.azure-style-map:before{background-size:42px 42px!important;opacity:.55!important}
.azure-style-map .map-glass-layer{position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,rgba(46,224,161,.05),transparent 50%,rgba(255,255,255,.035));z-index:1;pointer-events:none}
.azure-style-map .stn-map-base{inset:4% 6%!important;width:88%!important;height:92%!important;object-fit:contain!important;opacity:.30!important;filter:brightness(0) invert(1) drop-shadow(0 0 18px rgba(255,255,255,.26))!important;z-index:2!important}
.azure-style-map .stn-map-marker{z-index:5!important;--stn-map-marker-size:32px;filter:drop-shadow(0 8px 12px rgba(0,0,0,.55))}
.azure-style-map .stn-map-marker:before{inset:-8px!important;opacity:calc(var(--stn-map-glow) * .55)!important}
.azure-style-map .stn-map-donut{box-shadow:inset 0 0 0 2px rgba(4,13,10,.96),0 0 0 1px rgba(255,255,255,.25),0 0 0 5px rgba(46,224,161,.06)!important}
.azure-style-map .stn-map-donut:after{inset:7px!important;background:rgba(4,13,10,.96)!important}
.azure-style-map .stn-map-donut b{font-size:8.8px!important;letter-spacing:-.02em!important}
.azure-style-map .stn-map-label{display:none!important}
.azure-style-map .stn-map-badge{min-width:16px!important;height:16px!important;font-size:9px!important;right:-7px!important;top:-6px!important}
.azure-style-map .stn-map-target-square{width:11px!important;height:11px!important;left:-5px!important;bottom:-5px!important;border-radius:4px!important}
.azure-style-map .stn-map-marker:hover,.azure-style-map .stn-map-marker:focus{transform:translate(-50%,-50%) scale(1.2)!important;z-index:20!important}
.azure-style-map .stn-map-marker:hover .stn-map-label,.azure-style-map .stn-map-marker:focus .stn-map-label{display:block!important;top:calc(100% + 8px)!important;font-size:10px!important;background:rgba(2,8,7,.88);border:1px solid rgba(232,236,233,.12);border-radius:999px;padding:3px 6px}
.global-info-tip-panel{position:fixed;z-index:99999;max-width:min(460px,calc(100vw - 28px));background:#111b26;color:#f5fbff;border:1px solid rgba(232,236,233,.22);border-radius:18px;padding:16px 18px 17px;box-shadow:0 26px 70px rgba(0,0,0,.55);line-height:1.55;font-size:13px;font-weight:750;text-align:left}.global-info-tip-panel.hidden{display:none!important}.global-info-tip-panel strong{display:block;font-size:15px;margin:0 34px 8px 0;color:#fff}.global-info-tip-panel p{margin:0;color:#e5f0ef}.global-info-close{position:absolute;right:10px;top:8px;width:30px;height:30px;border-radius:999px;border:1px solid rgba(232,236,233,.18);background:rgba(255,255,255,.07);color:#fff;font-size:20px;cursor:pointer}body.rtl .global-info-tip-panel{text-align:right}body.rtl .global-info-tip-panel strong{margin:0 0 8px 34px}body.rtl .global-info-close{right:auto;left:10px}
.visual-card h3 .info-tip,.stn-map-head h3 .info-tip,.panel-head h2 .info-tip{flex:0 0 auto;margin-left:4px;vertical-align:middle}.info-tip-panel{display:none!important}.info-tip{z-index:25!important;overflow:visible!important}.info-tip-icon{display:grid;place-items:center;width:100%;height:100%}
.visual-bar-track i{transition:width .2s ease}.visual-bar-track i[style*="width:0"]{min-width:0!important}
@media(max-width:860px){
  .executive-map-card{padding:14px!important;border-radius:22px!important}
  .stn-map-head{display:grid!important;gap:10px!important}.stn-map-legend{justify-content:flex-start!important}
  .azure-style-map{width:100%!important;aspect-ratio:1/1.05!important;border-radius:22px!important;overflow:hidden!important}
  .azure-style-map .stn-map-marker{--stn-map-marker-size:26px!important}
  .azure-style-map .stn-map-donut b{font-size:7.4px!important}
  .azure-style-map .stn-map-badge{transform:scale(.86)}
  .global-info-tip-panel{left:12px!important;right:12px!important;bottom:16px!important;top:auto!important;width:auto!important;max-height:60vh;overflow:auto;border-radius:20px!important}
  .stn-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}


/* v52: True GeoJSON Area Progress map + controlled guidance modal */
.stn-progress-map-card.executive-map-card{overflow:hidden;}
.geojson-map-shell{
  width:min(1120px,100%)!important;
  aspect-ratio:1000/760!important;
  min-height:unset!important;
  height:auto!important;
  margin:20px auto 0!important;
  border-radius:30px!important;
  background:
    radial-gradient(circle at 35% 50%,rgba(46,224,161,.16),transparent 35%),
    radial-gradient(circle at 62% 46%,rgba(255,255,255,.055),transparent 42%),
    linear-gradient(145deg,rgba(2,10,8,.96),rgba(6,22,16,.72))!important;
  box-shadow:inset 0 0 0 1px rgba(232,236,233,.08),0 28px 80px rgba(0,0,0,.28);
}
.geojson-map-shell:before{background-size:42px 42px!important;opacity:.42!important;}
.ksa-geo-map{position:absolute;inset:0;width:100%;height:100%;z-index:2;overflow:visible;}
.ksa-geo-path{fill:rgba(46,224,161,.035);stroke:rgba(232,236,233,.34);stroke-width:1.45;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 12px rgba(232,236,233,.16));}
.ksa-geo-path.mainland{fill:rgba(46,224,161,.055);stroke:rgba(232,236,233,.45);stroke-width:1.7;}
.ksa-geo-path.island{fill:rgba(46,224,161,.05);stroke:rgba(232,236,233,.25);stroke-width:1.1;}
.geojson-map-shell .map-glass-layer{z-index:3!important;pointer-events:none;background:linear-gradient(90deg,rgba(46,224,161,.06),transparent 45%,rgba(255,255,255,.035))!important;}
.stn-map-marker-layer{position:absolute;inset:0;z-index:6;}
.geojson-map-shell .stn-map-marker{z-index:7!important;width:32px!important;height:32px!important;}
.geojson-map-shell .stn-map-marker:hover,.geojson-map-shell .stn-map-marker:focus{transform:translate(-50%,-50%) scale(1.22)!important;z-index:40!important;}
.geojson-map-shell .stn-map-label{display:none!important;top:calc(100% + 8px)!important;background:rgba(3,10,8,.92);border:1px solid rgba(232,236,233,.16);border-radius:999px;padding:3px 7px;font-size:10px!important;}
.geojson-map-shell .stn-map-marker:hover .stn-map-label,.geojson-map-shell .stn-map-marker:focus .stn-map-label{display:block!important;}
.info-tip{width:22px!important;height:22px!important;min-width:22px!important;border-color:rgba(185,208,212,.72)!important;background:rgba(255,255,255,.10)!important;}
.global-info-tip-panel{
  left:50%!important;top:50%!important;right:auto!important;bottom:auto!important;transform:translate(-50%,-50%)!important;
  width:min(560px,calc(100vw - 34px))!important;max-width:min(560px,calc(100vw - 34px))!important;
  max-height:min(72vh,620px);overflow:auto;border-radius:24px!important;padding:20px 22px 22px!important;
  background:linear-gradient(180deg,rgba(17,27,38,.98),rgba(8,18,22,.98))!important;
  border:1px solid rgba(232,236,233,.22)!important;box-shadow:0 34px 90px rgba(0,0,0,.68)!important;
  font-size:14px!important;line-height:1.62!important;z-index:999999!important;
}
.global-info-tip-panel:before{content:'Guidance';display:inline-flex;margin-bottom:8px;padding:5px 10px;border-radius:999px;background:rgba(46,224,161,.12);color:#8ff5d4;font-size:11px;font-weight:1000;text-transform:uppercase;letter-spacing:.08em;}
.global-info-tip-panel strong{font-size:18px!important;margin-bottom:10px!important;}
.global-info-close{width:34px!important;height:34px!important;}
@media(max-width:860px){
  .geojson-map-shell{width:100%!important;aspect-ratio:1000/760!important;border-radius:22px!important;overflow:hidden!important;}
  .geojson-map-shell .stn-map-marker{width:25px!important;height:25px!important;}
  .geojson-map-shell .stn-map-donut b{font-size:7.2px!important;}
  .geojson-map-shell .stn-map-badge{min-width:15px!important;height:15px!important;font-size:8px!important;}
  .global-info-tip-panel{left:10px!important;right:10px!important;bottom:12px!important;top:auto!important;transform:none!important;width:auto!important;max-width:none!important;max-height:62vh!important;border-radius:22px 22px 18px 18px!important;}
}


/* v53 final guidance and Area popup cleanup */
.info-tip{
  display:inline-grid!important;
  place-items:center!important;
  width:22px!important;
  height:22px!important;
  min-width:22px!important;
  padding:0!important;
  margin:0 0 0 7px!important;
  border-radius:999px!important;
  border:1px solid rgba(208,230,229,.55)!important;
  background:rgba(255,255,255,.075)!important;
  color:#d9eeee!important;
  font-size:12px!important;
  font-weight:950!important;
  line-height:1!important;
  vertical-align:middle!important;
  cursor:pointer!important;
  position:relative!important;
  flex:0 0 auto!important;
  transform:none!important;
}
.info-tip-icon{display:grid!important;place-items:center!important;width:100%!important;height:100%!important;line-height:1!important}
.info-tip-panel{display:none!important}
.stn-map-head h3,
.visual-card h3,
.panel-head h2{
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  flex-wrap:wrap!important;
}
.global-info-tip-panel{
  left:50%!important;
  top:50%!important;
  right:auto!important;
  bottom:auto!important;
  transform:translate(-50%,-50%)!important;
  width:min(560px,calc(100vw - 36px))!important;
  max-height:min(70vh,560px)!important;
  overflow:auto!important;
  background:linear-gradient(180deg,#12202c,#0c151e)!important;
  border:1px solid rgba(168,214,220,.36)!important;
  border-radius:24px!important;
  padding:20px 22px 22px!important;
  box-shadow:0 30px 90px rgba(0,0,0,.62)!important;
}
.global-info-tip-panel .guide-chip{
  display:inline-flex;
  width:max-content;
  border-radius:999px;
  padding:6px 11px;
  margin-bottom:12px;
  color:#6dffd1;
  background:rgba(46,224,161,.12);
  font-size:11px;
  font-weight:950;
  letter-spacing:.05em;
  text-transform:uppercase;
}
.global-info-tip-panel strong{font-size:20px!important;line-height:1.2!important;margin:0 34px 12px 0!important}
.global-info-tip-panel p{font-size:14px!important;line-height:1.72!important;color:#f0f8f7!important;font-weight:800!important}
.stn-map-head p{display:none!important}
.wide-panel .panel-head p:empty{display:none!important}
.stn-map-popup{
  position:absolute;
  z-index:12;
  width:min(320px,calc(100% - 28px));
  transform:translate(-8px,-108%);
  background:linear-gradient(180deg,rgba(15,31,42,.98),rgba(8,18,25,.98));
  color:#f7ffff;
  border:1px solid rgba(173,214,224,.38);
  border-radius:20px;
  padding:15px 16px 14px;
  box-shadow:0 24px 70px rgba(0,0,0,.58);
  backdrop-filter:blur(14px);
}
.stn-map-popup.hidden{display:none!important}
.stn-map-popup:after{
  content:"";
  position:absolute;
  left:22px;
  bottom:-8px;
  width:16px;
  height:16px;
  transform:rotate(45deg);
  background:rgba(8,18,25,.98);
  border-right:1px solid rgba(173,214,224,.32);
  border-bottom:1px solid rgba(173,214,224,.32);
}
.stn-map-popup-close{
  position:absolute;
  right:9px;
  top:8px;
  width:28px;
  height:28px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.08);
  color:#fff;
  font-size:18px;
  font-weight:950;
  cursor:pointer;
}
.stn-map-popup strong{display:block;padding-right:32px;font-size:16px;line-height:1.25}
.stn-map-popup small{display:block;color:#bcd0d0;margin-top:4px;font-weight:800}
.stn-popup-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  margin:12px 0 10px;
}
.stn-popup-grid span{
  border:1px solid rgba(232,236,233,.11);
  border-radius:12px;
  padding:8px 9px;
  background:rgba(255,255,255,.04);
}
.stn-popup-grid b{display:block;font-size:18px}
.stn-popup-grid em{display:block;font-style:normal;color:#bcd0d0;font-size:11px;font-weight:850}
.stn-map-popup p{margin:0 0 10px;color:#eefaf7;font-weight:900}
.stn-popup-actions{display:flex;justify-content:flex-end}
@media(max-width:860px){
  .global-info-tip-panel{
    left:12px!important;
    right:12px!important;
    bottom:14px!important;
    top:auto!important;
    transform:none!important;
    width:auto!important;
    max-height:66vh!important;
    border-radius:22px 22px 18px 18px!important;
  }
  .stn-map-popup{
    position:fixed!important;
    left:12px!important;
    right:12px!important;
    bottom:14px!important;
    top:auto!important;
    width:auto!important;
    transform:none!important;
    max-height:68vh;
    overflow:auto;
  }
  .stn-map-popup:after{display:none!important}
}


/* v54: final Area Progress layout cleanup */
.single-stn-map-card{
  padding:0!important;
  margin-top:14px!important;
  overflow:visible!important;
}
.single-stn-map-card .map-only-head{
  position:absolute;
  top:16px;
  right:18px;
  z-index:16;
  margin:0!important;
  pointer-events:none;
}
.single-stn-map-card .stn-map-legend{
  pointer-events:auto;
}
.single-stn-map-card .stn-map-shell{
  margin:0!important;
  width:100%!important;
}
#stnMapDetail,
.compact-stn-table-title,
.compact-stn-table-list{
  display:none!important;
}
.stn-progress-map-card .stn-map-head h3:empty,
.stn-progress-map-card .stn-map-head > div:first-child:empty{
  display:none!important;
}
.info-tip{
  appearance:none!important;
  -webkit-appearance:none!important;
  box-sizing:border-box!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  width:20px!important;
  height:20px!important;
  min-width:20px!important;
  min-height:20px!important;
  padding:0!important;
  margin:0 0 0 7px!important;
  border-radius:999px!important;
  line-height:1!important;
}
.info-tip-icon{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  height:100%!important;
  line-height:1!important;
  font-size:12px!important;
  font-weight:950!important;
  transform:translateY(-0.5px)!important;
}
body.rtl .info-tip{margin:0 7px 0 0!important}
.stn-map-popup{
  transform:translate(-10px,-104%)!important;
}
.stn-map-popup.popup-below{
  transform:translate(-10px,18px)!important;
}
.stn-map-popup.popup-left{
  transform:translate(calc(-100% + 10px),-104%)!important;
}
.stn-map-popup.popup-left.popup-below{
  transform:translate(calc(-100% + 10px),18px)!important;
}
.stn-map-popup.popup-below:after{
  bottom:auto!important;
  top:-8px!important;
  border-right:0!important;
  border-bottom:0!important;
  border-left:1px solid rgba(173,214,224,.32)!important;
  border-top:1px solid rgba(173,214,224,.32)!important;
}
@media(max-width:860px){
  .single-stn-map-card .map-only-head{
    position:relative!important;
    top:auto!important;
    right:auto!important;
    padding:10px 10px 0!important;
  }
  .single-stn-map-card .stn-map-legend{
    justify-content:flex-start!important;
  }
  .stn-map-popup,
  .stn-map-popup.popup-below,
  .stn-map-popup.popup-left,
  .stn-map-popup.popup-left.popup-below{
    transform:none!important;
  }
}


/* v55 generic portfolio conversion: advanced white/blue theme + credentials card */
:root{
  --bg:#f3f8ff;
  --bg-2:#eaf3ff;
  --panel:#ffffff;
  --panel-2:#f6faff;
  --text:#162234;
  --muted:#5c6c7c;
  --line:rgba(31,78,121,.16);
  --accent:#2b7dff;
  --accent-2:#10c8e8;
  --warning:#d59a24;
  --danger:#d85e58;
  --info:#6576ff;
  --shadow:0 24px 75px rgba(31,78,121,.16);
  --surface-a:rgba(255,255,255,.78);
  --surface-b:rgba(255,255,255,.56);
}
body{background:linear-gradient(135deg,#f7fbff,#eaf4ff 46%,#ffffff);color:var(--text)}
.login-bg{background:radial-gradient(circle at 16% 14%,rgba(43,125,255,.16),transparent 30%),radial-gradient(circle at 84% 12%,rgba(16,200,232,.14),transparent 34%),linear-gradient(135deg,#f7fbff,#eaf4ff 55%,#ffffff)!important}
.login-bg:after{background-image:linear-gradient(rgba(31,78,121,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(31,78,121,.055) 1px,transparent 1px)}
.login-bg .sqs-background-shape,.global-watermark .sqs-background-shape{filter:none!important;mix-blend-mode:multiply;opacity:.18!important;border-radius:50%;animation:sqsRotate 72s linear infinite, lightSweep 4.5s ease-in-out infinite alternate;}
.global-watermark .sqs-background-shape{opacity:.10!important;right:-18vw!important;width:min(1300px,90vw)!important;height:min(1300px,90vw)!important}
@keyframes lightSweep{0%{filter:drop-shadow(0 0 16px rgba(43,125,255,.12)) saturate(100%)}100%{filter:drop-shadow(0 0 36px rgba(16,200,232,.28)) saturate(122%)}}
.login-card,.panel,.kpi-card,.topbar,.summary-card,.finding-card,.checklist-item,.location-row,.risk-item{background:linear-gradient(180deg,rgba(255,255,255,.82),rgba(255,255,255,.64))!important;border-color:rgba(31,78,121,.14)!important;box-shadow:var(--shadow);backdrop-filter:blur(18px) saturate(128%)}
.sidebar{background:rgba(255,255,255,.72)!important;border-right:1px solid rgba(31,78,121,.15);backdrop-filter:blur(22px) saturate(130%)}
.main-content{background:transparent!important}.topbar{background:rgba(255,255,255,.72)!important}.eyebrow{color:var(--accent);letter-spacing:.16em}.muted,.panel-head p,.kpi-card p,.kpi-card small,.summary-card span{color:var(--muted)!important}.nav-btn{color:#4d6075}.nav-btn.active,.nav-btn:hover{background:rgba(43,125,255,.10);border-color:rgba(43,125,255,.25);color:var(--text)}
.primary-btn{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff}.secondary-btn,.ghost-btn,.logout-btn,.table-action{background:rgba(255,255,255,.72);border-color:rgba(31,78,121,.16);color:var(--text)}
.login-card input,.form-grid input,.form-grid select,.form-grid textarea,.mini-select,.checklist-item textarea.item-note{background:rgba(255,255,255,.76)!important;color:var(--text)!important;border-color:rgba(31,78,121,.16)!important}.login-card input:focus,.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus,.mini-select:focus{border-color:rgba(43,125,255,.55)!important;box-shadow:0 0 0 4px rgba(43,125,255,.10)!important}
.company-logo{filter:none!important;opacity:1!important}.brand-lockup.compact .company-logo,.mobile-bar-logo{width:220px;height:auto;max-height:58px}.login-logo-row .company-logo{width:min(360px,88vw);height:auto}.app-screen{background:linear-gradient(135deg,#f7fbff,#eaf4ff 48%,#ffffff)!important}
.demo-credential-card{margin-top:18px;padding:16px;border:1px solid rgba(31,78,121,.16);border-radius:18px;background:rgba(255,255,255,.66)}.demo-credential-card h4{margin:0 0 4px;font-size:15px}.demo-credential-card p{margin:0 0 12px;color:var(--muted);font-size:12px}.credential-grid{display:grid;gap:8px}.credential-chip{width:100%;text-align:left;padding:10px 12px;border-radius:14px;background:rgba(43,125,255,.08);border:1px solid rgba(43,125,255,.16);color:var(--text);font-weight:800}.credential-chip span{display:block;font-size:11px;color:var(--muted);font-weight:700;margin-top:2px}.credential-chip:hover{background:rgba(43,125,255,.15)}
.guideline-official-link{display:inline-flex;align-items:center;padding:8px 10px;border-radius:999px;background:rgba(43,125,255,.09);border:1px solid rgba(43,125,255,.18);color:#1c64d8;text-decoration:none;font-weight:800}.guideline-official-link:hover{background:rgba(43,125,255,.16)}
.chip.green{color:#086c4d;border-color:rgba(8,108,77,.24);background:rgba(14,163,117,.08)}.chip.blue{color:#1c64d8;border-color:rgba(43,125,255,.25);background:rgba(43,125,255,.08)}.chip.yellow{color:#a66d0d;border-color:rgba(213,154,36,.28);background:rgba(213,154,36,.10)}.chip.red{color:#b6403b;border-color:rgba(216,94,88,.28);background:rgba(216,94,88,.10)}
.heat-cell,.heatmap-stn-card,.heatmap-function-cell{background:rgba(255,255,255,.72)!important;border-color:rgba(31,78,121,.14)!important}.heat-high{background:rgba(216,94,88,.22)!important}.heat-med{background:rgba(213,130,36,.20)!important}.heat-yellow{background:rgba(213,154,36,.16)!important}.heat-green{background:rgba(14,163,117,.14)!important}
@media(max-width:760px){.login-card{width:100%;max-width:520px}.login-shell{grid-template-columns:1fr}.demo-credential-card{padding:14px}.credential-chip{font-size:13px}.global-watermark .sqs-background-shape{right:-80vw!important;width:900px!important;height:900px!important;opacity:.08!important}}

/* v56 OSIP professional light-blue portfolio theme — visual layer only, no logic/resource changes */
:root{
  --bg:#f4f9ff!important;
  --bg-2:#eef7ff!important;
  --panel:rgba(255,255,255,.72)!important;
  --panel-2:rgba(246,251,255,.62)!important;
  --text:#132238!important;
  --muted:#5b6f84!important;
  --line:rgba(31,78,121,.14)!important;
  --accent:#2b7dff!important;
  --accent-2:#10c8e8!important;
  --warning:#d58f22!important;
  --danger:#d85e58!important;
  --info:#5668ff!important;
  --surface-a:rgba(255,255,255,.78)!important;
  --surface-b:rgba(238,247,255,.58)!important;
  --shadow:0 22px 58px rgba(30,82,128,.14)!important;
}
html,body{
  background:#f4f9ff!important;
  color:var(--text)!important;
}
body,
.login-bg,
.app-screen{
  background:
    radial-gradient(circle at 16% 12%, rgba(16,200,232,.22), transparent 28%),
    radial-gradient(circle at 86% 8%, rgba(43,125,255,.18), transparent 34%),
    linear-gradient(135deg,#f8fcff 0%,#edf7ff 48%,#f6fbff 100%)!important;
}
.login-bg:after,
.main-content:before{
  background-image:
    linear-gradient(rgba(31,78,121,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(31,78,121,.045) 1px,transparent 1px)!important;
  opacity:.65!important;
}
.login-bg .sqs-background-shape,
.global-watermark .sqs-background-shape{
  filter:drop-shadow(0 0 32px rgba(43,125,255,.22))!important;
  mix-blend-mode:multiply!important;
  opacity:.18!important;
  animation:approvedSingleShapeRotate 82s linear infinite!important;
}
.login-bg .sqs-background-shape{width:min(1200px,94vw)!important;height:min(1200px,94vw)!important;right:-18vw!important;top:50%!important;}
.global-watermark .sqs-background-shape{width:min(1400px,92vw)!important;height:min(1400px,92vw)!important;right:-22vw!important;top:48%!important;opacity:.15!important;}
.company-watermark{display:none!important;}
.login-card,
.login-brand-panel,
.panel,
.kpi-card,
.topbar,
.sidebar-note,
.program-identity,
.visual-card,
.canvas-card,
.finding-card,
.checklist-item,
.check-item,
.location-row,
.risk-item,
.heatmap-stn-card,
.heatmap-function-cell,
.heat-cell,
.summary-card,
.guideline-page-panel,
.guideline-library-section,
.publication-card,
.sag-idea-capture,
.sag-subquestion,
.sag-topic-field,
.stn-progress-map-card,
.geojson-map-shell,
.stn-map-detail,
.data-table td,
.info-tip-panel{
  background:linear-gradient(180deg,rgba(255,255,255,.80),rgba(246,251,255,.58))!important;
  border-color:rgba(31,78,121,.14)!important;
  color:var(--text)!important;
  box-shadow:0 20px 54px rgba(30,82,128,.12)!important;
  backdrop-filter:blur(18px) saturate(130%)!important;
}
.login-card,
.panel,
.kpi-card,
.topbar,
.stn-progress-map-card,
.geojson-map-shell{
  border-radius:26px!important;
}
.sidebar{
  background:rgba(255,255,255,.74)!important;
  border-right:1px solid rgba(31,78,121,.13)!important;
  box-shadow:12px 0 42px rgba(30,82,128,.10)!important;
  backdrop-filter:blur(18px) saturate(140%)!important;
}
.sidebar *{color:var(--text);}
.nav-btn{
  color:#50667d!important;
  background:transparent!important;
  border-color:transparent!important;
}
.nav-btn.active,
.nav-btn:hover{
  color:#10243b!important;
  background:linear-gradient(180deg,rgba(43,125,255,.12),rgba(16,200,232,.08))!important;
  border-color:rgba(43,125,255,.26)!important;
  box-shadow:0 10px 26px rgba(43,125,255,.10)!important;
}
.logo-only .company-logo,
.company-logo,
.mobile-bar-logo{
  filter:none!important;
  opacity:1!important;
}
.brand-lockup.compact{border-bottom:0!important;}
.program-identity h2::before{content:'Your Company Logo';display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#2b7dff;margin-bottom:6px;}
.program-identity h2{font-size:15px!important;color:#10243b!important;}
.program-identity p{color:#5b6f84!important;}
.eyebrow,
.login-title-block .eyebrow,
.topbar .eyebrow{
  color:#2b7dff!important;
}
h1,h2,h3,h4,strong,b,label,.login-card h3,.panel-head h2,.kpi-card strong,.kpi-card p,.visual-card h3{
  color:#132238!important;
}
.muted,.hint,small,.panel-head p,.kpi-card small,.location-row p,.data-table th,.field-instruction,.login-card-head p,
.publication-card p,.guideline-library-section p,.visual-card p,.sag-subquestion span,.sag-topic-field span{
  color:#5b6f84!important;
}
.login-card input,
.form-grid input,
.form-grid select,
.form-grid textarea,
.mini-select,
textarea,
input,
select{
  background:rgba(255,255,255,.86)!important;
  color:#132238!important;
  border-color:rgba(31,78,121,.16)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7)!important;
}
.login-card input::placeholder,
.form-grid input::placeholder,
.form-grid textarea::placeholder,
input::placeholder,
textarea::placeholder{color:#8393a4!important;}
.password-toggle{color:#5d7084!important;background:rgba(31,78,121,.06)!important;border-color:rgba(31,78,121,.12)!important;}
.primary-btn{
  color:#fff!important;
  background:linear-gradient(135deg,#2b7dff,#10c8e8)!important;
  box-shadow:0 14px 30px rgba(43,125,255,.20)!important;
}
.secondary-btn,.ghost-btn,.logout-btn,.table-action{
  background:rgba(255,255,255,.78)!important;
  color:#132238!important;
  border-color:rgba(31,78,121,.15)!important;
  box-shadow:0 10px 24px rgba(30,82,128,.08)!important;
}
.access-badge{
  color:#11395b!important;
  background:linear-gradient(180deg,rgba(43,125,255,.10),rgba(16,200,232,.08))!important;
  border-color:rgba(43,125,255,.22)!important;
}
.status-dot{background:#2b7dff!important;box-shadow:0 0 18px rgba(43,125,255,.5)!important;}
.bar,.progress-track,.visual-bar-track{background:rgba(31,78,121,.10)!important;}
.bar span,.progress-track span,.visual-bar-track i{background:linear-gradient(90deg,#2b7dff,#10c8e8)!important;}
.chip,
.chip.green,
.chip.blue,
.chip.yellow,
.chip.red,
.finding-route-chip{
  background:rgba(255,255,255,.74)!important;
  color:#36536d!important;
  border-color:rgba(31,78,121,.17)!important;
}
.chip.green{color:#087e72!important;border-color:rgba(8,126,114,.24)!important;background:rgba(16,200,232,.08)!important;}
.chip.blue{color:#1d64d8!important;border-color:rgba(43,125,255,.25)!important;background:rgba(43,125,255,.08)!important;}
.chip.yellow{color:#9a6410!important;border-color:rgba(213,143,34,.28)!important;background:rgba(213,143,34,.10)!important;}
.chip.red{color:#b6403b!important;border-color:rgba(216,94,88,.28)!important;background:rgba(216,94,88,.10)!important;}
/* Area Progress map must not remain dark green */
.stn-progress-map-card,
.geojson-map-shell,
.stn-map-shell,
.stn-map-base,
.map-glass-layer{
  background:
    radial-gradient(circle at 20% 15%,rgba(16,200,232,.16),transparent 28%),
    radial-gradient(circle at 80% 25%,rgba(43,125,255,.13),transparent 34%),
    linear-gradient(135deg,rgba(255,255,255,.72),rgba(232,245,255,.48))!important;
  border-color:rgba(31,78,121,.15)!important;
}
.geojson-map-shell:before,
.stn-map-shell:before{
  background-image:
    linear-gradient(rgba(31,78,121,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(31,78,121,.045) 1px,transparent 1px)!important;
  opacity:.6!important;
}
.ksa-geo-path,
.ksa-geo-path.mainland,
.ksa-geo-path.island{
  fill:rgba(43,125,255,.05)!important;
  stroke:rgba(43,125,255,.26)!important;
}
.stn-map-marker,.area-map-marker{filter:drop-shadow(0 0 14px rgba(43,125,255,.24))!important;}
.stn-map-label{background:rgba(255,255,255,.88)!important;color:#132238!important;border-color:rgba(43,125,255,.18)!important;}
.stn-map-detail{background:rgba(255,255,255,.88)!important;color:#132238!important;}
.risk-heatmap,.heatmap-grid,.heatmap-function-grid{background:transparent!important;color:#132238!important;}
.heat-high{background:rgba(216,94,88,.16)!important;border-color:rgba(216,94,88,.26)!important;}
.heat-med{background:rgba(203,121,30,.14)!important;border-color:rgba(203,121,30,.24)!important;}
.heat-yellow{background:rgba(213,143,34,.12)!important;border-color:rgba(213,143,34,.22)!important;}
.heat-green{background:rgba(16,200,232,.12)!important;border-color:rgba(16,200,232,.22)!important;}
.matrix-table th:first-child,.matrix-table td:first-child{background:rgba(255,255,255,.92)!important;color:#132238!important;}
.matrix-table th,.matrix-table td{border-color:rgba(31,78,121,.14)!important;color:#132238!important;}
.quality-gauge:after,.donut span{background:rgba(255,255,255,.90)!important;color:#132238!important;}
.quality-gauge{filter:drop-shadow(0 18px 42px rgba(43,125,255,.12));}
.demo-credential-card,.credential-chip{
  background:rgba(255,255,255,.72)!important;
  border-color:rgba(31,78,121,.14)!important;
  color:#132238!important;
}
.credential-chip span{color:#5b6f84!important;}
.mobile-app-bar{
  background:rgba(255,255,255,.84)!important;
  border-color:rgba(31,78,121,.14)!important;
  color:#132238!important;
  backdrop-filter:blur(18px) saturate(140%)!important;
}
.mobile-menu-btn{background:rgba(43,125,255,.10)!important;color:#132238!important;border-color:rgba(43,125,255,.18)!important;}
.toast{background:#ffffff!important;color:#132238!important;border-color:rgba(31,78,121,.16)!important;box-shadow:0 20px 44px rgba(30,82,128,.16)!important;}
@media(max-width:860px){
  .global-watermark .sqs-background-shape{right:-54vw!important;width:980px!important;height:980px!important;opacity:.12!important;}
  .login-bg .sqs-background-shape{right:-66vw!important;width:900px!important;height:900px!important;opacity:.12!important;}
  .sidebar{background:rgba(255,255,255,.92)!important;}
  .main-content{background:transparent!important;}
}

/* v57 OSIP dark navy risk-matrix canvas: visual-only refinement, logic preserved */
:root{
  --bg:#06111c!important;
  --bg-2:#0a1625!important;
  --panel:rgba(255,255,255,.075)!important;
  --panel-2:rgba(255,255,255,.11)!important;
  --text:#f7fbff!important;
  --muted:#c8d5e3!important;
  --line:rgba(255,255,255,.20)!important;
  --accent:#6fd6ff!important;
  --accent-2:#ffffff!important;
  --warning:#ffd166!important;
  --danger:#ff6b6b!important;
  --shadow:0 28px 80px rgba(0,0,0,.34)!important;
  --surface-a:rgba(255,255,255,.105)!important;
  --surface-b:rgba(255,255,255,.045)!important;
}
html,body{background:#06111c!important;color:var(--text)!important;}
body,
.login-bg,
.app-screen{
  background:
    radial-gradient(circle at 12% 12%,rgba(111,214,255,.18),transparent 30%),
    radial-gradient(circle at 92% 4%,rgba(255,255,255,.09),transparent 28%),
    radial-gradient(circle at 58% 98%,rgba(46,133,255,.12),transparent 36%),
    linear-gradient(135deg,#06111c 0%,#0a1625 46%,#04101b 100%)!important;
}
.login-bg:after,
.main-content:before{
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px)!important;
  opacity:.45!important;
}
.login-bg .sqs-background-shape,
.global-watermark .sqs-background-shape{
  filter:brightness(0) invert(1) drop-shadow(0 0 34px rgba(255,255,255,.42)) drop-shadow(0 0 78px rgba(111,214,255,.22))!important;
  mix-blend-mode:screen!important;
  opacity:.18!important;
  animation:approvedSingleShapeRotate 82s linear infinite!important;
}
.global-watermark .sqs-background-shape{opacity:.13!important;right:-18vw!important;top:48%!important;width:min(1420px,92vw)!important;height:min(1420px,92vw)!important;}
.login-bg .sqs-background-shape{opacity:.20!important;right:-18vw!important;top:50%!important;width:min(1200px,94vw)!important;height:min(1200px,94vw)!important;}
.main-content{background:transparent!important;}
.login-card,
.login-brand-panel,
.panel,
.kpi-card,
.topbar,
.sidebar-note,
.program-identity,
.visual-card,
.canvas-card,
.finding-card,
.checklist-item,
.check-item,
.location-row,
.risk-item,
.heatmap-area-card,
.heatmap-station-card,
.heatmap-cell,
.summary-card,
.guideline-page-panel,
.guideline-library-section,
.publication-card,
.sag-idea-capture,
.sag-subquestion,
.sag-topic-field,
.stn-progress-map-card,
.geojson-map-shell,
.stn-map-detail,
.data-table td,
.demo-credential-card,
.credential-chip{
  background:linear-gradient(180deg,rgba(255,255,255,.125),rgba(255,255,255,.055))!important;
  border:1px solid rgba(255,255,255,.20)!important;
  color:var(--text)!important;
  box-shadow:0 22px 70px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.10)!important;
  backdrop-filter:blur(18px) saturate(140%)!important;
}
.panel,.kpi-card,.topbar,.login-card,.stn-progress-map-card,.geojson-map-shell{border-radius:26px!important;}
.sidebar{
  background:rgba(3,11,18,.76)!important;
  border-right:1px solid rgba(255,255,255,.16)!important;
  box-shadow:12px 0 42px rgba(0,0,0,.28)!important;
  backdrop-filter:blur(20px) saturate(145%)!important;
}
.sidebar *{color:var(--text)!important;}
.nav-btn{color:rgba(247,251,255,.74)!important;background:transparent!important;border-color:transparent!important;}
.nav-btn.active,.nav-btn:hover{color:#fff!important;background:linear-gradient(180deg,rgba(111,214,255,.20),rgba(255,255,255,.07))!important;border-color:rgba(111,214,255,.38)!important;box-shadow:0 0 0 1px rgba(255,255,255,.04),0 16px 36px rgba(111,214,255,.12)!important;}
.program-identity h2::before{content:'Your Company Logo';display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#dff7ff!important;margin-bottom:6px;}
.program-identity h2,.program-identity p{color:#f7fbff!important;}
.eyebrow,.login-title-block .eyebrow,.topbar .eyebrow{color:#7ce2ff!important;}
h1,h2,h3,h4,strong,b,label,.login-card h3,.panel-head h2,.kpi-card strong,.kpi-card p,.visual-card h3,.data-table th{color:#f9fcff!important;}
.muted,.hint,small,.panel-head p,.kpi-card small,.location-row p,.data-table th,.field-instruction,.login-card-head p,.publication-card p,.guideline-library-section p,.visual-card p,.sag-subquestion span,.sag-topic-field span{color:rgba(232,242,250,.78)!important;}
.login-card input,.form-grid input,.form-grid select,.form-grid textarea,.mini-select,textarea,input,select{
  background:rgba(3,12,20,.64)!important;
  color:#f7fbff!important;
  border-color:rgba(255,255,255,.20)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06)!important;
}
.login-card input::placeholder,.form-grid input::placeholder,.form-grid textarea::placeholder,input::placeholder,textarea::placeholder{color:rgba(232,242,250,.50)!important;}
.password-toggle{color:#dff7ff!important;background:rgba(255,255,255,.08)!important;border-color:rgba(255,255,255,.18)!important;}
.primary-btn{color:#06111c!important;background:linear-gradient(135deg,#ffffff,#7ce2ff 48%,#4aa8ff)!important;box-shadow:0 18px 40px rgba(111,214,255,.22)!important;}
.secondary-btn,.ghost-btn,.logout-btn,.table-action{background:rgba(255,255,255,.095)!important;color:#f9fcff!important;border-color:rgba(255,255,255,.20)!important;box-shadow:0 12px 30px rgba(0,0,0,.22)!important;}
.access-badge{color:#f7fbff!important;background:linear-gradient(180deg,rgba(111,214,255,.18),rgba(255,255,255,.07))!important;border-color:rgba(111,214,255,.38)!important;}
.status-dot{background:#ffffff!important;box-shadow:0 0 22px rgba(255,255,255,.80),0 0 42px rgba(111,214,255,.42)!important;}
.bar,.progress-track,.visual-bar-track{background:rgba(255,255,255,.14)!important;}
.bar span,.progress-track span,.visual-bar-track i{background:linear-gradient(90deg,#7ce2ff,#ffffff)!important;}
.chip,.chip.green,.chip.blue,.chip.yellow,.chip.red,.finding-route-chip{background:rgba(255,255,255,.10)!important;color:#eff9ff!important;border-color:rgba(255,255,255,.18)!important;}
.chip.green{color:#8ff5d4!important;border-color:rgba(143,245,212,.34)!important;background:rgba(143,245,212,.10)!important;}
.chip.blue{color:#8edcff!important;border-color:rgba(142,220,255,.34)!important;background:rgba(142,220,255,.10)!important;}
.chip.yellow{color:#ffe39b!important;border-color:rgba(255,225,132,.34)!important;background:rgba(255,225,132,.10)!important;}
.chip.red{color:#ffaaa6!important;border-color:rgba(255,114,114,.38)!important;background:rgba(255,114,114,.12)!important;}
/* Area Progress map on dark OSIP canvas */
.stn-progress-map-card,.geojson-map-shell,.stn-map-shell,.stn-map-base,.map-glass-layer{
  background:
    radial-gradient(circle at 22% 22%,rgba(111,214,255,.18),transparent 30%),
    radial-gradient(circle at 84% 20%,rgba(255,255,255,.10),transparent 34%),
    linear-gradient(135deg,rgba(255,255,255,.105),rgba(255,255,255,.045))!important;
  border-color:rgba(255,255,255,.20)!important;
}
.geojson-map-shell:before,.stn-map-shell:before{background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px)!important;opacity:.5!important;}
.ksa-geo-path,.ksa-geo-path.mainland,.ksa-geo-path.island{fill:rgba(255,255,255,.04)!important;stroke:rgba(124,226,255,.22)!important;}
.stn-map-label{background:rgba(6,17,28,.82)!important;color:#fff!important;border-color:rgba(255,255,255,.22)!important;}
/* Risk matrix / heat map clarity */
.osip-risk-map-panel{margin-top:16px!important;}
.risk-heatmap,.heatmap-grid,.heatmap-function-grid{background:transparent!important;color:#f7fbff!important;}
.heatmap-note{background:rgba(255,255,255,.08)!important;color:rgba(247,251,255,.82)!important;border:1px solid rgba(255,255,255,.15)!important;border-radius:18px!important;padding:14px!important;}
.heatmap-area-head{background:rgba(2,10,18,.56)!important;color:#fff!important;border-color:rgba(255,255,255,.18)!important;}
.heatmap-cell{min-height:112px!important;display:flex!important;flex-direction:column!important;justify-content:space-between!important;}
.heatmap-cell span{color:#f7fbff!important;font-weight:900!important;}
.heatmap-cell b{display:flex!important;gap:8px!important;align-items:center!important;justify-content:center!important;font-size:26px!important;color:#fff!important;}
.heatmap-cell b em{font-style:normal;background:rgba(255,255,255,.14);border-radius:12px;padding:3px 8px;}
.heatmap-cell small{color:rgba(247,251,255,.80)!important;}
.heat-high{background:linear-gradient(180deg,rgba(255,76,76,.34),rgba(255,76,76,.18))!important;border-color:rgba(255,93,93,.42)!important;}
.heat-med{background:linear-gradient(180deg,rgba(255,163,68,.28),rgba(255,163,68,.13))!important;border-color:rgba(255,184,94,.34)!important;}
.heat-yellow{background:linear-gradient(180deg,rgba(255,214,102,.24),rgba(255,214,102,.11))!important;border-color:rgba(255,225,132,.32)!important;}
.heat-low,.heat-green{background:linear-gradient(180deg,rgba(83,229,174,.22),rgba(83,229,174,.09))!important;border-color:rgba(83,229,174,.30)!important;}
.heat-none{background:rgba(255,255,255,.055)!important;border-color:rgba(255,255,255,.14)!important;}
.heatmap-legend span{color:rgba(247,251,255,.82)!important;}
.risk-matrix-table-wrap{background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,255,255,.14)!important;border-radius:18px!important;padding:10px!important;}
.risk-ref-table th,.risk-ref-table td,.matrix-table th,.matrix-table td{border-color:rgba(255,255,255,.16)!important;color:#f7fbff!important;background:rgba(255,255,255,.06)!important;}
.matrix-table th:first-child,.matrix-table td:first-child{background:rgba(255,255,255,.10)!important;color:#fff!important;}
/* Risk controls inside checklist */
.risk-matrix-control-row{display:grid;grid-template-columns:minmax(230px,1fr) minmax(360px,1.45fr) minmax(300px,1fr);gap:14px;margin:14px 0 12px;padding:14px;border-radius:18px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.07);align-items:end;}
.risk-matrix-control-row label{font-size:12px!important;color:rgba(247,251,255,.86)!important;display:flex!important;flex-direction:column!important;gap:7px!important;font-weight:850!important;}
.risk-select{min-height:46px!important;border-radius:13px!important;width:100%!important;}
.risk-matrix-mini-ref{display:flex;align-items:center;justify-content:center;padding:12px 14px;border-radius:14px;background:linear-gradient(180deg,rgba(124,226,255,.16),rgba(255,255,255,.06));border:1px solid rgba(124,226,255,.24);font-size:12px;font-weight:950;color:#f8fdff;text-align:center;min-height:46px;align-self:end;}
/* Graphs: stronger intelligent risk-level visuals */
.dashboard-visual-grid{gap:18px!important;}
.visual-card{min-height:220px!important;}
.visual-bar-row{grid-template-columns:minmax(130px,.7fr) 1fr 46px!important;gap:12px!important;margin:10px 0!important;}
.visual-bar-row span{color:rgba(247,251,255,.84)!important;font-weight:800!important;}
.visual-bar-row b{color:#fff!important;text-align:right!important;}
.visual-bar-row.risk-high-bar .visual-bar-track i{background:linear-gradient(90deg,#ff5f5f,#ffb0a8)!important;box-shadow:0 0 18px rgba(255,95,95,.22)!important;}
.visual-bar-row.risk-medium-bar .visual-bar-track i{background:linear-gradient(90deg,#ffd166,#ff9f43)!important;box-shadow:0 0 18px rgba(255,209,102,.20)!important;}
.visual-bar-row.risk-low-bar .visual-bar-track i{background:linear-gradient(90deg,#5df2c2,#7ce2ff)!important;box-shadow:0 0 18px rgba(93,242,194,.16)!important;}
.quality-gauge:after,.donut span,.status-donut-center{background:rgba(6,17,28,.92)!important;color:#fff!important;}
.quality-gauge{filter:drop-shadow(0 18px 42px rgba(124,226,255,.16));}
.status-ring-base{stroke:rgba(255,255,255,.16)!important;}
.status-open{stroke:#ff5f5f!important}.status-closed{stroke:#5df2c2!important}.status-voided{stroke:rgba(255,255,255,.35)!important}
/* Guidance modal: no duplicate GUIDANCE and transparent white card with white text */
.global-info-tip-panel:before{content:none!important;display:none!important;}
.global-info-tip-panel{background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.08))!important;border:1px solid rgba(255,255,255,.26)!important;box-shadow:0 30px 90px rgba(0,0,0,.50), inset 0 1px 0 rgba(255,255,255,.16)!important;backdrop-filter:blur(20px) saturate(140%)!important;color:#fff!important;}
.global-info-tip-panel .guide-chip{background:rgba(255,255,255,.14)!important;color:#fff!important;border:1px solid rgba(255,255,255,.20)!important;}
.global-info-tip-panel strong,.global-info-tip-panel p{color:#fff!important;}
.global-info-close{background:rgba(255,255,255,.12)!important;border-color:rgba(255,255,255,.22)!important;color:#fff!important;}
@media(max-width:860px){
  .sidebar{background:rgba(3,11,18,.92)!important;}
  .main-content{background:transparent!important;}
  .panel,.kpi-card{background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.055))!important;}
  .risk-matrix-control-row{grid-template-columns:1fr!important;}
  .global-watermark .sqs-background-shape{right:-52vw!important;width:980px!important;height:980px!important;opacity:.12!important;}
}


/* v58 final OSIP risk governance refinements: mobile-safe visual layer only */
.login-title-block .eyebrow{display:none!important;}
.login-logo-row .company-logo,.brand-lockup .company-logo,.mobile-bar-logo{filter:none!important;}
.topbar .eyebrow{display:none!important;}
.program-identity h2::before{content:''!important;display:none!important;}
.program-identity h2{font-size:15px!important;line-height:1.25!important;color:#ffffff!important;}
.program-identity p{color:rgba(232,242,250,.74)!important;}
.login-title-block h1{color:#ffffff!important;}
.login-title-block + .muted,#loginSubtitle{color:rgba(232,242,250,.74)!important;}
.login-bg .sqs-background-shape,.global-watermark .sqs-background-shape{
  filter:brightness(0) invert(1) drop-shadow(0 0 22px rgba(255,255,255,.72)) drop-shadow(0 0 64px rgba(126,226,255,.42))!important;
  opacity:.22!important; mix-blend-mode:screen!important; background:transparent!important;
}
.global-watermark .sqs-background-shape{width:min(1500px,98vw)!important;height:min(1500px,98vw)!important;right:-20vw!important;top:50%!important;}
.login-bg .sqs-background-shape{width:min(1280px,98vw)!important;height:min(1280px,98vw)!important;right:-20vw!important;}
/* Make risk heat map present as a full dashboard bottom card */
#dashboardView .risk-panel-wide,.osip-risk-map-panel{display:block!important;visibility:visible!important;opacity:1!important;grid-column:1/-1!important;width:100%!important;}
#riskDistribution{min-height:320px;}
.osip-risk-map-panel .heatmap-card-wrap{max-height:none!important;overflow:visible!important;display:grid!important;grid-template-columns:repeat(auto-fit,minmax(320px,1fr))!important;gap:14px!important;}
.osip-risk-map-panel .heatmap-area-grid{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))!important;}
/* Risk level colors exactly aligned to selected result */
.risk-critical,.heat-critical{background:linear-gradient(180deg,#d71920,#971014)!important;border-color:rgba(255,120,120,.56)!important;color:#fff!important;}
.risk-high,.heat-high-orange{background:linear-gradient(180deg,#c75b12,#803900)!important;border-color:rgba(255,176,99,.52)!important;color:#fff!important;}
.risk-medium,.heat-medium-yellow{background:linear-gradient(180deg,#d2a012,#9d7400)!important;border-color:rgba(255,224,112,.50)!important;color:#07111c!important;}
.risk-low{background:linear-gradient(180deg,#2bd38f,#119963)!important;border-color:rgba(98,255,192,.48)!important;color:#06111c!important;}
.risk-critical *,.heat-critical *,.risk-high *,.heat-high-orange *{color:#fff!important;}
.risk-medium *,.heat-medium-yellow *,.risk-low *{color:#06111c!important;}
.risk-matrix-mini-ref{font-size:13px!important;font-weight:950!important;min-height:48px!important;}
.risk-matrix-mini-ref.heat-none{color:#fff!important;}
.heatmap-cell.heat-high{background:linear-gradient(180deg,#d71920,#971014)!important;color:#fff!important;}
.heatmap-cell.heat-med{background:linear-gradient(180deg,#c75b12,#803900)!important;color:#fff!important;}
.heatmap-cell.heat-yellow{background:linear-gradient(180deg,#d2a012,#9d7400)!important;color:#06111c!important;}
.heatmap-cell.heat-low,.heatmap-cell.heat-green{background:linear-gradient(180deg,#2bd38f,#119963)!important;color:#06111c!important;}
.heatmap-cell.heat-yellow span,.heatmap-cell.heat-yellow b,.heatmap-cell.heat-yellow small,.heatmap-cell.heat-low span,.heatmap-cell.heat-low b,.heatmap-cell.heat-low small,.heatmap-cell.heat-green span,.heatmap-cell.heat-green b,.heatmap-cell.heat-green small{color:#06111c!important;}
.heatmap-cell.heat-high span,.heatmap-cell.heat-high b,.heatmap-cell.heat-high small,.heatmap-cell.heat-med span,.heatmap-cell.heat-med b,.heatmap-cell.heat-med small{color:#fff!important;}
/* Checklist answer text areas: readable typed text */
#checklistContainer textarea.item-note,#checklistContainer .noncompliance-extra textarea,#sagIdeaCaptureHost textarea,#sagIdeaCaptureHost input{
  background:rgba(255,255,255,.92)!important;color:#07111c!important;border-color:rgba(255,255,255,.45)!important;font-weight:700!important;
}
#checklistContainer textarea::placeholder,#sagIdeaCaptureHost textarea::placeholder,#sagIdeaCaptureHost input::placeholder{color:rgba(7,17,28,.56)!important;}
/* Guidance icon placement inside risk controls */
.risk-matrix-control-row .info-tip{display:inline-flex!important;margin-left:5px!important;vertical-align:middle!important;}
.risk-matrix-control-row label{line-height:1.4!important;}
/* Best Practices hierarchy */
.bp-governance-flow span{min-width:150px;text-align:center;}
.bp-workflow-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:14px 0;}
.bp-step{border:1px solid rgba(255,255,255,.18);border-radius:16px;padding:12px;background:rgba(255,255,255,.075);color:rgba(232,242,250,.74);font-size:12px;line-height:1.4;}
.bp-step b{display:block;margin-top:4px;color:#fff;}
.bp-step.is-done{background:linear-gradient(180deg,rgba(126,226,255,.20),rgba(255,255,255,.08));border-color:rgba(126,226,255,.38);}
/* Guideline library must match dark/navy OSIP canvas, not green */
.guideline-dropdown,.guideline-page-panel,.guideline-library-section,.publication-card,.guideline-item-card{
  background:linear-gradient(180deg,rgba(7,20,34,.86),rgba(6,17,28,.66))!important;
  border-color:rgba(126,226,255,.20)!important;color:#f7fbff!important;
}
.guideline-dropdown summary,.guideline-area-block{background:transparent!important;color:#f7fbff!important;}
.guideline-dropdown summary span,.guideline-area-block h4,.publication-card h3,.guideline-item-card h3{color:#ffffff!important;}
.guideline-dropdown summary small,.publication-card p,.guideline-item-card p{color:rgba(232,242,250,.76)!important;}
.guideline-search{background:rgba(3,12,20,.82)!important;color:#fff!important;border-color:rgba(126,226,255,.22)!important;}
.guideline-link,.guideline-official-link{background:rgba(126,226,255,.12)!important;border-color:rgba(126,226,255,.26)!important;color:#dff7ff!important;}
/* Dark navy mobile polish retained */
@media(max-width:860px){
  .global-watermark .sqs-background-shape{right:-66vw!important;width:1080px!important;height:1080px!important;opacity:.13!important;}
  .login-bg .sqs-background-shape{right:-70vw!important;width:960px!important;height:960px!important;opacity:.18!important;}
  .osip-risk-map-panel .heatmap-card-wrap{grid-template-columns:1fr!important;}
  .osip-risk-map-panel .heatmap-area-grid{grid-template-columns:1fr!important;}
  .bp-workflow-strip{grid-template-columns:1fr!important;}
}


/* v59: OSIP final dashboard recovery, risk matrix reference colors, and checklist visibility */
#canvasVisualAnalyticsPanel{display:block!important;visibility:visible!important;opacity:1!important;grid-column:1/-1!important;width:100%!important;margin-top:22px!important;}
#dashboardVisualGrid{display:grid!important;}
#dashboardView .osip-risk-map-panel{display:block!important;visibility:visible!important;opacity:1!important;grid-column:1/-1!important;width:100%!important;margin-top:24px!important;}
.risk-matrix-reference{background:linear-gradient(180deg,rgba(8,17,30,.72),rgba(4,10,18,.62))!important;border:1px solid rgba(255,255,255,.20)!important;box-shadow:0 18px 48px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.12)!important;color:#eef7ff!important;}
.risk-matrix-reference h3{color:#fff!important;font-size:18px!important;letter-spacing:-.02em!important;}
.risk-matrix-reference p{color:rgba(235,245,255,.82)!important;}
.risk-ref-table th{background:rgba(255,255,255,.10)!important;color:#fff!important;border-color:rgba(255,255,255,.22)!important;}
.risk-ref-table td{font-weight:950!important;border-color:rgba(255,255,255,.22)!important;}
.risk-ref-table td.heat-critical,.risk-ref-table td.risk-critical{background:linear-gradient(180deg,#d71920,#8f0d12)!important;color:#fff!important;}
.risk-ref-table td.heat-high-orange,.risk-ref-table td.risk-high{background:linear-gradient(180deg,#c95d14,#823600)!important;color:#fff!important;}
.risk-ref-table td.heat-medium-yellow,.risk-ref-table td.risk-medium{background:linear-gradient(180deg,#d6a51a,#a47a00)!important;color:#07111c!important;}
.risk-ref-table td.heat-low,.risk-ref-table td.risk-low{background:linear-gradient(180deg,#25b477,#12875b)!important;color:#07111c!important;}
.risk-ref-table td b{font-size:12px!important;}
.heatmap-legend i.heat-critical,.heatmap-legend i.risk-critical{background:#d71920!important;}
.heatmap-legend i.heat-high-orange,.heatmap-legend i.risk-high{background:#c95d14!important;}
.heatmap-legend i.heat-medium-yellow,.heatmap-legend i.risk-medium{background:#d6a51a!important;}
.heatmap-legend i.heat-low,.heatmap-legend i.risk-low{background:#25b477!important;}
.checklist-item textarea.item-note,.noncompliance-extra textarea,textarea,input[type="text"],input[type="search"],input[type="number"],input[type="date"]{color:#07111c!important;}
.checklist-item textarea.item-note::placeholder,.noncompliance-extra textarea::placeholder{color:rgba(7,17,28,.56)!important;}
.checklist-item .risk-matrix-mini-ref.risk-critical,.checklist-item .risk-matrix-mini-ref.heat-critical{background:#d71920!important;color:#fff!important;}
.checklist-item .risk-matrix-mini-ref.risk-high,.checklist-item .risk-matrix-mini-ref.heat-high-orange{background:#c95d14!important;color:#fff!important;}
.checklist-item .risk-matrix-mini-ref.risk-medium,.checklist-item .risk-matrix-mini-ref.heat-medium-yellow{background:#d6a51a!important;color:#07111c!important;}
.checklist-item .risk-matrix-mini-ref.risk-low,.checklist-item .risk-matrix-mini-ref.heat-low{background:#25b477!important;color:#07111c!important;}
.guideline-page-panel,.guide-group,.guide-card{background:linear-gradient(180deg,rgba(7,16,30,.84),rgba(4,10,20,.74))!important;border-color:rgba(255,255,255,.18)!important;color:#eef7ff!important;}
.guide-card h3,.guide-group h3,.guideline-page-panel h2{color:#fff!important;}
.guide-card p,.guide-card li,.guide-card small,.guideline-page-panel p{color:rgba(230,241,255,.82)!important;}
@media(max-width:760px){#canvasVisualAnalyticsPanel,#dashboardView .osip-risk-map-panel{margin-top:16px!important}.risk-ref-table{min-width:720px!important}.risk-matrix-table-wrap{overflow:auto!important;-webkit-overflow-scrolling:touch!important}}

/* v60 stability/additive patch: keep full dashboard visual analytics visible and align guide cards with OSIP dark navy theme */
#canvasVisualAnalyticsPanel:not(.canvas-hidden){display:block!important;visibility:visible!important;opacity:1!important;}
#dashboardVisualGrid.dashboard-visual-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;}
.guideline-page-panel .chip.green,.guideline-page-panel .publication-card-top .chip.green{background:rgba(8,18,36,.88)!important;color:#eaf7ff!important;border-color:rgba(126,226,255,.25)!important;}
.guideline-page-panel .publication-card,.guideline-page-panel .guideline-item-card,.guideline-dropdown{background:linear-gradient(180deg,rgba(8,18,36,.84),rgba(3,9,20,.78))!important;border-color:rgba(126,226,255,.18)!important;box-shadow:0 18px 45px rgba(0,0,0,.24)!important;}
.guideline-page-panel .publication-definition dt{color:#ffffff!important;font-weight:900!important;}
.guideline-page-panel .publication-definition dd,.guideline-page-panel .publication-definition li{color:rgba(235,246,255,.84)!important;}
.visual-card{background:linear-gradient(180deg,rgba(255,255,255,.105),rgba(255,255,255,.055))!important;border-color:rgba(255,255,255,.16)!important;}
.visual-card h3{color:#ffffff!important;}
.risk-matrix-reference{background:linear-gradient(180deg,rgba(255,255,255,.095),rgba(255,255,255,.045))!important;border:1px solid rgba(255,255,255,.16)!important;border-radius:18px!important;padding:14px!important;color:#f8fbff!important;}
@media(max-width:1100px){#dashboardVisualGrid.dashboard-visual-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:760px){#dashboardVisualGrid.dashboard-visual-grid{grid-template-columns:1fr!important;}.visual-card{min-width:0!important;}.guideline-page-panel .publication-definition{font-size:12.5px!important;}}

/* v61: Clear guidance, live Page Canvas theme control, and Best Practice assignment drawer */
.global-info-tip-panel{
  background:linear-gradient(180deg,rgba(2,8,14,.98),rgba(4,13,24,.96))!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.28)!important;
  box-shadow:0 30px 90px rgba(0,0,0,.72), inset 0 1px 0 rgba(255,255,255,.12)!important;
  backdrop-filter:blur(10px) saturate(120%)!important;
}
.global-info-tip-panel .guide-chip{
  background:rgba(255,255,255,.12)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.28)!important;
  box-shadow:none!important;
}
.global-info-tip-panel strong{color:#fff!important;text-shadow:none!important;}
.global-info-tip-panel p{color:rgba(255,255,255,.92)!important;text-shadow:none!important;line-height:1.65!important;}
.global-info-close{background:rgba(255,255,255,.14)!important;color:#fff!important;border-color:rgba(255,255,255,.28)!important;}

/* Canvas theme variables now control the actual OSIP visual layer */
body{
  background:radial-gradient(circle at 15% 15%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 28%),
             linear-gradient(135deg,var(--bg),var(--bg-2) 58%,var(--bg))!important;
  color:var(--text)!important;
}
.login-bg,.app-screen{
  background:radial-gradient(circle at 18% 14%, color-mix(in srgb, var(--accent) 18%, transparent), transparent 30%),
             radial-gradient(circle at 88% 10%, color-mix(in srgb, var(--accent-2) 14%, transparent), transparent 34%),
             linear-gradient(135deg,var(--bg),var(--bg-2) 56%,var(--bg))!important;
}
.login-card,.panel,.kpi-card,.topbar,.sidebar-note,.canvas-card,.finding-card,.checklist-item,.visual-card,.summary-card,.location-row,.risk-item{
  background:linear-gradient(180deg,color-mix(in srgb, var(--panel-2) 72%, transparent),color-mix(in srgb, var(--panel) 52%, transparent))!important;
  border-color:color-mix(in srgb, var(--accent-2) 22%, rgba(255,255,255,.12))!important;
}
.sidebar{background:linear-gradient(180deg,color-mix(in srgb, var(--bg) 94%, transparent),color-mix(in srgb, var(--bg-2) 82%, transparent))!important;}
.nav-btn.active,.nav-btn:hover{background:color-mix(in srgb, var(--accent) 14%, transparent)!important;border-color:color-mix(in srgb, var(--accent) 46%, transparent)!important;color:var(--text)!important;}
.primary-btn{background:linear-gradient(135deg,var(--accent),var(--accent-2))!important;color:#06111c!important;}
.status-dot{background:var(--accent)!important;box-shadow:0 0 18px var(--accent)!important;}
.eyebrow,.chip.green,.sidebar-note span{color:var(--accent)!important;}
input:focus,select:focus,textarea:focus{border-color:color-mix(in srgb, var(--accent) 70%, white 8%)!important;box-shadow:0 0 0 4px color-mix(in srgb, var(--accent) 18%, transparent)!important;}

.theme-swatch-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(30px,1fr));gap:8px;margin:14px 0 18px;}
.theme-swatch{height:30px;border-radius:10px;border:1px solid rgba(255,255,255,.26);background:var(--swatch);box-shadow:inset 0 1px 0 rgba(255,255,255,.24),0 8px 18px rgba(0,0,0,.18);}
.theme-swatch:hover{transform:translateY(-1px) scale(1.03);box-shadow:0 12px 30px color-mix(in srgb, var(--swatch) 50%, rgba(0,0,0,.32));}
.canvas-color-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;}
.canvas-color-grid label{display:flex;flex-direction:column;gap:8px;color:var(--muted);font-weight:800;font-size:12px;}
.canvas-color-grid input[type="color"]{width:100%;height:44px;padding:4px;border-radius:14px;border:1px solid var(--line);background:rgba(255,255,255,.08);}
.bp-assign-panel{margin-top:14px;padding:16px;border-radius:20px;background:linear-gradient(180deg,rgba(3,11,20,.92),rgba(8,22,38,.86));border:1px solid rgba(126,226,255,.26);box-shadow:0 18px 46px rgba(0,0,0,.28);}
.bp-assign-head{display:flex;flex-direction:column;gap:4px;margin-bottom:12px;}
.bp-assign-head b{color:#fff;font-size:15px;}
.bp-assign-head span{color:rgba(255,255,255,.72);font-size:12px;line-height:1.5;}
.bp-assign-grid{display:grid;grid-template-columns:minmax(220px,1fr) minmax(300px,1.2fr) auto;gap:12px;align-items:end;}
.bp-assign-grid label{display:flex;flex-direction:column;gap:7px;color:rgba(255,255,255,.82);font-weight:850;font-size:12px;}
.bp-assign-grid input,.bp-assign-grid select{background:rgba(255,255,255,.92)!important;color:#06111c!important;border:1px solid rgba(255,255,255,.42)!important;border-radius:14px;padding:12px 13px;font-weight:800;}
.bp-assign-grid .primary-btn{height:45px;margin:0;white-space:nowrap;}

@media(max-width:860px){
  .global-info-tip-panel{left:14px!important;right:14px!important;bottom:14px!important;width:auto!important;max-width:none!important;}
  .canvas-color-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .theme-swatch-grid{grid-template-columns:repeat(8,1fr);}
  .bp-assign-grid{grid-template-columns:1fr;}
  .bp-assign-grid .primary-btn{width:100%;}
}

/* v62: align checklist risk controls consistently across desktop, tablet, and mobile. */
.checklist-item .risk-matrix-control-row .info-tip{align-self:flex-start;}
@media (max-width: 1100px){
  .risk-matrix-control-row{grid-template-columns:1fr 1fr!important;}
  .risk-matrix-mini-ref{grid-column:1 / -1!important;}
}
@media (max-width: 760px){
  .risk-matrix-control-row{grid-template-columns:1fr!important;padding:12px!important;}
  .risk-matrix-control-row label,.risk-matrix-mini-ref{width:100%!important;}
}

/* v63: Page Canvas Control activation + Arabic/mobile polish */
:root{
  --canvas-card-bg:linear-gradient(160deg, rgba(30,58,95,.72), rgba(18,38,58,.44));
  --canvas-card-bg-strong:linear-gradient(160deg, rgba(30,58,95,.88), rgba(18,38,58,.62));
  --canvas-field-bg:rgba(6,17,28,.72);
  --canvas-accent-soft:rgba(43,215,255,.16);
  --canvas-accent-line:rgba(43,215,255,.42);
}
body .panel,
body .kpi-card,
body .visual-card,
body .summary-card,
body .canvas-card,
body .finding-card,
body .guideline-category,
body .guideline-card,
body .heatmap-area-card,
body .location-row,
body .stn-map-detail-card,
body .demo-credential-card,
body .credential-chip,
body .sag-card,
body .checklist-item{
  background:var(--canvas-card-bg)!important;
  border-color:var(--line)!important;
  color:var(--text)!important;
}
body .panel.master-panel,
body .login-card,
body .sidebar,
body .mobile-app-bar,
body .topbar,
body .theme-swatch,
body .reference-strip{
  background:var(--canvas-card-bg-strong)!important;
  border-color:var(--line)!important;
}
body input,
body select,
body textarea,
body .mini-select{
  background:var(--canvas-field-bg)!important;
  color:var(--text)!important;
  border-color:var(--line)!important;
}
body input::placeholder,
body textarea::placeholder{color:color-mix(in srgb, var(--muted) 82%, transparent)!important;}
body .primary-btn,
body .nav-btn.active,
body .mobile-menu-btn,
body .language-toggle{
  border-color:var(--canvas-accent-line)!important;
}
body .primary-btn{background:linear-gradient(135deg,var(--accent),var(--accent-2))!important;color:#04111d!important;}
body .nav-btn.active{background:var(--canvas-accent-soft)!important;color:var(--text)!important;}
body .bar span,.visual-bar-track i{background:linear-gradient(90deg,var(--accent),var(--accent-2))!important;}
body[data-canvas-density="compact"] .panel,
body[data-canvas-density="compact"] .kpi-card,
body[data-canvas-density="compact"] .visual-card,
body[data-canvas-density="compact"] .canvas-card{padding:14px!important;border-radius:18px!important;}
body[data-canvas-density="compact"] .form-grid{gap:10px!important;}
body[data-canvas-density="executive"] .panel,
body[data-canvas-density="executive"] .kpi-card,
body[data-canvas-density="executive"] .visual-card,
body[data-canvas-density="executive"] .canvas-card{padding:26px!important;border-radius:30px!important;}
body[data-dashboard-layout="expanded"] .dashboard-grid{grid-template-columns:1fr!important;}
body[data-dashboard-layout="expanded"] .wide-panel{min-height:auto;}
body[data-dashboard-layout="executive"] .dashboard-grid{grid-template-columns:1.15fr .85fr!important;}
body[data-dashboard-layout="executive"] .kpi-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important;}
body[data-kpi-size="large"] .kpi-card strong{font-size:48px!important;}
body[data-kpi-size="large"] .primary-kpi strong{font-size:62px!important;}
body[data-kpi-size="compact"] .kpi-card{padding:14px!important;}
body[data-kpi-size="compact"] .kpi-card strong{font-size:25px!important;}
body[data-chart-style="compact"] .location-row{grid-template-columns:1.3fr .7fr .7fr auto!important;padding:10px 12px!important;}
body[data-chart-style="list"] .location-row{grid-template-columns:1fr!important;align-items:flex-start!important;}
body[data-stn-progress-style="cards"] .progress-list{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));}
body[data-stn-progress-style="cards"] .location-row{display:flex!important;flex-direction:column!important;align-items:flex-start!important;min-height:190px;}
body[data-stn-progress-style="executive"] .location-row{grid-template-columns:1fr 120px 1fr auto!important;border-width:2px;box-shadow:0 18px 48px rgba(0,0,0,.26);}
body[data-stn-progress-style="compact"] .location-row{padding:8px 10px!important;border-radius:14px!important;}
body[data-stn-progress-card-size="large"] .location-row{min-height:118px;font-size:1.04em;}
body[data-stn-progress-card-size="compact"] .location-row{min-height:auto;font-size:.92em;}
body[data-visual-chart-type="bars"] .visual-card{min-height:220px;}
body[data-visual-chart-type="donut"] .dashboard-visual-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));}
body[data-visual-chart-type="mixed"] .visual-status-card{grid-row:span 2;}
body[data-visual-color-mode="risk"] .visual-bar-row.risk-high-bar i{background:linear-gradient(90deg,#b91c1c,#ef4444)!important;}
body[data-visual-color-mode="risk"] .visual-bar-row.risk-medium-bar i{background:linear-gradient(90deg,#a16207,#fbbf24)!important;}
body[data-visual-color-mode="risk"] .visual-bar-row.risk-low-bar i{background:linear-gradient(90deg,#047857,#34d399)!important;}
body[data-visual-color-mode="minimal"] .visual-bar-track i{background:linear-gradient(90deg,#f8fbff,#bcd2e8)!important;}
.info-tip-panel,
.guidance-modal,
.tooltip-panel{
  background:rgba(3,10,18,.96)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.24)!important;
  box-shadow:0 24px 70px rgba(0,0,0,.55)!important;
  backdrop-filter:blur(18px)!important;
}
.info-tip-panel b,
.guidance-modal b,
.tooltip-panel b{color:#fff!important;}
.info-tip-panel span,
.guidance-modal p,
.tooltip-panel p{color:rgba(255,255,255,.92)!important;}
body.rtl{font-family:Inter,system-ui,-apple-system,"Segoe UI",Tahoma,Arial,sans-serif;}
body.rtl .nav-btn, body.rtl .data-table th, body.rtl .data-table td{text-align:right;}
body.rtl .form-grid label, body.rtl .login-card label{text-align:right;}
body.rtl .panel-head, body.rtl .topbar, body.rtl .brand-lockup{direction:rtl;}
body.rtl .location-row{direction:rtl;}
body.rtl .mobile-app-bar{direction:rtl;}

@media (max-width: 860px){
  :root{--mobile-bar-h:calc(76px + env(safe-area-inset-top));}
  .mobile-app-bar{
    background:linear-gradient(135deg,rgba(4,13,23,.98),rgba(9,28,47,.96))!important;
    border-bottom:1px solid rgba(255,255,255,.18)!important;
    box-shadow:0 16px 44px rgba(0,0,0,.45)!important;
    min-height:var(--mobile-bar-h);
  }
  .mobile-bar-logo{filter:none!important;width:118px!important;max-width:32vw;opacity:1!important;}
  .mobile-bar-title strong{color:#ffffff!important;font-size:14px!important;}
  .mobile-bar-title span{color:#cbd8e7!important;font-size:11px!important;}
  .mobile-lang-toggle{background:rgba(255,255,255,.12)!important;color:#fff!important;border-color:rgba(255,255,255,.28)!important;}
  .sidebar{background:linear-gradient(180deg,rgba(4,13,23,.99),rgba(8,23,38,.98))!important;}
  .guideline-page-panel{padding:18px!important;}
  .guideline-library-head,
  .guideline-item-grid,
  .guide-search-wrap{display:grid!important;grid-template-columns:1fr!important;gap:14px!important;align-items:center!important;text-align:center!important;}
  .guideline-card,
  .guideline-category,
  .guide-card,
  .guide-tile{
    margin-inline:auto!important;
    width:100%!important;
    max-width:520px!important;
    text-align:center!important;
    align-items:center!important;
  }
  .guideline-card p,
  .guideline-card li,
  .guideline-card h3,
  .guideline-card h4{text-align:center!important;}
  .guideline-card .chip,
  .guideline-card .secondary-btn{justify-content:center!important;margin-inline:auto!important;}
  .info-tip-panel{position:fixed!important;left:14px!important;right:14px!important;top:86px!important;bottom:auto!important;width:auto!important;max-width:none!important;z-index:300!important;}
  .app-screen:not(.hidden){background:linear-gradient(135deg,var(--bg),var(--bg-2))!important;}
  .main-content{padding-top:16px!important;}
  .kpi-grid,.dashboard-grid,.dashboard-visual-grid,.form-grid,.canvas-grid,.professional-canvas-grid{grid-template-columns:1fr!important;}
  .topbar{background:var(--canvas-card-bg-strong)!important;border:1px solid var(--line)!important;border-radius:22px!important;}
  .panel{border-radius:24px!important;}
}

@media (max-width: 430px){
  .mobile-bar-logo{width:100px!important;max-width:28vw;}
  .mobile-bar-title strong{font-size:13px!important;}
  .mobile-bar-title span{font-size:10px!important;max-width:150px!important;}
  .guideline-card,.guideline-category{max-width:100%!important;}
}

/* v64 OSIP final visual consistency: dark navy intelligent canvas, white form text, and mobile polish */
:root{
  --bg:#06111c;
  --bg-2:#0a1b2c;
  --panel:#0b1b2b;
  --panel-2:#132a42;
  --text:#f8fbff;
  --muted:#c6d3e1;
  --line:rgba(220,238,255,.17);
  --accent:#67d8ff;
  --accent-2:#88bfff;
  --surface-a:rgba(19,42,66,.74);
  --surface-b:rgba(8,22,36,.56);
  --canvas-field-bg:rgba(4,13,23,.82);
}
body, .login-screen, .app-screen{background:var(--bg)!important;color:var(--text)!important;}
.login-bg,.main-content{background:radial-gradient(circle at 15% 10%, color-mix(in srgb,var(--accent) 18%, transparent), transparent 28%),radial-gradient(circle at 75% 5%, rgba(255,255,255,.10), transparent 24%),linear-gradient(145deg,var(--bg) 0%,var(--bg-2) 58%,var(--bg) 100%)!important;}
.sidebar,.mobile-app-bar{background:color-mix(in srgb,var(--bg) 92%, #000 8%)!important;border-color:rgba(220,238,255,.16)!important;box-shadow:0 20px 55px rgba(0,0,0,.42)!important;}
.panel,.kpi-card,.summary-card,.location-row,.finding-card,.checklist-item,.check-item,.visual-card,.canvas-card,.guideline-dropdown,.guideline-item-card,.publication-card,.login-card,.demo-credential-card,.credential-chip,.program-identity,.sidebar-user-panel,.sidebar-note,.risk-matrix-reference,.heatmap-station-card,.heatmap-cell,.logic-card,.target-smart-selector,.data-table td{
  background:linear-gradient(155deg,var(--surface-a),var(--surface-b))!important;
  border-color:rgba(220,238,255,.16)!important;
  box-shadow:0 20px 56px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.05)!important;
  color:var(--text)!important;
}
.panel h2,.panel h3,.kpi-card p,.visual-card h3,.guideline-item-card h4,.publication-card h4,.canvas-card h3,.program-identity h2,.brand-lockup h1,.brand-lockup h2,.login-title-block h1{color:var(--text)!important;}
.muted,.panel-head p,.kpi-card small,.guideline-item-card p,.publication-definition dd,.program-identity p,.field-instruction,.hint{color:var(--muted)!important;}
input,select,textarea,.mini-select,.stn-search-input,.form-grid input,.form-grid select,.form-grid textarea,.login-card input,.item-note,.check-note,.risk-select,.guideline-search,.target-directory-search{
  background:var(--canvas-field-bg,rgba(3,13,23,.88))!important;
  color:var(--text,#f8fbff)!important;
  -webkit-text-fill-color:var(--text,#f8fbff)!important;
  border-color:var(--line,rgba(220,238,255,.18))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04)!important;
}
input::placeholder,textarea::placeholder{color:rgba(248,251,255,.58)!important;-webkit-text-fill-color:rgba(248,251,255,.58)!important;}
select option{background:#06111c!important;color:#f8fbff!important;}
.primary-btn{background:linear-gradient(135deg,#67d8ff,#f8fbff)!important;color:#071421!important;}
.secondary-btn,.ghost-btn,.logout-btn,.table-action{background:rgba(255,255,255,.065)!important;color:#f8fbff!important;border:1px solid rgba(220,238,255,.18)!important;}
.nav-btn{color:rgba(248,251,255,.76)!important}.nav-btn.active,.nav-btn:hover{background:rgba(103,216,255,.13)!important;border-color:rgba(103,216,255,.45)!important;color:#fff!important;}
.chip.green,.chip.blue,.pill{background:rgba(103,216,255,.12)!important;border-color:rgba(103,216,255,.38)!important;color:#dff6ff!important;}
.reference-strip{background:rgba(103,216,255,.10)!important;border-color:rgba(103,216,255,.25)!important;color:#eaf8ff!important;}
.info-tip-modal{background:rgba(5,15,26,.96)!important;color:#fff!important;border-color:rgba(220,238,255,.2)!important;box-shadow:0 30px 90px rgba(0,0,0,.55)!important;}
.info-tip-modal *{color:#fff!important;}
.sqs-background-shape,.app-sqs-shape,.login-sqs-shape{filter:brightness(0) invert(1) drop-shadow(0 0 30px rgba(255,255,255,.24))!important;opacity:var(--canvas-shape-opacity,.24)!important;mix-blend-mode:screen!important;}
.main-content:before{display:none!important;}
/* Better Arabic form alignment without using black browser default text */
html[dir="rtl"] input,html[dir="rtl"] select,html[dir="rtl"] textarea{text-align:right!important;direction:rtl;}
html[dir="rtl"] .data-table th,html[dir="rtl"] .data-table td{text-align:right;}
html[dir="rtl"] .answer-row{direction:rtl;}
/* Mobile top ribbon and centered cards */
@media(max-width:760px){
  .mobile-app-bar{background:linear-gradient(180deg,rgba(5,15,26,.98),rgba(7,20,33,.92))!important;backdrop-filter:blur(18px);min-height:72px;border-bottom:1px solid rgba(220,238,255,.18)!important;}
  .mobile-bar-logo{opacity:1!important;filter:none!important;max-width:116px!important;}
  .mobile-bar-title strong{color:#fff!important;font-size:17px!important;}
  .mobile-bar-title span{color:rgba(248,251,255,.78)!important;font-size:12px!important;}
  .main-content{padding-top:88px!important;background:linear-gradient(145deg,var(--bg) 0%,var(--bg-2) 60%,var(--bg) 100%)!important;}
  .panel,.kpi-card,.location-row,.visual-card,.guideline-dropdown,.guideline-item-card,.publication-card{background:linear-gradient(155deg,var(--surface-a),var(--surface-b))!important;}
  .guideline-item-grid{display:grid!important;grid-template-columns:1fr!important;justify-items:center!important;}
  .guideline-item-card,.publication-card{width:100%!important;margin-inline:auto!important;text-align:start!important;}
  .guideline-dropdown summary{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;}
  .panel-head{align-items:stretch!important;}
  .answer-row label{min-width:0!important;justify-content:center!important;}
}


/* v65 final polish: deeper near-black canvas and slightly darker navy cards only.
   Login text/content and rotating-shape size are intentionally unchanged. */
:root{
  --bg:#02070d!important;
  --bg-2:#071626!important;
  --panel:#081827!important;
  --panel-2:#0e2944!important;
  --surface-a:rgba(14,41,68,.78)!important;
  --surface-b:rgba(5,16,28,.66)!important;
  --canvas-field-bg:rgba(2,9,16,.88)!important;
  --line:rgba(220,238,255,.18)!important;
}
body,
.login-screen,
.app-screen{
  background:#02070d!important;
}
.login-bg,
.main-content{
  background:
    radial-gradient(circle at 14% 10%, rgba(103,216,255,.095), transparent 30%),
    radial-gradient(circle at 80% 4%, rgba(255,255,255,.055), transparent 24%),
    linear-gradient(145deg,#010409 0%,#04101c 48%,#02070d 100%)!important;
}
.login-brand-panel,
.login-card,
.topbar,
.panel,
.kpi-card,
.summary-card,
.location-row,
.finding-card,
.checklist-item,
.check-item,
.visual-card,
.canvas-card,
.guideline-dropdown,
.guideline-item-card,
.publication-card,
.demo-credential-card,
.credential-chip,
.program-identity,
.sidebar-user-panel,
.sidebar-note,
.risk-matrix-reference,
.heatmap-station-card,
.heatmap-cell,
.logic-card,
.target-smart-selector,
.data-table td{
  background:linear-gradient(155deg,rgba(11,31,52,.84),rgba(3,12,22,.72))!important;
  border-color:rgba(220,238,255,.17)!important;
  box-shadow:0 22px 60px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.045)!important;
}
.sidebar,
.mobile-app-bar{
  background:linear-gradient(180deg,rgba(1,6,12,.98),rgba(3,12,22,.96))!important;
  border-color:rgba(220,238,255,.15)!important;
}
input,select,textarea,.mini-select,.stn-search-input,.form-grid input,.form-grid select,.form-grid textarea,.login-card input,.item-note,.check-note,.risk-select,.guideline-search,.target-directory-search{
  background:rgba(1,7,13,.91)!important;
  color:#f8fbff!important;
  -webkit-text-fill-color:#f8fbff!important;
}
.topbar, .panel, .kpi-card{
  backdrop-filter:blur(16px) saturate(112%)!important;
}
@media(max-width:760px){
  .login-screen,#appScreen:not(.hidden),.app-screen{background:#02070d!important;}
  .login-bg,.main-content{
    background:
      radial-gradient(circle at 72% 8%,rgba(103,216,255,.09),transparent 26%),
      linear-gradient(145deg,#010409 0%,#04101c 58%,#02070d 100%)!important;
  }
  .mobile-app-bar{
    background:linear-gradient(180deg,rgba(1,6,12,.99),rgba(3,12,22,.97))!important;
  }
  .login-brand-panel,.login-card,.topbar,.panel,.kpi-card,.location-row,.visual-card,.guideline-dropdown,.guideline-item-card,.publication-card{
    background:linear-gradient(155deg,rgba(11,31,52,.84),rgba(3,12,22,.72))!important;
  }
}


/* v66 exact correction: deeper near-black background + slightly darker navy cards only.
   Login text in English/Arabic and rotating shape size are intentionally unchanged. */
:root{
  color-scheme:dark;
  --bg:#00040a!important;
  --bg-2:#020b18!important;
  --panel:#06172a!important;
  --panel-2:#0a2440!important;
  --surface-a:rgba(10,36,64,.88)!important;
  --surface-b:rgba(3,12,23,.78)!important;
  --canvas-field-bg:rgba(0,6,13,.94)!important;
  --line:rgba(226,241,255,.18)!important;
}
html, body, .login-screen, .app-screen{
  background:#00040a!important;
}
.login-bg, .main-content{
  background:
    radial-gradient(circle at 14% 10%, rgba(103,216,255,.070), transparent 30%),
    radial-gradient(circle at 83% 4%, rgba(255,255,255,.035), transparent 24%),
    linear-gradient(145deg,#000205 0%,#020913 48%,#00040a 100%)!important;
}
.login-bg:after{opacity:.34!important;}
.login-card,
.demo-credential-card,
.credential-chip,
.topbar,
.panel,
.kpi-card,
.summary-card,
.location-row,
.finding-card,
.checklist-item,
.check-item,
.visual-card,
.canvas-card,
.guideline-dropdown,
.guideline-item-card,
.publication-card,
.program-identity,
.sidebar-user-panel,
.sidebar-note,
.risk-matrix-reference,
.heatmap-station-card,
.heatmap-cell,
.logic-card,
.target-smart-selector,
.data-table td,
.report-card,
.activity-card,
.idea-card{
  background:linear-gradient(155deg,rgba(8,28,50,.90),rgba(1,9,18,.82))!important;
  border-color:rgba(226,241,255,.18)!important;
  box-shadow:0 24px 70px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.04)!important;
}
.sidebar, .mobile-app-bar{
  background:linear-gradient(180deg,rgba(0,3,8,.99),rgba(1,9,18,.98))!important;
  border-color:rgba(226,241,255,.15)!important;
}
input, select, textarea, .mini-select, .stn-search-input, .form-grid input, .form-grid select, .form-grid textarea, .login-card input, .item-note, .check-note, .risk-select, .guideline-search, .target-directory-search{
  background:rgba(0,5,11,.96)!important;
  color:#f8fbff!important;
  -webkit-text-fill-color:#f8fbff!important;
  border-color:rgba(226,241,255,.18)!important;
}
.primary-btn{
  background:linear-gradient(135deg,#67d8ff,#f4fbff)!important;
  color:#06111c!important;
}
.secondary-btn,.ghost-btn,.logout-btn,.table-action{
  background:rgba(226,241,255,.075)!important;
  color:#f8fbff!important;
  border-color:rgba(226,241,255,.18)!important;
}
.nav-btn.active,.nav-btn:hover{
  background:rgba(103,216,255,.12)!important;
  border-color:rgba(103,216,255,.38)!important;
}
/* keep the approved shape dimensions; only ensure it stays visible on the darker canvas */
.sqs-background-shape,.app-sqs-shape,.login-sqs-shape{
  filter:brightness(0) invert(1) drop-shadow(0 0 34px rgba(255,255,255,.22))!important;
}
@media(max-width:760px){
  .login-screen,#appScreen:not(.hidden),.app-screen{background:#00040a!important;}
  .login-bg,.main-content{
    background:
      radial-gradient(circle at 72% 8%,rgba(103,216,255,.055),transparent 26%),
      linear-gradient(145deg,#000205 0%,#020913 58%,#00040a 100%)!important;
  }
  .mobile-app-bar{background:linear-gradient(180deg,rgba(0,3,8,.99),rgba(1,9,18,.98))!important;}
  .login-card,.demo-credential-card,.credential-chip,.topbar,.panel,.kpi-card,.location-row,.visual-card,.guideline-dropdown,.guideline-item-card,.publication-card{
    background:linear-gradient(155deg,rgba(8,28,50,.90),rgba(1,9,18,.82))!important;
  }
}

/* v67 exact visual-only login/color lock.
   Purpose: match the approved screenshots. No text, layout, logic, or rotating shape size changed. */
:root{
  --bg:#00060d!important;
  --bg-2:#031321!important;
  --panel:#061525!important;
  --panel-2:#0a2440!important;
  --surface-a:rgba(9,34,59,.88)!important;
  --surface-b:rgba(2,12,22,.82)!important;
  --canvas-field-bg:rgba(1,9,17,.96)!important;
  --text:#f7fbff!important;
  --muted:#b8c8d6!important;
  --line:rgba(196,222,245,.20)!important;
}
html,body,.login-screen,.app-screen{
  background:#00060d!important;
}
.login-bg,
.main-content{
  background:
    radial-gradient(circle at 12% 10%,rgba(77,185,236,.070),transparent 28%),
    radial-gradient(circle at 82% 4%,rgba(255,255,255,.038),transparent 24%),
    linear-gradient(145deg,#00050a 0%,#02101d 48%,#00060d 100%)!important;
}
.login-bg:after{
  opacity:.32!important;
}
.login-card,
.demo-credential-card,
.credential-chip,
.topbar,
.panel,
.kpi-card,
.summary-card,
.location-row,
.finding-card,
.checklist-item,
.check-item,
.visual-card,
.canvas-card,
.guideline-dropdown,
.guideline-item-card,
.publication-card,
.program-identity,
.sidebar-user-panel,
.sidebar-note,
.risk-matrix-reference,
.heatmap-station-card,
.heatmap-cell,
.logic-card,
.target-smart-selector,
.data-table td,
.report-card,
.activity-card,
.idea-card{
  background:linear-gradient(155deg,rgba(9,34,59,.88),rgba(2,12,22,.82))!important;
  border-color:rgba(196,222,245,.20)!important;
  box-shadow:0 24px 70px rgba(0,0,0,.44), inset 0 1px 0 rgba(255,255,255,.045)!important;
}
/* Login page card: keep the approved composition while locking the color only. */
.login-card.login-one-card{
  background:linear-gradient(160deg,rgba(8,31,55,.90),rgba(1,10,19,.84))!important;
  border-color:rgba(196,222,245,.24)!important;
}
.demo-credential-card,
.credential-chip{
  background:linear-gradient(155deg,rgba(7,27,49,.88),rgba(1,9,18,.84))!important;
}
.sidebar,.mobile-app-bar{
  background:linear-gradient(180deg,rgba(0,6,13,.99),rgba(1,11,20,.98))!important;
  border-color:rgba(196,222,245,.16)!important;
}
input,select,textarea,.mini-select,.stn-search-input,.form-grid input,.form-grid select,.form-grid textarea,.login-card input,.item-note,.check-note,.risk-select,.guideline-search,.target-directory-search{
  background:rgba(0,8,16,.96)!important;
  color:#f7fbff!important;
  -webkit-text-fill-color:#f7fbff!important;
  border-color:rgba(196,222,245,.20)!important;
}
input::placeholder,textarea::placeholder{
  color:rgba(247,251,255,.55)!important;
  -webkit-text-fill-color:rgba(247,251,255,.55)!important;
}
/* Do not alter size or placement of the approved shape; preserve existing dimensions. */
.sqs-background-shape,.app-sqs-shape,.login-sqs-shape{
  filter:brightness(0) invert(1) drop-shadow(0 0 34px rgba(255,255,255,.20))!important;
  mix-blend-mode:screen!important;
}
@media(max-width:760px){
  .login-screen,#appScreen:not(.hidden),.app-screen{background:#00060d!important;}
  .login-bg,.main-content{
    background:
      radial-gradient(circle at 72% 8%,rgba(77,185,236,.055),transparent 26%),
      linear-gradient(145deg,#00050a 0%,#02101d 58%,#00060d 100%)!important;
  }
  .mobile-app-bar{background:linear-gradient(180deg,rgba(0,6,13,.99),rgba(1,11,20,.98))!important;}
  .login-card,.demo-credential-card,.credential-chip,.topbar,.panel,.kpi-card,.location-row,.visual-card,.guideline-dropdown,.guideline-item-card,.publication-card{
    background:linear-gradient(155deg,rgba(9,34,59,.88),rgba(2,12,22,.82))!important;
  }
}
