/* FreedomAIOS Pulse — shared component layer.
Every page links this. Typography and depth for repeated objects live here,
never in inline styles, so a card header on Reports matches one on Pulse. */
/* ---- app shell ------------------------------------------------------- */
/* Flex, not grid: hiding the clock in a grid re-flows the pomodoro into the
vacated track. With flex it simply stays pinned right. */
.app-head{width:100%;box-sizing:border-box;display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px;background:var(--b-ground);border-bottom:4px solid #D9A441;padding:16px 24px}
.app-head > *{min-width:0}
.app-head-title{white-space:nowrap}
.app-head-brand{display:flex;align-items:center;gap:16px;min-width:0}
.app-head-brand > *{min-width:0}
.app-logo{width:104px;height:104px;flex:none;max-width:26vw;border-radius:8px;border:1px solid rgba(217,164,65,.45);display:block;box-shadow:0 8px 22px rgba(0,0,0,.34)}
.app-clock{display:flex;align-items:center;gap:14px;flex:1 1 auto;justify-content:center;min-width:0}
.app-pom{flex:none;margin-left:auto}
.app-shell{display:grid;grid-template-columns:214px 1fr}
.app-rail{background:var(--b-ground);border-right:1px solid var(--b-line);padding:16px 0 18px;min-width:0}
.app-main{min-width:0}
.rail-kicker{white-space:nowrap}
/* ---- card header type ------------------------------------------------- */
.card-title{
margin:0;
font:800 19px/1.05 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
letter-spacing:-.004em;
text-shadow:0 2px 5px rgba(0,0,0,.5);
}
.card-title a{color:inherit;text-decoration:none;border-bottom:2px solid #D9A441}
.card-title a:hover{color:#D9A441;border-bottom-color:#D9A441}
/* headers that sit on a light plate instead of a gradient */
.card-title.on-light{text-shadow:0 1px 0 rgba(255,255,255,.6)}
/* the smaller title used on provider / tile cards */
.card-title.sm{font-size:19px}
/* provider card header: icon + name only, so the name is never truncated */
.prov-hd{display:flex;align-items:center;gap:10px}
.prov-hd .card-title{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* status sits on its own line, where a nine-character word actually fits */
.prov-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 14px 0}
.prov-meta [data-state]{flex:none;white-space:nowrap}
.prov-foot{margin-top:auto;padding-top:10px;border-top:1px solid var(--rule);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
/* provider grids wrap instead of holding four hard columns */
.prov-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(248px,1fr));gap:14px}
.attn-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:12px}
@media (max-width:720px){
.prov-grid{grid-template-columns:1fr}
.attn-grid{grid-template-columns:1fr}
}
.card-meta{
font:15px/1.3 ui-monospace,Menlo,Consolas,monospace;
letter-spacing:.005em;
}
.kicker{
font:800 13px/1 ui-monospace,Menlo,Consolas,monospace;
letter-spacing:.055em;
text-transform:uppercase;
}
/* .kicker sets no colour, so on the navy page ground it inherits white. Inside a
card body the ground is light and it has to be re-inked, or it vanishes. */
.pulse-card-body .kicker{color:var(--muted2)}
/* ---- eisenhower quadrants -------------------------------------------- */
.quad-label{
font:800 17px/1 ui-monospace,Menlo,Consolas,monospace;
letter-spacing:.05em;
text-shadow:0 2px 6px rgba(0,0,0,.62);
}
.quad-label.tight{letter-spacing:.025em}
.quad-sub{
font:800 13px/1 ui-monospace,Menlo,Consolas,monospace;
letter-spacing:.04em;
text-shadow:0 1px 4px rgba(0,0,0,.5);
}
/* navy type on the gold quadrant takes the same light emboss as
.card-title.on-light — a dark drop shadow is for reversed type only */
.quad-label.on-light,
.quad-sub.on-light{text-shadow:0 1px 0 rgba(255,255,255,.6)}
/* ---- responsive widget grid ------------------------------------------- */
/* Fixed 12-column spans do not reflow; below ~1180px a span-3 card is under
160px, which is narrower than its own content. These collapse instead. */
/* stretch, not start: the cards are authored as flex columns with a
`margin-top:auto` footer, which only pins if they stretch to row height */
.pulse-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:14px;align-items:stretch}
.pulse-grid>.w3{grid-column:span 3}
.pulse-grid>.w4{grid-column:span 4}
.pulse-grid>.w5{grid-column:span 5}
.pulse-grid>.w6{grid-column:span 6}
.pulse-grid>.w7{grid-column:span 7}
.pulse-grid>.w8{grid-column:span 8}
.pulse-grid>.w12{grid-column:span 12}
@media (max-width:1180px){
.pulse-grid>.w3,.pulse-grid>.w4,.pulse-grid>.w5{grid-column:span 6}
.pulse-grid>.w6,.pulse-grid>.w7,.pulse-grid>.w8{grid-column:span 12}
}
@media (max-width:820px){
.pulse-grid>.w3,.pulse-grid>.w4,.pulse-grid>.w5,.pulse-grid>.w6,.pulse-grid>.w7,.pulse-grid>.w8{grid-column:span 12}
}
/* a settings row's control can be wider than the label allows: let it wrap */
.pulse-row.wrap{display:flex;flex-wrap:wrap;justify-content:space-between}
/* ---- shared-track table ----------------------------------------------- */
/* Per-row grids cannot share track sizing: each row's `auto` columns size to
its own content, so no two rows line up. The wrapper owns the tracks and
every row inherits them via subgrid. */
.pulse-table{display:grid;grid-template-columns:.9fr 2fr minmax(0,118px) max-content}
.pulse-table > *{display:grid;grid-template-columns:subgrid;grid-column:1 / -1;gap:12px;align-items:center}
.pulse-table-hd{padding:9px 0;border-bottom:2px solid var(--b-brand)}
.pulse-table-hd > span{font:800 12px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.06em;color:var(--muted2)}
.pulse-table-row{padding:10px 0;border-bottom:1px solid var(--rule)}
.pulse-table-row:last-child{border-bottom:0}
@supports not (grid-template-columns: subgrid){
.pulse-table{display:block}
.pulse-table > *{grid-template-columns:.9fr 2fr 118px 108px}
}
/* ---- CARDS: the standard object ---------------------------------------
Build every card from these classes. Do NOT hand-write the shell inline —
that is how headers, radii and shadows drift page to page.
Header gradient = one hd-* modifier. hd-gold is a LIGHT plate, so it flips
its own title to navy + light emboss automatically; never override that. */
.pulse-card{background:var(--surface);border:1px solid var(--line);border-radius:8px;box-shadow:0 10px 26px rgba(0,0,0,.34);overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .2s ease,transform .2s ease}
.pulse-card:hover{transform:translateY(-3px);box-shadow:0 18px 38px rgba(0,0,0,.44)}
.pulse-card-hd{display:flex;align-items:center;gap:9px;padding:13px 16px;box-shadow:inset 0 -1px 0 rgba(0,0,0,.3);flex-wrap:wrap}
.pulse-card-hd .card-title{color:#FFFFFF}
.pulse-card-hd .card-meta{color:#FFFFFF}
.hd-cool{background:var(--grad-cool)}
.hd-good{background:var(--grad-good)}
.hd-warm{background:var(--grad-warm)}
.hd-stone{background:var(--grad-stone)}
.hd-steel{background:var(--grad-steel)}
.hd-brand{background:linear-gradient(150deg,var(--b-deep),var(--b-mid) 60%,var(--b-brand))}
:root{--on-gold:#12283F}
html[data-theme="dark"]{--on-gold:#F6EEDC}
.hd-gold{background:var(--grad-gold)}
.hd-gold .card-title{color:var(--on-gold);text-shadow:0 1px 0 rgba(255,255,255,.6)}
.hd-gold .card-meta{color:var(--on-gold)}
/* reversed type on the dark theme's gold plate takes a dark shadow, not the emboss */
html[data-theme="dark"] .hd-gold .card-title{text-shadow:0 2px 5px rgba(0,0,0,.5)}
.pulse-card-body{padding:13px 16px 15px;display:flex;flex-direction:column;gap:11px;flex:1}
.pulse-card-foot{margin-top:auto;padding-top:11px;border-top:1px solid var(--rule);display:flex;align-items:center;justify-content:space-between;gap:9px;flex-wrap:wrap;font:700 13px ui-monospace,Menlo,Consolas,monospace;color:var(--muted)}
/* Body-copy links. Every page's helmet declares `a{color:var(--b-brand)}` — a
dark navy PLATE colour, which lands at 1.07:1 on the dark card surface. This
overrides it inside a card body with --head, a text role that flips per theme
(deep navy in light, near-white in dark), and gold on hover. */
.pulse-card-body a{color:var(--head);text-decoration:underline;text-decoration-color:#D9A441;text-decoration-thickness:2px;text-underline-offset:3px}
.pulse-card-body a:hover{color:var(--gold-ink);text-decoration-color:var(--gold-ink)}
/* a link in a foot must not inherit the muted tone it sits beside */
.pulse-card-foot a{font:700 14px ui-monospace,Menlo,Consolas,monospace;color:var(--head);text-decoration:underline;text-decoration-color:#D9A441;text-decoration-thickness:2px;text-underline-offset:3px}
.pulse-card-foot a:hover{color:var(--gold-ink)}
/* a list row inside a card body */
.pulse-row{display:grid;grid-template-columns:1fr auto;gap:11px;align-items:center;padding:10px 0;border-bottom:1px solid var(--rule)}
.pulse-row:last-child{border-bottom:0}
.pulse-row-t{font:800 16px/1.25 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink)}
.pulse-row-s{font:14px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted)}
/* the inset note strip that closes a card */
.pulse-note{padding:11px 13px;background:var(--surface3);border-radius:6px;font:15px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted)}
/* status badges — four meanings, no ad-hoc colours */
.pulse-badge{font:800 12px ui-monospace,Menlo,Consolas,monospace;letter-spacing:.04em;color:#FFFFFF;border-radius:4px;padding:4px 8px;white-space:nowrap;flex:none}
.b-good{background:#5F7A55}
.b-warn{background:#C0563A}
.b-gold{background:#D9A441;color:var(--b-brand)}
.b-neutral{background:#8B8676}
/* a metric tile strip that wraps rather than forcing tracks */
.pulse-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.pulse-tiles > *{min-width:0;padding:12px 14px;background:var(--surface3);border-radius:6px}
/* ---- depth ------------------------------------------------------------ */
.elev-card{box-shadow:0 10px 26px rgba(0,0,0,.34)}
.elev-page{box-shadow:0 12px 28px rgba(0,0,0,.36)}
/* ---- ONE type scale for module pages --------------------------------------
Every OS page uses these. Do not set font: inline on a module page — that is
how the schedule card ended up in a different type system to its siblings.
Monospace is reserved for numbers, times and commands; everything a person
reads in a sentence is the body face. */
.pulse-lead{margin:0;font:20px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink);text-wrap:pretty}
.pulse-sub{margin:0;font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted);text-wrap:pretty}
.pulse-tile-v{font:700 26px/1 ui-monospace,Menlo,Consolas,monospace;color:var(--head);font-variant-numeric:tabular-nums}
/* a tile whose value is words, not a figure — monospace at 26px shouts */
.pulse-tile-v.txt{font:800 19px/1.2 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}
.pulse-cmd{font:700 14px/1.3 ui-monospace,Menlo,Consolas,monospace;color:var(--muted)}
/* the numbered step strip that opens a module page */
.pulse-steps{display:flex;flex-wrap:wrap;gap:10px}
.pulse-step{flex:1 1 195px;min-width:0;padding:14px 15px;border-radius:6px}
.pulse-step-k{font:800 12px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.05em;color:#FFFFFF;opacity:.92}
.pulse-step-t{margin:7px 0 5px;font:800 18px/1.25 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#FFFFFF}
.pulse-step-d{font:15px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#FFFFFF}
/* eggplant reads as an accent in the navy themes and as the brand in its own */
.hd-plum{background:var(--grad-plum)}
/* ---- header objects: clock and focus timer --------------------------------
Both stretch to the logo's height so the three objects share one top and
bottom edge. The clock takes all the width left over. */
.app-head-brand{flex:none}
.app-clock{flex:1 1 260px;min-width:0;align-self:center;height:106px;display:flex;align-items:center;justify-content:center;gap:12px}
/* Three auto tracks need ~833px. Between the phone breakpoint and that, the
clock is the one discretionary item, so it steps aside rather than overflow.
Must sit AFTER the display:flex above — equal specificity, later wins. */
@media (max-width:1040px) and (min-width:821px){
.app-clock{display:none}
}
:root{--clock-face:#F6EEDC;--clock-ink:#12283F;--clock-sep:#8A6620}
html[data-theme="dark"]{--clock-face:#101922;--clock-ink:#F6EEDC;--clock-sep:#D9A441}
.clock-face{flex:0 0 auto;min-width:0;display:flex;align-items:center;justify-content:center;gap:4px;padding:7px 14px;background:var(--clock-face);border:2px solid #D9A441;border-radius:8px;box-shadow:0 4px 14px rgba(0,0,0,.28)}
.clock-d{flex:0 1 auto;display:grid;place-items:center;font:800 64px/1 ui-monospace,Menlo,Consolas,monospace;color:var(--clock-ink);font-variant-numeric:tabular-nums;letter-spacing:-.03em}
.clock-sep{font:800 50px/1 ui-monospace,Menlo,Consolas,monospace;color:var(--clock-sep);padding-bottom:5px}
.clock-side{flex:none;display:flex;flex-direction:column;justify-content:center;gap:7px}
.clock-zone{display:flex;align-items:baseline;gap:8px;white-space:nowrap}
.clock-zone-k{font:700 12px/1 ui-monospace,Menlo,Consolas,monospace;color:#8FA6BC;min-width:30px}
.clock-zone-t{font:700 14px/1 ui-monospace,Menlo,Consolas,monospace;color:#C9D6E4;font-variant-numeric:tabular-nums}
.clock-date{font:700 13px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.04em;color:#8FA6BC;white-space:nowrap}
.app-pom{flex:0 0 252px;align-self:center;height:106px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:space-between;gap:8px;width:270px;border:2px solid #D9A441;border-radius:8px;background:var(--b-deep);padding:10px 12px;box-shadow:0 8px 20px rgba(0,0,0,.34)}
.pom-say{font:800 16px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#D9A441}
.pom-mid{display:flex;align-items:center;gap:10px}
.pom-time{flex:1;font:800 34px/1 ui-monospace,Menlo,Consolas,monospace;color:#FAF7F2;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.pom-go{flex:none;font:800 14px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.04em;color:var(--b-brand);background:#D9A441;border:0;border-radius:5px;padding:10px 14px;cursor:pointer}
.pom-go:hover{background:#E7B858}
.pom-foot{display:flex;align-items:center;gap:8px}
.pom-track{flex:1;height:5px;border-radius:3px;background:rgba(250,247,242,.24);overflow:hidden;display:block}
.pom-track > i{display:block;height:100%;width:0;background:#D9A441;transition:width .4s linear}
.pom-set{display:flex;gap:4px;flex:none}
.pom-min{font:700 12px/1 ui-monospace,Menlo,Consolas,monospace;color:rgba(250,247,242,.72);background:transparent;border:1px solid var(--b-line);border-radius:4px;padding:5px 7px;cursor:pointer}
.pom-min[aria-pressed="true"]{color:var(--b-brand);background:#D9A441;border-color:#D9A441}
.pom-min:hover{color:#FAF7F2;border-color:#D9A441}
/* ---- header, from the stylesheet not from 22 copies of inline style ------- */
.app-head-kicker{font:800 16px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.07em;color:#D9A441;margin-bottom:7px;white-space:nowrap}
/* the brand stack starts level with the top of the logo */
.app-head-brand{align-items:flex-start}
.app-head-brand > div{padding-top:2px}
/* today's date, under the greeting, in the interface face */
.app-head-date{font:700 16px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#C9D6E4;margin-top:7px;white-space:nowrap}
.app-head-title{font:800 30px/1.1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#FAF7F2;text-shadow:0 2px 6px rgba(0,0,0,.4);white-space:nowrap}
.app-head-extras{margin-top:10px}
.app-swatch{display:flex;align-items:center;gap:5px;margin-top:9px}
.app-swatch button{width:11px;height:11px;flex:none;padding:0;border:1px solid rgba(250,247,242,.45);border-radius:2px;cursor:pointer;display:block}
.app-swatch button[data-themeset="light|navy"]{background:#3D5F8A}
.app-swatch button[data-themeset="dark|navy"]{background:#0B1119}
.app-swatch button[data-themeset="light|eggplant"]{background:#6A3D82}
.app-swatch button[data-themeset="dark|eggplant"]{background:#120D19}
/* ---- rail, likewise ------------------------------------------------------- */
.rail-section{font:800 17px -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#D9A441;padding:0 16px 10px}
.rail-section.sep{margin-top:8px;padding-top:16px;border-top:1px solid var(--b-line)}
.rail-item{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 16px 9px 26px;font:17px -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;text-decoration:none;color:rgba(255,255,255,.86);border-left:3px solid transparent}
.rail-item:hover{background:var(--b-deep);color:#FFFFFF}
.rail-item.is-active{background:var(--b-deep);border-left-color:#D9A441;font-weight:800;color:#FFFFFF}
.rail-item.sub{padding-left:40px;font-size:15px;color:rgba(255,255,255,.72)}
.rail-item.sub.is-active{color:#FFFFFF}
/* hover lift applies to every card in the app, not only .pulse-card ones */
.pulse-card,[data-widget],[data-mwidget],[data-provider],.dash-card,.prov-card{transition:box-shadow .2s ease,transform .2s ease}
.pulse-card:hover,[data-widget]:hover,[data-mwidget]:hover,[data-provider]:hover,.dash-card:hover,.prov-card:hover{transform:translateY(-3px);box-shadow:0 18px 38px rgba(0,0,0,.44)}
/* drag handles: hidden and inert until the board is unlocked */
[data-grip]{opacity:0;transition:opacity .15s ease;cursor:default;flex:none;font:700 13px ui-monospace,Menlo,Consolas,monospace;color:#D9A441}
[data-board].unlocked [data-grip]{opacity:1;cursor:grab}
.hd-gold [data-grip]{color:var(--on-gold)}
/* ---- assistant launcher ---------------------------------------------------
A normal bottom-right chatbot. The full page at Your Assistant.dc.html is
still where the name, face and wiring state live. */
.chat-fab{position:fixed;right:22px;bottom:22px;z-index:120;width:64px;height:64px;padding:0;display:grid;place-items:center;border:3px solid #D9A441;border-radius:50%;background:var(--b-deep);box-shadow:0 12px 30px rgba(0,0,0,.44);cursor:pointer;overflow:hidden;transition:transform .18s ease,box-shadow .18s ease}
.chat-fab:hover{transform:translateY(-3px);box-shadow:0 18px 38px rgba(0,0,0,.5)}
.chat-fab:focus-visible{outline:2px solid #D9A441;outline-offset:3px}
.chat-fab .chat-fab-face{width:100%;height:100%;border-radius:0}
.chat-fab-face{width:34px;height:34px;flex:none;border-radius:8px;overflow:hidden;background:var(--b-mid)}
.chat-pop{position:fixed;right:22px;bottom:22px;z-index:121;width:min(400px,calc(100vw - 44px));max-height:min(620px,calc(100vh - 44px));display:none;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:0 22px 54px rgba(0,0,0,.5);overflow:hidden}
.chat-pop.open{display:flex}
.chat-pop-hd{display:flex;align-items:center;gap:10px;padding:12px 14px;background:linear-gradient(150deg,var(--b-deep),var(--b-mid) 60%,var(--b-brand));box-shadow:inset 0 -1px 0 rgba(0,0,0,.3)}
.chat-pop-hd .chat-fab-face{width:30px;height:30px}
.chat-pop-log{flex:1;min-height:200px;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:11px}
.chat-pop-foot{border-top:1px solid var(--line);background:var(--surface2);padding:11px 12px;display:flex;gap:9px;align-items:flex-end}
.chat-pop-foot textarea{flex:1;min-width:0;resize:none;font:16px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:7px;padding:9px 11px}
.chat-pop-link{padding:9px 14px;border-top:1px solid var(--rule);background:var(--surface2);font:700 13px ui-monospace,Menlo,Consolas,monospace}
@media print{.chat-fab,.chat-pop{display:none}}
/* ---- keyboard focus, everywhere ------------------------------------------ */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid #D9A441;outline-offset:2px;border-radius:4px}
.rail-item:focus-visible{outline-offset:-3px}
/* a keyboard user should be able to jump the rail */
.skip-link{position:absolute;left:-9999px;top:0;z-index:200;padding:12px 16px;background:#D9A441;color:var(--b-brand);font:800 15px -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;text-decoration:none;border-radius:0 0 6px 0}
.skip-link:focus{left:0}
/* Below the width where brand + clock + timer fit on one row, the title wraps
and the brand shares the row, instead of leaving a void under it. */
@media (max-width:1180px){
.app-head-brand{flex:1 1 300px}
/* The text column must GROW into the space the hidden clock vacates, or a
231px title gets squeezed into 210px and wraps — which grows the brand block
past the logo's 106px and collides with the date and swatch (CLAUDE.md pins
all three header objects to that height). Nowrap is kept from the base rule;
24px keeps the longest title ("Business Foundation", ~262px) well inside. */
.app-head-brand>div{flex:1 1 auto}
.app-head-title{font-size:24px}
/* the clock keeps both its plate and its zone column; the digits and the
timer give up a little width instead */
.app-clock{flex:0 1 auto;gap:10px}
.clock-d{font-size:44px}
.clock-sep{font-size:36px}
.app-pom{flex:0 0 210px}
.pom-time{font-size:30px}
}
/* ---- Scout: the assistant's face ----------------------------------------- */
.chat-fab{width:84px;height:84px}
@media (max-width:720px){.chat-fab{width:64px;height:64px}}
.chat-fab .scout{animation:scout-bob 3.8s ease-in-out infinite}
.chat-fab:hover .scout{animation-duration:1.9s}
.scout-lid{transform-origin:center;animation:scout-blink 6.2s ease-in-out infinite}
.scout-lid.b{animation-delay:.08s}
.scout-ant{transform-origin:60px 30px;animation:scout-ant 3.8s ease-in-out infinite}
@keyframes scout-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes scout-blink{0%,92%,100%{transform:scaleY(0)}94%,98%{transform:scaleY(1)}}
@keyframes scout-ant{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}
@media (prefers-reduced-motion:reduce){.chat-fab .scout,.scout-lid,.scout-ant{animation:none}}
/* ---- role bar -------------------------------------------------------------
Paints its own surface so it reads on the light page ground and inside the
phone column's navy ground alike. Ink comes from tokens, never a literal. */
.role-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:18px 0 12px;padding:10px 12px;background:var(--surface2);border:1px solid var(--line);border-radius:8px}
.role-bar .kicker{color:var(--gold-ink)}
.role-seg{display:flex;border:1px solid var(--line);border-radius:6px;overflow:hidden}
.role-seg button{font:700 14px ui-monospace,Menlo,Consolas,monospace;letter-spacing:.03em;padding:7px 14px;border:0;background:transparent;color:var(--head);cursor:pointer}
.role-seg button + button{border-left:1px solid var(--line)}
.role-seg button[aria-pressed="true"]{background:#D9A441;color:var(--b-brand)}
.role-note{font:15px -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted)}
.lock-btn{margin-left:auto;flex:none;font:800 13px ui-monospace,Menlo,Consolas,monospace;letter-spacing:.04em;color:var(--head);background:var(--surface3);border:1px solid var(--line);border-radius:6px;padding:8px 12px;cursor:pointer}
.lock-btn:hover{border-color:#D9A441}
/* the launcher pinned inside a page's own frame (the phone column) */
.chat-fab.in-frame,.chat-pop.in-frame{position:absolute}
.chat-fab.in-frame{right:16px;bottom:16px;width:64px;height:64px}
.chat-pop.in-frame{right:16px;bottom:16px;width:calc(100% - 32px);max-height:520px}
/* ---- clock zones and their gear ------------------------------------------ */
.app-clock{position:relative}
.clock-gear{position:absolute;right:-6px;top:2px;width:26px;height:26px;display:grid;place-items:center;padding:0;border:1px solid rgba(250,247,242,.34);border-radius:6px;background:transparent;color:#C9D6E4;cursor:pointer;opacity:0;transition:opacity .15s ease}
.app-clock:hover .clock-gear,.clock-gear:focus-visible{opacity:1}
.clock-panel{position:absolute;right:-6px;top:32px;z-index:130;display:none;width:240px;padding:12px;background:var(--b-deep);border:1px solid var(--b-line);border-radius:8px;box-shadow:0 18px 40px rgba(0,0,0,.5)}
.clock-panel.open{display:block}
.clock-panel label{display:block;font:800 11px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.06em;color:#D9A441;margin:0 0 4px}
.clock-panel select{width:100%;box-sizing:border-box;margin-bottom:9px;font:700 14px ui-monospace,Menlo,Consolas,monospace;color:var(--b-brand);background:#FAF7F2;border:0;border-radius:5px;padding:8px 9px;cursor:pointer}
.clock-panel p{margin:0;font:13px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#C9D6E4}
/* ---- phones: every page, from the one stylesheet -------------------------
The rail becomes a scrolling tab strip, the header stacks, and any fixed
grid track collapses to one column. */
@media (max-width:820px){
.app-shell{grid-template-columns:1fr}
.app-rail{display:flex;align-items:stretch;gap:2px;overflow-x:auto;-webkit-overflow-scrolling:touch;border-right:0;border-bottom:1px solid var(--b-line);padding:6px 8px}
.app-rail::-webkit-scrollbar{height:6px}
.rail-section{display:none}
.rail-item{flex:none;white-space:nowrap;padding:11px 13px;border-left:0;border-bottom:3px solid transparent;font-size:15px}
.rail-item.sub{padding-left:13px;font-size:15px}
.rail-item.is-active{background:transparent;border-bottom-color:#D9A441}
.rail-foot{flex:none;width:auto!important;margin:0!important;padding:0 10px!important;border:0!important;display:flex;align-items:center}
.rail-foot br{display:none}
.app-head{flex-direction:column;align-items:stretch;gap:12px;padding:12px 14px}
.app-head-brand{flex:1 1 auto;gap:12px;flex-wrap:wrap}
/* Both carry align-self:center for the desktop row. Once .app-head is a
column that centre is horizontal, so they float indented — stretch resets
it (align-self on the child beats the container's align-items). */
.app-clock,.app-pom{margin:0;align-self:stretch}
.app-logo{width:64px;height:64px}
.app-head-title{font-size:24px;white-space:normal}
/* The face grows into the row instead of sitting content-width with the
zone column stranded beside it; the digits scale with it. */
.app-clock{flex:1 1 auto;height:auto;justify-content:flex-start;gap:12px}
.clock-face{flex:1 1 auto;justify-content:space-around;padding:10px 12px}
.clock-d{font-size:clamp(40px,13vw,58px)}
.clock-sep{font-size:clamp(32px,10vw,46px);padding-bottom:4px}
.clock-side{flex:none}
.app-pom{flex:1 1 auto;width:auto;height:auto}
/* content columns and cards */
.pulse-grid{padding-left:14px!important;padding-right:14px!important;gap:12px}
.pulse-grid > *{grid-column:span 12!important;min-width:0}
.pulse-card-hd{flex-wrap:wrap}
.pulse-tiles{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
/* any hand-written fixed grid track stacks rather than overflowing */
[style*="grid-template-columns:repeat("]{grid-template-columns:1fr!important}
[style*="grid-template-columns:1fr 1fr"]{grid-template-columns:1fr!important}
[style*="grid-template-columns:214px"]{grid-template-columns:1fr!important}
[data-board]{grid-template-columns:1fr!important}
/* wide tables scroll instead of squeezing */
.pulse-table,.pulse-card-body > div[style*="grid-template-columns:1.6fr"],
.pulse-card-body > div[style*="grid-template-columns:1.4fr"]{overflow-x:auto}
}
/* ---- zebra list with category headers ------------------------------------ */
.zebra{display:grid;grid-template-columns:1.1fr 2.2fr .9fr;gap:0}
.zebra-head,.zebra-row{display:grid;grid-template-columns:subgrid;grid-column:1/-1;align-items:start;padding:11px 14px;gap:14px}
.zebra-head{background:var(--b-deep)}
.zebra-head span{font:800 12px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.06em;color:#D9A441}
.zebra-cat{grid-column:1/-1;padding:9px 14px;background:var(--surface3);border-top:1px solid var(--line);border-bottom:1px solid var(--line);font:800 12px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.06em;color:var(--muted2)}
.zebra-group{display:grid;grid-template-columns:subgrid;grid-column:1/-1}
.zebra-group > .zebra-row:nth-child(even){background:var(--surface2)}
.zebra-row + .zebra-row{border-top:1px solid var(--rule)}
.zebra-n{font:800 17px/1.25 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink)}
.zebra-d{font:15px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted)}
.zebra-c{font:700 13px/1.4 ui-monospace,Menlo,Consolas,monospace;color:var(--head);text-align:right}
@media (max-width:820px){
.zebra{grid-template-columns:1fr}
.zebra-head{display:none}
.zebra-group{grid-template-columns:1fr}
.zebra-row{grid-template-columns:1fr;gap:4px}
.zebra-c{text-align:left}
}
/* ---- profit time energy maximizer ---------------------------------------- */
/* The board is the workbook's columns, grouped by the two axes the exercise
sorts on: what the time PAYS and what it DOES TO YOU. Columns are capped at
290px rather than 1fr so a two-column group does not stretch to half a board.
.pte-col-hd is declared BEFORE the .pte-p-* plates on purpose: the gold plate
has to override the white ink set here. */
.pte-board{display:flex;flex-direction:column;gap:18px}
.pte-grp-hd{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin-bottom:9px;padding-bottom:7px;border-bottom:1px solid var(--line)}
/* --gold-ink, not the #D9A441 plate: the rail's gold section headers sit on the
navy rail ground, but these sit on a light card surface where that hex is
2.25:1. --gold-ink is the text role for exactly this. */
.pte-grp-k{font:800 12px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.06em;color:var(--gold-ink)}
.pte-grp-d{flex:1 1 240px;font:14px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted)}
.pte-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,290px));gap:12px}
.pte-col{display:flex;flex-direction:column;min-width:0;background:var(--surface2);border:1px solid var(--line);border-radius:6px;overflow:hidden}
.pte-col.is-over{outline:2px solid #D9A441;outline-offset:-2px}
.pte-col-hd{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:10px 11px;font:800 15px/1.25 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#FFFFFF;text-shadow:0 1px 2px rgba(0,0,0,.45)}
.pte-col-hd b{flex:none;font:800 12px/1 ui-monospace,Menlo,Consolas,monospace;opacity:.8}
.pte-col-d{padding:9px 11px;border-bottom:1px solid var(--line);font:14px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted);text-wrap:pretty}
.pte-col-d i{display:block;margin-top:5px;font:13px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;font-style:normal;color:var(--muted2)}
.pte-col-items{flex:1 1 auto;min-height:44px;max-height:320px;overflow-y:auto;overscroll-behavior:contain}
.pte-col-empty{padding:11px;font:14px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted2)}
.pte-col-add{padding:8px;border-top:1px solid var(--line);background:var(--surface3)}
.pte-item{padding:8px 10px;border-bottom:1px solid var(--rule);cursor:grab;touch-action:none}
.pte-item:last-child{border-bottom:0}
.pte-item:hover{background:var(--surface3)}
.pte-item.is-dragging{opacity:.3;cursor:grabbing}
.pte-item.drop-before{box-shadow:inset 0 3px 0 #D9A441}
.pte-item.drop-after{box-shadow:inset 0 -3px 0 #D9A441}
.pte-ghost{background:var(--surface);border:1px solid var(--line);border-radius:6px;box-shadow:0 22px 44px rgba(0,0,0,.42);cursor:grabbing}
.pte-item-h{display:flex;align-items:flex-start;gap:8px}
/* the grip is the drag affordance: two rows of dots, drawn not iconised */
.pte-grip{flex:none;width:10px;height:16px;margin-top:3px;background-image:radial-gradient(circle,var(--muted2) 1px,transparent 1.2px);background-size:5px 5px;opacity:.75}
.pte-item-t{flex:1 1 auto;min-width:0;font:15px/1.35 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink);text-wrap:pretty}
.pte-item-c{display:flex;align-items:center;gap:6px;margin-top:7px;padding-left:18px}
.pte-item-lb{flex:none;font:800 10px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.05em;color:var(--muted2)}
.pte-mini{flex:none;min-height:36px;max-width:100%;padding:6px 8px;background:var(--surface);border:1px solid var(--line);border-radius:5px;font:700 13px ui-monospace,Menlo,Consolas,monospace;color:var(--head);cursor:pointer}
.pte-mini.grow{flex:1 1 auto;min-width:0;font:700 12px -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}
.pte-mini:focus-visible{outline:2px solid #D9A441;outline-offset:1px}
.pte-in{flex:1;width:100%;min-width:0;box-sizing:border-box;min-height:44px;padding:11px 13px;background:var(--surface2);border:1px solid var(--line);border-radius:6px;font:16px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink)}
.pte-in:focus{outline:2px solid #D9A441;outline-offset:1px;border-color:#D9A441}
.pte-in::placeholder{color:var(--muted2)}
.pte-in.sm{min-height:40px;padding:9px 10px;font-size:15px}
.pte-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 0;border-bottom:1px solid var(--rule)}
.pte-row:last-child{border-bottom:0}
.pte-name{flex:1 1 220px;min-width:0;font:16px/1.35 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink)}
.pte-tag{display:inline-block;margin-left:9px;font:800 11px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.05em;color:var(--muted2);font-style:normal;text-transform:uppercase}
.pte-sel{flex:none;min-height:44px;padding:9px 11px;background:var(--surface2);border:1px solid var(--line);border-radius:5px;font:700 14px ui-monospace,Menlo,Consolas,monospace;color:var(--head);cursor:pointer}
.pte-sel.wide{font:700 14px -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}
.pte-sel:focus-visible{outline:2px solid #D9A441;outline-offset:1px}
.pte-seg{display:flex;flex:none;border:1px solid var(--line);border-radius:5px;overflow:hidden}
.pte-seg button{min-height:44px;padding:0 13px;border:0;background:transparent;font:800 12px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.05em;color:var(--muted);cursor:pointer}
.pte-seg button+button{border-left:1px solid var(--line)}
.pte-seg button:hover{background:var(--surface3);color:var(--head)}
.pte-seg button.is-on{background:var(--b-mid);color:#FFFFFF}
.pte-x{flex:none;width:44px;height:44px;border:1px solid var(--line);border-radius:5px;background:transparent;color:var(--muted2);font:700 17px/1 ui-monospace,Menlo,Consolas,monospace;cursor:pointer}
.pte-x:hover{border-color:var(--warn-plate);color:var(--warn-ink)}
.pte-x.sm{width:28px;height:28px;border-color:transparent;font-size:15px}
.pte-x.sm:hover{border-color:var(--warn-plate)}
.pte-empty{padding:14px 0;font:16px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted);text-wrap:pretty}
.pte-scroll{max-height:430px;overflow-y:auto;overscroll-behavior:contain;padding-bottom:2px}
/* "needs my ownership" — the delegation-is-not-abdication mark */
.pte-own{flex:none;min-height:44px;padding:0 13px;background:transparent;border:1px solid var(--line);border-radius:5px;font:800 11px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.05em;color:var(--muted);cursor:pointer}
.pte-own:hover{border-color:#D9A441;color:var(--head)}
.pte-own.is-on{background:var(--b-steel);border-color:var(--b-steel);color:#FFFFFF;text-shadow:0 1px 2px rgba(0,0,0,.45)}
/* the time tracker: a stopwatch log against the board's own activities */
.pte-tr{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:9px 0;border-bottom:1px solid var(--rule)}
.pte-tr:last-child{border-bottom:0}
.pte-tr.is-on{background:var(--surface3)}
.pte-tr-t{flex:1 1 180px;min-width:0;font:15px/1.35 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink)}
.pte-tr-v{flex:none;font:800 16px ui-monospace,Menlo,Consolas,monospace;color:var(--head);font-variant-numeric:tabular-nums}
.pte-go{flex:none;min-height:44px;padding:0 14px;background:transparent;border:1px solid var(--line);border-radius:5px;font:800 12px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.05em;color:var(--head);cursor:pointer}
.pte-go:hover{border-color:#D9A441;background:var(--surface3)}
.pte-go.on{background:var(--warn-plate);border-color:var(--warn-plate);color:#FFFFFF;text-shadow:0 1px 2px rgba(0,0,0,.45)}
.pte-run{font:800 13px/1.3 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.04em;color:var(--muted2)}
/* the Big Rocks video: a real preview that loads the embed on click */
.pte-vid{position:relative;aspect-ratio:16/9;background:var(--b-deep);border:1px solid var(--line);border-radius:6px;overflow:hidden;cursor:pointer}
.pte-vid img{display:block;width:100%;height:100%;object-fit:cover;opacity:.86}
.pte-vid iframe{display:block;width:100%;height:100%;border:0}
.pte-play{position:absolute;inset:0;margin:auto;width:72px;height:72px;display:grid;place-items:center;border-radius:50%;border:2px solid rgba(255,255,255,.92);background:rgba(18,40,63,.74);color:#FFFFFF;font:20px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;cursor:pointer}
.pte-vid:hover .pte-play{background:#C0563A;border-color:#FFFFFF}
.pte-play:focus-visible{outline:2px solid #D9A441;outline-offset:3px}
.pte-vid-cap{position:absolute;left:0;right:0;bottom:0;padding:9px 12px;background:linear-gradient(to top,rgba(9,16,24,.88),transparent);font:800 12px/1.3 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.05em;color:#FFFFFF;pointer-events:none}
/* the plan: seven days, big rocks marked */
.pte-planbar{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px;margin-bottom:14px}
.pte-planbar .pte-fld{flex:1 1 180px;min-width:0}
.pte-planbar .pte-fld.narrow{flex:0 1 110px}
.pte-week{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:10px}
.pte-day{display:flex;flex-direction:column;min-width:0;background:var(--surface2);border:1px solid var(--line);border-radius:6px;overflow:hidden}
.pte-day-hd{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:9px 10px;background:var(--surface3);border-bottom:1px solid var(--line);font:800 12px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.06em;color:var(--head)}
.pte-day-hd b{font:800 12px/1 ui-monospace,Menlo,Consolas,monospace;color:var(--muted2)}
.pte-day-b{flex:1 1 auto}
.pte-blk{display:flex;align-items:flex-start;gap:7px;padding:8px 10px;border-bottom:1px solid var(--rule)}
.pte-blk:last-child{border-bottom:0}
.pte-blk.rock{background:var(--surface3)}
.pte-rock{flex:none;width:9px;height:9px;margin-top:5px;border-radius:50%;background:var(--gold-ink)}
.pte-blk-t{flex:1 1 auto;min-width:0;font:14px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink);text-wrap:pretty}
.pte-blk-t i{display:block;margin-top:2px;font:800 11px/1 ui-monospace,Menlo,Consolas,monospace;font-style:normal;color:var(--muted2)}
.pte-day-warn{padding:7px 10px;border-top:1px solid var(--line);font:800 11px/1.3 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.05em;color:var(--warn-ink)}
.pte-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.pte-fld label{display:block;margin-bottom:6px;font:800 12px/1.35 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.055em;color:var(--muted2)}
.pte-help .pte-fld{display:grid;grid-template-rows:auto 1fr}
.pte-help .pte-fld label{min-height:33px}
.pte-ta{width:100%;box-sizing:border-box;min-height:80px;resize:vertical;padding:10px 12px;background:var(--surface2);border:1px solid var(--line);border-radius:6px;font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink)}
.pte-ta:focus{outline:2px solid #D9A441;outline-offset:1px;border-color:#D9A441}
.pte-help{position:relative;display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px 12px;align-items:stretch;padding:14px 52px 14px 0;border-bottom:1px solid var(--rule)}
.pte-help:last-child{border-bottom:0}
.pte-help .pte-x{position:absolute;top:14px;right:0}
.pte-find{padding:0 0 14px;margin-bottom:14px;border-bottom:1px solid var(--rule)}
.pte-find:last-child{padding-bottom:0;margin-bottom:0;border-bottom:0}
.pte-find-hd{display:inline-block;padding:7px 12px;border-radius:5px;font:800 13px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.05em;color:#FFFFFF;text-shadow:0 1px 2px rgba(0,0,0,.45);text-transform:uppercase}
.pte-p-mid{background:var(--b-mid)}
.pte-p-warn{background:var(--warn-plate)}
.pte-p-good{background:var(--good-plate)}
.pte-p-steel{background:var(--b-steel)}
.pte-p-plum{background:var(--plum-plate)}
.pte-p-stone{background:var(--stone-plate)}
.pte-p-brand{background:var(--b-brand)}
.pte-p-gold{background:var(--gold-plate);color:var(--on-gold);text-shadow:0 1px 0 rgba(255,255,255,.6)}
.pte-find-b{margin-top:10px;font:17px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink);text-wrap:pretty}
.pte-find-b b{font:800 15px ui-monospace,Menlo,Consolas,monospace;color:var(--muted2)}
.pte-find-n{margin-top:5px;font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted);text-wrap:pretty}
/* the lesson cards at the top of the page */
.pte-lesson{font:16px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink);text-wrap:pretty;margin:0 0 11px}
.pte-lesson:last-child{margin-bottom:0}
.pte-lesson strong{color:var(--head)}
.pte-eg{margin-top:11px;padding:11px 13px;background:var(--surface3);border-radius:6px;font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted);text-wrap:pretty}
.pte-eg b{display:block;margin-bottom:4px;font:800 11px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.055em;color:var(--muted2);text-transform:uppercase}
@media (max-width:820px){
.pte-row{align-items:flex-start}
.pte-name{flex:1 1 100%}
.pte-cols{grid-template-columns:1fr}
.pte-col-items{max-height:none}
.pte-item-c>*{min-height:44px}
.pte-x.sm{width:36px;height:36px}
}
/* ---- month calendar ------------------------------------------------------ */
.minical{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}
.minical [data-cal-dow]{font:800 11px/1 ui-monospace,Menlo,Consolas,monospace;color:var(--muted2);text-align:center;padding:0 0 5px}
.minical [data-cal-day],.minical [data-cal-pad]{aspect-ratio:1;display:grid;place-items:center;font:700 13px/1 ui-monospace,Menlo,Consolas,monospace;color:var(--ink);border-radius:5px}
.minical [data-cal-day]{background:var(--surface3)}
.minical [data-cal-today]{background:#D9A441;color:var(--b-brand);font-weight:800;box-shadow:0 0 0 2px rgba(217,164,65,.34)}
/* the quote under it */
.pulse-quote{margin:12px 0 0;padding:12px 13px;background:var(--surface3);border-radius:6px}
.pulse-quote q{display:block;font:italic 16px/1.45 Georgia,"Times New Roman",serif;color:var(--ink);text-wrap:pretty}
.pulse-quote cite{display:block;margin-top:7px;font:800 11px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.06em;color:var(--muted2);font-style:normal}
/* ---- the day's agenda ---------------------------------------------------- */
.agenda{display:flex;flex-direction:column;gap:0}
.agenda-row{display:grid;grid-template-columns:max-content 5px minmax(0,1fr) auto;gap:11px;align-items:center;padding:10px 0;border-bottom:1px solid var(--rule)}
.agenda-row > span:nth-child(3){display:flex;flex-direction:column;gap:3px;min-width:0}
.agenda-row:last-child{border-bottom:0}
.agenda-t{font:700 14px/1 ui-monospace,Menlo,Consolas,monospace;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.agenda-bar{align-self:stretch;border-radius:3px;min-height:26px}
.agenda-n{display:block;font:800 16px/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink)}
.agenda-s{display:block;font:14px/1.35 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted)}
.agenda-row.is-now{background:var(--surface3);border-radius:6px;padding:10px 9px}
@media (max-width:820px){
.agenda-row{grid-template-columns:max-content 5px minmax(0,1fr);row-gap:4px}
.agenda-row > .pulse-badge{grid-column:3}
}
/* ---- journal -------------------------------------------------------------- */
.j-write{width:100%;box-sizing:border-box;min-height:260px;resize:vertical;padding:14px 15px;background:var(--surface2);border:1px solid var(--line);border-radius:6px;font:17px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink)}
.j-write:focus{outline:2px solid #D9A441;outline-offset:1px;border-color:#D9A441}
.j-write::placeholder{color:var(--muted2)}
.j-bar{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:11px}
.j-btn{flex:none;font:800 13px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.04em;color:var(--b-brand);background:#D9A441;border:0;border-radius:5px;padding:10px 13px;cursor:pointer}
.j-btn:hover{background:#E7B858}
.j-btn.ghost{color:var(--head);background:transparent;border:1px solid var(--line)}
.j-btn.ghost:hover{border-color:#D9A441;background:var(--surface3)}
.j-use{flex:none;font:800 11px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.05em;color:var(--head);background:transparent;border:1px solid var(--line);border-radius:4px;padding:6px 9px;cursor:pointer}
.j-use:hover{border-color:#D9A441;background:var(--surface3)}
.j-prompt{margin:0 0 11px;padding:11px 13px;background:var(--surface3);border-radius:6px;font:italic 17px/1.45 Georgia,"Times New Roman",serif;color:var(--ink)}
.j-entry{border-bottom:1px solid var(--rule)}
.j-entry:last-child{border-bottom:0}
.j-entry summary{display:grid;grid-template-columns:minmax(140px,auto) minmax(0,1fr) auto;gap:12px;align-items:baseline;padding:11px 0;cursor:pointer;list-style:none}
.j-entry summary::-webkit-details-marker{display:none}
.j-entry summary:hover .j-date{color:#B0873A}
.j-date{font:800 15px/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--head)}
.j-first{font:15px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted);min-width:0}
.j-words{font:700 12px/1 ui-monospace,Menlo,Consolas,monospace;color:var(--muted2);white-space:nowrap}
.j-full{margin:0 0 14px;padding:12px 13px;background:var(--surface2);border-radius:6px;font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink);white-space:pre-wrap}
@media (max-width:820px){
.j-entry summary{grid-template-columns:1fr;gap:3px}
}
/* ---- self-service audit ------------------------------------------------ */
/* The question stage. One question at a time, so the question itself is the
largest type on the page — above .pulse-lead, below the header title. */
.aud-q{margin:0;font:800 30px/1.22 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--head);text-wrap:pretty}
.aud-help{margin:0;font:17px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted);text-wrap:pretty}
.aud-help.sm{font-size:15px}
.aud-field{display:block;width:100%;box-sizing:border-box;min-height:148px;resize:vertical;margin:7px 0 8px;padding:14px 15px;background:var(--surface2);border:1px solid var(--line);border-radius:6px;font:17px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink)}
.aud-field:focus{border-color:#D9A441}
.aud-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.aud-go{flex:none;font:800 14px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.04em;color:var(--b-brand);background:#D9A441;border:0;border-radius:6px;padding:13px 18px;cursor:pointer}
.aud-go:hover{background:#E7B858}
.aud-go.big{font-size:15px;padding:15px 22px}
.aud-ghost{flex:none;font:800 14px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.04em;color:var(--head);background:transparent;border:1px solid var(--line);border-radius:6px;padding:13px 16px;cursor:pointer}
.aud-ghost:hover{border-color:#D9A441;background:var(--surface3)}
.aud-save{margin-left:auto;display:flex;align-items:center;gap:7px;font:700 13px/1 ui-monospace,Menlo,Consolas,monospace;color:var(--muted2);white-space:nowrap}
.aud-save i{width:8px;height:8px;flex:none;border-radius:50%;background:var(--good-ink);display:block}
/* seven segments, not a percentage bar: motion.js only grows with an
inline width, and these carry none, so they sit still on load */
.aud-track{display:flex;gap:5px}
.aud-track i{flex:1;height:5px;border-radius:3px;background:var(--track);display:block}
.aud-track i.on{background:#D9A441}
.aud-path-i{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:11px;align-items:center;padding:11px 0;border-bottom:1px solid var(--rule)}
.aud-path-i:last-child{border-bottom:0}
.aud-n{width:26px;height:26px;flex:none;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;font:800 12px/1 ui-monospace,Menlo,Consolas,monospace;color:var(--muted2)}
.aud-path-t{font:16px/1.35 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted);text-wrap:pretty}
.aud-path-i.is-now .aud-n{background:#D9A441;border-color:#D9A441;color:var(--b-brand)}
.aud-path-i.is-now .aud-path-t{font-weight:800;color:var(--ink)}
/* a slot holds copy describing what will appear, not a fabricated answer */
.aud-slot{padding:15px;border:1px dashed var(--line);border-radius:6px;background:var(--surface2);font:16px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted);text-wrap:pretty}
.aud-choice{display:flex;gap:9px;flex-wrap:wrap}
.aud-choice button{flex:1 1 auto;min-width:92px;font:800 14px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.03em;color:var(--head);background:transparent;border:1px solid var(--line);border-radius:6px;padding:12px 13px;cursor:pointer}
.aud-choice button:hover{border-color:#D9A441;background:var(--surface3)}
@media (max-width:820px){
.aud-q{font-size:25px}
.aud-save{margin-left:0;width:100%}
}
/* ---- the Audit as one question at a time -------------------------------
A questionnaire, not a dashboard: dark surround, one centred sheet, one
question on it. Nothing else is on the screen. */
.q1-wrap{min-height:100vh;box-sizing:border-box;background:var(--b-deep);display:flex;flex-direction:column;align-items:center;padding:0 22px 72px}
.q1-mast{display:flex;align-items:center;justify-content:center;gap:11px;height:82px;flex:none}
.q1-mast span{font:700 12px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.8)}
.q1-card{width:100%;max-width:900px;box-sizing:border-box;background:var(--surface);border:1px solid var(--line);border-radius:4px;padding:52px 72px 64px;display:flex;flex-direction:column;gap:28px;box-shadow:0 26px 64px rgba(0,0,0,.3)}
.q1-dots{display:flex;gap:10px;justify-content:center;flex:none}
.q1-dots i{width:11px;height:11px;border-radius:50%;box-sizing:border-box;background:transparent;border:1.5px solid var(--muted2);display:block}
.q1-dots i.on{background:var(--gold-ink);border-color:var(--gold-ink)}
.q1-eyebrow{margin:0;text-align:center;font:700 12px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--muted2)}
.q1-q{margin:0;text-align:center;font:700 40px/1.16 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--head);text-wrap:balance}
.q1-help{margin:0 auto;max-width:54ch;text-align:center;font:18px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted);text-wrap:pretty}
.q1-field{display:block;width:100%;box-sizing:border-box;min-height:170px;resize:vertical;padding:20px 22px;background:var(--surface2);border:1px solid var(--line);border-radius:4px;font:19px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink)}
.q1-field:focus{outline:none;border-color:#D9A441}
.q1-opts{display:flex;flex-direction:column;gap:11px;max-width:620px;width:100%;margin:0 auto}
.q1-opt{display:grid;grid-template-columns:auto minmax(0,1fr);gap:15px;align-items:center;width:100%;box-sizing:border-box;padding:17px 20px;text-align:left;background:transparent;border:1px solid var(--line);border-radius:4px;font:18px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink);cursor:pointer}
.q1-opt:hover{border-color:#D9A441;background:var(--surface2)}
.q1-opt i{width:20px;height:20px;flex:none;border-radius:50%;border:1.5px solid var(--muted2);display:block}
.q1-opt.is-on{border-color:#D9A441;background:var(--surface2)}
.q1-opt.is-on i{border-color:#D9A441;background:#D9A441;box-shadow:inset 0 0 0 3.5px var(--surface2)}
.q1-echo{font:20px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink);padding:20px 24px;background:var(--surface2);border-left:3px solid #D9A441;border-radius:0 4px 4px 0;text-wrap:pretty}
.q1-acts{display:flex;flex-direction:column;align-items:center;gap:16px}
.q1-go{font:700 17px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--on-gold);background:#D9A441;border:0;border-radius:999px;padding:17px 40px;cursor:pointer}
.q1-go:hover{background:#E7B858}
.q1-quiet{font:15px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted2);background:transparent;border:0;padding:4px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.q1-quiet:hover{color:#D9A441}
.q1-swatch{display:flex;gap:7px;justify-content:center;margin-top:26px;flex:none}
.q1-swatch button{width:16px;height:16px;border-radius:50%;border:1px solid rgba(255,255,255,.3);cursor:pointer;padding:0}
@media (max-width:820px){
.q1-wrap{padding:0 14px 44px}
.q1-card{padding:30px 22px 38px;gap:22px;border-radius:3px}
.q1-q{font-size:27px}
.q1-help{font-size:16px}
.q1-field{font-size:17px;min-height:150px;padding:15px 16px}
.q1-opt{font-size:16px;padding:15px 16px}
.q1-echo{font-size:17px;padding:16px 18px}
.q1-go{width:100%;padding:17px 20px}
}
/* ---- the Audit as a page of its own ------------------------------------ */
/* No rail, no clock, no timer: this is not the dashboard, so it keeps the
dashboard's type, card and colour roles on a single reading column. */
.audp{min-height:100vh;background:var(--page-bg);padding:0 0 46px}
.audp-top{display:flex;align-items:center;gap:12px;padding:14px 20px;border-bottom:1px solid var(--line)}
.audp-mark{height:34px;width:auto;flex:none;display:block}
.audp-word{flex:1;min-width:0;font:800 16px/1.15 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--head)}
.audp-word span{display:block;color:var(--muted)}
.audp-wrap{max-width:1040px;margin:0 auto;padding:20px 16px 0;display:flex;flex-direction:column;gap:16px}
/* the opening: reversed white type, so a dark drop shadow, per the system */
.audp-hero{padding:30px 22px;border-radius:10px;background:var(--grad-cool);box-shadow:0 10px 26px rgba(0,0,0,.28)}
.audp-hero .kicker{color:rgba(255,255,255,.82);text-shadow:0 1px 2px rgba(0,0,0,.45)}
.audp-hero h1{margin:9px 0 0;font:800 36px/1.1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#FFFFFF;text-shadow:0 1px 3px rgba(0,0,0,.5);text-wrap:pretty}
.audp-hero p{margin:11px 0 0;font:19px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:rgba(255,255,255,.94);text-shadow:0 1px 2px rgba(0,0,0,.45);max-width:34em;text-wrap:pretty}
.audp-hero .aud-bar{margin-top:20px}
.audp-hero .audp-fine{color:rgba(255,255,255,.8);text-shadow:0 1px 2px rgba(0,0,0,.45)}
.audp-fine{margin:0;font:14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted);text-wrap:pretty}
/* desktop puts the running account of the answers beside the live question */
.audp-cols{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
@media (min-width:960px){
.audp-cols{grid-template-columns:minmax(0,7fr) minmax(0,4fr);align-items:start}
.audp-cols.two{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}
.audp-foot{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:2px;padding:13px 15px;background:var(--surface2);border:1px solid var(--line);border-radius:8px}
/* where the person is, with no claim about how many questions remain */
.audp-place{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.audp-dots{display:flex;align-items:center;gap:6px}
.audp-dots i{width:7px;height:7px;border-radius:50%;background:var(--track);display:block}
.audp-dots i.done{background:var(--good-ink)}
.audp-dots i.now{width:11px;height:11px;background:#D9A441}
.aud-save.is-pending i{background:#D9A441}
.aud-save.is-none i{background:var(--track)}
/* one plain failure notice; it names no cause the runtime cannot know */
.audp-notice{display:flex;gap:10px;align-items:flex-start;padding:12px 13px;border-radius:6px;background:var(--warn-bg);border:1px solid var(--warn-plate);font:15px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink);text-wrap:pretty}
.audp-notice b{color:var(--warn-ink)}
@media (max-width:820px){
.audp-hero{padding:24px 18px;border-radius:8px}
.audp-hero h1{font-size:29px}
.audp-hero p{font-size:17px}
.audp-wrap{padding:14px 12px 0;gap:14px}
.audp-go-wide .aud-go,.audp-go-wide .aud-ghost{flex:1 1 100%}
}
/* a day with a journal entry, in the shared month grid */
.minical [data-cal-has]{box-shadow:inset 0 -3px 0 #D9A441}
.minical [data-cal-today][data-cal-has]{box-shadow:0 0 0 2px rgba(217,164,65,.34),inset 0 -3px 0 var(--b-brand)}
:root{--page-bg:#FAF7F2;
--b-ground:#322745;--b-brand:#4A2B5F;--b-deep:#2E1A3D;--b-mid:#6A3D82;--b-steel:#4B3A5D;
--grad-stone:linear-gradient(150deg,#655F52,#3C3931);--grad-steel:linear-gradient(150deg,#4B3A5D,#31243F);--grad-gold:linear-gradient(150deg,#D9BC85,#B08F4C);
--gold:#D9A441;--gold-ink:#8A6620;--on-gold:#12283F;
--surface:#FFFFFF;--surface2:#FBF9F5;--surface3:#F3F1EA;--line:#E4DFD2;--rule:#EDEAE1;--ink:#1F2430;--muted:#4A5160;--muted2:#6E6A5C;--head:var(--b-brand)}
body{margin:0;background:var(--page-bg);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;color:var(--ink)}
a{color:var(--b-brand);font-weight:700}a:hover{color:var(--gold-ink)}
:where(a,button,input,select,[tabindex]):focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:4px}
img{display:block}
.k{font:800 12px/1.2 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.07em;text-transform:uppercase}
.cut{display:block;width:100%;height:100%}
.site{container-type:inline-size}
.nav{display:flex;align-items:center;gap:14px 26px;flex-wrap:wrap;padding:14px 30px;background:var(--b-ground);border-bottom:4px solid var(--gold)}
.nav-logo{width:58px;height:58px;flex:none;border-radius:8px;border:1px solid rgba(217,164,65,.45);box-shadow:0 8px 22px rgba(0,0,0,.34)}
.nav-brand{display:flex;align-items:center;gap:13px;min-width:0}
.nav-brand .kk{font:800 12px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.08em;color:var(--gold);margin-bottom:6px}
.nav-brand .tt{font:800 25px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#FAF7F2;text-shadow:0 2px 6px rgba(0,0,0,.4)}
.nav ul{display:flex;align-items:center;gap:2px;flex-wrap:wrap;margin:0 0 0 auto;padding:0;list-style:none}
.nav nav{margin-left:auto}
.nav button.navlink{appearance:none;border:0;background:transparent;cursor:pointer;display:flex;align-items:center;min-height:44px;padding:0 15px;font:700 16px/1.2 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:rgba(255,255,255,.86);border-radius:5px 5px 0 0}
.nav button.navlink:hover{color:var(--gold);background:rgba(255,255,255,.07)}
.nav button.navlink[aria-current]{color:#FFFFFF;box-shadow:inset 0 -3px 0 var(--gold)}
.nav-join{display:flex;align-items:center;gap:8px}
.nav-join form{display:flex;align-items:center;gap:8px}
.nav-join input{width:196px;box-sizing:border-box;min-height:42px;padding:0 12px;border:1px solid rgba(255,255,255,.34);border-radius:5px;background:rgba(255,255,255,.1);color:#FAF7F2;font:15px/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;outline:none}
.nav-join input::placeholder{color:rgba(255,255,255,.62)}
.nav-join input:focus{border-color:var(--gold);background:rgba(255,255,255,.16)}
.nav-join .btn{min-height:42px;padding:0 16px;font-size:15px;box-shadow:none}
.nav-join-done{font:800 14px/1.3 ui-monospace,Menlo,Consolas,monospace;color:var(--gold)}
.wrap{max-width:1160px;margin:0 auto;padding:34px 30px 46px;display:flex;flex-direction:column;gap:34px}
.hd-kick{font:800 13px/1.2 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-ink)}
.h1{margin:12px 0 0;font:800 44px/1.06 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;letter-spacing:-.015em;color:var(--head);text-wrap:pretty;max-width:30ch}
.grule{height:4px;width:96px;margin:16px 0 0;background:var(--gold);border-radius:2px}
.lead{margin:18px 0 0;font:20px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted);max-width:62ch;text-wrap:pretty}
.tools{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.srch{flex:1 1 300px;min-width:0;display:flex;align-items:center;gap:10px;min-height:50px;padding:0 15px;background:var(--surface);border:1px solid var(--line);border-radius:6px;box-shadow:0 2px 8px rgba(31,36,48,.05)}
.srch span{font:700 15px ui-monospace,Menlo,Consolas,monospace;color:var(--muted2)}
.srch input{flex:1;min-width:0;border:0;background:transparent;font:16px/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink);outline:none}
.sel{min-height:50px;padding:0 14px;background:var(--surface);border:1px solid var(--line);border-radius:6px;font:700 15px -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink);cursor:pointer;box-shadow:0 2px 8px rgba(31,36,48,.05)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{appearance:none;cursor:pointer;display:flex;align-items:center;min-height:44px;padding:0 16px;background:var(--surface);border:1px solid var(--line);border-radius:5px;font:700 14px ui-monospace,Menlo,Consolas,monospace;letter-spacing:.03em;color:var(--muted);box-shadow:0 2px 8px rgba(31,36,48,.05)}
.chip:hover{color:var(--b-brand);border-color:var(--b-mid)}
.chip[aria-pressed="true"]{background:var(--b-brand);border-color:var(--b-brand);color:#FFFFFF;text-shadow:0 1px 3px rgba(0,0,0,.45)}
.btn{appearance:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:50px;padding:0 24px;border:0;border-radius:6px;background:var(--b-brand);color:#FFFFFF;font:800 16px -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;text-shadow:0 1px 3px rgba(0,0,0,.4);box-shadow:0 8px 20px rgba(74,43,95,.28)}
.btn:hover{background:var(--b-mid)}
.btn.ghost{background:var(--surface);color:var(--b-brand);border:1px solid var(--line);text-shadow:none;box-shadow:0 2px 8px rgba(31,36,48,.05)}
.btn.ghost:hover{border-color:var(--b-mid);color:var(--b-mid)}
.btn.gold{background:var(--gold);color:var(--on-gold);text-shadow:0 1px 0 rgba(255,255,255,.5);box-shadow:0 8px 20px rgba(217,164,65,.34)}
.btn.gold:hover{background:#C7922F}
.hero-slider{position:relative;display:flex;align-items:stretch;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:0 14px 34px rgba(31,36,48,.13)}
.hero-slider::-webkit-scrollbar{display:none}
.hero-ctl{display:flex;align-items:center;gap:12px;padding-top:14px}
.dots{display:flex;gap:8px;margin-right:auto}
.dot{appearance:none;border:0;background:transparent;cursor:pointer;width:40px;height:44px;padding:0;display:flex;align-items:center}
.dot i{display:block;width:100%;height:8px;border-radius:4px;background:var(--line);transition:background .16s}
.dot:hover i{background:var(--b-mid)}
.dot[aria-current] i{background:var(--gold)}
.arrow{appearance:none;cursor:pointer;width:46px;height:46px;flex:none;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--b-brand);font:700 17px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(31,36,48,.05);transition:border-color .16s,color .16s}
.arrow:hover{border-color:var(--b-mid);color:var(--b-mid)}
.feat{flex:0 0 100%;min-width:0;scroll-snap-align:start;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);background:var(--surface)}
.feat.join{background:var(--b-ground)}
.feat.join .feat-img{border-right:1px solid rgba(255,255,255,.18)}
.join-k{font:800 12px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.join-h{margin:0;font:800 33px/1.1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;letter-spacing:-.015em;color:#FAF7F2;text-wrap:pretty}
.join-p{margin:0;font:18px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:rgba(255,255,255,.88)}
.join-form{display:flex;flex-wrap:wrap;gap:10px}
.join-form input{flex:1 1 210px;min-width:0;box-sizing:border-box;min-height:50px;padding:0 13px;border:1px solid rgba(255,255,255,.34);border-radius:6px;background:rgba(255,255,255,.1);color:#FAF7F2;font:16px/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;outline:none}
.join-form input::placeholder{color:rgba(255,255,255,.62)}
.join-form input:focus{border-color:var(--gold);background:rgba(255,255,255,.16)}
.join-small{font:700 12px/1.45 ui-monospace,Menlo,Consolas,monospace;color:rgba(255,255,255,.66)}
.join-done b{display:block;font:800 22px/1.25 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--gold)}
.join-done span{display:block;margin-top:8px;font:17px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:rgba(255,255,255,.88)}
.feat-img{position:relative;aspect-ratio:16/9;min-height:300px;background:#4A2B5F;border-right:1px solid var(--line)}
.feat-img > svg{position:absolute;inset:0}
.feat-bd{padding:28px 30px 30px;display:flex;flex-direction:column;gap:14px;justify-content:center}
.feat-t{margin:0;font:800 33px/1.14 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--head);letter-spacing:-.01em;text-wrap:pretty}
.feat-d{margin:0;font:18px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted);text-wrap:pretty}
.sec-lbl{display:flex;align-items:center;gap:14px}
.sec-lbl h2,.prose .sec-lbl h2{margin:0;font:800 13px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--muted2);white-space:nowrap}
.sec-lbl i{flex:1;height:1px;background:var(--line)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px;align-items:stretch}
.card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:10px;overflow:hidden;box-shadow:0 10px 26px rgba(31,36,48,.10);transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-3px);box-shadow:0 18px 38px rgba(31,36,48,.17)}
.card-img{position:relative;aspect-ratio:3/2;background:#4A2B5F}
.card-img > svg,.card-img > img{position:absolute;inset:0;width:100%;height:100%;display:block}.card-img > img{object-fit:cover}
.card-bd{padding:17px 20px 20px;display:flex;flex-direction:column;gap:10px;flex:1}
.card-kick{font:800 12px/1.2 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-ink)}
.card-t{margin:0;font:800 22px/1.24 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--head);text-wrap:pretty}
.card-t button{appearance:none;border:0;background:transparent;padding:0;margin:0;cursor:pointer;font:inherit;color:inherit;text-align:left;box-shadow:inset 0 -2px 0 var(--gold)}
.card-t button:hover{color:var(--gold-ink)}
.card-d{margin:0;font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted);text-wrap:pretty}
.card-ft{margin-top:auto;padding-top:13px;border-top:1px solid var(--rule);display:flex;gap:8px 14px;flex-wrap:wrap;font:700 13px ui-monospace,Menlo,Consolas,monospace;color:var(--muted2)}
.more{display:flex;justify-content:center;padding-top:6px}
.idx{display:grid;grid-template-columns:minmax(0,1fr) 304px;gap:38px;align-items:start}
.idx-main{display:flex;flex-direction:column;gap:20px;min-width:0}
.side{position:sticky;top:18px;display:flex;flex-direction:column;gap:24px;min-width:0}
.optin{position:relative;overflow:hidden;background:var(--b-ground);border-top:5px solid var(--gold);border-bottom:5px solid var(--gold);padding:22px 22px 24px;display:flex;flex-direction:column;gap:12px}
.optin-glow{position:absolute;right:-60px;top:-60px;width:190px;height:190px;border-radius:50%;background:var(--b-mid);opacity:.4}
.optin > *:not(.optin-glow){position:relative}
.optin-k{font:800 11px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.optin-h{font:800 24px/1.12 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:#FAF7F2;text-wrap:pretty}
.optin-p{margin:0;font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:rgba(255,255,255,.86)}
.optin form{display:flex;flex-direction:column;gap:10px}
.optin input{width:100%;box-sizing:border-box;min-height:46px;padding:0 12px;border:1px solid rgba(255,255,255,.34);border-radius:5px;background:rgba(255,255,255,.1);color:#FAF7F2;font:15px/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;outline:none}
.optin input::placeholder{color:rgba(255,255,255,.6)}
.optin input:focus{border-color:var(--gold);background:rgba(255,255,255,.16)}
.optin .btn{width:100%}
.optin small{font:700 12px/1.45 ui-monospace,Menlo,Consolas,monospace;color:rgba(255,255,255,.66)}
.optin-done{display:flex;flex-direction:column;gap:7px;padding:10px 0 2px}
.optin-done b{font:800 17px/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--gold)}
.optin-done span{font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:rgba(255,255,255,.86)}
.rail{position:sticky;top:18px;display:flex;flex-direction:column;gap:24px;min-width:0}
.mr-lbl{font:800 12px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--muted2)}
.mr-rule{height:3px;width:44px;margin:10px 0 6px;background:var(--gold)}
.mr{margin:0;padding:0;list-style:none;display:flex;flex-direction:column}
.mr li{border-bottom:1px solid var(--line)}
.mr button{appearance:none;border:0;background:transparent;cursor:pointer;display:flex;gap:11px;width:100%;padding:13px 0;text-align:left}
.mr button:hover .mr-t{color:var(--gold-ink)}
.mr-n{flex:none;font:800 12px/1.6 ui-monospace,Menlo,Consolas,monospace;color:var(--gold-ink)}
.mr-t{font:700 16px/1.35 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--head)}
.empty{padding:34px 24px;text-align:center;background:var(--surface);border:1px solid var(--line);border-radius:10px;font:18px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted)}
.crumb{display:flex;flex-wrap:wrap;align-items:center;gap:9px;font:700 14px/1.4 ui-monospace,Menlo,Consolas,monospace;color:var(--muted2)}
.crumb button{appearance:none;border:0;background:transparent;padding:0;cursor:pointer;font:inherit;color:var(--b-brand);box-shadow:inset 0 -2px 0 var(--gold)}
.crumb button:hover{color:var(--gold-ink)}
.art-h1{margin:14px 0 0;font:800 46px/1.05 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;letter-spacing:-.018em;color:var(--head);max-width:26ch;text-wrap:pretty}
.art-deck{margin:18px 0 0;font:22px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted);max-width:58ch;text-wrap:pretty}
.by{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center;margin:22px 0 0;padding:15px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.by-face{width:52px;height:52px;flex:none;position:relative;border-radius:50%;overflow:hidden;background:#4A2B5F}
.by-face > svg{position:absolute;inset:0}
.by-n{font:800 16px/1.2 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink)}
.by-m{margin-top:5px;font:700 13px/1 ui-monospace,Menlo,Consolas,monospace;color:var(--muted2)}
.hero{position:relative;aspect-ratio:21/9;background:#322745;border-radius:10px;overflow:hidden;box-shadow:0 14px 34px rgba(31,36,48,.14)}
.hero > svg{position:absolute;inset:0}
.cap{margin:10px 0 0;font:700 13px/1.45 ui-monospace,Menlo,Consolas,monospace;color:var(--muted2)}
.cols{display:grid;grid-template-columns:254px minmax(0,1fr);gap:40px;align-items:start}
.bcard{background:var(--surface);border:1px solid var(--line);border-radius:10px;overflow:hidden;box-shadow:0 10px 26px rgba(31,36,48,.10)}
.bcard-hd{padding:12px 17px;box-shadow:inset 0 -1px 0 rgba(0,0,0,.3)}
.bcard-hd .k{color:rgba(255,255,255,.94);text-shadow:0 1px 3px rgba(0,0,0,.5)}
.bcard-hd.hd-gold .k{color:var(--on-gold);text-shadow:0 1px 0 rgba(255,255,255,.6)}
.bcard-bd{padding:17px;display:flex;flex-direction:column;gap:13px}
.toc{position:static}
.toc-lbl{font:800 12px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--muted2)}
.toc-rule{height:3px;width:44px;margin:10px 0 14px;background:var(--gold)}
.toc ol{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:0}
.toc li{border-top:1px solid var(--line)}
.toc li:last-child{border-bottom:1px solid var(--line)}
.toc a{display:block;padding:11px 0;font:600 16px/1.35 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted);text-decoration:none}
.toc a:hover{color:var(--b-brand)}
.srcs-lbl{font:800 12px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--muted2);padding-bottom:10px;border-bottom:2px solid var(--ink)}
.srcs-list{margin:0;padding:0 0 0 24px;display:flex;flex-direction:column;gap:0}
.srcs-list li{padding:11px 0;border-bottom:1px solid var(--line);font:15px/1.55 ui-monospace,Menlo,Consolas,monospace;color:var(--muted)}
.ad{position:relative;overflow:hidden;background:var(--b-ground);border-top:5px solid var(--gold);border-bottom:5px solid var(--gold);padding:32px 34px 34px;display:flex;flex-direction:column;gap:16px}
.ad-glow{position:absolute;right:-70px;top:-70px;width:260px;height:260px;border-radius:50%;background:var(--b-mid);opacity:.4}
.ad-in{position:relative;display:flex;flex-direction:column;gap:16px}
.ad-k{font:800 12px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.ad-h{margin:0;font:800 40px/1.04 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;letter-spacing:-.02em;color:#FAF7F2;text-wrap:pretty;text-shadow:0 2px 8px rgba(0,0,0,.4)}
.ad-h em{font-style:normal;color:var(--gold)}
.ad-p{margin:0;font:18px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:rgba(255,255,255,.88);max-width:46ch}
.ad-buy{display:flex;flex-wrap:wrap;align-items:center;gap:16px 22px;padding-top:18px;border-top:1px solid rgba(255,255,255,.2)}
.ad-price{font:800 46px/1 ui-monospace,Menlo,Consolas,monospace;color:var(--gold);text-shadow:0 2px 8px rgba(0,0,0,.4)}
.ad-terms{font:700 14px/1.5 ui-monospace,Menlo,Consolas,monospace;color:rgba(255,255,255,.82)}
.ad-buy .btn{margin-left:auto}
.prose .ad-h{margin:0;font:800 40px/1.04 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;letter-spacing:-.02em;color:#FAF7F2}
.prose .ad-h em{font-style:normal;color:var(--gold)}
.prose .ad-p{margin:0;font:18px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:rgba(255,255,255,.88)}
.prose .srcs-list{padding-left:24px}
.prose .srcs-list li{padding:11px 0;font:15px/1.55 ui-monospace,Menlo,Consolas,monospace;color:var(--muted)}
.prose{max-width:68ch;display:flex;flex-direction:column;gap:22px}
.prose h2{margin:18px 0 0;font:800 30px/1.16 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--head);scroll-margin-top:20px;text-wrap:pretty}
.prose h2 .n{display:block;margin-bottom:9px;font:800 13px/1 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.08em;color:var(--gold-ink)}
.prose h3{margin:8px 0 0;font:800 21px/1.28 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink)}
.prose p{margin:0;font:18px/1.68 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink)}
.prose ul{margin:0;padding:0 0 0 22px;display:flex;flex-direction:column;gap:10px}
.prose li{font:18px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--ink)}
.quote{margin:8px 0;padding:4px 0 4px 24px;border-left:4px solid var(--gold);font:600 25px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--head);text-wrap:pretty}
.fig{position:relative;aspect-ratio:16/9;background:#4B3A5D;border-radius:10px;overflow:hidden;box-shadow:0 10px 26px rgba(31,36,48,.12)}
.fig > svg{position:absolute;inset:0}
.mark{display:inline-block;min-width:19px;padding:1px 5px;border-radius:3px;background:var(--b-mid);font:700 12px/1.4 ui-monospace,Menlo,Consolas,monospace;color:#FFFFFF;vertical-align:2px}
.srcs ol{margin:0;padding:0 0 0 22px;display:flex;flex-direction:column;gap:11px}
.srcs li{font:15px/1.55 ui-monospace,Menlo,Consolas,monospace;color:var(--muted)}
.cta-t{font:800 27px/1.15 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--head)}
.cta-p{margin:0;font:17px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted)}
.terms{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px}
.terms > div{min-width:0;padding:12px 14px;background:var(--surface3);border-radius:6px}
.terms .k{color:var(--muted2)}
.terms .v{margin-top:7px;font:700 23px/1 ui-monospace,Menlo,Consolas,monospace;color:var(--head)}
.foot{padding:30px 30px 26px;background:var(--b-ground);border-top:4px solid var(--gold)}
.foot-in{max-width:1160px;margin:0 auto;display:flex;flex-direction:column;gap:24px}
.foot-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:24px}
.foot h4{margin:0 0 13px;font:800 15px/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--gold)}
.foot ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:11px}
.foot a,.foot button.fl{appearance:none;border:0;background:transparent;padding:0;cursor:pointer;text-align:left;font:500 15px/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:rgba(255,255,255,.86);text-decoration:none}
.foot a:hover,.foot button.fl:hover{color:var(--gold)}
.foot-note{padding-top:20px;border-top:1px solid rgba(255,255,255,.16);font:500 15px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:rgba(255,255,255,.7)}
@container (max-width:980px){
.idx{grid-template-columns:minmax(0,1fr);gap:30px}
.side{position:static}
.feat{grid-template-columns:minmax(0,1fr)}
.feat-img{min-height:250px;border-right:0;border-bottom:1px solid var(--line)}
.cols{grid-template-columns:minmax(0,1fr);gap:26px}
.rail{position:static}
}
@container (max-width:700px){
.nav{padding:11px 16px;gap:9px}
.nav-logo{width:44px;height:44px}
.nav-brand{gap:11px}
.nav-brand .kk{font-size:11px;margin-bottom:4px}
.nav-brand .tt{font-size:20px}
.nav nav{margin-left:0;order:3;width:100%}
.nav ul{margin:0;width:100%;display:flex;flex-wrap:wrap;gap:5px}
.nav ul li{display:flex}
.nav button.navlink{padding:0 13px;font-size:15px;border-radius:5px;background:rgba(255,255,255,.07)}
.nav button.navlink[aria-current]{background:rgba(217,164,65,.16)}
.nav-join{display:none}
.foot ul{gap:2px}
.foot a,.foot button.fl{display:flex;align-items:center;min-height:44px}
.toc a{padding:14px 0}
.crumb button{min-height:44px;display:inline-flex;align-items:center}
.wrap{padding:22px 16px 32px;gap:24px}
.h1{font-size:31px}
.lead{font-size:17px}
.feat-img{min-height:210px}
.feat-bd{padding:20px}
.feat-t{font-size:24px}
.join-h{font-size:24px}
.join-p{font-size:17px}
.join-form input{flex:1 1 100%}
.join-form .btn{width:100%}
.sel{width:100%}
.card-t{font-size:20px}
.art-h1{font-size:30px}
.art-deck{font-size:19px}
.hero{aspect-ratio:4/3}
.by-face{width:46px;height:46px}
.by > div:last-child{margin-left:0 !important;width:100%}
.by > div:last-child .btn{width:100%}
.prose h2{font-size:25px}
.prose p,.prose li{font-size:17px}
.quote{font-size:21px;padding-left:18px}
.ad{padding:24px 20px 26px}
.ad-h,.prose .ad-h{font-size:28px}
.ad-price{font-size:38px}
.ad-buy .btn{margin-left:0;width:100%}
.cta-t{font-size:22px}
.foot{padding:24px 16px 22px}
}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes drawRule{from{width:0}to{width:96px}}
@keyframes fade{from{opacity:0}to{opacity:1}}
.h1,.art-h1{animation:rise .55s cubic-bezier(.2,.7,.3,1) backwards}
.lead,.art-deck{animation:rise .55s .08s cubic-bezier(.2,.7,.3,1) backwards}
.grule{animation:drawRule .7s .12s cubic-bezier(.2,.7,.3,1) backwards}
.hero-slider{animation:rise .6s .06s cubic-bezier(.2,.7,.3,1) backwards}
.hero,.ad{animation:fade .6s backwards}
.card{animation:rise .5s cubic-bezier(.2,.7,.3,1) backwards}
.cards .card:nth-child(2){animation-delay:.05s}
.cards .card:nth-child(3){animation-delay:.1s}
.cards .card:nth-child(4){animation-delay:.15s}
.cards .card:nth-child(5){animation-delay:.2s}
.cards .card:nth-child(6){animation-delay:.25s}
.cards .card:nth-child(7){animation-delay:.3s}
.cards .card:nth-child(8){animation-delay:.35s}
.cards .card:nth-child(9){animation-delay:.4s}
.card-img > svg,.feat-img > svg{transition:transform .6s cubic-bezier(.2,.7,.3,1)}
.card:hover .card-img > svg,.hero-slider:hover .feat-img > svg{transform:scale(1.05)}
.chip,.sel,.srch{transition:background .16s,border-color .16s,color .16s}
.btn{transition:background .16s,transform .12s,box-shadow .16s}
.btn:active{transform:translateY(1px)}
.card-t button,.crumb button,.toc a,.mr-t,.foot button.fl,.foot a,.nav button.navlink{transition:color .16s,background .16s}
@media (prefers-reduced-motion:reduce){*{transition:none !important;animation:none !important}}
/* Native candidate correction: keep the actual Claude shell within narrow
article/index slots and preserve embedded-text artwork without cropping. */
html,body{max-width:100%;overflow-x:hidden}
.site{width:100%;max-width:100%;min-width:0;overflow-x:clip}
.nav,.nav-brand,.nav nav,.nav ul,.wrap,.idx,.idx-main,.side,.cards,.card,
.card-bd,.hero-slider,.feat,.feat-bd,.cols,.prose{min-width:0;max-width:100%}
.nav{width:100%;box-sizing:border-box}
.wrap{width:100%;box-sizing:border-box}
.h1,.lead,.feat-t,.feat-d,.join-h,.join-p,.card-t,.card-d,.art-h1,.art-deck,
.prose h2,.prose h3,.prose p,.prose li{max-width:100%;overflow-wrap:anywhere;word-break:normal}
.card-img>img{object-fit:contain;background:#F7F3EA}
.hero-art{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:contain;background:#F7F3EA}
.hero>.hero-art{position:absolute}
@container (max-width:700px){
.nav ul{max-width:100%}
.nav button.navlink{white-space:normal;max-width:100%;text-align:center}
.hero,.card-img{max-width:100%}
}
.article-source-figure{margin:24px 0 30px;padding:0}
.article-source-figure img{display:block;width:100%;height:auto;max-height:620px;object-fit:contain;border-radius:10px;background:#F7F3EA}
.article-source-figure .asset-caption{margin-top:10px;font:700 13px/1.45 ui-monospace,Menlo,Consolas,monospace;color:var(--muted2)}
*{box-sizing:border-box}.nav a{text-decoration:none;color:white}.card-t a{text-decoration:none}.hero-art{object-fit:contain!important}.prose img{max-width:100%;height:auto}.static-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}@media(max-width:850px){.static-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:580px){.static-grid{grid-template-columns:1fr}}
/* Static v3 geometry candidate, derived from publication-release-v2-20260918.
Keep image slots 3:2 at phone and desktop widths. Use contain so inherited
portrait assets remain uncropped until replacement compositions are approved. */
.feat-img:has(> img), .card-img:has(> img), .hero:has(> img), .fig:has(> img){
aspect-ratio:3 / 2; min-height:0; height:auto;
}
.feat-img:has(> img)>img, .card-img:has(> img)>img,
.hero:has(> img)>img, .fig:has(> img)>img{
position:absolute; inset:0; display:block; width:100%; height:100%;
object-fit:contain; background:#F7F3EA;
}
@media (max-width:700px){
.feat-img:has(> img), .card-img:has(> img), .hero:has(> img), .fig:has(> img){
aspect-ratio:3 / 2; min-height:0; height:auto;
}
}
/* Claude header candidate adaptation for static v4. The structure follows
FreedomAIOS Blog Header Candidate.dc.html from the native project export. */
.nav-brand{align-items:center;gap:12px}
.nav-lock{display:flex;align-items:baseline;flex-wrap:wrap;gap:3px 10px;min-width:0}
.nav-brand .nn{font:600 14px/1.2 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:rgba(255,255,255,.76)}
.nav-brand .tt{font-size:24px}
.nav a.navlink{appearance:none;display:flex;align-items:center;min-height:44px;padding:0 10px;color:rgba(255,255,255,.86);font:700 15px/1.2 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;border-radius:5px 5px 0 0;text-decoration:none}
.nav a.navlink:hover{color:var(--gold);background:rgba(255,255,255,.07)}
.nav a.navlink[aria-current="page"]{color:#FFFFFF;box-shadow:inset 0 -3px 0 var(--gold)}
.nav-burger{appearance:none;-webkit-appearance:none;display:flex;align-items:center;justify-content:center;width:46px;height:46px;flex:none;margin-left:0;padding:0;background:transparent;border:1px solid rgba(255,255,255,.34);border-radius:6px;cursor:pointer}
.nav-burger:hover{border-color:var(--gold);background:rgba(255,255,255,.07)}
.nav-burger[aria-expanded="true"]{border-color:var(--gold);background:rgba(217,164,65,.18)}
.nav-burger i{display:block;position:relative;width:20px;height:2px;background:#FAF7F2;border-radius:2px}
.nav-burger i::before,.nav-burger i::after{content:"";position:absolute;left:0;width:20px;height:2px;background:#FAF7F2;border-radius:2px}
.nav-burger i::before{top:-6px}.nav-burger i::after{top:6px}
.nav-panel{display:none;flex-direction:column;gap:11px;padding:12px 30px 16px;background:var(--b-ground);border-bottom:4px solid var(--gold)}
.nav-panel:not([hidden]){display:flex}
.nav-panel nav ul{display:flex;flex-direction:column;gap:5px;margin:0;padding:0;list-style:none}
.nav-panel a.navlink{width:100%;min-height:48px;padding:0 13px;border-radius:6px;background:rgba(255,255,255,.07);font-size:16px}
.nav-panel a.navlink[aria-current="page"]{background:rgba(217,164,65,.16);box-shadow:none;border-left:3px solid var(--gold)}
.nav-panel form{display:flex;gap:8px}.nav-panel input{flex:1;min-width:0;width:auto;min-height:46px;padding:0 12px;border:1px solid rgba(255,255,255,.34);border-radius:5px;background:rgba(255,255,255,.1);color:#FAF7F2;font:15px/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}.nav-panel .btn{min-height:46px;padding:0 18px}
@media (max-width:700px){
.nav{padding:10px 16px;gap:10px}
.nav-logo{width:44px;height:44px}.nav-brand{gap:11px}.nav-brand .kk{font-size:11px;margin-bottom:4px}.nav-brand .tt{font-size:21px}.nav-brand .nn{font-size:13px}
.nav nav,.nav-join{display:none}.nav-burger{display:flex;margin-left:auto}.nav-panel{padding-left:16px;padding-right:16px}
}
/* Natural image presentation for v4: inherited artwork keeps its source ratio.
Portraits remain uncropped and visibly portrait until a new 3:2 composition
is approved; this candidate does not claim those assets are fixed. */
.feat-img:has(> img), .card-img:has(> img), .hero:has(> img), .fig:has(> img){
aspect-ratio:auto; min-height:0; height:auto;
}
.feat-img:has(> img)>img, .card-img:has(> img)>img,
.hero:has(> img)>img, .fig:has(> img)>img{
position:relative; inset:auto; display:block; width:100%; height:auto;
object-fit:contain; background:#F7F3EA;
}
.card-art{width:100%!important; height:auto!important; aspect-ratio:auto!important; object-fit:contain!important;}
/* v4 review correction: header email/signup controls are intentionally absent until a real destination exists.
The Claude-derived mobile panel keeps explicit high-contrast links for the private review candidate. */
.nav-panel a.navlink, .nav-panel a.navlink:visited{color:rgba(255,255,255,.94)!important;background:rgba(255,255,255,.10)}
.nav-panel a.navlink:hover, .nav-panel a.navlink:focus-visible{color:#FFFFFF!important;background:rgba(217,164,65,.24);outline:2px solid var(--gold);outline-offset:2px}
.nav-panel a.navlink[aria-current="page"]{color:#FFFFFF!important;background:rgba(217,164,65,.24);border-left:3px solid var(--gold);box-shadow:none}
/* Blog Updates embed. The provider form carries its own required email consent. */
.optin-embed{position:relative;z-index:1;display:flex;flex-direction:column;gap:9px}
.optin-embed iframe{display:block;width:100%;min-height:460px;height:460px;border:0;border-radius:5px;background:#FFFFFF}
.optin-privacy{margin:0;font:700 12px/1.45 ui-monospace,Menlo,Consolas,monospace}
.optin-privacy a{color:rgba(255,255,255,.9);text-decoration:underline;text-underline-offset:3px}
.optin-privacy a:hover,.optin-privacy a:focus-visible{color:#FFFFFF}
.side-slot{padding:17px 18px;background:var(--surface);border:1px dashed var(--line);border-radius:8px}
.side-slot-k{font:800 12px/1.2 ui-monospace,Menlo,Consolas,monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-ink)}
.side-slot p{margin:8px 0 0;font:15px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--muted)}
.side-links .mr{margin:0;padding:0;list-style:none;display:flex;flex-direction:column}
.side-links .mr li{border-bottom:1px solid var(--line)}
.side-links .mr a{display:block;padding:13px 0;font:700 16px/1.35 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;color:var(--head);text-decoration:none}
.side-links .mr a:hover,.side-links .mr a:focus-visible{color:var(--gold-ink);text-decoration:underline}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (max-width:980px){.idx{grid-template-columns:minmax(0,1fr);gap:30px}.side,.rail{position:static}}
/* Desktop sticky side columns need a non-scroll-container x overflow clamp. */
@media (min-width:981px){html,body{overflow-x:clip}}
/* Preserved accepted deployed hero repair — 2026-09-19 */
/* Isolated 2026-09-19 hero-layout repair candidate.
Keep the existing artwork and shell; let image heroes contribute their
natural height so the parent cannot collapse under an absolute image. */
.hero:has(> img){
aspect-ratio:auto;
min-height:0;
height:auto;
}
div.hero:has(> img)>img.hero-art{
position:relative;
inset:auto;
display:block;
width:100%;
height:auto;
object-fit:contain;
}