/* SH24 shared panel styles — placeholder visual language until designer sheets land */
:root {
  /* "The calm office": deep green, warm sand, golden yellow —
     wood, light, quiet. Main #1F5C4F · Soft #DCE9E2 · Base #F4EFE6 · Gold #E8B931 */
  --paper:#F4EFE6; --sheet:#FFFFFF; --ink:#1C2B26; --ink2:#52655E; --ink3:#8A968F;
  --rule:#E6E0D2; --accent:#1F5C4F; --accent2:#DCE9E2; --dark:#143D34;
  --gold:#E8B931; --goldbg:#F8EFD0;
  --ok:#1F5C4F; --okbg:#DCE9E2; --warn:#7A5E08; --warnbg:#F8EFD0;
  --err:#B3432B; --errbg:#F6E3DB;
}
* { box-sizing:border-box; }
body { margin:0; font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
       background:var(--paper); color:var(--ink); }
header.bar { background:var(--sheet); border-bottom:1px solid var(--rule);
             padding:.65rem 1.2rem; display:flex; justify-content:space-between;
             align-items:center; position:sticky; top:0; z-index:5; }
header.bar.dark { background:var(--dark); color:#fff; }
header.bar b { font-size:1rem; }
header.bar .tag { font:600 .62rem ui-monospace,monospace; border-radius:5px;
                  padding:.15rem .45rem; margin-left:.5rem; }
header.bar .tag.blue { background:var(--accent2); color:var(--accent); }
header.bar .tag.dark { background:#fff; color:var(--dark); }
header.bar form { display:inline; }
header.bar button.linkish, a.linkish { border:0; background:none; cursor:pointer;
  font:600 .85rem Inter,sans-serif; color:var(--ink2); text-decoration:none; }
header.bar.dark button.linkish, header.bar.dark a.linkish { color:#E8CE7B; }
main.wrap { max-width:1060px; margin:1.8rem auto; padding:0 1.2rem; }
.card { background:var(--sheet); border:1px solid var(--rule); border-radius:14px;
        padding:1.2rem 1.3rem; margin-bottom:1rem; }
.card h2 { font-size:1rem; margin:0 0 .6rem; }
.sub { color:var(--ink2); font-size:.84rem; }
.muted { color:var(--ink3); font-size:.78rem; }
.grid2 { display:grid; grid-template-columns:2fr 1fr; gap:1rem; align-items:start; }
@media (max-width:880px){ .grid2 { grid-template-columns:1fr; } }
.pill { font-size:.72rem; font-weight:700; border-radius:6px; padding:.18rem .5rem; }
.pill.ok { background:var(--okbg); color:var(--ok); }
.pill.warn { background:var(--warnbg); color:var(--warn); }
.pill.err { background:var(--errbg); color:var(--err); }
.pill.blue { background:var(--accent2); color:var(--accent); }
table.t { width:100%; border-collapse:collapse; font-size:.86rem; }
table.t th { text-align:left; color:var(--ink3); font-size:.72rem;
             text-transform:uppercase; letter-spacing:.05em; padding:.4rem .5rem; }
table.t td { border-top:1px solid var(--rule); padding:.55rem .5rem; vertical-align:middle; }
table.t tr:hover td { background:var(--paper); }
.mono { font-family:ui-monospace,Menlo,monospace; }
.btn { display:inline-block; border:0; border-radius:8px; background:var(--accent);
       color:#fff; padding:.5rem .9rem; font:600 .82rem Inter,sans-serif;
       cursor:pointer; text-decoration:none; }
.btn.dark { background:var(--dark); }
.btn.ghost { background:none; border:1px solid var(--rule); color:var(--ink2); }
.btn.sm { padding:.3rem .6rem; font-size:.74rem; }
.btn:disabled { background:var(--rule); color:var(--ink3); cursor:not-allowed; }
.chips { display:flex; gap:.4rem; flex-wrap:wrap; }
.chips a { font-size:.76rem; font-weight:600; border-radius:999px; padding:.3rem .75rem;
           border:1px solid var(--rule); color:var(--ink2); text-decoration:none; }
.chips a.on { background:var(--accent); border-color:var(--accent); color:#fff; }
input.field, textarea.field { width:100%; padding:.55rem .7rem; border:1px solid var(--rule);
  border-radius:8px; font:inherit; background:var(--paper); }
.path { list-style:none; margin:.4rem 0 0; padding:0; }
.path li { display:flex; gap:.7rem; padding:.35rem 0; align-items:flex-start; }
.path i { width:24px; height:24px; border-radius:50%; display:flex; align-items:center;
          justify-content:center; font:700 .72rem ui-monospace,monospace;
          flex:none; font-style:normal; }
.path .done i { background:var(--accent); color:#fff; }
.path .cur i { background:var(--warnbg); color:var(--warn); }
.path .lock i { background:var(--paper); color:var(--ink3); border:1px solid var(--rule); }
.msgs { display:flex; flex-direction:column; gap:.5rem; max-height:340px;
        overflow-y:auto; padding:.2rem 0; }
.msg { max-width:80%; padding:.5rem .75rem; border-radius:12px; font-size:.84rem; }
.msg.adviser { align-self:flex-end; background:var(--accent); color:#fff;
               border-bottom-right-radius:4px; }
.msg.client { align-self:flex-start; background:var(--paper);
              border:1px solid var(--rule); border-bottom-left-radius:4px; }
.msg .when { display:block; font-size:.64rem; opacity:.7; margin-top:.15rem; }
.opts { display:flex; flex-direction:column; gap:.5rem; }
.opts button { text-align:left; border:1.5px solid var(--rule); background:var(--sheet);
  border-radius:9px; padding:.6rem .8rem; font:600 .86rem Inter,sans-serif;
  cursor:pointer; color:var(--ink); }
.opts button:hover { border-color:var(--accent); background:var(--accent2); }
.note { background:var(--warnbg); color:var(--warn); border-radius:9px;
        padding:.55rem .75rem; font-size:.8rem; }

/* ——— interview UX: big buttons, no spinners, tip boxes ——— */
input[type=number] { -moz-appearance: textfield; appearance: textfield; }
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.opts button { padding: 1rem 1.1rem; font-size: 1rem; border-width: 2px; border-radius: 12px; }
.qchips { display:flex; flex-wrap:wrap; gap:.5rem; margin:.4rem 0 .8rem; }
.qchips button, .qchips a { border:2px solid var(--rule); background:var(--sheet); border-radius:12px;
  padding:.85rem 1.1rem; font:700 1rem Inter,sans-serif; color:var(--ink); cursor:pointer; min-width:4.2rem; text-align:center; }
.qchips button:hover, .qchips button.on { border-color:var(--accent); background:var(--accent2); }
.btn.xl { padding:.95rem 1.4rem; font-size:1rem; border-radius:12px; }
input.field.big { padding:.9rem 1rem; font-size:1.05rem; border-width:2px; }
.tip { margin-top:.9rem; background:var(--goldbg); border:1px solid #EBD48A; border-radius:12px;
       padding:.7rem .9rem; font-size:.84rem; color:var(--warn); display:flex; gap:.6rem; }
.tip b { flex:none; }
.items { margin:.5rem 0; }
.items .row { display:flex; justify-content:space-between; align-items:center; padding:.5rem 0; border-top:1px solid var(--rule); }
.items .row:first-child { border-top:0; }
.items form { display:inline; }
.consent { display:flex; gap:.7rem; align-items:flex-start; margin:.6rem 0 1rem; font-size:.9rem; }
.consent input { width:1.3rem; height:1.3rem; margin-top:.15rem; }
