:root{--color-canvas:#effaf5;--color-panel:#ffffff;--color-type:#0f2e24;--color-dim:#4f6f63;--color-brand:#0f766e;--color-hi:#f59e0b;--color-edge:#d3eee3;--color-rad:16px;--color-page:1080px;--color-display:'Archivo',system-ui,sans-serif;--color-font-body:'Source Sans 3',system-ui,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:5rem} body{margin:0;background:var(--color-canvas);color:var(--color-type);font:16px/1.65 var(--color-font-body)}
img{max-width:100%;height:auto} a{color:var(--color-brand);text-underline-offset:3px}
input,select,textarea{max-width:100%;box-sizing:border-box}
input[type=date],input[type=time],input[type=datetime-local],input[type=month],input[type=week]{min-width:0;max-width:100%}
@supports (-webkit-touch-callout:none){input[type=date],input[type=time],input[type=datetime-local],input[type=month],input[type=week]{-webkit-appearance:none;appearance:none;min-height:2.75em} input::-webkit-date-and-time-value{text-align:left}}
h1,h2,h3{font-family:var(--color-display);line-height:1.2;letter-spacing:-.01em;color:var(--color-type)}
h1{font-size:clamp(1.9rem,4.5vw,2.8rem);margin:.2em 0 .35em} h2{font-size:clamp(1.35rem,3vw,1.8rem);margin:2.20em 0 .6em} h3{font-size:1.15rem;margin:1.6em 0 .4em}
p,ul,ol{margin:0 0 1em}
.li-page-width{max-width:var(--color-page);margin:0 auto;padding:0 1rem} .li-main-col{max-width:var(--color-page);margin:0 auto;padding:1.2rem 1rem 3rem}
.li-jump{position:absolute;left:-9999px} .li-jump:focus{left:1rem;top:1rem;background:var(--color-panel);padding:.5rem;z-index:99}
.li-header-bar__in{max-width:var(--color-page);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.7rem 1rem;flex-wrap:wrap}
.li-name{display:flex;align-items:center;gap:.6rem;font:800 1.15rem var(--color-display);color:var(--color-type);text-decoration:none}
.li-nav-links{display:flex;gap:1rem;flex-wrap:wrap;align-items:center} .li-nav-links a{color:var(--color-type);text-decoration:none;font-weight:600;font-size:.95rem}
.li-top{background:var(--color-brand)} .li-top a,.li-top .li-name,.li-top summary{color:#fff} .li-top .li-locale summary{border-color:rgba(255,255,255,.5)} .li-top .li-locale__list a{color:var(--color-type)} .li-top .li-locale__list a[aria-current]{color:var(--color-brand)}  .li-nav-links a{border-bottom:2px solid transparent;padding-bottom:2px} .li-nav-links a:hover,.li-nav-links a[aria-current]{border-color:var(--color-brand)}
.li-lede-box{margin:1rem 0 1.4rem} .li-standfirst{font-size:1.12rem;max-width:46em;color:var(--color-dim)} .li-lede-box{background:var(--color-panel);border:1px solid var(--color-edge);border-top:4px solid var(--color-brand);padding:2rem 1.6rem;border-radius:var(--color-rad)}
.li-panel-app{margin:1.4rem 0 2rem}
.li-aside-note{margin:1.4em 0;padding:.9em 1.1em;background:var(--color-panel);border-left:4px solid var(--color-hi);border-radius:0 var(--color-rad) var(--color-rad) 0}
.li-formula-box{margin:1.2em 0;padding:.9em 1.1em;font-family:ui-monospace,Consolas,monospace;background:var(--color-panel);border:1px dashed var(--color-brand);border-radius:var(--color-rad);overflow-x:auto}
.li-table-holder{margin:1.2em 0;overflow-x:auto;border:1px solid var(--color-edge);border-radius:var(--color-rad);background:var(--color-panel)}
.li-facts{width:100%;border-collapse:collapse;font-size:.95em;font-variant-numeric:tabular-nums} .li-facts th,.li-facts td{padding:.5em .75em;border-bottom:1px solid var(--color-edge);text-align:left}
.li-facts thead th{background:color-mix(in srgb,var(--color-edge) 60%,var(--color-panel))}
ol.li-step-list{padding-left:1.3em} ol.li-step-list>li{margin:.5em 0}
.li-visual{margin:1.6em 0;text-align:center} .li-visual img{width:100%;max-width:720px;border-radius:var(--color-rad);border:1px solid var(--color-edge);background:#fff} .li-visual figcaption{font-size:.9em;color:var(--color-dim)}
.li-reads{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1rem;margin:1.2em 0}
.li-item{display:block;padding:1.1rem;background:var(--color-panel);border-radius:var(--color-rad);border:1px solid var(--color-edge);border-top:4px solid var(--color-brand);color:var(--color-type);text-decoration:none}
.li-item b{display:block;font-family:var(--color-display);margin-bottom:.35rem} .li-item span{color:var(--color-dim);font-size:.92rem} .li-item:hover{border-color:var(--color-brand)}
.li-item--img{padding:0;overflow:hidden;display:flex;flex-direction:column;transition:transform .2s ease,box-shadow .2s ease} .li-item--img:hover{transform:translateY(-3px);box-shadow:0 10px 24px color-mix(in srgb,var(--color-type) 14%,transparent)}
.li-link-card__img{display:block;width:100%;height:auto;aspect-ratio:1200/630;object-fit:cover} .li-item__txt{display:block;padding:1rem 1.1rem 1.1rem} .li-item__txt>span{display:block}
.li-blist a,.li-brow,.li-post__kicker{background:none!important}
.li-item__meta{display:block;margin-top:.6rem;font-size:.8rem;font-weight:700;letter-spacing:.04em;color:var(--color-brand)}
.li-reads--feat{grid-template-columns:repeat(2,minmax(0,1fr))} .li-reads--feat>.li-item:first-child{grid-column:1/-1;display:grid;grid-template-columns:1.3fr 1fr;align-items:center} .li-reads--feat>.li-item:first-child b{font-size:1.35rem}
.li-blist{display:grid;gap:1rem;margin:1.2em 0} .li-brow{display:grid;grid-template-columns:240px 1fr;gap:1.1rem;align-items:center;background:var(--color-panel);border:1px solid var(--color-edge);border-radius:var(--color-rad);overflow:hidden;color:var(--color-type);text-decoration:none}
.li-brow .li-link-card__img{height:100%;aspect-ratio:auto;min-height:126px} .li-brow b{display:block;font-family:var(--color-display);font-size:1.12rem;margin-bottom:.3rem} .li-brow .li-item__txt>span{color:var(--color-dim);font-size:.93rem} .li-brow:hover{border-color:var(--color-brand)}
.li-blist--min{list-style:none;padding:0;counter-reset:bl;gap:0} .li-blist--min li{counter-increment:bl;border-top:1px solid var(--color-edge)} .li-blist--min li:last-child{border-bottom:1px solid var(--color-edge)}
.li-blist--min a{display:grid;grid-template-columns:4.2rem 1fr;column-gap:1rem;padding:1.1rem .2rem;color:var(--color-type);text-decoration:none} .li-blist--min a::before{content:counter(bl,decimal-leading-zero);grid-row:1/4;font:800 2.4rem/1 var(--color-display);color:var(--color-brand)}
.li-blist--min b{font-family:var(--color-display);font-size:1.15rem} .li-blist--min span{color:var(--color-dim);font-size:.93rem} .li-blist--min a:hover b{color:var(--color-brand)}
.li-post__head--overlay{position:relative;margin:.6rem 0 1.6rem;border-radius:var(--color-rad);overflow:hidden} .li-post__head--overlay>img{display:block;width:100%;height:auto;min-height:300px;object-fit:cover}
.li-post__ov{position:absolute;inset:auto 0 0 0;padding:4rem 1.6rem 1.4rem;background:linear-gradient(transparent,color-mix(in srgb,#000 72%,transparent))} .li-post__ov h1,.li-post__ov .li-post__meta,.li-post__ov .li-post__kicker{color:#fff}
.li-post__head--band{background:var(--color-brand);color:#fff;padding:2.2rem 1.6rem;border-radius:var(--color-rad)} .li-post__head--band h1,.li-post__head--band .li-post__meta,.li-post__head--band .li-post__kicker{color:#fff}
.li-post__head--split{display:grid;grid-template-columns:1.1fr 1fr;gap:1.6rem;align-items:center} .li-post__head--split .li-post__cover{margin:0}
.li-jump-list--chips ol{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.45rem} .li-jump-list--chips li{margin:0} .li-jump-list--chips a{display:inline-block;padding:.3rem .75rem;border:1px solid var(--color-edge);border-radius:999px;background:var(--color-canvas);text-decoration:none;font-size:.88rem}
.li-jump-list--rail{background:none;border:0;border-left:3px solid var(--color-hi);border-radius:0;padding:.2rem 0 .2rem 1rem}
.li-locale--globe summary{display:flex;align-items:center;gap:.35rem} .li-langpills{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.8rem} .li-langpills a{padding:.25rem .7rem;border:1px solid var(--color-edge);border-radius:999px;text-decoration:none} .li-langpills a[aria-current]{background:var(--color-brand);border-color:var(--color-brand);color:#fff}
@media (max-width:700px){.li-reads--feat{grid-template-columns:1fr} .li-reads--feat>.li-item:first-child{display:flex} .li-brow{grid-template-columns:1fr} .li-brow .li-link-card__img{min-height:0;aspect-ratio:1200/630} .li-post__head--split{grid-template-columns:1fr} .li-post__ov{position:static;background:var(--color-brand);padding:1.2rem} .li-post__head--overlay>img{min-height:0}}
.li-post{max-width:48rem;margin:0 auto} .li-post__head{margin:.6rem 0 1.2rem} .li-post__head h1{font-size:clamp(2rem,5vw,3rem);line-height:1.12;letter-spacing:-.01em}
.li-post__kicker{display:inline-block;font-size:.78rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--color-brand);text-decoration:none}
.li-upd{color:var(--color-dim);font-size:.9rem;margin:2rem 0 0} .li-sign{font-style:italic;color:var(--color-dim)} .li-post__meta{color:var(--color-dim);font-size:.92rem;margin:0} .li-post__cover{margin:0 0 1.6rem} .li-post__cover img{display:block;width:100%;height:auto;border-radius:var(--color-rad)}
.li-post .li-standfirst{font-size:1.2rem;color:var(--color-type)} .li-post .li-standfirst::first-letter{font-family:var(--color-display);font-size:3.1em;float:left;line-height:.9;margin:.06em .1em 0 0;color:var(--color-brand)}
.li-post .li-jump-list--post{position:static!important;top:auto!important;z-index:auto;margin:0 0 1.8rem;padding:1rem 1.2rem;background:var(--color-panel);border:1px solid var(--color-edge);border-left:4px solid var(--color-brand);border-radius:var(--color-rad);font-size:.95rem}
.li-jump-list--post ol{margin:.4rem 0 0;padding-left:1.2rem;columns:1} .li-jump-list--post li{margin:.2rem 0}
.li-post h3{color:var(--color-brand)} .li-post blockquote{margin:1.4em 0;padding:.4em 1.2em;border-left:4px solid var(--color-hi);font-size:1.1em}
.li-help details{border-bottom:1px solid var(--color-edge);padding:.7rem 0} .li-help summary{cursor:pointer;font-weight:700;font-family:var(--color-display)}
.li-crumb-nav{font-size:.88rem;color:var(--color-dim);margin:.4rem 0 1rem} .li-crumb-nav a{color:var(--color-dim)}
.li-next-step{margin:2.4rem 0;padding:1.4rem;background:var(--color-panel);border-radius:var(--color-rad);border:1px solid var(--color-edge);border-top:4px solid var(--color-brand);text-align:center}
.li-button{display:inline-block;padding:.7em 1.4em;background:var(--color-brand);color:#fff;border-radius:999px;font-weight:700;text-decoration:none}
.li-footer{border-top:1px solid var(--color-edge);margin-top:3rem;padding:1.6rem 0 2.4rem;font-size:.9rem;color:var(--color-dim);background:var(--color-panel)}
.li-footer nav{display:flex;flex-wrap:wrap;gap:.5rem 1.2rem} .li-footer a{color:var(--color-dim)} .li-footer__in{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;align-items:center}
.li-main-col{counter-reset:sec} .li-block>h2{counter-increment:sec} .li-block>h2::before{content:counter(sec,decimal-leading-zero);display:block;font-size:.8rem;letter-spacing:.12em;color:var(--color-brand);margin-bottom:.2em}
.li-jump-list{margin:1.2rem 0;padding:.8rem 1rem;background:var(--color-panel);border-radius:var(--color-rad);border:1px solid var(--color-edge)} .li-jump-list ol{margin:.3rem 0 0;padding-left:1.2rem;columns:2;column-gap:2rem} @media(max-width:640px){.li-jump-list ol{columns:1}}
.li-locale{position:relative} .li-locale summary{cursor:pointer;list-style:none;padding:.25rem .6rem;border:1px solid var(--color-edge);border-radius:999px;font-size:.85rem}
.li-locale__list{position:absolute;right:0;top:120%;background:var(--color-panel);border:1px solid var(--color-edge);border-radius:10px;padding:.4rem;display:grid;min-width:9rem;z-index:40}
.li-locale__list a{padding:.3rem .5rem;text-decoration:none;color:var(--color-type)} .li-locale__list a[aria-current]{font-weight:700;color:var(--color-brand)}
.li-codes{display:flex;gap:.35rem;font-size:.8rem;font-weight:700} .li-codes a{text-decoration:none;color:var(--color-dim);padding:.1rem .3rem;border-radius:4px} .li-codes a[aria-current]{color:var(--color-brand);background:color-mix(in srgb,var(--color-brand) 12%,transparent)}
[data-place]{margin:1rem auto;text-align:center;overflow:hidden;max-width:100%} [data-place]:empty{margin:0}
[data-place="mobile_sticky"]{position:fixed;left:0;right:0;bottom:0;margin:0;z-index:50;background:var(--color-panel)}
[data-place="sidebar_left"],[data-place="sidebar_right"]{position:fixed;top:110px;width:160px;margin:0;z-index:20} [data-place="sidebar_left"]{left:12px} [data-place="sidebar_right"]{right:12px}
@media (max-width:1499px){[data-place="sidebar_left"],[data-place="sidebar_right"]{display:none}}
.li-adx{float:right;border:0;background:transparent;font-size:1.2rem;cursor:pointer;color:var(--color-dim)}
.li-button{border-radius:999px}
.li-table-holder{border:0;border-top:3px solid var(--color-brand);border-radius:0;background:transparent} .li-facts thead th{background:transparent;text-transform:uppercase;font-size:.78rem;letter-spacing:.06em}
.li-block a:not(.li-button):not(.li-item){text-decoration-thickness:2px}
@media (max-width:640px){.li-header-bar__in{gap:.5rem} .li-nav-links{gap:.8rem}}

/* Life Path Number tool: a worked sum along a path. Only site tokens (--t-*) for colour, radius and fonts. */
.lpn-container {
    color: var(--color-type);
    font-family: var(--color-font-body);
    color-scheme: inherit;
    font-variant-numeric: tabular-nums;
    line-height: 1.5;
    max-width: 100%;
}
.lpn-container *, .lpn-container *::before, .lpn-container *::after { box-sizing: border-box; }
.lpn-container [hidden] { display: none !important; }
.lpn-sr {
    position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden;
    clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.lpn-container p { margin: 0; }
.lpn-h4 {
    font-family: var(--color-display); font-size: 1.02rem; font-weight: 700; margin: 0 0 .7rem; color: var(--color-type);
    letter-spacing: .01em;
}

/* ---------- form ---------- */
.lpn-form { display: grid; gap: .9rem; }
.lpn-date { border: 0; margin: 0; padding: 0; min-width: 0; }
.lpn-legend { font-family: var(--color-display); font-weight: 700; font-size: 1.05rem; padding: 0; margin-bottom: .55rem; }
.lpn-date-row { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, .9fr) minmax(0, 1fr); gap: .6rem; }
.lpn-field { display: flex; flex-direction: column; gap: .25rem; min-width: 0; }
.lpn-label { font-size: .82rem; font-weight: 600; color: var(--color-dim); text-transform: uppercase; letter-spacing: .05em; }
.lpn-select, .lpn-input, .lpn-manual-text {
    width: 100%; min-height: 46px; padding: .55rem .7rem; font: inherit; font-size: 1.05rem;
    color: var(--color-type); background-color: var(--color-panel); border: 1.5px solid var(--color-edge);
    border-radius: var(--color-rad); color-scheme: inherit;
}
.lpn-select { cursor: pointer; }
.lpn-input::placeholder { color: var(--color-dim); opacity: .7; }
.lpn-select:focus-visible, .lpn-input:focus-visible, .lpn-manual-text:focus-visible,
.lpn-container button:focus-visible, .lpn-partner-sum:focus-visible, .lpn-trait-sum:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--color-brand) 55%, transparent); outline-offset: 2px;
}
.lpn-select[aria-invalid="true"], .lpn-input[aria-invalid="true"] { border-color: var(--color-hi); box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-hi) 25%, transparent); }
.lpn-hint, .lpn-privacy { font-size: .85rem; color: var(--color-dim); margin-top: .45rem; }
.lpn-privacy { margin-top: 0; }

.lpn-partner-box { border: 1.5px dashed var(--color-edge); border-radius: var(--color-rad); padding: 0 .9rem; }
.lpn-partner-box[open] { padding-bottom: .9rem; border-style: solid; background: color-mix(in srgb, var(--color-panel) 60%, transparent); }
.lpn-partner-sum { cursor: pointer; min-height: 44px; display: flex; align-items: center; gap: .5rem; font-weight: 600; color: var(--color-brand); list-style: none; }
.lpn-partner-sum::-webkit-details-marker { display: none; }
.lpn-partner-sum::before { content: "+"; display: inline-grid; place-items: center; width: 1.4rem; height: 1.4rem; border-radius: 50%; border: 1.5px solid currentColor; font-weight: 700; line-height: 1; }
.lpn-partner-box[open] .lpn-partner-sum::before { content: "\2212"; }
.lpn-opt { color: var(--color-dim); font-weight: 400; }
.lpn-btn-clear-partner { margin-top: .5rem; }

.lpn-error {
    border-left: 4px solid var(--color-hi); background: color-mix(in srgb, var(--color-hi) 12%, var(--color-panel));
    padding: .6rem .8rem; border-radius: var(--color-rad); font-weight: 600;
}
.lpn-form-actions, .lpn-actions { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }

/* ---------- buttons ---------- */
.lpn-btn-primary, .lpn-btn-secondary, .lpn-btn-text, .lpn-btn-icon {
    font: inherit; cursor: pointer; min-height: 44px; border-radius: var(--color-rad); transition: background-color .15s, color .15s, border-color .15s;
}
.lpn-btn-primary {
    background: var(--color-brand); color: var(--color-panel); border: 2px solid var(--color-brand); padding: .6rem 1.4rem;
    font-family: var(--color-display); font-weight: 700; font-size: 1.05rem;
}
.lpn-btn-primary:hover { background: color-mix(in srgb, var(--color-brand) 85%, var(--color-type)); }
.lpn-btn-secondary {
    background: transparent; color: var(--color-brand); border: 1.5px solid color-mix(in srgb, var(--color-brand) 60%, var(--color-edge)); padding: .5rem 1rem; font-weight: 600;
}
.lpn-btn-secondary:hover { background: color-mix(in srgb, var(--color-brand) 10%, transparent); }
.lpn-btn-text { background: none; border: 0; color: var(--color-dim); text-decoration: underline; text-underline-offset: 3px; padding: .4rem .3rem; }
.lpn-btn-text:hover { color: var(--color-brand); }
.lpn-btn-icon {
    width: 44px; display: inline-grid; place-items: center; background: var(--color-panel); color: var(--color-brand);
    border: 1.5px solid var(--color-edge); padding: 0;
}
.lpn-btn-icon:hover { border-color: var(--color-brand); }

/* ---------- empty state ---------- */
.lpn-empty {
    margin-top: 1.1rem; display: flex; gap: 1rem; align-items: center; padding: 1rem 1.1rem;
    border: 1.5px dashed var(--color-edge); border-radius: var(--color-rad); color: var(--color-dim);
}
.lpn-empty-art { width: 140px; flex: none; }
.lpn-empty-art circle { fill: var(--color-panel); stroke: var(--color-brand); stroke-width: 2.5; }
.lpn-empty-art .lpn-empty-goal { fill: var(--color-brand); }

/* ---------- result ---------- */
.lpn-result { margin-top: 1.3rem; display: grid; gap: 1rem; outline: none; }
.lpn-hero {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 1rem; align-items: center;
    padding: 1.1rem 1.2rem; border-radius: var(--color-rad);
    background: linear-gradient(135deg, color-mix(in srgb, var(--color-brand) 12%, var(--color-panel)), var(--color-panel) 70%);
    border: 1px solid var(--color-edge);
}
.lpn-kicker { font-size: .85rem; color: var(--color-dim); text-transform: uppercase; letter-spacing: .06em; font-weight: 600; }
.lpn-number { font-family: var(--color-display); font-weight: 800; line-height: 1; margin: .2rem 0 .3rem !important; color: var(--color-brand); }
.lpn-num { font-size: clamp(3.6rem, 12vw, 5.2rem); letter-spacing: -.02em; }
.lpn-num-base { font-size: 1.8rem; color: var(--color-hi); margin-left: .15rem; }
.lpn-arch { font-family: var(--color-display); font-size: 1.3rem; font-weight: 700; }
.lpn-master {
    display: inline-block; margin-top: .35rem !important; padding: .15rem .6rem; border-radius: 999px; font-size: .85rem; font-weight: 600;
    background: color-mix(in srgb, var(--color-hi) 20%, var(--color-panel)); color: var(--color-type); border: 1px solid color-mix(in srgb, var(--color-hi) 55%, transparent);
}
.lpn-compound { color: var(--color-dim); font-size: .92rem; margin-top: .35rem !important; }
.lpn-path-art { min-width: 0; }
.lpn-svg { display: block; width: 100%; height: auto; max-width: 420px; margin-left: auto; overflow: visible; }
.lpn-road, .lpn-road-steps { fill: none; stroke-linecap: round; }
.lpn-road { stroke: color-mix(in srgb, var(--color-edge) 75%, var(--color-brand)); stroke-width: 12; opacity: .55; }
.lpn-road-steps { stroke: var(--color-brand); stroke-width: 3; stroke-dasharray: 2 9; }
.lpn-empty-art .lpn-road { stroke-width: 7; }
.lpn-op { fill: var(--color-dim); font-family: var(--color-display); font-size: 15px; font-weight: 700; text-anchor: middle; }
.lpn-stone circle { fill: var(--color-panel); stroke: var(--color-brand); stroke-width: 3; }
.lpn-stone-m circle { stroke: var(--color-hi); stroke-width: 3.5; }
.lpn-stone-v { fill: var(--color-type); font-family: var(--color-display); font-weight: 800; font-size: 15px; text-anchor: middle; }
.lpn-stone-l { fill: var(--color-dim); font-family: var(--color-font-body); font-size: 10.5px; text-anchor: middle; text-transform: uppercase; letter-spacing: .06em; }
.lpn-goal-c { fill: var(--color-brand); }
.lpn-goal-ring { fill: none; stroke: var(--color-hi); stroke-width: 3; stroke-dasharray: 5 4; }
.lpn-goal-v { fill: var(--color-panel); font-family: var(--color-display); font-weight: 800; font-size: 30px; text-anchor: middle; }
.lpn-goal-v-m { font-size: 20px; }

.lpn-cols { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 1rem; }
.lpn-card {
    background: var(--color-panel); border: 1px solid var(--color-edge); border-radius: var(--color-rad); padding: 1rem 1.1rem; min-width: 0;
}

/* working: a ruled notebook page */
.lpn-steps {
    list-style: none; margin: 0; padding: 0;
    background-image: repeating-linear-gradient(to bottom, transparent 0, transparent 2.6rem, color-mix(in srgb, var(--color-edge) 90%, transparent) 2.6rem, color-mix(in srgb, var(--color-edge) 90%, transparent) calc(2.6rem + 1px));
}
.lpn-step { display: grid; grid-template-columns: 4.6rem minmax(0, 1fr); gap: .5rem; align-items: baseline; padding: .55rem 0; min-height: calc(2.6rem + 1px); }
.lpn-step-label { font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: var(--color-dim); font-weight: 600; }
.lpn-step-calc { font-size: 1rem; overflow-wrap: anywhere; }
.lpn-step-total .lpn-step-calc { font-weight: 700; color: var(--color-brand); }

.lpn-mrow { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .1rem .6rem; padding: .55rem .7rem; border-radius: var(--color-rad); border: 1px solid var(--color-edge); margin-bottom: .55rem; }
.lpn-m-label { font-weight: 600; }
.lpn-m-value { font-family: var(--color-display); font-weight: 800; font-size: 1.25rem; color: var(--color-brand); grid-row: span 2; align-self: center; }
.lpn-m-steps { font-size: .86rem; color: var(--color-dim); overflow-wrap: anywhere; }
.lpn-mrow.lpn-differ { border-color: var(--color-hi); background: color-mix(in srgb, var(--color-hi) 9%, var(--color-panel)); }
.lpn-mrow.lpn-differ .lpn-m-value { color: var(--color-type); }
.lpn-m-verdict { font-weight: 600; }
.lpn-m-why { margin-top: .4rem !important; font-size: .88rem; color: var(--color-dim); }

/* meaning */
.lpn-frame { font-size: .78rem; text-transform: uppercase; letter-spacing: .07em; color: var(--color-hi); font-weight: 700; }
.lpn-ov { font-size: 1.05rem; margin: .2rem 0 .7rem !important; }
.lpn-traits { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; }
.lpn-trait { border: 1px solid var(--color-edge); border-radius: var(--color-rad); padding: 0 .75rem; background: color-mix(in srgb, var(--color-canvas) 55%, var(--color-panel)); }
.lpn-trait-sum { cursor: pointer; min-height: 42px; display: flex; align-items: center; font-weight: 700; font-family: var(--color-display); }
.lpn-trait-text { padding-bottom: .65rem; font-size: .95rem; }
.lpn-disclaimer { margin-top: .8rem !important; font-size: .85rem; color: var(--color-dim); border-top: 1px dashed var(--color-edge); padding-top: .6rem; }

/* personal year */
.lpn-py-top { display: flex; justify-content: space-between; align-items: center; gap: .6rem; }
.lpn-py-top .lpn-h4 { margin: 0; }
.lpn-py-nav { display: flex; gap: .4rem; }
.lpn-py-body { display: flex; gap: 1rem; align-items: center; margin: .7rem 0; }
.lpn-py-num {
    flex: none; width: 4.2rem; height: 4.2rem; border-radius: 50%; display: grid; place-items: center;
    font-family: var(--color-display); font-weight: 800; font-size: 2rem; color: var(--color-type);
    background: color-mix(in srgb, var(--color-hi) 22%, var(--color-panel)); border: 2px solid var(--color-hi);
}
.lpn-py-pos { font-weight: 700; }
.lpn-py-steps { font-size: .86rem; color: var(--color-dim); margin-top: .2rem !important; overflow-wrap: anywhere; }
.lpn-cycle { list-style: none; margin: 0; padding: 0; display: flex; justify-content: space-between; position: relative; }
.lpn-cycle::before { content: ""; position: absolute; left: 1rem; right: 1rem; top: 50%; border-top: 2px dotted var(--color-edge); }
.lpn-cyc {
    position: relative; width: 2rem; height: 2rem; border-radius: 50%; display: grid; place-items: center; font-size: .9rem; font-weight: 600;
    background: var(--color-panel); border: 1.5px solid var(--color-edge); color: var(--color-dim);
}
.lpn-cyc.lpn-on { background: var(--color-hi); border-color: var(--color-hi); color: var(--color-panel); font-weight: 800; transform: scale(1.15); }

/* compatibility */
.lpn-compat-cta { display: flex; flex-wrap: wrap; gap: .7rem; align-items: center; justify-content: space-between; border-style: dashed; }
.lpn-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; margin-bottom: .7rem; }
.lpn-person { display: grid; gap: .1rem; padding: .6rem .75rem; border: 1px solid var(--color-edge); border-radius: var(--color-rad); min-width: 0; }
.lpn-person-who { font-size: .82rem; color: var(--color-dim); }
.lpn-person-n { font-family: var(--color-display); font-weight: 800; font-size: 1.7rem; color: var(--color-brand); line-height: 1.1; }
.lpn-person-steps { font-size: .84rem; overflow-wrap: anywhere; }
.lpn-level { display: inline-block; padding: .25rem .8rem; border-radius: 999px; font-weight: 700; font-family: var(--color-display); }
.lpn-reading { margin-top: .5rem !important; }
.lpn-cmp-master, .lpn-cmp-note { font-size: .86rem; color: var(--color-dim); margin-top: .4rem !important; }
.lpn-lv-natural { background: color-mix(in srgb, var(--color-brand) 20%, var(--color-panel)); }
.lpn-lv-complementary { background: color-mix(in srgb, var(--color-hi) 26%, var(--color-panel)); }
.lpn-lv-challenging { background: color-mix(in srgb, var(--color-edge) 45%, var(--color-panel)); }
.lpn-table-wrap { margin-top: .8rem; overflow-x: auto; max-width: 100%; }
.lpn-chart { border-collapse: separate; border-spacing: 3px; margin: 0 auto; font-size: .9rem; }
.lpn-chart th { width: 2.1rem; height: 2.1rem; color: var(--color-dim); font-weight: 600; text-align: center; padding: 0; }
.lpn-chart th.lpn-hl { color: var(--color-panel); background: var(--color-brand); border-radius: 50%; }
.lpn-cell { width: 2.1rem; height: 2.1rem; text-align: center; padding: 0; border-radius: calc(var(--color-rad) / 2); color: var(--color-type); }
.lpn-cell .lpn-sym { font-size: .8rem; opacity: .75; }
.lpn-cell.lpn-cross { box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--color-brand) 45%, transparent); }
.lpn-cell.lpn-hit { box-shadow: inset 0 0 0 3px var(--color-type); font-weight: 800; }
.lpn-cell.lpn-hit .lpn-sym { opacity: 1; font-size: 1rem; }
.lpn-legend-line { display: flex; flex-wrap: wrap; gap: .4rem .9rem; justify-content: center; margin-top: .6rem !important; font-size: .85rem; }
.lpn-key { padding: .1rem .55rem; border-radius: 999px; }

