:root {
    --canvas:#f4f6fa;
    --surface:rgba(255,255,255,.78);
    --ink:#131b2e;
    --muted:#64748b;
    --primary:#0284c7;
    --primary-dark:#006194;
    --cyan:#00b4d8;
    --line:rgba(15,23,42,.08);
    --radius:20px;
    --shadow:0 8px 32px -4px rgba(15,23,42,.045),0 0 24px rgba(2,132,199,.025);
    --body-font:'Be Vietnam Pro',Arial,sans-serif;
    --display-font:'Space Grotesk','Be Vietnam Pro',sans-serif;
}

[ng-cloak],.ng-cloak {
    display:none!important;
}

html {
    scroll-behavior:smooth;
    scroll-padding-top:110px;
}

body {
    font-family:var(--body-font);
    font-size:14px;
    line-height:1.65;
    color:var(--ink);
    background:radial-gradient(ellipse at 0 12%,rgba(56,189,248,.10),transparent 43%),radial-gradient(ellipse at 100% 55%,rgba(165,180,252,.11),transparent 47%),var(--canvas);
    min-height:100vh;
}

button,input,textarea,select {
    font:inherit;
}

button,a,input,summary,select {
    -webkit-tap-highlight-color:transparent;
}

a,button,summary {
    touch-action:manipulation;
}

button {
    cursor:pointer;
}

button:disabled {
    cursor:default;
}

a {
    color:inherit;
}

img {
    height:auto;
}

h1,h2,h3,p {
    margin:0;
}

h1,h2,h3 {
    line-height:1.4;
}

h1,h2 {
    letter-spacing:-.035em;
}

h1 {
    font-size:36px;
    font-weight:700;
}

h2 {
    font-size:19px;
    font-weight:700;
}

h3 {
    font-size:15px;
    font-weight:700;
}

button,a,input,summary,select {
    outline-offset:4px;
}

a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible,select:focus-visible {
    outline:3px solid var(--primary);
    box-shadow:0 0 0 5px rgba(2,132,199,.12);
}

.skip-link {
    position:fixed;
    top:-100px;
    left:20px;
    z-index:9999;
    padding:12px 20px;
    background:white;
    border-radius:12px;
    color:var(--primary);
}

.skip-link:focus {
    top:12px;
}

.app-header {
    position:sticky;
    top:0;
    z-index:1000;
    background:rgba(255,255,255,.82);
    backdrop-filter:blur(24px) saturate(180%);
    -webkit-backdrop-filter:blur(24px) saturate(180%);
    border-bottom:1px solid rgba(255,255,255,.9);
    box-shadow:0 2px 20px rgba(15,23,42,.025);
    padding-top:env(safe-area-inset-top);
}

.header-inner {
    max-width:1280px;
    margin:auto;
    height:84px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 48px;
    gap:20px;
}

.brand {
    display:flex;
    align-items:center;
    gap:12px;
    flex-shrink:0;
}

