/* webOdoctor MIS: shared design tokens and components (moved out of base.html; served cached at /static/app.css). */
  :root {
    --ground:#FFFBF5; --surface:#FFFFFF; --surface-2:#FBF2E7;
    --ink:#1A1424; --ink-soft:#6B5E76; --ink-faint:#9C8FA6;
    --line:#F0E3D5; --line-strong:#DFCBB6;
    --v-content:#F4761F; --v-seo:#0E8C9C; --v-ppc:#D6246E;
    --v-email:#4A3AC7; --v-outreach:#1F8F55; --v-leadgen:#DA9A03; --v-report:#8B2FA0;
    --ok:#157F53; --ok-soft:#E4F3EC;
    --warn:#A96A04; --warn-soft:#FDF1DC;
    --crit:#C42B2B; --crit-soft:#FBE9E7;
    --r-sm:5px; --r-md:9px; --r-lg:14px; --r-xl:20px;
    --shadow:0 1px 2px rgba(26,20,36,.05), 0 10px 30px rgba(26,20,36,.07);
    --font-ui:"Archivo", system-ui, -apple-system, "Segoe UI", sans-serif;
    --font-data:"IBM Plex Mono", ui-monospace, Menlo, monospace;
  }
  :root:not([data-theme="light"]) {
    @media (prefers-color-scheme: dark) {
      --ground:#14101B; --surface:#1C1726; --surface-2:#241D30;
      --ink:#F6F0E9; --ink-soft:#AC9EB8; --ink-faint:#7D6F89;
      --line:#2F2741; --line-strong:#443858;
      --v-content:#FF8C3D; --v-seo:#1EB6C7; --v-ppc:#FF4D93;
      --v-email:#8073F2; --v-outreach:#33BE76; --v-leadgen:#FFC32E; --v-report:#C463DB;
      --ok:#3FBF88; --ok-soft:#163024; --warn:#E0A93C; --warn-soft:#2E2413;
      --crit:#F0736B; --crit-soft:#331B1A;
      --shadow:0 1px 2px rgba(0,0,0,.45), 0 12px 34px rgba(0,0,0,.4);
    }
  }
  :root[data-theme="dark"] {
    --ground:#14101B; --surface:#1C1726; --surface-2:#241D30;
    --ink:#F6F0E9; --ink-soft:#AC9EB8; --ink-faint:#7D6F89;
    --line:#2F2741; --line-strong:#443858;
    --v-content:#FF8C3D; --v-seo:#1EB6C7; --v-ppc:#FF4D93;
    --v-email:#8073F2; --v-outreach:#33BE76; --v-leadgen:#FFC32E; --v-report:#C463DB;
    --ok:#3FBF88; --ok-soft:#163024; --warn:#E0A93C; --warn-soft:#2E2413;
    --crit:#F0736B; --crit-soft:#331B1A;
    --shadow:0 1px 2px rgba(0,0,0,.45), 0 12px 34px rgba(0,0,0,.4);
  }

  * { box-sizing:border-box; }
  body { margin:0; background:var(--ground); color:var(--ink); font-family:var(--font-ui);
         font-size:14px; line-height:1.5; -webkit-font-smoothing:antialiased; }
  h1,h2,h3 { margin:0; text-wrap:balance; font-weight:600; letter-spacing:-.015em; }
  a { color:var(--v-content); }
  .mono { font-family:var(--font-data); font-variant-numeric:tabular-nums; }
  .eyebrow { font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-faint); }
  .muted { color:var(--ink-soft); }

  body::before {
    content:""; position:fixed; inset:0; pointer-events:none; z-index:0; opacity:.5;
    background:
      radial-gradient(46rem 30rem at 88% -8%, color-mix(in srgb, var(--v-ppc) 13%, transparent), transparent 65%),
      radial-gradient(40rem 26rem at 4% 4%, color-mix(in srgb, var(--v-content) 14%, transparent), transparent 62%),
      radial-gradient(44rem 30rem at 60% 104%, color-mix(in srgb, var(--v-seo) 11%, transparent), transparent 62%);
  }
  .shell { position:relative; z-index:1; display:grid; grid-template-columns:252px minmax(0, 1fr); min-height:100vh; }
  @media (max-width:900px){ .shell{ grid-template-columns:minmax(0, 1fr); } }

  .rail { border-right:1px solid var(--line); background:color-mix(in srgb, var(--surface) 82%, transparent);
          backdrop-filter:blur(14px); padding:20px 14px; display:flex; flex-direction:column; gap:18px;
          position:sticky; top:0; height:100vh; overflow-y:auto; }
  @media (max-width:900px){ .rail{ position:static; height:auto; border-right:none; border-bottom:1px solid var(--line);} }

  .brand { display:flex; align-items:center; gap:10px; text-decoration:none; color:inherit; }
  .brand-mark { width:28px; height:28px; border-radius:9px; flex:none; display:grid; place-items:center;
                font-size:11.5px; font-weight:800; color:#fff; letter-spacing:-.03em;
                background:linear-gradient(135deg, var(--v-content), var(--v-ppc));
                box-shadow:0 3px 10px color-mix(in srgb, var(--v-ppc) 35%, transparent); }
  .brand-name { font-weight:700; font-size:14.5px; letter-spacing:-.02em; }
  .brand-sub { font-size:10.5px; color:var(--ink-faint); }

  .tree-top { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:0 10px 2px; }
  .tree-toggle { font-family:inherit; font-size:9.5px; font-weight:700; letter-spacing:.07em; text-transform:uppercase;
                 color:var(--ink-faint); background:none; border:none; cursor:pointer; padding:2px 4px; border-radius:4px; }
  .tree-toggle:hover { color:var(--v-content); background:color-mix(in srgb, var(--v-content) 10%, transparent); }

  .branch { --vc:var(--v-content); margin-bottom:1px; }
  .branch-head { display:flex; align-items:center; gap:9px; width:100%; padding:7px 10px; border:none;
                 background:none; font-family:inherit; font-size:12.5px; font-weight:600; color:var(--ink);
                 text-align:left; cursor:pointer; border-radius:var(--r-md); transition:background .16s ease; }
  .branch-head:hover { background:color-mix(in srgb, var(--vc) 10%, transparent); }
  .branch-head:focus-visible { outline:2px solid var(--vc); outline-offset:-2px; }
  .branch.ghost .branch-head { color:var(--ink-soft); font-weight:500; }
  .twist { width:7px; height:7px; border-right:1.8px solid var(--vc); border-bottom:1.8px solid var(--vc);
           transform:rotate(-45deg); transition:transform .26s cubic-bezier(.3,1.3,.5,1); flex:none; margin-left:auto; }
  .branch[data-open="true"] .twist { transform:rotate(45deg); }
  .branch-dot { width:8px; height:8px; border-radius:3px; flex:none; background:var(--vc); }
  .branch.ghost .branch-dot { background:transparent; box-shadow:inset 0 0 0 1.6px var(--vc); }
  .twigs { display:grid; grid-template-rows:0fr; transition:grid-template-rows .3s cubic-bezier(.3,1,.4,1); }
  .branch[data-open="true"] .twigs { grid-template-rows:1fr; }
  .twigs > div { overflow:hidden; }
  .twig-group { padding:5px 0 3px 19px; margin-left:9px; border-left:1.5px solid color-mix(in srgb, var(--vc) 26%, transparent); }
  .twig-label { font-size:9px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-faint); padding:3px 0 3px 2px; }
  .leaf { display:flex; align-items:center; gap:7px; width:100%; padding:5px 8px 5px 2px; border:none; background:none;
          font-family:inherit; font-size:12px; color:var(--ink-soft); text-align:left; cursor:pointer; text-decoration:none;
          border-radius:var(--r-sm); transition:color .15s ease, background .15s ease, transform .15s ease; }
  .leaf:hover { color:var(--vc); background:color-mix(in srgb, var(--vc) 9%, transparent); transform:translateX(2px); }
  .leaf[aria-current="page"] { color:var(--vc); font-weight:600; background:color-mix(in srgb, var(--vc) 12%, transparent); }
  .leaf .pip { width:4px; height:4px; border-radius:50%; flex:none; background:currentColor; opacity:.5; }
  .leaf .lc { margin-left:auto; font-family:var(--font-data); font-size:9.5px; color:#fff; background:var(--crit);
              border-radius:100px; padding:0 5px; }
  .leaf.soon { color:var(--ink-faint); cursor:default; pointer-events:none; }
  .leaf.soon::after { content:"soon"; margin-left:auto; font-size:8.5px; font-weight:700; letter-spacing:.06em;
                      text-transform:uppercase; color:var(--vc); opacity:.6; }

  .main { padding:26px 30px 60px; max-width:1340px; min-width:0; }
  @media (max-width:640px){ .main{ padding:18px 16px 44px; } }
  .main > * { animation:rise .42s cubic-bezier(.2,.8,.3,1) both; }
  .main > *:nth-child(2){animation-delay:.05s} .main > *:nth-child(3){animation-delay:.1s}
  .main > *:nth-child(4){animation-delay:.15s} .main > *:nth-child(5){animation-delay:.2s}
  @keyframes rise { from{opacity:0; transform:translateY(10px)} to{opacity:1; transform:none} }

  .topbar { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:22px; }
  h1.big { font-size:27px; font-weight:700; letter-spacing:-.03em; }
  .sub { margin:4px 0 0; color:var(--ink-soft); font-size:13px; max-width:62ch; }

  .card { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
          margin-bottom:12px; overflow:hidden; box-shadow:var(--shadow); }
  .card-head { display:flex; align-items:center; gap:11px; padding:14px 17px; border-bottom:1px solid var(--line); }
  .card-glyph { width:24px; height:24px; border-radius:7px; flex:none; background:var(--vc, var(--v-content)); }
  .card-title { font-size:13.5px; font-weight:650; }
  .card-hint { font-size:11.5px; color:var(--ink-soft); margin-left:auto; }
  .card-body { padding:17px; display:grid; gap:15px; }
  .row2 { display:grid; grid-template-columns:1fr 1fr; gap:15px; }
  .row3 { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; }
  @media (max-width:680px){ .row2,.row3{ grid-template-columns:1fr; } }

  .field { display:flex; flex-direction:column; gap:6px; min-width:0; }
  .field > label { font-size:11.5px; font-weight:600; color:var(--ink-soft); }
  .field .help { font-size:11px; color:var(--ink-faint); }
  input[type=text],input[type=number],input[type=password],select,textarea {
    width:100%; font-family:var(--font-ui); font-size:13px; color:var(--ink); background:var(--ground);
    border:1.5px solid var(--line); border-radius:var(--r-md); padding:9px 11px;
    transition:border-color .18s ease, box-shadow .18s ease, background .18s ease; }
  input.mono-in,textarea.mono-in { font-family:var(--font-data); font-size:12px; }
  input:focus,select:focus,textarea:focus { outline:none; background:var(--surface);
    border-color:var(--vc, var(--v-content));
    box-shadow:0 0 0 4px color-mix(in srgb, var(--vc, var(--v-content)) 17%, transparent); }
  textarea { resize:vertical; min-height:76px; line-height:1.55; }
  select { appearance:none; background-image:linear-gradient(45deg,transparent 50%,var(--ink-faint) 50%),linear-gradient(135deg,var(--ink-faint) 50%,transparent 50%);
           background-position:calc(100% - 16px) 53%, calc(100% - 11px) 53%; background-size:5px 5px,5px 5px;
           background-repeat:no-repeat; padding-right:32px; }

  .switch { display:flex; align-items:center; gap:11px; cursor:pointer; }
  .switch input { position:absolute; opacity:0; pointer-events:none; }
  .track { width:38px; height:22px; border-radius:100px; background:var(--line-strong); flex:none; position:relative;
           transition:background .25s cubic-bezier(.3,1.4,.5,1); }
  .track::after { content:""; position:absolute; top:2px; left:2px; width:18px; height:18px; border-radius:50%;
           background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.28); transition:transform .28s cubic-bezier(.3,1.6,.45,1); }
  .switch input:checked + .track { background:var(--vc, var(--v-content)); }
  .switch input:checked + .track::after { transform:translateX(16px); }
  .switch input:focus-visible + .track { outline:2px solid var(--vc, var(--v-content)); outline-offset:2px; }
  .switch-label { font-size:13px; font-weight:500; } .switch-note { font-size:11px; color:var(--ink-faint); }

  .btn { display:inline-block; font-family:inherit; font-size:12.5px; font-weight:600; border-radius:var(--r-md);
         padding:9px 15px; border:1.5px solid var(--line); background:var(--surface); color:var(--ink);
         cursor:pointer; text-decoration:none; text-align:center;
         transition:transform .14s cubic-bezier(.3,1.4,.5,1), background .18s ease, border-color .18s ease, box-shadow .18s ease; }
  .btn:hover { border-color:var(--line-strong); transform:translateY(-1px); }
  .btn:active { transform:translateY(1px); }
  .btn-primary { color:#fff; border-color:transparent;
         background:linear-gradient(135deg, var(--v-content), var(--v-ppc));
         box-shadow:0 4px 14px color-mix(in srgb, var(--v-ppc) 30%, transparent); }
  .btn-ok { color:#fff; background:var(--ok); border-color:transparent;
            box-shadow:0 4px 14px color-mix(in srgb, var(--ok) 30%, transparent); }
  .btn-danger { color:#fff; background:var(--crit); border-color:transparent; }
  .btn-quiet { background:transparent; }
  .btn-row { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }

  .savebar { position:sticky; bottom:14px; margin-top:18px; z-index:5;
             background:color-mix(in srgb, var(--surface) 90%, transparent); backdrop-filter:blur(12px);
             border:1px solid var(--line); border-radius:var(--r-xl); padding:12px 16px;
             display:flex; align-items:center; gap:12px; flex-wrap:wrap; box-shadow:var(--shadow); }
  .savebar .eyebrow { margin-right:auto; }

  .badge { font-size:9.5px; font-weight:700; letter-spacing:.07em; text-transform:uppercase;
           padding:3px 8px; border-radius:100px; white-space:nowrap; display:inline-block; }
  .b-running { color:#fff; background:var(--v-content); }
  .b-succeeded { color:#fff; background:var(--ok); }
  .b-failed { color:#fff; background:var(--crit); }
  .b-pending_review { color:#fff; background:var(--v-ppc); }
  .b-awaiting_topic { color:#fff; background:var(--v-seo); }
  .b-rejected { color:var(--ink-faint); background:var(--surface-2); }

  .banner { display:flex; gap:11px; align-items:flex-start; border-radius:var(--r-md); padding:12px 15px;
            font-size:12.5px; margin-bottom:14px; }
  .banner.warn { color:var(--warn); background:var(--warn-soft); border:1px solid color-mix(in srgb,var(--warn) 28%,transparent); }
  .banner.info { color:var(--ink-soft); background:var(--surface-2); border:1px solid var(--line); }
  .banner.ok { color:var(--ok); background:var(--ok-soft); border:1px solid color-mix(in srgb,var(--ok) 28%,transparent); }
  .banner strong { color:var(--ink); }

  table.grid { width:100%; border-collapse:collapse; font-size:12.5px; }
  table.grid th { text-align:left; font-size:10px; letter-spacing:.08em; text-transform:uppercase;
                  color:var(--ink-faint); font-weight:700; padding:0 12px 10px 0; }
  table.grid td { padding:11px 12px 11px 0; border-top:1px solid var(--line); }
  table.grid tbody tr { transition:background .15s ease; }
  table.grid tbody tr:hover { background:var(--surface-2); }
  table.grid a { text-decoration:none; color:inherit; font-weight:550; }
  table.grid a:hover { color:var(--v-content); }

  img.preview { max-width:320px; width:100%; border-radius:var(--r-md); border:1px solid var(--line); display:block; }
  .error { color:var(--crit); background:var(--crit-soft); border:1px solid color-mix(in srgb,var(--crit) 25%,transparent);
           border-radius:var(--r-md); padding:11px 14px; font-size:12.5px; margin-bottom:14px; }
  .flash { color:var(--ok); background:var(--ok-soft); border:1px solid color-mix(in srgb,var(--ok) 25%,transparent);
           border-radius:var(--r-md); padding:11px 14px; font-size:12.5px; margin-bottom:14px; }

  @media (prefers-reduced-motion: reduce) {
    *,*::before,*::after { animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  }
  /* ---- rebuilt navigation ------------------------------------------------ */
  .rail-nav { display:flex; flex-direction:column; gap:14px; }
  .navgroup { --vc:var(--v-content); display:flex; flex-direction:column; gap:2px; }
  .navgroup-head { display:flex; align-items:center; gap:9px; padding:6px 10px; border-radius:var(--r-md);
                   font-size:12.5px; font-weight:650; color:var(--ink); text-decoration:none;
                   letter-spacing:-.01em; transition:background .15s ease; }
  .navgroup-head:hover { background:color-mix(in srgb, var(--vc) 11%, transparent); }
  .navgroup.is-active .navgroup-head { color:var(--vc); }
  .navgroup-dot { width:7px; height:7px; border-radius:2px; flex:none; background:var(--vc); opacity:.55; }
  .navgroup.is-active .navgroup-dot { opacity:1; }
  .navitems { display:flex; flex-direction:column; gap:1px; padding-left:16px;
              border-left:1px solid var(--line); margin-left:13px; }
  .navitem { display:flex; align-items:center; gap:7px; padding:5px 9px; border-radius:var(--r-sm);
             font-size:12px; color:var(--ink-soft); text-decoration:none; transition:all .14s ease; }
  .navitem:hover { color:var(--ink); background:color-mix(in srgb, var(--vc) 9%, transparent); }
  .navitem.is-current { color:var(--vc); font-weight:600;
                        background:color-mix(in srgb, var(--vc) 13%, transparent); }
  .navitem:focus-visible, .navgroup-head:focus-visible { outline:2px solid var(--vc); outline-offset:-2px; }
  .navitem.is-planned { color:var(--ink-faint); cursor:default; }
  .navitem-soon { font-family:var(--font-data); font-size:8.5px; font-weight:700; letter-spacing:.08em;
                  text-transform:uppercase; color:var(--ink-faint); border:1px solid var(--line);
                  border-radius:100px; padding:1px 5px; margin-left:auto; }
  .navitem-badge { margin-left:auto; font-family:var(--font-data); font-size:9.5px; font-weight:700;
                   min-width:17px; text-align:center; padding:1px 5px; border-radius:100px;
                   color:#fff; background:var(--warn); }
  .navgroup-collapsible > summary { list-style:none; cursor:pointer; }
  .navgroup-collapsible > summary::-webkit-details-marker { display:none; }
  .navgroup-collapsible > summary::after { content:"▸"; margin-left:auto; font-size:10px; color:var(--ink-faint); }
  .navgroup-collapsible[open] > summary::after { content:"▾"; }
  .navsearch { display:flex; align-items:center; gap:8px; width:100%; margin:0 0 10px; padding:7px 10px; font:inherit; font-size:12px;
               color:var(--ink-soft); background:var(--surface-2); border:1px solid var(--line); border-radius:var(--r-md); cursor:pointer; text-align:left; }
  .navsearch kbd { margin-left:auto; font-size:10px; padding:1px 5px; border:1px solid var(--line-strong); border-radius:4px; background:var(--surface); }
  .qs { position:fixed; inset:0; z-index:2000; background:rgba(15,23,42,.45); display:flex; justify-content:center; align-items:flex-start; padding-top:12vh; }
  .qs[hidden] { display:none; }
  .qs-box { width:min(560px, 92vw); background:var(--surface); border:1px solid var(--line-strong); border-radius:var(--r-lg); box-shadow:0 20px 50px rgba(0,0,0,.25); overflow:hidden; }
  .qs-box input { width:100%; box-sizing:border-box; border:0; border-bottom:1px solid var(--line); padding:14px 16px; font-size:15px; background:var(--surface); color:var(--ink); outline:none; }
  .qs-list { max-height:50vh; overflow:auto; }
  .qs-item { display:flex; flex-direction:column; gap:2px; padding:9px 16px; text-decoration:none; color:var(--ink); border-bottom:1px solid var(--line); }
  .qs-item span { font-size:11.5px; color:var(--ink-soft); }
  .qs-item.on, .qs-item:hover { background:color-mix(in srgb, var(--v-content) 9%, var(--surface)); }
  .qs-empty { padding:14px 16px; color:var(--ink-soft); font-size:13px; }
  .navplanned { margin-top:2px; }
  .navplanned > summary { list-style:none; cursor:pointer; display:flex; align-items:center; gap:9px;
                          padding:6px 10px; border-radius:var(--r-md); font-size:12px; font-weight:500;
                          color:var(--ink-faint); }
  .navplanned > summary::-webkit-details-marker { display:none; }
  .navplanned > summary:hover { color:var(--ink-soft); background:var(--surface-2); }
  .navplanned .navitems { border-left-color:var(--line); }

  /* ---- breadcrumbs ------------------------------------------------------- */
  .crumbs { display:flex; align-items:center; gap:7px; flex-wrap:wrap; margin:0 0 18px;
            font-size:11.5px; color:var(--ink-faint); }
  .crumbs a { color:var(--ink-soft); text-decoration:none; }
  .crumbs a:hover { color:var(--v-content); }
  .crumb-sep { color:var(--line-strong); }

  /* ---- page head + section index ---------------------------------------- */
  .pagehead { display:flex; align-items:flex-start; justify-content:space-between; gap:16px;
              flex-wrap:wrap; margin-bottom:22px; }
  .big { font-size:22px; letter-spacing:-.025em; }
  .indexgrid { display:grid; grid-template-columns:repeat(auto-fit,minmax(248px,1fr)); gap:11px; }
  .indexcard { --vc:var(--v-content); display:flex; flex-direction:column; gap:5px; padding:15px 17px;
               background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
               text-decoration:none; color:inherit; box-shadow:var(--shadow);
               transition:border-color .16s ease, transform .16s ease; }
  a.indexcard:hover { border-color:var(--vc); transform:translateY(-1px); }
  a.indexcard:focus-visible { outline:2px solid var(--vc); outline-offset:2px; }
  .indexcard.is-planned { opacity:.55; box-shadow:none; }
  .indexcard-top { display:flex; align-items:center; gap:9px; }
  .indexcard-name { font-size:13.5px; font-weight:650; letter-spacing:-.01em; }
  .indexcard-go { margin-left:auto; width:6px; height:6px; flex:none;
                  border-right:1.7px solid var(--vc); border-top:1.7px solid var(--vc);
                  transform:rotate(45deg); opacity:.6; }
  .indexcard-hint { margin:0; font-size:12px; line-height:1.5; color:var(--ink-soft); }

  /* ---- in-section tabs --------------------------------------------------- */
  .subnav { display:flex; gap:3px; flex-wrap:wrap; margin:0 0 20px; padding-bottom:2px;
            border-bottom:1px solid var(--line); }
  .subnav a { padding:7px 12px; font-size:12.5px; font-weight:550; color:var(--ink-soft);
              text-decoration:none; border-radius:var(--r-sm) var(--r-sm) 0 0;
              border-bottom:2px solid transparent; margin-bottom:-1px; }
  .subnav a:hover { color:var(--ink); background:var(--surface-2); }
  .subnav a.is-current { color:var(--vc,var(--v-content)); border-bottom-color:var(--vc,var(--v-content)); }
  .subnav a.is-planned { color:var(--ink-faint); cursor:default; }


/* ---------------------------------------------------------------- shared components (.c-*) */
.c-kpis { display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:12px; margin:0 0 20px; }
.c-kpi { background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg); padding:12px 14px; display:flex; flex-direction:column; gap:2px; position:relative; overflow:hidden; text-decoration:none; color:inherit; }
.c-kpi::before { content:""; position:absolute; top:0; left:0; right:0; height:3px; background:var(--k, var(--v-content)); }
a.c-kpi:hover { border-color:var(--k, var(--v-content)); }
.c-kpi-val { font-size:24px; font-weight:750; font-family:var(--font-data); line-height:1.15; }
.c-kpi-lbl { font-size:11.5px; color:var(--ink-soft); }
.c-kpi-sub { font-size:10.5px; color:var(--ink-faint); }
.c-card { background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:14px 16px; margin-bottom:14px; box-shadow:0 1px 3px rgba(0,0,0,.04); }
.c-card.is-focus { outline:2px solid var(--v-content); outline-offset:2px; }
.c-card-head { display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; align-items:baseline; margin-bottom:6px; }
.c-eyebrow { font-size:10.5px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; color:var(--ink-soft); }
.c-asked { font-size:11.5px; color:var(--ink-soft); }
.c-idea { border-top:1px solid var(--line); padding:12px 0; display:grid; gap:8px; margin:0; }
.c-idea:first-of-type { border-top:0; }
.c-idea.is-focus { background:color-mix(in srgb, var(--v-content) 6%, transparent); border-radius:8px; padding-inline:8px; }
.c-idea-head { display:flex; gap:6px; flex-wrap:wrap; }
.c-idea-head:empty { display:none; }
.c-idea-title, .c-post-title { display:block; font-size:15px; line-height:1.35; color:var(--ink); }
.c-idea-why { display:block; font-size:12.5px; color:var(--ink-soft); line-height:1.45; margin-top:2px; }
.c-pill { display:inline-block; font-size:10.5px; font-weight:700; padding:2px 8px; border-radius:5px; background:var(--surface-2); border:1px solid var(--line); color:var(--ink-soft); }
.c-pill-event { background:#FFF7ED; color:#C2410C; border-color:#FED7AA; }
.c-preview { font-size:13px; line-height:1.5; background:var(--surface-2); border:1px solid var(--line); border-radius:8px; padding:8px 10px; margin-top:8px; }
.c-preview summary { cursor:pointer; list-style:none; }
.c-preview summary::-webkit-details-marker { display:none; }
.c-preview[open] .c-preview-first, .c-preview[open] .c-more { display:none; }
.c-more { color:var(--v-content); font-weight:650; font-size:12px; white-space:nowrap; }
.c-preview-text { white-space:pre-wrap; margin:0; }
.c-edit summary { cursor:pointer; font-size:12px; color:var(--ink-soft); }
.c-edit label { display:grid; gap:4px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-soft); margin-top:8px; }
.c-edit input, .c-edit textarea { font:inherit; font-size:13px; text-transform:none; letter-spacing:0; font-weight:400; color:var(--ink); background:var(--surface-2); border:1px solid var(--line-strong); border-radius:6px; padding:7px 9px; width:100%; box-sizing:border-box; }
.c-actions { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; align-items:center; }
.c-actions form { margin:0; }
.c-list-actions { border-top:1px dashed var(--line); padding-top:10px; margin-top:4px; justify-content:flex-start; }
.c-btn { display:inline-flex; align-items:center; gap:6px; font:inherit; font-size:13px; font-weight:700; padding:8px 14px; border-radius:9px; border:1px solid transparent; cursor:pointer; text-decoration:none; white-space:nowrap; }
.c-btn-ok { background:var(--ok); color:#fff; }
.c-btn-no { background:var(--surface-2); color:var(--crit); border-color:var(--line-strong); }
.c-btn-quiet { background:transparent; color:var(--ink); border-color:var(--line-strong); }
.c-btn:disabled { opacity:.6; cursor:wait; }
.c-warn { font-size:12px; color:var(--warn); background:var(--warn-soft); border-radius:6px; padding:5px 8px; margin-top:6px; }
.c-empty { text-align:center; color:var(--ink-soft); padding:22px 10px; font-size:13.5px; }
.c-empty-ico { display:block; font-size:22px; margin-bottom:4px; }
.c-pv { margin-top:10px; }
.c-pv-tabs { display:flex; gap:4px; flex-wrap:wrap; border-bottom:1px solid var(--line); margin-bottom:10px; }
.c-pv-tab { font:inherit; font-size:12px; font-weight:650; padding:6px 10px; border:0; background:none; color:var(--ink-soft); cursor:pointer; border-bottom:2px solid transparent; }
.c-pv-tab.on { color:var(--ink); border-bottom-color:var(--v-content); }
.c-dot { display:inline-grid; place-items:center; width:15px; height:15px; border-radius:50%; background:var(--warn); color:#fff; font-size:10px; }
.c-feed { max-width:420px; background:#fff; color:#111; border:1px solid #dcdcdc; border-radius:10px; overflow:hidden; font-family:-apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; }
.c-feed-top { display:flex; gap:8px; align-items:center; padding:10px 12px; }
.c-feed-top b { display:block; font-size:13px; }
.c-feed-top span { display:block; font-size:11px; color:#666; }
.c-feed-logo { width:34px; height:34px; border-radius:50%; object-fit:contain; background:#f3f3f3; border:1px solid #e5e5e5; }
.c-feed-text { font-size:13.5px; line-height:1.45; padding:2px 12px 10px; white-space:pre-wrap; }
.c-seemore { color:#666; }
.c-feed-img { background:#eee; overflow:hidden; }
.c-feed-img img { width:100%; height:100%; object-fit:cover; display:block; }
.c-feed-instagram .c-feed-text { padding-top:10px; }
.c-pv-meta { font-size:11.5px; color:var(--ink-soft); margin-top:6px; max-width:420px; }
.c-fulltext summary { cursor:pointer; }
.c-fulltext p { white-space:pre-wrap; font-size:12.5px; }
.c-toast { position:fixed; left:50%; bottom:22px; transform:translateX(-50%); z-index:3000; background:#111827; color:#fff; padding:12px 16px; border-radius:10px; display:flex; gap:14px; align-items:center; font-size:14px; box-shadow:0 10px 30px rgba(0,0,0,.3); }
.c-toast button { font:inherit; font-weight:800; color:#FBBF24; background:none; border:0; cursor:pointer; }
.c-newbar { position:sticky; top:8px; z-index:20; background:var(--v-content); color:#fff; border-radius:10px; padding:9px 14px; margin-bottom:12px; display:flex; justify-content:space-between; align-items:center; }
.c-newbar a { color:#fff; font-weight:800; }
.c-keys { font-size:11px; color:var(--ink-faint); margin:4px 0 12px; }
.c-keys kbd { font-size:10px; padding:1px 5px; border:1px solid var(--line-strong); border-radius:4px; background:var(--surface); }
@media (max-width:640px) {
  .c-actions { justify-content:stretch; }
  .c-actions form, .c-actions .c-btn { flex:1; }
  .c-actions .c-btn { justify-content:center; }
}

/* Market rules panel (step 13) */
.c-rules { border:1px solid var(--line); border-radius:var(--r-lg); padding:10px 12px; font-size:13px; background:var(--surface); }
.c-rules.is-bad { border-color:var(--crit); background:var(--crit-soft); }
.c-rules.is-warn { border-color:color-mix(in srgb, var(--warn) 45%, transparent); background:var(--warn-soft); }
.c-rules.is-ok { border-color:color-mix(in srgb, var(--ok) 35%, transparent); background:var(--ok-soft); }
.c-rules-head { display:flex; justify-content:space-between; gap:8px; align-items:baseline; }
.c-rules ul { margin:6px 0 0; padding:0; list-style:none; display:flex; flex-direction:column; gap:8px; }
.c-rules-tag { display:inline-block; font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; padding:1px 6px; border-radius:4px; background:var(--surface-sunken, rgba(0,0,0,.06)); margin-right:4px; }
.c-rule-table td { vertical-align:top; font-size:12.5px; }
.c-markets { display:flex; flex-wrap:wrap; gap:8px 14px; margin:8px 0 12px; }
.c-markets label { display:flex; gap:6px; align-items:center; font-size:13px; }