:root { --icp-forest:#24382f; --icp-leaf:#7f9f62; --icp-moss:#b9cf9d; --icp-paper:#f4f6f0; --icp-ink:#203129; --icp-border:#dce5d5; }
body { background:var(--icp-paper); color:var(--icp-ink); }
.integrated-login { background:linear-gradient(135deg,#182b23,#516c50 58%,#9ab580); }
.integrated-login .login-bg-overlay { background:radial-gradient(circle at 75% 20%,rgba(197,220,171,.28),transparent 34%),linear-gradient(120deg,rgba(8,25,18,.82),rgba(23,45,34,.36)); }
.identity-note { margin:18px 0 0; color:#627268; font-size:12px; line-height:1.45; }
.portal-hero { position:relative; overflow:hidden; min-height:270px; padding:clamp(28px,4vw,58px); border-radius:24px; color:#fff; background:linear-gradient(115deg,rgba(24,48,37,.98),rgba(63,91,69,.92)),radial-gradient(circle at 90% 10%,#a9c188,transparent 44%); box-shadow:0 18px 42px rgba(28,53,41,.16); }
.portal-hero::after { content:""; position:absolute; width:440px; height:440px; border:1px solid rgba(209,226,191,.28); border-radius:50%; right:-150px; top:-220px; box-shadow:0 0 0 70px rgba(209,226,191,.06),0 0 0 140px rgba(209,226,191,.04); }
.portal-hero h1 { position:relative; z-index:1; max-width:780px; margin:8px 0 14px; font-size:clamp(34px,5vw,62px); line-height:1.02; letter-spacing:-.035em; }
.portal-hero p { position:relative; z-index:1; max-width:720px; margin:0; color:#e2ebdc; font-size:18px; line-height:1.6; }
.portal-eyebrow,.network-card-kicker { color:#b9cf9d; font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.architecture-strip { position:relative; z-index:1; display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:30px; }
.architecture-strip span { padding:8px 13px; border:1px solid rgba(222,237,209,.28); border-radius:999px; background:rgba(255,255,255,.08); font-size:13px; }
.architecture-strip b { color:#b9cf9d; }
.metric-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin:22px 0 36px; }
.metric-card { display:grid; gap:8px; min-height:150px; padding:22px; border:1px solid var(--icp-border); border-radius:18px; background:#fff; box-shadow:0 8px 22px rgba(35,55,44,.06); }
.metric-card span { color:#607064; font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.metric-card strong { color:var(--icp-forest); font-size:42px; line-height:1; }
.metric-card small { color:#6a776e; line-height:1.45; }
.section-heading { display:flex; justify-content:space-between; align-items:end; gap:30px; margin:38px 0 18px; }
.section-heading span { color:#71856b; font-size:12px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.section-heading h2 { margin:4px 0 0; font-size:30px; }
.section-heading p { max-width:420px; margin:0; color:#6a776e; text-align:right; }
.network-card-grid { display:grid; gap:16px; }
.service-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.park-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.network-card { display:flex; gap:16px; min-height:185px; padding:22px; border:1px solid var(--icp-border); border-radius:18px; background:#fff; color:inherit; text-decoration:none; box-shadow:0 8px 22px rgba(35,55,44,.05); transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease; }
.network-card:hover { color:inherit; border-color:#a7bc96; transform:translateY(-3px); box-shadow:0 16px 34px rgba(35,55,44,.12); }
.network-card-icon { display:grid; place-items:center; flex:0 0 44px; width:44px; height:44px; border-radius:13px; color:#fff; background:var(--icp-forest); }
.network-card-copy { display:flex; flex-direction:column; min-width:0; }
.network-card h3 { margin:8px 0; color:var(--icp-forest); font-size:20px; line-height:1.2; }
.network-card p { margin:0 0 16px; color:#6a776e; font-size:14px; line-height:1.5; }
.network-card-link { margin-top:auto; color:#55764e; font-weight:700; }
.runner-status { display:inline-flex; gap:8px; align-items:center; margin-top:auto; color:#55764e; font-size:12px; font-weight:700; }
.runner-status i,.topbar-runner-pill i { width:8px; height:8px; border-radius:50%; background:#6fa657; box-shadow:0 0 0 4px rgba(111,166,87,.14); }
.content-panel { min-height:calc(100vh - 150px); padding:clamp(22px,4vw,42px); border:1px solid var(--icp-border); border-radius:22px; background:#fff; box-shadow:0 10px 26px rgba(35,55,44,.05); }
.content-panel>h1 { margin-top:0; color:var(--icp-forest); }
.content-panel>p { max-width:820px; color:#657269; }
.topbar-runner-pill { display:inline-flex; gap:9px; align-items:center; padding:8px 12px; border:1px solid #dbe5d5; border-radius:999px; color:#587052; background:#f8fbf6; font-size:12px; font-weight:700; }
.profile-scope { padding:10px 14px; color:#667269; font-size:12px; }
.access-warning { padding:14px 16px; border-radius:12px; color:#75520d; background:#fff5d8; }
.runner-page { display:grid; gap:20px; }
.runner-hero { display:flex; justify-content:space-between; align-items:flex-end; gap:28px; min-height:220px; padding:clamp(28px,4vw,48px); border-radius:22px; color:#fff; background:linear-gradient(120deg,#21382e,#527151); box-shadow:0 16px 34px rgba(28,53,41,.14); }
.runner-hero h1 { max-width:850px; margin:8px 0 10px; font-size:clamp(32px,4.6vw,54px); line-height:1.04; letter-spacing:-.03em; }
.runner-hero p { max-width:760px; margin:0; color:#e3ecdf; font-size:17px; line-height:1.55; }
.runner-state { display:inline-flex; flex:0 0 auto; gap:10px; align-items:center; padding:10px 14px; border:1px solid rgba(255,255,255,.26); border-radius:999px; background:rgba(255,255,255,.09); font-size:12px; font-weight:800; }
.runner-state i { width:9px; height:9px; border-radius:50%; background:#a9d68d; box-shadow:0 0 0 5px rgba(169,214,141,.14); }
.runner-fact-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.runner-fact { display:grid; gap:9px; min-height:108px; padding:18px; border:1px solid var(--icp-border); border-radius:16px; background:#fff; box-shadow:0 7px 18px rgba(35,55,44,.05); }
.runner-fact span { color:#718074; font-size:11px; font-weight:800; letter-spacing:.09em; text-transform:uppercase; }
.runner-fact strong { color:var(--icp-forest); font-size:17px; line-height:1.35; overflow-wrap:anywhere; }
.runner-boundary-panel,.lths-workspace { min-height:0; }
.boundary-paths { display:grid; gap:8px; margin-top:24px; }
.boundary-paths code { display:block; padding:10px 12px; border:1px solid #dfe8da; border-radius:10px; color:#496247; background:#f6f9f3; overflow-wrap:anywhere; }
.empty-runner-state { padding:26px; border:1px dashed #bac9af; border-radius:14px; background:#f8faf6; }
.empty-runner-state h3 { margin:0 0 7px; color:var(--icp-forest); }
.empty-runner-state p { margin:0; color:#667269; }
.runner-dictionary-heading { padding-top:24px; border-top:1px solid var(--icp-border); }
.tier-orange { background:linear-gradient(120deg,#5d3826,#a66d43); }
.tier-blue { background:linear-gradient(120deg,#203c51,#4d7894); }
.tier-yellow { background:linear-gradient(120deg,#5a4a1f,#9f873f); }
.network-card.action-button { text-align:left; white-space:normal; }
@media (max-width:1180px) { .service-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .park-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .runner-fact-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px) { .metric-grid,.service-grid,.park-grid,.runner-fact-grid { grid-template-columns:1fr; } .section-heading { align-items:start; flex-direction:column; } .section-heading p { text-align:left; } .topbar-runner-pill { display:none; } .portal-hero { border-radius:16px; } .runner-hero { align-items:flex-start; flex-direction:column; border-radius:16px; } }
