@charset "UTF-8";
:root {
    color-scheme: light dark;
    --ground: #f6f5f2;
    --surface: #fff;
    --ink: #1f1b23;
    --muted: #5e5664;
    --faint: #766d7b;
    --line: #eceae6;
    --line-soft: #f0efec;
    --chip-bg: #e9e7e3;
    --hot: #b4231f;
    --hot-bg: #fbeeed;
    --warm: #a35a06;
    --warm-bg: #fdf4e5;
    --warm-ink: #7c4a03;
    --draft-bg: #fffdf5;
    --accent: #6d3f7d;
    --accent-bg: #f1eaf4;
    --quiet-bg: rgba(60, 45, 20, .07);
    --accent-soft: #c6b3d0;
    --accent-surface: #fcf9fd;
    --accent-ink: #6d3f7d;
    --ok: #12603a;
    --ok-bg: #e9f5ec;
    --err-ink: #8c1d1d;
    --field-border: #e3e1dc;
    --input-border: #8f887c;
    --on-accent: #fff;
    --on-hot: #fff;
    --press: #ebe9e5;
    --chevron: #8f887c;
    --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1.5 1.75 6 6.25l4.5-4.5' fill='none' stroke='%238f887c' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    --seg-track: var(--chip-bg);
    --seg-on: var(--surface);
    --seg-shadow: 0 1px 3px rgba(0, 0, 0, .08);
    --seg-card: var(--seg-track);
    --scrim: rgba(26, 26, 31, .35);
    --scrim-soft: rgba(26, 26, 31, .2);
    --on-ok: #fff;
    --bar-bg: color-mix(in srgb, var(--surface) 82%, transparent);
    --bar-shadow: 0 8px 30px rgba(26, 26, 31, .10), 0 0 0 1px rgba(26, 26, 31, .04);
    --top-inset: calc(env(safe-area-inset-top) + 12px);
    --night: #2a1f30;
    --bead: #c9a8d8;
    --bead-shine: radial-gradient(circle at 35% 30%, rgba(255, 255, 255, .38), rgba(255, 255, 255, 0) 58%);
    --bead-shine-soft: var(--bead-shine);
    --thread-bead: var(--accent);
    --thread: #e0d5e6;
    --thread-dash: #d9cfdf;
    --knot: var(--night);
    --knot-dot: var(--bead);
}
:root[data-theme="dark"], body.week-story {
    color-scheme: dark;
    --ground: #1c1720;
    --surface: #26202b;
    --ink: #f2eef4;
    --muted: #a39cab;
    --faint: #958d9d;
    --line: #322a37;
    --line-soft: #2d2632;
    --chip-bg: #342b39;
    --hot: #e08a80;
    --hot-bg: rgba(224, 138, 128, .14);
    --warm: #d4a662;
    --warm-bg: rgba(212, 166, 98, .14);
    --warm-ink: #dcb27a;
    --draft-bg: #262019;
    --accent: #7b4c8d;
    --accent-ink: #c9a3da;
    --accent-bg: rgba(168, 119, 189, .16);
    --quiet-bg: rgba(255, 255, 255, .06);
    --accent-soft: rgba(168, 119, 189, .35);
    --accent-surface: #2a2230;
    --ok: #7fc49a;
    --ok-bg: rgba(127, 196, 154, .14);
    --err-ink: #e08a80;
    --field-border: #3d3442;
    --input-border: #7a6f82;
    --on-accent: #f6f0f8;
    --on-hot: #2b1512;
    --press: #342b39;
    --chevron: #7a6f82;
    --thread-bead: #c9a3da;
    --bead-shine-soft: radial-gradient(circle at 35% 30%, rgba(201, 163, 218, .5), rgba(201, 163, 218, 0) 70%);
    --thread: rgba(168, 119, 189, .28);
    --thread-dash: rgba(168, 119, 189, .42);
    --knot: var(--bead);
    --knot-dot: var(--night);
    --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1.5 1.75 6 6.25l4.5-4.5' fill='none' stroke='%237a6f82' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    --seg-track: var(--surface);
    --seg-on: var(--chip-bg);
    --seg-shadow: none;
    --seg-card: var(--ground);
    --scrim: rgba(0, 0, 0, .55);
    --scrim-soft: rgba(0, 0, 0, .35);
    --on-ok: #10281a;
    --bar-bg: rgba(38, 32, 43, .78);
    --bar-shadow: 0 8px 30px rgba(0, 0, 0, .4), 0 0 0 1px rgba(255, 255, 255, .06);
}
:root[data-theme="light"] { color-scheme: light; }
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        color-scheme: dark;
        --ground: #1c1720;
        --surface: #26202b;
        --ink: #f2eef4;
        --muted: #a39cab;
        --faint: #958d9d;
        --line: #322a37;
        --line-soft: #2d2632;
        --chip-bg: #342b39;
        --hot: #e08a80;
        --hot-bg: rgba(224, 138, 128, .14);
        --warm: #d4a662;
        --warm-bg: rgba(212, 166, 98, .14);
        --warm-ink: #dcb27a;
        --draft-bg: #262019;
        --accent: #7b4c8d;
        --accent-ink: #c9a3da;
        --accent-bg: rgba(168, 119, 189, .16);
        --quiet-bg: rgba(255, 255, 255, .06);
        --accent-soft: rgba(168, 119, 189, .35);
        --accent-surface: #2a2230;
        --ok: #7fc49a;
        --ok-bg: rgba(127, 196, 154, .14);
        --err-ink: #e08a80;
        --field-border: #3d3442;
        --input-border: #7a6f82;
        --on-accent: #f6f0f8;
        --on-hot: #2b1512;
        --press: #342b39;
        --chevron: #7a6f82;
        --thread-bead: #c9a3da;
        --bead-shine-soft: radial-gradient(circle at 35% 30%, rgba(201, 163, 218, .5), rgba(201, 163, 218, 0) 70%);
        --thread: rgba(168, 119, 189, .28);
        --thread-dash: rgba(168, 119, 189, .42);
        --knot: var(--bead);
        --knot-dot: var(--night);
        --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1.5 1.75 6 6.25l4.5-4.5' fill='none' stroke='%237a6f82' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
        --seg-track: var(--surface);
        --seg-on: var(--chip-bg);
        --seg-shadow: none;
        --seg-card: var(--ground);
        --scrim: rgba(0, 0, 0, .55);
        --scrim-soft: rgba(0, 0, 0, .35);
        --on-ok: #10281a;
        --bar-bg: rgba(38, 32, 43, .78);
        --bar-shadow: 0 8px 30px rgba(0, 0, 0, .4), 0 0 0 1px rgba(255, 255, 255, .06);
    }
}
* { box-sizing: border-box; }
.offscreen {
    position: absolute;
    width: 1px; height: 1px;
    margin: -1px; padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}