.brand-symbol {
    height:42px;
    width:42px;
    display:grid;
    place-items:center;
    background:linear-gradient(140deg,#0284c7,#00a9d1);
    border-radius:13px;
    color:white;
    font-size:21px;
    box-shadow:0 5px 14px rgba(2,132,199,.19);
}

.brand-name {
    font-family:var(--display-font);
    display:block;
    font-size:22px;
    font-weight:700;
    letter-spacing:-.9px;
    line-height:1.3;
    color:var(--primary-dark);
}

.brand-name>span {
    font-weight:500;
}

.brand-name small {
    font-size:10px;
    letter-spacing:.4px;
    vertical-align:middle;
    color:var(--primary);
    border:1px solid #c5eafe;
    border-radius:6px;
    padding:3px 5px;
    margin-left:4px;
    background:#f0f9ff;
}

.brand-caption {
    display:flex;
    align-items:center;
    gap:5px;
    font-size:10px;
    color:var(--muted);
    margin-top:3px;
    letter-spacing:.2px;
}

.brand-caption>i {
    width:5px;
    height:5px;
    border-radius:50%;
    background:#24bb97;
}

.header-note {
    font-size:12px;
    color:var(--muted);
    margin-left:auto;
    margin-right:24px;
}

.header-actions {
    display:flex;
    align-items:center;
    gap:10px;
}

.license-switch {
    display:flex;
    align-items:center;
    gap:10px;
    border:1px solid #dfebf3;
    border-radius:12px;
    min-height:44px;
    padding:8px 14px;
    background:#f3f8fc;
    font-size:12px;
    color:#475569;
}

.license-switch strong {
    color:var(--primary-dark);
    font-size:14px;
}

.license-switch>i:first-child {
    color:var(--primary);
}

.license-switch>i:last-child {
    font-size:9px;
}

.icon-button {
    width:42px;
    height:44px;
    display:grid;
    place-items:center;
    border:1px solid var(--line);
    background:rgba(255,255,255,.7);
    border-radius:12px;
    color:#64748b;
    font-size:17px;
}

.icon-button:hover,.license-switch:hover {
    background:#eaf6fe;
    color:var(--primary);
}

.route-content {
    padding:36px 48px 132px;
    max-width:1280px;
    margin:auto;
    outline:none;
}

.dashboard {
    max-width:1120px;
    margin:0 auto;
}

.welcome-row {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:32px;
    margin-bottom:32px;
}

.eyebrow {
    font-family:var(--display-font);
    color:#708396;
    font-size:10px;
    letter-spacing:1.65px;
    font-weight:700;
    margin-bottom:7px;
}

.welcome-row h1 {
    font-size:38px;
    line-height:1.25;
    letter-spacing:-1.5px;
    margin-bottom:12px;
}

.welcome-row h1>span {
    color:var(--primary);
}

.welcome-row>div>p:last-child {
    font-size:12px;
    color:var(--muted);
}

.welcome-row h1 br {
    display:none;
}

.edition-pill {
    display:flex;
    align-items:center;
    gap:12px;
    padding:14px 18px;
    background:rgba(255,255,255,.74);
    border:1px solid white;
    border-radius:14px;
    box-shadow:var(--shadow);
    flex-shrink:0;
}

.edition-pill strong,.edition-pill small {
    display:block;
}

.edition-pill strong {
    font-size:12px;
    color:var(--primary-dark);
}

.edition-pill small {
    color:var(--muted);
    font-size:11px;
    margin-top:2px;
}

.edition-pill>i {
    font-size:10px;
    color:#94a3b8;
    margin-left:8px;
}

.edition-icon {
    color:var(--primary);
    font-size:24px;
}

.dashboard-grid {
    display:grid;
    grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);
    gap:28px;
}

.dashboard-primary,.dashboard-secondary {
    display:flex;
    flex-direction:column;
    gap:28px;
    min-width:0;
}

.glass-card {
    background:var(--surface);
    border:1px solid rgba(255,255,255,.95);
    box-shadow:var(--shadow);
    border-radius:var(--radius);
    backdrop-filter:blur(16px) saturate(180%);
    -webkit-backdrop-filter:blur(16px) saturate(180%);
}

.readiness-card {
    padding:24px;
}

.section-heading {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    margin-bottom:16px;
}

.section-heading>h2 {
    display:flex;
    align-items:center;
    gap:9px;
}

.section-heading .eyebrow {
    font-size:9px;
    margin-bottom:4px;
}

.section-meta {
    font-size:11px;
    color:var(--muted);
}

.text-link {
    color:var(--primary-dark);
    font-size:11px;
    font-weight:600;
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:32px;
    white-space:nowrap;
}

.text-link:hover {
    text-decoration:underline;
}

.text-link i {
    font-size:9px;
}

.readiness-body {
    display:flex;
    align-items:center;
    gap:24px;
    padding:8px 0 22px;
}

.progress-gauge {
    width:154px;
    height:154px;
    position:relative;
    flex-shrink:0;
}

.progress-gauge svg {
    width:100%;
    height:100%;
    transform:rotate(-90deg);
}

.progress-gauge circle {
    fill:none;
    stroke-width:8;
    stroke-linecap:round;
}

.gauge-track {
    stroke:#e8eff5;
}

.gauge-value {
    stroke:var(--primary);
    filter:drop-shadow(0 2px 5px rgba(2,132,199,.2));
    transition:stroke-dashoffset .5s;
}

.progress-gauge>div {
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
}

.progress-gauge strong {
    font-family:var(--display-font);
    font-size:38px;
    line-height:1.2;
    letter-spacing:-1.5px;
}

