/* Rehera — shared styles. Tokens match the rehera.ai landing page. */
/* Fonts are served from this site, so no visitor data goes to a font host. */
@font-face { font-family: 'Fraunces'; font-style: normal; font-display: swap; font-weight: 100 900; src: url('/assets/fonts/fraunces-latin-opsz-normal.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-display: swap; font-weight: 100 900; src: url('/assets/fonts/inter-latin-ext-wght-normal.woff2') format('woff2'); unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: 'Inter'; font-style: normal; font-display: swap; font-weight: 100 900; src: url('/assets/fonts/inter-latin-wght-normal.woff2') format('woff2'); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
:root {
  --ink: #2A2333;
  --aubergine: #221B2E;
  --aubergine-2: #31283F;
  --paper: #FBF7F0;
  --paper-2: #F3ECE0;
  --surface: #FFFFFF;
  --coral: #E5533D;
  --coral-deep: #C63F2B;
  --coral-soft: #F9E7E1;
  --sage: #4F6A5C;
  --sage-soft: #E4EAE5;
  --amber: #9A6208;
  --amber-soft: #F7ECD4;
  --line: #E7DFD2;
  --line-dark: #443A52;
  --soft: #5C5266;
  --muted: #8A8194;
  --serif: 'Fraunces', Georgia, 'Times New Roman', serif;
  --sans: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --radius: 8px;
  --focus: 0 0 0 3px rgba(229, 83, 61, .28);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; font-family: var(--sans); font-size: 15px; line-height: 1.55;
  color: var(--ink); background: var(--paper); -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, p { margin: 0; }
a { color: var(--coral-deep); text-underline-offset: 3px; }
a:hover { color: var(--ink); }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
[hidden] { display: none !important; }
:focus-visible { outline: none; box-shadow: var(--focus); border-radius: 6px; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

h1 { font-family: var(--serif); font-weight: 500; font-size: clamp(28px, 4vw, 38px); line-height: 1.1; letter-spacing: -.015em; }
h2 { font-family: var(--serif); font-weight: 500; font-size: 22px; line-height: 1.2; letter-spacing: -.01em; }
h3 { font-size: 15px; font-weight: 600; }
.lede { font-size: 17px; color: var(--soft); max-width: 38em; }
.muted { color: var(--muted); }
.soft { color: var(--soft); }
.small { font-size: 13px; }
.num { font-variant-numeric: tabular-nums; }

/* ---------- buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font-weight: 600; font-size: 14.5px; line-height: 1.2; padding: 11px 18px;
  border: 1px solid transparent; border-radius: var(--radius); background: transparent;
  text-decoration: none; white-space: nowrap; transition: background .15s ease, border-color .15s ease;
}
.btn:disabled { opacity: .55; cursor: not-allowed; }
.btn-primary { background: var(--coral); color: #fff; }
.btn-primary:hover:not(:disabled) { background: var(--coral-deep); color: #fff; }
.btn-dark { background: var(--aubergine); color: #fff; }
.btn-dark:hover:not(:disabled) { background: var(--aubergine-2); color: #fff; }
.btn-ghost { border-color: var(--line); background: var(--surface); color: var(--ink); }
.btn-ghost:hover:not(:disabled) { border-color: var(--muted); color: var(--ink); }
.btn-quiet { color: var(--soft); padding: 8px 10px; }
.btn-quiet:hover:not(:disabled) { color: var(--ink); background: var(--paper-2); }
.btn-danger { color: var(--coral-deep); }
.btn-sm { font-size: 13px; padding: 7px 12px; }
.btn-block { width: 100%; }

/* ---------- forms ---------- */
.field { display: block; margin-bottom: 16px; }
.field > span, .field > label { display: block; font-size: 13.5px; font-weight: 600; margin-bottom: 6px; }
.field .hint { display: block; font-weight: 400; font-size: 13px; color: var(--muted); margin-top: 5px; }
input[type=text], input[type=email], input[type=password], input[type=number], select, textarea {
  width: 100%; padding: 10px 12px; background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--radius); transition: border-color .15s ease;
}
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--coral); box-shadow: var(--focus); }
textarea { resize: vertical; min-height: 96px; line-height: 1.5; }
select {
  appearance: none; padding-right: 34px;
  background-image: url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%238A8194' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 13px center;
}
.check { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; margin-bottom: 14px; }
.check input { width: 17px; height: 17px; margin-top: 2px; accent-color: var(--coral); flex-shrink: 0; }
.row { display: flex; gap: 14px; flex-wrap: wrap; }
.row > * { flex: 1; min-width: 180px; }
.form-error { color: var(--coral-deep); font-size: 14px; margin: 0 0 14px; }

/* ---------- brand ---------- */
.logo { display: inline-flex; align-items: center; gap: 9px; font-family: var(--serif); font-weight: 600; font-size: 21px; letter-spacing: -.01em; color: var(--ink); text-decoration: none; }
.logo .r { width: 28px; height: 28px; border-radius: 7px; background: var(--coral); color: #fff; display: grid; place-items: center; font-size: 16px; }
.logo.on-dark { color: #fff; }

/* ---------- recruiter chrome ---------- */
.topnav { background: var(--surface); border-bottom: 1px solid var(--line); }
.topnav-in { max-width: 1120px; margin: 0 auto; padding: 0 24px; height: 60px; display: flex; align-items: center; gap: 26px; }
.topnav nav { display: flex; gap: 4px; }
.topnav nav a { padding: 7px 12px; border-radius: 6px; color: var(--soft); text-decoration: none; font-weight: 500; font-size: 14.5px; }
.topnav nav a:hover { background: var(--paper-2); color: var(--ink); }
.topnav nav a[aria-current=page] { color: var(--ink); background: var(--paper-2); }
.topnav .who { margin-left: auto; display: flex; align-items: center; gap: 6px; font-size: 13.5px; color: var(--soft); }
.topnav .who b { color: var(--ink); font-weight: 600; }
.page { max-width: 1120px; margin: 0 auto; padding: 36px 24px 80px; }
.page-narrow { max-width: 760px; }
.page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-bottom: 26px; }
.page-head .sub { color: var(--soft); margin-top: 8px; }
.page-head .actions { display: flex; gap: 10px; flex-wrap: wrap; }
.crumb { display: inline-block; font-size: 13.5px; color: var(--soft); text-decoration: none; margin-bottom: 10px; }
.crumb:hover { color: var(--ink); }
.section { margin-top: 40px; }
.section > h2 { margin-bottom: 14px; }

/* ---------- lists and tables ---------- */
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; }
.panel-pad { padding: 22px 24px; }
table.list { width: 100%; border-collapse: collapse; font-size: 14.5px; }
table.list th { text-align: left; font-weight: 600; font-size: 13px; color: var(--soft); padding: 12px 16px; border-bottom: 1px solid var(--line); white-space: nowrap; }
table.list td { padding: 14px 16px; border-bottom: 1px solid var(--line); vertical-align: middle; }
table.list tr:last-child td { border-bottom: none; }
table.list tbody tr.click { cursor: pointer; }
table.list tbody tr.click:hover { background: var(--paper); }
table.list .title { font-weight: 600; color: var(--ink); text-decoration: none; }
table.list td.right, table.list th.right { text-align: right; }
.table-scroll { overflow-x: auto; }
.empty { padding: 44px 24px; text-align: center; color: var(--soft); }
.empty h3 { font-family: var(--serif); font-weight: 500; font-size: 20px; color: var(--ink); margin-bottom: 8px; }
.empty p { max-width: 34em; margin: 0 auto 18px; }

.badge { display: inline-block; font-size: 12.5px; font-weight: 600; padding: 3px 9px; border-radius: 999px; background: var(--paper-2); color: var(--soft); white-space: nowrap; }
.badge.good { background: var(--sage-soft); color: var(--sage); }
.badge.warn { background: var(--amber-soft); color: var(--amber); }
.badge.bad { background: var(--coral-soft); color: var(--coral-deep); }
.badge.dark { background: var(--aubergine); color: #fff; }

.notice { border-radius: var(--radius); padding: 13px 16px; font-size: 14px; background: var(--paper-2); color: var(--soft); border-left: 3px solid var(--muted); }
.notice b { color: var(--ink); }
.notice.warn { background: var(--amber-soft); border-left-color: var(--amber); color: #5d4310; }
.notice.bad { background: var(--coral-soft); border-left-color: var(--coral); color: #7a2a1c; }
.notice.good { background: var(--sage-soft); border-left-color: var(--sage); color: #2f4539; }
.notice + .notice { margin-top: 10px; }

/* ---------- dialog ---------- */
dialog { border: none; border-radius: 14px; padding: 0; width: min(620px, calc(100vw - 32px)); max-height: calc(100dvh - 40px); color: var(--ink); background: var(--surface); box-shadow: 0 30px 80px -20px rgba(34, 27, 46, .5); }
dialog::backdrop { background: rgba(34, 27, 46, .55); }
dialog .dlg-head { padding: 22px 26px 0; display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
dialog .dlg-body { padding: 18px 26px 6px; }
dialog .dlg-foot { padding: 14px 26px 22px; display: flex; justify-content: flex-end; gap: 10px; flex-wrap: wrap; }
dialog .x { border: none; background: none; font-size: 24px; line-height: 1; color: var(--muted); padding: 2px 6px; }

.choice { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; margin-bottom: 16px; }
@media (max-width: 560px) { .choice { grid-template-columns: 1fr; } }
.choice label { display: block; border: 1.5px solid var(--line); border-radius: 10px; padding: 13px 14px; cursor: pointer; background: var(--surface); }
.choice label b { display: block; font-size: 14.5px; margin-bottom: 3px; }
.choice label span { font-size: 13px; color: var(--soft); line-height: 1.45; display: block; }
.choice label b .badge { display: inline-block; font-size: 12px; }
.choice input { position: absolute; opacity: 0; pointer-events: none; }
.choice label:has(input:checked) { border-color: var(--coral); background: var(--coral-soft); }
.choice label:has(input:focus-visible) { box-shadow: var(--focus); }

/* ---------- toast ---------- */
#toast { position: fixed; left: 50%; bottom: 26px; transform: translateX(-50%); background: var(--aubergine); color: #fff; padding: 11px 18px; border-radius: 999px; font-size: 14px; z-index: 200; box-shadow: 0 10px 30px -8px rgba(34, 27, 46, .6); max-width: calc(100vw - 32px); }
#toast.bad { background: var(--coral-deep); }

/* ---------- centred single-card pages (sign in, setup, demo start) ---------- */
.solo { min-height: 100dvh; display: grid; grid-template-rows: auto 1fr auto; }
.solo-head { padding: 22px 28px; display: flex; justify-content: space-between; align-items: center; }
.solo-main { display: grid; place-items: center; padding: 20px 20px 60px; }
.solo-card { width: 100%; max-width: 440px; }
.solo-card h1 { font-size: 30px; margin-bottom: 10px; }
.solo-card .lede { font-size: 15.5px; margin-bottom: 26px; }
.solo-foot { padding: 18px 28px; font-size: 13px; color: var(--muted); text-align: center; }
.solo-foot a { color: var(--soft); }

.spinner { width: 34px; height: 34px; border-radius: 50%; border: 3px solid var(--line); border-top-color: var(--coral); animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.loading { display: grid; place-items: center; gap: 14px; padding: 80px 20px; color: var(--soft); text-align: center; }

/* ---------- status checklist (setup, admin) ---------- */
.checks { list-style: none; margin: 0; padding: 0; }
.checks li { display: flex; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--line); font-size: 14.5px; align-items: flex-start; }
.checks li:last-child { border-bottom: none; }
.checks .dot { width: 20px; height: 20px; border-radius: 50%; flex-shrink: 0; margin-top: 1px; display: grid; place-items: center; font-size: 12px; font-weight: 700; color: #fff; background: var(--muted); }
.checks .ok .dot { background: var(--sage); }
.checks .no .dot { background: var(--coral); }
.checks small { display: block; color: var(--soft); font-size: 13px; }

/* ---------- report ---------- */
.report-head { background: var(--aubergine); color: #fff; padding: 30px 0 76px; }
.report-head .in, .report-body { max-width: 900px; margin: 0 auto; padding: 0 24px; }
.report-head a.crumb { color: #C9C0D6; }
.report-head h1 { color: #fff; }
.report-head .sub { color: #C9C0D6; margin-top: 8px; font-size: 14.5px; }
.report-body { margin-top: -52px; padding-bottom: 80px; }
.rcard { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 24px 26px; margin-bottom: 16px; }
.rcard > h2 { font-size: 19px; margin-bottom: 4px; }
.rcard > .why { color: var(--soft); font-size: 13.5px; margin-bottom: 16px; }
.verdict { display: flex; gap: 26px; align-items: center; flex-wrap: wrap; }
.ring { position: relative; width: 116px; height: 116px; flex-shrink: 0; }
.ring svg { transform: rotate(-90deg); display: block; }
.ring .val { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; font-family: var(--serif); font-size: 34px; font-weight: 500; line-height: 1; }
.ring .val small { display: block; font-family: var(--sans); font-size: 12px; color: var(--muted); margin-top: 4px; }
.verdict-text { flex: 1; min-width: 260px; }
.verdict-text p { margin-top: 10px; font-size: 15.5px; }
.verdict-text .how { margin-top: 10px; font-size: 13px; color: var(--muted); }
.dim { padding: 16px 0; border-top: 1px solid var(--line); }
.dim:first-of-type { border-top: none; padding-top: 4px; }
.dim-top { display: flex; align-items: baseline; gap: 12px; }
.dim-name { font-weight: 600; }
.dim-weight { font-size: 12.5px; color: var(--muted); }
.dim-score { margin-left: auto; font-family: var(--serif); font-size: 20px; font-variant-numeric: tabular-nums; }
.bar { height: 6px; background: var(--paper-2); border-radius: 99px; overflow: hidden; margin: 8px 0 9px; }
.bar > i { display: block; height: 100%; border-radius: 99px; background: var(--sage); }
.bar > i.mid { background: var(--amber); }
.bar > i.low { background: var(--coral); }
.dim-note { color: var(--soft); font-size: 14.5px; }
.quote { display: block; width: 100%; text-align: left; margin-top: 9px; padding: 9px 12px 9px 14px; border: none; border-left: 3px solid var(--coral); background: var(--paper); border-radius: 0 6px 6px 0; font-size: 14px; color: var(--ink); }
button.quote:hover { background: var(--coral-soft); }
.quote .where { display: block; font-size: 12.5px; color: var(--muted); margin-top: 3px; }
.sig { display: flex; gap: 14px; padding: 15px 0; border-top: 1px solid var(--line); }
.sig:first-of-type { border-top: none; }
.sig .badge { height: fit-content; margin-top: 2px; min-width: 62px; text-align: center; }
.sig-body { flex: 1; min-width: 0; }
.sig-body b { display: block; }
.sig-body p { color: var(--soft); font-size: 14.5px; margin-top: 3px; }
.sig-body .hidden-truth { font-size: 13.5px; color: var(--muted); margin-top: 6px; }
.evrow { display: flex; gap: 14px; padding: 13px 0; border-top: 1px solid var(--line); align-items: flex-start; }
.evrow:first-of-type { border-top: none; }
.evrow .badge { min-width: 62px; text-align: center; margin-top: 2px; }
.evrow .body { flex: 1; min-width: 0; }
.evrow .body b { display: block; font-size: 14.5px; }
.evrow .body p { font-size: 14px; color: var(--soft); }
.evrow .t { font-size: 13px; color: var(--muted); white-space: nowrap; text-align: right; }
.facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 0 28px; }
.fact { padding: 10px 0; border-top: 1px solid var(--line); font-size: 14px; }
.fact span { display: block; color: var(--soft); font-size: 13px; }
.fact b { font-weight: 600; }
.probes { margin: 0; padding-left: 20px; }
.probes li { padding: 5px 0; }
.thread { border: 1px solid var(--line); border-radius: 10px; margin-top: 12px; overflow: hidden; }
.thread > summary { list-style: none; cursor: pointer; padding: 12px 16px; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; font-size: 14.5px; }
.thread > summary::-webkit-details-marker { display: none; }
.thread > summary b { font-weight: 600; }
.thread > summary .meta { margin-left: auto; color: var(--muted); font-size: 13px; }
.thread[open] > summary { border-bottom: 1px solid var(--line); background: var(--paper); }
.thread .inner { padding: 14px 16px 16px; }
.thread .guide { font-size: 13.5px; color: var(--soft); background: var(--paper); border-radius: 8px; padding: 10px 12px; margin-bottom: 12px; }
.line { display: grid; grid-template-columns: 46px 1fr; gap: 10px; padding: 6px 0; font-size: 14.5px; }
.line .at { color: var(--muted); font-size: 12.5px; font-variant-numeric: tabular-nums; padding-top: 2px; }
.line .who { font-weight: 600; font-size: 13px; color: var(--soft); }
.line.you .who { color: var(--coral-deep); }
.line.flash { animation: flash 1.6s ease; }
@keyframes flash { 0%, 40% { background: var(--coral-soft); } 100% { background: transparent; } }
mark { background: #FBE3A6; color: inherit; padding: 0 1px; border-radius: 2px; }
.decision { display: flex; gap: 8px; flex-wrap: wrap; margin: 12px 0; }
.decision button[aria-pressed=true] { background: var(--aubergine); color: #fff; border-color: var(--aubergine); }
.report-foot { font-size: 13px; color: var(--muted); max-width: 66ch; margin-top: 20px; }
.mock-banner { background: var(--amber-soft); color: #5d4310; border-radius: 10px; padding: 12px 16px; font-size: 14px; margin-bottom: 16px; }

@media print {
  .topnav, .no-print, #toast { display: none !important; }
  body { background: #fff; }
  .report-head { background: #fff; color: #000; padding: 0 0 10px; }
  .report-head h1, .report-head .sub { color: #000; }
  .report-body { margin-top: 0; }
  .rcard { border: none; padding: 12px 0; break-inside: avoid; }
  .thread { break-inside: avoid; }
}

/* ---------- full view of a shift, for the hiring team ---------- */
.sv h3 { margin: 22px 0 8px; font-size: 15px; }
.sv-row { display: grid; grid-template-columns: 34px 1fr; gap: 8px; padding: 7px 0; font-size: 14.5px; }
.sv-row .sv-key { color: var(--coral-deep); font-weight: 600; font-size: 13px; padding-top: 2px; }
.sv-row p { color: var(--soft); margin-top: 2px; }
.sv-ticket { border-top: 1px solid var(--line); padding: 14px 0 12px; font-size: 14.5px; }
.sv-head { display: flex; gap: 10px; align-items: baseline; flex-wrap: wrap; margin-bottom: 8px; }
.sv-said { background: var(--paper); border-radius: 8px; padding: 9px 12px; margin-bottom: 8px; }
.sv-said.chase { background: var(--coral-soft); }
.sv-record { margin: 0 0 8px; display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 6px 18px; border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; }
.sv-record dt { font-size: 12.5px; color: var(--muted); }
.sv-record dd { margin: 0; font-weight: 500; overflow-wrap: anywhere; }
.sv-hidden { font-size: 13.5px; color: var(--soft); margin-top: 4px; }

/* How much each skill counts (New role dialog and role page) */
.weights { margin: 0 0 4px; }
.wrow { display: grid; grid-template-columns: 1fr 150px 92px; gap: 12px; align-items: center; padding: 9px 0; border-top: 1px solid var(--line); font-size: 14px; }
.wrow:first-child { border-top: none; }
.wrow p { color: var(--soft); font-size: 13px; line-height: 1.4; margin-top: 2px; }
.wrow select { width: 100%; }
.wshare { text-align: right; color: var(--soft); font-size: 13px; }
.wline { display: flex; justify-content: space-between; gap: 16px; padding: 6px 0; border-top: 1px solid var(--line); font-size: 14.5px; }
.wline:first-of-type { border-top: none; }
@media (max-width: 560px) {
  .wrow { grid-template-columns: 1fr 96px; }
  .wrow > div { grid-column: 1 / -1; }
}

/* Result of reading help pages from links */
.fetch-out ul { list-style: none; margin: 10px 0 0; padding: 0; font-size: 13.5px; }
.fetch-out li { padding: 7px 10px; border-radius: 8px; margin-bottom: 6px; background: var(--sage-soft); color: #2f4539; overflow-wrap: anywhere; }
.fetch-out li.no { background: var(--amber-soft); color: #5d4310; }
.fetch-out li small { display: block; font-size: 13px; margin-top: 1px; }
.fetch-out .u { font-weight: 400; }

/* Editing a built shift */
.editor h3 { margin: 22px 0 8px; font-size: 15px; }
.ed-block { border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; margin-bottom: 10px; background: var(--surface); }
.ed-tag { font-size: 12.5px; font-weight: 600; color: var(--coral-deep); margin-bottom: 8px; }
.ed-field { display: block; margin-bottom: 10px; }
.ed-field > span, .ed-record > span { display: block; font-size: 12.5px; font-weight: 600; color: var(--soft); margin-bottom: 4px; }
.ed-field small { display: block; font-size: 12.5px; color: var(--muted); margin-top: 3px; }
.ed-field textarea, .ed-field input, .ed-pair input { width: 100%; font-size: 14px; padding: 8px 10px; }
.ed-record { margin-bottom: 10px; }
.ed-pair { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 8px; margin-bottom: 6px; }
.ed-actions { display: flex; gap: 10px; position: sticky; bottom: 0; background: var(--surface); padding: 12px 0 4px; border-top: 1px solid var(--line); margin-top: 14px; }

/* Invitation links */
.invite-new { display: flex; gap: 10px; flex-wrap: wrap; }
.invite-new input { flex: 1 1 220px; min-width: 0; }
.invite-made { margin-top: 12px; }
.invite-link { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.invite-link input { flex: 1 1 260px; min-width: 0; font-size: 13.5px; background: var(--surface); }
.shared-note { background: var(--amber-soft); color: #5d4310; font-size: 13.5px; padding: 9px 20px; text-align: center; border-bottom: 1px solid #ead9b0; }