body {
    margin: 0;
    padding-top: var(--top-inset);
    font: 400 1rem/1.5 "Onest", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
    font-variant-numeric: tabular-nums;
    -webkit-font-smoothing: antialiased;
    background: var(--ground);
    color: var(--ink);
}
a { color: var(--accent-ink); }
input, textarea, select, button { font: inherit; }
p { margin: 0; }
a:focus-visible, button:focus-visible, summary:focus-visible {
    outline: 2px solid var(--accent-ink);
    outline-offset: 2px;
}
main { max-width: 34rem; margin: 0 auto; padding: 16px 20px calc(env(safe-area-inset-bottom) + 120px); }
body.screen-task main { padding: 0 20px 40px; }
body.has-bar main { padding-bottom: calc(env(safe-area-inset-bottom) + 108px); }
.navbar + main { padding-top: 0; }
.tabbar-fade {
    position: fixed; z-index: 10;
    left: 0; right: 0; bottom: 0;
    height: calc(env(safe-area-inset-bottom) + 114px);
    background: linear-gradient(to top, var(--ground) calc(100% - 28px), transparent);
    pointer-events: none;
}
.tabbar-fade::before { content: ''; position: absolute; inset: 28px 0 0; pointer-events: auto; }
.tabbar {
    position: fixed; z-index: 11;
    left: 16px; right: 16px;
    bottom: calc(env(safe-area-inset-bottom) + 22px);
    max-width: calc(34rem - 32px);
    margin: 0 auto;
    height: 64px;
    padding: 6px;
    border-radius: 999px;
    background: var(--bar-bg);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    box-shadow: var(--bar-shadow);
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 60px;
    gap: 4px;
}
.tab {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    border-radius: 999px;
    text-decoration: none;
    color: var(--muted);
    font-size: .75rem;
    line-height: 1.2;
    font-weight: 500;
}
.tab.on { background: var(--accent-bg); color: var(--accent-ink); font-weight: 600; }
@media (max-width: 340px) {
    .tab-name { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}
.ic { display: block; flex: none; }
.tab-add {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: var(--accent);
    color: var(--on-accent);
    text-decoration: none;
}
.tab-add:active { filter: brightness(.92); }
.tab, .tab-add { position: relative; }
.tab::after, .tab-add::after { content: ''; position: absolute; inset: -6px -2px calc(-6px - 22px - env(safe-area-inset-bottom)); }
.navbar {
    max-width: 34rem;
    margin: 0 auto;
    min-height: 44px;
    padding: 0 20px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 12px;
}
.navbar.plain { display: flex; flex-wrap: wrap; justify-content: space-between; row-gap: 8px; }
.navbar .back { justify-self: start; color: var(--accent-ink); font-size: .9375rem; font-weight: 500; text-decoration: none; white-space: nowrap; }
.navbar .title { justify-self: center; margin: 0; font-size: .9375rem; font-weight: 600; line-height: inherit; letter-spacing: normal; }
.navbar .spacer { justify-self: end; width: 56px; }
.navbar .right { justify-self: end; display: flex; align-items: center; gap: 8px; }
.add, .navbar .pillbtn, .navbar .back.pill, .menu-you {
    flex: none;
    display: inline-flex; align-items: center;
    min-height: 36px; padding: 0 14px;
    border-radius: 999px;
    background: var(--surface);
    color: var(--accent-ink);
    font-size: .9375rem; font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
}
.navbar .pillbtn, .menu-you { color: var(--ink); }
.add:active, .navbar .pillbtn:active, .navbar .back.pill:active, .menu-you:active { background: var(--press); }
.navbar .back.pill { gap: 4px; padding: 0 12px 0 8px; }
.add { gap: 4px; padding: 0 14px 0 10px; }
.roundbtn {
    display: inline-flex; align-items: center; justify-content: center;
    width: 36px; height: 36px;
    border-radius: 999px;
    background: var(--surface);
    color: var(--muted);
    font-size: 1rem; line-height: 1;
    text-decoration: none;
}
.roundbtn:active { background: var(--press); }
.navbar .pillbtn, .navbar .back.pill, .menu-you, .roundbtn, .add, .fix { position: relative; }
.navbar .pillbtn::after, .navbar .back.pill::after, .menu-you::after, .roundbtn::after,
.add::after, .fix::after { content: ''; position: absolute; inset: -4px; }
.ava {
    flex: none;
    display: inline-flex; align-items: center; justify-content: center;
    width: var(--ava, 20px); height: var(--ava, 20px);
    border-radius: 999px;
    background: oklch(.88 .06 var(--h));
    color: oklch(.38 .09 var(--h));
    font-size: calc(var(--ava, 20px) * .5);
    font-weight: 600;
    line-height: 1;
    vertical-align: -2px;
}
:root[data-theme="dark"] .ava { background: oklch(.38 .06 var(--h)); color: oklch(.88 .06 var(--h)); }
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .ava { background: oklch(.38 .06 var(--h)); color: oklch(.88 .06 var(--h)); }
}
.sign {
    position: relative; flex: none;
    display: inline-flex; align-items: center; justify-content: center;
    width: var(--sign, 36px); height: var(--sign, 36px); border-radius: calc(var(--sign, 36px) * .225);
    background: var(--accent); color: var(--on-accent);
    font-family: "Onest", sans-serif; font-size: calc(var(--sign, 36px) * .733); font-weight: 700; line-height: 1; letter-spacing: -.04em;
}
.sign b { font-weight: inherit; margin: -.227em .295em 0 0; }
.sign i { position: absolute; right: 16.7%; bottom: 27.5%; width: 18.3%; height: 18.3%; border-radius: 50%; background: var(--bead); }
h1 { font-size: min(2.125rem, 12vw); line-height: 1.1; font-weight: 700; letter-spacing: -.025em; margin: 0; }
.quote { font-size: 1.625rem; line-height: 1.25; font-weight: 600; letter-spacing: -.02em; text-wrap: pretty; }
.caption { font-size: .8125rem; line-height: 1.4; color: var(--muted); }
.group h2, .form-part h2, .feed-label, .enter-label {
    font-size: .75rem; line-height: 1.3; font-weight: 600;
    letter-spacing: .06em; text-transform: uppercase;
}
.day-label {
    display: flex; align-items: center; gap: 8px;
    font-size: .8125rem; line-height: 1.3; font-weight: 600;
}
.day-label::before { content: ''; flex: none; width: 7px; height: 7px; border-radius: 999px; background: currentColor; }
.muted { color: var(--muted); }
.faint { color: var(--faint); }
.hot { color: var(--hot); }
.soon { color: var(--accent-ink); }
.warm { color: var(--warm); }
b.hot, b.soon, b.warm { font-weight: 600; }
.page-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; padding-top: 8px; flex-wrap: wrap; }
.page-head > :last-child:not(:first-child) { margin-left: auto; }
.page { display: flex; flex-direction: column; gap: 6px; }
.page .day { font-size: .8125rem; line-height: 1.4; color: var(--muted); }
.page-sub { font-size: .9375rem; line-height: 1.5; color: var(--muted); margin-top: 12px; }
main > .page:first-child { margin-top: 20px; }
.today-head { align-items: center; }
.today-date { margin: 0; font-size: .9375rem; line-height: 1.3; font-weight: 600; }
.page > .page-sub { margin-top: 0; }
.quote.verbatim { white-space: pre-wrap; }
main > .facts { margin-top: 20px; }
.bar { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; min-height: 48px; margin-top: 20px; }
.bar .roundbtn { width: 44px; height: 44px; }
.bar-tools { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.bar-tools:has(> .filters[open]) { flex: 1 1 100%; flex-wrap: wrap; }
.seek-open { border: 0; color: var(--accent-ink); cursor: pointer; }
.seek-open[hidden] { display: none; }
.bar > .seek { flex: 1 1 100%; display: flex; align-items: center; gap: 12px; margin: 0; }
.bar > .seek[hidden] { display: none; }
.bar > .seek input { flex: 1 1 0; min-width: 0; width: auto; }
.seeking .bar > :not(.seek) { display: none; }
.unseek .bar > :not(.seek) { animation: screenIn .2s ease-out both; }
.seek-snap :is(.week-pane, .drafts-fold) { transition: none !important; }
.drafts-fold > div { min-height: 0; overflow: hidden; margin: 0 -4px -4px; padding: 0 4px 4px; }
.seek-cancel {
    position: relative;
    flex: none;
    border: 0; padding: 0; background: transparent;
    font: inherit; font-size: .9375rem; font-weight: 500; color: var(--muted);
    cursor: pointer;
}
.seek-cancel::after { content: ''; position: absolute; inset: -12px -8px; }
.seek-cancel:active { color: var(--ink); }
.segment { display: inline-flex; background: var(--seg-track); border-radius: 999px; padding: 3px; }
dialog.sheet .segment { background: var(--seg-card); }
.segment { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
.segment::-webkit-scrollbar { display: none; }
.segment > * { flex: none; }
.segment a {
    display: inline-flex; align-items: center;
    min-height: 38px; padding: 0 16px;
    border-radius: 999px;
    font-size: .9375rem;
    color: var(--muted);
    text-decoration: none;
}
.segment a.on { background: var(--seg-on); color: var(--ink); font-weight: 600; box-shadow: var(--seg-shadow); }
.segment button {
    display: inline-flex; align-items: center; justify-content: center;
    min-height: 38px; padding: 0 16px;
    border: 0; border-radius: 999px;
    background: transparent;
    font: inherit; font-size: .9375rem;
    color: var(--muted);
    cursor: pointer;
}
.segment button.on { background: var(--seg-on); color: var(--ink); font-weight: 600; box-shadow: var(--seg-shadow); }
.segment.wide { display: flex; }
.segment.wide > * { flex: 1 1 0; justify-content: center; padding: 0 8px; }
.segment, .radios { position: relative; }
.seg-thumb {
    position: absolute; top: 3px; bottom: 3px;
    left: var(--x, 3px); width: var(--w, 0);
    border-radius: 999px;
    background: var(--seg-on); box-shadow: var(--seg-shadow);
    pointer-events: none;
    transition: left .34s cubic-bezier(.2, .8, .2, 1), width .34s cubic-bezier(.2, .8, .2, 1);
}
.seg-thumb[hidden] { display: none; }
:is(.segment, .radios).live > :is(a, button, label) { position: relative; z-index: 1; transition: color .2s; }
:is(.segment, .radios).live > :is(.on, [aria-current="true"]), .radios.live > input:checked + label { background: transparent; box-shadow: none; }
.chips { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.chips a {
    position: relative;
    display: inline-flex; align-items: center;
    min-height: 36px; padding: 0 6px 0 12px;
    border-radius: 999px;
    background: var(--accent-bg);
    color: var(--accent-ink);
    font-size: .8125rem; font-weight: 500;
    text-decoration: none;
}
.chips a::after { content: ''; position: absolute; inset: -4px 0; }
.chips a span {
    display: inline-flex; align-items: center; justify-content: center;
    width: 20px; height: 20px; margin-left: 2px;
    font-size: .9375rem;
}
.filters > summary { list-style: none; color: var(--accent-ink); cursor: pointer; }
.filters > summary::-webkit-details-marker { display: none; }
.filters[open] { flex: 1 1 100%; }
.filters > form {
    display: flex; gap: 8px; flex-wrap: wrap;
    margin-top: 12px;
    background: var(--surface);
    border-radius: 16px;
    padding: 12px;
}
.filters select, dialog.sheet select { flex: 1 1 9rem; min-width: 0; }
.filters .button, dialog.sheet .button { flex: 1 1 100%; }
dialog.sheet {
    border: 0; padding: 0 20px 20px;
    width: 100%; max-width: 34rem;
    max-height: min(82dvh, calc(var(--sheet-room, 100dvh) - 16px));
    min-height: min(var(--sheet-held, 0px), 82dvh, calc(var(--sheet-room, 100dvh) - 16px));
    overflow: auto;
    margin: auto auto var(--sheet-below, 0);
    border-radius: 20px 20px 0 0;
    background: var(--surface);
    color: var(--ink);
}
dialog.sheet::backdrop { background: var(--scrim); }
dialog.sheet:focus { outline: none; }
dialog.sheet { transition: transform .34s cubic-bezier(.2, .8, .2, 1); }
dialog.sheet::backdrop { transition: opacity .24s ease-out; }
@starting-style {
    dialog.sheet[open] { transform: translateY(100%); }
    dialog.sheet[open]::backdrop { opacity: 0; }
}
dialog.sheet.sheet-in-place, dialog.sheet.sheet-in-place::backdrop { transition: none; }
dialog.sheet.closing {
    transform: translateY(100%);
    transition-duration: .22s;
    transition-timing-function: cubic-bezier(.4, 0, 1, 1);
    pointer-events: none;
}
dialog.sheet.closing::backdrop { opacity: 0; transition-duration: .22s; transition-timing-function: cubic-bezier(.4, 0, 1, 1); }
dialog.sheet.sheet-dragging { transform: translateY(var(--sheet-drag, 0px)); transition: none; }
.sheet-head {
    position: sticky; top: 0; z-index: 2;
    margin: 0 -20px 4px; padding: 8px 20px 0;
    background: var(--surface);
    touch-action: none;
    -webkit-user-select: none; user-select: none;
}
.sheet-head-over { box-shadow: 0 1px 0 var(--line-soft); }
.sheet-grip {
    display: block; width: 36px; height: 5px; margin: 0 auto;
    border-radius: 3px;
    background: var(--chevron); opacity: .6;
}
.sheet-bar { display: flex; align-items: center; gap: 12px; min-height: 44px; margin-top: 3px; }
dialog.sheet .sheet-bar h2 { flex: 0 1 auto; min-width: 0; margin: 0; }
.sheet-bar .sheet-count { flex: 1 1 auto; margin: 0; }
.sheet-close {
    flex: none; margin: 0 -8px 0 auto; padding: 0 8px;
    min-height: 44px;
    border: 0; border-radius: 12px; background: none;
    font: inherit; font-size: .8125rem; font-weight: 500; line-height: 1.3;
    color: var(--muted);
    cursor: pointer;
}
.sheet-close:active { color: var(--ink); }
dialog.sheet.sheet-kb > .sheet-head .sheet-bar:not(:has(h2)) { display: none; }
html:has(dialog.sheet[open]) { overflow: hidden; }
dialog.sheet { overscroll-behavior: contain; }
dialog.sheet h2 { font-size: 1rem; font-weight: 600; margin: 0 0 14px; }
dialog.sheet > form { display: flex; gap: 8px; flex-wrap: wrap; }
dialog.sheet .rows { background: transparent; }
dialog.sheet .row { padding: 14px 0; }
dialog.sheet .form { margin-top: 16px; }
dialog.sheet textarea {
    width: 100%; min-height: 96px;
    padding: 12px 14px;
    border: 1px solid var(--input-border);
    border-radius: 14px;
    background: var(--surface);
    color: var(--ink);
    font-size: 1rem;
    line-height: 1.5;
    resize: vertical;
}
.sheet-count { font-size: .8125rem; line-height: 1.4; color: var(--faint); }
.sheet-next {
    display: flex; align-items: center; justify-content: center; gap: 6px;
    width: 100%; height: 44px;
    margin-top: 12px;
    border: 0; border-radius: 14px;
    background: transparent;
    cursor: pointer;
}
.sheet-next:active { background: var(--press); }
.sheet-next[hidden] { display: none; }
dialog.sheet[open][data-controller~="one-by-one"] { display: flex; flex-direction: column; }
dialog.sheet[data-controller~="one-by-one"] > * { flex: none; }
dialog.sheet[data-controller~="one-by-one"] > :not(.sheet-head, .sheet-next) { flex: 1 0 auto; }
.sheet-acts { display: flex; gap: 8px; margin-top: 16px; }
.sheet-acts .button { flex: 1 1 0; }
dialog.sheet:has(> [role="tablist"]) { min-height: min(max(600px, var(--sheet-held, 0px)), 82dvh, calc(var(--sheet-room, 100dvh) - 16px)); }
dialog.sheet[open]:has(> [role="tablist"]) { display: flex; flex-direction: column; }
dialog.sheet:has(> [role="tablist"]) > :not(form) { flex: none; }
dialog.sheet:has(> [role="tablist"]) > form { flex: 1 0 auto; }
dialog.sheet:has(> [role="tablist"]) > form > :last-child { margin-top: auto; }
dialog.sheet:has(> [role="tablist"]) { padding-bottom: calc(20px + max(0px, env(safe-area-inset-bottom, 0px) - var(--sheet-below, 0px))); }
dialog.sheet.sheet-kb:has(> [role="tablist"]) { padding-bottom: 12px; }
.streak-line {
    position: relative;
    display: block;
    margin-top: 24px;
    font-size: .8125rem; line-height: 1.4;
    color: var(--muted);
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
}
.streak-line::after { content: ''; position: absolute; inset: -8px -8px; }
.streak-row { display: flex; align-items: flex-end; gap: 12px; }
.streak-num { flex: none; display: flex; }
.streak-line .streak-num b { font-size: 4rem; line-height: .8; font-weight: 700; letter-spacing: -.05em; color: var(--ink); font-variant-numeric: tabular-nums; }
.streak-label { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; padding-bottom: 2px; }
.streak-label small { font-size: .8125rem; line-height: 1.2; font-weight: 600; color: var(--accent-ink); }
.streak-num.best + .streak-label small { color: var(--muted); }
.streak-line .streak-num.best b { color: var(--chevron); }
.streak-say { font-size: .9375rem; line-height: 1.3; text-wrap: pretty; }
.streak-say:empty { display: none; }
.streak-line em { font-style: normal; font-weight: 500; color: var(--ink); }
.streak-line .streak-mark { font-weight: 600; }
.streak-line .chev { color: var(--chevron); font-weight: 600; }
.streak-line:active .streak-say { color: var(--ink); }
.thread { position: relative; flex: 1; min-width: 0; height: 64px; margin-top: 10px; padding: 0 8px 14px; box-sizing: border-box; display: flex; align-items: center; justify-content: flex-end; overflow: hidden; overflow: clip visible; }
.thread.after-break { padding-top: 8px; }
.thread-done { flex: none; display: flex; align-items: center; gap: 13px; padding-right: 13px; background: linear-gradient(var(--thread), var(--thread)) center / 100% 2px no-repeat; }
.thread-done:empty { display: none; }
.thread-tail { flex: 1 0 12px; height: 2px; background: repeating-linear-gradient(to right, var(--thread-dash) 0 5px, transparent 5px 10px); }
.thread .bead { flex: none; width: 18px; height: 18px; border-radius: 999px; background: var(--bead-shine), var(--thread-bead); }
.thread .bead.warned { background: var(--bead-shine-soft), linear-gradient(var(--accent-soft), var(--accent-soft)), var(--ground); }
.thread .bead.today { width: 22px; height: 22px; margin: 0 2px; box-shadow: 0 0 0 5px var(--accent-bg); }
.thread-stack { flex: none; display: flex; }
.streak-line.hangs { z-index: 1; }
.thread .bead.next { position: relative; width: 36px; height: 36px; box-sizing: border-box; border: 2px dashed var(--thread-bead); background: var(--surface); display: flex; align-items: center; justify-content: center; box-shadow: inset 0 1px 3px rgba(42, 31, 48, .16), 0 0 0 6px color-mix(in srgb, var(--bead) 32%, transparent); }
.thread .bead.next b { font-size: .8125rem; line-height: 1; font-style: normal; font-weight: 700; color: var(--thread-bead); opacity: .85; font-variant-numeric: tabular-nums; }
.thread .bead.next small { position: absolute; top: 42px; left: 50%; transform: translateX(-50%); font-size: .75rem; line-height: 1; font-weight: 600; color: var(--accent-ink); white-space: nowrap; }
.thread-stack i { width: 18px; height: 18px; border-radius: 999px; background: var(--bead-shine), var(--thread-bead); opacity: calc(.08 + var(--i) * .15); }
.thread-stack i + i { margin-left: -9px; box-shadow: -1px 0 0 1px var(--ground); }
.thread .knot { position: relative; flex: none; width: 17px; height: 17px; margin: 0 3px; border-radius: 4px; background: var(--knot); transform: rotate(45deg); }
.thread .knot::after { content: ''; position: absolute; left: 50%; top: 50%; width: 5px; height: 5px; margin: -2.5px 0 0 -2.5px; border-radius: 999px; background: var(--knot-dot); }
.thread .knot.open { box-sizing: border-box; border: 2px dashed var(--knot); background: none; }
.thread .knot.open::after { display: none; }
.thread-done .knot { margin: 0 1px; }
.thread-best { position: absolute; left: 8px; top: 0; display: flex; gap: 24px; background: linear-gradient(var(--thread), var(--thread)) center / 100% 1px no-repeat; }
.thread-best i { width: 5px; height: 5px; border-radius: 999px; background: var(--accent-soft); }
.day-main .streak-line { margin: -18px -18px 2px; padding: 16px 18px 14px; display: flex; align-items: center; gap: 12px; border-radius: 22px 22px 0 0; border-bottom: 1px solid var(--line-soft); background: linear-gradient(180deg, var(--accent-surface), var(--surface)); }
.day-main .streak-line::after { inset: 0; }
.day-main .streak-row { flex: 1 1 auto; min-width: 0; align-items: center; }
.day-main .streak-line .streak-num b { font-size: 2.75rem; line-height: .85; }
.day-main .streak-say { font-size: .8125rem; }
.day-main .thread { flex: 0 1 auto; min-width: 84px; max-width: calc(52% + 12px); height: 36px; margin: 0 -6px; padding: 0 6px; }
.day-main .thread.after-break { padding-top: 6px; }
.day-main .thread-done { gap: 8px; padding-right: 8px; }
.day-main .thread-done:not(:has(+ .bead.next)) { padding-right: 0; }
.day-main .thread-done:has(> :nth-child(5)) { -webkit-mask-image: linear-gradient(to right, transparent, #000 44px); mask-image: linear-gradient(to right, transparent, #000 44px); }
.day-main .thread .bead, .day-main .thread-stack i { width: 14px; height: 14px; }
.day-main .thread .bead.today { width: 22px; height: 22px; margin: 0 0 0 -2px; border: 3px solid var(--accent-bg); background-clip: padding-box; box-shadow: none; }
.day-main .thread .bead.next { width: 32px; height: 32px; box-shadow: inset 0 1px 3px rgba(42, 31, 48, .16), 0 0 0 5px color-mix(in srgb, var(--bead) 30%, transparent); }
.day-main .thread .knot { width: 12px; height: 12px; border-radius: 3px; }
.day-main .thread .knot::after { width: 4px; height: 4px; margin: -2px 0 0 -2px; }
.day-main .thread .bead.next small, .day-main .thread-tail, .day-main .thread .knot.open { display: none; }
.thread-first { position: absolute; z-index: 3; translate: -50% 0; padding: 6px 10px; border-radius: 10px; background: var(--night); color: #f6f0f8; font-size: .8125rem; line-height: 1.3; font-weight: 600; white-space: nowrap; pointer-events: none; animation: rowIn .32s cubic-bezier(.2, .8, .2, 1) both; }
.thread-first::before { content: ''; position: absolute; left: calc(50% + var(--arrow, 0px) - 5px); top: -5px; width: 10px; height: 10px; border-radius: 2px; background: inherit; transform: rotate(45deg); }
.thread .bead.first { box-shadow: 0 0 0 4px color-mix(in srgb, var(--bead) 45%, transparent); transition: box-shadow .3s; }
.thread .lands { animation: dot-pop .36s cubic-bezier(.34, 1.56, .64, 1) var(--at, 0ms) both; }
.thread .bead.lands::after, .thread .knot.lands::before { content: ''; position: absolute; inset: 0; border-radius: inherit; box-shadow: 0 0 0 1.5px var(--thread-bead); animation: bead-ink .64s ease-out calc(var(--at, 0ms) + .12s) both; }
.thread .bead.lands { position: relative; }
.streak-line .streak-num b { position: relative; }
.grew > .streak-line .streak-num b::after {
    content: ''; position: absolute; left: 50%; top: 50%;
    width: 30px; height: 30px; margin: -15px 0 0 -15px; border-radius: 999px;
    box-shadow: 0 0 0 2px var(--accent-soft);
    pointer-events: none;
    animation: halo .72s ease-out var(--landed, 0ms) both;
}
@keyframes halo { from { opacity: 0; transform: scale(.5); } 25% { opacity: 1; transform: scale(1); } to { opacity: 0; transform: scale(1.8); } }
.streak-ring { overflow: hidden; }
.streak-ring[hidden] { display: none; }
.ring-row { display: flex; align-items: center; gap: 18px; padding: 18px 4px 20px; }
.ring-face { position: relative; flex: none; width: 112px; height: 112px; }
.ring-face svg { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); fill: none; }
.ring-face .ring-track { stroke: var(--chip-bg); stroke-width: 2; }
.ring-draw { stroke: var(--accent); stroke-width: 2.5; stroke-linecap: round; stroke-dasharray: 277; }
.ring-dot {
    position: absolute; left: 50%; top: 50%;
    width: 8px; height: 8px; margin: -4px 0 0 -4px; border-radius: 999px;
    background: var(--accent); box-shadow: 0 0 0 2px var(--ground);
    transform: rotate(calc(var(--i) * 360deg / var(--n))) translateY(-44px);
}
.ring-dot.warned { background: var(--accent-soft); }
.ring-face b { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 2.125rem; font-weight: 700; letter-spacing: -.02em; }
.ring-say { margin: 0; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ring-say b { font-size: 1.25rem; line-height: 1.25; font-weight: 600; letter-spacing: -.018em; }
.ring-say span { font-size: .9375rem; line-height: 1.45; color: var(--muted); text-wrap: pretty; }
.streak-ring.open .ring-draw { animation: ring-draw .76s cubic-bezier(.2, .8, .2, 1) calc(var(--at) + 80ms) both; }
.streak-ring.open .ring-dot { animation: dot-pop .32s cubic-bezier(.34, 1.56, .64, 1) calc(var(--at) + 140ms + var(--i) * min(60ms, 600ms / var(--n))) both; }
.streak-ring.open .ring-face b { animation: dot-pop .46s cubic-bezier(.34, 1.56, .64, 1) calc(var(--at) + 260ms) both; }
.streak-ring.open .ring-say > * { animation: rowIn .4s cubic-bezier(.2, .8, .2, 1) calc(var(--at) + 660ms) both; }
.streak-ring.open .ring-say > span { animation-delay: calc(var(--at) + 780ms); }
@keyframes ring-draw { from { stroke-dashoffset: 277; } to { stroke-dashoffset: 0; } }
@keyframes dot-pop { from { opacity: 0; scale: 0; } }
.streak-note { margin-top: -8px; font-size: .8125rem; line-height: 1.4; color: var(--muted); text-wrap: pretty; }
.day-card.day-scene { gap: 16px; padding: 22px 20px 20px; border-radius: 22px; background: var(--night); color: #f6f0f8; }
.day-scene .day-label.day-ok { color: var(--bead); }
.day-scene .day-quote.plain { font-size: 2.125rem; line-height: 1.08; font-weight: 700; letter-spacing: -.028em; text-wrap: balance; }
.day-scene .day-empty { color: #f6f0f8; }
.day-scene p.day-note { padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, .1); color: rgba(246, 240, 248, .74); }
.day-scene .ava { background: oklch(.38 .06 var(--h)); color: oklch(.88 .06 var(--h)); }
.day-words { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.day-words li { display: flex; align-items: center; gap: 12px; min-width: 0; }
.day-bead { flex: none; width: 12px; height: 12px; border-radius: 999px; background: var(--bead); }
.day-bead.moved { background: rgba(201, 168, 216, .45); }
.day-bead:is(.confirmed, .abandoned, .unchecked) { box-sizing: border-box; border: 2px solid var(--bead); background: none; }
.day-word { display: flex; flex-direction: column; min-width: 0; }
.day-word-text { font-size: .9375rem; line-height: 1.3; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.day-word-sub { font-size: .8125rem; line-height: 1.35; color: rgba(246, 240, 248, .66); }
:root[data-theme="dark"] :is(.day-card.day-scene, .door-lock) { background: #35283c; box-shadow: inset 0 0 0 1px rgba(201, 168, 216, .22); }
:root[data-theme="dark"] .lock-thread .nest { background: #35283c; }
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) :is(.day-card.day-scene, .door-lock) { background: #35283c; box-shadow: inset 0 0 0 1px rgba(201, 168, 216, .22); }
    :root:not([data-theme="light"]) .lock-thread .nest { background: #35283c; }
}
html:has(body.week-story) { background: var(--night); }
body.week-story {
    --st-bg: var(--night);
    --st-ink: #f6f0f8;
    --st-muted: rgba(246, 240, 248, .74);
    --st-faint: rgba(246, 240, 248, .6);
    --st-card: rgba(255, 255, 255, .08);
    --st-label: var(--bead);
    --st-hot: #ec9a90;
    --st-warm: #ebba6c;
    --ground: #2a1f30;
    --surface: #35283c;
    --chip-bg: rgba(255, 255, 255, .1);
    --press: rgba(255, 255, 255, .12);
    --line: rgba(255, 255, 255, .1);
    --line-soft: rgba(255, 255, 255, .08);
    --field-border: rgba(255, 255, 255, .16);
    --input-border: rgba(255, 255, 255, .4);
    background: var(--st-bg);
    color: var(--st-ink);
}
body.week-story main { padding: var(--top-inset) 20px calc(env(safe-area-inset-bottom) + 24px); }
.ws {
    min-height: calc(100dvh - var(--top-inset) - env(safe-area-inset-bottom) - 24px);
    display: flex; flex-direction: column;
}
.ws-head { display: flex; flex-direction: column; gap: 14px; }
.ws-progress { display: flex; gap: 4px; }
.ws-seg { position: relative; flex: 1; height: 3px; border-radius: 2px; background: rgba(246, 240, 248, .3); }
.ws-seg::after { content: ''; position: absolute; inset: -12px 0; }
.ws-seg.done, .ws-seg.now { background: var(--st-ink); }
.ws-bar { display: flex; justify-content: space-between; align-items: center; font-size: .8125rem; color: var(--st-muted); }
.ws-close { position: relative; font-size: 1.625rem; line-height: 1; color: var(--st-muted); text-decoration: none; }
.ws-close::after { content: ''; position: absolute; inset: -12px; }
.ws-story { display: flex; flex-direction: column; gap: 14px; margin-top: 28px; }
.ws-label { font-size: .9375rem; line-height: 1.3; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--st-label); }
.ws-hot { color: var(--st-hot); }
.ws-warm { color: var(--st-warm); }
.ws-big { font-size: min(2.125rem, 9.5vw); line-height: 1.08; font-weight: 700; letter-spacing: -.03em; text-wrap: balance; }
.ws-say { font-size: .9375rem; line-height: 1.45; color: var(--st-muted); text-wrap: pretty; }
.ws-hero { display: flex; align-items: baseline; gap: 12px; margin: 0; }
.ws-hero b { font-size: 4.5rem; line-height: .85; font-weight: 700; letter-spacing: -.05em; }
.ws-hero span { display: flex; flex-direction: column; font-size: 1.25rem; line-height: 1.2; font-weight: 600; letter-spacing: -.015em; }
.ws-hero small { font-size: .9375rem; font-weight: 400; letter-spacing: 0; color: var(--st-muted); }
.ws-tiles { list-style: none; margin: 8px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.ws-tiles li { min-width: 0; padding: 12px; border-radius: 16px; background: var(--st-card); }
.ws-tiles b { display: block; font-size: 1.625rem; line-height: 1; font-weight: 700; }
.ws-tile-say { display: block; margin-top: 6px; font-size: .8125rem; line-height: 1.3; color: var(--st-muted); overflow-wrap: anywhere; }
.ws-beads { display: flex; flex-wrap: wrap; gap: 3px; margin-top: 8px; }
.ws-beads i { width: 7px; height: 7px; border-radius: 999px; background: var(--bead); }
.ws-beads i.light { background: color-mix(in srgb, var(--bead) 50%, transparent); }
.ws-beads i.ring { box-sizing: border-box; border: 1.5px solid var(--bead); background: none; }
.ws-faint { font-size: .8125rem; line-height: 1.4; color: var(--st-faint); }
.ws-cards { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.ws-cards li { display: flex; flex-direction: column; gap: 2px; padding: 14px 16px; border-radius: 18px; background: var(--st-card); }
.ws-card-text { font-size: 1rem; line-height: 1.35; font-weight: 500; overflow-wrap: anywhere; }
.ws-card-meta { font-size: .8125rem; line-height: 1.4; color: var(--st-faint); }
.ws-cards .ws-more { padding: 0 16px; background: none; font-size: .8125rem; color: var(--st-muted); }
body.week-story .ava { background: oklch(.38 .06 var(--h)); color: oklch(.88 .06 var(--h)); }
.ws-faces { list-style: none; margin: 6px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px 8px; }
.ws-face { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 8px 0 6px; border-radius: 16px; color: var(--st-muted); text-decoration: none; }
.ws-face.on { background: var(--st-card); color: var(--st-ink); }
.ws-ava { position: relative; display: inline-flex; }
.ws-got { position: absolute; right: 0; bottom: 0; width: 13px; height: 13px; border-radius: 999px; box-shadow: 0 0 0 2.5px var(--st-bg); background: var(--bead); }
.ws-face.on .ws-got { box-shadow: 0 0 0 2.5px color-mix(in srgb, var(--st-bg) 92%, #fff); }
.ws-key { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 8px 6px 6px; font-size: .75rem; line-height: 1.3; color: var(--st-faint); text-align: center; }
.ws-key .ws-got { position: static; width: 11px; height: 11px; box-shadow: none; }
.ws-name { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .8125rem; line-height: 1.2; }
.ws-face.on .ws-name { font-weight: 600; }
.ws-who { display: flex; flex-direction: column; gap: 8px; padding: 14px 16px; border-radius: 18px; background: var(--st-card); }
.ws-who-name { font-size: 1rem; font-weight: 600; }
.ws-lines { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.ws-lines li { position: relative; padding-left: 18px; font-size: .9375rem; line-height: 1.4; overflow-wrap: anywhere; }
.ws-lines li::before { content: ''; position: absolute; left: 0; top: 7px; width: 8px; height: 8px; border-radius: 999px; background: var(--st-faint); }
.ws-lines li.got::before { background: var(--st-label); }
.ws-tails { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.ws-tail { display: flex; flex-direction: column; gap: 8px; padding: 14px 16px; border-radius: 18px; background: var(--st-card); }
.ws-tail-who { display: flex; align-items: center; gap: 10px; }
.ws-tail-who p { display: flex; flex-direction: column; min-width: 0; font-size: .9375rem; line-height: 1.3; }
.ws-tail-who span { font-size: .8125rem; }
.ws-tail-head { font-size: .8125rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.ws-tail form.rev-acts-row { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-top: 2px; }
.ws-tail .day-two { flex: 1 1 190px; }
.ws-tail .rev-acts-row > .button { width: auto; }
.ws-tail .rev-acts-row .rev-answers { flex: 0 0 auto; justify-content: flex-start; gap: 16px; }
.ws-tail .rev-answers .side { font-size: .9375rem; }
.ws-tail .say { padding: 10px 12px; font-size: .9375rem; line-height: 1.4; background: rgba(255, 255, 255, .06); }
.ws-tail-acts { display: flex; align-items: center; gap: 18px; }
.ws-tail-acts .rev-one { flex: 1; }
.ws-tail-acts .rev-one > summary { width: 100%; }
.ws-tail-acts .side { border: 0; background: none; padding: 0; font: inherit; color: var(--st-muted); cursor: pointer; }
.ws-tails .ws-more { list-style: none; padding: 0 16px; font-size: .8125rem; color: var(--st-muted); }
.ws-quiet { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.ws-quiet input { position: absolute; opacity: 0; pointer-events: none; }
.ws-quiet label { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; border-radius: 18px; background: var(--st-card); cursor: pointer; }
.ws-quiet-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; font-size: .9375rem; line-height: 1.35; }
.ws-quiet-text small { font-size: .8125rem; color: var(--st-faint); }
.ws-cite { margin-top: 4px; font-size: .9375rem; line-height: 1.4; color: var(--st-muted); overflow-wrap: anywhere; }
.ws-tick { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 999px; box-shadow: inset 0 0 0 1.5px var(--st-faint); color: transparent; font-size: .8125rem; font-weight: 700; }
.ws-quiet input:checked + label { background: rgba(255, 255, 255, .14); }
.ws-quiet input:checked + label .ws-tick { background: var(--st-ink); box-shadow: none; color: var(--st-bg); }
.ws-quiet input:focus-visible + label { outline: 2px solid var(--st-label); outline-offset: 2px; }
.ws-cards li.ws-card-who { flex-direction: row; align-items: center; gap: 12px; }
.ws-card-who > span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ws-form { display: contents; }
.ws-foot { margin-top: auto; padding-top: 28px; display: flex; flex-direction: column; gap: 10px; }
.ws-foot form { display: contents; }
.week-story .button.ws-go { background: var(--st-ink); color: var(--st-bg); }
.ws-progress.whole { column-gap: 0; }
.ws-thread {
    position: relative; height: 64px; margin-top: 4px;
    --lead: 28px; --step: min(36px, (100% - var(--lead) - 48px) / var(--n));
    --end: calc(var(--lead) + (var(--n) - 1) * var(--step) + 7px);
}
.ws-thread::before {
    content: ''; position: absolute; left: 0; top: 31px; width: var(--end); height: 2px;
    border-radius: 1px; background: rgba(246, 240, 248, .35); transform-origin: left center;
}
.ws-future {
    position: absolute; left: var(--end); right: 0; top: 31px; height: 2px;
    background: repeating-linear-gradient(to right, rgba(246, 240, 248, .35) 0 6px, transparent 6px 12px);
}
.ws-bead {
    position: absolute; top: 25px; left: calc(var(--lead) + (var(--i) - 1) * var(--step));
    width: 14px; height: 14px; border-radius: 999px; background: var(--bead-shine), var(--st-label);
}
.ws-bead.ws-this { box-shadow: 0 0 0 7px color-mix(in srgb, var(--bead) 20%, transparent), 0 0 0 15px color-mix(in srgb, var(--bead) 8%, transparent); }
.ws-this-say { position: absolute; top: 48px; left: calc(var(--lead) + (var(--i) - 1) * var(--step) + 7px); transform: translateX(-50%); font-size: .75rem; line-height: 1.3; font-weight: 600; white-space: nowrap; color: var(--st-label); }
.ws-story.ws-closed { flex: 1; justify-content: center; }
.ws-since { margin-top: 6px; padding: 16px; border-radius: 18px; background: var(--st-card); }
.ws-since-label { font-size: .75rem; line-height: 1.3; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--st-faint); }
.ws-since-say { margin-top: 6px; font-size: 1.25rem; line-height: 1.3; font-weight: 600; letter-spacing: -.012em; color: var(--st-ink); text-wrap: pretty; }
.ws-bead.ws-this::after { content: ''; position: absolute; inset: 0; border-radius: inherit; box-shadow: 0 0 0 1.5px var(--st-label); opacity: 0; }
.ws-go.bead { overflow: hidden; white-space: nowrap; }
.ws-kept { color: var(--st-label); font-weight: 600; }
@media (prefers-reduced-motion: no-preference) {
    :root.went-close .ws-thread::before { animation: thread .56s cubic-bezier(.2, .8, .2, 1) .1s both; }
    :root.went-close .ws-future { animation: screenIn .3s ease-out .54s both; }
    :root.went-close .ws-bead:not(.ws-this) { animation: dot-pop .36s cubic-bezier(.34, 1.56, .64, 1) calc(.2s + var(--i) * 70ms) both; }
    :root.went-close .ws-bead.ws-this { animation: bead-drop .6s cubic-bezier(.3, .7, .3, 1) .62s both; }
    :root.went-close .ws-bead.ws-this::after { animation: bead-ink .64s ease-out 1.15s both; }
    :root.went-close .ws-this-say { animation: say-in .4s ease-out 1.2s both; }
    :root.went-close .ws-closed > :not(.ws-thread) { animation: rowIn .4s cubic-bezier(.2, .8, .2, 1) .5s both; }
    :root.went-close .ws-closed > .ws-big { animation-delay: .58s; }
    :root.went-close .ws-closed > .ws-say:nth-child(3) { animation-delay: .66s; }
    :root.went-close .ws-closed > .ws-faint { animation-delay: .8s; }
    :root.went-close .ws-closed > .ws-since { animation-delay: .9s; }
    :root.went-close .ws-closed ~ .ws-foot { animation: rowIn .4s cubic-bezier(.2, .8, .2, 1) 1.3s both; }
}
@keyframes thread { from { transform: scaleX(0); } }
@keyframes bead-ink { from { opacity: .8; transform: scale(1); } to { opacity: 0; transform: scale(2.8); } }
@keyframes bead-drop { from { opacity: 0; transform: translateY(-28px) scale(.6); } 70% { opacity: 1; transform: translateY(2px) scale(1.06); } }
@keyframes say-in { from { opacity: 0; translate: 0 8px; } }
.week-story .button.ws-alt { background: rgba(255, 255, 255, .1); color: var(--st-ink); }
.ws-foot .rev-one > summary { width: 100%; }
.ws-next { position: relative; padding: 6px 0; text-align: center; font-size: .8125rem; line-height: 1.4; color: var(--st-faint); text-decoration: none; }
.ws-next::after { content: ''; position: absolute; inset: -8px 0; }
.rev-one { flex: 0 1 auto; }
.rev-one > summary { list-style: none; cursor: pointer; }
.rev-one > summary::-webkit-details-marker { display: none; }
.rev-one .one-body { margin-top: 12px; }
.rev-one .rows { background: var(--ground); }
dialog.sheet .rev-one .rows, dialog.sheet .rows { background: transparent; }
.rev-acts-row { display: flex; flex-direction: column; gap: 12px; margin-top: 8px; }
.rev-acts-row .button,
dialog.sheet .rev-acts-row .button { flex: none; width: 100%; }
.rev-answers { display: flex; justify-content: center; gap: 18px; flex-wrap: wrap; }
.rev-answers .side {
    position: relative;
    border: 0; background: none; padding: 0;
    font-family: inherit;
    cursor: pointer;
}
.rev-answers .side::after { content: ''; position: absolute; inset: -14px -8px; }
.day-card {
    margin-top: 20px;
    background: var(--surface);
    border-radius: 18px;
    padding: 16px;
    display: flex; flex-direction: column; gap: 12px;
}
.day-card.day-main { border-radius: 22px; padding: 18px 18px 16px; gap: 14px; box-shadow: 0 1px 2px rgba(26, 26, 31, .05), 0 10px 28px rgba(26, 26, 31, .08); }
.day-next { margin-top: -4px; text-align: center; font-size: .8125rem; line-height: 1.4; color: var(--muted); text-wrap: balance; }
.day-next i { display: inline-block; width: 12px; height: 12px; margin-right: 8px; vertical-align: -2px; box-sizing: border-box; border: 1.5px dashed var(--thread-bead); border-radius: 999px; }
.day-next b { font-weight: 600; color: var(--ink); }
.day-rule { margin-top: -4px; text-align: center; font-size: .8125rem; line-height: 1.4; color: var(--muted); text-wrap: balance; }
.day-more { margin: 8px 4px 0; text-align: center; font-size: .8125rem; line-height: 1.4; color: var(--muted); }
.day-hot { color: var(--hot); }
.day-warm { color: var(--warm); }
.day-first, .day-soon { color: var(--accent-ink); }
.day-ok { color: var(--ok); }
.day-muted { color: var(--muted); }
.day-quote { font-size: 1.625rem; line-height: 1.25; font-weight: 600; letter-spacing: -.02em; text-wrap: pretty; white-space: pre-wrap; }
.day-quote.plain { white-space: normal; }
a.day-quote, .one-quote a { display: block; color: var(--ink); text-decoration: none; border-radius: 10px; }
.day-empty { font-size: 1rem; line-height: 1.35; font-weight: 500; letter-spacing: -.01em; text-wrap: pretty; }
.day-note { font-size: .9375rem; line-height: 1.45; color: var(--muted); text-wrap: pretty; }
.day-week { display: block; position: relative; margin: 12px 4px 0; font-size: .8125rem; line-height: 1.4; color: var(--muted); text-decoration: none; text-wrap: pretty; }
.day-week::after { content: ''; position: absolute; inset: -10px -4px; }
.day-who { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: .9375rem; line-height: 1.5; color: var(--muted); }
.day-who a { position: relative; font-weight: 500; text-decoration: none; }
.day-who a::after { content: ''; position: absolute; inset: -12px -4px; }
.day-person { gap: 10px; font-size: 1rem; color: var(--ink); }
.day-person a { font-weight: 600; color: var(--ink); }
.day-person span { font-size: .8125rem; color: var(--muted); }
.day-acts { display: flex; flex-direction: column; gap: 12px; }
.day-sides { display: flex; justify-content: center; gap: 18px; flex-wrap: wrap; }
.day-sides .side {
    position: relative;
    display: inline-flex; align-items: center;
    border: 0; padding: 0;
    background: transparent;
    line-height: 1.4;
    text-decoration: none;
    cursor: pointer;
}
.day-sides .side::after { content: ''; position: absolute; inset: -12px -6px; }
.day-acts:has(.day-sides) + .day-aside { margin-top: 12px; }
.day-card .fill { margin-top: 0; }
.day-quick { display: flex; flex-direction: column; gap: 12px; }
.day-quick .quick-line { min-height: 76px; }
.day-tip { margin: 12px 0 0; padding: 0 4px; font-size: .8125rem; line-height: 1.45; color: var(--muted); text-wrap: pretty; }
.day-tip p + p { margin-top: 6px; }
.tip-words { display: flex; flex-wrap: wrap; gap: 6px; }
.tip-words mark { padding: 1px 8px; border-radius: 6px; background: var(--warm-bg); color: var(--warm-ink); font-weight: 500; }
.quick-touches { margin-top: 10px; }
.quick-touches .recorded-touches { margin-top: 4px; }
.bot-peek { margin: 0; border: 1px solid var(--line); border-radius: 14px; background: var(--ground); overflow: hidden; }
.bot-peek-head { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-bottom: 1px solid var(--line); }
.bot-peek-logo { --sign: 30px; border-radius: 50%; }
.bot-peek-head b { display: block; font-size: .9375rem; line-height: 1.25; font-weight: 600; }
.bot-peek-head small { display: block; font-size: .75rem; line-height: 1.25; color: var(--faint); }
.bot-peek-chat { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 12px 14px 14px; }
.bot-peek-date {
    align-self: center;
    padding: 2px 10px; border-radius: 999px;
    background: var(--chip-bg); color: var(--muted);
    font-size: .75rem; line-height: 1.5;
}
.bot-peek-msg {
    position: relative;
    max-width: 88%; padding: 8px 12px 6px;
    border-radius: 14px 14px 14px 4px;
    background: var(--surface);
    font-size: .9375rem; line-height: 1.4;
}
.bot-peek-msg p { margin: 0; }
.bot-peek-msg p + p { margin-top: 6px; }
.bot-peek-text { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; white-space: pre-wrap; }
.bot-peek-time { display: block; margin-top: 2px; text-align: right; font-size: .75rem; line-height: 1.3; color: var(--faint); font-variant-numeric: tabular-nums; }
.bot-peek-keys { display: grid; grid-template-columns: 1fr; gap: 6px; width: 88%; }
.bot-peek-keys span {
    display: grid; place-items: center;
    height: 32px; border-radius: 10px;
    border: 1px solid var(--field-border);
    color: var(--muted); font-size: .8125rem;
}
.bot-peek-say { margin: 0; font-size: .9375rem; line-height: 1.45; color: var(--muted); text-wrap: pretty; }
.bot-peek-chat { position: relative; }
.bot-peek-typing {
    position: absolute; left: 14px; top: 40px;
    display: flex; gap: 4px; padding: 12px 14px;
    border-radius: 14px 14px 14px 4px; background: var(--surface);
    opacity: 0; transform-origin: left bottom; pointer-events: none;
}
.bot-peek-typing i { width: 6px; height: 6px; border-radius: 999px; background: var(--chevron); }
@media (prefers-reduced-motion: no-preference) {
    .day-card.written { animation: written-in .36s cubic-bezier(.2, .8, .2, 1) .1s both; }
    .written > :where(.day-label:first-child, .day-who, .recorded-when, .bot-peek, .push-peek, .bot-peek-say, .day-acts) { animation: rowIn .4s cubic-bezier(.2, .8, .2, 1) both; }
    .written > .day-label:first-child { animation-delay: .2s; }
    .written > .day-who { animation-delay: .56s; }
    .written > .recorded-when { animation-delay: .68s; }
    .written .recorded-touches li { animation: rowIn .4s cubic-bezier(.2, .8, .2, 1) .78s both; }
    .written .recorded-touches li::before { animation: tick-dot .38s ease-out .82s both; }
    .written .recorded-touches li:nth-child(2) { animation-delay: .94s; }
    .written .recorded-touches li:nth-child(2)::before { animation-delay: .98s; }
    .written .recorded-touches li:nth-child(3) { animation-delay: 1.1s; }
    .written .recorded-touches li:nth-child(3)::before { animation-delay: 1.14s; }
    .written > :is(.bot-peek, .push-peek) { animation-delay: 1.16s; }
    .written > .push-peek { animation-name: peek-down; }
    .written > .day-acts { animation-delay: 1.2s; }
    .written .bot-peek-date { animation: screenIn .24s ease-out 1.36s both; }
    .written .bot-peek-typing { animation: typing .96s ease-out 1.5s both; }
    .written .bot-peek-typing i { animation: typing-dot .6s ease-in-out 1.56s 2; }
    .written .bot-peek-typing i:nth-child(2) { animation-delay: 1.71s; }
    .written .bot-peek-typing i:nth-child(3) { animation-delay: 1.86s; }
    .written .bot-peek-msg { transform-origin: left bottom; animation: msg-pop .38s cubic-bezier(.34, 1.56, .64, 1) 2.52s both; }
    .written .bot-peek-keys span { animation: rowIn .4s cubic-bezier(.2, .8, .2, 1) 2.8s both; }
    .written .bot-peek-keys span + span { animation-delay: 2.88s; }
    .written > .bot-peek-say { animation-delay: 3s; }
}
@keyframes written-in { from { opacity: 0; transform: scale(.97); } }
@keyframes tick-dot { from { transform: scale(0); } 60% { transform: scale(1.6); } }
@keyframes peek-down { from { opacity: 0; transform: translateY(-16px); } }
@keyframes typing { from { opacity: 0; transform: scale(.8); } 25%, 92% { opacity: 1; transform: none; } to { opacity: 0; } }
@keyframes typing-dot { 0%, 100% { opacity: .3; } 50% { opacity: 1; } }
@keyframes msg-pop { from { opacity: 0; transform: scale(.85); } }
.day-stack { position: relative; margin-top: 20px; padding-bottom: 14px; }
.day-stack > .day-card { position: relative; margin-top: 0; }
.day-under { position: absolute; height: 40px; }
.day-under-1 { left: 9px; right: 9px; bottom: 7px; border-radius: 21px; background: var(--line-soft); box-shadow: 0 1px 2px rgba(26, 26, 31, .06); }
.day-under-2 { left: 18px; right: 18px; bottom: 0; border-radius: 20px; background: var(--chip-bg); }
.day-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 4px 12px; }
.day-count { margin-left: auto; font-size: .8125rem; line-height: 1.4; color: var(--faint); font-variant-numeric: tabular-nums; }
.day-all { position: relative; font-weight: 500; color: var(--ink); text-decoration: none; }
.day-all::after { content: ''; position: absolute; inset: -14px -6px -12px; }
.day-two { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 8px; }
.day-two.main { grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); grid-auto-flow: row; }
.day-two.yielding { display: flex; }
.day-two.yielding > * { flex: 1 1 0; min-width: 0; overflow: hidden; white-space: nowrap; }
.day-two.main.yielding > :last-child { flex-grow: 1.4; }
main:has(.day-card:not(.pulse-card) .button.day-go:not(.ghost)) .button.pulse-write { background: var(--quiet-bg); color: var(--accent-ink); }
.button.marked { background: var(--ok); color: var(--on-ok); }
.day-acts .button.day-go.marked:not(.ghost) { background: var(--accent); color: var(--on-accent); }
.button.ghost.marked { background: var(--ok-bg); color: var(--ok); }
.mark-slot { display: inline-flex; flex: none; overflow: hidden; }
.mark-slot .mark { flex: none; margin-right: 8px; }
.mark-slot.after .mark { margin: 0 0 0 8px; }
.one-progress { display: flex; gap: 4px; margin-top: 8px; }
.one-progress i { flex: 1; height: 4px; border-radius: 2px; background: var(--chip-bg); }
.one-progress i.skip { background: var(--accent-soft); }
.one-progress i.done, .one-progress i.now { background: var(--accent); }
.one-deck { position: relative; margin: 24px 4px 44px; }
.one-under {
    position: absolute; border-radius: 28px;
    background: var(--surface);
    box-shadow: 0 0 0 1px var(--field-border), 0 6px 16px rgba(26, 26, 31, .05);
}
.one-under-1 { inset: 12px 6px -12px; transform: rotate(2.5deg); }
.one-under-2 { inset: 26px 16px -22px; transform: rotate(-3.5deg); }
.one-card {
    position: relative;
    min-height: min(420px, 54svh);
    box-sizing: border-box;
    padding: 24px;
    border-radius: 28px;
    background: var(--surface);
    display: flex; flex-direction: column; align-items: flex-start; gap: 16px;
    box-shadow: 0 0 0 1px var(--line), 0 18px 40px rgba(26, 26, 31, .14);
}
:root[data-theme="dark"] .one-card { box-shadow: 0 0 0 1px #3c3c44, 0 18px 40px rgba(0, 0, 0, .5); }
:root[data-theme="dark"] .one-under { box-shadow: 0 0 0 1px #3c3c44, 0 6px 16px rgba(0, 0, 0, .35); }
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .one-card { box-shadow: 0 0 0 1px #3c3c44, 0 18px 40px rgba(0, 0, 0, .5); }
    :root:not([data-theme="light"]) .one-under { box-shadow: 0 0 0 1px #3c3c44, 0 6px 16px rgba(0, 0, 0, .35); }
}
.one-flashes { position: fixed; z-index: 5; left: 16px; right: 16px; bottom: calc(env(safe-area-inset-bottom) + 16px); max-width: calc(34rem - 32px); margin: 0 auto; pointer-events: none; }
.one-flashes > * { pointer-events: auto; }
.one-flashes > .flash:first-child { margin-top: 0; }
.one-flashes > .flash-success { background: linear-gradient(var(--ok-bg), var(--ok-bg)), var(--surface); }
.one-flashes > .flash-error { background: linear-gradient(var(--hot-bg), var(--hot-bg)), var(--surface); }
.one-flashes > .flash-tell { margin: 6px 0 0; padding: 8px 12px; border-radius: 14px; background: var(--surface); }
main:has(.one-flashes > *) { padding-bottom: calc(env(safe-area-inset-bottom) + 140px); }
.one-progress { view-transition-name: one-progress; }
.one-card { view-transition-name: one-card; }
.one-under-1 { view-transition-name: one-under-1; }
.one-under-2 { view-transition-name: one-under-2; }
.one-acts { view-transition-name: one-acts; }
@media (prefers-reduced-motion: no-preference) {
    ::view-transition-group(one-progress), ::view-transition-group(one-card), ::view-transition-group(one-under-1),
    ::view-transition-group(one-under-2), ::view-transition-group(one-acts) {
        animation-duration: .34s; animation-timing-function: cubic-bezier(.2, .8, .2, 1);
    }
    ::view-transition-old(one-card) { z-index: 1; animation: one-away .28s cubic-bezier(.25, .6, .35, 1) both; }
    ::view-transition-old(one-card):only-child { animation: screenOut var(--screen-out) ease-out both; }
    ::view-transition-new(one-card) { animation: one-rise .32s cubic-bezier(.2, .8, .2, 1) .08s both; }
}
@keyframes one-away { 60% { opacity: .5; } to { opacity: 0; transform: translate(-80%, -2%) rotate(-9deg); } }
@media (prefers-reduced-motion: no-preference) {
    :root.went-done::view-transition-old(one-card) { animation: one-done .34s cubic-bezier(.45, 0, .75, .4) both; }
    :root.went-skip::view-transition-old(one-card) { z-index: 1; animation: one-under .34s cubic-bezier(.4, 0, 1, 1) both; }
    :root.went-skip::view-transition-new(one-card) { animation-delay: .18s; }
    :root.went-skip .one-under-1 { animation: under-nudge .52s ease-out .12s; }
    :root:is(.went-done, .went-skip) .one-progress i.now { animation: seg-fill .42s cubic-bezier(.2, .8, .2, 1) .06s both; }
    :root.went-done .one-progress.whole { animation: merge .42s cubic-bezier(.45, 0, .2, 1) .4s both; }
    :root.went-done .one-progress.whole i { animation: to-ok .3s ease-out calc(.6s + var(--i, 0) * 50ms) both; }
}
@keyframes one-done { to { opacity: 0; transform: translate(78%, -4%) rotate(8deg); } }
@keyframes one-under { to { opacity: 0; transform: translate(-24%, 40px) rotate(-5deg) scale(.88); } }
@keyframes under-nudge { 50% { transform: rotate(1deg) translateY(-6px); } }
@keyframes seg-fill { from { background-size: 0 100%; } }
@keyframes merge { from { column-gap: 4px; } }
@keyframes to-ok { from { background-color: var(--accent); } }
.one-progress i.now { background: linear-gradient(var(--accent), var(--accent)) 0 0 / 100% 100% no-repeat var(--chip-bg); }
.one-progress.whole { column-gap: 0; }
.one-progress.whole i { background: var(--ok); border-radius: 0; }
.one-progress.whole i:first-child { border-radius: 2px 0 0 2px; }
.one-progress.whole i:last-child { border-radius: 0 2px 2px 0; }
.one-end { view-transition-name: one-card; }
.one-card { touch-action: pan-y; }
.seal {
    position: absolute; top: 20px; right: 20px;
    display: flex; align-items: center; justify-content: center; box-sizing: border-box;
    border-radius: 999px; transform: rotate(-8deg); pointer-events: none;
}
.seal-done { width: 64px; height: 64px; background: var(--ok-bg); box-shadow: inset 0 0 0 2px var(--ok); color: var(--ok); }
.seal-move {
    top: 24px; height: 40px; gap: 6px; padding: 0 14px;
    background: var(--warm-bg); box-shadow: inset 0 0 0 2px var(--warm); color: var(--warm-ink);
    font-size: .9375rem; font-weight: 600; white-space: nowrap;
}
.seal-move svg { fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.seal-ink { position: absolute; inset: 0; border-radius: inherit; opacity: 0; }
.seal-done .seal-ink { box-shadow: 0 0 0 2px var(--ok); }
.seal-move .seal-ink { box-shadow: 0 0 0 2px var(--warm); }
.one-hint { margin: 16px 0 0; text-align: center; font-size: .8125rem; line-height: 1.4; color: var(--faint); animation: hint 2.4s linear both; }
@keyframes hint { from { opacity: 0; } 12%, 80% { opacity: 1; } to { opacity: 0; } }
.done-dot { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; margin-right: 8px; vertical-align: -5px; border-radius: 999px; background: var(--ok); color: var(--on-ok); }
.done-dot .mark { stroke-width: 3.5; }
[data-vt="day-card"] { view-transition-name: day-card; }
@media (prefers-reduced-motion: no-preference) {
    ::view-transition-old(day-card):only-child { animation: screenOut var(--screen-out) ease-out both; }
    ::view-transition-new(day-card):only-child { animation: screenIn var(--screen-in) ease-out both; }
    :root.went-done::view-transition-old(day-card) { z-index: 1; animation: day-fly .5s cubic-bezier(.5, 0, .3, 1) .28s both; }
    :root.went-done::view-transition-new(day-card) { animation: one-rise .32s cubic-bezier(.2, .8, .2, 1) .68s both; }
    :root.went-done .day-under-1 { animation: nudge .42s ease-out .84s; }
    :root.went-done .day-under-2 { animation: nudge .42s ease-out .88s; }
}
@keyframes day-fly {
    16% { opacity: 1; transform: translate(0, -6px) scale(1.012); }
    to { opacity: 0; transform: translate(var(--fly-x, 78%), var(--fly-y, -4%)) rotate(var(--fly-r, 8deg)) scale(var(--fly-s, 1)); }
}
@keyframes nudge { 40% { transform: translateY(-4px); } }
@keyframes one-rise { from { opacity: 0; transform: translateY(18px) scale(.96); } }
.one-quote { margin: 0; font-size: 1.625rem; line-height: 1.18; font-weight: 600; letter-spacing: -.022em; text-wrap: pretty; overflow-wrap: anywhere; }
.one-quote.one-long { font-size: 1.25rem; line-height: 1.25; letter-spacing: -.018em; }
.one-who { margin: 0; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: .9375rem; line-height: 1.45; color: var(--muted); }
.one-who a { position: relative; font-weight: 500; text-decoration: none; }
.one-who a::after { content: ''; position: absolute; inset: -12px -4px; }
.one-card .say { align-self: stretch; background: var(--ground); }
.button.one-ask { align-self: stretch; }
.one-context { margin: auto 0 0; align-self: stretch; display: flex; gap: 10px; padding-top: 14px; border-top: 1px solid var(--line-soft); font-size: .9375rem; line-height: 1.45; color: var(--muted); white-space: pre-line; overflow-wrap: anywhere; }
.one-context::before { content: ''; flex: none; width: 8px; height: 8px; margin-top: 7px; border-radius: 999px; background: var(--input-border); }
.one-acts { display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; gap: 12px; }
.one-act {
    width: 96px;
    display: flex; flex-direction: column; align-items: center; gap: 8px;
    border: 0; padding: 0; background: transparent;
    font: inherit; font-size: .8125rem; line-height: 1.3; text-align: center; color: var(--muted);
    text-decoration: none; cursor: pointer;
}
.one-disc {
    width: 60px; height: 60px; box-sizing: border-box;
    border-radius: 999px; border: 2px solid var(--field-border);
    display: flex; align-items: center; justify-content: center;
    color: var(--muted);
    transition: transform .12s;
}
.one-act:active .one-disc { transform: scale(.94); }
.one-move .one-disc { border: 0; background: var(--quiet-bg); color: var(--accent-ink); }
.one-move { color: var(--accent-ink); font-weight: 500; }
.one-main { color: var(--ink); font-weight: 600; }
.one-main .one-disc { width: 76px; height: 76px; border: 0; background: var(--accent); color: var(--on-accent); }
.one-quiet { margin: 36px 0 0; padding-top: 14px; border-top: 1px solid var(--line); text-align: center; }
.one-quiet .side {
    position: relative;
    border: 0; padding: 0; background: transparent;
    font-family: inherit; line-height: 1.4;
    cursor: pointer;
}
.one-quiet .side::after { content: ''; position: absolute; inset: -14px -16px; }
.one-answers { align-self: stretch; }
.one-card > .day-sides { align-self: stretch; }
.agreed { margin: 0; font-size: .9375rem; line-height: 1.45; color: var(--muted); text-wrap: pretty; }
.agreed a { font-weight: 500; text-decoration: none; }
.ask-hint { margin: -4px 0 0; font-size: .8125rem; line-height: 1.45; color: var(--faint); text-align: center; text-wrap: pretty; }
.one-card > .ask-hint { align-self: stretch; }
.pulse { display: flex; flex-direction: column; gap: 12px; margin-top: 32px; }
.pulse-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 0 4px; }
.pulse-head h2 { margin: 0; font-size: 1.25rem; line-height: 1.2; font-weight: 700; letter-spacing: -.02em; }
.pulse-head a { position: relative; font-size: .9375rem; font-weight: 500; color: var(--ink); text-decoration: none; }
.pulse-head a::after { content: ''; position: absolute; inset: -12px -8px; }
.pulse-head a span, .day-all span, .day-week span { color: var(--chevron); }
.pulse-card {
    margin-top: 0;
    padding: 20px 16px 16px;
    gap: 14px;
    border-radius: 22px;
    background: var(--accent-surface);
}
.pulse-card.pulse-wrote { padding-top: 16px; }
.pulse-label { color: var(--accent-ink); }
.pulse-text { font-size: .9375rem; line-height: 1.45; text-wrap: pretty; }
.pulse-note { margin: 0; font-size: .9375rem; line-height: 1.45; color: var(--muted); text-wrap: pretty; }
.pulse-setup { display: flex; flex-direction: column; gap: 12px; }
.pulse-setup .pulse-note { font-size: .8125rem; color: var(--faint); }
.pulse-need { margin: -4px 0 0; text-align: center; font-size: .8125rem; line-height: 1.4; color: var(--muted); }
.pring { position: relative; flex: none; display: flex; align-items: center; justify-content: center; border-radius: 999px; }
.pring > svg { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.pring-track { fill: none; stroke: var(--chip-bg); }
.pring-fill { fill: none; stroke: var(--accent-soft); stroke-linecap: round; }
.pring-due .pring-fill { stroke: var(--accent); }
.pring-ok .pring-fill { stroke: var(--ok); }
.pring-66 { width: 66px; height: 66px; }
.pring-52 { width: 52px; height: 52px; }
.pring-done {
    position: absolute; right: 0; bottom: 0;
    display: flex; align-items: center; justify-content: center;
    width: 22px; height: 22px; border-radius: 999px;
    background: var(--ok); color: var(--on-ok);
    box-shadow: 0 0 0 2px var(--accent-surface);
}
.pulse-face { display: flex; align-items: center; gap: 12px; }
.pulse-face-say { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pulse-who-line { margin: 0; line-height: 1.2; }
.pulse-who {
    position: relative; align-self: flex-start;
    font-size: 1.25rem; line-height: 1.2; font-weight: 600; letter-spacing: -.02em;
    color: var(--ink); text-decoration: none;
}
.pulse-who-line .pulse-sub { font-size: .8125rem; }
.pulse-who::after { content: ''; position: absolute; inset: -10px -4px; }
.pulse-who:active { color: var(--accent-ink); }
.pulse-sub { margin: 0; font-size: .8125rem; line-height: 1.4; color: var(--muted); text-wrap: pretty; }
.pulse-wrote-who { display: flex; align-items: center; gap: 14px; }
.pulse-wrote-who > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pulse-wrote-who .pulse-who { line-height: 1.2; }
.pulse-chat { display: flex; flex-direction: column; gap: 6px; }
.pulse-bubble {
    position: relative; align-self: flex-start; max-width: 88%;
    padding: 10px 14px 11px;
    display: flex; flex-direction: column; gap: 3px;
    border-radius: 18px 18px 18px 6px;
    background: var(--surface);
}
.pulse-mine {
    align-self: flex-end; max-width: 84%; margin: 0;
    padding: 10px 14px;
    display: flex; flex-direction: column; gap: 2px;
    border-radius: 18px 18px 6px 18px;
    background: oklch(.42 .085 var(--h, 320)); color: #fff;
    font-size: 1rem; line-height: 1.4; text-wrap: pretty; overflow-wrap: anywhere;
}
.pulse-mine small { align-self: flex-end; font-size: .75rem; line-height: 1.3; color: rgba(255, 255, 255, .78); }
.toned { --tone-ink: oklch(.38 .09 var(--h)); }
.pulse-card.toned { background: oklch(.955 .022 var(--h)); }
.pulse-card .pulse-mine { padding: 9px 14px; font-size: .9375rem; }
.pulse-bubble.brief { padding: 9px 14px 10px; }
.pulse-bubble.brief .pulse-cite { font-size: .9375rem; }
.pulse-card .button.day-go { min-height: 44px; font-size: .9375rem; }
body:has(.who-band) .group > .group-head h2 { font-size: 1rem; line-height: 1.3; font-weight: 600; letter-spacing: -.01em; text-transform: none; color: var(--ink); }
.toned .button.ghost.day-go { background: color-mix(in srgb, var(--surface) 60%, transparent); color: var(--tone-ink); }
main:has(.day-card:not(.pulse-card) .button.day-go:not(.ghost)) .toned .button.pulse-write { background: var(--surface); color: var(--tone-ink); }
.toned .pulse-label { color: oklch(.42 .09 var(--h)); }
.toned .pulse-face .pring-track { stroke: oklch(.89 .03 var(--h)); }
.toned .pulse-face .pring-fill { stroke: oklch(.5 .1 var(--h)); }
.toned .pulse-rule { background: oklch(.9 .02 var(--h)); }
.toned .pring-done { box-shadow: 0 0 0 2px oklch(.955 .022 var(--h)); }
.who-band { --band: oklch(.955 .022 var(--h)); padding-bottom: 24px; border-image: linear-gradient(var(--band), var(--band)) fill 0 / / 100vh 100vw 0; }
.who-band .who-sub a { color: oklch(.42 .09 var(--h)); }
:root[data-theme="dark"] .toned { --tone-ink: oklch(.84 .07 var(--h)); }
:root[data-theme="dark"] .pulse-card.toned { background: oklch(.3 .03 var(--h)); }
:root[data-theme="dark"] .toned .pulse-label { color: oklch(.84 .07 var(--h)); }
:root[data-theme="dark"] .toned .pulse-face .pring-track { stroke: oklch(.38 .03 var(--h)); }
:root[data-theme="dark"] .toned .pulse-face .pring-fill { stroke: oklch(.74 .09 var(--h)); }
:root[data-theme="dark"] .toned .pulse-rule { background: oklch(.36 .03 var(--h)); }
:root[data-theme="dark"] .toned .pring-done { box-shadow: 0 0 0 2px oklch(.3 .03 var(--h)); }
:root[data-theme="dark"] .who-band { --band: oklch(.3 .03 var(--h)); }
:root[data-theme="dark"] .who-band .who-sub a { color: oklch(.84 .07 var(--h)); }
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .toned { --tone-ink: oklch(.84 .07 var(--h)); }
    :root:not([data-theme="light"]) .pulse-card.toned { background: oklch(.3 .03 var(--h)); }
    :root:not([data-theme="light"]) .toned .pulse-label { color: oklch(.84 .07 var(--h)); }
    :root:not([data-theme="light"]) .toned .pulse-face .pring-track { stroke: oklch(.38 .03 var(--h)); }
    :root:not([data-theme="light"]) .toned .pulse-face .pring-fill { stroke: oklch(.74 .09 var(--h)); }
    :root:not([data-theme="light"]) .toned .pulse-rule { background: oklch(.36 .03 var(--h)); }
    :root:not([data-theme="light"]) .toned .pring-done { box-shadow: 0 0 0 2px oklch(.3 .03 var(--h)); }
    :root:not([data-theme="light"]) .who-band { --band: oklch(.3 .03 var(--h)); }
    :root:not([data-theme="light"]) .who-band .who-sub a { color: oklch(.84 .07 var(--h)); }
}
.pulse-from { position: relative; font-size: .75rem; line-height: 1.3; color: var(--faint); }
.pulse-cite {
    position: relative;
    font-size: 1rem; line-height: 1.4; font-weight: 500; color: var(--ink);
    text-wrap: pretty; overflow-wrap: anywhere;
    display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden;
}
.pulse-phrase { margin: -4px 0 0; font-size: .8125rem; line-height: 1.45; color: var(--faint); text-align: center; text-wrap: pretty; }
.pulse-inline { display: inline; }
.pulse-inline .side { position: relative; padding: 0; border: 0; background: none; font: inherit; font-weight: 500; color: var(--muted); text-decoration: underline; text-decoration-color: var(--chevron); text-underline-offset: 3px; cursor: pointer; }
.pulse-inline .side::after { content: ''; position: absolute; inset: -12px -8px; }
.pulse-say { user-select: all; }
.day-acts > .say.pulse-say { margin-bottom: 4px; }
.pulse-wrote-line { margin-top: 14px; font-size: .8125rem; line-height: 1.45; color: var(--muted); text-align: center; text-wrap: pretty; }
.pulse-wrote-line .side { position: relative; padding: 0; border: 0; background: none; font: inherit; font-weight: 500; color: var(--accent-ink); cursor: pointer; }
.pulse-wrote-line .side::after { content: ''; position: absolute; inset: -12px -6px; }
.pulse-none {
    margin: 4px 0 0; padding: 10px 14px;
    border: 1.5px dashed var(--field-border); border-radius: 14px;
    font-size: .9375rem; line-height: 1.45; color: var(--muted);
    text-align: center; text-wrap: pretty;
}
.pulse-ask { margin: 0; font-size: .9375rem; line-height: 1.45; text-align: center; text-wrap: pretty; }
.pulse-card .pulse-chips { justify-content: center; }
.pulse-card .pulse-chip { background: transparent; }
.pulse-card .pulse-chip.on { background: var(--accent-bg); }
.pulse-calm { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
.pulse-calm .day-label { margin-top: 6px; }
.pulse-title { margin: 0; font-size: 1.25rem; line-height: 1.25; font-weight: 600; letter-spacing: -.018em; text-wrap: pretty; }
.pulse-calm .day-sides { margin-top: 4px; }
.pulse-stack { display: flex; justify-content: center; padding-left: 12px; }
.pulse-calm { container-type: inline-size; }
@container (max-width: 250px) { .pulse-stacked:nth-of-type(n + 4), .pulse-stack .pulse-more { display: none; } }
.pulse-stacked { position: relative; margin-left: -12px; border-radius: 999px; text-decoration: none; }
.pulse-stacked .pring { background: var(--accent-surface); }
.pulse-stacked:active .ava { filter: brightness(.92); }
.pulse-stack .pulse-more { margin-left: -12px; width: 52px; height: 52px; box-shadow: 0 0 0 3px var(--accent-surface); }
.pulse-rule { height: 1px; margin: 2px -16px 0; background: var(--line); }
.pulse-caption { margin: 0; font-size: .8125rem; line-height: 1.4; color: var(--faint); }
.pulse-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.pulse-one { position: relative; flex: none; display: flex; border-radius: 999px; text-decoration: none; }
.pulse-one .ava { outline-offset: 2px; }
.pulse-one.due .ava { outline: 2px solid var(--accent); }
.pulse-one.wrote .ava { outline: 2px solid var(--ok); }
.pulse-one.on .ava { outline: 2px solid var(--ink); }
.pulse-row .pulse-more { width: auto; height: auto; margin-left: auto; padding: 0; background: none; font-size: .8125rem; font-weight: 400; color: var(--muted); white-space: nowrap; }
.pulse-row .pulse-more::after { inset: -14px -8px; }
.pulse-next { display: block; position: relative; margin-top: 12px; font-size: .9375rem; font-weight: 500; text-align: center; text-decoration: none; }
.pulse-next::after { content: ''; position: absolute; inset: -12px 0; }
.pulse-one::after, .pulse-more::after { content: ''; position: absolute; inset: -4px; }
.pulse-one:active .ava { filter: brightness(.92); }
.pulse-more {
    position: relative; justify-self: center;
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px;
    border-radius: 999px;
    background: var(--chip-bg);
    color: var(--muted);
    font-size: .8125rem; font-weight: 600;
    text-decoration: none;
}
.ava.quiet { background: transparent; border: 1.5px solid var(--chevron); color: var(--muted); font-size: calc(var(--ava, 20px) * .45); }
:root[data-theme="dark"] .ava.quiet { background: transparent; color: var(--muted); }
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .ava.quiet { background: transparent; color: var(--muted); }
}
.pulse-few.pulse-empty {
    flex-direction: column; align-items: flex-start; gap: 6px;
    margin-top: 0; padding: 18px 16px;
    border: 1.5px dashed var(--accent-soft); border-radius: 18px;
}
.pulse-empty .pulse-few-faces { margin-bottom: 6px; }
.pulse-few .pulse-empty-title { font-size: .9375rem; font-weight: 600; color: var(--ink); }
.pulse-few .pulse-few-sub { font-size: .8125rem; }
.pulse-empty a { margin-top: 4px; }
.pulse-calm ~ .ring-group { margin-top: 0; text-align: left; }
.pulse-card .soon-list { background: none; }
.pulse-card .soon-list a { padding-left: 0; padding-right: 0; }
.pulse-few {
    display: flex; align-items: center; gap: 12px;
    margin-top: 28px; padding: 14px 4px;
    border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
}
.pulse-few-faces { flex: none; display: flex; }
.pulse-few-faces i { width: 28px; height: 28px; box-sizing: border-box; border-radius: 999px; border: 1.5px dashed var(--chevron); background: var(--ground); }
.pulse-few-faces i + i { margin-left: -8px; }
.pulse-few p { flex: 1; min-width: 0; margin: 0; font-size: .9375rem; line-height: 1.4; color: var(--muted); text-wrap: pretty; }
.pulse-few a { position: relative; flex: none; font-size: .9375rem; font-weight: 500; color: var(--accent-ink); text-decoration: none; }
.pulse-few a::after { content: ''; position: absolute; inset: -12px -6px; }
.pulse-start-note { display: flex; gap: 12px; align-items: flex-start; margin-top: 12px; padding: 14px 16px; border-radius: 18px; background: var(--surface); }
.pulse-start-note p { margin: 0; font-size: .9375rem; line-height: 1.45; color: var(--muted); text-wrap: pretty; }
.pulse-start-note b { font-weight: 600; color: var(--ink); }
.pulse-start-note .side { display: inline-block; margin-top: 6px; position: relative; text-decoration: none; }
.pulse-start-note .side::after { content: ''; position: absolute; inset: -12px -8px; }
.pulse-start-choose { margin-top: 16px; text-decoration: none; }
.pulse-start-choose:active { background: var(--press); }
.pulse-start-choose .pulse-few-faces .ava + .ava { margin-left: -8px; }
.pulse-start-go { flex: none; font-size: .9375rem; font-weight: 500; color: var(--accent-ink); }
.ask-more-wide .button { min-height: 48px; border-radius: 14px; margin-top: 4px; }
.pulse-people { display: flex; flex-wrap: wrap; gap: 8px; }
.pulse-person input { position: absolute; opacity: 0; pointer-events: none; width: 0; height: 0; }
.pulse-person label {
    display: inline-flex; align-items: center; gap: 6px;
    min-height: 44px; padding: 0 12px 0 6px;
    border-radius: 999px;
    border: 1px solid var(--field-border);
    background: var(--surface);
    color: var(--ink);
    font-size: .9375rem; line-height: 1.2;
    cursor: pointer;
}
.pulse-person input:checked + label {
    border-color: transparent;
    background: var(--accent-bg);
    color: var(--accent-ink);
    font-weight: 600;
}
.pulse-person input:checked + label::after { content: '✓'; }
.pulse-person input:focus-visible + label { outline: 2px solid var(--accent-ink); outline-offset: 2px; }
.pulse-more-people > summary {
    display: inline-flex; align-items: center;
    min-height: 44px; padding: 0 14px;
    border-radius: 999px;
    border: 1px solid var(--field-border);
    color: var(--muted);
    font-size: .9375rem;
    list-style: none;
    cursor: pointer;
}
.pulse-more-people > summary::-webkit-details-marker { display: none; }
.pulse-more-people[open] { display: flex; flex-wrap: wrap; gap: 8px; width: 100%; }
.pulse-more-people[open] > summary { display: none; }
.pulse-chips { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-start; }
.pulse-chip {
    display: inline-flex; align-items: center;
    min-height: 44px; padding: 0 14px;
    border-radius: 999px;
    border: 1px solid var(--field-border);
    background: var(--surface);
    color: var(--ink);
    font: inherit; font-size: .9375rem; line-height: 1.2;
    list-style: none;
    cursor: pointer;
}
.pulse-chip::-webkit-details-marker { display: none; }
.pulse-chip.on { border-color: transparent; background: var(--accent-bg); color: var(--accent-ink); font-weight: 600; }
.pulse-chip:active { background: var(--press); }
.pulse-earlier[open] { flex: 1 1 100%; display: flex; flex-direction: column; gap: 8px; }
.pulse-earlier[open] > summary { align-self: flex-start; }
.pulse-earlier-body { display: flex; gap: 8px; align-items: center; }
.pulse-earlier-body input {
    flex: 1 1 auto; min-width: 0;
    height: 44px; padding: 0 14px;
    border: 1px solid var(--input-border); border-radius: 14px;
    background: var(--surface); color: var(--ink);
    font: inherit; font-size: 1rem;
}
dialog.tour {
    position: fixed; inset: 0;
    width: 100%; height: 100%;
    max-width: none; max-height: none;
    margin: 0; padding: 0; border: 0;
    background: transparent;
    overflow: hidden;
    touch-action: none;
    transition: opacity .24s ease-out;
}
dialog.tour::backdrop { background: transparent; }
@starting-style {
    dialog.tour[open] { opacity: 0; }
}
dialog.tour.closing { opacity: 0; transition-duration: .22s; transition-timing-function: cubic-bezier(.4, 0, 1, 1); }
html:has(dialog.tour[open]) { overflow: hidden; }
.tour-spot {
    position: absolute;
    left: var(--x, 50%); top: var(--y, 50%);
    width: var(--w, 0); height: var(--h, 0);
    border-radius: 999px;
    box-shadow: 0 0 0 4px var(--accent-soft), 0 0 0 200vmax var(--scrim);
    transition-property: left, top, width, height;
    transition-duration: .34s;
    transition-timing-function: cubic-bezier(.2, .8, .2, 1);
    pointer-events: none;
}
.tour-spot.still { transition: none; }
.tour-tip {
    position: absolute;
    left: var(--tip-x, 16px); top: var(--tip-y, 16px);
    width: min(22rem, calc(100% - 32px));
    padding: 16px 16px 16px 20px;
    border-radius: 18px;
    background: var(--surface);
    color: var(--ink);
    font-size: .9375rem; line-height: 1.45;
    text-wrap: pretty;
    opacity: 0;
    transform: translateY(6px);
    transition: opacity .12s ease-out, transform .12s ease-out;
}
.tour-tip.below { transform: translateY(-6px); }
.tour-tip.on { opacity: 1; transform: none; transition-duration: .24s; }
.tour-count { margin-bottom: 4px; font-size: .8125rem; line-height: 1.4; color: var(--muted); }
.tour-tip::after {
    content: '';
    position: absolute;
    left: var(--tail-x, 50%); bottom: -6px;
    width: 14px; height: 14px;
    background: inherit;
    transform: translateX(-50%) rotate(45deg);
}
.tour-tip.below::after { bottom: auto; top: -6px; }
.button.tour-ok {
    position: relative;
    width: fit-content;
    margin: 12px 0 0 auto;
}
.button.tour-ok::after { content: ''; position: absolute; inset: -4px; }
.menu { flex: none; }
.menu[open] { flex: 1 1 100%; }
.menu > summary { list-style: none; cursor: pointer; }
.menu > summary::-webkit-details-marker { display: none; }
.menu-you { justify-content: center; width: 36px; padding: 0; }
.menu-you:has(> .ava), .menu-you:has(> .ava):active { background: none; }
.menu-you > .ava { box-shadow: 0 0 0 2px var(--surface); }
.menu-you:active > .ava { filter: brightness(.92); }
.menu-title:not([hidden]) { display: flex; align-items: center; gap: 10px; }
.menu-body { display: flex; flex-direction: column; gap: 12px; margin-top: 8px; }
.menu-list { display: flex; flex-direction: column; gap: 4px; }
.menu-list > a {
    display: flex; align-items: center; gap: 12px;
    padding: 14px 16px;
    border-radius: 4px;
    background: var(--surface);
    color: var(--ink);
    font-size: 1rem; font-weight: 500;
    text-decoration: none;
}
.menu-list > a:first-child { border-radius: 16px 16px 4px 4px; }
.menu-list > a:last-child { border-radius: 4px 4px 16px 16px; }
.menu-list > a:only-child { border-radius: 16px; }
.menu-list > a:active { background: var(--press); }
.menu-col { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.menu-col > span:first-child { line-height: 1.35; }
.menu-sub { font-size: .8125rem; line-height: 1.35; font-weight: 400; color: var(--muted); text-wrap: pretty; }
.menu-out > a { color: var(--muted); }
dialog.sheet .menu-body { margin-top: 0; gap: 0; }
dialog.sheet .menu-list { gap: 0; }
dialog.sheet .menu-list + .menu-list { position: relative; margin-top: 16px; padding-top: 4px; }
dialog.sheet .menu-list > a { position: relative; background: transparent; border-radius: 0; padding: 12px 4px; }
dialog.sheet .menu-list > a + a::before, dialog.sheet .menu-list + .menu-list::before { content: ''; position: absolute; top: 0; left: 38px; right: 0; height: 1px; background: var(--line); }
dialog.sheet .menu-out > a, dialog.sheet .menu-confirm > summary { padding: 14px 4px; }
.menu-confirm > summary {
    display: flex; align-items: center; gap: 12px;
    padding: 14px 16px; border-radius: 16px; background: var(--surface);
    color: var(--muted); font-size: 1rem; font-weight: 500;
    list-style: none; cursor: pointer;
}
dialog.sheet .menu-confirm > summary { background: transparent; border-radius: 0; }
.menu-confirm > summary::-webkit-details-marker { display: none; }
.menu-confirm[open] > summary { display: none; }
.menu-confirm-body { margin-top: 8px; padding: 14px 16px; border-radius: 16px; background: var(--warm-bg); }
.menu-confirm-body p { margin: 0; font-size: .9375rem; line-height: 1.45; color: var(--ink); text-wrap: pretty; }
.menu-confirm-acts { display: flex; align-items: center; gap: 16px; margin-top: 12px; }
.menu-confirm-acts .button { flex: 1; min-height: 48px; border-radius: 14px; }
.menu-confirm-acts .side { position: relative; flex: none; font-size: .9375rem; font-weight: 500; color: var(--muted); text-decoration: none; }
.menu-confirm-acts .side::after { content: ''; position: absolute; inset: -14px -8px; }
.group { display: flex; flex-direction: column; gap: 10px; margin-top: 28px; }
.group[hidden], .row[hidden] { display: none; }
.group-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 0 4px; }
.group h2 { margin: 0; color: var(--muted); }
.group-hot h2 { color: var(--hot); }
.group-soon h2 { color: var(--accent-ink); }
.group-warm h2 { color: var(--warm); }
.group-head-loud { align-items: baseline; }
.group-head-loud h2 {
    font-size: 1rem; line-height: 1.3; letter-spacing: -.01em;
    text-transform: none;
}
.group-calm .group-head-loud h2 { color: var(--ink); }
.group-head-loud .pill {
    background: none; padding: 0;
    font-size: 1rem; line-height: 1.3; font-weight: 600;
    color: inherit;
}
.group-hot .group-head-loud .pill { color: var(--hot); }
.group-soon .group-head-loud .pill { color: var(--accent-ink); }
.group-warm .group-head-loud .pill { color: var(--warm); }
.group-calm .group-head-loud .pill { color: var(--muted); }
.group-rule { display: flex; align-items: center; gap: 8px; margin: -4px 0 0; padding: 0 4px; font-size: .8125rem; line-height: 1.4; color: var(--muted); }
.group-rule i { flex: none; width: 10px; height: 10px; border-radius: 999px; background: var(--bead-shine-soft), linear-gradient(var(--accent-soft), var(--accent-soft)), var(--ground); }
.pill {
    font-size: .75rem;
    padding: 1px 7px;
    border-radius: 999px;
    background: var(--chip-bg);
    color: var(--muted);
    font-weight: 400;
}
.group-note { font-size: .8125rem; line-height: 1.4; color: var(--faint); padding: 0 4px; margin-top: -6px; }
.group-head .more {
    margin: -13px 0 -13px auto; padding: 13px 0 13px 12px;
    text-decoration: none;
}
.group.shut > .group-note, .group.shut > .rows, .group.shut > .list { display: none; }
.group:not(.shut) .shut-more { display: none; }
.shut-chev { display: none; }
.shelf { display: flex; flex-direction: column; margin-top: 28px; border-radius: 18px; background: var(--surface); overflow: hidden; }
.shelf:not(:has(> .group:not([hidden]))) { display: none; }
.shelf > .group { position: relative; margin-top: 0; gap: 0; border-top: 1px solid var(--line-soft); }
.shelf > .group:nth-child(1 of :not([hidden])) { border-top: 0; }
.shelf > .group:has(.shut-more:active) { background: var(--press); }
.shelf .group-head { flex-wrap: nowrap; gap: 10px; min-height: 48px; padding: 0 16px; }
.shelf .group h2 { flex: 1; font-size: .9375rem; line-height: 1.3; font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--ink); }
.shelf .group:not(.shut) h2 { font-weight: 600; }
.shelf [data-group="closed"] h2 { color: var(--muted); }
.shelf [data-group="drafts"] h2::after { content: ''; display: inline-block; width: 7px; height: 7px; margin-left: 8px; border-radius: 999px; background: var(--warm); vertical-align: 2px; }
.shelf .group-head .pill { background: none; padding: 0; font-size: .9375rem; line-height: 1.3; color: var(--muted); }
.shelf :is(.shut-more, .shut-less) { margin: 0; padding: 0; color: var(--chevron); font-weight: 600; }
.shelf .shut-more::after { content: ''; position: absolute; inset: 0; }
.shelf .shut-less { position: relative; }
.shelf .shut-less::after { content: ''; position: absolute; inset: -12px -16px -12px -40px; }
.shelf .shut-less .shut-chev { display: inline-block; transform: rotate(90deg); }
.shelf .shut-word { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.shelf .shut-chev { display: inline; }
.shelf > .group > .group-note { margin: -6px 0 0; padding: 0 16px 10px; }
.shelf > .group > .rows { border-radius: 0; }
.shelf > .group > .rows > .row:first-child { border-top: 1px solid var(--line-soft); }
.group.clip > .rows > .row:nth-child(n+6) { display: none; }
.group:not(.clip):not(.share) .row-more { display: none; }
.row-more { border-top: 1px solid var(--line-soft); }
.row-more a {
    display: flex; align-items: center; gap: 6px;
    min-height: 44px; padding: 0 16px;
    text-decoration: none;
}
.row-more a:active { background: var(--press); border-radius: 0 0 18px 18px; }
.row-more i { font-style: normal; }
.group-head h2 a {
    display: inline-flex; align-items: center;
    min-height: 44px; margin: -14px 0;
    color: inherit;
    text-decoration: underline;
    text-decoration-color: var(--chevron);
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}
.group-head h2 a:active { color: var(--ink); }
.rows { list-style: none; margin: 0; padding: 0; background: var(--surface); border-radius: 18px; }
.rows.drafts { background: var(--draft-bg); }
.row { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 12px 16px; border-top: 1px solid var(--line-soft); }
.row:first-child { border-top: 0; }
.row-closed .row-text { color: var(--muted); }
.row-closed .row-meta, .row-closed .row-meta .when { color: var(--faint); }
.row-held { display: none; }
.row-text {
    font-size: 1rem; line-height: 1.4; font-weight: 500;
    color: var(--ink);
    text-decoration: none;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.rows:not(.drafts) .row-text::after { content: ''; position: absolute; inset: 0; }
.row:has(form.fill) .row-text::after { content: none; }
.rows:not(.drafts) .row:has(.row-text:active) { background: var(--press); }
.rows:not(.drafts) .row:first-child:has(.row-text:active) { border-radius: 18px 18px 0 0; }
.rows:not(.drafts) .row:last-child:has(.row-text:active) { border-radius: 0 0 18px 18px; }
.rows:not(.drafts) .row:only-child:has(.row-text:active) { border-radius: 18px; }
.row-why { font-size: .9375rem; line-height: 1.45; color: var(--muted); }
.row:has(> .row-go) { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "text go" "meta meta"; align-items: center; gap: 4px 12px; padding-right: 12px; }
.row:has(> .row-go) > .row-text { grid-area: text; }
.row:has(> .row-go) > .row-meta { grid-area: meta; }
.row-go { grid-area: go; position: relative; }
.row-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 0; font-size: .8125rem; line-height: 1.4; color: var(--muted); }
.row-meta > * + *::before { content: '·'; display: inline-block; margin: 0 6px; color: var(--faint); font-weight: 400; text-decoration: none; }
.row-who { flex: 1 1 0; min-width: 3em; max-width: max-content; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.row-who:has(> .ava) { display: flex; align-items: center; gap: 6px; }
.row-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.row-project { flex: 1 1 0; min-width: 0; max-width: max-content; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.row-meta:has(> .row-project) > .row-who { flex: none; max-width: 100%; }
.row-meta:has(> .row-move) > .row-project { display: none; }
.row-meta :is(.when, .state, .row-move) { flex: none; white-space: nowrap; }
.row-meta .when.hot, .row-meta .when.soon, .row-meta .when.warm { font-weight: 600; }
.row-act { position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.row-act > :last-child:not(:first-child) { margin-left: auto; }
.row-meta .state { color: var(--muted); }
.go {
    position: relative;
    flex: none;
    border: 0;
    background: var(--quiet-bg);
    color: var(--accent-ink);
    cursor: pointer;
}
.go:active { filter: brightness(.92); }
.row-move {
    position: relative;
    flex: none;
    font-size: .8125rem; line-height: 1.4;
    color: var(--muted);
    text-decoration: underline;
    text-decoration-color: var(--chevron);
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}
.row-move::after { content: ''; position: absolute; inset: -13px -5px -13px -16px; }
.row-move:active { color: var(--ink); }
.go::after { content: ''; position: absolute; inset: -4px; }
.row-answers { position: relative; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 7rem), 1fr)); gap: 8px 16px; }
.row-answers .go { width: 100%; }
.row-leaving { opacity: 0; transform: scale(.96); transition: opacity .2s, transform .2s; }
.go.marked {
    width: 36px; padding: 0;
    display: inline-flex; align-items: center; justify-content: center;
    overflow: hidden; white-space: nowrap;
    background: var(--ok); color: var(--on-ok);
}
.go.marked .mark-label { position: absolute; opacity: 0; }
.row:has(> .row-go .tick) { grid-template-areas: "text go" "meta go"; }
.row-go:has(> .tick) { display: flex; }
.go.tick { width: 30px; min-height: 30px; height: 30px; margin: 0; padding: 0; box-sizing: border-box; border: 2px dashed color-mix(in srgb, var(--accent-ink) 72%, var(--surface)); background: var(--surface); }
.go.tick::after { inset: -7px; }
.go.tick.marked { width: 30px; border-color: transparent; background: var(--bead-shine), var(--thread-bead); box-shadow: 0 0 0 4px var(--accent-bg); }
.go.tick.marked .mark { display: none; }
.row-done .row-text { color: var(--muted); transition: color .26s .32s; }
.row-done .row-meta .when { color: var(--faint); transition: color .26s .32s; }
.row-done .row-move { opacity: 0; pointer-events: none; transition: opacity .2s .28s; }
.ask-more {
    display: flex; flex-direction: column; gap: 8px;
    margin-top: 20px; padding: 14px 16px;
    border: 1.5px dashed var(--accent-soft); border-radius: 18px;
    color: var(--muted); text-decoration: none;
}
.ask-more:active { background: var(--press); }
.ask-more-title { font-size: 1rem; line-height: 1.4; font-weight: 500; color: var(--ink); }
.ask-more-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: .8125rem; line-height: 1.4; }
.ask-more .go { display: inline-flex; align-items: center; }
@keyframes pillTick {
    50% { transform: scale(1.18); }
}
.pill-tick { animation: pillTick .3s cubic-bezier(.2, .8, .2, 1); }
.fill { display: flex; flex-direction: column; gap: 14px; margin-top: 4px; }
.choice { display: flex; flex-wrap: wrap; gap: 6px; }
.choice > input, :is(.form, .fill) .choice > input {
    position: absolute; opacity: 0; pointer-events: none;
    width: 0; height: 0; padding: 0; border: 0;
}
.choice label {
    display: inline-flex; align-items: center; gap: 6px;
    min-height: 44px; padding: 0 14px;
    border-radius: 999px;
    border: 1px solid var(--field-border);
    background: var(--surface);
    color: var(--ink);
    font-size: .9375rem; line-height: 1.2;
    cursor: pointer;
}
.choice label:active { background: var(--press); }
.choice input:checked + label {
    border-color: transparent;
    background: var(--accent-bg);
    color: var(--accent-ink);
    font-weight: 600;
}
.choice input:checked + label::before { content: '✓'; }
.choice input:focus-visible + label { outline: 2px solid var(--accent-ink); outline-offset: 2px; }
.cal { margin-top: 14px; padding: 6px 6px 10px; border-radius: 20px; background: var(--surface); }
.cal > .bar { min-height: 44px; margin-top: 0; padding-left: 6px; }
.cal .bar .roundbtn { width: 40px; height: 40px; background: none; color: var(--muted); }
.cal .bar .roundbtn:active { background: var(--press); }
.week { margin-top: 2px; }
.week-pane, .drafts-fold {
    display: grid; grid-template-rows: 1fr;
    transition: grid-template-rows .38s cubic-bezier(.45, 0, .2, 1), opacity .24s ease-out .1s, visibility 0s;
}
.week-month, .cal.open .week-strip, .seeking .week-pane, .seeking .cal.open .week-month, .seeking .drafts-fold {
    grid-template-rows: 0fr; opacity: 0; visibility: hidden;
    transition: grid-template-rows .38s cubic-bezier(.45, 0, .2, 1), opacity .14s ease-out, visibility 0s linear .38s;
}
.cal.open .week-month {
    grid-template-rows: 1fr; opacity: 1; visibility: visible;
    transition: grid-template-rows .38s cubic-bezier(.45, 0, .2, 1), opacity .24s ease-out .1s, visibility 0s;
}
.week-in { min-height: 0; overflow: hidden; margin: 0 -4px; padding: 0 4px; }
.cal-strip, .cal-grid {
    display: grid; grid-template-columns: repeat(7, minmax(0, 1fr));
    list-style: none; margin: 0; padding: 0;
    container-type: inline-size;
}
.cal-day {
    display: flex; flex-direction: column; align-items: center; gap: 2px;
    padding: 5px 0 6px;
    border-radius: 14px;
    color: var(--ink);
    text-decoration: none;
}
.cal-wd { font-size: min(.75rem, 6.5cqi); line-height: 1.2; color: var(--muted); }
.cal-num {
    position: relative;
    display: flex; align-items: center; justify-content: center;
    width: min(32px, 100%); aspect-ratio: 1;
    border-radius: 999px;
    font-size: min(1rem, 9cqi); line-height: 1; font-weight: 600;
}
.cal-dots { display: flex; align-items: center; justify-content: center; gap: 3px; height: 7px; }
.cal-dots i, .cal-legend i { display: block; flex: none; width: 6px; height: 6px; border-radius: 999px; background: var(--muted); }
.cal-dots .hot { width: 7px; height: 7px; background: var(--hot); }
.cal-dots .soon { width: 7px; height: 7px; background: var(--accent-ink); }
.cal-dots .ask, .cal-legend .ask { width: 7px; height: 7px; background: none; box-shadow: inset 0 0 0 2px var(--warm); }
.cal-day.today { background: var(--accent-bg); }
.cal-day.today .cal-num { color: var(--accent-ink); font-weight: 700; }
.cal-day.today .cal-wd { color: var(--accent-ink); font-weight: 600; }
.cal-day.on .cal-num { background: var(--accent); color: var(--on-accent); }
.cal-day:active .cal-num { background: var(--press); }
.cal-day.on:active .cal-num { background: var(--accent); filter: brightness(.92); }
button.cal-day { width: 100%; border: 0; background: none; font: inherit; cursor: pointer; }
.cal-day.was:not(.on) .cal-num { box-shadow: inset 0 0 0 2px var(--chevron); }
.cal-was { margin-top: -2px; font-size: .75rem; line-height: 1.2; color: var(--muted); }
.cal-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.cal-title { margin: 0; font-size: 1rem; line-height: 1.3; font-weight: 600; }
.cal-go { display: flex; gap: 8px; }
.cal-next { display: block; transform: rotate(180deg); }
.cal-wds {
    display: grid; grid-template-columns: repeat(7, minmax(0, 1fr));
    margin-bottom: 4px;
    font-size: .75rem; line-height: 1.3; text-align: center; color: var(--muted);
}
.cal-grid .cal-day { height: 50px; padding: 3px 0 0; gap: 4px; }
.cal-grid .cal-num { width: min(34px, 100%); font-size: min(1rem, 9cqi); font-weight: 500; }
.cal-day.past:not(.today, .on) .cal-num { color: var(--muted); }
.cal-day.outside { opacity: .32; }
.cal-legend {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 2px 4px;
    margin-top: 8px;
    font-size: .75rem; line-height: 1.3; color: var(--faint);
}
.cal-legend i { margin-left: 4px; }
.cal-legend i:first-child { margin-left: 0; }
.week-toggle {
    display: inline-flex; align-items: center; gap: 4px;
    min-height: 44px; padding-left: 4px;
    font-size: 1rem; line-height: 1.3; font-weight: 600;
    color: var(--ink); text-decoration: none;
}
.week-toggle:active { color: var(--muted); }
.week-toggle .ic { color: var(--chevron); transform: rotate(-90deg); transition: transform .34s cubic-bezier(.2, .8, .2, 1); }
.cal.open .week-toggle .ic { transform: rotate(90deg); }
.cal:not(.open) .week-name-month, .cal.open .week-name-strip { display: none; }
.week .cal-head { justify-content: flex-end; }
.week .cal-title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
dialog.sheet form.quick { display: flex; flex-direction: column; gap: 12px; }
dialog.sheet form[hidden] { display: none; }
.quick-tabs { margin-bottom: 16px; }
.quick-kept { margin: -6px 0 10px; font-size: .8125rem; color: var(--muted); }
.quick-kept button { position: relative; padding: 0; border: 0; background: none; font: inherit; font-weight: 500; color: var(--accent); cursor: pointer; }
.quick-kept button::after { content: ''; position: absolute; inset: -12px -8px; }
.quick-line {
    width: 100%;
    min-height: 92px; padding: 14px 16px;
    border: 1px solid var(--input-border); border-radius: 16px;
    background: var(--surface); color: var(--ink);
    font: inherit; font-size: 1rem; line-height: 1.45;
    resize: none;
}
.quick-preview { display: flex; flex-direction: column; gap: 12px; }
.quick-preview:empty { display: none; }
.chips-quick { display: flex; flex-wrap: wrap; gap: 8px; }
.qchip {
    position: relative;
    display: inline-flex; align-items: center;
    min-height: 44px; padding: 0 14px;
    border-radius: 999px;
    border: 1px solid transparent;
    background: var(--accent-bg);
    color: var(--accent-ink);
    font-size: .9375rem; font-weight: 500;
    cursor: pointer;
}
.chips-quick .qchip select, .chips-quick .qchip input {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    opacity: 0;
    border: 0; padding: 0;
    font-size: 1rem;
    cursor: pointer;
}
.qchip-ask { background: var(--warm-bg); color: var(--warm); }
.qchip-type { gap: 6px; cursor: text; }
.qchip-type input:not([type="hidden"]) {
    position: static;
    width: auto; min-width: 4ch; height: auto;
    field-sizing: content;
    opacity: 1;
    background: transparent; color: inherit;
    font: inherit; font-size: 1rem;
    outline: none;
    cursor: text;
}
.qchip-type input::placeholder { color: inherit; opacity: 1; }
.qchip-type:focus-within { border-color: currentColor; }
.chips-quick .qchip-type input:focus { border-color: transparent; box-shadow: none; }
.qchip-soft {
    background: transparent;
    border: 1px solid var(--field-border);
    color: var(--muted);
    font-weight: 400;
}
.qchip-field {
    flex: 1 0 100%;
    gap: 10px;
    min-height: 48px; padding: 0 16px;
    border-radius: 14px;
    border: 1px solid var(--input-border);
    background: var(--surface);
    color: var(--ink);
    font-weight: 400;
}
.qchip-field .ic { flex: none; color: var(--faint); }
.qchip-field input:not([type="hidden"]) { flex: 1; min-width: 0; field-sizing: fixed; }
.qchip-field input::placeholder { color: var(--faint); }
.qchip-field.bad, .qchip-field.bad:focus-within { border-color: var(--hot); box-shadow: 0 0 0 3px var(--hot-bg); }
.qchip-field.bad .ic { color: var(--err-ink); }
.quick-tie { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.quick-tie-ask { flex-basis: 100%; font-size: .8125rem; line-height: 1.45; color: var(--muted); }
.qpill {
    position: relative;
    display: inline-flex; align-items: center; gap: 8px;
    min-height: 44px; padding: 0 14px 0 8px;
    border-radius: 999px;
    border: 1px solid var(--field-border);
    background: transparent;
    color: var(--ink);
    font-size: .9375rem; font-weight: 500;
    cursor: pointer;
}
.qpill-soft { padding: 0 14px; color: var(--muted); font-weight: 400; }
.qpill-new { padding: 0 12px 0 14px; color: var(--accent-ink); border-color: var(--accent-soft); }
.qpill-edit { display: inline-flex; padding-left: 10px; border-left: 1px solid var(--accent-soft); }
.quick-choices { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }
.quick-choices .qpill { padding: 0 16px; font: inherit; font-size: .9375rem; font-weight: 500; }
.quick-usual { align-self: center; font-size: .8125rem; color: var(--muted); }
.quick-tie .qpill input, .quick-tie .qpill select {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    margin: 0; padding: 0; border: 0;
    opacity: 0;
    font-size: 1rem;
    cursor: pointer;
}
.qpill:active { background: var(--press); }
.qpill:focus-within { border-color: currentColor; }
.quick-tie .qpill:has(input:checked),
.quick-tie .qpill-soft:has(option:checked:not([value=""])) {
    background: var(--accent-bg);
    border-color: transparent;
    color: var(--accent-ink);
}
.quick-hint { font-size: .8125rem; line-height: 1.45; color: var(--faint); margin: 0; }
.quick-hint.quick-need { color: var(--err-ink); }
.qchip-ask.bad { border-color: var(--hot); }
.quick-preview .quick-switch { margin-top: -8px; }
.quick-switch a { position: relative; margin-right: 10px; font-weight: 500; text-decoration: none; white-space: nowrap; }
.quick-switch a::after { content: ''; position: absolute; inset: -12px -5px; }
.quick-switch a:active { color: var(--ink); }
.quick-page { display: flex; flex-direction: column; gap: 12px; margin-top: 20px; }
.quick-page > .form { margin-top: 8px; }
dialog.sheet .quick-page { margin-top: 0; }
dialog.sheet .quick-page .submit { flex: none; min-height: 52px; border-radius: 16px; }
dialog.sheet .quick-page > .form:not(:has(> :not([hidden]))) { display: none; }
.quick-more {
    display: flex; flex-direction: column; align-items: flex-start; gap: 2px;
    width: 100%; padding: 12px 16px;
    border: 1.5px dashed var(--accent-soft); border-radius: 18px; background: none;
    font: inherit; text-align: left; color: var(--accent-ink); cursor: pointer;
}
.quick-more[hidden] { display: none; }
.quick-more:active { background: var(--press); }
.quick-more span { font-size: .9375rem; font-weight: 500; }
.quick-more small { font-size: .8125rem; line-height: 1.4; color: var(--muted); }
dialog.sheet .quick-page .form-part h2 { font-size: .75rem; font-weight: 600; margin: 0; }
.reschedule { display: flex; flex-direction: column; gap: 16px; margin-top: 20px; }
dialog.sheet form.reschedule { flex-wrap: nowrap; gap: 16px; }
dialog.sheet form.fix-form { flex-wrap: nowrap; gap: 14px; }
:is(.reschedule, .move-note) .field { display: flex; flex-direction: column; gap: 8px; }
:is(.reschedule, .move-note) .field-name { font-size: .8125rem; line-height: 1.4; font-weight: 500; color: var(--muted); }
.reschedule .field-name i { font-style: normal; color: var(--faint); font-weight: 400; }
:is(.reschedule, .move-note) .why {
    width: 100%;
    height: 48px; padding: 0 14px;
    border: 1px solid var(--input-border); border-radius: 14px;
    background: var(--surface); color: var(--ink);
    font: inherit; font-size: 1rem;
}
.say {
    margin: 0;
    padding: 12px 14px;
    border-left: 3px solid var(--accent-bg);
    background: var(--surface);
    border-radius: 0 12px 12px 0;
    font-size: .9375rem; line-height: 1.45;
    color: var(--ink);
    user-select: all;
}
.say i { font-style: normal; font-weight: 600; }
.day-card .say, .move-note .say { background: var(--ground); }
.reschedule .sheet-acts { margin-top: 0; }
.sheet-acts.move-acts { flex-direction: column; }
.sheet-acts.move-acts .button { flex: none; }
.sheet-acts.move-acts .button[hidden], :is(.reschedule, .move-note) .field[hidden] { display: none; }
.move-same { margin: 4px 0 0; font-size: .8125rem; line-height: 1.4; color: var(--muted); }
.fill .line { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.fill .line .hint { font-size: .8125rem; line-height: 1.4; color: var(--faint); }
.quick-pick .qpill { padding: 0 16px; }
.fill-left { margin: 0; font-size: .8125rem; line-height: 1.45; color: var(--muted); }
.fill-left b { font-weight: 600; color: var(--warm); }
.fill .fill-go { align-self: flex-end; }
dialog.sheet .fill .fill-go, .fill .button.fill-go { align-self: stretch; min-height: 52px; padding: 6px 12px; border-radius: 16px; font-size: 1rem; }
.fill-not { display: inline-block; margin-top: 8px; font-size: .8125rem; color: var(--faint); text-decoration: none; }
dialog.sheet .fill-not { display: none; }
dialog.sheet .rows.drafts .row-text { font-size: 1rem; -webkit-line-clamp: 3; }
.sheet-tail { display: block; margin-top: 4px; padding: 10px 0; text-align: center; font-size: .9375rem; color: var(--muted); text-decoration: none; }
.sheet-tail[hidden] { display: none; }
.not-quote { margin-top: 20px; }
.not-ways { display: flex; flex-direction: column; align-items: stretch; gap: 10px; margin-top: 24px; }
.not-ways .caption { margin: 0 4px; }
.not-delete { align-self: center; margin-top: 18px; font-size: .9375rem; }
.fix {
    flex: none;
    border: 0;
    background: var(--accent);
    color: var(--on-accent);
    cursor: pointer;
}
.fix:active { filter: brightness(.92); }
.drafts-call {
    position: relative;
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    margin-top: 16px;
    padding: 10px 14px;
    border-radius: 16px;
    background: var(--warm-bg);
    color: var(--warm-ink);
    font-size: .8125rem; line-height: 1.4; font-weight: 500;
    text-decoration: none;
}
.drafts-call::after { content: ''; position: absolute; inset: -3px 0; }
.drafts-say { flex: 1; min-width: 0; }
.drafts-call::before { content: ''; flex: none; width: 7px; height: 7px; border-radius: 999px; background: var(--warm); }
a.drafts-call { gap: 8px; }
a.drafts-call .drafts-go { flex: none; margin-left: 4px; color: inherit; }
.drafts-call:active { filter: brightness(.92); }
a.drafts-call { margin-top: 12px; }
a.drafts-call + .group { margin-top: 20px; }
.drafts-pile > summary { list-style: none; cursor: pointer; }
.drafts-pile > summary::-webkit-details-marker { display: none; }
.drafts-pile .one-body { margin-top: 12px; }
.drafts-pile .drafts-call {
    margin-top: 24px; padding: 14px 4px; border-radius: 0;
    background: none; color: var(--ink); font-weight: 500;
    border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
}
.drafts-pile .drafts-call::before { content: ''; flex: none; width: 8px; height: 8px; border-radius: 999px; background: var(--warm); }
.drafts-pile .drafts-say { flex: 1; }
.drafts-go { flex: none; color: var(--accent-ink); }
.drafts-pile .drafts-call:active { filter: none; background: var(--press); }
.flash { border-radius: 18px; padding: 12px 14px; font-size: .9375rem; line-height: 1.45; margin-top: 16px; }
.flash-success { background: var(--ok-bg); color: var(--ok); }
.flash-error { background: var(--hot-bg); color: var(--err-ink); }
.flash-undo { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.flash-undo form { margin: 0; }
.flash-undo > span { min-width: 0; overflow-wrap: anywhere; }
.flash-undo > form, .flash-undo > .flash-link { flex: none; }
.flash-done {
    position: relative;
    display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 16px; align-items: center;
    animation: undoIn .24s cubic-bezier(.2, .8, .2, 1) both;
}
.flash-done > span:first-child { font-weight: 600; }
.flash-done > .flash-title { grid-row: 2; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.flash-done > form { grid-column: 2; grid-row: 1 / span 2; }
.flashes-below {
    position: fixed; z-index: 11; left: 16px; right: 16px;
    bottom: calc(env(safe-area-inset-bottom) + 94px);
    max-width: calc(34rem - 32px); margin: 0 auto;
    pointer-events: none;
}
.flashes-below > * { margin: 0; pointer-events: auto; }
.flashes-below > .flash-success { background: linear-gradient(var(--ok-bg), var(--ok-bg)), var(--surface); }
:root.went-done .flash-done { animation-delay: .86s; }
:root.went-done .one-flashes .flash-done { animation-delay: .42s; }
.flash-act {
    position: relative;
    border: 0; padding: 0; background: transparent;
    font: inherit; font-size: .9375rem; font-weight: 600; color: var(--ok);
    cursor: pointer;
}
.flash-act::after { content: ''; position: absolute; inset: -12px -10px; }
.flash-act:active { color: var(--ink); }
.flash-done .flash-act:active, .undo .flash-act:active { color: #fff; }
.flash-link { position: relative; font-weight: 600; color: inherit; text-decoration: none; }
.flash-link::after { content: ''; position: absolute; inset: -12px -6px; }
.flash-link:active { color: var(--ink); }
.flash-tell { margin: 8px 4px 0; text-align: right; font-size: .9375rem; line-height: 1.4; }
.flash-tell a { position: relative; font-weight: 500; color: var(--muted); text-decoration: none; }
.flash-tell a::after { content: ''; position: absolute; inset: -12px -6px; }
.flash-tell a:active { color: var(--ink); }
.day-all:active { color: var(--ink); }
a.day-quote:active, .one-quote a:active { background: var(--press); box-shadow: 0 0 0 6px var(--press); }
.undo {
    position: fixed; z-index: 11;
    left: 16px; right: 16px;
    bottom: calc(env(safe-area-inset-bottom) + 94px);
    max-width: calc(34rem - 32px);
    margin: 0 auto;
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
    padding: 12px 16px;
    border-radius: 18px;
    background: linear-gradient(var(--ok-bg), var(--ok-bg)), var(--surface);
    color: var(--ok);
    font-size: .9375rem; line-height: 1.45;
    animation: undoIn .24s cubic-bezier(.2, .8, .2, 1) both;
}
.undo[hidden] { display: none; }
.undo-say { min-width: 0; display: flex; flex-direction: column; }
.undo-say b { font-weight: 600; }
.undo-say span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.undo { flex-wrap: wrap; }
.undo-say { flex: 1; }
.undo-note { position: relative; flex-basis: 100%; margin-top: -6px; padding: 0; border: 0; background: none; font: inherit; font-size: .9375rem; color: var(--muted); text-align: left; cursor: pointer; }
.undo-note::after { content: ''; position: absolute; inset: -10px -6px; }
.undo-note[hidden], .undo-field[hidden] { display: none; }
.undo-field { flex-basis: 100%; display: flex; align-items: flex-end; gap: 8px; }
.undo-field textarea { flex: 1; min-height: 44px; padding: 8px 10px; border: 1px solid var(--input-border); border-radius: 14px; background: var(--surface); color: var(--ink); font: inherit; font-size: .9375rem; resize: none; }
body.screen-task .undo { bottom: calc(env(safe-area-inset-bottom) + 16px); }
@keyframes undoIn { from { opacity: 0; transform: translateY(8px); } }
.undo-drain {
    position: absolute; left: 16px; right: 16px; bottom: 5px;
    height: 2px; border-radius: 1px;
    background: currentColor; opacity: .3;
    transform-origin: left center;
}
.undo-drain[hidden] { display: none; }
.flash-done, .flashes-below > .flash-done, .undo { background: var(--night); color: #f6f0f8; box-shadow: 0 10px 30px rgba(42, 31, 48, .28); }
.flash-done .flash-act, .undo .flash-act { color: var(--bead); }
.flash-done .flash-title, .undo-say span, .undo .undo-note { color: rgba(246, 240, 248, .72); }
.flash-done.grew, .undo.grew { padding-left: 42px; }
.flash-done.grew::before, .undo.grew::before { content: ''; position: absolute; left: 16px; top: 16px; width: 14px; height: 14px; border-radius: 999px; background: radial-gradient(circle at 35% 30%, rgba(255, 255, 255, .55), rgba(255, 255, 255, 0) 60%), var(--bead); }
:root[data-theme="dark"] :is(.flash-done, .undo) { background: #35283c; box-shadow: inset 0 0 0 1px rgba(201, 168, 216, .22), 0 10px 30px rgba(0, 0, 0, .4); }
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) :is(.flash-done, .undo) { background: #35283c; box-shadow: inset 0 0 0 1px rgba(201, 168, 216, .22), 0 10px 30px rgba(0, 0, 0, .4); }
}
.offline {
    position: fixed; z-index: 12;
    inset: auto 16px calc(env(safe-area-inset-bottom) + 94px);
    width: auto; height: auto; max-width: calc(34rem - 32px);
    margin: 0 auto;
    padding: 12px 16px;
    border: 0; border-radius: 18px;
    background: var(--ink); color: var(--surface);
    font-size: .9375rem; line-height: 1.45; font-weight: 500;
    overflow: visible;
    animation: undoIn .24s cubic-bezier(.2, .8, .2, 1) both;
}
.offline[hidden] { display: none; }
body:not(.screen-tab):not(.has-bar) .offline { bottom: calc(env(safe-area-inset-bottom) + 22px); }
body:has(dialog.sheet[open]) .offline { top: calc(env(safe-area-inset-top) + 12px); bottom: auto; }
.undo.saved { align-items: flex-start; row-gap: 10px; }
.saved .undo-say b { overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.saved-acts { flex-basis: 100%; min-width: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.saved-chip {
    position: relative;
    display: inline-flex; align-items: center;
    min-height: 32px; max-width: 100%; padding: 0 12px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--bead) 16%, transparent);
    color: var(--bead);
    font-size: .8125rem; font-weight: 600; text-decoration: none;
}
.saved-chip span { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.saved-chip::after { content: ''; position: absolute; inset: -6px -4px; }
.saved-chip:active { background: color-mix(in srgb, var(--bead) 28%, transparent); }
body.screen-tab:has(.undo.saved:not([hidden])) main { padding-bottom: calc(env(safe-area-inset-bottom) + 210px); }
.fix-form { display: flex; flex-direction: column; gap: 14px; }
.fix-form .sheet-acts { margin-top: 4px; }
.fix-form .sheet-acts .button { width: 100%; }
.fix-quote { margin: 0; font-size: .9375rem; line-height: 1.45; color: var(--muted); white-space: pre-wrap; overflow-wrap: anywhere; }
.warn { background: var(--surface); color: var(--muted); border-radius: 18px; padding: 12px 16px; font-size: .9375rem; line-height: 1.45; }
.warn b { font-weight: 600; color: var(--warm); }
.bot-silent { margin-top: 16px; }
.empty {
    margin-top: 40px;
    background: var(--surface);
    border-radius: 18px;
    padding: 28px 24px;
    display: flex; flex-direction: column; gap: 14px;
}
.empty h2 { margin: 0; font-size: 1.25rem; line-height: 1.3; font-weight: 600; letter-spacing: -.01em; }
.empty p { font-size: .9375rem; line-height: 1.5; color: var(--muted); }
.empty p.empty-hint { margin-top: 2px; font-size: .8125rem; line-height: 1.4; color: var(--faint); text-wrap: balance; }
.sample { display: block; margin-top: 28px; }
.sample > .sample-mark { display: block; margin: 0 4px 6px; }
.sample .rows, .sample .faces { background: var(--ground); box-shadow: inset 0 0 0 1px var(--field-border); }
.sample .faces { border-radius: 18px; padding: 4px 8px; }
.sample .row { border-top-color: var(--field-border); }
.sample-reason {
    display: flex; flex-direction: column; gap: 8px;
    margin-top: 12px; padding: 14px;
    border-radius: 18px; background: var(--ground); box-shadow: inset 0 0 0 1px var(--field-border);
}
.sample-reason .day-label { margin: 0; text-align: center; }
.sample-reason .say { margin: 0; }
.sample .row:first-child { border-top: 0; }
.sample :is(.go, .row-move, .drafts-call) { pointer-events: none; }
.sample span.go { display: inline-flex; align-items: center; justify-content: center; }
.sample .group { margin-top: 20px; }
.list-sample .drafts-call { margin-top: 0; }
.sample .group-note.sample-after { margin-top: 8px; }
.sample .faces { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 8px; }
.sample-note { margin: 8px 4px 0; font-size: .8125rem; line-height: 1.4; color: var(--muted); }
.sample .day-card { margin-top: 12px; }
.day-label.day-draft { color: var(--warm-ink); }
.draft-days .day-note { margin-top: 12px; }
.draft-days .cal-strip { margin: 8px -6px 0; }
.comeback-earlier { margin-top: -10px; }
.comeback-day > summary { list-style: none; font-size: .9375rem; line-height: 1.45; color: var(--muted); text-align: center; cursor: pointer; }
.comeback-day > summary::-webkit-details-marker { display: none; }
.comeback-pick b { font-weight: 500; color: var(--accent-ink); }
.comeback-day[open] .comeback-pick { display: none; }
.comeback-day .cal-strip { margin: 10px -6px 0; }
.quick-days-warm { margin: 0 -8px; padding: 8px 8px 4px; border-radius: 16px; background: var(--warm-bg); }
.quick-days-say { margin: 0 4px 6px; font-size: .8125rem; line-height: 1.4; font-weight: 500; color: var(--warm-ink); }
.sample .row-text { font-size: 1rem; line-height: 1.4; font-weight: 500; color: var(--ink); }
.sample .row-text::after { content: none; }
.sample-head {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    font-size: .8125rem; line-height: 1.4; color: var(--faint); padding: 0 4px;
}
.sample-mark {
    font-size: .75rem; line-height: 1.3;
    color: var(--faint);
}
.button {
    display: flex; align-items: center; justify-content: center;
    width: 100%; min-height: 52px; padding: 6px 12px;
    text-align: center; line-height: 1.2; text-wrap: balance;
    border: 0; border-radius: 16px;
    background: var(--accent);
    color: var(--on-accent);
    font-size: 1rem; font-weight: 600;
    text-decoration: none;
    cursor: pointer;
}
.button:active { filter: brightness(.92); }
.button[hidden] { display: none; }
.filters .button, dialog.sheet .button, .rev-acts-row .button,
.button.day-go, .button.one-ask, .button.quiet,
.talk-card .button, .note-add-acts .button, .botcard .button, .row-answers .go,
.invite-card .button.ghost, .invite-new .button.submit, .channel-say .button, .ask-push .button, .oops-acts .button.ghost { min-height: 48px; border-radius: 14px; }
.go, .fix, .button.tour-ok, .ws-tail .rev-acts-row .button { min-height: 36px; padding: 4px 16px; border-radius: 999px; font-size: .9375rem; font-weight: 600; }
.button.ghost { background: var(--quiet-bg); color: var(--accent-ink); }
.button.quiet { background: var(--surface); color: var(--muted); font-size: .9375rem; font-weight: 500; }
.button.quiet:active { background: var(--press); filter: none; transform: none; }
.button[data-count-target]:disabled, .move-acts .button:disabled { background: var(--chip-bg); color: var(--muted); cursor: default; }
.button[data-count-target]:disabled:active, .move-acts .button:disabled:active { filter: none; transform: none; }
.button[aria-disabled="true"] { opacity: .6; cursor: default; }
.button[aria-disabled="true"]:active { filter: none; transform: none; }
.button.danger { min-height: 52px; background: var(--hot); color: var(--on-hot); }
.card { margin-top: 20px; display: flex; flex-direction: column; gap: 20px; }
.card-head { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.card-person { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "ava who pill" "ava since since"; align-items: center; gap: 0 12px; align-self: stretch; }
.card-person > .ava { grid-area: ava; }
.card-person > .state-pill { grid-area: pill; text-align: center; }
.card-who { grid-area: who; font-size: 1rem; line-height: 1.3; font-weight: 600; color: var(--ink); text-decoration: none; overflow-wrap: anywhere; }
.card-who span { color: var(--chevron); }
.card-nobody { font-weight: 400; color: var(--muted); }
.card-since { grid-area: since; font-size: .8125rem; line-height: 1.4; color: var(--muted); }
.card-since span + span::before { content: ' · '; }
.state-pill {
    padding: 5px 12px; border-radius: 999px;
    font-size: .8125rem; line-height: 1.3; font-weight: 600;
    background: var(--chip-bg); color: var(--muted);
}
.state-hot { background: var(--hot-bg); color: var(--hot); }
.state-soon { background: var(--accent-bg); color: var(--accent-ink); }
.state-warm { background: var(--warm-bg); color: var(--warm-ink); }
.state-ok { background: var(--ok-bg); color: var(--ok); }
.story { background: var(--surface); border-radius: 18px; padding: 16px 16px 2px; }
.story-draft { background: var(--draft-bg); }
.story-list { list-style: none; margin: 0; padding: 0; }
.story-row {
    position: relative;
    display: flex; flex-direction: column; gap: 2px;
    padding: 0 0 14px 28px;
}
.story-row::before {
    content: ''; position: absolute; left: 4px; top: 6px;
    width: 8px; height: 8px; border-radius: 999px; box-sizing: border-box;
    background: var(--chevron);
}
.story-row::after {
    content: ''; position: absolute; left: 7px; top: 19px; bottom: 0;
    width: 2px; background: var(--line);
}
.story-row:last-child::after { display: none; }
.story-row.dot-aside::before { background: var(--field-border); }
.story-row.dot-kept::before { left: 1px; top: 3px; width: 14px; height: 14px; background: var(--bead-shine-soft), linear-gradient(var(--accent-soft), var(--accent-soft)), var(--surface); box-shadow: 0 1px 2px rgba(42, 31, 48, .14); }
.story-now::before {
    left: 1px; top: 3px; width: 14px; height: 14px;
    background: var(--muted); box-shadow: 0 0 0 4px var(--chip-bg);
}
.story-now.dot-hot::before { background: var(--hot); box-shadow: 0 0 0 4px var(--hot-bg); }
.story-now.dot-soon::before { background: var(--accent-ink); box-shadow: 0 0 0 4px var(--accent-bg); }
.story-now.dot-warm::before { background: var(--warm); box-shadow: 0 0 0 4px var(--warm-bg); }
.story-now.dot-ok::before { background: var(--ok); box-shadow: 0 0 0 4px var(--ok-bg); }
.story-now:is(.dot-soon, .dot-muted)::before { left: -2px; top: 0; width: 20px; height: 20px; background: var(--ground); border: 1.5px dashed var(--thread-bead); box-shadow: inset 0 1px 3px rgba(42, 31, 48, .16), 0 0 0 5px color-mix(in srgb, var(--bead) 25%, transparent); }
.story-now:is(.dot-soon, .dot-muted)::after { top: 24px; }
.story-next { font-size: .8125rem; line-height: 1.4; color: var(--muted); }
.story-row.story-nest { padding-left: 40px; padding-top: 4px; }
.story-row.story-nest::before { display: none; }
.story-row.story-nest::after { top: 34px; }
.story-nest .nest { position: absolute; left: -6px; top: 0; display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; box-sizing: border-box; border: 2px dashed var(--thread-bead); border-radius: 999px; background: var(--surface); box-shadow: inset 0 1px 3px rgba(42, 31, 48, .16), 0 0 0 5px color-mix(in srgb, var(--bead) 30%, transparent); font-size: .75rem; font-style: normal; font-weight: 700; color: var(--thread-bead); font-variant-numeric: tabular-nums; }
.story-nest .story-title { color: var(--accent-ink); }
.story-now::after, .story-ahead::after { background: repeating-linear-gradient(180deg, var(--line) 0 4px, transparent 4px 7px); }
.story-ahead::before { background: transparent; border: 2px dashed var(--chevron); }
.story-title { font-size: .9375rem; line-height: 1.4; font-weight: 500; white-space: pre-wrap; overflow-wrap: anywhere; }
.story-now .story-title { font-weight: 600; }
.story-now.dot-hot .story-title { color: var(--hot); }
.story-ahead .story-title { font-weight: 400; color: var(--muted); }
.story-meta { font-size: .8125rem; line-height: 1.4; color: var(--faint); }
.story-quote { font-size: .9375rem; line-height: 1.45; color: var(--muted); white-space: pre-wrap; overflow-wrap: anywhere; }
.story-diff { font-size: .9375rem; line-height: 1.45; color: var(--muted); overflow-wrap: anywhere; }
.story del { color: var(--muted); text-decoration: line-through; }
.story ins { color: var(--ok); text-decoration: none; }
.story-acts { display: flex; flex-direction: column; gap: 12px; margin-top: 10px; }
.story > .story-acts { margin: 0 0 14px; }
.story .say { background: var(--ground); }
.story .fill { margin-top: 10px; }
.story-list:has(.story-fold details:not([open])) .story-hidden { display: none; }
.story-fold { position: relative; padding: 0 0 14px 28px; }
.story-fold::after {
    content: ''; position: absolute; left: 7px; top: 0; bottom: 0;
    width: 2px; background: repeating-linear-gradient(180deg, var(--line) 0 2px, transparent 2px 5px);
}
.story-fold summary {
    position: relative; display: inline-flex; align-items: center;
    font-size: .9375rem; line-height: 1.4; font-weight: 500; color: var(--accent-ink);
    list-style: none; cursor: pointer;
}
.story-fold summary::-webkit-details-marker { display: none; }
.story-fold summary::after { content: ''; position: absolute; inset: -12px -6px; }
.story-fold details[open] .fold-closed, .story-fold details:not([open]) .fold-open { display: none; }
.story-add { padding: 0 0 14px; }
.story-add a {
    position: relative; display: inline-flex; align-items: center; gap: 12px;
    font-size: .9375rem; line-height: 1.4; font-weight: 500; color: var(--accent-ink);
    text-decoration: none;
}
.story-add svg { flex: none; }
.story-add a::after { content: ''; position: absolute; inset: -12px -6px; }
.story-add a:active { color: var(--ink); }
.story > .note-add { margin-bottom: 14px; }
.card-bar {
    position: fixed; z-index: 10; left: 0; right: 0; bottom: 0;
    padding: 28px 20px calc(env(safe-area-inset-bottom) + 16px);
    background: linear-gradient(to top, var(--ground) calc(100% - 28px), transparent);
}
.card-bar-in {
    max-width: calc(34rem - 40px); margin: 0 auto;
    display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 8px;
}
.card-bar-in.main { grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); grid-auto-flow: row; }
.card-bar-in:has(> .ask-hint) { grid-auto-flow: row; }
.more { position: relative; }
.more > summary { list-style: none; cursor: pointer; }
.more > summary::-webkit-details-marker { display: none; }
.more-body {
    position: absolute; right: 0; top: calc(100% + 8px); z-index: 5;
    width: min(20rem, calc(100vw - 40px));
    display: flex; flex-direction: column; gap: 8px;
    padding: 8px; border-radius: 22px;
    background: var(--ground); box-shadow: var(--bar-shadow);
}
.more-list { display: flex; flex-direction: column; gap: 4px; }
.more-list > a, .more-list > button {
    display: flex; align-items: center;
    width: 100%; min-height: 52px; padding: 12px 16px;
    border: 0; border-radius: 4px;
    background: var(--surface);
    color: var(--ink); font: inherit; font-size: 1rem; font-weight: 500; text-align: left;
    text-decoration: none; cursor: pointer;
}
.more-list > :first-child { border-radius: 16px 16px 4px 4px; }
.more-list > :last-child { border-radius: 4px 4px 16px 16px; }
.more-list > :only-child { border-radius: 16px; }
.more-list > :active { background: var(--press); }
.more-list small { display: block; margin-top: 2px; font-size: .8125rem; line-height: 1.4; font-weight: 400; color: var(--faint); }
.more-out > button { color: var(--muted); }
dialog.sheet .more-body { position: static; width: auto; gap: 8px; padding: 0; background: none; box-shadow: none; }
dialog.sheet .more-list { gap: 0; }
dialog.sheet .more-list > a, dialog.sheet .more-list > button { background: transparent; border-radius: 12px; padding: 12px 4px; }
dialog.sheet .more-list > * + * { border-top: 1px solid var(--line-soft); }
.tail-invite {
    display: flex; align-items: center; gap: 10px;
    padding: 14px 16px;
    border: 1.5px dashed var(--accent-soft); border-radius: 18px;
    color: var(--accent-ink); font-size: .9375rem; line-height: 1.4; font-weight: 500;
    text-decoration: none;
}
.tail-invite svg { flex: none; }
.tail-invite small { display: block; font-size: .75rem; line-height: 1.4; font-weight: 400; color: var(--faint); }
.tail-invite:active { background: var(--press); }
.scope-offer { padding: 14px 16px; border-radius: 18px; box-shadow: inset 0 0 0 1px var(--line); }
.scope-offer h2 { margin: 0; font-size: .9375rem; line-height: 1.35; font-weight: 600; }
.scope-offer p { margin-top: 6px; font-size: .9375rem; line-height: 1.45; color: var(--muted); text-wrap: pretty; }
.scope-offer-acts { display: flex; flex-wrap: wrap; gap: 10px 18px; margin: 12px 0 0; }
.scope-offer-acts .side { position: relative; padding: 0; border: 0; background: none; font-family: inherit; text-decoration: none; cursor: pointer; }
.scope-offer-acts .side::after { content: ''; position: absolute; inset: -12px -6px; }
.scope-offer-acts .side:active { color: var(--ink); }
.card-answered { font-size: .9375rem; line-height: 1.5; color: var(--muted); text-align: center; text-wrap: balance; }
.card-answered .side { position: relative; padding: 0; border: 0; background: none; font-family: inherit; cursor: pointer; }
.card-answered .side::after { content: ''; position: absolute; inset: -12px -4px; }
.card-answered .side:active { color: var(--ink); }
.acts { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; }
.acts[hidden] { display: none; }
.acts .side {
    min-height: 44px; padding: 0 6px;
    border: 0; border-radius: 12px;
    background: transparent;
    cursor: pointer;
}
.acts .side:active { background: var(--press); }
.facts { margin: 0; background: var(--surface); border-radius: 18px; padding: 2px 16px; }
.facts div { padding: 13px 0; border-top: 1px solid var(--line-soft); }
.facts div:first-child { border-top: 0; }
.facts dt { font-size: .75rem; font-weight: 500; letter-spacing: .02em; color: var(--faint); }
.facts dd { margin: 0; font-size: .9375rem; line-height: 1.45; }
.facts dd.text { white-space: pre-wrap; }
.facts.two div { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 16px; font-size: .9375rem; }
.facts.two dt { font-size: .9375rem; font-weight: 400; color: var(--muted); letter-spacing: 0; }
.facts.two dd { margin-left: auto; text-align: right; }
.facts.two dd .fact-change { position: relative; display: block; margin-top: 2px; font-size: .8125rem; font-weight: 500; text-decoration: none; }
.facts.two dd .fact-change::after { content: ''; position: absolute; inset: -10px -8px; }
.facts.two dd.fact-warm { color: var(--warm); }
.who-head { display: flex; align-items: center; gap: 12px; }
.who-name { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.who-head h1 { font-size: 1.625rem; line-height: 1.15; overflow-wrap: break-word; }
.who-head.long h1 { font-size: 1.25rem; line-height: 1.25; }
.who-sub { font-size: .8125rem; line-height: 1.4; color: var(--muted); }
.who-sub a { position: relative; color: var(--accent-ink); font-weight: 500; text-decoration: none; }
.who-sub a::after { content: ''; position: absolute; inset: -14px -4px; }
.who-sub a:active { color: var(--ink); }
.fact-open { flex: none; margin-left: auto; }
.who-band > .page:first-child { margin-top: 20px; }
.occasion-card { margin-top: 24px; display: flex; flex-direction: column; gap: 14px; }
.told .rows { margin-top: 0; }
.told-text { display: block; font-size: 1rem; line-height: 1.4; font-weight: 500; color: var(--ink); text-decoration: none; }
.told-meta { margin-top: 4px; font-size: .8125rem; line-height: 1.4; color: var(--muted); }
.group.early > summary { list-style: none; cursor: pointer; padding: 0 4px; font-size: .9375rem; line-height: 1.4; font-weight: 500; color: var(--muted); }
.group.early > summary::-webkit-details-marker { display: none; }
.group.early[open] > summary { margin-bottom: 10px; }
.talk-card {
    display: flex; flex-direction: column; gap: 14px;
    margin-top: 20px; padding: 16px;
    background: var(--surface); border-radius: 18px;
}
.talk-label { color: var(--accent-ink); }
.talk-when { margin-top: -8px; font-size: 1.25rem; line-height: 1.3; font-weight: 500; letter-spacing: -.01em; }
.talk-head { display: flex; align-items: center; gap: 14px; }
.talk-say { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.talk-head .talk-when { margin-top: 0; }
.talk-ring { position: relative; flex: none; display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; }
.talk-ring svg { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); fill: none; stroke-width: 4; }
.talk-ring b { font-size: .8125rem; font-weight: 700; color: var(--accent-ink); }
.talk-track { stroke: var(--chip-bg); }
.talk-fill {
    stroke: var(--accent); stroke-linecap: round;
    stroke-dasharray: calc(var(--share, 0) * 1.5708px) 157.08px;
    transition: stroke-dasharray .7s cubic-bezier(.2, .8, .2, 1), stroke .3s;
}
.talk-fill.ok { stroke: var(--ok); }
.talk-scale { font-size: .8125rem; line-height: 1.35; color: var(--muted); }
.talk-two { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 8px; }
.talk-two.one { grid-template-columns: 1fr; }
.talk-two form { margin: 0; }
.talk-note { margin-top: -4px; font-size: .8125rem; line-height: 1.45; color: var(--muted); }
.talk-note b { font-weight: 600; color: var(--ink); }
.talk-acts { display: flex; gap: 8px; }
.talk-done { flex: 1 1 auto; gap: 8px; background: var(--ok); color: var(--on-ok); cursor: default; }
.talk-done:active { filter: none; }
.talk-acts form { flex: none; }
.talk-undo { width: auto; padding: 0 20px; background: var(--ground); color: var(--muted); }
.talk-undo:active { background: var(--press); filter: none; }
.talk-card form[aria-busy="true"] button { pointer-events: none; }
.talk-line { width: 100%; height: 1px; margin: 0; border: 0; background: var(--line-soft); }
.talk-rhythm { display: flex; flex-direction: column; gap: 10px; }
.talk-rhythm > summary {
    position: relative; display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
    list-style: none; cursor: pointer;
    font-size: .9375rem; line-height: 1.4; color: var(--muted);
}
.talk-rhythm > summary::-webkit-details-marker { display: none; }
.talk-rhythm > summary::after { content: ''; position: absolute; inset: -12px -6px; }
.talk-rhythm > summary b { font-weight: 500; color: var(--accent-ink); white-space: nowrap; }
.talk-rhythm form { margin: 0; }
.talk-sent { margin: -4px 0 0; font-size: .8125rem; line-height: 1.45; color: var(--muted); }
.talk-sent .side { padding: 0; border: 0; background: none; font: inherit; font-weight: 500; color: var(--accent-ink); cursor: pointer; }
.talk-seg { background: var(--seg-card); }
.segment.wide.talk-seg > button { flex: 1 1 auto; padding: 0 6px; }
.talk-hint { margin-top: -4px; font-size: .75rem; line-height: 1.4; color: var(--faint); }
.feed-seg[hidden], .feed-seg > [hidden] { display: none; }
.feed-chip { gap: 5px; }
.feed-chip span { color: var(--faint); font-weight: 400; }
.feed-chip.on span { color: var(--muted); }
.feed-list { list-style: none; margin: 4px 0 0; padding: 0; }
.feed-item {
    display: grid; grid-template-rows: 1fr;
    transition: grid-template-rows .32s cubic-bezier(.2, .8, .2, 1), opacity .32s;
}
.feed-item[hidden] { display: none; }
.feed-item.folded { grid-template-rows: 0fr; opacity: 0; }
.feed-in {
    position: relative;
    min-height: 0; overflow: hidden;
    display: grid; grid-template-columns: 52px 14px minmax(0, 1fr); column-gap: 14px;
}
.feed-in::before {
    content: ''; position: absolute; top: 0; bottom: 0;
    left: calc(52px + 14px + 6px); width: 2px;
    background: var(--line);
}
.feed-day {
    padding-top: 14px;
    font-size: .75rem; line-height: 1.3; color: var(--faint);
    text-align: right; white-space: nowrap;
}
.feed-day.now { font-weight: 600; color: var(--ok); }
.feed-fact .feed-day.now { color: var(--accent-ink); }
.feed-dot {
    position: relative; z-index: 1;
    justify-self: center;
    width: 10px; height: 10px; margin-top: 17px;
    border-radius: 999px;
    background: var(--ok);
}
.feed-fact .feed-dot { background: var(--accent); }
.feed-dropped .feed-dot { background: var(--chevron); }
.feed-card {
    position: relative;
    display: flex; flex-direction: column; gap: 4px;
    margin-bottom: 12px;
    padding: 12px 16px 14px;
    background: var(--surface); border-radius: 14px;
    transition: background-color 1.5s ease-out;
}
.feed-label { color: var(--ok); }
.feed-fact .feed-label { color: var(--accent-ink); }
.feed-dropped .feed-label { color: var(--muted); }
.feed-text { font-size: .9375rem; line-height: 1.45; color: var(--ink); white-space: pre-wrap; overflow-wrap: anywhere; text-wrap: pretty; text-decoration: none; }
.feed-done .feed-text { font-weight: 500; }
.feed-dropped .feed-text { color: var(--muted); }
a.feed-text::after { content: ''; position: absolute; inset: 0; border-radius: 14px; }
.feed-card:has(a.feed-text:active) { background: var(--press); }
.feed-end { font-size: .8125rem; line-height: 1.4; color: var(--muted); }
.feed-end.ok { color: var(--ok); }
.feed-end.warm { color: var(--warm); }
.feed-item.fresh .feed-card { background: var(--ok-bg); transition: none; }
.feed-fact.fresh .feed-card { background: var(--accent-bg); }
.feed-more { display: inline-flex; align-items: center; gap: 6px; align-self: flex-start; min-height: 44px; padding: 0 4px; text-decoration: none; }
.feed-more[hidden] { display: none; }
.feed-more i { font-style: normal; }
.share-open { margin-left: auto; }
.share-row { flex-direction: row; align-items: flex-start; gap: 12px; }
.share-mark { margin: 2px 0 0; }
.share-mark .side { position: relative; padding: 0; border: 0; background: none; font: inherit; font-size: .9375rem; font-weight: 500; color: var(--accent-ink); cursor: pointer; }
.share-mark .side::after { content: ''; position: absolute; inset: -12px -8px; }
.share-mark .side:active { color: var(--ink); }
.share-body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.share-text { font-size: 1rem; line-height: 1.4; color: var(--ink); overflow-wrap: anywhere; }
.share-row.done .share-text { color: var(--muted); }
.share-meta { display: flex; flex-wrap: wrap; gap: 0 10px; font-size: .8125rem; line-height: 1.4; color: var(--muted); }
.share-meta a { position: relative; color: var(--accent-ink); font-weight: 500; text-decoration: none; overflow-wrap: anywhere; }
.share-meta a::after { content: ''; position: absolute; inset: -14px -4px; }
.share-meta a:active { color: var(--ink); }
.share-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 0 16px; font-size: .8125rem; line-height: 1.4; color: var(--muted); }
.share-acts .side { position: relative; padding: 0; border: 0; background: none; font: inherit; cursor: pointer; }
.share-acts .side::after { content: ''; position: absolute; inset: -12px -8px; }
.share-send { flex: none; align-self: center; position: relative; text-decoration: none; }
.fact-acts .share-cancel { margin-left: auto; }
.share-send::after { content: ''; position: absolute; inset: -14px -10px; }
dialog.sheet.sheet-float {
    width: calc(100% - 32px); max-width: calc(34rem - 32px);
    margin: auto auto max(calc(env(safe-area-inset-bottom) + 98px), calc(var(--sheet-below, 0px) + 12px));
    padding: 0 16px 16px;
    border-radius: 20px;
    box-shadow: 0 12px 40px rgba(26, 26, 31, .18);
    transition: opacity .34s cubic-bezier(.2, .8, .2, 1), transform .34s cubic-bezier(.2, .8, .2, 1);
}
dialog.sheet.sheet-float::backdrop { background: var(--scrim-soft); }
@starting-style {
    dialog.sheet.sheet-float[open] { opacity: 0; transform: translateY(16px) scale(.96); }
}
dialog.sheet.sheet-float.closing { opacity: 0; transform: translateY(16px) scale(.96); }
dialog.sheet.sheet-float .sheet-head { margin: 0 -16px 4px; padding: 8px 16px 0; }
dialog.sheet.sheet-float.sheet-dragging { transition: none; }
dialog.sheet.sheet-float.closing.sheet-swiped { transform: translateY(calc(var(--sheet-drag, 0px) + 48px)); }
dialog.sheet form.fact-float { display: flex; flex-direction: column; flex-wrap: nowrap; gap: 10px; }
dialog.sheet h2.fact-label { margin: 0 0 2px; }
.fact-acts { display: flex; align-items: center; gap: 16px; }
.fact-note { flex: 1 1 auto; font-size: .75rem; line-height: 1.35; color: var(--faint); }
.fact-acts .side { position: relative; padding: 0; border: 0; background: none; font: inherit; cursor: pointer; }
.fact-acts .side::after { content: ''; position: absolute; inset: -12px -8px; }
.fact-save {
    flex: none;
    min-height: 48px; padding: 0 20px;
    border: 0; border-radius: 14px;
    background: var(--accent); color: var(--on-accent);
    font: inherit; font-size: 1rem; font-weight: 600;
    cursor: pointer;
    transition: background-color .2s;
}
.fact-save:disabled { background: var(--accent-soft); cursor: default; }
.fact-save:not(:disabled):active { filter: brightness(.92); }
.fact-acts .fact-delete, .note-add-acts .fact-delete { order: -1; margin-right: auto; }
.note-add { display: flex; flex-direction: column; gap: 12px; }
.note-add textarea {
    flex: none;
    width: 100%;
    padding: 12px 14px;
    border: 1px solid var(--input-border); border-radius: 14px;
    background: var(--surface); color: var(--ink);
    font: inherit; font-size: 1rem; line-height: 1.45;
}
.note-add textarea { min-height: 96px; resize: vertical; }
.note-add-acts { display: flex; align-items: center; justify-content: flex-end; gap: 20px; }
.note-add-acts .side { position: relative; text-decoration: none; }
.note-add-acts .side::after { content: ''; position: absolute; inset: -12px -8px; }
.note-add-acts .button { width: auto; padding: 0 28px; }
.note-add-acts .fact-delete { padding: 0; border: 0; background: none; font: inherit; cursor: pointer; }
.contact, .share-quick { display: flex; flex-direction: column; gap: 12px; margin-top: 20px; }
dialog.sheet form.contact, dialog.sheet form.share-quick { display: flex; flex-direction: column; gap: 12px; margin-top: 0; }
dialog.sheet form.contact[hidden], dialog.sheet form.share-quick[hidden] { display: none; }
.contact .submit, dialog.sheet .contact .submit,
.share-quick .submit, dialog.sheet .share-quick .submit { flex: none; min-height: 52px; border-radius: 16px; margin-top: 8px; }
.contact .bad .hint, .share-quick .bad .hint { font-size: .8125rem; line-height: 1.4; color: var(--err-ink); margin: 0; }
.contact .chips-quick, .share-quick .chips-quick { margin: 0; }
.remind { display: flex; flex-direction: column; gap: 8px; }
.remind .chips-quick, .remind-chips { align-items: center; }
.qchip-x {
    position: relative;
    display: inline-flex; align-items: center; justify-content: center;
    width: 32px; height: 32px; margin-left: -6px;
    border: 0; border-radius: 999px;
    background: transparent;
    color: var(--muted);
    font-size: 1rem; line-height: 1;
    cursor: pointer;
}
.qchip-x::after { content: ''; position: absolute; inset: -6px; }
.qchip-x input { position: absolute; inset: -6px; z-index: 1; margin: 0; opacity: 0; cursor: pointer; }
.qchip-check { gap: 8px; }
.qchip-check input, .chips-quick .qchip-check input { position: static; width: 18px; height: 18px; opacity: 1; accent-color: var(--accent); }
.qchip-who { gap: 8px; padding: 0 14px 0 8px; cursor: default; }
.list { list-style: none; margin: 24px 0 0; padding: 0; background: var(--surface); border-radius: 18px; }
.group .list { margin-top: 0; }
.list li { border-top: 1px solid var(--line-soft); }
.list li:first-child { border-top: 0; }
.list a {
    display: flex; align-items: center; gap: 12px;
    padding: 14px 16px;
    text-decoration: none;
    color: var(--ink);
}
.list > li > a:active { background: var(--press); }
.list > li:first-child > a:first-child:active { border-top-left-radius: 18px; border-top-right-radius: 18px; }
.list > li:last-child > a:last-child:active { border-bottom-left-radius: 18px; border-bottom-right-radius: 18px; }
.list .col { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1 1 auto; }
.list .name { font-size: 1rem; line-height: 1.4; font-weight: 500; }
.list .sub { font-size: .8125rem; line-height: 1.4; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.list .sub.split { display: flex; }
.list .sub .lead { flex: none; }
.list .sub .about { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.list .sub .hot { color: var(--hot); font-weight: 500; }
.list .sub .warm { color: var(--warm); font-weight: 500; }
.list .sub .faint { color: var(--faint); }
.list .sub .quiet { font-style: normal; font-weight: 500; color: var(--accent-ink); }
.list .name-line { display: flow-root; }
.list .name-line .name { overflow-wrap: break-word; }
.share-pill {
    float: right;
    margin: 1px 0 0 8px;
    padding: 2px 8px;
    border-radius: 999px;
    background: var(--chip-bg);
    color: var(--muted);
    font-size: .75rem; line-height: 1.4; font-weight: 500;
    white-space: nowrap;
}
.list .quiet { font-size: .8125rem; color: var(--faint); flex: none; }
.list .chevron { color: var(--chevron); font-size: 1rem; flex: none; }
.list .stack { flex: none; display: flex; padding-left: 6px; }
.list .stack > * { margin-left: -6px; box-shadow: 0 0 0 2px var(--surface); }
.list .stack-more {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 26px; height: 26px; padding: 0 4px; box-sizing: border-box;
    border-radius: 999px;
    background: var(--chip-bg);
    color: var(--muted);
    font-size: .75rem; font-weight: 600;
}
.list > li > a:active .stack > * { box-shadow: 0 0 0 2px var(--press); }
.list-note { font-size: .75rem; line-height: 1.4; color: var(--faint); margin: 12px 4px 0; }
.list-note.foot { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.list-note.foot .project-promises { font-weight: 500; text-decoration: none; }
.say-elsewhere { display: contents; }
.say-fix { align-self: center; justify-self: center; font-size: .9375rem; font-weight: 500; color: var(--muted); text-decoration: none; }
.say-fix::after { content: '\00a0›'; }
.similar:empty { display: none; }
.similar-pill {
    display: inline-flex; align-items: center; min-height: 36px; padding: 0 14px; margin-top: 8px;
    border-radius: 999px; background: var(--quiet-bg); color: var(--accent-ink);
    font-size: .9375rem; font-weight: 600; text-decoration: none;
}
.similar-pill:active { filter: brightness(.92); }
.form-more > summary {
    list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 6px;
    min-height: 44px; font-size: .9375rem; font-weight: 500; color: var(--accent-ink);
}
.form-more > summary::-webkit-details-marker { display: none; }
.form-more > summary::after { content: '›'; transform: rotate(90deg); transition: transform .2s; }
.form-more[open] > summary::after { transform: rotate(-90deg); }
.form-more[open] { display: flex; flex-direction: column; gap: 16px; }
.pick-person { display: flex; align-items: center; gap: 10px; min-height: 28px; color: var(--ink); text-decoration: none; font-size: 1rem; font-weight: 500; }
.pick-person span { flex: 1 1 auto; min-width: 0; }
.pick-person i { font-style: normal; color: var(--chevron); }
.seek { margin: 20px 0 0; }
.seek-bar { display: flex; align-items: center; gap: 8px; margin-top: 20px; }
.seek-bar .seek { flex: 1 1 auto; min-width: 0; margin: 0; }
.seek-add {
    flex: none; margin-left: auto;
    display: flex; align-items: center; justify-content: center;
    width: 48px; height: 48px;
    border: 1px solid var(--field-border); border-radius: 14px;
    background: var(--surface); color: var(--accent-ink);
}
.seek-add:active { background: var(--press); }
dialog.sheet .sheet-head + .page-sub { margin-top: 0; }
dialog.sheet form.person-new { flex-direction: column; flex-wrap: nowrap; gap: 16px; }
dialog.sheet form.person-new select { flex: none; }
dialog.sheet form.person-new .button { flex: none; width: 100%; }
.seek input {
    width: 100%;
    height: 48px; padding: 0 14px;
    border: 1px solid var(--input-border); border-radius: 14px;
    background: var(--surface); color: var(--ink);
    font: inherit; font-size: 1rem;
}
.list-none { font-size: .9375rem; color: var(--muted); margin: 24px 4px 0; }
.list-wider { color: var(--accent-ink); font-weight: 500; text-decoration: none; white-space: nowrap; }
.day-add-row { margin: 12px 4px 0; }
.day-add {
    display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px;
    border-radius: 999px; background: var(--quiet-bg); color: var(--accent-ink);
    font-size: .9375rem; font-weight: 500; text-decoration: none;
}
.day-add:active { filter: brightness(.95); }
.rings[hidden] { display: none; }
.soon-list { margin-top: 0; }
.soon-day { flex: none; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 12px; background: var(--accent-bg); color: var(--accent-ink); line-height: 1; }
.soon-day b { font-size: 1rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.soon-day small { margin-top: 2px; font-size: .75rem; font-weight: 600; }
.due-row { display: flex; align-items: center; gap: 12px; padding-right: 12px; }
.due-list .due-who { flex: 1 1 auto; min-width: 0; padding: 12px 0 12px 14px; }
.due-ring { flex: none; display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 999px; box-shadow: inset 0 0 0 3px var(--accent); }
.due-row .sub b { font-weight: 500; color: var(--ink); }
.due-row form { flex: none; margin: 0; }
.due-write { position: relative; min-height: 36px; padding: 4px 14px; border: 0; border-radius: 999px; background: var(--quiet-bg); color: var(--accent-ink); font: inherit; font-size: .9375rem; font-weight: 600; cursor: pointer; }
.due-write::after { content: ''; position: absolute; inset: -4px; }
.ring-legend { display: flex; align-items: center; gap: 8px; margin: -4px 0 0; padding: 0 4px; font-size: .8125rem; line-height: 1.4; color: var(--muted); }
.ring-legend svg { flex: none; transform: rotate(-90deg); fill: none; stroke-width: 2; }
.ring-legend circle:first-child { stroke: var(--chip-bg); }
.ring-legend circle + circle { stroke: var(--accent-soft); stroke-linecap: round; }
.ring-head-due h2, .ring-head-due .pill { color: var(--accent-ink); }
.ring-head .ring-more { margin-left: auto; }
.ring-more { display: inline-block; padding: 8px 4px; font-size: .9375rem; font-weight: 500; color: var(--accent-ink); text-decoration: none; }
.faces { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; }
.face { display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 0; padding: 8px 2px; border-radius: 16px; color: var(--ink); text-decoration: none; }
.face:active { background: var(--press); }
.ring { position: relative; flex: none; display: flex; align-items: center; justify-content: center; width: 66px; height: 66px; }
.ring-arc { position: absolute; inset: 0; width: 66px; height: 66px; transform: rotate(-90deg); }
.ring-arc .ring-track { fill: none; stroke: var(--chip-bg); stroke-width: 4; }
.ring-fill { fill: none; stroke: var(--accent-soft); stroke-width: 4; stroke-linecap: round; }
.face-due .ring-fill { stroke: var(--accent); }
.ring-badge {
    position: absolute; right: -1px; bottom: -1px;
    display: flex; align-items: center; justify-content: center;
    width: 20px; height: 20px; border-radius: 999px;
    background: var(--surface); color: var(--faint);
    box-shadow: 0 1px 3px rgba(26, 26, 31, .14);
}
.face-free .ring-badge { right: 6px; bottom: 6px; }
.ring-badge.hot { color: var(--hot); }
.ring-badge.warm { color: var(--warm); }
.face-name, .face-cap { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.face-name { font-size: .8125rem; line-height: 1.3; font-weight: 500; }
.face-cap { font-size: .75rem; line-height: 1.3; color: var(--muted); }
.face-cap { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-wrap: balance; text-align: center; }
.face-due .face-cap { color: var(--accent-ink); font-weight: 600; }
.ring-none, .ring-intro { display: flex; flex-direction: column; gap: 4px; margin-top: 28px; padding: 14px 16px; border-radius: 18px; background: var(--surface); font-size: .9375rem; line-height: 1.45; }
.ring-none-head, .ring-intro-head { font-size: 1rem; line-height: 1.3; font-weight: 600; }
.ring-none-head { color: var(--accent-ink); }
.ring-intro p:last-child { color: var(--muted); text-wrap: pretty; }
.pick-list li > a { padding-bottom: 6px; }
.pick-rhythm { padding: 0 16px 14px; }
.pick-label { margin: 0 0 6px; font-size: .8125rem; line-height: 1.4; color: var(--muted); }
.pick-days { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.pick-when .pick-days { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pick-rhythm button {
    min-height: 36px; padding: 0 4px; border: 0; border-radius: 999px;
    background: var(--quiet-bg); color: var(--accent-ink);
    font: inherit; font-size: .9375rem; font-weight: 600; cursor: pointer;
}
.pick-rhythm button:active { filter: brightness(.92); }
.people-view-alt { margin: 28px 0 0; text-align: center; }
.people-view-alt a { display: inline-block; padding: 10px 8px; font-size: .9375rem; font-weight: 500; color: var(--muted); }
.dial-view[hidden] { display: none; }
.dial-chips { margin-top: 12px; }
.dial-chips a { padding: 0 12px; background: var(--surface); color: var(--ink); }
.dial-chips a.on { background: var(--ink); color: var(--ground); }
.dial { position: relative; width: 100%; max-width: 362px; margin: 16px auto 0; aspect-ratio: 362 / 368; }
.dial-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.dial-sector { fill: var(--accent-bg); }
.dial-orbit { fill: none; stroke: var(--line); stroke-width: 1.5; }
.dial-guide { stroke: var(--line); stroke-width: 1; stroke-dasharray: 3 4; }
.dial-arc { fill: none; stroke: var(--accent); stroke-width: 2.5; stroke-linecap: round; }
.dial-label {
    position: absolute; transform: translate(-50%, -50%);
    padding: 0 3px; border-radius: 4px; background: var(--ground);
    font-size: .75rem; line-height: 1.3; white-space: nowrap; color: var(--muted);
}
.dial-label-step { background: none; font-weight: 600; }
.dial-label-due, .dial-label-now { background: none; font-weight: 600; color: var(--accent-ink); }
.dial-me {
    position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
    display: flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; border-radius: 999px;
    background: var(--accent); color: var(--on-accent); font-size: .8125rem; font-weight: 600;
}
.dial-dot {
    position: absolute; transform: translate(-50%, -50%);
    display: flex; align-items: center; justify-content: center;
    width: var(--dot); height: var(--dot); border-radius: 999px;
    box-shadow: 0 0 0 2px var(--ground);
    text-decoration: none;
}
.dial-dot::after { content: ''; position: absolute; inset: -4px; border-radius: 999px; }
.dial-dot .ava { background-clip: padding-box; }
.dial-dot.quiet, .dial-dot .ava.quiet { background: var(--ground); }
.dial-dot.on { box-shadow: 0 0 0 2px var(--ground), 0 0 0 4.5px var(--accent); z-index: 1; }
.dial-dot.group { background: var(--surface); border: 1.5px solid var(--accent-soft); color: var(--accent-ink); font-size: .8125rem; font-weight: 600; }
.dial-dot.group.due { border-style: dashed; border-color: var(--accent); background: var(--ground); }
.dial-dot.dim { opacity: .15; }
.dial-note { margin: 10px 4px 0; font-size: .8125rem; line-height: 1.4; color: var(--muted); text-align: center; text-wrap: pretty; }
.dial-bar { display: flex; align-items: center; gap: 12px; margin-top: 14px; padding: 12px 14px; border-radius: 18px; background: var(--surface); color: var(--ink); text-decoration: none; }
.dial-bar:active { background: var(--press); }
.dial-bar .ring-badge { position: static; flex: none; }
.dial-bar .chevron { flex: none; font-size: 1.25rem; line-height: 1; color: var(--chevron); }
.dial-bar-who { flex: 1; min-width: 0; display: flex; flex-direction: column; font-size: 1rem; line-height: 1.3; }
.dial-bar-who b { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dial-bar-who span { font-size: .8125rem; color: var(--muted); }
.dial-bar-group { flex-direction: column; align-items: stretch; }
.dial-bar-faces { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 14px; }
.dial-bar-faces a { display: flex; flex-direction: column; align-items: center; gap: 4px; font-size: .75rem; color: var(--ink); text-decoration: none; }
.dial-free { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 24px; padding: 0 4px; }
.dial-free-head { font-size: .75rem; line-height: 1.3; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); margin-right: 4px; }
.dial-chip { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 0 12px 0 6px; border-radius: 999px; background: var(--surface); color: var(--ink); font-size: .9375rem; text-decoration: none; }
.found { padding: 0 16px 14px 64px; margin-top: -6px; }
.found-one { display: flex; flex-direction: column; gap: 2px; }
.found-one[hidden] { display: none; }
.found-text { font-size: .9375rem; line-height: 1.45; color: var(--ink); }
.found-when { font-size: .75rem; line-height: 1.4; color: var(--faint); }
mark { background: var(--accent-bg); color: var(--accent-ink); border-radius: 3px; padding: 1px 0; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.form { display: flex; flex-direction: column; gap: 16px; margin-top: 20px; }
.form label { display: flex; flex-direction: column; gap: 6px; }
.form .merge-offer { font-size: .9375rem; line-height: 1.4; color: var(--muted); margin-top: -8px; }
.form .merge-offer a { color: var(--accent-ink); font-weight: 600; text-decoration: none; }
.form label[hidden] { display: none; }
.form:has(#scope-work:checked) .personal-only { display: none; }
.form:has(#scope-personal:checked) .work-only { display: none; }
.form label > span { font-size: .8125rem; line-height: 1.4; font-weight: 500; color: var(--muted); }
.form label > span i { font-style: normal; font-weight: 400; color: var(--faint); }
.form input, .form select, .form textarea, .fill input, .fill select, .filters select, dialog.sheet select {
    width: 100%;
    height: 48px;
    padding: 0 14px;
    border: 1px solid var(--input-border);
    border-radius: 14px;
    background: var(--surface);
    color: var(--ink);
    font-size: 1rem;
}
.form select, .fill select, .filters select, dialog.sheet select {
    -webkit-appearance: none; appearance: none;
    padding-right: 40px;
    background-image: var(--select-arrow);
    background-repeat: no-repeat;
    background-position: right 16px center;
    background-size: 12px 8px;
    text-overflow: ellipsis;
}
.form textarea { height: auto; min-height: 72px; padding: 12px 14px; line-height: 1.5; resize: vertical; }
.form input[type="date"], .form input[type="time"] { -webkit-appearance: none; appearance: none; display: block; min-width: 0; line-height: 46px; }
.form input[type="date"]::-webkit-date-and-time-value,
.form input[type="time"]::-webkit-date-and-time-value { text-align: left; }
.form input:focus, .form select:focus, .form textarea:focus,
.fill input:focus, .fill select:focus, .filters select:focus, dialog.sheet select:focus, dialog.sheet textarea:focus,
.seek input:focus, :is(.reschedule, .move-note) .why:focus, .pulse-earlier-body input:focus,
.note-add textarea:focus, .quick-line:focus, .qchip-field:focus-within {
    border-color: var(--accent-ink);
    box-shadow: 0 0 0 3px var(--accent-bg);
    outline: none;
}
.form .hint { font-size: .8125rem; line-height: 1.4; color: var(--faint); }
.form .form-fact { font-size: .9375rem; line-height: 1.45; color: var(--muted); padding: 0 4px; }
.form .submit { margin-top: 8px; min-height: 52px; }
.form .form-part { display: flex; flex-direction: column; gap: 16px; }
.form .form-part[hidden] { display: none; }
.form .form-part + * { margin-top: 12px; }
.form-part h2 { margin: 0; padding: 0 4px; color: var(--muted); }
.form .field { display: flex; flex-direction: column; gap: 8px; }
.form .field-name { font-size: .8125rem; line-height: 1.4; font-weight: 500; color: var(--muted); }
.form .field-name i { font-style: normal; font-weight: 400; color: var(--faint); }
.form .field.bad .field-name { color: var(--err-ink); font-weight: 600; }
.form .field.bad > .hint { color: var(--err-ink); }
.form .choice > input { width: 0; height: 0; padding: 0; border: 0; }
.form details.usual > summary {
    display: inline-flex; align-items: center; gap: 6px; min-height: 44px;
    font-size: .9375rem; line-height: 1.4; font-weight: 500; color: var(--accent-ink);
    list-style: none; cursor: pointer;
}
.form details.usual > summary::-webkit-details-marker { display: none; }
.form details.usual > summary .ic { flex: none; transform: rotate(90deg); transition: transform .2s; }
.form details.usual[open] > summary .ic { transform: rotate(-90deg); }
.form details.usual .choice { margin-top: 4px; }
.move-note {
    background: var(--surface);
    border-radius: 18px;
    padding: 16px;
    display: flex; flex-direction: column; gap: 12px;
}
.move-note[hidden] { display: none; }
.say-copy {
    position: relative;
    align-self: flex-start;
    border: 0; background: none; padding: 0;
    cursor: pointer;
}
.say-copy::after { content: ''; position: absolute; inset: -12px -8px; }
.say-copy[hidden] { display: none; }
.alert { background: var(--hot-bg); color: var(--err-ink); border-radius: 18px; padding: 12px 14px; font-size: .9375rem; line-height: 1.45; margin-top: 12px; }
.alert a { color: inherit; font-weight: 600; }
.form label.bad > span { color: var(--err-ink); font-weight: 600; }
.form label.bad input, .form label.bad select, .form label.bad textarea {
    border-color: var(--hot);
    box-shadow: 0 0 0 3px var(--hot-bg);
}
.form label.bad .hint { color: var(--err-ink); }
.radios { display: inline-flex; background: var(--seg-track); border-radius: 999px; padding: 3px; }
.radios input { position: absolute; opacity: 0; pointer-events: none; width: 0; height: 0; }
.radios label, .radios button {
    display: inline-flex; flex-direction: row; align-items: center; justify-content: center;
    min-height: 38px; padding: 0 16px;
    border-radius: 999px;
    font-size: .9375rem; color: var(--muted);
    cursor: pointer;
}
.radios button { border: 0; background: transparent; }
.radios input:checked + label, .radios button.on { background: var(--seg-on); color: var(--ink); font-weight: 600; box-shadow: var(--seg-shadow); }
.radios input:focus-visible + label { outline: 2px solid var(--accent-ink); outline-offset: 2px; }
.radios.wide { display: flex; }
.radios.wide button { flex: 1 1 auto; padding: 0 6px; }
.radios.wide label { flex: 1 1 0; }
.picks { border: 0; margin: 0; padding: 0; }
.picks legend { padding: 0; font-size: .8125rem; font-weight: 500; color: var(--muted); }
.picks .list { margin-top: 6px; padding: 0 16px; }
.picks .list label {
    display: flex; flex-direction: row; align-items: center; gap: 12px;
    min-height: 48px; padding: 6px 0;
    font-size: 1rem;
}
.picks input { flex: none; width: 20px; height: 20px; accent-color: var(--accent); }
.picks .list label i { font-style: normal; font-size: .8125rem; color: var(--faint); }
body.screen-task.confirm main { display: flex; flex-direction: column; min-height: calc(100dvh - 44px - var(--top-inset)); }
.gone { list-style: none; margin: 0; padding: 0; }
.gone li { font-size: .9375rem; line-height: 1.5; padding: 3px 0; }
.gone li i { font-style: normal; color: var(--faint); }
.bottom { margin-top: auto; padding-top: 28px; }
.bottom form + form { margin-top: 12px; }
.bottom .bottom-warn { margin: 0 0 16px; }
.button.hot-word { color: var(--hot); }
.bottom .cancel {
    display: flex; align-items: center; justify-content: center;
    min-height: 48px;
    text-decoration: none;
}
body.screen-login { padding-top: 0; }
body.screen-login main { padding: calc(48px + var(--top-inset)) 24px 40px; min-height: 100dvh; display: flex; flex-direction: column; }
.logo { --sign: 56px; }
body.screen-login h1 { font-size: 2.125rem; line-height: 1.1; margin-top: 24px; }
body.screen-login h1 + .page-sub { font-size: 1rem; }
body.screen-login .page-sub.deleted-next { margin-top: 12px; font-size: 1rem; }
.invite-brand { display: flex; align-items: center; gap: 8px; margin: 0; font-size: .8125rem; color: var(--muted); }
.invite-brand b { font-weight: 700; color: var(--ink); }
.invite-mark { --sign: 24px; }
.invite-sign { --sign: 48px; }
.invite-who { display: flex; align-items: center; gap: 12px; }
.invite-from { display: flex; flex-direction: column; margin: 0; line-height: 1.3; }
.invite-from b { font-size: 1rem; font-weight: 600; }
.invite-from span { font-size: .8125rem; color: var(--muted); }
.invite-note { margin: 20px 0 0; padding: 16px 18px 18px; border-radius: 22px; background: var(--surface); box-shadow: 0 1px 2px rgba(26, 26, 31, .04), 0 8px 24px rgba(26, 26, 31, .06); }
.invite-note blockquote { margin: 14px 0 0; padding-left: .42em; text-indent: -.42em; font-size: 1.25rem; line-height: 1.4; font-weight: 500; letter-spacing: -.01em; text-wrap: pretty; }
.door-about .invite-note + h1 { margin-top: 28px; }
.invite-next { margin-top: 32px; text-align: left; }
.invite-next h2 { margin: 0; padding: 0 4px; font-size: 1rem; line-height: 1.3; font-weight: 600; }
.invite-next .invite-path { margin-top: 14px; padding: 16px; border-radius: 18px; background: var(--surface); }
.login-steps.invite-path li { position: relative; align-items: flex-start; margin-top: 0; padding-bottom: 16px; font-size: .9375rem; }
.invite-path li:last-child { padding-bottom: 0; }
.invite-path li:not(:last-child)::after { content: ''; position: absolute; left: 13px; top: 30px; bottom: 2px; width: 2px; background: var(--field-border); }
.invite-path li:first-child::before { background: var(--accent); color: var(--on-accent); }
.invite-path li:last-child::before { box-sizing: border-box; border: 2px dashed var(--accent-soft); background: var(--surface); }
.invite-path li > span { padding-top: 4px; color: var(--muted); }
.invite-path b { display: block; font-weight: 600; color: var(--ink); }
.enter-hint { margin-top: 10px; font-size: .8125rem; line-height: 1.45; color: var(--muted); text-align: center; text-wrap: balance; }
.door-sample { margin-top: 32px; padding-top: 20px; border-top: 1px solid var(--field-border); }
.door-sample .sample-head { margin-bottom: 8px; }
.door-sample .row-act { margin: 0; }
.door-line { margin-top: 14px; font-size: 1.25rem; line-height: 1.3; font-weight: 600; letter-spacing: -.01em; text-wrap: balance; }
body.screen-login .door-lead { margin-top: 6px; font-size: 1rem; text-wrap: pretty; }
.door-about .door-lock { display: none; }
.door-safari { margin-top: 20px; background: var(--warm-bg); color: var(--ink); }
.door-safari .go { margin-top: 10px; }
.door-preview { margin-bottom: 8px; }
.door-ask { position: relative; font-weight: 500; text-decoration: none; }
.door-ask::after { content: ''; position: absolute; inset: -13px -6px; }
.list-note.foot > .only-browser { display: block; margin-bottom: 4px; }
.door-data { position: relative; display: inline-block; margin-top: 8px; font-size: .8125rem; font-weight: 500; text-decoration: none; }
.door-data::after { content: ''; position: absolute; inset: -13px -8px; }
.list-note.foot .door-data { display: table; margin: 8px auto 0; }
.list-note.foot .door-links { display: flex; justify-content: center; gap: 24px; margin-top: 8px; }
.list-note.foot .door-links .door-data { display: inline-block; margin: 0; }
body.screen-login .button { margin-top: 36px; }
.enter-label { margin: 36px 0 0; color: var(--muted); }
.enter .login-steps { margin-top: 14px; }
.for-desk { display: none; }
.enter-trust { margin-top: 14px; font-size: .8125rem; line-height: 1.45; color: var(--muted); text-align: center; text-wrap: pretty; }
.enter-trust .ic { display: inline; margin-right: 6px; vertical-align: -2px; color: var(--faint); }
.enter-code { margin-top: 14px; text-align: center; }
.enter-code > summary {
    position: relative; display: inline-block; list-style: none; cursor: pointer;
    font-size: .9375rem; font-weight: 500; color: var(--accent-ink);
}
.enter-code > summary::-webkit-details-marker { display: none; }
.enter-code > summary::after { content: ''; position: absolute; inset: -12px -8px; }
.enter-code > summary:active { color: var(--ink); }
.enter-code .code-say { margin-top: 12px; font-size: .9375rem; color: var(--muted); }
.enter-late { margin-top: 12px; font-size: .8125rem; line-height: 1.45; color: var(--muted); text-align: center; text-wrap: pretty; animation: enterLate 0s linear 60s both; }
@keyframes enterLate { from { visibility: hidden; max-height: 0; margin-top: 0; overflow: hidden; } to { visibility: visible; } }
.enter:has(.waiting.in) .enter-late { display: none; }
.login-steps { margin: 36px 0 0; padding: 0; list-style: none; counter-reset: step; }
.login-steps li { display: flex; align-items: center; gap: 14px; margin-top: 12px; font-size: 1rem; line-height: 1.4; text-wrap: pretty; counter-increment: step; }
.login-steps li:first-child { margin-top: 0; }
.login-steps li::before {
    content: counter(step);
    flex: none;
    display: flex; align-items: center; justify-content: center;
    width: 28px; height: 28px;
    border-radius: 999px;
    background: var(--quiet-bg);
    color: var(--accent-ink);
    font-size: .8125rem; font-weight: 600;
}
body.screen-login .login-steps + .button { margin-top: 20px; }
body.screen-login .foot { margin-top: auto; padding-top: 28px; }
.code-say { text-align: center; }
body.screen-login .page-sub + .code-say { margin-top: 36px; }
.code {
    margin-top: 12px;
    background: var(--surface);
    border-radius: 16px;
    padding: 22px;
    text-align: center;
    font: 600 34px/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    letter-spacing: .22em;
}
.waiting { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 12px; font-size: .8125rem; color: var(--muted); }
.waiting i { width: 8px; height: 8px; border-radius: 999px; background: var(--warm); }
@keyframes waitPulse {
    50% { opacity: .3; transform: scale(.7); }
}
.waiting i { animation: waitPulse 1.6s ease-in-out infinite; }
.waiting.in { color: var(--ok); font-weight: 600; }
.waiting.in i { background: var(--ok); animation: none; }
.waiting i {
    display: flex; align-items: center; justify-content: center;
    color: var(--ground);
    transition: width .24s cubic-bezier(.2, .8, .2, 1), height .24s cubic-bezier(.2, .8, .2, 1), background-color .24s;
}
.waiting i .ic { opacity: 0; transform: scale(.5); transition: opacity .24s, transform .24s cubic-bezier(.2, .8, .2, 1); }
.waiting.in i { width: 18px; height: 18px; }
.waiting.in i .ic { opacity: 1; transform: none; }
body.screen-login .enter :is(.login-steps, .enter-go, .qr, .code) { transition: opacity .24s; }
body.screen-login .enter:has(.waiting.in) :is(.login-steps, .enter-go, .qr, .code) { opacity: .4; }
body.door main { padding-left: 16px; padding-right: 16px; }
.door-top { display: flex; align-items: center; justify-content: space-between; }
.door-brand { display: flex; align-items: center; gap: 10px; }
.door-sign { --sign: 36px; }
.door-name { display: flex; flex-direction: column; line-height: 1.1; }
.door-name b { font-size: 1rem; font-weight: 700; letter-spacing: -.01em; }
.door-name small { font-size: .75rem; color: var(--muted); }
.door-in { position: relative; font-size: .9375rem; font-weight: 500; color: var(--ink); text-decoration: none; }
.door-in::after { content: ''; position: absolute; inset: -12px -8px; }
body.screen-login h1.door-title { margin-top: 32px; font-size: 2.125rem; line-height: 1.05; font-weight: 700; letter-spacing: -.035em; text-wrap: balance; }
body.screen-login h1 + .page-sub.door-lead { margin-top: 14px; font-size: 1rem; line-height: 1.45; text-wrap: pretty; }
.door-example { min-height: 0; padding: 10px 14px; border-radius: 14px; font-size: .9375rem; }
.door-cap { margin: 10px 0 0; font-size: .8125rem; line-height: 1.45; color: var(--muted); text-wrap: pretty; }
.door-lock {
    margin-top: 28px; padding: 22px 14px 14px; border-radius: 28px;
    background: var(--night); color: #f6f0f8; text-align: center;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, sans-serif;
}
.lock-date { margin: 0; font-size: .9375rem; font-weight: 600; color: rgba(246, 240, 248, .78); }
.lock-thread { display: flex; align-items: center; justify-content: center; gap: 10px; width: max-content; margin: 16px auto 0; padding: 0 6px; background: linear-gradient(rgba(201, 168, 216, .32), rgba(201, 168, 216, .32)) center / 100% 2px no-repeat; }
.lock-thread i { width: 14px; height: 14px; border-radius: 999px; background: var(--bead-shine), var(--bead); }
.lock-thread i:nth-child(-n+2) { width: 12px; height: 12px; background: var(--bead); opacity: .35; }
.lock-thread i:nth-child(2) { opacity: .6; }
.lock-thread .nest { width: 20px; height: 20px; box-sizing: border-box; border: 1.5px dashed var(--bead); background: var(--night); }
.lock-clock { margin: 0; font-size: 4rem; line-height: 1; font-weight: 600; letter-spacing: -.02em; }
.lock-note {
    display: flex; gap: 10px; align-items: flex-start; margin-top: 18px; padding: 11px 12px;
    border-radius: 20px; text-align: left; color: var(--ink);
    background: color-mix(in srgb, var(--surface) 92%, transparent);
}
.lock-icon { --sign: 36px; }
.door-thread { margin-top: 36px; padding: 20px 18px; border-radius: 22px; background: var(--surface); }
.door-thread .streak-row { display: flex; align-items: flex-end; gap: 12px; }
.door-thread .streak-num b { font-size: 4rem; line-height: .8; font-weight: 700; letter-spacing: -.05em; color: var(--ink); }
.door-thread .streak-label small { font-size: .8125rem; font-weight: 600; color: var(--accent-ink); }
.door-thread .streak-say { font-size: .8125rem; color: var(--muted); }
.door-thread .thread { justify-content: flex-start; height: 36px; margin-top: 16px; padding: 0; }
.door-thread .thread .bead.next { width: 30px; height: 30px; box-shadow: none; }
.door-thread h2 { margin: 18px 0 0; font-size: 1.25rem; line-height: 1.25; font-weight: 700; letter-spacing: -.02em; }
.door-thread p { margin: 6px 0 0; font-size: .9375rem; line-height: 1.45; color: var(--muted); text-wrap: pretty; }
.lock-body { min-width: 0; flex: 1; }
.lock-head { display: flex; justify-content: space-between; margin: 0; font-size: .8125rem; line-height: 1.3; color: var(--muted); }
.lock-head b { font-weight: 600; color: var(--ink); }
.lock-title { margin: 1px 0 0; font-size: .9375rem; line-height: 1.3; font-weight: 600; }
.lock-text { margin: 1px 0 0; font-size: .9375rem; line-height: 1.3; }
.door-trust { display: flex; flex-direction: column; gap: 12px; margin: 32px 0 0; padding: 0; list-style: none; }
.door-trust li { display: flex; gap: 12px; align-items: flex-start; font-size: .9375rem; line-height: 1.45; }
.door-trust i {
    flex: none; display: flex; align-items: center; justify-content: center;
    width: 24px; height: 24px; margin-top: -1px; border-radius: 999px;
    background: var(--quiet-bg); color: var(--accent-ink);
}
.door-enter { margin-top: 20px; }
.login-steps.door-steps { margin-top: 40px; }
.login-steps.door-steps li { position: relative; align-items: flex-start; margin-top: 0; padding-bottom: 22px; }
.login-steps.door-steps li:last-child { padding-bottom: 0; }
.door-steps li:not(:last-child)::after { content: ''; position: absolute; left: 13px; top: 30px; bottom: 2px; width: 2px; background: var(--line); }
.door-steps li > span { flex: 1; min-width: 0; padding-top: 3px; }
.door-steps b { display: block; font-size: 1rem; line-height: 1.3; font-weight: 600; }
.door-steps .door-example { display: block; margin-top: 8px; }
.door-steps .door-cap { display: block; margin-top: 4px; }
.door-steps .say { margin-top: 8px; padding: 10px 14px; }
.door-people { margin-top: 28px; }
.door-people-say { margin: 0; font-size: 1.25rem; line-height: 1.3; font-weight: 600; letter-spacing: -.01em; text-wrap: pretty; }
.door-ask-again { margin-top: 28px; }
body.door .door-enter .button { margin-top: 14px; }
.door-again { margin: 14px 0 0; text-align: center; font-size: .9375rem; color: var(--muted); }
.door-again a { position: relative; font-weight: 500; text-decoration: none; }
.door-again a::after { content: ''; position: absolute; inset: -12px -8px; }
body.door .foot { padding-top: 32px; }
body.door .door-icon .door-line { margin-top: 12px; }
.qr { display: none; }
.qr-plate { background: #fff; border-radius: 16px; padding: 12px; line-height: 0; }
.qr-plate svg { display: block; width: 168px; height: 168px; }
.qr p { margin-top: 10px; font-size: .8125rem; line-height: 1.4; color: var(--muted); text-align: center; }
@media (min-width: 400px) and (pointer: fine) {
    .qr { display: flex; flex-direction: column; align-items: center; margin-top: 24px; }
}
@media (min-width: 900px) and (pointer: fine) {
    body.screen-login main:has(.door-split) { max-width: 1080px; padding-left: 40px; padding-right: 40px; }
    .door-split { display: grid; grid-template-columns: minmax(0, 560px) 400px; grid-template-rows: auto 1fr; gap: 0 64px; justify-content: center; align-items: start; }
    .door-split > .enter { grid-column: 2; grid-row: 1 / span 2; margin-top: 16px; padding: 24px; border-radius: 20px; background: var(--surface); }
    .door-split > .door-sample { grid-column: 1; }
    .door-about .door-lock { display: block; max-width: 400px; margin-top: 32px; }
    .enter-label { margin: 0; font-size: 1rem; line-height: 1.3; letter-spacing: -.01em; text-transform: none; color: var(--ink); }
    .enter .qr { margin-top: 20px; }
    .enter .qr-plate svg { width: 196px; height: 196px; }
    .enter .login-steps { margin-top: 20px; }
    .enter .login-steps li { font-size: .9375rem; }
    .for-touch { display: none; }
    .for-desk { display: inline; }
    body.screen-login .enter .enter-go { min-height: 48px; margin-top: 20px; border-radius: 14px; background: var(--quiet-bg); color: var(--accent-ink); font-size: 1rem; }
    .list-note.foot { display: flex; justify-content: center; align-items: baseline; flex-wrap: wrap; gap: 8px 24px; }
    .list-note.foot > .only-browser { margin: 0; }
    .list-note.foot .door-links { margin-top: 0; }
}
.form .choice label { flex-direction: row; }
.picks .choice { margin-top: 8px; }
.picks > .hint { margin-top: 8px; }
.picks.bad legend { color: var(--err-ink); font-weight: 600; }
.picks.bad > .hint { color: var(--err-ink); }
.move-open { margin-top: 12px; padding: 12px 16px; background: var(--surface); border-radius: 18px; text-align: left; }
.form .move-check { flex-direction: row; align-items: center; gap: 12px; min-height: 28px; }
.form .move-check > span { font-size: .9375rem; line-height: 1.4; font-weight: 400; color: var(--ink); }
.move-lines { list-style: none; margin: 6px 0 0 32px; padding: 0; font-size: .8125rem; line-height: 1.45; color: var(--muted); }
.zone-phone { margin-top: -4px; }
.zone-phone[hidden] { display: none; }
.hint-action { border: 0; background: none; padding: 0; font: inherit; color: var(--accent-ink); font-weight: 600; cursor: pointer; }
.bot-stopped { display: flex; flex-direction: column; gap: 12px; padding: 14px 16px; border-radius: 18px; background: var(--warm-bg); }
.bot-stopped p { margin: 0; font-size: .9375rem; line-height: 1.45; color: var(--ink); }
.pickcard { background: var(--surface); border-radius: 18px; padding: 16px; }
.channel-card .radios { margin-top: 12px; }
.channel-say { margin-top: 12px; }
.channel-say p, p.channel-say { font-size: .9375rem; line-height: 1.45; color: var(--muted); text-wrap: pretty; }
.channel-say .button { margin-top: 12px; }
.reminders-lost { margin-top: 16px; padding: 14px 16px; border-radius: 16px; background: var(--warm-bg); }
.reminders-lost > p { margin: 0; font-size: .9375rem; line-height: 1.45; color: var(--ink); }
.reminders-lost > p.push-support { margin-top: 8px; font-size: .75rem; color: var(--muted); }
.lost-acts { display: flex; flex-direction: column; align-items: center; gap: 14px; margin-top: 12px; }
.lost-acts .button { align-self: stretch; margin: 0; min-height: 48px; border-radius: 14px; }
.lost-acts .side { position: relative; flex: none; font-size: .9375rem; font-weight: 500; text-decoration: none; }
.lost-acts .side::after { content: ''; position: absolute; inset: -14px -8px; }
.saved-lost { white-space: normal !important; color: var(--warm-ink); }
.ask-push[hidden] { display: none; }
.ask-push h2 { margin: 0; font-size: 1rem; line-height: 1.3; font-weight: 600; }
.ask-push > p:not(.channel-say) { margin-top: 6px; font-size: .9375rem; line-height: 1.45; color: var(--muted); text-wrap: pretty; }
.ask-push-acts { display: flex; flex-direction: column; align-items: center; gap: 14px; margin-top: 16px; }
.ask-push-acts .button { align-self: stretch; margin: 0; }
.ask-push-acts .side { position: relative; padding: 0; border: 0; background: none; font: inherit; font-size: .9375rem; font-weight: 500; color: var(--muted); cursor: pointer; }
.ask-push-acts .side::after { content: ''; position: absolute; inset: -14px -8px; }
.channel-card .day-sides { margin-top: 8px; }
:root[data-theme="dark"] .channel-card .radios { background: var(--ground); }
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .channel-card .radios { background: var(--ground); }
}
.recorded-when { margin-top: 16px; }
.recorded-touches { margin: 6px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 4px; font-size: .9375rem; line-height: 1.45; color: var(--muted); }
.recorded-touches li { position: relative; padding-left: 16px; }
.recorded-touches li::before { content: ''; position: absolute; left: 2px; top: .55em; width: 6px; height: 6px; border-radius: 999px; background: var(--accent-soft); }
.recorded-touches b { font-weight: 600; color: var(--ink); }
.push-peek {
    display: flex; gap: 10px; align-items: flex-start; margin: 14px 0 0; padding: 11px 12px;
    border-radius: 20px; background: var(--ground);
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, sans-serif;
}
.pickcard .hint { font-size: .8125rem; line-height: 1.4; color: var(--faint); margin: 12px 4px 0; }
:root[data-theme="dark"] .pickcard .radios { background: var(--ground); }
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) .pickcard .radios { background: var(--ground); }
}
.pickcard .pick-label { display: block; margin: 0 4px 8px; font-size: .8125rem; line-height: 1.4; font-weight: 500; color: var(--muted); }
.pickcard [hidden] { display: none; }
.push-lost { display: flex; flex-direction: column; gap: 10px; margin: 0 0 12px; padding: 14px 16px; border-radius: 16px; background: var(--warm-bg); }
.push-lost p { margin: 0; font-size: .9375rem; line-height: 1.45; color: var(--ink); }
.push-lost b { font-weight: 600; color: var(--warm-ink); }
.push-lost .push-support { font-size: .75rem; color: var(--muted); }
.pickcard .push-lost + .radios { margin-top: 0; }
.radios button.dim { opacity: .45; }
.radios button[aria-disabled="true"] { opacity: .6; }
[data-controller~="push"][aria-busy="true"] button { pointer-events: none; }
.settings .saved { margin: 2px 4px 0; font-size: .9375rem; font-weight: 600; color: var(--ok); }
.devices { list-style: none; margin: 12px 4px 0; padding: 0; }
.devices li { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 44px; border-top: 1px solid var(--line-soft); font-size: .9375rem; }
.devices li:first-child { border-top: 0; }
.devices li i, .devices li b { font-style: normal; font-weight: 400; font-size: .8125rem; color: var(--faint); }
.botcard { margin-top: 20px; background: var(--surface); border-radius: 18px; padding: 16px; display: flex; flex-direction: column; gap: 12px; }
.botcard h2 { margin: 0; font-size: 1rem; font-weight: 600; }
.botcard p { font-size: .9375rem; line-height: 1.5; color: var(--muted); }
.datalink {
    margin-top: 12px; min-height: 56px; padding: 12px 16px;
    display: flex; align-items: center; gap: 12px;
    background: var(--surface); border-radius: 18px;
    color: var(--ink); text-decoration: none;
}
.datalink span { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.datalink b { font-size: .9375rem; font-weight: 600; }
.datalink small { font-size: .8125rem; line-height: 1.4; color: var(--muted); }
.datalink .ic { color: var(--faint); transform: scaleX(-1); }
.datalink:active { background: var(--press); }
.claims { margin: 20px 0 0; padding: 2px 16px; list-style: none; background: var(--surface); border-radius: 18px; }
.claims li { padding: 14px 0; border-top: 1px solid var(--line-soft); }
.claims li:first-child { border-top: 0; }
.claims :is(h2, h3) { margin: 0; font-size: .9375rem; line-height: 1.4; font-weight: 600; }
.claims p { margin-top: 4px; font-size: .9375rem; line-height: 1.5; color: var(--muted); text-wrap: pretty; }
.claims-date { margin: 12px 4px 0; color: var(--faint); }
.group .claims { margin-top: 0; }
.brief { margin: 0; padding: 6px 16px; list-style: none; background: var(--surface); border-radius: 18px; }
.brief li { position: relative; padding: 10px 0 10px 18px; font-size: .9375rem; line-height: 1.45; text-wrap: pretty; border-top: 1px solid var(--line-soft); }
.brief li:first-child { border-top: 0; }
.brief li::before { content: ''; position: absolute; left: 2px; top: 1.125rem; width: 6px; height: 6px; border-radius: 50%; background: var(--faint); }
.faq summary {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    min-height: 52px; padding: 14px 16px; box-sizing: border-box;
    list-style: none; cursor: pointer;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary .ic { flex: none; color: var(--chevron); transform: rotate(90deg); transition: transform .2s; }
.faq details[open] summary .ic { transform: rotate(-90deg); }
.faq summary:active { background: var(--press); }
.faq li:first-child summary:active { border-radius: 18px 18px 0 0; }
.faq li:last-child details:not([open]) summary:active { border-radius: 0 0 18px 18px; }
.faq details p { margin: 0 16px; padding-bottom: 12px; font-size: .9375rem; line-height: 1.5; color: var(--muted); text-wrap: pretty; }
.faq details p:first-of-type { margin-top: -4px; }
.faq details p:last-child { padding-bottom: 16px; }
@media (prefers-reduced-motion: reduce) { .faq summary .ic { transition: none; } }
.help-support .list.support { margin-top: 0; }
.help-support .list-note { margin-top: 0; }
.help-note { margin: 0 4px; }
.datalink.help-data { margin-top: 28px; }
.help-short { margin: 0; padding: 4px 16px; list-style: none; background: var(--surface); border-radius: 18px; }
.help-short li { padding: 12px 0; border-top: 1px solid var(--line-soft); font-size: .9375rem; line-height: 1.45; text-wrap: pretty; }
.help-short li:first-child { border-top: 0; font-size: 1rem; font-weight: 600; }
.help-start .n { flex: none; display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 999px; background: var(--quiet-bg); color: var(--accent-ink); font-size: .8125rem; font-weight: 600; }
.help-start .name { flex: 1; font-size: .9375rem; line-height: 1.4; }
.help-start .ic { flex: none; color: var(--chevron); }
.faq.how summary .name { font-weight: 600; }
.faq details p a { display: inline; padding: 0; color: var(--accent); font-weight: 500; }
.help-key { display: none; margin: 0 4px; }
.help-key kbd { font: inherit; font-weight: 600; padding: 1px 6px; border-radius: 6px; background: var(--chip-bg); color: var(--ink); }
@media (pointer: fine) and (hover: hover) { .help-key { display: block; } }
.help-local { margin-top: 28px; }
.help-local + .datalink.help-data { margin-top: 12px; }
.install-way { margin-top: 20px; padding: 16px; background: var(--surface); border-radius: 18px; }
.install-way h2 { margin: 0; font-size: 1rem; line-height: 1.3; font-weight: 600; }
.install-steps { margin: 10px 0 0; padding-left: 22px; }
.install-steps li { margin-top: 8px; font-size: .9375rem; line-height: 1.5; text-wrap: pretty; }
.install-steps li::marker { color: var(--muted); font-weight: 600; }
.install-glyph { display: inline-flex; vertical-align: -3px; color: var(--accent-ink); }
.install-go { margin-top: 14px; }
.install-go[hidden] { display: none; }
.install-way.qr { padding: 0; background: none; }
.install-other { margin-top: 20px; }
.install-other > summary { list-style: none; cursor: pointer; padding: 0 4px; }
.install-other > summary::-webkit-details-marker { display: none; }
.install-done { display: none; margin-top: 20px; padding: 16px; background: var(--surface); border-radius: 18px; font-size: .9375rem; line-height: 1.5; }
.install-done .caption { margin-top: 10px; }
.install-note { margin: 10px 4px 0; text-wrap: pretty; }
.install-hint { display: flex; align-items: center; gap: 12px; margin-top: 28px; padding: 14px 4px 0; border-top: 1px solid var(--line); }
.install-sign { --sign: 28px; }
.install-say { flex: 1; min-width: 0; font-size: .8125rem; line-height: 1.45; color: var(--muted); text-wrap: pretty; }
.install-say a { position: relative; font-weight: 500; color: var(--accent-ink); text-decoration: none; white-space: nowrap; }
.install-say a::after { content: ''; position: absolute; inset: -12px -6px; }
.install-close { position: relative; flex: none; padding: 0 4px; border: 0; background: none; color: var(--chevron); font: inherit; font-size: 1rem; line-height: 1; cursor: pointer; }
.install-close::after { content: ''; position: absolute; inset: -13px -10px; }
.install-close:active { color: var(--ink); }
.only-icon { display: none; }
@media (display-mode: standalone) {
    .only-browser, .menu-list.only-browser, .menu-list > a.only-browser, .list-note.foot > .only-browser { display: none; }
    .only-icon { display: block; }
    .install-done { display: block; }
}
.day-sides .side, .rev-answers .side, .card-answered .side, .scope-offer-acts .side:not(.away), .row-more a, .feed-more,
.group-head .more, .say-copy, .story-fold summary,
.install-other > summary, .share-send {
    font-size: .9375rem; font-weight: 500;
    color: var(--accent-ink);
}
.day-sides .side.away, .acts .side, .rev-answers .side.away, .one-quiet .side, .scope-offer-acts .side.away,
.note-add-acts .side, .fact-acts .side, .sheet-next,
.bottom .cancel, .invite-revoke, .invite-remove, .share-acts .side {
    font-size: .8125rem; font-weight: 500;
    color: var(--muted);
}
.day-sides .side:active, .rev-answers .side:active, .one-quiet .side:active,
.group-head .more:active, .say-copy:active,
.note-add-acts .side:active, .fact-acts .side:active,
.bottom .cancel:active, .feed-more:active,
.invite-revoke:active, .invite-remove:active, .install-other > summary:active,
.share-send:active, .share-acts .side:active {
    color: var(--ink);
}
.chips a:active, .pulse-more:active { filter: brightness(.92); }
@keyframes rowIn {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: none; }
}
.row, .card > * { animation: rowIn .4s cubic-bezier(.2, .8, .2, 1) backwards; }
:is(.row, .card > *):nth-child(2) { animation-delay: 60ms; }
:is(.row, .card > *):nth-child(3) { animation-delay: 120ms; }
:is(.row, .card > *):nth-child(4) { animation-delay: 180ms; }
:is(.row, .card > *):nth-child(5) { animation-delay: 240ms; }
:is(.row, .card > *):nth-child(6) { animation-delay: 300ms; }
:is(.row, .card > *):nth-child(7) { animation-delay: 360ms; }
:is(.row, .card > *):nth-child(8) { animation-delay: 420ms; }
.calm :is(.row, .card > *) { animation: none; }
.roll { display: inline-block; vertical-align: top; overflow: hidden; }
.roll-in { display: flex; flex-direction: column; align-items: flex-start; }
.mark { display: block; fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 20; }
.flier { position: fixed; z-index: 30; margin: 0; pointer-events: none; }
.go-bead { flex: none; display: inline-block; width: 12px; height: 12px; margin-left: 10px; border-radius: 999px; background: radial-gradient(circle at 35% 30%, rgba(255, 255, 255, .6), rgba(255, 255, 255, 0) 60%), var(--bead); }
.bead-flier { display: block; width: 100%; height: 100%; border-radius: 999px; background: var(--bead-shine), var(--thread-bead); box-shadow: 0 4px 10px rgba(42, 31, 48, .3); }
.button, .go, .tab, .tab-add, .fix, .drafts-call, .chips a, .pulse-more, .pulse-one .ava, .due-write { transition: transform .12s; }
.button:active, .go:active, .tab:active, .tab-add:active, .fix:active, .drafts-call:active,
.chips a:active, .pulse-more:active, .pulse-one:active .ava, .due-write:active { transform: scale(.97); }
.incident {
    margin: 0;
    padding: 16px;
    border-radius: 18px;
    background: var(--surface);
    color: var(--ink);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: .8125rem; line-height: 1.6;
    white-space: pre-wrap; word-break: break-word;
    -webkit-user-select: all; user-select: all;
}
.incident-act { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; }
.oops .page + .incident { margin-top: 20px; }
.oops main > .button { margin-top: 24px; }
.oops-acts { display: flex; flex-direction: column; gap: 12px; margin-top: 24px; }
.oops-also { margin-top: 16px; text-align: center; }
.oops-coda { margin-top: 32px; }
.oops-coda > h2 { margin: 0 0 12px; }
.incident-act + .caption { margin-top: 16px; }
.oops-coda > h2 + .caption { margin: 0; }
.list.support { margin-top: 12px; }
.list.support + .caption { margin-top: 12px; }
.oops-help { margin-top: 28px; text-align: center; }
.invite-card { display: flex; flex-direction: column; gap: 12px; margin-top: 20px; padding: 18px 16px 16px; border-radius: 18px; background: var(--surface); }
.invite-card h2 { margin: 0; font-size: 1.25rem; line-height: 1.25; font-weight: 600; letter-spacing: -.01em; overflow-wrap: anywhere; }
.invite-card-sub { margin-top: -8px; font-size: .8125rem; line-height: 1.4; color: var(--muted); }
.invite-card .say { margin: 0; }
.invite-url { display: block; margin-top: 6px; color: var(--accent-ink); overflow-wrap: anywhere; }
.invite-card .button { margin: 0; }
.invite-card .button[hidden] { display: none; }
.invite-preview { position: relative; align-self: center; font-size: .9375rem; font-weight: 500; color: var(--accent-ink); text-decoration: none; }
.invite-preview::after { content: ''; position: absolute; inset: -12px -8px; }
.invite-preview:active { color: var(--ink); }
.invite-card + .facts { margin-top: 16px; }
.invite-new { margin-top: 24px; }
.list.invites .invite-row {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
    padding: 14px 16px;
}
.list.invites .col { min-width: 0; flex: 1 1 auto; }
.list.invites .name { overflow-wrap: anywhere; }
.list.invites .invite-row form, .invite-acts { flex: none; }
.invite-acts { display: flex; align-items: center; gap: 16px; }
.invite-acts > .hint-action { font-size: .9375rem; font-weight: 500; }
.invite-acts > .hint-action[hidden] { display: none; }
.list.invites .sub { white-space: normal; }
.list.projects .sub { white-space: normal; }
.list.invites .done .sub { color: var(--ok); }
.list.invites .gone .name { color: var(--faint); }
.incident-act .caption { flex: 1; }
.fix.done { background: var(--ok); }
@view-transition { navigation: auto; }
@keyframes screenOut { to { opacity: 0; } }
@keyframes screenIn { from { opacity: 0; } }
:root { --screen-out: .07s; --screen-in: .14s; }
::view-transition-group(*) { animation-duration: var(--screen-in); }
::view-transition-old(root) { animation: screenOut var(--screen-out) ease-out both; }
::view-transition-new(root) { animation: screenIn var(--screen-in) ease-out both; }
.tabbar { view-transition-name: tabbar; }
.tabbar-fade { view-transition-name: tabbar-fade; }
.vt-alone { view-transition-name: none !important; }
:root:active-view-transition .tabbar {
    background: linear-gradient(var(--bar-bg), var(--bar-bg)) var(--ground);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}
.turbo-progress-bar { height: 2px; background: var(--accent-ink); }
@media (prefers-reduced-motion: reduce) {
    .row, .card > * { animation: none; }
    .one-disc { transition: none; }
    .one-act:active .one-disc { transform: none; }
    .pill-tick, .waiting i { animation: none; }
    .button, .go, .tab, .tab-add, .fix, .drafts-call, .chips a, .pulse-more, .pulse-one .ava { transition: none; }
    .button:active, .go:active, .tab:active, .tab-add:active, .fix:active, .drafts-call:active,
    .chips a:active, .pulse-more:active, .pulse-one:active .ava { transform: none; }
    .row-leaving { transition: none; }
    dialog.sheet, dialog.sheet::backdrop { transition: none; }
    dialog.sheet.sheet-float, .talk-fill, .seg-thumb, .feed-item, .feed-card, .feed-chip { transition: none; }
    dialog.tour, .tour-spot, .tour-tip { transition: none; }
    .tour-tip, .tour-tip.below { transform: none; }
    .waiting i, .waiting i .ic, body.screen-login .enter :is(.login-steps, .enter-go, .qr, .code) { transition: none; }
    .week-pane, .week-month, .cal.open .week-strip, .week-toggle .ic, .drafts-fold { transition: none; }
    .unseek .bar > :not(.seek) { animation: none; }
    .undo, .offline { animation: none; }
    .undo-drain { display: none; }
    .flash-done { animation: none; }
    .one-hint { animation: none; }
    .grew > .streak-line .streak-num b::after { display: none; }
    .thread .lands, .thread .lands::after, .thread .lands::before { animation: none; }
    .thread-first { animation: none; }
    .row-done :is(.row-text, .row-meta .when, .row-move) { transition: none; }
    @view-transition { navigation: none; }
    ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none; }
}