/* Directory-only adapter: aligns /network/ with the homepage language.
   Homepage reference (website/index.html): paper #fffaf5, ink #172143,
   primary #2458ed, hairline #e8e2d9, white cards, soft shadows.
   Dark scheme remains owned by color-mode.css. */

/* Header: same geometry and hairline as the homepage header. */
.wpi-directory-page header{width:auto;max-width:1200px;margin:0 auto;padding:24px;background:transparent;border:0;border-bottom:1px solid #e8e2d9;border-radius:0;box-shadow:none}
.wpi-directory-page header :is(a,.brand,.brand b){color:#172143}
.wpi-directory-page .brand{font-size:25px;font-weight:800;letter-spacing:-1px}
.wpi-directory-page .brand b{color:#2458ed}
.wpi-directory-page header nav{display:flex;gap:24px;font-size:14px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.wpi-directory-page .site-language{padding:0;background:transparent;border:0;border-radius:0;gap:10px}
.wpi-directory-page .site-language a[aria-current]{color:#2458ed;font-weight:650}

/* Main column: homepage container width. */
.wpi-directory-page main.wide{max-width:1200px;margin:0 auto;padding:8px 24px 40px}

/* Filter chips (reference pattern: browse by dimension, one row each). */
.wpi-directory-page .chip-row{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:10px 0 2px}
.wpi-directory-page .chip-label{font-size:12px;letter-spacing:2px;color:#2458ed;font-weight:700;margin-right:4px}
.wpi-directory-page .chip{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid #e8e2d9;border-radius:20px;padding:6px 14px;color:#172143;text-decoration:none;font-size:14px}
.wpi-directory-page .chip:hover{border-color:#2458ed;color:#2458ed}
.wpi-directory-page .chip.active{background:#2458ed;border-color:#2458ed;color:#fff;font-weight:650;box-shadow:0 7px 20px #2458ed22}
.wpi-directory-page .chip-count{font-size:12px;background:#eef1ff;color:#2458ed;border-radius:10px;padding:1px 7px}
.wpi-directory-page .chip.active .chip-count{background:#ffffff2e;color:#fff}

/* Continent and country section headings. */
.wpi-directory-page main h2.continent-title{font-size:28px;letter-spacing:-1px;line-height:1.3;color:#172143;border-top:1px solid #e8e2d9;padding-top:36px;margin:36px 0 2px}
.wpi-directory-page main h3.country-title{font-size:19px;letter-spacing:-.3px;line-height:1.35;color:#172143;margin:26px 0 4px}
.wpi-directory-page .section-count{font-size:13px;font-weight:400;color:#667087;letter-spacing:0;margin-left:10px}

/* Node cards: homepage cards in a responsive grid. */
.wpi-directory-page .node-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;margin:14px 0 6px}
body.wpi-directory-page main.wide .panel.node-card{background:#fff;border:1px solid #e8e2d9;border-radius:14px;box-shadow:0 12px 45px #17214306;padding:22px;margin:0;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
body.wpi-directory-page main.wide .panel.node-card:hover{transform:translateY(-2px);border-color:#c9d6fb;box-shadow:0 18px 50px #17214312}
.wpi-directory-page .node-top{display:flex;gap:14px;align-items:center;margin-bottom:8px}
.wpi-directory-page .node-mono{flex:none;width:44px;height:44px;border-radius:12px;background:linear-gradient(145deg,#2458ed,#172143);color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:800}
.wpi-directory-page .node-id{min-width:0}
.wpi-directory-page .node-title{font-weight:700;color:#172143;text-decoration:none;overflow-wrap:anywhere}
.wpi-directory-page .node-title:hover{color:#2458ed}
.wpi-directory-page .node-domain{font-size:13px;color:#667087;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wpi-directory-page .empty-note{border:1px dashed #ddd5c7;border-radius:12px;padding:18px 22px;color:#667087;background:#fff;margin:14px 0 6px}
.wpi-directory-page .node-badges{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 2px}
.wpi-directory-page .badge{display:inline-flex;align-items:center;gap:5px;font-size:13px;background:#fffaf5;border:1px solid #e8e2d9;border-radius:20px;padding:3px 11px;color:#172143}
.wpi-directory-page .badge-plan{background:#eef1ff;border-color:#d7e0ff;color:#1d3fae}

/* Status as a homepage-style pill; state colors stay with the status widget. */
.wpi-directory-page .node-state{border:1px solid #e8e2d9;border-radius:20px;padding:3px 10px;background:#fff}

/* Notices: homepage note block. */
body.wpi-directory-page main.wide .note:not(.error):not(.success){background:#eef1ff;color:#172143;border:0;border-radius:10px;padding:20px 24px;box-shadow:none}
.wpi-directory-page .directory-note{margin-top:28px}

/* Footer: homepage footer treatment. */
.wpi-directory-page .foot{border-top:1px solid #e8e2d9;padding-top:20px;margin-top:36px;color:#667087}
.wpi-directory-page .foot a{color:#667087}

.wpi-directory-page main .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

@media(max-width:720px){.wpi-directory-page header{padding:20px;gap:12px}.wpi-directory-page main.wide{padding:8px 20px 32px}.wpi-directory-page main h2.continent-title{font-size:24px;padding-top:28px;margin-top:28px}.wpi-directory-page .node-grid{grid-template-columns:1fr}}

body.wpi-directory-page{font-size:clamp(16px,1.05vw,19px)}
body.wpi-directory-page header nav a{font-size:clamp(14px,1vw,17px)}
body.wpi-directory-page main :is(.muted,.note){font-size:clamp(16px,1.1vw,19px);line-height:1.85}
body.wpi-directory-page main .node-title{font-size:clamp(17px,1.3vw,21px)}
body.wpi-directory-page main :is(.node-state,.small){font-size:clamp(14px,.95vw,17px)}
body.wpi-directory-page .foot{font-size:14px}