.progress-gauge strong small {
    font-size:16px;
    color:var(--primary);
}

.progress-gauge>div>span {
    font-family:var(--display-font);
    font-size:8px;
    font-weight:600;
    letter-spacing:1.2px;
    color:var(--muted);
    margin-top:4px;
}

.metric-grid {
    flex:1;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    min-width:0;
}

.metric {
    padding:11px 12px;
    border:1px solid #e5ebf3;
    border-radius:11px;
    background:#f8fafd;
    display:flex;
    flex-direction:column;
    gap:2px;
    transition:transform .2s;
}

.metric:hover {
    transform:translateY(-2px);
}

.metric>span {
    font-size:10px;
    color:#64748b;
}

.metric>strong {
    font-family:var(--display-font);
    font-size:22px;
    line-height:1.25;
}

.metric strong small {
    font-family:var(--body-font);
    font-size:10px;
    font-weight:400;
    color:#7890a3;
}

.metric-green {
    background:#f0fcf7;
    border-color:#ccefe3;
}

.metric-green strong {
    color:#159570;
}

.metric-blue {
    background:#eff9ff;
    border-color:#d6eefc;
}

.metric-blue strong {
    color:#0284c7;
}

.metric-red {
    background:#fff5f5;
    border-color:#ffe0e0;
}

.metric-red strong {
    color:#d64c55;
}

.primary-cta {
    display:flex;
    align-items:center;
    gap:13px;
    padding:14px 18px;
    color:white;
    background:linear-gradient(110deg,#0284c7,#009fd1);
    border-radius:13px;
    box-shadow:0 6px 18px rgba(2,132,199,.22);
    transition:box-shadow .2s,transform .2s;
}

.primary-cta:hover {
    box-shadow:0 6px 24px rgba(2,132,199,.35);
    transform:translateY(-1px);
}

.cta-icon {
    height:38px;
    width:38px;
    display:grid;
    place-items:center;
    background:rgba(255,255,255,.18);
    border:1px solid rgba(255,255,255,.15);
    border-radius:10px;
}

.primary-cta>span:nth-child(2) {
    flex:1;
}

.primary-cta strong,.primary-cta small {
    display:block;
}

.primary-cta strong {
    font-size:14px;
}

.primary-cta small {
    font-size:10px;
    color:#eefbff;
    margin-top:2px;
}

.card-footnote {
    display:flex;
    justify-content:center;
    align-items:center;
    gap:5px;
    font-size:9px;
    color:#7890a3;
    margin-top:13px;
}

.card-footnote i {
    color:#44aa9b;
}

.section-dot {
    width:7px;
    height:7px;
    display:inline-block;
    border-radius:50%;
    background:var(--primary);
    flex-shrink:0;
}

.red-dot {
    background:#ed6573;
}

.violet-dot {
    background:#7770e3;
}

.module-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
}

.module-card {
    padding:20px;
    transition:transform .2s,box-shadow .2s;
    display:flex;
    flex-direction:column;
    min-height:188px;
}

.module-card:hover,.utility-card:hover {
    transform:translateY(-3px);
    box-shadow:0 12px 25px rgba(15,23,42,.07);
}

.module-top {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:6px;
}

.module-top>i {
    font-size:11px;
    color:#9baabc;
}

.module-icon {
    width:42px;
    height:42px;
    border-radius:12px;
    display:inline-grid;
    place-items:center;
    font-size:19px;
    border:1px solid;
    flex-shrink:0;
}

.amber {
    background:#fff8e8;
    color:#c27d0a;
    border-color:#ffebbf;
}

.violet {
    background:#f3f0ff;
    color:#7460cf;
    border-color:#e5ddff;
}

.teal {
    background:#e9fbf6;
    color:#0a9e89;
    border-color:#c6f0e6;
}

.sky {
    background:#eaf8ff;
    color:#0284c7;
    border-color:#d0edff;
}

.red {
    background:#ffe9e9;
    color:#dc4c55;
    border-color:#ffd0d3;
}

.slate {
    background:#eef2f6;
    color:#5e7084;
    border-color:#e0e7ee;
}

.module-card h3 {
    margin-top:17px;
    margin-bottom:5px;
    letter-spacing:-.3px;
}

