/* Clash Compass — a strategy atlas, October 2026. Shared shell and public tools. */
:root { --cc-paper:#f7f5ef; --cc-surface:#fffef9; --cc-ink:#263024; --cc-muted:#6b7065; --cc-line:#d9ddcf; --cc-accent:#a45132; --cc-olive:#344b32; --cc-soft:#e9ecdf; --cc-sans:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; --cc-display:Georgia,'Times New Roman',serif; }
:root[data-theme=dark] { --cc-paper:#181f19; --cc-surface:#202a21; --cc-ink:#f1efdf; --cc-muted:#b4bca9; --cc-line:#3a4636; --cc-accent:#e3ab7c; --cc-olive:#d1d9bd; --cc-soft:#2c3829; }
html[data-theme] body.compass-app { --paper:var(--cc-paper); --surface:var(--cc-surface); --surface-2:var(--cc-soft); --control:var(--cc-surface); --subtle:var(--cc-soft); --ink:var(--cc-ink); --muted:var(--cc-muted); --line:var(--cc-line); --accent:var(--cc-accent); --accent-soft:var(--cc-soft); --ab-text:var(--cc-ink); --ab-soft:var(--cc-muted); --ab-line:var(--cc-line); background:var(--cc-paper)!important; color:var(--cc-ink)!important; font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; }
html[data-theme] .compass-app :is(input,select,textarea) { color:var(--cc-ink); accent-color:var(--cc-accent); }
.compass-app :is(a,button,input,select,textarea):focus-visible { outline:2px solid var(--cc-accent)!important; outline-offset:4px; }
.compass-app .cc-topline { min-height:34px; display:flex; justify-content:space-between; align-items:center; gap:18px; padding:8px max(28px,calc((100vw - 1360px)/2)); background:var(--cc-ink); color:var(--cc-paper); font-size:9px; font-weight:650; letter-spacing:.17em; }
.cc-topline a { color:inherit; text-decoration:none; letter-spacing:.12em; }
html[data-theme] body.compass-app .cc-header { max-width:none; min-height:94px; padding:17px max(28px,calc((100vw - 1360px)/2)); grid-template-columns:auto minmax(0,1fr) auto auto auto; grid-template-areas:'brand primary language theme menu'; gap:16px; border-bottom:1px solid var(--cc-line)!important; background:var(--cc-paper)!important; }
html[data-theme] body.compass-app .cc-header .brand { gap:11px; font-size:22px; font-weight:750; letter-spacing:-.055em; }
.cc-brand-mark { width:42px; height:42px; color:var(--cc-olive); flex-shrink:0; }
.cc-header .brand small { display:block; margin-top:5px; font-size:8px; font-weight:550; letter-spacing:.19em; }
.cc-header .compass-primary { gap:20px; }
html[data-theme] .cc-header .compass-primary a { font-size:12px; padding:10px 0; border-radius:0; border-bottom:1px solid transparent; color:var(--cc-muted); background:none; min-height:44px; font-weight:600; }
html[data-theme] .cc-header .compass-primary a:is(.active,:hover) { color:var(--cc-ink); border-bottom-color:var(--cc-accent); background:none; }
html[data-theme] body.compass-app .cc-header :is(.theme-toggle,.nav-toggle) { border:1px solid var(--cc-line); background:transparent; border-radius:50%; width:38px; height:38px; min-width:38px; }
html[data-theme] body.compass-app .cc-header .mobile-search-button { display:none!important; }
html[data-theme] body.compass-app .cc-header .language-control select { width:84px; font-size:11px; min-height:40px; }
html[data-theme] body.compass-app .cc-header .header-nav.is-open { padding:24px 0; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0 26px; }
html[data-theme] body.compass-app .cc-header .header-nav a { border-radius:0; border-bottom:1px solid var(--cc-line); font-size:13px; padding:12px 0; }
html[data-theme] body.compass-app #app { width:min(1360px,calc(100% - 56px)); padding-top:36px; padding-bottom:64px; margin-inline:auto; min-height:50vh; }
html[data-theme] body.compass-app.home-route #app { padding-top:0; }
.cc-home { max-width:100%; }
.cc-eyebrow { margin:0 0 20px; font-size:10px!important; font-weight:650; letter-spacing:.16em; line-height:1.7!important; text-transform:uppercase; color:var(--cc-muted)!important; }
.cc-cross { color:var(--cc-accent); margin-right:9px; font-size:17px; vertical-align:middle; }
.cc-home-hero { display:grid; grid-template-columns:1fr 1.05fr; min-height:560px; align-items:center; position:relative; gap:20px; }
.cc-hero-copy { padding:64px 0 58px; position:relative; z-index:1; }
html[data-theme] body.compass-app #app .cc-home-hero h1 { font:500 clamp(42px,4.5vw,68px)/1.08 var(--cc-display)!important; letter-spacing:-.065em; margin:22px 0 27px; color:var(--cc-ink)!important; text-wrap:balance; }
.cc-home h1 em,.cc-home h2 em { font-weight:400; color:var(--cc-olive); }
.cc-hero-description { max-width:390px; font-size:15px; line-height:1.85; color:var(--cc-muted); margin:0 0 30px; }
.cc-actions { display:flex; align-items:center; gap:28px; flex-wrap:wrap; }
html[data-theme] body.compass-app :is(a,button).cc-button { display:inline-flex; align-items:center; justify-content:center; gap:24px; min-height:48px; padding:15px 22px; border:1px solid var(--cc-ink)!important; border-radius:3px!important; color:var(--cc-paper)!important; background:var(--cc-ink)!important; text-decoration:none; box-shadow:none!important; font:600 12px/1.3 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; cursor:pointer; }
.cc-button:hover { opacity:.85; }
.cc-text-link { display:inline-flex; align-items:center; gap:22px; color:var(--cc-ink); font-size:12px; font-weight:600; text-decoration:none; border-bottom:1px solid var(--cc-line); padding-block:10px; }
.cc-text-link:hover { color:var(--cc-accent); border-color:var(--cc-accent); }
.cc-hero-note { display:flex; gap:11px; align-items:center; margin-top:38px; color:var(--cc-muted); font-size:10px; line-height:1.8; }
.cc-hero-note strong { font-weight:500; }
.cc-seal { display:grid; place-items:center; width:30px; height:30px; font-size:16px; border:1px solid var(--cc-line); border-radius:50%; color:var(--cc-accent); }
.cc-hero-art { position:relative; display:flex; align-items:center; justify-content:center; align-self:stretch; overflow:hidden; }
.cc-art-grid { position:absolute; width:520px; height:520px; border-radius:50%; background:repeating-linear-gradient(0deg,transparent,transparent 39px,var(--cc-line) 40px),repeating-linear-gradient(90deg,transparent,transparent 39px,var(--cc-line) 40px); opacity:.65; mask-image:radial-gradient(circle,#000 15%,transparent 72%); }
.cc-hero-base { display:block; width:112%; max-width:740px; height:auto; position:relative; filter:drop-shadow(0 28px 18px #26302420); transform:rotate(-5deg); }
.cc-art-coordinate { position:absolute; font-size:9px; letter-spacing:.18em; color:var(--cc-muted); }
.cc-art-coordinate-top { top:49px; right:15px; }
.cc-art-coordinate-bottom { bottom:44px; left:42px; }
.cc-art-label { position:absolute; bottom:72px; right:18px; display:flex; align-items:center; gap:15px; padding:15px 18px; max-width:94%; border:1px solid var(--cc-line); background:var(--cc-surface); color:var(--cc-ink); font-size:10px; box-shadow:0 12px 30px #26302408; text-decoration:none; }
.cc-art-tag { color:var(--cc-accent); font-size:9px; letter-spacing:.08em; font-weight:750; border-right:1px solid var(--cc-line); padding-right:15px; }
.cc-pathways { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); border-block:1px solid var(--cc-line); }
.cc-pathway { position:relative; display:grid; grid-template-columns:1fr auto; align-items:center; padding:24px 24px 28px; min-height:166px; gap:5px 12px; border-left:1px solid var(--cc-line); text-decoration:none; color:var(--cc-ink); transition:background .2s; }
.cc-pathway:first-child { border-left:0; padding-left:0; }
.cc-pathway:last-child { padding-right:0; }
.cc-pathway:hover { background:var(--cc-soft); }
.cc-pathway-number { grid-column:1; font-size:9px; color:var(--cc-muted); letter-spacing:.12em; align-self:start; }
.cc-pathway img { grid-column:2; grid-row:1/3; width:64px; height:64px; object-fit:contain; }
.cc-pathway strong { font-size:16px; font-weight:600; letter-spacing:-.04em; grid-column:1/-1; margin-top:8px; }
.cc-pathway small { font-size:10px; color:var(--cc-muted); grid-column:1/-1; }
.cc-pathway-arrow { position:absolute; right:24px; bottom:26px; font-size:15px; color:var(--cc-accent); }
.cc-section { margin-top:84px; }
.cc-section-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:20px; margin-bottom:30px; }
.cc-section-heading .cc-eyebrow { margin-bottom:10px; }
.cc-home h2 { font:500 clamp(28px,3vw,44px)/1.16 var(--cc-display); letter-spacing:-.045em; margin:0; }
.cc-section-heading>a { flex-shrink:0; margin-bottom:4px; }
.cc-level-strip { display:grid; grid-template-columns:180px minmax(0,1fr); align-items:center; padding:20px 0; border-block:1px solid var(--cc-line); margin-bottom:30px; gap:12px; }
.cc-level-strip>span { font-size:9px; letter-spacing:.15em; color:var(--cc-muted); }
.cc-level-strip nav { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:8px; }
.cc-level-strip a { display:flex; align-items:center; justify-content:center; gap:4px; min-height:42px; color:var(--cc-ink); text-decoration:none; font-size:17px; font-weight:550; border:1px solid var(--cc-line); border-radius:3px; }
.cc-level-strip a>span { font-size:9px; color:var(--cc-muted); font-weight:500; }
.cc-level-strip a i { font-style:normal; font-size:11px; margin-left:8px; color:var(--cc-accent); }
.cc-level-strip a:hover { background:var(--cc-ink); color:var(--cc-paper); }
.cc-discovery-grid { display:grid; grid-template-columns:1.3fr 1fr; gap:30px; }
.cc-discovery-card { color:var(--cc-ink); text-decoration:none; border:1px solid var(--cc-line); border-radius:5px; overflow:hidden; }
.cc-discovery-card>div:last-child { padding:27px 32px 30px; }
.cc-discovery-card h3 { margin:8px 0 10px; font:500 28px/1.2 var(--cc-display); letter-spacing:-.04em; }
.cc-discovery-card p { font-size:12px; color:var(--cc-muted); line-height:1.9; max-width:470px; margin:0 0 10px; }
.cc-discovery-art { background:#e7eadb; height:290px; position:relative; display:grid; place-items:center; overflow:hidden; }
:root[data-theme=dark] .cc-discovery-art { background:#293727; }
.cc-discovery-art img { width:84%; height:100%; object-fit:contain; transition:transform .35s; }
.cc-discovery-card:hover .cc-discovery-art img { transform:scale(1.035); }
.cc-label { font-size:9px; letter-spacing:.15em; font-weight:650; }
.cc-discovery-art .cc-label { position:absolute; top:24px; left:28px; color:#344b32; }
:root[data-theme=dark] .cc-discovery-art .cc-label { color:#e4e8d9; }
.cc-pro-line { position:relative; display:flex; flex-direction:column; justify-content:center; padding:30px 36px; height:290px; color:#ecedda; background:#344b32; overflow:hidden; }
.cc-pro-line:after { content:''; width:330px; height:330px; position:absolute; right:-130px; top:0; border:1px solid #ebedd938; border-radius:50%; box-shadow:0 0 0 35px #ebedd90a,0 0 0 70px #ebedd907; }
.cc-pro-line>span { font-size:12px; letter-spacing:.22em; }
.cc-pro-line strong { font:500 clamp(34px,3.2vw,49px)/.98 var(--cc-display); letter-spacing:-.045em; margin-top:9px; }
.cc-pro-line svg { width:96px; height:96px; position:absolute; right:35px; bottom:32px; color:#ced3b8; }
.cc-discovery-pro .cc-label { color:var(--cc-accent); }
.cc-strategy-row { display:grid; grid-template-columns:1.25fr 1fr; gap:30px; }
.cc-strategy-row article { padding:40px 36px; border:1px solid var(--cc-line); min-height:390px; border-radius:5px; overflow:hidden; position:relative; }
.cc-strategy-row p:not(.cc-eyebrow) { font-size:12px; line-height:1.9; color:var(--cc-muted); max-width:300px; margin:22px 0 24px; }
.cc-strategy-row h2 { font-size:42px; }
.cc-army-feature { background:var(--cc-soft); }
.cc-army-feature>*:not(img) { position:relative; z-index:2; }
.cc-army-character { position:absolute; right:-30px; bottom:4px; width:220px; height:250px; object-fit:contain; transform:rotate(-8deg); filter:drop-shadow(0 20px 10px #0002); }
.cc-army-character-secondary { width:150px; height:150px; right:10px; top:12px; bottom:auto; transform:rotate(8deg); opacity:.9; }
.cc-builder-feature { background:var(--cc-surface); }
.cc-builder-number { position:absolute; right:26px; top:5px; font:italic 300 260px/1 var(--cc-display); color:var(--cc-line); pointer-events:none; }
.cc-builder-feature>*:not(.cc-builder-number) { position:relative; }
.cc-profile-strip { display:grid; grid-template-columns:1fr 1fr; gap:50px; border-block:1px solid var(--cc-line); padding:45px 0; }
.cc-profile-strip .cc-eyebrow { margin-bottom:10px; }
.cc-profile-strip h2 { font-size:35px; }
.cc-profile-strip p:not(.cc-eyebrow) { max-width:390px; font-size:12px; line-height:1.9; color:var(--cc-muted); margin:16px 0 0; }
.cc-profile-form { margin:10px 0 12px; }
.cc-profile-form label { display:block; font-size:9px; letter-spacing:.13em; color:var(--cc-muted); margin-bottom:10px; }
.cc-profile-form>div { display:flex; gap:8px; }
.cc-profile-form input { min-width:0; width:100%; border:1px solid var(--cc-line); border-radius:3px; padding:14px; background:var(--cc-surface); font-size:16px; text-transform:uppercase; }
.cc-profile-form .cc-button { flex-shrink:0; gap:14px!important; }
.cc-profile-strip small { color:var(--cc-muted); font-size:10px; }
.cc-guide-row { display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:center; }
.cc-guide-row h2 { font-size:34px; }
.cc-guide-row .cc-eyebrow { margin-bottom:10px; }
.cc-guide-links a { display:flex; justify-content:space-between; gap:15px; padding:21px 0; border-bottom:1px solid var(--cc-line); text-decoration:none; color:var(--cc-ink); font-size:13px; }
.cc-tool-directory { margin-top:70px; border-block:1px solid var(--cc-line); }
.cc-tool-directory summary { padding:25px 0; cursor:pointer; font-size:14px; font-weight:550; list-style:none; }
.cc-tool-directory summary span { float:right; font-size:22px; font-weight:300; }
.cc-tool-directory[open] summary span { transform:rotate(45deg); }
.cc-tool-directory .home-directory { padding:20px 0 30px!important; }
.cc-tool-directory .home-directory-head { display:flex; justify-content:space-between; gap:20px; }
.cc-tool-directory .home-directory-head h2 { font:500 24px var(--cc-display); }
.cc-tool-directory .home-category-chips { display:flex; flex-wrap:wrap; gap:8px; margin:20px 0; }
.cc-tool-directory .home-category-chips button { border:1px solid var(--cc-line); padding:10px 13px; color:var(--cc-ink); background:none; }
.cc-tool-directory .home-category-chips button.active { background:var(--cc-soft); border-color:var(--cc-accent); }
.cc-tool-directory .home-directory-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:30px; }
.cc-tool-directory .home-directory-icon { display:none; }
.cc-tool-directory [hidden] { display:none!important; }
.cc-footer { display:grid; grid-template-columns:2fr 1fr 1fr; gap:40px; padding:60px max(28px,calc((100vw - 1360px)/2)) 24px; background:var(--cc-soft); border-top:1px solid var(--cc-line); }
.cc-footer-brand { display:inline-flex; align-items:center; gap:25px; font-size:25px; font-weight:650; letter-spacing:-.055em; text-decoration:none; color:var(--cc-ink); }
.cc-footer-brand span { color:var(--cc-accent); font-size:26px; }
.cc-footer>div>p { color:var(--cc-muted); font-size:12px; }
.cc-footer nav { display:grid; align-content:start; gap:13px; }
.cc-footer nav>span { color:var(--cc-muted); font-size:9px; letter-spacing:.16em; margin-bottom:6px; }
.cc-footer nav a { color:var(--cc-ink); font-size:11px; text-decoration:none; }
.cc-footer nav a:hover { color:var(--cc-accent); }
.cc-footer-bottom { grid-column:1/-1; display:flex; align-items:start; justify-content:space-between; gap:30px; border-top:1px solid var(--cc-line); margin-top:12px; padding-top:23px; color:var(--cc-muted); font-size:9px; }
.cc-footer-bottom>span { flex-shrink:0; }
.cc-footer .cc-footer-bottom p { max-width:600px; margin:0; font-size:9px; line-height:1.7; }
.cc-footer-bottom a { color:inherit; }
/* The inner libraries use the same type, controls and generous image-led layout. */
html[data-theme] body.compass-app #app :is(.base-layout-hero h1,.ab-library .ab-top h1,.cc-hero-title,.cc-seo-title) { font:500 clamp(34px,4vw,58px)/1.13 var(--cc-display)!important; letter-spacing:-.055em; margin:12px 0 18px; color:var(--cc-ink)!important; }
.cc-inner-intro { font-size:13px; line-height:1.9; color:var(--cc-muted); max-width:610px; margin:0; }
.cc-library-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:30px; padding:24px 0 35px; border-bottom:1px solid var(--cc-line); }
.cc-library-heading .cc-eyebrow { margin:0; }
.cc-library-caption { color:var(--cc-muted); font-size:11px; border-left:1px solid var(--cc-line); padding:8px 0 8px 24px; max-width:180px; line-height:1.7; }
html[data-theme] .compass-app .base-level-nav { display:flex; gap:8px; flex-wrap:wrap; padding:24px 0!important; margin:0; border:0; }
html[data-theme] .compass-app .base-level-nav a { min-width:65px; min-height:44px; display:grid; place-items:center; padding:10px 16px; border:1px solid var(--cc-line)!important; border-radius:3px; background:transparent!important; color:var(--cc-ink)!important; font-weight:600; }
html[data-theme] .compass-app .base-level-nav a.active { background:var(--cc-ink)!important; color:var(--cc-paper)!important; border-color:var(--cc-ink)!important; }
html[data-theme] .compass-app :is(.base-layout-toolbar,.base-filter-row) { color:var(--cc-ink); border-radius:4px; padding:18px 0; background:none; border-block:1px solid var(--cc-line); }
html[data-theme] .compass-app .base-filter-row { display:grid; grid-template-columns:2fr 1fr 1fr auto; gap:14px; margin:0 0 28px; border-top:0; align-items:end; }
html[data-theme] .compass-app :is(.base-kind-switch,.base-sort-switch) { gap:6px; background:none; padding:0; }
html[data-theme] .compass-app :is(.base-kind-switch,.base-sort-switch) button { background:none!important; color:var(--cc-muted)!important; border:0!important; border-radius:0; border-bottom:1px solid transparent!important; padding:10px 15px; min-height:42px; font-size:12px; }
html[data-theme] .compass-app :is(.base-kind-switch,.base-sort-switch) button.active { color:var(--cc-ink)!important; border-bottom-color:var(--cc-accent)!important; }
html[data-theme] .compass-app .base-filter-row :is(input,select,button) { color:var(--cc-ink)!important; background:var(--cc-surface)!important; border:1px solid var(--cc-line)!important; border-radius:3px; min-height:44px; }
html[data-theme] .compass-app .base-layout-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px; }
html[data-theme] .compass-app .base-layout-card { background:var(--cc-surface)!important; border:1px solid var(--cc-line)!important; border-radius:5px; box-shadow:none; overflow:hidden; }
html[data-theme] .compass-app .base-layout-image { background:var(--cc-soft)!important; aspect-ratio:1.35; overflow:hidden; }
.compass-app .base-layout-image img { width:100%; height:100%; object-fit:cover; transition:transform .25s; }
.compass-app .base-layout-card:hover .base-layout-image img { transform:scale(1.025); }
html[data-theme] .compass-app .base-layout-info { padding:22px; }
html[data-theme] .compass-app .base-layout-info h3 { color:var(--cc-ink)!important; font:600 16px/1.45 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; margin:0 0 13px; }
html[data-theme] .compass-app :is(.base-level-badge,.base-pro-badge) { background:var(--cc-ink)!important; color:var(--cc-paper)!important; border:0; border-radius:2px; padding:7px 10px; font-size:9px; }
html[data-theme] .compass-app :is(.base-favorite,.base-view-link) { background:none!important; color:var(--cc-muted)!important; font-size:11px; border:0; }
html[data-theme] .compass-app .base-copy-link { display:flex; align-items:center; justify-content:space-between; color:var(--cc-paper)!important; background:var(--cc-ink)!important; border:1px solid var(--cc-ink)!important; border-radius:3px; padding:14px 16px; font-size:12px; min-height:46px; }
html[data-theme] .compass-app :is(.base-layout-stats,.base-layout-tags) { color:var(--cc-muted)!important; font-size:10px; }
html[data-theme] .compass-app :is(.base-detail,.base-detail-hero,.base-detail-media,.base-preview) { color:var(--cc-ink)!important; background:var(--cc-surface)!important; border-color:var(--cc-line)!important; box-shadow:none; }
html[data-theme] .compass-app :is(.ab-page,.ab-library,.ab-library-section,.ab-basics,.ab-editor,.ab-panel,.ab-preview,.ab-army-card,.ab-library-profile,.ab-army-ask,.ab-profile-bar,.ab-top) { --ab-text:var(--cc-ink); --ab-soft:var(--cc-muted); --ab-line:var(--cc-line); color:var(--cc-ink)!important; background:var(--cc-surface)!important; border-color:var(--cc-line)!important; box-shadow:none!important; }
html[data-theme] .compass-app .ab-library { background:transparent!important; }
html[data-theme] .compass-app .ab-library .ab-top { padding:24px 0 35px; margin:0; background:transparent!important; border-radius:0; border-bottom:1px solid var(--cc-line); }
html[data-theme] .compass-app .ab-library :is(input,select,textarea) { min-height:44px; color:var(--cc-ink)!important; background:var(--cc-surface)!important; border:1px solid var(--cc-line)!important; border-radius:3px; }
html[data-theme] .compass-app .ab-library :is(.ab-army-card,.ab-library-section,.ab-army-ask,.ab-library-profile) { border-radius:5px; }
html[data-theme] .compass-app .ab-library :is(button,.ab-library-link,.ab-open-game) { border-radius:3px; box-shadow:none; }
.cc-army-assistance { border-bottom:1px solid var(--cc-line); margin:0 0 24px; padding:18px 0; }
.cc-army-assistance>summary { cursor:pointer; font-size:12px; color:var(--cc-muted); }
.cc-army-assistance[open]>summary { margin-bottom:20px; }
html[data-theme] .compass-app :is(.entity-page,.profile-hero,.profile-card,.ic-card,.ic-section,.village-tracking-page,.modern-tracker) { border-color:var(--cc-line); }
html[data-theme] .compass-app #app .entity-page>h1 { font-family:var(--cc-display)!important; font-weight:500; }
.cc-seo-page { padding:24px 0 60px; }
.cc-seo-page>header { max-width:800px; margin-bottom:35px; }
.cc-seo-page p { line-height:1.85; color:var(--cc-muted); }
.cc-seo-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.cc-seo-card { border:1px solid var(--cc-line); border-radius:5px; padding:24px; background:var(--cc-surface); color:var(--cc-ink); }
.cc-seo-card img { width:100%; height:200px; object-fit:contain; }
.cc-seo-card a { color:var(--cc-ink); }
.cc-seo-prose { max-width:740px; padding:20px 0 60px; }
.cc-seo-prose h2 { font:500 30px var(--cc-display); margin:38px 0 18px; }
.cc-seo-prose li { line-height:1.9; margin:12px 0; color:var(--cc-muted); }
@media(min-width:1450px) { .cc-home-hero { min-height:600px; } }
@media(max-width:1150px) { .cc-header .compass-primary { gap:13px; } html[data-theme] body.compass-app .cc-header .brand { font-size:19px; } html[data-theme] .cc-header .compass-primary a { font-size:11px; } .cc-brand-mark { width:35px; height:35px; } .cc-army-character { opacity:.75; right:-55px; } .cc-strategy-row p:not(.cc-eyebrow) { max-width:250px; } .cc-pathway { padding-inline:18px; } .cc-pathway strong { font-size:14px; } }
@media(max-width:950px) { html[data-theme] body.compass-app .cc-header { grid-template-columns:1fr auto auto auto; grid-template-areas:'brand language theme menu'; min-height:80px; } .cc-header .compass-primary { display:none; } .cc-home-hero { min-height:500px; grid-template-columns:1fr 1fr; } .cc-hero-base { width:125%; } .cc-pathways { grid-template-columns:repeat(5,minmax(0,1fr)); } .cc-pathway { padding:20px 12px; min-height:158px; } .cc-pathway img { width:48px; height:48px; } .cc-pathway small { max-width:100px; } .cc-pathway-arrow { display:none; } .cc-discovery-grid,.cc-strategy-row { gap:18px; } .cc-pro-line { padding:26px; } .cc-pro-line svg { width:65px; right:20px; } .cc-strategy-row article { padding:32px 25px; } .cc-army-character { width:140px; right:-35px; } .cc-army-character-secondary { width:110px; right:5px; } .cc-strategy-row h2 { font-size:36px; } .cc-strategy-row p:not(.cc-eyebrow) { max-width:230px; } .cc-profile-strip { gap:25px; } .cc-profile-form>div { flex-wrap:wrap; } .cc-profile-form input { flex:1; } .cc-level-strip { grid-template-columns:1fr; } .cc-tool-directory .home-directory-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } html[data-theme] .compass-app .base-layout-grid,.cc-seo-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:640px) {
  .cc-topline { padding:9px 20px!important; font-size:8px!important; min-height:31px!important; } .cc-topline>a { display:none; }
  html[data-theme] body.compass-app .cc-header { padding:15px 20px; gap:9px; min-height:78px; } html[data-theme] body.compass-app .cc-header .brand { font-size:20px; } .cc-header .brand small { font-size:7px; } .cc-brand-mark { width:34px; height:34px; }
  html[data-theme] body.compass-app .cc-header :is(.theme-toggle,.nav-toggle) { min-width:34px; width:34px; height:34px; } html[data-theme] body.compass-app .cc-header .language-control select { width:57px; min-height:34px; font-size:10px; padding-left:0; }
  html[data-theme] body.compass-app #app { width:calc(100% - 40px); padding-top:20px; padding-bottom:35px; } html[data-theme] body.compass-app .cc-header .header-nav.is-open { grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 20px; max-height:calc(100dvh - 190px); }
  .cc-home-hero { display:flex; flex-direction:column; gap:0; min-height:0; } .cc-hero-copy { padding:40px 0 10px; width:100%; } .cc-eyebrow { font-size:8px!important; margin-bottom:13px; letter-spacing:.14em; }
  html[data-theme] body.compass-app #app .cc-home-hero h1 { font-size:clamp(36px,10.6vw,54px)!important; margin:16px 0 20px; } .cc-hero-description { font-size:13px; line-height:1.85; max-width:330px; margin-bottom:23px; } .cc-actions { gap:22px; } .cc-hero-note { margin-top:25px; font-size:9px; }
  .cc-hero-art { width:100%; height:300px; align-self:center; margin:6px 0 15px; } .cc-hero-base { width:108%; } .cc-art-coordinate-top { top:12px; right:0; font-size:8px; } .cc-art-coordinate-bottom { bottom:8px; left:0; font-size:7px; } .cc-art-label { bottom:27px; right:0; font-size:9px; padding:13px; gap:10px; } .cc-art-grid { width:360px; height:360px; }
  .cc-pathways { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); } .cc-pathway { min-height:141px; padding:18px!important; border-bottom:1px solid var(--cc-line); } .cc-pathway:nth-child(odd) { border-left:0; } .cc-pathway:nth-child(even) { border-left:1px solid var(--cc-line); } .cc-pathway:last-child { grid-column:1/-1; grid-template-columns:auto 1fr auto; min-height:88px; border-bottom:0; } .cc-pathway:last-child img { grid-column:1; grid-row:1/3; width:58px; height:58px; margin-right:15px; } .cc-pathway:last-child strong { grid-column:2; grid-row:1; margin-top:0; } .cc-pathway:last-child small { grid-column:2; grid-row:2; max-width:none; align-self:start; } .cc-pathway:last-child .cc-pathway-number { display:none; } .cc-pathway:last-child .cc-pathway-arrow { display:block; }
  .cc-section { margin-top:52px; } .cc-section-heading { align-items:end; gap:15px; margin-bottom:23px; } .cc-home h2 { font-size:31px; } .cc-section-heading .cc-text-link { font-size:10px; gap:8px; } .cc-level-strip nav { grid-template-columns:repeat(4,minmax(0,1fr)); gap:7px; } .cc-level-strip { padding:16px 0; margin-bottom:20px; } .cc-level-strip a { min-height:42px; }
  .cc-discovery-grid,.cc-strategy-row,.cc-profile-strip,.cc-guide-row { grid-template-columns:1fr; gap:22px; } .cc-discovery-art,.cc-pro-line { height:238px; } .cc-discovery-card>div:last-child { padding:24px; } .cc-discovery-card h3 { font-size:26px; } .cc-pro-line strong { font-size:45px; } .cc-pro-line svg { width:80px; height:80px; right:28px; } .cc-strategy-row article { min-height:360px; padding:30px 25px; } .cc-strategy-row h2 { font-size:38px; } .cc-strategy-row p:not(.cc-eyebrow) { max-width:230px; } .cc-army-character { right:-14px; width:160px; } .cc-builder-number { right:26px; font-size:240px; }
  .cc-profile-strip { padding:30px 0; } .cc-profile-strip h2 { font-size:32px; } .cc-profile-form>div { display:grid; grid-template-columns:1fr; } .cc-profile-form input { width:100%; } .cc-guide-row h2 { font-size:30px; } .cc-guide-row { gap:10px; } .cc-guide-links a { font-size:12px; padding:18px 0; }
  .cc-tool-directory { margin-top:45px; } .cc-tool-directory .home-directory-head { display:grid; } .cc-tool-directory .home-directory-head h2 { font-size:24px!important; } .cc-tool-directory .home-directory-grid { grid-template-columns:1fr; }
  .cc-footer { grid-template-columns:1fr 1fr; padding:40px 20px calc(94px + env(safe-area-inset-bottom)); gap:35px 20px; } .cc-footer>div:first-child { grid-column:1/-1; } .cc-footer-brand { font-size:25px; } .cc-footer nav a { min-height:30px; line-height:1.7; } .cc-footer-bottom { display:grid; gap:12px; margin-top:0; }
  html[data-theme] .compass-app .compass-tabs { position:fixed; bottom:0; inset-inline:0; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:0; padding:9px 8px calc(9px + env(safe-area-inset-bottom)); background:var(--cc-paper); border-top:1px solid var(--cc-line); z-index:80; box-shadow:none; }
  html[data-theme] .compass-app .compass-tabs :is(a,button) { min-height:42px; padding:10px 1px; display:grid; place-items:center; font-size:10px; line-height:1.3; background:none; color:var(--cc-muted); border:0; border-top:1px solid transparent; border-radius:0; text-decoration:none; }
  html[data-theme] .compass-app .compass-tabs :is(a,button).active { color:var(--cc-ink); border-top-color:var(--cc-accent); background:var(--cc-soft); }
  .cc-library-heading { display:block; padding:12px 0 25px; } .cc-library-caption { margin-top:18px; max-width:none; padding:0; border:0; font-size:10px; } .cc-inner-intro { font-size:12px; } html[data-theme] .compass-app .base-filter-row { grid-template-columns:1fr 1fr; gap:12px; } .base-filter-row>label:first-child { grid-column:1/-1; } html[data-theme] .compass-app .base-layout-grid,.cc-seo-grid { grid-template-columns:1fr; gap:20px; } html[data-theme] .compass-app .base-level-nav { gap:6px; } html[data-theme] .compass-app .base-level-nav a { min-width:54px; padding:9px 12px; font-size:11px; } html[data-theme] .compass-app .base-layout-toolbar { gap:10px; flex-wrap:wrap; } html[data-theme] .compass-app :is(.base-kind-switch,.base-sort-switch) button { padding:8px 9px; font-size:11px; }
  html[data-theme] .compass-app .ab-library .ab-top { display:block; padding:12px 0 25px; } .ab-library .ab-top-actions { margin-top:16px; } html[data-theme] body.compass-app #app :is(.base-layout-hero h1,.ab-library .ab-top h1,.cc-hero-title,.cc-seo-title) { font-size:38px!important; } .cc-seo-card { padding:18px; }
}
@media(prefers-reduced-motion:reduce) { .compass-app *, .compass-app *:before,.compass-app *:after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }

.cc-library-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:35px; padding:22px 0 38px!important; }
.cc-library-heading>div { max-width:850px; }
.cc-library-count { font:500 52px/1 var(--cc-display); color:var(--cc-accent); text-align:right; white-space:nowrap; padding-bottom:8px; }
.cc-library-count small { display:block; margin-top:9px; font:500 10px/1.5 var(--cc-sans); letter-spacing:.06em; color:var(--cc-muted); }
.cc-page { width:100%; }
.cc-surface { border:1px solid var(--cc-line); background:var(--cc-surface); border-radius:4px; }
.cc-input { border:1px solid var(--cc-line); background:var(--cc-surface); color:var(--cc-ink); border-radius:3px; padding:14px; min-height:46px; }
@media(max-width:640px) { .cc-library-heading { align-items:flex-start; gap:18px; flex-direction:column; padding:12px 0 26px!important; } .cc-library-count { font-size:30px; display:flex; align-items:center; gap:10px; text-align:left; } .cc-library-count small { margin-top:0; max-width:100px; } }

.cc-army-assistance-body { display:grid; gap:24px; padding-top:16px; }
.cc-library-intro { font-size:14px; line-height:1.8; max-width:680px; color:var(--cc-muted); }
html[data-theme] body.compass-app .base-level-nav a.active { color:var(--cc-paper)!important; }
html[data-theme] body.compass-app .base-level-nav a.active:hover { color:var(--cc-paper)!important; }
@media(max-width:640px) {
  html[data-theme] body.compass-app .cc-header>.language-control { display:flex!important; width:auto; height:auto; }
  html[data-theme] body.compass-app .cc-header .language-control select { opacity:1; width:57px; min-height:34px; height:34px; font-size:10px; padding-right:12px; }
  html[data-theme] body.compass-app .cc-header>.theme-toggle { display:grid!important; grid-area:theme!important; grid-column:auto!important; grid-row:auto!important; }
  .cc-pro-line strong { font-size:38px; max-width:235px; }
  .cc-pro-line svg { width:44px; height:44px; right:20px; bottom:18px; }
  .cc-strategy-row .cc-army-feature { padding-bottom:145px; }
  .cc-army-character { width:140px; height:150px; right:12px; bottom:0; }
}
@media(max-width:360px) {
  html[data-theme] body.compass-app .cc-header { padding-inline:16px; gap:6px; }
  html[data-theme] body.compass-app .cc-header .brand { font-size:16px; gap:6px; }
  .cc-brand-mark { width:26px; height:26px; }
  .cc-header .brand small { font-size:6px; }
  html[data-theme] body.compass-app .cc-header .language-control select { width:48px; }
}