/* SourceRef chips, tray, picker and the connected-object popup. */
.sr-chips { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .6rem; }
.sr-chip { min-width: 0; display: inline-flex; align-items: center; max-width: 100%; gap: .35rem; padding: .35rem .75rem; border: 1px solid var(--line, rgba(128,128,128,.4)); border-radius: 999px; background: color-mix(in srgb, var(--accent, #42b9a4) 14%, transparent); color: inherit; font: inherit; font-size: .85rem; cursor: pointer; }
.sr-chip:hover { border-color: var(--accent, #42b9a4); }
.sr-chip-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sr-chip-wrap { min-width: 0; max-width: 100%; display: inline-flex; align-items: center; gap: .15rem; }
.sr-chip-x { border: 0; background: transparent; color: inherit; opacity: .6; cursor: pointer; font-size: 1rem; }
.sr-tray { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; padding: .3rem .4rem .5rem; font-size: .8rem; }
.sr-tray-label { opacity: .6; text-transform: uppercase; letter-spacing: .08em; font-size: .68rem; }
.sr-tray-add { border: 1px dashed var(--line, rgba(128,128,128,.5)); border-radius: 999px; background: transparent; color: inherit; padding: .3rem .7rem; cursor: pointer; font: inherit; font-size: .8rem; }
.sr-copy-conversation { margin-left: auto; border: 1px solid var(--line, rgba(128,128,128,.4)); border-radius: 999px; background: transparent; color: inherit; padding: .3rem .7rem; cursor: pointer; font: inherit; font-size: .78rem; white-space: nowrap; }
.sr-copy-conversation:disabled { opacity: .55; cursor: default; }
.sr-picker form { display: flex; gap: .5rem; margin-bottom: .6rem; }
.sr-picker input { flex: 1; }
.sr-picker-row { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .35rem 0; border-bottom: 1px solid var(--line, rgba(128,128,128,.25)); }
.sr-picker-name { border: 0; background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; flex: 1; }

.sr-popup-backdrop { position: fixed; inset: 0; z-index: 300; display: flex; align-items: center; justify-content: center; background: rgba(8, 10, 12, .55); backdrop-filter: blur(6px); }
.sr-popup-backdrop.is-minimized { inset: auto 1rem 1rem auto; background: transparent; backdrop-filter: none; pointer-events: none; }
.sr-popup-backdrop.is-minimized .sr-panes, .sr-popup-backdrop.is-minimized .sr-bottom { display: none; }
.sr-popup-backdrop.is-minimized .sr-popup { width: 22rem; height: auto; pointer-events: auto; }
.sr-popup { display: flex; flex-direction: column; width: min(1500px, 94vw); height: min(880px, 90vh); border: 1px solid var(--line, rgba(128,128,128,.35)); border-radius: 20px; background: var(--panel-strong, #1f2124); color: var(--ink, inherit); box-shadow: 0 30px 80px rgba(0,0,0,.45); overflow: hidden; }
.sr-popup.is-max { width: 100vw; height: 100vh; border-radius: 0; }
.sr-head { display: flex; align-items: center; gap: .7rem; padding: .7rem 1rem; border-bottom: 1px solid var(--line, rgba(128,128,128,.3)); }
.sr-head-kicker { font-size: .68rem; letter-spacing: .1em; opacity: .6; }
.sr-head-crumb { flex: 1; font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sr-head-tools { display: inline-flex; gap: .4rem; align-items: center; }
.sr-head-tools .ghost { padding: .25rem .6rem; border: 1px solid var(--line, rgba(128,128,128,.4)); border-radius: 10px; text-decoration: none; color: inherit; background: transparent; cursor: pointer; }
.sr-panes { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(16rem, 22%) minmax(0, 1fr) minmax(16rem, 24%); }
.sr-left, .sr-right { padding: .9rem 1rem; overflow: auto; border-right: 1px solid var(--line, rgba(128,128,128,.25)); }
.sr-right { border-right: 0; border-left: 1px solid var(--line, rgba(128,128,128,.25)); }
.sr-left h3, .sr-right h3 { margin: 0 0 .6rem; font-size: .7rem; letter-spacing: .1em; opacity: .65; }
.sr-left-convo { display: flex; flex-direction: column; gap: .5rem; max-height: calc(100% - 2rem); overflow: auto; }
.sr-left-msg { font-size: .85rem; line-height: 1.4; padding: .5rem .7rem; border-radius: 12px; background: color-mix(in srgb, var(--ink, #ccc) 8%, transparent); white-space: pre-wrap; }
.sr-left-msg.user { align-self: flex-end; background: color-mix(in srgb, var(--accent, #42b9a4) 18%, transparent); }
.sr-mid { min-width: 0; min-height: 0; display: flex; flex-direction: column; padding: .6rem; }
.sr-sync { min-height: 1.4rem; margin: 0 0 .3rem; font-size: .8rem; opacity: .85; }
.sr-sync[data-state="saved"] { color: #3fb27f; } .sr-sync[data-state="local"] { color: #d9a13a; } .sr-sync[data-state="conflict"] { color: #d35b50; }
.sr-work { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: .5rem; overflow: auto; }
.sr-tabs { display: flex; gap: .3rem; }
.sr-tab { border: 1px solid var(--line, rgba(128,128,128,.4)); border-bottom: 0; border-radius: 8px 8px 0 0; background: transparent; color: inherit; padding: .3rem .8rem; cursor: pointer; font: inherit; font-size: .82rem; }
.sr-tab.is-active { background: color-mix(in srgb, var(--accent, #42b9a4) 18%, transparent); }
.sr-grid-wrap { overflow: auto; border: 1px solid var(--line, rgba(128,128,128,.35)); border-radius: 8px; }
.sr-grid { border-collapse: collapse; font-size: .82rem; font-variant-numeric: tabular-nums; }
.sr-grid th { position: sticky; top: 0; background: color-mix(in srgb, var(--ink, #ccc) 10%, var(--panel-strong, #1f2124)); font-weight: 600; font-size: .72rem; padding: .25rem .5rem; border: 1px solid var(--line, rgba(128,128,128,.25)); }
.sr-grid th:first-child { left: 0; z-index: 1; }
.sr-cell { min-width: 6.5rem; height: 1.7rem; padding: 0 .5rem; border: 1px solid var(--line, rgba(128,128,128,.25)); white-space: nowrap; }
.sr-cell.is-selected { outline: 2px solid var(--accent, #42b9a4); outline-offset: -2px; }
.sr-cell.is-dirty { background: color-mix(in srgb, #d9a13a 18%, transparent); }
.sr-cell input { width: 100%; box-sizing: border-box; border: 0; background: transparent; color: inherit; font: inherit; outline: none; }
.sr-conflict { padding: .6rem .8rem; border: 1px solid #d35b50; border-radius: 12px; display: flex; flex-direction: column; gap: .4rem; }
.sr-zana { display: flex; flex-direction: column; gap: .6rem; font-size: .88rem; }
.sr-nochange { font-weight: 650; }
.sr-receipt { padding: .5rem .7rem; border-radius: 10px; background: color-mix(in srgb, #3fb27f 16%, transparent); }
.sr-facts { margin: 0; padding-left: 1.1rem; opacity: .85; }
.sr-object { padding: 1rem; } .sr-object h2 { margin: 0 0 .8rem; font-size: 1.2rem; }
.sr-fact { display: flex; justify-content: space-between; gap: 1rem; padding: .35rem 0; border-bottom: 1px solid var(--line, rgba(128,128,128,.2)); }
.sr-empty { padding: 1rem; opacity: .75; }
.sr-bottom { display: flex; align-items: center; gap: .6rem; padding: .6rem 1rem; border-top: 1px solid var(--line, rgba(128,128,128,.3)); }
.sr-popup-voice-host:empty { display: none; }
.sr-popup-voice-host { padding: 0 .8rem; }
.sr-popup-voice-host #voice-modes-panel:not([hidden]) { display: block !important; visibility: visible !important; position: relative; inset: auto; z-index: 2; margin: .35rem 0; padding: .35rem .5rem; border: 1px solid var(--line,rgba(128,128,128,.3)); border-radius: 12px; background: var(--panel, #202326); color: inherit; box-shadow: none; }
.sr-bottom .sr-voice { border: 1px solid var(--line, rgba(128,128,128,.4)); border-radius: 999px; padding: .4rem .9rem; background: transparent; color: inherit; cursor: pointer; }
.sr-bottom-tray { display: inline-flex; gap: .3rem; flex-wrap: wrap; max-width: 40%; }
.sr-ask { flex: 1; display: flex; gap: .5rem; } .sr-ask input { flex: 1; padding: .55rem .9rem; border-radius: 999px; border: 1px solid var(--line, rgba(128,128,128,.4)); background: transparent; color: inherit; }
body.sr-popup-open { overflow: hidden; }
@media (max-width: 980px) { .sr-panes { grid-template-columns: 1fr; } .sr-left, .sr-right { display: none; } }

/* Calendar workspace */
.cal-bar { display: flex; align-items: center; gap: .8rem; flex-wrap: wrap; }
.cal-nav { display: inline-flex; align-items: center; gap: .3rem; } .cal-title { margin-left: .5rem; font-size: 1rem; }
.cal-bar .ghost, .cal-tools .ghost { padding: .28rem .7rem; border: 1px solid var(--line, rgba(128,128,128,.4)); border-radius: 10px; background: transparent; color: inherit; cursor: pointer; font: inherit; font-size: .82rem; }
.cal-bar .ghost.is-on, .cal-tools .ghost.is-on { background: color-mix(in srgb, var(--accent, #42b9a4) 22%, transparent); border-color: var(--accent, #42b9a4); }
.cal-views { display: inline-flex; gap: .25rem; } .cal-search { margin-left: auto; padding: .3rem .8rem; border-radius: 999px; border: 1px solid var(--line, rgba(128,128,128,.4)); background: transparent; color: inherit; }
.cal-tools { display: flex; gap: .4rem; flex-wrap: wrap; margin: .4rem 0; }
.cal-tools .ghost:disabled { opacity: .45; cursor: not-allowed; }
.cal-body { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.cal-allday { padding: .3rem .6rem; font-size: .8rem; opacity: .8; border-bottom: 1px solid var(--line, rgba(128,128,128,.25)); }
.cal-grid-wrap { flex: 1; min-height: 0; overflow: auto; border: 1px solid var(--line, rgba(128,128,128,.3)); border-radius: 10px; }
.cal-grid { display: grid; grid-template-columns: 3.4rem 1fr; min-width: 40rem; }
.cal-gutter { padding-top: 1.9rem; } .cal-hour { height: 48px; font-size: .68rem; opacity: .6; text-align: right; padding-right: .4rem; box-sizing: border-box; }
.cal-cols { display: grid; grid-template-columns: repeat(var(--cols), 1fr); }
.cal-col { border-left: 1px solid var(--line, rgba(128,128,128,.25)); min-width: 0; }
.cal-colhead { position: sticky; top: 0; z-index: 3; height: 1.9rem; display: flex; align-items: center; justify-content: center; font-size: .78rem; font-weight: 600; background: var(--panel-strong, #1f2124); border-bottom: 1px solid var(--line, rgba(128,128,128,.25)); }
.cal-lane { position: relative; background-image: repeating-linear-gradient(to bottom, transparent 0, transparent 47px, var(--line, rgba(128,128,128,.22)) 47px, var(--line, rgba(128,128,128,.22)) 48px); }
.cal-ev { position: absolute; box-sizing: border-box; padding: .2rem .4rem; border-radius: 8px; overflow: hidden; cursor: grab; font-size: .76rem; line-height: 1.25; background: color-mix(in srgb, var(--accent, #42b9a4) 28%, var(--panel-strong, #1f2124)); border: 1px solid color-mix(in srgb, var(--accent, #42b9a4) 65%, transparent); touch-action: none; z-index: 2; }
.cal-ev.is-risk { background: color-mix(in srgb, #d35b50 30%, var(--panel-strong, #1f2124)); border-color: #d35b50; }
.cal-ev.is-selected { outline: 2px solid var(--ink, #fff); }
.cal-ev-title, .cal-ev-time { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cal-ev-title { font-weight: 650; } .cal-ev-time { opacity: .8; font-size: .68rem; }
.cal-ev, .cal-ghost { container-type: inline-size; }
.cal-ev.is-short .cal-ev-time, .cal-ghost.is-short .cal-ev-time { display: none; }
@container (max-width: 76px) { .cal-ev-time { display: none; } }
.cal-ev-resize { position: absolute; left: 0; right: 0; bottom: 0; height: 6px; cursor: ns-resize; }
.cal-ghost { position: absolute; box-sizing: border-box; padding: .2rem .4rem; border-radius: 8px; overflow: hidden; border: 2px dashed #3fb27f; background: color-mix(in srgb, #3fb27f 28%, var(--panel-strong, #1f2124)); font-size: .76rem; line-height: 1.25; z-index: 3; cursor: pointer; }
.cal-month { display: grid; grid-template-columns: repeat(7, 1fr); gap: 1px; background: var(--line, rgba(128,128,128,.25)); border: 1px solid var(--line, rgba(128,128,128,.25)); border-radius: 10px; overflow: hidden; flex: 1; min-height: 0; overflow-y: auto; }
.cal-mh { padding: .3rem; text-align: center; font-size: .72rem; background: var(--panel-strong, #1f2124); opacity: .8; }
.cal-mc { min-height: 5.5rem; padding: .25rem; background: var(--panel-strong, #1f2124); display: flex; flex-direction: column; gap: 2px; cursor: pointer; } .cal-mc.is-out { opacity: .45; }
.cal-mn { font-size: .72rem; opacity: .7; } .cal-more { font-size: .68rem; opacity: .6; }
.cal-mev { text-align: left; border: 0; border-radius: 4px; padding: 1px 4px; font-size: .7rem; background: color-mix(in srgb, var(--accent, #42b9a4) 30%, transparent); color: inherit; cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .cal-mev.is-risk { background: color-mix(in srgb, #d35b50 40%, transparent); }
.sr-risk { padding: .5rem .7rem; border-radius: 10px; border: 1px solid #d35b50; background: color-mix(in srgb, #d35b50 14%, transparent); margin: 0; }
.sr-proposal { border: 1px solid #3fb27f; border-radius: 12px; padding: .7rem .8rem; display: flex; flex-direction: column; gap: .3rem; background: color-mix(in srgb, #3fb27f 10%, transparent); }
.sr-proposal h4 { margin: 0 0 .2rem; } .sr-proposal .sr-fact { flex-direction: column; gap: .05rem; border: 0; padding: .15rem 0; } .sr-proposal .sr-fact span { font-size: .7rem; opacity: .65; text-transform: uppercase; letter-spacing: .06em; }
.sr-basis { margin: .2rem 0; font-size: .72rem; opacity: .65; } .sr-question { margin: 0; font-weight: 600; }
.cal-acts { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .4rem; } .cal-acts .ghost, .cal-acts .primary { padding: .3rem .7rem; border-radius: 10px; font: inherit; font-size: .8rem; cursor: pointer; }
.cal-acts .ghost { border: 1px solid var(--line, rgba(128,128,128,.4)); background: transparent; color: inherit; text-decoration: none; }
.cal-edit, .cal-create { display: flex; flex-direction: column; gap: .4rem; margin-top: .5rem; } .cal-edit input, .cal-create input { padding: .35rem .6rem; border-radius: 8px; border: 1px solid var(--line, rgba(128,128,128,.4)); background: transparent; color: inherit; }
.cal-sel-title { margin: 0; font-size: 1rem; }

/* ---- shell v2: movable panes, back navigation, file-system views ---- */
.sr-panes { grid-template-columns: var(--sr-left, 300px) 6px minmax(0, 1fr) 6px var(--sr-right, 330px); position: relative; }
.sr-left[hidden], .sr-right[hidden], .sr-divider[hidden] { display: none !important; }
.sr-left, .sr-right { min-width: 0; }
.sr-divider { cursor: col-resize; background: transparent; position: relative; touch-action: none; }
.sr-divider::after { content: ""; position: absolute; top: 10%; bottom: 10%; left: 2px; width: 2px; border-radius: 2px; background: var(--line, rgba(128,128,128,.35)); }
.sr-divider:hover::after { background: var(--accent, #42b9a4); width: 3px; left: 1.5px; }
.sr-popup-backdrop.is-resizing { user-select: none; }
.sr-pane-head { display: flex; align-items: center; justify-content: space-between; }
.sr-collapse { border: 0; background: transparent; color: inherit; opacity: .55; cursor: pointer; font-size: 1.1rem; padding: 0 .3rem; } .sr-collapse:hover { opacity: 1; }
.sr-reopen { position: absolute; top: .5rem; z-index: 4; border: 1px solid var(--line, rgba(128,128,128,.4)); border-radius: 999px; background: var(--panel-strong, #1f2124); color: inherit; padding: .2rem .7rem; font: inherit; font-size: .75rem; cursor: pointer; }
.sr-reopen-left { left: .5rem; } .sr-reopen-right { right: .5rem; }
.sr-back { padding: .25rem .7rem; border: 1px solid var(--line, rgba(128,128,128,.4)); border-radius: 10px; background: transparent; color: inherit; cursor: pointer; font: inherit; font-size: .85rem; }
.sr-toolbar { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin-bottom: .5rem; }
.sr-search { flex: 1 1 14rem; } .sr-search input { width: 100%; box-sizing: border-box; padding: .5rem .9rem; border-radius: 999px; border: 1px solid var(--line, rgba(128,128,128,.4)); background: transparent; color: inherit; font: inherit; }
.sr-filters { display: flex; gap: .25rem; flex-wrap: wrap; }
.sr-filter, .sr-viewbtn { padding: .25rem .7rem; border: 1px solid var(--line, rgba(128,128,128,.4)); border-radius: 999px; background: transparent; color: inherit; cursor: pointer; font: inherit; font-size: .78rem; }
.sr-filter.is-on, .sr-viewbtn.is-on { background: color-mix(in srgb, var(--accent, #42b9a4) 22%, transparent); border-color: var(--accent, #42b9a4); }
.sr-toolbar-right { margin-left: auto; display: inline-flex; gap: .3rem; align-items: center; }
.sr-sort { padding: .25rem .5rem; border-radius: 8px; border: 1px solid var(--line, rgba(128,128,128,.4)); background: transparent; color: inherit; font: inherit; font-size: .78rem; }
.sr-crumbs { display: flex; align-items: center; gap: .15rem; flex-wrap: wrap; margin-bottom: .4rem; font-size: .85rem; }
.sr-crumb { border: 0; background: transparent; color: inherit; padding: .15rem .4rem; border-radius: 6px; cursor: pointer; font: inherit; } .sr-crumb:hover:not(:disabled) { background: color-mix(in srgb, var(--accent, #42b9a4) 18%, transparent); } .sr-crumb:disabled { font-weight: 650; cursor: default; } .sr-crumb-sep { opacity: .4; }
.sr-entries { flex: 1; min-height: 0; overflow: auto; border: 1px solid var(--line, rgba(128,128,128,.3)); border-radius: 12px; }
.sr-entries.is-list .sr-entry { display: grid; grid-template-columns: 2.6rem minmax(0, 1fr) 9rem 5rem 6rem; align-items: center; gap: .6rem; padding: .45rem .8rem; border-bottom: 1px solid var(--line, rgba(128,128,128,.18)); cursor: pointer; }
.sr-entries.is-list .sr-entry:hover:not(.sr-entry-head) { background: color-mix(in srgb, var(--accent, #42b9a4) 10%, transparent); }
.sr-entry-head { font-size: .68rem; text-transform: uppercase; letter-spacing: .08em; opacity: .6; cursor: default !important; position: sticky; top: 0; background: var(--panel-strong, #1f2124); z-index: 1; }
.sr-entry-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 550; } .sr-entry-when, .sr-entry-size { font-size: .78rem; opacity: .7; }
.sr-entry-act .ghost { padding: .2rem .6rem; border: 1px solid var(--line, rgba(128,128,128,.4)); border-radius: 8px; background: transparent; color: inherit; cursor: pointer; font: inherit; font-size: .75rem; }
.sr-entries.is-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(10.5rem, 1fr)); gap: .7rem; padding: .7rem; align-content: start; border: 0; }
.sr-entries.is-grid .sr-entry { display: flex; flex-direction: column; gap: .4rem; padding: .8rem; border: 1px solid var(--line, rgba(128,128,128,.3)); border-radius: 14px; cursor: pointer; } .sr-entries.is-grid .sr-entry:hover { border-color: var(--accent, #42b9a4); }
.sr-entries.is-grid .sr-badge { width: 3rem; height: 3rem; font-size: .8rem; }
.sr-badge { display: inline-flex; align-items: center; justify-content: center; width: 2.2rem; height: 1.7rem; border-radius: 6px; font-size: .62rem; font-weight: 800; letter-spacing: .04em; color: #fff; background: #6b7280; }
.sr-badge-folder { background: #b8892b; } .sr-badge-sheet { background: #1e8e5a; } .sr-badge-doc { background: #3b6fd4; } .sr-badge-slides { background: #d08a1c; } .sr-badge-repo { background: #5b4bb5; } .sr-badge-code { background: #475569; } .sr-badge-mail { background: #c0443a; }
.sr-doc { max-width: 46rem; margin: 0 auto; padding: 1.2rem; line-height: 1.6; } .sr-doc h2 { margin-top: 0; }
.sr-slides { display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: .8rem; padding: .4rem; overflow: auto; }
.sr-slide { aspect-ratio: 16 / 9; border: 1px solid var(--line, rgba(128,128,128,.35)); border-radius: 10px; padding: .7rem; position: relative; overflow: hidden; background: color-mix(in srgb, var(--ink, #ccc) 6%, transparent); font-size: .8rem; } .sr-slide-n { position: absolute; top: .3rem; right: .5rem; font-size: .7rem; opacity: .6; }
.sr-code { flex: 1; min-height: 0; overflow: auto; border: 1px solid var(--line, rgba(128,128,128,.3)); border-radius: 10px; font: .8rem/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; }
.sr-code-line { display: flex; } .sr-code-n { flex: 0 0 3.2rem; text-align: right; padding-right: .8rem; opacity: .45; user-select: none; } .sr-code-t { white-space: pre; }
.sr-mailbar { display: flex; flex-direction: column; gap: .5rem; margin-bottom: .6rem; }
.sr-mail-search input { width: 100%; padding: .7rem 1rem; font-size: 1rem; border-radius: 999px; }
.sr-mail { flex: 1; min-height: 0; overflow: auto; border: 1px solid var(--line, rgba(128,128,128,.3)); border-radius: 12px; contain: content; }
.sr-mail-row { --st: #8b8f94; display: grid; grid-template-columns: .5rem 12rem minmax(0, 1fr) auto; align-items: center; gap: .7rem; width: 100%; text-align: left; padding: .55rem .9rem .55rem .6rem; border: 0; border-bottom: 1px solid var(--line, rgba(128,128,128,.18)); background: transparent; color: inherit; cursor: pointer; font: inherit; content-visibility: auto; contain-intrinsic-size: 2.6rem; }
.sr-mail-row:hover { background: color-mix(in srgb, var(--st) 12%, transparent); }
.sr-mail-dot { width: .5rem; height: .5rem; border-radius: 50%; background: var(--st); }
.sr-st-red { --st: #e5484d; } .sr-st-orange { --st: #f5a524; } .sr-st-green { --st: #3dba6f; } .sr-st-gray { --st: #8b8f94; }
.sr-mail-row.sr-st-gray { opacity: .72; } .sr-mail-row.sr-st-gray.is-unread { opacity: 1; }
.sr-mail-from { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; opacity: .85; }
.sr-mail-count { margin-left: .35rem; font-size: .75rem; opacity: .6; }
.sr-mail-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.sr-mail-subject { font-weight: 450; } .sr-mail-snippet { opacity: .6; font-size: .88rem; }
.sr-mail-row.is-unread .sr-mail-from, .sr-mail-row.is-unread .sr-mail-subject, .sr-mail-row.is-unread .sr-mail-time { font-weight: 700; opacity: 1; }
.sr-mail-time { font-size: .8rem; opacity: .7; white-space: nowrap; font-variant-numeric: tabular-nums; }
.sr-mail-more { padding: .6rem; text-align: center; }
.sr-filter.sr-st-red.is-on { border-color: #e5484d; } .sr-filter.sr-st-orange.is-on { border-color: #f5a524; } .sr-filter.sr-st-green.is-on { border-color: #3dba6f; }
.sr-systems { margin-top: 1rem; display: flex; flex-direction: column; gap: .5rem; } .sr-systems h4 { margin: 0; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; opacity: .7; }
.sr-system-btn { display: flex; justify-content: space-between; align-items: center; gap: .6rem; width: 100%; text-align: left; }
.sr-pill-off { opacity: .6; }
.sr-msg header { cursor: pointer; display: flex; justify-content: space-between; gap: 1rem; }
.sr-msg .sr-msg-content { display: none; } .sr-msg.is-open .sr-msg-content { display: block; }
.sr-msg.is-unread header strong { font-weight: 800; }
.sr-mail-frame { width: 100%; border: 0; border-radius: 8px; background: #161d1a; display: block; min-height: 80px; }
.sr-mail-row.is-unread { background: color-mix(in srgb, #3dba6f 14%, transparent); box-shadow: inset 3px 0 0 #3dba6f; }
.sr-mail-row.is-important { background: color-mix(in srgb, #e5484d 14%, transparent); box-shadow: inset 3px 0 0 #e5484d; }
.sr-reply-guidance { margin-top: .4rem; }
.sr-mail-dismiss { justify-self: end; min-width: 1.6rem; padding: 0 .2rem; }
.sr-open-gmail { display: inline-flex; align-items: center; justify-content: center; width: 100%; margin-bottom: .45rem; text-decoration: none; }
.sr-draft { border-left: 3px solid #f5a524; } .sr-draft .sr-msg-body { white-space: pre-wrap; }
.sr-hint { font-size: .8rem; opacity: .65; }
@media (max-width: 760px) { .sr-mail-row { grid-template-columns: .5rem minmax(0, 1fr) auto; } .sr-mail-from { grid-column: 2; } .sr-mail-text { grid-column: 2 / 4; grid-row: 2; } }
.sr-thread { padding: .6rem 1rem; overflow: auto; } .sr-thread h2 { margin: 0 0 .8rem; } .sr-msg { border: 1px solid var(--line, rgba(128,128,128,.3)); border-radius: 12px; padding: .7rem .9rem; margin-bottom: .7rem; } .sr-msg header { display: flex; justify-content: space-between; font-size: .85rem; margin-bottom: .4rem; } .sr-msg-body { white-space: pre-wrap; font-size: .9rem; line-height: 1.5; }
.sr-zana-page { padding: 1rem; } .sr-card { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .7rem .9rem; border: 1px solid var(--line, rgba(128,128,128,.3)); border-radius: 12px; margin-bottom: .5rem; } .sr-pill { font-size: .75rem; padding: .15rem .6rem; border-radius: 999px; background: color-mix(in srgb, #3fb27f 22%, transparent); } .sr-pill-paused { background: color-mix(in srgb, #d9a13a 25%, transparent); }
@media (max-width: 980px) { .sr-panes { grid-template-columns: 1fr; } .sr-divider { display: none; } .sr-entries.is-list .sr-entry { grid-template-columns: 2.4rem minmax(0, 1fr) 5rem; } .sr-entry-when { display: none; } }

/* Calendar v2: 24h day, endless horizontal scroll, current-time line, vertical-scrolling month */
.cal-grid { display: grid; grid-template-columns: 56px max-content; width: max-content; min-width: 100%; }
.cal-grid-wrap:not(.is-inf) .cal-grid { width: 100%; grid-template-columns: 56px minmax(0, 1fr); }
.cal-grid-wrap { flex: 1; min-height: 0; overflow: auto; border: 1px solid var(--line, rgba(128,128,128,.3)); border-radius: 10px; overscroll-behavior: contain; }
.cal-gutter { position: sticky; left: 0; z-index: 6; background: var(--panel-strong, #1f2124); padding-top: 0; }
.cal-gutter-head { height: 1.9rem; position: sticky; top: 0; z-index: 7; background: var(--panel-strong, #1f2124); border-bottom: 1px solid var(--line, rgba(128,128,128,.25)); }
.cal-hour { height: 48px; font-size: .68rem; opacity: .6; text-align: right; padding-right: .4rem; box-sizing: border-box; transform: translateY(-.45rem); }
.cal-col.is-today .cal-colhead { color: #d35b50; }
.cal-colhead { position: sticky; top: 0; z-index: 4; }
.cal-now { position: absolute; left: 0; right: 0; height: 0; border-top: 2px solid #ea4335; z-index: 5; pointer-events: none; }
.cal-now-dot { position: absolute; left: -5px; top: -6px; width: 10px; height: 10px; border-radius: 50%; background: #ea4335; }
.cal-inf.is-on { background: color-mix(in srgb, var(--accent, #42b9a4) 22%, transparent); border-color: var(--accent, #42b9a4); }
.cal-month { display: flex; flex-direction: column; overflow: auto; flex: 1; min-height: 0; border: 1px solid var(--line, rgba(128,128,128,.25)); border-radius: 10px; background: none; gap: 0; }
.cal-mhrow { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); position: sticky; top: 0; z-index: 3; background: var(--panel-strong, #1f2124); }
.cal-mgrid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); grid-auto-rows: minmax(6.5rem, auto); gap: 1px; background: var(--line, rgba(128,128,128,.25)); }
.cal-mc.is-today .cal-mn { background: #ea4335; color: #fff; border-radius: 999px; padding: 0 .4rem; align-self: flex-start; }

/* Phones: the Attached tray is one scrollable row so long filenames never widen the page or eat the composer. */
@media (max-width: 980px) {
  .sr-tray { flex-wrap: nowrap; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; min-width: 0; max-width: 100%; }
  .sr-tray::-webkit-scrollbar { display: none; }
  .sr-tray > * { flex: 0 0 auto; }
  .sr-tray .sr-chip-wrap { flex: 0 1 auto; max-width: 70vw; }
}

.sr-left-trail { display: flex; flex-direction: column; gap: .35rem; padding: .5rem .7rem; border-radius: 12px; background: color-mix(in srgb, var(--accent, #42b9a4) 10%, transparent); font-size: .85rem; }
.sr-left-step { display: flex; flex-direction: column; opacity: .7; } .sr-left-step.is-current { opacity: 1; } .sr-left-step span { font-size: .78rem; opacity: .75; }
.sr-mailbar, .sr-mailbar .sr-search, .sr-mailbar .sr-filters { flex: 0 0 auto; }
.sr-mailbar .sr-search { min-height: 0; height: auto; }
.sr-left { display: flex; flex-direction: column; min-height: 0; }
.sr-left-convo.is-live { flex: 1 1 auto; min-height: 0; max-height: none; overflow: hidden; display: block; }
.sr-left-convo.is-live #messages.in-popup { height: 100%; max-height: none; overflow-y: auto; padding: .4rem .5rem; margin: 0; display: block !important; font-size: .9rem; }
.sr-left-convo.is-live #messages.in-popup .msg-row { max-width: 100%; }
.sr-dropzone { flex: 0 0 auto; margin: .5rem; padding: .7rem .6rem; border: 1.5px dashed color-mix(in srgb, var(--ink, #ccc) 35%, transparent); border-radius: 12px; text-align: center; font-size: .8rem; opacity: .75; }
.sr-dropzone.is-over, body.sr-dragging .sr-dropzone { border-color: var(--accent, #42b9a4); background: color-mix(in srgb, var(--accent, #42b9a4) 12%, transparent); opacity: 1; }
.sr-quick { display: flex; gap: .4rem; margin-top: .4rem; } .sr-quick button { padding: .3rem .9rem; border-radius: 999px; }
.sr-looking { margin: 0 .5rem .4rem; padding: .35rem .6rem; border-radius: 10px; font-size: .78rem; background: color-mix(in srgb, var(--accent, #42b9a4) 18%, transparent); border: 1px solid color-mix(in srgb, var(--accent, #42b9a4) 45%, transparent); }
.cal-creating { position: absolute; left: 4%; width: 92%; border: 2px dashed var(--accent, #42b9a4); border-radius: 8px; background: color-mix(in srgb, var(--accent, #42b9a4) 14%, transparent); padding: 2px 6px; pointer-events: none; z-index: 3; font-size: .78rem; overflow: hidden; }
.cal-ev.is-past { opacity: .62; } .cal-ev.is-handled { opacity: .8; box-shadow: inset 3px 0 0 #3dba6f; } .cal-ev.is-missed { opacity: .8; box-shadow: inset 3px 0 0 #e5484d; }
.sr-handled { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; margin: .5rem 0; } .sr-handled .is-on { border-color: var(--accent, #42b9a4); }
.sr-question { padding: .6rem .7rem; border: 1px solid #f5a524; border-radius: 10px; margin: .5rem 0; background: color-mix(in srgb, #f5a524 10%, transparent); }
.sr-assist h4, .sr-reply h4 { margin: .2rem 0 .4rem; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; opacity: .7; }
.sr-reply { margin-top: .8rem; padding-top: .6rem; border-top: 1px solid var(--line, rgba(128,128,128,.25)); }
.sr-reply-text { white-space: pre-wrap; padding: .6rem .7rem; border-radius: 10px; background: color-mix(in srgb, var(--ink, #ccc) 8%, transparent); font-size: .9rem; }
.sr-reply-edit { width: 100%; box-sizing: border-box; font: inherit; padding: .6rem; border-radius: 10px; }
@media (min-width: 981px) {
  #workspace.workspace #mobile-menu .mobile-menu-panel { position: absolute !important; top: calc(100% + .5rem) !important; right: 0 !important; left: auto !important; width: 15rem !important; max-height: 70vh; gap: .25rem !important; padding: .45rem !important; z-index: 300 !important; }
  #mobile-menu-actions { display: grid !important; gap: .2rem !important; }
  #mobile-menu-actions > * { min-height: 0 !important; height: auto !important; padding: .5rem .8rem !important; font-size: .9rem !important; text-align: left !important; border-radius: .6rem !important; justify-content: flex-start !important; }
}
.sr-mobile-tabs { display: none; }
@media (max-width: 980px) {
  .sr-mobile-tabs { display: flex; gap: .3rem; padding: .35rem .6rem; border-bottom: 1px solid var(--line, rgba(128,128,128,.25)); }
  .sr-mobile-tabs button { flex: 1; padding: .4rem; } .sr-mobile-tabs .is-on { border-color: var(--accent, #42b9a4); }
  .sr-panes .sr-left, .sr-panes .sr-mid, .sr-panes .sr-right { display: none !important; }
  .sr-panes[data-pane="left"] .sr-left, .sr-panes[data-pane="mid"] .sr-mid, .sr-panes[data-pane="right"] .sr-right { display: flex !important; flex-direction: column; min-height: 0; }
  .sr-panes[data-pane="right"] .sr-right { display: block !important; overflow: auto; }
  .sr-panes[hidden] { display: none; } .sr-reopen { display: none !important; }
  .sr-dropzone { display: none; }
}
.sr-sysmgr { display: flex; flex-direction: column; gap: .6rem; min-width: 0; }
.sr-sysmgr h3 { margin: .8rem 0 .2rem; font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; opacity: .75; }
.sr-tabs { display: flex; gap: .3rem; flex-wrap: wrap; } .sr-tabs .is-on { border-color: var(--accent, #42b9a4); }
.sr-systable-wrap { overflow-x: auto; border: 1px solid var(--line, rgba(128,128,128,.3)); border-radius: 12px; }
.sr-systable { border-collapse: collapse; width: 100%; min-width: 860px; font-size: .88rem; }
.sr-systable th { text-align: left; font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; opacity: .65; padding: .5rem .7rem; }
.sr-systable td { vertical-align: top; padding: .65rem .7rem; border-top: 1px solid var(--line, rgba(128,128,128,.2)); }
.sr-systable tr.is-focus td { background: color-mix(in srgb, var(--accent, #42b9a4) 10%, transparent); }
.sr-goal { max-width: 20rem; } .sr-sub { font-size: .78rem; opacity: .7; }
.sr-statuspill { display: inline-flex; align-items: center; gap: .4rem; white-space: nowrap; }
.sr-sysdot { width: .55rem; height: .55rem; border-radius: 50%; display: inline-block; background: #8b8f94; } .sr-sysdot.is-green { background: #3dba6f; } .sr-sysdot.is-amber { background: #f5a524; } .sr-sysdot.is-orange { background: #e2703a; }
.sr-progress-box { min-width: 9rem; } .sr-progress { height: .45rem; border-radius: 99px; background: var(--line, rgba(128,128,128,.25)); overflow: hidden; } .sr-progress i { display: block; height: 100%; background: var(--accent, #42b9a4); } .sr-progress-text { font-size: .75rem; opacity: .7; }
.sr-bottleneck { display: flex; flex-direction: column; margin-bottom: .35rem; } .sr-bottleneck span { font-size: .78rem; opacity: .75; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.sr-bott-cell { max-width: 16rem; }
.sr-systable td { height: auto; }
.sr-systable tbody tr { content-visibility: auto; contain-intrinsic-size: auto 4.5rem; }
.sr-acts { display: flex; flex-direction: column; gap: .3rem; min-width: 7.5rem; } .sr-acts button { padding: .3rem .7rem; }
.sr-needs { display: grid; gap: .5rem; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); }

/* Systems manager polish: readable left conversation and stacked needs-you cards */
.sr-left-convo.is-live #messages.in-popup .msg-row { display: block; width: 100%; max-width: 100%; margin: 0 0 .5rem; padding: 0; }
.sr-left-convo.is-live #messages.in-popup .bubble { width: 100%; max-width: 100%; margin: 0; padding: .5rem .65rem; box-sizing: border-box; font-size: .85rem; line-height: 1.4; overflow-wrap: anywhere; }
.sr-left-convo.is-live #messages.in-popup .bubble * { max-width: 100%; }
.sr-needs .sr-card { display: flex; flex-direction: column; align-items: flex-start; gap: .35rem; padding: .7rem .8rem; }
.sr-needs .sr-card strong { font-size: .85rem; }
.sr-needs .sr-card p { margin: 0; font-size: .82rem; line-height: 1.4; opacity: .85; }
.sr-needs .sr-card button { margin-top: .2rem; }

/* Person workspace */
.sr-person-mid { display: flex; flex-direction: column; gap: .8rem; }
.sr-knowing { display: flex; flex-direction: column; gap: .7rem; }
.sr-knowing-title { margin: 0; font-size: 1.05rem; }
.sr-knowing-log { display: flex; flex-direction: column; gap: .55rem; max-height: 28rem; overflow: auto; }
.sr-knowing-zana, .sr-knowing-you { margin: 0; line-height: 1.45; }
.sr-knowing-you { opacity: .9; }
.sr-knowing-form { display: flex; flex-direction: column; gap: .4rem; }
.sr-knowing-form textarea { width: 100%; resize: vertical; }
.sr-knowing-status { margin: 0; font-size: .78rem; }
.sr-person-head { margin: .8rem 0 0; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; opacity: .7; }
.sr-person-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: .6rem; }
.sr-person-card { display: flex; flex-direction: column; align-items: flex-start; gap: .2rem; padding: .7rem .85rem; border-radius: 12px; border: 1px solid var(--line, rgba(128,128,128,.25)); background: color-mix(in srgb, var(--ink, #ccc) 5%, transparent); color: inherit; font: inherit; text-align: left; cursor: pointer; line-height: 1.4; }
.sr-person-card strong { font-size: .95rem; } .sr-person-card span { font-size: .85rem; opacity: .85; }
.sr-person-card.is-selected { border-color: var(--accent,#42b9a4); }
.sr-person-relation { font-weight: 600; }
.sr-person-card-field { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.sr-person-portrait { font-size: 1rem; line-height: 1.65; max-width: 68ch; }
@keyframes sr-person-in { from { opacity: 0; transform: translateY(8px) scale(.97); background: color-mix(in srgb, var(--accent, #42b9a4) 28%, transparent); } to { opacity: 1; transform: none; } }
.sr-person-right { display: flex; flex-direction: column; gap: .7rem; }
.sr-person-editor { display: flex; flex-direction: column; gap: .6rem; }
.sr-person-field { display: flex; flex-direction: column; gap: .25rem; font-size: .78rem; }
.sr-person-field textarea,.sr-person-field input { box-sizing: border-box; width: 100%; min-height: 2.4rem; border: 1px solid var(--line,rgba(128,128,128,.3)); border-radius: 9px; padding: .5rem .6rem; background: transparent; color: inherit; font: inherit; }
.sr-person-new { align-self: flex-start; }
.sr-person-hint { margin: 0; font-size: .78rem; opacity: .65; line-height: 1.4; }

/* Human takeover */
.sr-takeover { width: min(1100px, 94vw); max-height: 94vh; display: flex; flex-direction: column; gap: .6rem; padding: 1rem; border-radius: 18px; background: var(--panel-strong, #1f2124); color: var(--ink, #eee); border: 1px solid var(--line, rgba(128,128,128,.3)); overflow: auto; }
.sr-takeover-head { display: flex; flex-wrap: wrap; gap: .6rem; align-items: baseline; } .sr-takeover-reason { opacity: .75; }
.sr-takeover-frame { width: 100%; aspect-ratio: 16 / 9; object-fit: contain; background: #000; border-radius: 10px; cursor: pointer; outline: none; }
.sr-takeover-frame:focus { box-shadow: 0 0 0 2px var(--accent, #42b9a4); }
.sr-takeover-note, .sr-takeover-status { margin: 0; font-size: .85rem; opacity: .8; } .sr-takeover-actions { display: flex; gap: .6rem; }

/* Systems rows: a one-line goal, a summary on click */
.sr-oneline { display: block; max-width: 26rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sr-clickable { cursor: pointer; } .sr-clickable:hover td { background: color-mix(in srgb, var(--accent, #42b9a4) 8%, transparent); }
.sr-summary h4 { margin: .8rem 0 .25rem; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; opacity: .65; } .sr-summary p { margin: 0 0 .4rem; line-height: 1.45; font-size: .9rem; }
.sr-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; align-items: start; } @media (max-width: 900px) { .sr-two { grid-template-columns: 1fr; } }
.sr-box { padding: .8rem; border-radius: 14px; border: 1px solid var(--line, rgba(128,128,128,.3)); display: grid; gap: .6rem; } .sr-box h3 { margin: 0; }
.sr-need { cursor: pointer; }
.sr-need { display: flex; flex-direction: column; align-items: flex-start; gap: .35rem; padding: .7rem .8rem; } .sr-need strong { font-size: .9rem; } .sr-need p { margin: 0; font-size: .84rem; line-height: 1.4; opacity: .85; }

/* Slides: text is clipped inside each card instead of overlapping its neighbours. */
.sr-slide { display: flex; flex-direction: column; min-height: 8.5rem; aspect-ratio: auto; }
.sr-slide p { margin: 0; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 7; -webkit-box-orient: vertical; line-height: 1.35; padding-right: 1.4rem; }
.sr-slides { align-content: start; }
.sr-pdf { width: 100%; height: 100%; min-height: 60vh; border: 0; border-radius: 10px; background: #fff; }
.sr-image { display: flex; justify-content: center; align-items: flex-start; overflow: auto; padding: .4rem; }
.sr-image img { max-width: 100%; height: auto; border-radius: 10px; }
.sr-bottom-tray .sr-chip-wrap { display: inline-flex; align-items: center; }
.sr-chip-x { font-size: 1.2rem; line-height: 1; opacity: .85; min-width: 1.6rem; min-height: 1.6rem; border-radius: 999px; }
.sr-chip-x:hover { opacity: 1; background: color-mix(in srgb, currentColor 18%, transparent); }

/* The plan table scrolls sideways; keep its action buttons visible at the right edge. */
.sr-systable th:last-child, .sr-systable td.sr-acts { position: sticky; right: 0; background: var(--panel-strong, #1b1f24); z-index: 1; box-shadow: -8px 0 8px -8px rgba(0,0,0,.4); }

/* Mail rows: sender and time on top, subject and the start of the message underneath, so nothing is cut to a few letters. */
.sr-mail-row { grid-template-columns: .5rem minmax(0, 1fr) auto; grid-template-areas: "dot from time" "dot text text"; row-gap: .15rem; }
.sr-mail-row .sr-mail-dot { grid-area: dot; align-self: start; margin-top: .35rem; }
.sr-mail-row .sr-mail-from { grid-area: from; font-weight: 600; }
.sr-mail-row .sr-mail-time { grid-area: time; font-size: .78rem; opacity: .7; }
.sr-mail-row .sr-mail-text { grid-area: text; font-size: .88rem; }
.sr-mail-row .sr-mail-subject { font-weight: 500; }
.sr-mail-row .sr-mail-snippet { opacity: .65; }
.sr-mail-row { contain-intrinsic-size: 3.6rem; }

/* The file list adapts to the room it has: in a narrow middle pane the name keeps the space and Size/actions step aside. */
.sr-entries { container-type: inline-size; }
@container (max-width: 700px) {
  .sr-entries.is-list .sr-entry { grid-template-columns: 2.4rem minmax(0, 1fr) 5.5rem !important; }
  .sr-entries.is-list .sr-entry .sr-entry-size, .sr-entries.is-list .sr-entry .sr-entry-act, .sr-entries.is-list .sr-entry-head > :nth-child(n+4) { display: none !important; }
}


/* Browser takeover: touch, mobile soft keyboard, and privacy-preserving text relay. */
.sr-takeover-frame { touch-action:none; user-select:none; -webkit-user-select:none; }
.sr-takeover-keyboard { display:grid; gap:.48rem; padding:.6rem .7rem; border:1px solid var(--line,rgba(128,128,128,.3)); border-radius:12px; }
.sr-takeover-typed { min-width:0; width:100%; box-sizing:border-box; border-radius:8px; border:1px solid var(--line,rgba(128,128,128,.3)); color:var(--ink,#eee); background:var(--panel,#25272a); padding:.65rem; font:inherit; font-size:16px; }
.sr-takeover-reveal { display:flex; gap:.45rem; align-items:center; font-size:.77rem; opacity:.85; }
.sr-takeover-keyboard .ghost { justify-self:start; }
.sr-site-login-origins { min-width:0; width:100%; max-width:100%; box-sizing:border-box; min-height:3.5rem; font:inherit; font-size:.82rem; resize:vertical; }
@media(max-width:700px) {
  .sr-takeover { width:98vw; max-height:94dvh; padding:.7rem; gap:.55rem; }
  .sr-takeover-frame { aspect-ratio:4 / 3; }
  .sr-takeover-actions { position:sticky; bottom:0; background:var(--panel-strong,#1f2124); padding:.4rem 0; }
}


/* An authenticated site is brought into the Personal conversation. */
.zana-browser-login-card {
 max-width:min(100%,710px);margin:.55rem 0 1rem auto;padding:1rem;
 border:1px solid var(--line,rgba(128,128,128,.3));border-radius:16px;
 background:var(--panel-strong,#1f2124);color:var(--ink,inherit);display:grid;gap:.65rem;box-sizing:border-box;
}
.zana-browser-login-card h3,.zana-browser-login-card p{margin:0}
.zana-browser-login-card h3{font-size:1.02rem}
.zana-browser-login-host,.zana-browser-login-detail{font-size:.82rem;opacity:.78;line-height:1.45;overflow-wrap:anywhere}
.zana-browser-login-status{font-size:.87rem;font-weight:600;line-height:1.4}
.zana-browser-login-form{display:grid;gap:.65rem}
.zana-browser-login-form label{display:grid;gap:.25rem;font-size:.84rem}
.zana-browser-login-form input{width:100%;box-sizing:border-box;font:inherit;font-size:16px;padding:.65rem;border-radius:8px;border:1px solid var(--line,rgba(128,128,128,.3));color:var(--ink,inherit);background:var(--panel,#25272a)}
.zana-browser-login-actions{display:flex;flex-wrap:wrap;gap:.5rem}
.zana-browser-login-preview{min-width:0}
.sr-takeover-inline{position:static;width:100%;background:transparent;padding:0}
.sr-takeover-inline .sr-takeover{width:100%;max-height:none;box-sizing:border-box;padding:.6rem;box-shadow:none}
.sr-takeover-inline .sr-takeover-frame{aspect-ratio:16/9;max-height:340px}
@media(max-width:650px){.zana-browser-login-card{max-width:100%;margin-left:0;padding:.75rem}.sr-takeover-inline .sr-takeover-frame{aspect-ratio:4/3}}


/* Grouped, owner-scoped Applications login handoff in Personal chat. */
.zana-application-accounts-card {
 max-width:min(100%,740px);margin:.65rem 0 1rem auto;padding:1rem;
 border:1px solid var(--line,rgba(128,128,128,.3));border-radius:16px;
 background:var(--panel-strong,#1f2124);color:var(--ink,inherit);
 display:grid;gap:.75rem;box-sizing:border-box;
}
.zana-application-accounts-card h3,.zana-application-accounts-card p{margin:0}
.za-acct-detail{font-size:.84rem;opacity:.78;line-height:1.5}
.za-acct-sites,.za-acct-form{display:grid;gap:.55rem}
.za-acct-site{display:flex;flex-wrap:wrap;gap:.35rem 1rem;align-items:center;justify-content:space-between;padding:.6rem .75rem;border:1px solid var(--line,rgba(128,128,128,.3));border-radius:9px;font-size:.86rem}
.za-acct-state{font-size:.79rem;opacity:.8}
.za-acct-form label:not(.za-acct-consent){display:grid;gap:.3rem;font-size:.83rem}
.za-acct-form input:not([type="checkbox"]),.za-acct-form select{
 width:100%;box-sizing:border-box;padding:.65rem;border-radius:8px;border:1px solid var(--line,rgba(128,128,128,.3));
 color:var(--ink,inherit);background:var(--panel,#25272a);font:inherit;font-size:16px;
}
.za-acct-individual{display:grid;gap:.6rem}
.za-acct-individual-site{display:grid;gap:.3rem;border:1px solid var(--line,rgba(128,128,128,.3));border-radius:9px}
.za-acct-consent{display:flex;align-items:flex-start;gap:.5rem;font-size:.82rem;line-height:1.45}
.za-acct-consent input{margin-top:.15rem}
.za-acct-status{font-size:.84rem;line-height:1.4}
.za-acct-recovery{display:flex;flex-wrap:wrap;gap:.5rem}
@media(max-width:650px){.zana-application-accounts-card{margin-left:0;padding:.7rem}}

.zana-application-accounts-card [hidden]{display:none!important}


/* Personal chat renders only persisted Act interruptions; no separate Act navigation. */
.zana-chat-needs{display:grid;gap:.7rem;max-width:min(100%,720px);width:100%;box-sizing:border-box;margin:.8rem 0 1rem auto;}
.zana-chat-need{background:var(--panel-strong,#202226);color:var(--ink,inherit);border:1px solid var(--line,rgba(128,128,128,.32));border-radius:14px;padding:1rem;display:grid;gap:.55rem;line-height:1.45;min-width:0;}
.zana-chat-need h3,.zana-chat-need p{margin:0;overflow-wrap:anywhere}
.zana-chat-need h3{font-size:1.01rem}
.zana-chat-need-label{text-transform:uppercase;letter-spacing:.09em;font-weight:700;font-size:.68rem;opacity:.8}
.zana-chat-need-title{font-weight:600;font-size:.92rem}
.zana-chat-need-detail{font-size:.85rem;opacity:.82;white-space:pre-wrap}
.zana-chat-need-scope{font-size:.82rem;font-family:ui-monospace,monospace}
.zana-chat-need-status{font-size:.81rem;min-height:1rem}
.zana-chat-need-actions{display:grid;gap:.6rem;justify-items:start}
.zana-chat-need-actions .ghost{max-width:100%;white-space:normal}
.zana-chat-need-form{display:grid;gap:.55rem;width:100%}
.zana-chat-need-form textarea,.zana-chat-need-form select{width:100%;box-sizing:border-box;font:inherit;font-size:16px;line-height:1.5;min-height:42px;padding:.6rem;border-radius:8px;color:var(--ink,inherit);background:var(--panel,#25272a);border:1px solid var(--line,rgba(128,128,128,.3))}
.zana-chat-need-preview{width:100%;min-width:0}
@media(max-width:650px){.zana-chat-needs{margin-left:0}.zana-chat-need{padding:.75rem}}

/* Floating browser: Zana's hands over the conversation, like the camera. */
.sr-browser-float { position: fixed; z-index: 900; width: min(380px, calc(100vw - 32px)); }
.sr-browser-float .sr-takeover { width: 100%; max-height: min(70vh, 560px); padding: .6rem; gap: .45rem; border-radius: 16px; box-shadow: 0 12px 36px #0007; }
.sr-browser-float .sr-takeover-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .15rem .45rem; cursor: grab; touch-action: none; }
.sr-browser-float.is-expanded .sr-takeover-head { cursor: default; }
.sr-browser-float .sr-takeover-head strong { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sr-browser-float .sr-takeover-reason { grid-column: 1 / -1; grid-row: 2; font-size: .8rem; line-height: 1.35; }
.sr-takeover-headbtns { margin-left: auto; display: flex; gap: .3rem; flex-shrink: 0; }
.sr-takeover-headbtns button { min-height: 28px; padding: 2px 8px; border-radius: 8px; font-size: .78rem; }
.sr-takeover-headbtns .sr-takeover-x { width: 28px; padding: 0; font-size: 1.1rem; }
.sr-browser-float .sr-takeover-frame { border-radius: 8px; }
.sr-browser-float:not(.is-expanded) :is(.sr-takeover-note, .sr-takeover-keyboard) { display: none; }
.sr-browser-float .sr-takeover-actions button { min-height: 32px; padding: 4px 12px; }
.sr-browser-float.is-expanded { inset: 4vh 4vw !important; width: auto; }
.sr-browser-float.is-expanded .sr-takeover { max-height: 92vh; }
.sr-browser-float [hidden] { display: none !important; }
@media (max-width: 650px) { .sr-browser-float { width: calc(100vw - 16px); } .sr-browser-float.is-expanded { inset: 2dvh 2vw !important; } }

/* Calendar event: where, join, related email. */
.cal-join { display: inline-block; margin: .45rem 0; padding: .45rem .9rem; border-radius: 10px; background: var(--accent, #42b9a4); color: #06231c; font-weight: 650; text-decoration: none; }
.cal-where { margin: .35rem 0; } .cal-where a { margin-left: .3rem; color: var(--accent, #42b9a4); }
.cal-related { margin: .8rem 0; padding-top: .6rem; border-top: 1px solid var(--line, rgba(128,128,128,.3)); display: flex; flex-direction: column; gap: .5rem; }
.cal-related h4 { margin: 0; font-size: .85rem; }
.cal-thread { padding: .55rem .65rem; border: 1px solid var(--line, rgba(128,128,128,.3)); border-radius: 10px; display: flex; flex-direction: column; gap: .2rem; }
.cal-thread strong { font-size: .85rem; } .cal-thread small { opacity: .7; font-size: .75rem; }
.cal-thread p { margin: .15rem 0 0; font-size: .8rem; line-height: 1.4; opacity: .9; }
.cal-thread-acts { display: flex; gap: .35rem; margin-top: .3rem; }
.cal-thread-acts .ghost, .cal-acts .ghost { padding: .28rem .7rem; border: 1px solid var(--line, rgba(128,128,128,.4)); border-radius: 10px; background: transparent; color: inherit; cursor: pointer; font: inherit; font-size: .8rem; }
a.primary.cal-join, a.primary.cal-join:visited { display: inline-block; width: auto; background: #3fb27f; color: #06231c; border-color: transparent; }
.cal-brief { margin: .7rem 0; padding: .7rem .8rem; border: 1px solid rgba(121,214,176,.35); border-radius: 12px; background: rgba(93,192,153,.07); display: flex; flex-direction: column; gap: .35rem; }
.cal-brief h4 { margin: 0; font-size: .9rem; }
.cal-brief p { margin: 0; font-size: .85rem; line-height: 1.45; }

/* Person cards: title with Edit and ×; tap the card to add it to your message. */
.sr-person-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: .5rem; width: 100%; }
.sr-person-card-tools { display: inline-flex; gap: .25rem; flex: none; }
.sr-person-card-tools .ghost { padding: .15rem .5rem; border: 1px solid var(--line, rgba(128,128,128,.35)); border-radius: 8px; background: transparent; color: inherit; font: inherit; font-size: .75rem; cursor: pointer; opacity: .8; }
.sr-person-card-tools .ghost:hover { opacity: 1; }
.sr-person-remove.is-armed { border-color: #e5484d; color: #ff8d8d; opacity: 1; }
.sr-person-card.is-expanded .sr-person-card-field { -webkit-line-clamp: unset; display: block; }
.person-inline-review .sr-tabs button { padding: .3rem .65rem; border-radius: 999px; font-size: .82rem; }

/* Workspace tools (Car swaps, Chapter events, Rides…) in the same window as Calendar. */
.cal-ev.is-swap-ok { background: color-mix(in srgb, #d9a13a 28%, var(--panel-strong, #1f2124)); border-color: #d9a13a; }
.ws-tool-head { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; margin-bottom: .6rem; }
.ws-tool-head .cal-search { margin-left: auto; }
.ws-tool-head .ghost, .ws-tool-form .ghost { padding: .3rem .7rem; border: 1px solid var(--line, rgba(128,128,128,.4)); border-radius: 8px; background: transparent; color: inherit; cursor: pointer; font: inherit; font-size: .82rem; }
.ws-tool-list { display: flex; flex-direction: column; gap: .35rem; overflow: auto; }
.ws-tool-row { display: flex; align-items: center; gap: .8rem; width: 100%; text-align: left; padding: .65rem .8rem; border: 1px solid var(--line, rgba(128,128,128,.3)); border-radius: 10px; background: transparent; color: inherit; font: inherit; cursor: pointer; }
.ws-tool-row:hover, .ws-tool-row.is-on { border-color: var(--accent, #42b9a4); background: color-mix(in srgb, var(--accent, #42b9a4) 10%, transparent); }
.ws-tool-row-main { display: flex; flex-direction: column; gap: .15rem; min-width: 0; flex: 1 1 auto; }
.ws-tool-row-main strong, .ws-tool-row-main span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ws-tool-row-main span { font-size: .8rem; opacity: .7; }
.ws-tool-row-side { font-size: .75rem; opacity: .75; flex: 0 0 auto; text-transform: capitalize; }
.ws-tool-form { display: flex; flex-direction: column; gap: .55rem; }
.ws-tool-form h4 { margin: 0; }
.ws-tool-field { display: flex; flex-direction: column; gap: .25rem; font-size: .8rem; }
.ws-tool-field > span { opacity: .75; }
.ws-tool-form input[type="text"], .ws-tool-form input[type="time"], .ws-tool-form input[type="datetime-local"], .ws-tool-form select, .ws-tool-form textarea {
  width: 100%; box-sizing: border-box; padding: .45rem .55rem; border-radius: 8px; border: 1px solid var(--line, rgba(128,128,128,.4)); background: var(--panel, transparent); color: inherit; font: inherit; font-size: .85rem;
}
.ws-tool-job { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: .4rem; }
.ws-tool-jobs { display: flex; flex-direction: column; gap: .4rem; }
.ws-tool-choice { display: flex; flex-wrap: wrap; gap: .4rem 1rem; font-size: .85rem; }
.ws-tool-exclude { display: flex; flex-direction: column; gap: .25rem; max-height: 180px; overflow: auto; font-size: .85rem; padding-top: .3rem; }
.ws-tool-detail { display: flex; flex-direction: column; gap: .35rem; }
@media (max-width: 640px) { .ws-tool-job { grid-template-columns: 1fr; } }
.cal-ev.is-cal { background: color-mix(in srgb, #3fb27f 26%, var(--panel-strong, #1f2124)); border-color: color-mix(in srgb, #3fb27f 70%, transparent); }

/* Tool chat stays inside the phone window when the input and Send share a row. */
.sr-ask { min-width:0; }
.sr-ask input { min-width:0; width:0; }
.sr-bottom-tray:empty { display:none; }
.sr-bottom > .sr-voice, .sr-ask > button { flex:0 0 auto; }
@media (max-width:640px) {
  .sr-head-kicker { display:none; }
  .sr-head { flex-wrap: wrap; gap: .35rem; padding: .55rem .65rem; }
  .sr-head-crumb { flex: 1 1 100%; order: 5; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .sr-head-tools { margin-left: auto; flex: none; }
  .sr-native { padding: .25rem .45rem; font-size: .75rem; }
  .cal-body, .cal-grid-wrap { min-width: 0; max-width: 100%; }
  .cal-grid { min-width: 0; }
  .sr-bottom { gap:.4rem; padding:.6rem; }
  .sr-bottom .sr-voice { padding:.4rem .65rem; }
  .sr-mobile-tabs button { min-width:0; min-height:40px; font-size:.8rem; }
}
.cal-ev.is-cs-open { background: color-mix(in srgb, #d35b50 34%, var(--panel-strong, #1f2124)); border-color: #d35b50; }
.cal-ev.is-cs-matched { background: color-mix(in srgb, #3f7fd9 38%, var(--panel-strong, #1f2124)); border-color: #5b95e6; }
.cs-switch { display: inline-flex; align-items: center; gap: .45rem; font-weight: 600; }
.cs-switch[aria-checked="true"] { border-color: #5b95e6; color: #cfe0fb; }
.cs-members { list-style: none; padding: 0; margin: .6rem 0; display: grid; gap: .35rem; }
.cs-members li { display: flex; justify-content: space-between; gap: .75rem; }
.cs-tick { color: #6fcf97; font-weight: 700; }
.cs-wait { color: var(--ink-soft, #a6b4ad); }
.cal-mev.is-cs-open { background: color-mix(in srgb, #d35b50 34%, var(--panel-strong, #1f2124)); border-color: #d35b50; }
.cal-mev.is-cs-matched { background: color-mix(in srgb, #3f7fd9 38%, var(--panel-strong, #1f2124)); border-color: #5b95e6; }

/* Car share setup: calendar status and class drop zone, one full-width row above the switches. */
.cal-tools.cs-tools { flex-wrap: wrap; }
.cs-setup { flex: 0 0 100%; display: grid; gap: .35rem; margin-bottom: .15rem; }
.cs-setup-status { display: flex; flex-wrap: wrap; align-items: center; gap: .1rem .5rem; padding: .3rem .65rem; border-radius: 8px; border: 1px solid; font-size: .78rem; line-height: 1.3; }
.cs-setup-status.is-ok { background: color-mix(in srgb, #3fa77a 18%, var(--panel-strong, #1f2124)); border-color: #3fa77a; }
.cs-setup-status.is-ok strong { color: #8fe0bb; letter-spacing: .06em; }
.cs-setup-status.is-todo { background: color-mix(in srgb, #d6a23c 16%, var(--panel-strong, #1f2124)); border-color: #d6a23c; }
.cs-setup-status.is-todo strong { color: #f0c76a; letter-spacing: .06em; }
.cs-setup-status button { margin-left: auto; }
.cs-drop { display: block; padding: .3rem .65rem; border: 1px dashed var(--line, #44484d); border-radius: 8px; color: var(--muted, #aab); text-align: center; cursor: pointer; font-size: .78rem; }
.cs-drop:hover, .cs-drop.is-over { border-color: #5b95e6; color: #cfe0fb; background: color-mix(in srgb, #3f7fd9 12%, transparent); }