.module-card p {
    color:var(--muted);
    font-size:11px;
    line-height:1.8;
    margin-bottom:16px;
    max-width:220px;
}

.module-footer {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:5px;
    font-size:10px;
    color:#778b9d;
    margin-top:auto;
}

.module-footer>i {
    font-size:10px;
    color:#96aabc;
}

.mini-progress {
    height:4px;
    border-radius:4px;
    background:#eaf0f5;
    overflow:hidden;
    margin-top:11px;
}

.mini-progress>span {
    display:block;
    height:100%;
    background:var(--primary);
    border-radius:4px;
}

.teal-progress>span {
    background:#15b5a2;
}

.priority-label {
    font-family:var(--display-font);
    font-size:8px;
    letter-spacing:1px;
    font-weight:700;
    color:#cf5460;
    white-space:nowrap;
}

.priority-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;
}

.priority-card {
    padding:18px 16px;
    border-radius:18px;
    display:flex;
    flex-direction:column;
    transition:transform .2s;
}

.priority-card:hover {
    transform:translateY(-2px);
}

.critical-card {
    background:linear-gradient(130deg,rgba(255,243,244,.96),rgba(255,246,247,.72));
    border:1px solid #ffd9dd;
    box-shadow:0 8px 20px rgba(220,76,85,.025);
}

.small-badge {
    font-family:var(--display-font);
    font-size:8px;
    letter-spacing:.4px;
    font-weight:700;
    color:#c64350;
    background:#ffe9e9;
    border:1px solid #ffd5d9;
    border-radius:6px;
    padding:3px 5px;
    white-space:nowrap;
}

.neutral-badge {
    color:#64748b;
    background:#eff3f7;
    border-color:#e5eaf0;
}

.priority-card h3 {
    font-size:13px;
    margin-top:18px;
    margin-bottom:6px;
    letter-spacing:-.2px;
}

.priority-card p {
    color:#7c7f90;
    font-size:10px;
    margin-bottom:15px;
    line-height:1.7;
}

.priority-footer {
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-size:9px;
    gap:8px;
    color:#7b8d9f;
    margin-top:auto;
}

.critical-card .priority-footer {
    color:#ce5461;
}

.simulation-card {
    padding:20px;
}

.inline-heading {
    display:flex;
    align-items:center;
    gap:10px;
}

.inline-heading .module-icon {
    height:34px;
    width:34px;
    border-radius:10px;
    font-size:15px;
}

.inline-heading h2 {
    font-size:15px;
    letter-spacing:-.4px;
}

.inline-heading p {
    font-size:10px;
    color:var(--muted);
    margin-top:2px;
}

.simulation-preview {
    display:block;
    height:164px;
    overflow:hidden;
    border-radius:13px;
    position:relative;
    background:#173c4c;
}

.simulation-preview video {
    width:100%;
    height:100%;
    object-fit:cover;
    pointer-events:none;
    filter:saturate(.75);
}

.simulation-overlay {
    position:absolute;
    inset:0;
    background:linear-gradient(0deg,rgba(9,26,44,.9),rgba(9,26,44,0) 80%);
    display:flex;
    align-items:flex-end;
    padding:16px;
    color:white;
    gap:16px;
}

.simulation-overlay>span:first-child {
    flex:1;
}

.simulation-overlay small {
    font-family:var(--display-font);
    font-size:8px;
    letter-spacing:1.4px;
    color:#bbd9e6;
    display:block;
    margin-bottom:3px;
}

.simulation-overlay strong {
    display:block;
    font-size:12px;
    line-height:1.55;
}

.play-circle {
    height:34px;
    width:34px;
    display:grid;
    place-items:center;
    background:#028bc7;
    border:1px solid #42c1ed;
    border-radius:50%;
    font-size:11px;
    flex-shrink:0;
}

.simulation-link {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-top:15px;
    font-size:9px;
    color:var(--muted);
}

.simulation-link strong {
    font-weight:600;
    color:var(--primary-dark);
    white-space:nowrap;
}

.simulation-link i {
    font-size:8px;
    margin-left:4px;
}

.utility-grid {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
}

