
.kbt-atlas {
    --atlas-red:#7f1d1d;
    --atlas-red-dark:#5f1515;
    --atlas-ink:#171717;
    --atlas-muted:#5f6368;
    --atlas-line:#d7d7d7;
    --atlas-paper:#ffffff;
    --atlas-soft:#f6f4f1;
    --atlas-green:#166534;
    max-width:1180px;
    margin:0 auto;
    color:var(--atlas-ink);
    font-family:inherit;
}
.kbt-atlas * { box-sizing:border-box; }
.kbt-atlas__hero {
    width:100%;
    padding:24px 26px;
    border:1px solid var(--atlas-line);
    border-radius:14px;
    background:var(--atlas-soft);
}
.kbt-atlas__hero h1 {
    width:100%;
    max-width:none;
    margin:4px 0 8px;
    font-size:clamp(26px,3.4vw,40px);
    line-height:1.08;
    letter-spacing:-.025em;
}
.kbt-atlas__hero p {
    width:100%;
    max-width:none;
    margin:0;
    font-size:14px;
    line-height:1.55;
    color:#454545;
}
.kbt-atlas__eyebrow {
    font-size:11px;
    font-weight:800;
    letter-spacing:.09em;
    text-transform:uppercase;
    color:var(--atlas-red);
}
.kbt-atlas__chooser,
.kbt-atlas__panel,
.kbt-atlas__theme-head {
    margin-top:24px;
    padding:22px;
    border:1px solid var(--atlas-line);
    border-radius:14px;
    background:var(--atlas-paper);
}
.kbt-atlas__chooser {
    background:var(--atlas-soft);
}
.kbt-atlas__chooser h2,
.kbt-atlas__panel h2,
.kbt-atlas__theme-head h2 {
    margin:0 0 5px;
    color:var(--atlas-ink);
}
.kbt-atlas__chooser p,
.kbt-atlas__section-head p,
.kbt-atlas__theme-head p {
    margin:0;
    color:var(--atlas-muted);
    line-height:1.5;
}
.kbt-atlas__search-row {
    position:relative;
    margin-top:16px;
}
.kbt-atlas__search {
    width:100%;
    min-height:52px;
    padding:12px 15px;
    border:2px solid #555;
    border-radius:9px;
    background:#fff;
    color:#111;
    font-size:14px;
}
.kbt-atlas__search:focus {
    outline:3px solid rgba(127,29,29,.22);
    border-color:var(--atlas-red);
}
.kbt-atlas__search-results {
    position:absolute;
    z-index:20;
    top:58px;
    width:100%;
    max-height:320px;
    overflow:auto;
    border:1px solid #aaa;
    border-radius:9px;
    background:#fff;
    box-shadow:0 12px 28px rgba(0,0,0,.13);
}
.kbt-atlas__search-results button {
    display:block;
    width:100%;
    padding:12px 14px;
    border:0;
    border-bottom:1px solid #eee;
    background:#fff;
    color:#111;
    text-align:left;
    cursor:pointer;
}
.kbt-atlas__search-results button:hover,
.kbt-atlas__search-results button:focus {
    background:#f4ecec;
    color:var(--atlas-red);
}
.kbt-atlas__popular {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:13px;
}
.kbt-atlas__chip,
.kbt-atlas__jump button,
.kbt-atlas__compare-controls button {
    border:1px solid var(--atlas-red);
    border-radius:999px;
    background:#fff;
    color:var(--atlas-red);
    font-weight:800;
    cursor:pointer;
}
.kbt-atlas__chip {
    padding:7px 10px;
}
.kbt-atlas__chip:hover,
.kbt-atlas__chip:focus,
.kbt-atlas__jump button:hover,
.kbt-atlas__jump button:focus {
    background:var(--atlas-red);
    color:#fff;
}
.kbt-atlas__loading,
.kbt-atlas__error {
    margin:24px 0;
    padding:18px;
    border-radius:9px;
}
.kbt-atlas__loading { background:#f4f4f4; }
.kbt-atlas__error {
    border:1px solid #b91c1c;
    background:#fef2f2;
    color:#7f1d1d;
}
.kbt-atlas__jump {
    position:sticky;
    top:8px;
    z-index:10;
    display:flex;
    gap:8px;
    width:max-content;
    max-width:100%;
    margin:18px auto 0;
    padding:7px;
    border:1px solid var(--atlas-line);
    border-radius:999px;
    background:rgba(255,255,255,.95);
    box-shadow:0 5px 18px rgba(0,0,0,.08);
}
.kbt-atlas__jump button {
    padding:8px 13px;
}
.kbt-atlas__stats {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:10px;
    margin-top:14px;
}
.kbt-atlas__stat {
    padding:14px;
    border:1px solid var(--atlas-line);
    border-radius:10px;
    background:#fff;
}
.kbt-atlas__stat-label {
    color:var(--atlas-muted);
    font-size:11px;
    font-weight:800;
    letter-spacing:.05em;
    text-transform:uppercase;
}
.kbt-atlas__stat-value {
    margin-top:4px;
    font-size:20px;
    font-weight:850;
}
.kbt-atlas__section-head {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
}
.kbt-atlas__help {
    border:0;
    background:none;
    color:var(--atlas-red);
    font-weight:800;
    cursor:pointer;
    text-decoration:underline;
}
.kbt-atlas__helpbox {
    margin:13px 0;
    padding:12px 14px;
    border-left:4px solid var(--atlas-red);
    background:#faf7f7;
    color:#444;
    line-height:1.55;
}
.kbt-atlas__chart,
.kbt-atlas__compare-chart {
    margin-top:16px;
    min-height:300px;
}
.kbt-atlas svg {
    display:block;
    width:100%;
    height:auto;
}
.kbt-atlas__axis {
    stroke:#bbb;
    stroke-width:1;
}
.kbt-atlas__grid {
    stroke:#e5e5e5;
    stroke-width:1;
}
.kbt-atlas__trend-line {
    fill:none;
    stroke:var(--atlas-red);
    stroke-width:3;
}
.kbt-atlas__trend-line--compare {
    stroke:#374151;
    stroke-dasharray:8 5;
}
.kbt-atlas__point {
    fill:#fff;
    stroke:var(--atlas-red);
    stroke-width:2;
}
.kbt-atlas__point--compare { stroke:#374151; }
.kbt-atlas__chart-label {
    fill:#666;
    font-size:11px;
}
.kbt-atlas__signals {
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:10px;
    margin-top:18px;
}
.kbt-atlas__signal {
    padding:13px;
    border-left:4px solid var(--atlas-red);
    border-radius:7px;
    background:#fafafa;
}
.kbt-atlas__signal strong {
    display:block;
    margin-bottom:3px;
}
.kbt-atlas__signal p {
    margin:0;
    color:#4b5563;
    line-height:1.45;
}
.kbt-atlas__network {
    margin:15px auto 0;
    max-width:760px;
}
.kbt-atlas__network-node {
    cursor:pointer;
}
.kbt-atlas__network-node circle {
    fill:#fff;
    stroke:#777;
    stroke-width:1.5;
}
.kbt-atlas__network-node--center circle {
    fill:var(--atlas-red);
    stroke:var(--atlas-red);
}
.kbt-atlas__network-node text {
    fill:#222;
    font-size:11px;
    font-weight:700;
}
.kbt-atlas__network-node--center text {
    fill:#fff;
}
.kbt-atlas__network-edge {
    stroke:#bbb;
}
.kbt-atlas__connection-list {
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:8px;
    margin-top:14px;
}
.kbt-atlas__connection {
    display:flex;
    justify-content:space-between;
    gap:12px;
    padding:10px 12px;
    border:1px solid var(--atlas-line);
    border-radius:8px;
    background:#fff;
    color:#111;
    text-decoration:none;
}
.kbt-atlas__connection:hover,
.kbt-atlas__connection:focus {
    border-color:var(--atlas-red);
    color:var(--atlas-red);
}
.kbt-atlas__connection small {
    color:var(--atlas-muted);
}
.kbt-atlas__compare-controls {
    display:flex;
    gap:9px;
    margin-top:14px;
}
.kbt-atlas__compare-controls select {
    flex:1;
    min-height:44px;
    padding:9px;
    border:1px solid #777;
    border-radius:7px;
    background:#fff;
    color:#111;
}
.kbt-atlas__compare-controls button {
    padding:9px 15px;
    border-radius:7px;
    background:var(--atlas-red);
    color:#fff;
}
.kbt-atlas__method {
    margin:20px 0;
    padding:13px 15px;
    border:1px solid var(--atlas-line);
    border-radius:9px;
    background:#fff;
}
.kbt-atlas__method summary {
    cursor:pointer;
    font-weight:800;
    color:var(--atlas-red);
}
.kbt-atlas__method p {
    color:#4b5563;
    line-height:1.6;
}
@media (max-width:780px) {
    .kbt-atlas { padding:0 12px; }
    .kbt-atlas__stats { grid-template-columns:repeat(2,1fr); }
    .kbt-atlas__signals,
    .kbt-atlas__connection-list { grid-template-columns:1fr; }
    .kbt-atlas__section-head { display:block; }
    .kbt-atlas__help { margin-top:8px; padding:0; }
    .kbt-atlas__compare-controls { display:grid; }
}


/* v1.0.1 compact typography */
.kbt-atlas__chooser h2,
.kbt-atlas__panel h2,
.kbt-atlas__theme-head h2 {
    font-size:22px;
    line-height:1.2;
}

.kbt-atlas__chooser p,
.kbt-atlas__section-head p,
.kbt-atlas__theme-head p,
.kbt-atlas__helpbox,
.kbt-atlas__method p {
    font-size:13px;
}

.kbt-atlas__chip,
.kbt-atlas__jump button,
.kbt-atlas__compare-controls button,
.kbt-atlas__help {
    font-size:12px;
}

.kbt-atlas__search-results button,
.kbt-atlas__connection {
    font-size:13px;
}

.kbt-atlas__signal strong {
    font-size:13px;
}

.kbt-atlas__signal p {
    font-size:12px;
}

.kbt-atlas__method summary {
    font-size:13px;
}

@media (max-width:780px) {
    .kbt-atlas__hero {
        padding:20px 18px;
    }

    .kbt-atlas__hero h1 {
        font-size:28px;
    }

    .kbt-atlas__hero p {
        font-size:13px;
    }
}


/* v1.0.2 search control normalization */
.kbt-atlas .kbt-atlas__search {
    display:block !important;
    width:100% !important;
    height:46px !important;
    min-height:46px !important;
    max-height:46px !important;
    margin:0 !important;
    padding:0 14px !important;
    border:2px solid var(--atlas-red) !important;
    border-radius:8px !important;
    background:#ffffff !important;
    color:#171717 !important;
    font-family:inherit !important;
    font-size:14px !important;
    font-weight:400 !important;
    line-height:42px !important;
    letter-spacing:normal !important;
    box-shadow:none !important;
    appearance:none !important;
    -webkit-appearance:none !important;
}

.kbt-atlas .kbt-atlas__search::placeholder {
    color:#737373 !important;
    opacity:1 !important;
    font-size:14px !important;
}

.kbt-atlas .kbt-atlas__search:focus {
    outline:3px solid rgba(127,29,29,.18) !important;
    outline-offset:1px !important;
    border-color:var(--atlas-red-dark) !important;
    box-shadow:none !important;
}

.kbt-atlas__search-row {
    margin-top:14px;
}

.kbt-atlas__search-results {
    top:52px;
}

@media (max-width:780px) {
    .kbt-atlas .kbt-atlas__search {
        height:44px !important;
        min-height:44px !important;
        max-height:44px !important;
        line-height:40px !important;
        font-size:13px !important;
    }

    .kbt-atlas__search-results {
        top:50px;
    }
}


/* v1.0.3 search width containment */
.kbt-atlas .kbt-atlas__search-row {
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
    padding:0 10px !important;
    margin:14px 0 0 !important;
}

.kbt-atlas .kbt-atlas__search {
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
    margin:0 !important;
}

.kbt-atlas .kbt-atlas__search-results {
    left:10px !important;
    right:10px !important;
    width:auto !important;
    max-width:none !important;
    box-sizing:border-box !important;
}

@media (max-width:780px) {
    .kbt-atlas .kbt-atlas__search-row {
        padding:0 4px !important;
    }

    .kbt-atlas .kbt-atlas__search-results {
        left:4px !important;
        right:4px !important;
    }
}


/* v1.0.4 comparison chart legend */
.kbt-atlas__compare-legend {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:10px 18px;
    margin:16px 0 4px;
    padding:10px 12px;
    border:1px solid var(--atlas-line);
    border-radius:8px;
    background:#fafafa;
}

.kbt-atlas__compare-legend[hidden] {
    display:none !important;
}

.kbt-atlas__legend-item {
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-width:0;
    color:#222;
    font-size:12px;
    font-weight:800;
    line-height:1.25;
}

.kbt-atlas__legend-line {
    display:inline-block;
    width:34px;
    height:0;
    flex:0 0 34px;
    border-top:3px solid var(--atlas-red);
}

.kbt-atlas__legend-line--compare {
    border-top-color:#374151;
    border-top-style:dashed;
}

@media (max-width:780px) {
    .kbt-atlas__compare-legend {
        display:grid;
        gap:8px;
    }

    .kbt-atlas__legend-item {
        font-size:11px;
    }
}