/* actions, history */
.lpn-toast { min-height: 1.4em; font-size: .9rem; color: var(--color-brand); font-weight: 600; }
.lpn-manual { display: grid; gap: .3rem; }
.lpn-manual-text { min-height: 7rem; font-size: .9rem; }
.lpn-history { margin-top: 1.4rem; border-top: 1px solid var(--color-edge); padding-top: 1rem; }
.lpn-history-list { list-style: none; margin: 0 0 .5rem; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.lpn-history-item {
    font: inherit; cursor: pointer; min-height: 44px; display: inline-flex; align-items: center; gap: .5rem;
    padding: .3rem .8rem .3rem .35rem; border-radius: 999px; border: 1px solid var(--color-edge); background: var(--color-panel); color: var(--color-type);
}
.lpn-history-item:hover { border-color: var(--color-brand); }
.lpn-hist-n {
    min-width: 2.2rem; height: 2.2rem; padding: 0 .35rem; border-radius: 999px; display: inline-grid; place-items: center;
    background: var(--color-brand); color: var(--color-panel); font-weight: 800; font-family: var(--color-display); font-size: .85rem;
}
.lpn-hist-p { color: var(--color-dim); font-size: .85rem; }
.lpn-history-note { font-size: .82rem; color: var(--color-dim); }

/* motion only when the visitor has not asked to reduce it */
@media (prefers-reduced-motion: no-preference) {
    .lpn-anim .lpn-road-steps { animation: lpn-walk 1.1s ease-out both; }
    .lpn-anim .lpn-stone { animation: lpn-pop .45s ease-out both; }
    .lpn-anim .lpn-stone[data-i="1"] { animation-delay: .2s; }
    .lpn-anim .lpn-stone[data-i="2"] { animation-delay: .4s; }
    .lpn-anim .lpn-goal { animation: lpn-pop .5s .65s ease-out both; }
    .lpn-anim .lpn-hero, .lpn-anim .lpn-card { animation: lpn-rise .35s ease-out both; }
    .lpn-anim .lpn-goal-ring { animation: lpn-turn 14s linear infinite; transform-origin: 274px 62px; }
}
@keyframes lpn-walk { from { stroke-dashoffset: 330; opacity: 0; } to { stroke-dashoffset: 0; opacity: 1; } }
@keyframes lpn-pop { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes lpn-rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes lpn-turn { to { transform: rotate(360deg); } }

/* phones */
@media (max-width: 640px) {
    .lpn-hero, .lpn-cols { grid-template-columns: minmax(0, 1fr); }
    .lpn-svg { margin: 0 auto; }
    .lpn-traits { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 420px) {
    .lpn-date-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .lpn-f-month { grid-column: 1 / -1; }
    .lpn-hero, .lpn-card { padding: .9rem .8rem; }
    .lpn-pair { grid-template-columns: minmax(0, 1fr); }
    .lpn-chart { border-spacing: 2px; font-size: .82rem; }
    .lpn-chart th, .lpn-cell { width: 1.7rem; height: 1.7rem; }
    .lpn-empty-art { width: 96px; }
    .lpn-actions .lpn-btn-secondary { flex: 1 1 auto; }
}

/* print: only the result card */
@media print {
    .lpn-form, .lpn-empty, .lpn-actions, .lpn-toast, .lpn-manual, .lpn-history, .lpn-compat-cta, .lpn-py-nav, .lpn-btn-promo { display: none !important; }
    .lpn-card, .lpn-hero { break-inside: avoid; }
    .lpn-trait:not([open]) .lpn-trait-text { display: block; }
}

/* design: sites/<d>/design/site.css */
/* life-path-number.org — "Trail field notebook"
   teal header and ink footer with topographic contour lines, a dashed amber footpath
   down the left margin linking every section to a round numbered waypoint,
   painted trail blazes on notes and sub-headings, sums on squared field-book paper. */

::selection{background:color-mix(in srgb,var(--color-hi) 35%,transparent)}
body{background:var(--color-canvas)}

/* ---------- header: a teal map band with contour lines and a footpath edge ---------- */
.li-top{position:relative;background:var(--color-brand) url(/assets/img/d-contour.svg) center/cover no-repeat;border-bottom:0;padding-bottom:4px}
.li-top::after{content:'';position:absolute;left:0;right:0;bottom:0;height:4px;background:repeating-linear-gradient(90deg,var(--color-hi) 0 16px,transparent 16px 28px)}
.li-header-bar__in{padding:.85rem 1rem}
.li-name{color:#fff;font:800 1.12rem/1.1 var(--color-display);letter-spacing:-.005em;gap:.7rem}
.li-name svg{width:38px;height:38px;padding:5px;border-radius:50%;background:var(--color-panel);color:var(--color-brand);box-shadow:0 0 0 3px var(--color-hi)}
.li-top .li-nav-links{gap:.3rem 1.5rem}
.li-top .li-nav-links>a{color:#fff;font:700 .95rem/1 var(--color-display);padding:.45rem 0 .35rem;border-bottom:3px solid transparent;transition:border-color .2s}
.li-top .li-nav-links>a:hover,.li-top .li-nav-links>a[aria-current]{border-bottom-color:var(--color-hi)}
/* language codes: small trail-marker tabs */
.li-top .li-codes{gap:.3rem;flex-wrap:wrap}
.li-top .li-codes a{font:700 .72rem/1 var(--color-display);letter-spacing:.08em;text-transform:uppercase;color:#fff;padding:.38rem .5rem;border:1px solid color-mix(in srgb,#fff 45%,transparent);border-radius:6px;background:color-mix(in srgb,var(--color-type) 22%,transparent);transition:background .2s}
.li-top .li-codes a:hover{background:color-mix(in srgb,var(--color-type) 45%,transparent)}
.li-top .li-codes a[aria-current]{background:var(--color-hi);border-color:var(--color-hi);color:var(--color-type)}

/* ---------- first screen: title on the left, a marked trail climbing on the right ---------- */
.li-lede-box{position:relative;isolation:isolate;margin:.4rem 0 1rem;padding:2.2rem 400px 2rem 0;min-height:300px;display:flex;align-items:center}
.li-lede-box::before{content:'';position:absolute;z-index:-1;right:0;top:50%;width:380px;height:290px;margin-top:-145px;background:url(/assets/img/d-trail.svg) center/contain no-repeat}
.li-lede-box h1{font-size:clamp(2rem,4.6vw,3rem);line-height:1.08;letter-spacing:-.02em;margin-top:0}
.li-lede-box .li-standfirst{font-size:1.14rem;color:var(--color-dim);border-left:3px dotted var(--color-hi);padding-left:1rem;margin-bottom:0}

/* ---------- tool frame: the field book lying open ---------- */
.li-panel-app{position:relative;background:var(--color-panel);border:1px solid var(--color-edge);border-radius:6px var(--color-rad) var(--color-rad) 6px;padding:1.4rem 2.6rem 1.4rem 1.6rem;box-shadow:inset 7px 0 0 var(--color-brand),0 14px 30px -22px color-mix(in srgb,var(--color-type) 55%,transparent)}
.li-panel-app::after{content:'';position:absolute;top:-1px;bottom:-1px;right:1rem;width:8px;background:color-mix(in srgb,var(--color-brand) 85%,var(--color-type));border-radius:2px}

/* ---------- route card (contents) ---------- */
.li-jump-list:not(.li-jump-list--post){position:relative;margin:2rem 0 1.6rem;padding:1.1rem 1.3rem 1rem;background:var(--color-panel);border:1px solid var(--color-edge);border-radius:var(--color-rad)}
.li-jump-list strong{display:block;font:800 .76rem/1 var(--color-display);letter-spacing:.14em;text-transform:uppercase;color:var(--color-brand);margin-bottom:.7rem}
.li-jump-list:not(.li-jump-list--post) ol{list-style:none;padding:0;counter-reset:wp}
.li-jump-list:not(.li-jump-list--post) li{counter-increment:wp;position:relative;padding:.22rem 0 .22rem 2.1rem;break-inside:avoid;line-height:1.35}
.li-jump-list:not(.li-jump-list--post) li::before{content:counter(wp);position:absolute;left:0;top:.18rem;width:1.5rem;height:1.5rem;border-radius:50%;border:2px solid var(--color-brand);color:var(--color-brand);font:700 .72rem/1.3rem var(--color-display);text-align:center;font-variant-numeric:tabular-nums}
.li-jump-list a{color:var(--color-type);text-decoration:none;background:none}
.li-jump-list a:hover{color:var(--color-brand);text-decoration:underline}

/* ---------- the footpath: every section is a waypoint on one dashed line ---------- */
.li-block{position:relative;padding-left:3.6rem}
.li-block::before{content:'';position:absolute;left:1.05rem;top:0;bottom:0;width:12px;background:url(/assets/img/d-path.svg) 0 0/12px 22px repeat-y;opacity:.85}
.li-main-col>.li-block:first-of-type::before,.li-post>.li-block:first-of-type::before{top:2.6rem}
.li-block>h2{position:relative;margin-top:2.1em}
.li-block>h2::before{position:absolute;left:-3.6rem;top:-.12em;display:grid;place-items:center;width:2.7rem;height:2.7rem;margin:0;border-radius:50%;background:var(--color-brand);color:#fff;font:800 .95rem/1 var(--color-display);letter-spacing:.02em;box-shadow:0 0 0 5px var(--color-canvas),0 0 0 7px color-mix(in srgb,var(--color-brand) 30%,transparent);font-variant-numeric:tabular-nums}
.li-block>h2::after{content:'';display:block;width:2.4rem;height:3px;margin-top:.5rem;border-radius:2px;background:var(--color-hi)}

/* sub-headings carry a painted trail blaze */
.li-block h3::before{content:'';display:inline-block;width:.42em;height:.95em;margin:0 .55em -.08em 0;border-radius:2px;background:var(--color-hi)}

/* ---------- prose ---------- */
.li-main-col a:not(.li-button):not(.li-item){text-decoration-color:color-mix(in srgb,var(--color-brand) 40%,transparent);text-decoration-thickness:2px;transition:text-decoration-color .2s}
.li-main-col a:not(.li-button):not(.li-item):hover{text-decoration-color:var(--color-hi)}
.li-block ul{padding-left:1.25rem}
.li-block ul>li::marker{color:var(--color-brand)}

/* numbered steps: small waypoints joined by a dotted line */
ol.li-step-list{list-style:none;padding:0;counter-reset:st;margin:1.2em 0}
ol.li-step-list>li{counter-increment:st;position:relative;padding:0 0 .9rem 2.6rem;margin:0}
ol.li-step-list>li::before{content:counter(st);position:absolute;left:0;top:.05rem;width:1.75rem;height:1.75rem;border-radius:50%;background:var(--color-panel);border:2px solid var(--color-brand);color:var(--color-brand);font:800 .82rem/1.6rem var(--color-display);text-align:center}
ol.li-step-list>li:not(:last-child)::after{content:'';position:absolute;left:.82rem;top:2rem;bottom:.15rem;border-left:2px dotted color-mix(in srgb,var(--color-brand) 55%,transparent)}

/* trail notice: a painted blaze on a pale amber board */
.li-aside-note{position:relative;padding:1rem 1.2rem 1rem 3.2rem;background:color-mix(in srgb,var(--color-hi) 10%,var(--color-panel));border:1px solid color-mix(in srgb,var(--color-hi) 40%,var(--color-edge));border-radius:var(--color-rad)}
.li-aside-note::before{content:'';position:absolute;left:1.15rem;top:1.15rem;width:.75rem;height:1.25rem;border-radius:2px;background:var(--color-hi)}
.li-aside-note p:last-child{margin-bottom:0}

/* sums: a page of squared field-book paper with a teal spine */
.li-formula-box{position:relative;margin:1.3em 0;padding:1rem 1.2rem 1rem 1.6rem;font-family:var(--color-font-body);font-size:1.06rem;line-height:1.75rem;font-variant-numeric:tabular-nums lining-nums;color:var(--color-type);border:1px solid var(--color-edge);border-left:0;border-radius:4px var(--color-rad) var(--color-rad) 4px;background-color:var(--color-panel);background-image:linear-gradient(color-mix(in srgb,var(--color-brand) 10%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--color-brand) 10%,transparent) 1px,transparent 1px);background-size:.875rem .875rem;background-position:-1px -1px;box-shadow:inset 6px 0 0 var(--color-brand)}
.li-formula-box strong{padding:0 .3em;border-radius:4px;background:color-mix(in srgb,var(--color-hi) 32%,var(--color-panel))}

/* tables: a printed route sheet */
.li-table-holder{background:var(--color-panel);border:1px solid var(--color-edge);border-top:4px solid var(--color-brand);border-radius:4px 4px var(--color-rad) var(--color-rad)}
.li-facts caption{caption-side:top;text-align:left;padding:.65rem .8rem .2rem;font:700 .78rem/1.3 var(--color-display);letter-spacing:.1em;text-transform:uppercase;color:var(--color-dim)}
.li-facts thead th{background:transparent;color:var(--color-brand);font:800 .78rem/1.3 var(--color-display);letter-spacing:.06em;text-transform:uppercase;border-bottom:2px solid var(--color-brand)}
.li-facts td{border-bottom:1px dashed var(--color-edge)}
.li-facts tbody tr:last-child td{border-bottom:0}
.li-facts tbody td:first-child{font-weight:700;color:var(--color-type);white-space:nowrap}
.li-facts tbody tr:hover td{background:color-mix(in srgb,var(--color-brand) 5%,transparent)}

/* figures pinned in the notebook */
.li-visual img{border-radius:var(--color-rad);border:1px solid var(--color-edge);background:#fff}
.li-visual figcaption{margin-top:.5rem;font-style:italic}

/* ---------- FAQ: questions as signposts ---------- */
.li-help details{border:1px solid var(--color-edge);border-bottom-width:1px;border-radius:var(--color-rad);background:var(--color-panel);padding:0;margin:.55rem 0;transition:border-color .2s}
.li-help details[open]{border-color:color-mix(in srgb,var(--color-brand) 55%,var(--color-edge))}
.li-help summary{list-style:none;position:relative;padding:.85rem 3rem .85rem 1.1rem;font:700 1rem/1.35 var(--color-display)}
.li-help summary::-webkit-details-marker{display:none}
.li-help summary::after{content:'';position:absolute;right:1rem;top:50%;width:1.4rem;height:1.4rem;margin-top:-.7rem;border-radius:50%;background:linear-gradient(var(--color-brand),var(--color-brand)) center/10px 2px no-repeat,linear-gradient(var(--color-brand),var(--color-brand)) center/2px 10px no-repeat;box-shadow:inset 0 0 0 2px var(--color-brand);transition:transform .2s}
.li-help details[open] summary::after{transform:rotate(45deg)}
.li-help details>:not(summary){margin:0 1.1rem .9rem}

/* ---------- guide cards ---------- */
.li-item{border:1px solid var(--color-edge);border-radius:var(--color-rad);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.li-item--img:hover{border-color:var(--color-brand);box-shadow:0 12px 26px -16px color-mix(in srgb,var(--color-type) 45%,transparent)}
.li-link-card__img{border-bottom:4px solid var(--color-hi)}
.li-item b{font-size:1.06rem;line-height:1.3;color:var(--color-type)}
.li-item--img:hover b{color:var(--color-brand)}
.li-item__meta{display:inline-flex;align-items:center;gap:.45rem;margin-top:.8rem;color:var(--color-brand)}
.li-item__meta::before{content:'';width:.38rem;height:.8rem;border-radius:1px;background:var(--color-hi)}
.li-reads--feat>.li-item:first-child .li-link-card__img{border-bottom:0;border-right:4px solid var(--color-hi);height:100%}
.li-reads--feat>.li-item:first-child .li-item__txt{padding:1.4rem 1.6rem}

/* ---------- breadcrumbs: the route so far ---------- */
.li-crumb-nav{display:flex;flex-wrap:wrap;align-items:center;gap:.2rem .35rem;margin:.6rem 0 1.2rem}
.li-crumb-nav::before{content:'';width:.55rem;height:.55rem;margin-right:.25rem;border-radius:50%;background:var(--color-hi);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-hi) 25%,transparent)}
.li-crumb-nav a{color:var(--color-dim);background:none;text-decoration-color:color-mix(in srgb,var(--color-dim) 40%,transparent)}

/* ---------- buttons and call to action ---------- */
.li-button{background:var(--color-brand);color:#fff;border:2px solid var(--color-brand);box-shadow:0 3px 0 var(--color-hi);transition:background .2s,transform .2s}
.li-button:hover{background:color-mix(in srgb,var(--color-brand) 82%,var(--color-type))}
.li-next-step{border:1px dashed color-mix(in srgb,var(--color-brand) 50%,var(--color-edge));background:var(--color-panel);border-radius:var(--color-rad)}

/* ---------- article ---------- */
.li-post__head--band{position:relative;overflow:hidden;background:var(--color-brand) url(/assets/img/d-contour.svg) center/cover no-repeat;padding:2.4rem 1.8rem 2.2rem;border-radius:var(--color-rad);box-shadow:inset 0 -5px 0 var(--color-hi)}
.li-post__head--band h1{margin:.35em 0 .4em;font-size:clamp(1.9rem,4.6vw,2.8rem)}
.li-post__head--band .li-post__kicker{display:inline-flex;align-items:center;gap:.5rem;padding:.35rem .7rem;border-radius:999px;background:color-mix(in srgb,var(--color-type) 35%,transparent);color:#fff}
.li-post__head--band .li-post__kicker::before{content:'';width:.4rem;height:.85rem;border-radius:1px;background:var(--color-hi)}
.li-post__head--band .li-post__meta{color:#fff}
.li-post .li-jump-list--post{background:var(--color-panel);border:1px solid var(--color-edge);border-left:1px solid var(--color-edge);padding:1rem 1.2rem}
.li-jump-list--chips ol{counter-reset:ch}
.li-jump-list--chips li{counter-increment:ch}
.li-jump-list--chips a{display:inline-flex;align-items:center;gap:.45rem;padding:.3rem .8rem .3rem .3rem;background:var(--color-canvas);border:1px solid var(--color-edge);color:var(--color-type);transition:border-color .2s}
.li-jump-list--chips a::before{content:counter(ch);display:grid;place-items:center;width:1.35rem;height:1.35rem;border-radius:50%;background:var(--color-brand);color:#fff;font:700 .7rem/1 var(--color-display)}
.li-jump-list--chips a:hover{border-color:var(--color-brand);color:var(--color-brand)}
.li-post .li-standfirst{font-size:1.18rem;line-height:1.65}
.li-post .li-standfirst::first-letter{color:var(--color-brand);font-weight:800}
.li-post blockquote{border-left:0;background:color-mix(in srgb,var(--color-brand) 7%,var(--color-panel));border-radius:var(--color-rad);padding:1rem 1.3rem;font-family:var(--color-display)}

/* ---------- footer: the map's lower edge ---------- */
.li-footer{position:relative;margin-top:4rem;padding:2.6rem 0 2.8rem;border-top:0;color:color-mix(in srgb,var(--color-panel) 82%,var(--color-type));background:var(--color-type) url(/assets/img/d-contour-ink.svg) center/cover no-repeat}
.li-footer::before{content:'';position:absolute;left:0;right:0;top:0;height:4px;background:repeating-linear-gradient(90deg,var(--color-hi) 0 16px,transparent 16px 28px)}
.li-footer strong{display:block;color:#fff;font:800 1.1rem/1.2 var(--color-display);margin-bottom:.4rem}
.li-footer p{color:color-mix(in srgb,var(--color-panel) 80%,var(--color-type))}
.li-footer a{color:color-mix(in srgb,var(--color-panel) 88%,var(--color-type));text-decoration-color:color-mix(in srgb,var(--color-hi) 60%,transparent)}
.li-footer a:hover,.li-footer a[aria-current]{color:#fff;text-decoration-color:var(--color-hi)}
.li-footer nav{gap:.45rem}
.li-footer nav[aria-label]::before{content:'';display:block;width:1.8rem;height:3px;margin-bottom:.3rem;border-radius:2px;background:var(--color-hi)}

/* ---------- focus stays visible on the dark bands ---------- */
.li-top a:focus-visible,.li-footer a:focus-visible{outline:2px solid var(--color-hi);outline-offset:3px}

/* ---------- phone ---------- */
@media (max-width:900px){
 .li-lede-box{padding:1.2rem 0 150px;min-height:0;display:block}
 .li-lede-box::before{top:auto;bottom:0;margin:0;right:0;width:190px;height:145px}
}
@media (max-width:640px){
 .li-header-bar__in{justify-content:center;gap:.6rem;padding:.75rem 1rem}
 .li-top .li-nav-links{justify-content:center}
 .li-top .li-codes{justify-content:center}
 .li-panel-app{padding:1rem .9rem 1rem 1.15rem;box-shadow:inset 5px 0 0 var(--color-brand)}
 .li-panel-app::after{display:none}
 .li-block{padding-left:2.5rem}
 .li-block::before{left:.55rem}
 .li-block>h2::before{left:-2.5rem;top:0;width:2rem;height:2rem;font-size:.78rem;box-shadow:0 0 0 4px var(--color-canvas)}
 .li-formula-box{font-size:1rem;padding:.9rem .9rem .9rem 1.2rem}
 .li-block .li-table-holder{margin-left:-1.3rem}
 .li-facts{font-size:.88em}
 .li-facts th,.li-facts td{padding:.45em .5em}
 .li-facts tbody td:first-child{white-space:normal}
 .li-aside-note{padding-left:2.6rem}
 .li-aside-note::before{left:.9rem}
 .li-post__head--band{padding:1.8rem 1.2rem 1.7rem}
 .li-reads--feat>.li-item:first-child .li-link-card__img{border-right:0;border-bottom:4px solid var(--color-hi);height:auto}
 .li-reads--feat>.li-item:first-child .li-item__txt{padding:1rem 1.1rem 1.1rem}
}
@media (prefers-reduced-motion:reduce){
 .li-item,.li-help summary::after,.li-button,.li-top .li-nav-links>a{transition:none}
}