.utility-card {
    display:flex;
    align-items:center;
    flex-direction:column;
    justify-content:center;
    padding:16px 4px 13px;
    gap:10px;
    background:var(--surface);
    border:1px solid white;
    border-radius:15px;
    box-shadow:var(--shadow);
    transition:transform .2s;
}

.utility-card .module-icon {
    width:34px;
    height:34px;
    border-radius:10px;
    font-size:17px;
}

.utility-card strong {
    font-size:10px;
    font-weight:600;
    white-space:nowrap;
}

.download-panel {
    padding:16px;
}

.download-panel summary {
    display:flex;
    align-items:center;
    gap:10px;
    cursor:pointer;
    list-style:none;
}

.download-panel summary::-webkit-details-marker {
    display:none;
}

.download-panel summary>span:nth-child(2) {
    flex:1;
}

.download-panel summary strong,.download-panel summary small {
    display:block;
}

.download-panel summary strong {
    font-size:11px;
}

.download-panel summary small {
    font-size:9px;
    color:var(--muted);
    margin-top:2px;
}

.download-panel .module-icon {
    width:34px;
    height:38px;
    font-size:17px;
}

.qr-label {
    display:flex;
    align-items:center;
    gap:5px;
    border:1px solid #e0eaf2;
    padding:6px 8px;
    border-radius:8px;
    font-size:9px;
    color:#61798e;
    background:#f5f9fc;
    white-space:nowrap;
}

.qr-label i {
    color:var(--primary);
}

.download-links {
    display:flex;
    justify-content:center;
    gap:28px;
    margin-top:18px;
    padding-top:18px;
    border-top:1px solid var(--line);
}

.download-links a {
    display:flex;
    flex-direction:column;
    align-items:center;
    font-size:12px;
    gap:8px;
}

.download-links img {
    width:120px;
    border-radius:12px;
}

.home-ad {
    width:100%;
    min-width:0;
    margin-top:32px;
}

.app-footer {
    text-align:center;
    margin-top:44px;
    font-size:10px;
    color:#8b9aaf;
}

.app-footer>span {
    font-family:var(--display-font);
    font-weight:600;
    letter-spacing:1.3px;
    font-size:9px;
}

.app-footer>span>span {
    margin:0 8px;
    color:#bed0dc;
}

.app-footer p {
    font-size:10px;
    margin-top:8px;
}

.app-footer a:hover {
    color:var(--primary);
}

.bottom-nav {
    position:fixed;
    z-index:1000;
    bottom:calc(20px + env(safe-area-inset-bottom));
    left:50%;
    transform:translateX(-50%);
    width:460px;
    max-width:calc(100% - 32px);
    display:grid;
    grid-template-columns:repeat(4,1fr);
    border-radius:22px;
    background:rgba(255,255,255,.91);
    border:1px solid rgba(255,255,255,.95);
    backdrop-filter:blur(24px);
    -webkit-backdrop-filter:blur(24px);
    padding:7px;
    box-shadow:0 10px 40px rgba(31,63,89,.14),0 0 0 1px rgba(15,23,42,.025);
}

.bottom-nav a {
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;
    min-height:55px;
    font-size:10px;
    color:#788ba0;
    border-radius:15px;
    transition:background .15s;
}

.bottom-nav a i {
    font-size:18px;
}

.bottom-nav a.active {
    color:var(--primary);
    background:#eef8fe;
}

.bottom-nav a:hover {
    background:#f3f8fc;
}

.head-navigation {
    padding:0 0 18px;
    margin:0 0 24px;
    border-bottom:1px solid var(--line);
    box-shadow:none;
    align-items:center;
    gap:12px;
    min-height:60px;
}

.head-navigation .left,.head-navigation .right {
    width:44px;
    min-height:44px;
    padding:0;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:12px;
    font-size:17px;
    flex-shrink:0;
}

.head-navigation .left {
    background:rgba(255,255,255,.85);
    border:1px solid white;
}

.head-navigation .center {
    flex:1;
    width:auto;
    text-align:left;
    justify-content:flex-start;
    font-size:21px;
    letter-spacing:-.5px;
}

.page {
    padding:0;
}

.btn {
    border-radius:10px;
    line-height:1.5;
    padding:12px 20px;
    min-height:44px;
    border:1px solid #dce9f2;
    background:white;
}

.btn.btn-danger {
    background:#dc4c55;
    border-color:#dc4c55;
}

.toast-top-center {
    top:100px;
}

input[type=radio],input[type=checkbox] {
    accent-color:var(--primary);
}

.progress-page,.tools-page {
    max-width:960px;
    margin:auto;
}

.page-intro {
    margin-bottom:28px;
}

.page-intro h1 {
    font-size:32px;
    margin-bottom:8px;
}

.page-intro>p:last-child {
    font-size:13px;
    color:var(--muted);
}

.progress-summary {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:16px;
    margin:24px 0;
}

.progress-summary .metric {
    padding:20px;
}

.progress-summary .metric>strong {
    font-size:30px;
    margin-top:5px;
}

.topic-progress-list {
    display:flex;
    flex-direction:column;
    gap:12px;
}

.topic-progress-card {
    display:grid;
    grid-template-columns:1fr auto;
    gap:10px;
    padding:20px 24px;
}

.topic-progress-card h2 {
    font-size:14px;
    letter-spacing:0;
}

.topic-progress-card>span {
    color:var(--primary-dark);
    font-size:12px;
    font-family:var(--display-font);
}

.topic-progress-card .mini-progress {
    grid-column:1/-1;
    margin:0;
}

.progress-note {
    padding:20px;
    margin-top:24px;
    color:var(--muted);
    font-size:12px;
}

.progress-note .text-link {
    font-size:12px;
}

.tools-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px;
}

.tools-grid .module-card {
    min-height:200px;
}

.progress-page>.primary-cta {
    margin-top:24px;
    max-width:440px;
}

.route-content .ng-view>p:empty {
    display:none;
}

@media(min-width:1400px) {
    .route-content {
        padding-top:44px;
    }
    .welcome-row {
        margin-bottom:36px;
    }
    .welcome-row h1 {
        font-size:40px;
    }
}

@media(max-width:1199px) {
    .header-inner {
        padding:0 32px;
    }
    .route-content {
        padding:28px 32px 124px;
    }
    .welcome-row h1 {
        font-size:32px;
    }
    .welcome-row h1 br {
        display:block;
    }
    .dashboard-grid {
        gap:22px;
        grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);
    }
    .header-note {
        display:none;
    }
    .readiness-body {
        gap:14px;
    }
    .progress-gauge {
        width:130px;
        height:130px;
    }
    .readiness-card {
        padding:20px;
    }
    .metric {
        padding:10px;
    }
    .priority-grid {
        gap:10px;
    }
    .priority-card {
        padding:14px 12px;
    }
    .priority-card .module-icon {
        height:34px;
        width:34px;
        font-size:16px;
    }
    .priority-card .small-badge {
        font-size:7px;
    }
    .download-panel summary strong {
        font-size:10px;
    }
}

@media(max-width:900px) and (min-width:768px) {
    .dashboard-grid {
        grid-template-columns:1fr;
    }
    .dashboard-primary {
        display:grid;
        grid-template-columns:1fr 1fr;
        align-items:start;
        gap:20px;
    }
    .readiness-body {
        flex-direction:column;
    }
    .metric-grid {
        width:100%;
    }
    .module-card {
        padding:14px;
        min-height:189px;
    }
    .module-card h3 {
        font-size:13px;
    }
    .module-card p {
        font-size:10px;
    }
    .dashboard-secondary {
        display:grid;
        grid-template-columns:1fr 1fr;
        align-items:start;
        gap:24px;
    }
    .dashboard-secondary>section:first-child {
        grid-column:1;
    }
    .dashboard-secondary>.simulation-card {
        grid-column:2;
        grid-row:1/3;
    }
    .priority-card p {
        min-height:34px;
    }
    .tools-grid {
        grid-template-columns:repeat(2,1fr);
    }
}

@media(max-width:767px) {
    body {
        font-size:14px;
    }
    .header-inner {
        height:72px;
        padding:0 16px;
        gap:8px;
    }
    .brand {
        gap:8px;
    }
    .brand-symbol {
        height:34px;
        width:34px;
        font-size:17px;
        border-radius:10px;
    }
    .brand-name {
        font-size:18px;
    }
    .brand-name small {
        font-size:8px;
        padding:2px 4px;
        margin-left:2px;
    }
    .brand-caption {
        font-size:8px;
    }
    .header-actions {
        gap:6px;
    }
    .header-help {
        display:none;
    }
    .icon-button {
        width:36px;
        height:40px;
        font-size:15px;
        border-radius:11px;
    }
    .license-switch {
        gap:6px;
        padding:8px 10px;
        min-height:40px;
        font-size:10px;
    }
    .license-switch>i:first-child {
        display:none;
    }
    .license-switch strong {
        font-size:12px;
    }
    .license-switch>i:last-child {
        font-size:8px;
    }
    .route-content {
        padding:24px 16px 116px;
    }
    .dashboard {
        max-width:560px;
    }
    .welcome-row {
        display:block;
        margin-bottom:24px;
    }
    .welcome-row .eyebrow {
        font-size:8px;
        letter-spacing:1.3px;
    }
    .welcome-row h1 {
        font-size:30px;
        line-height:1.3;
        letter-spacing:-1.1px;
        margin-bottom:10px;
    }
    .welcome-row h1 br {
        display:none;
    }
    .welcome-row h1 span {
        display:block;
    }
    .welcome-row>div>p:last-child {
        font-size:11px;
        max-width:310px;
        line-height:1.8;
    }
    .edition-pill {
        padding:11px 14px;
        margin-top:20px;
        gap:10px;
        border-radius:12px;
    }
    .edition-icon {
        font-size:20px;
    }
    .edition-pill>span:nth-child(2) {
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:20px;
        flex:1;
    }
    .edition-pill strong {
        font-size:11px;
    }
    .edition-pill small {
        font-size:10px;
        margin:0;
    }
    .edition-pill>i {
        margin:0;
    }
    .dashboard-grid {
        grid-template-columns:1fr;
        gap:26px;
    }
    .dashboard-primary,.dashboard-secondary {
        gap:26px;
    }
    .readiness-card {
        padding:20px;
    }
    .section-heading {
        margin-bottom:14px;
    }
    .section-heading h2 {
        font-size:17px;
    }
    .section-heading .eyebrow {
        font-size:8px;
        letter-spacing:1.3px;
    }
    .readiness-body {
        gap:18px;
        padding-top:6px;
        padding-bottom:18px;
    }
    .progress-gauge {
        width:124px;
        height:124px;
    }
    .progress-gauge strong {
        font-size:33px;
    }
    .progress-gauge>div>span {
        font-size:7px;
        letter-spacing:1px;
    }
    .metric-grid {
        gap:8px;
    }
    .metric {
        padding:9px 10px;
    }
    .metric>span {
        font-size:9px;
    }
    .metric>strong {
        font-size:20px;
    }
    .metric strong small {
        font-size:9px;
    }
    .primary-cta {
        padding:13px 15px;
    }
    .primary-cta strong {
        font-size:13px;
    }
    .primary-cta small {
        font-size:10px;
    }
    .card-footnote {
        font-size:8px;
    }
    .module-grid {
        gap:12px;
    }
    .module-card {
        padding:17px;
        min-height:194px;
        border-radius:17px;
    }
    .module-card h3 {
        font-size:14px;
    }
    .module-card p {
        font-size:10px;
    }
    .module-footer {
        font-size:9px;
    }
    .module-icon {
        width:39px;
        height:39px;
        font-size:18px;
    }
    .priority-grid {
        gap:12px;
    }
    .priority-card {
        padding:18px 16px;
    }
    .priority-card .module-icon {
        width:38px;
        height:38px;
        font-size:18px;
    }
    .priority-card h3 {
        font-size:14px;
    }
    .priority-card p {
        font-size:11px;
    }
    .priority-card .small-badge {
        font-size:8px;
    }
    .priority-footer {
        font-size:9px;
    }
    .simulation-card {
        padding:18px;
    }
    .inline-heading h2 {
        font-size:15px;
    }
    .simulation-preview {
        height:178px;
    }
    .simulation-link {
        font-size:10px;
    }
    .utility-grid {
        gap:10px;
    }
    .utility-card {
        padding:17px 4px 14px;
    }
    .utility-card strong {
        font-size:10px;
    }
    .download-panel summary strong {
        font-size:11px;
    }
    .download-panel summary small {
        font-size:9px;
    }
    .bottom-nav {
        bottom:calc(12px + env(safe-area-inset-bottom));
        border-radius:22px;
        width:420px;
    }
    .bottom-nav a {
        min-height:54px;
    }
    .app-footer {
        margin-top:32px;
    }
    .app-footer>span {
        font-size:8px;
        letter-spacing:1px;
    }
    .app-footer p {
        font-size:9px;
    }
    .head-navigation .center {
        font-size:18px;
    }
    .head-navigation {
        margin-bottom:20px;
        padding-bottom:16px;
        gap:10px;
    }
    .page-intro h1 {
        font-size:27px;
    }
    .progress-summary {
        grid-template-columns:repeat(2,1fr);
        gap:12px;
    }
    .progress-summary .metric {
        padding:16px;
    }
    .tools-grid {
        grid-template-columns:repeat(2,1fr);
        gap:12px;
    }
    .topic-progress-card {
        padding:18px;
        gap:12px;
    }
    .topic-progress-card h2 {
        font-size:13px;
    }
    .topic-progress-card>span {
        font-size:11px;
        white-space:nowrap;
    }
}

@media(max-width:374px) {
    .header-inner {
        padding:0 12px;
    }
    .brand-symbol {
        display:none;
    }
    .brand-name {
        font-size:17px;
    }
    .header-actions {
        gap:5px;
    }
    .license-switch {
        padding:8px;
    }
    .route-content {
        padding-left:12px;
        padding-right:12px;
    }
    .readiness-card {
        padding:16px;
    }
    .progress-gauge {
        width:100px;
        height:100px;
    }
    .readiness-body {
        gap:12px;
    }
    .metric-grid {
        gap:6px;
    }
    .metric {
        padding:8px;
    }
    .metric>span {
        font-size:8px;
    }
    .metric>strong {
        font-size:18px;
    }
    .progress-gauge strong {
        font-size:28px;
    }
    .progress-gauge>div>span {
        font-size:6px;
    }
    .module-card {
        padding:14px;
    }
    .priority-card {
        padding:14px 12px;
    }
    .priority-card h3 {
        font-size:12px;
    }
    .priority-card .small-badge {
        font-size:7px;
    }
    .download-panel {
        padding:12px;
    }
    .download-panel summary strong {
        font-size:10px;
    }
    .qr-label {
        font-size:8px;
        padding:5px;
    }
    .inline-heading h2 {
        font-size:13px;
    }
    .simulation-link {
        font-size:9px;
    }
}

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

/* Keep the source legal document readable within the application shell. */
.law-page {
    max-width:900px;
    margin:auto;
}

.law-reading-note {
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:20px;
    font-size:12px;
    color:var(--muted);
}

.law-reading-note>i {
    color:var(--primary);
}

.law-reading-note a {
    margin-left:auto;
    color:var(--primary-dark);
    white-space:nowrap;
}

.law-document {
    padding:36px;
    font-size:15px;
    line-height:1.9;
    overflow-wrap:anywhere;
}

.law-document table {
    width:100%;
    table-layout:fixed;
    font-size:13px;
}

.law-document td {
    width:auto!important;
}

.law-document a[name] {
    scroll-margin-top:110px;
}

.law-highlight {
    background:#e0f2fe;
}

.law-back-top {
    display:flex;
    align-items:center;
    gap:8px;
    margin:24px auto 0;
    padding:12px 20px;
    border:1px solid #d7e6f1;
    border-radius:12px;
    color:var(--primary-dark);
    background:white;
}

.simulation-preview img {
    width:100%;
    height:100%;
    object-fit:cover;
    filter:saturate(.75);
}

@media(min-width:768px) {
    .module-card p {
        font-size:12px;
    }
    .priority-card p {
        font-size:11px;
    }
    .priority-footer {
        font-size:10px;
    }
    .utility-card strong {
        font-size:11px;
    }
    .module-footer {
        font-size:11px;
    }
    .card-footnote {
        font-size:10px;
    }
}

@media(max-width:767px) {
    .module-card p {
        font-size:11px;
    }
    .module-footer {
        font-size:10px;
    }
    .law-document {
        padding:20px 16px;
        font-size:14px;
    }
    .law-document table {
        font-size:10px;
    }
    .law-reading-note {
        font-size:10px;
    }
    .law-reading-note>i {
        display:none;
    }
}