*{box-sizing:border-box}body{margin:0;background:#eef1f6;color:#182c43;font:14px/1.6 Inter,"Microsoft YaHei",sans-serif}button,input,select,textarea{font:inherit}button,a,input,select,textarea{outline-offset:3px}button,.backup{border:1px solid #d7dfe8;background:#fff;color:#254561;border-radius:7px;padding:6px 12px;cursor:pointer}button:hover,.backup:hover{background:#e9eff7}a{color:inherit;text-decoration:none}.primary{background:#183d60;color:#fff;border-color:#183d60}.primary:hover{background:#285578}.top{height:62px;display:flex;align-items:center;justify-content:space-between;padding:0 30px;background:#162d45;color:white}.brand{font-size:19px;font-weight:700;letter-spacing:.08em}.backup{background:transparent;border-color:#597088;color:white}.backup:hover{background:#294863}.workspace{display:grid;grid-template-columns:252px minmax(0,1fr);max-width:1700px;margin:auto;min-height:calc(100vh - 62px)}aside{background:#f8fafd;border-right:1px solid #dbe2eb;padding:22px 17px}.aside-head,.board-head,.section-head,.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.aside-head{margin-bottom:14px}h1,h2,h3,p{margin:0}h2{font-size:17px}aside input,aside select{width:100%;margin-bottom:9px}input,textarea,select{border:1px solid #ced8e3;border-radius:7px;padding:8px 10px;background:#fff;color:#182c43}textarea{min-height:92px;resize:vertical}.case-link{display:block;text-align:left;width:100%;margin:5px 0;padding:10px 12px;overflow-wrap:anywhere}.case-link.active{background:#dce8f5;border-color:#aac2db}.case-link small{display:block;color:#536982}main{padding:26px clamp(16px,3vw,46px) 40px;min-width:0}.hero{border-bottom:2px solid #254767;padding:3px 0 19px;margin-bottom:20px}.hero h1{font-size:clamp(23px,3vw,36px);line-height:1.3;overflow-wrap:anywhere}.meta{color:#536982;margin-top:8px}.summary{margin-top:10px;white-space:pre-wrap}.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.chip{display:inline-block;padding:2px 10px;background:#e1ebf7;color:#214b71;border-radius:99px}.chip.warn{background:#fff0d7;color:#7d4b10}.chip.danger{background:#fce4e1;color:#9b342a}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.card,.welcome{background:#fff;border:1px solid #dbe2eb;border-radius:12px;padding:17px 19px;box-shadow:0 2px 6px #203e5f08;min-width:0}.wide{grid-column:1/-1}.section-head{margin-bottom:14px}.section-head h2{border-left:4px solid #35618a;padding-left:9px}.records{display:grid;gap:10px}.record{border:1px solid #e0e7ef;border-radius:8px;padding:10px 12px;overflow-wrap:anywhere}.record-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.record-head h3{font-size:15px}.record p{white-space:pre-wrap;margin-top:4px}.record button{padding:2px 7px;white-space:nowrap}.record-tools{display:flex;gap:5px}.muted{color:#566d84}.relation{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:5px 0}.party{background:#e9f0fa;border:1px solid #b9cde3;padding:5px 10px;border-radius:6px}.party:last-child{background:#e5f3f0;border-color:#a1cfc6}.arrow{color:#315c83}.amount{font-variant-numeric:tabular-nums;font-weight:bold}.bar{height:8px;background:#e8eef6;border-radius:5px;overflow:hidden;margin:8px 0 3px}.bar div{height:100%;background:#3f729f}.timeline{grid-auto-flow:column;grid-auto-columns:minmax(195px,1fr);overflow-x:auto;padding:3px 0 8px}.timeline .record{border-top:3px solid #3f729f}.welcome{min-height:290px;display:grid;place-content:center;text-align:center;gap:14px}.welcome button{justify-self:center}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}dialog{border:1px solid #dbe2eb;border-radius:12px;padding:22px;width:min(520px,calc(100% - 24px));color:inherit}dialog::backdrop{background:#152f4866}.dialog-head{margin-bottom:15px}form label{display:grid;gap:4px;margin-bottom:11px}form footer{display:flex;justify-content:flex-end;gap:8px}#form-error{color:#a3342b;margin-bottom:8px}#toast{position:fixed;bottom:18px;right:18px;background:#183d60;color:white;padding:10px 14px;border-radius:8px;max-width:calc(100vw - 36px)}@media(max-width:820px){.grid{grid-template-columns:minmax(0,1fr)}.workspace{grid-template-columns:195px minmax(0,1fr)}}@media(max-width:590px){.top{padding:0 14px}.workspace{display:block}aside{border-right:0;border-bottom:1px solid #dbe2eb;padding:12px}nav{max-height:155px;overflow:auto}main{padding:15px 12px}.board-head{align-items:flex-start}}
.relation-diagram{display:grid;gap:12px}
.relation-diagram:not(:empty){padding:18px 0 22px}
.relation-chain{display:flex;align-items:center;gap:12px;overflow-x:auto;padding:3px 2px 8px}
.relation-chain .party{min-width:110px;text-align:center;padding:12px}
.relation-chain .arrow{white-space:nowrap}
.record[data-kind="主诉路径"]{border-left:4px solid #28796d;background:#f3faf8}
.record[data-kind="备选路径"]{border:1px dashed #af6258;border-left-width:4px;background:#fff8f6}
.timeline{gap:0}
.timeline .record{position:relative;margin-top:9px;border-radius:0;border-left:0}
.timeline .record::before{content:"";position:absolute;top:-8px;left:14px;width:10px;height:10px;border:2px solid #3f729f;border-radius:50%;background:white}
.timeline .record[data-kind="期限"],.timeline .record[data-kind="重要提醒"]{border-top-color:#af5147}
.timeline .record[data-kind="期限"]::before,.timeline .record[data-kind="重要提醒"]::before{background:#af5147;border-color:#af5147}
.table-wrap{overflow-x:auto;margin-top:10px}
.table-wrap table{width:100%;border-collapse:collapse}
.table-wrap th,.table-wrap td{text-align:left;vertical-align:top;border:1px solid #dbe2eb;padding:8px;white-space:pre-wrap;overflow-wrap:anywhere;min-width:65px}
.table-wrap th{background:#eef3f9;white-space:nowrap}
.table-wrap button{padding:2px 6px;white-space:nowrap}
.difference{margin:12px 0;padding:10px 12px;background:#fff8e8;border:1px dashed #c59a52;border-radius:8px;white-space:pre-wrap;overflow-wrap:anywhere}

/* Case presentation */
body{background:#f5f6fb;color:#23374b;font-family:"Noto Serif SC","Songti SC",SimSun,serif}
.top{position:sticky;top:0;z-index:2;height:44px;background:#fff;color:#213247;padding:0 15px;border-bottom:1px solid #e8eaf1;display:grid;grid-template-columns:1fr minmax(0,2fr) 1fr;font-family:Inter,"Microsoft YaHei",sans-serif}
.top #page-title{text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:600}
.top #show-cases{justify-self:start}
.top .record-tools{justify-self:end}
.top button,.top .backup{white-space:nowrap;padding:3px 8px;font-size:12px;background:#fff;color:#23374b;border-color:#e1e6ef}
.workspace{display:block;max-width:none}
#case-panel{position:fixed;top:44px;left:0;z-index:3;width:min(310px,90vw);box-shadow:4px 5px 16px #263b5426;max-height:calc(100vh - 44px);overflow:auto;border-bottom:1px solid #dbe2eb}
main{max-width:1440px;margin:auto;padding:32px clamp(18px,5.55vw,80px) 48px}
.hero{margin-bottom:21px}
.hero h1{font-size:clamp(22px,2.45vw,34px);font-weight:700}
.grid{gap:18px}
#board > .grid, #shared-board > .grid { align-items: start; }
#board:not(.is-editing) > .grid > :is(
  [data-section="points"].section-empty:has(+ [data-section="amounts"]:not(.section-empty)),
  [data-section="points"]:not(.section-empty) + [data-section="amounts"].section-empty,
  [data-section="risks"].section-empty:has(+ [data-section="paths"]:not(.section-empty)),
  [data-section="risks"]:not(.section-empty) + [data-section="paths"].section-empty
) { display: none; }
#board:not(.is-editing) > .grid > :is(
  [data-section="points"]:not(.section-empty):has(+ [data-section="amounts"].section-empty),
  [data-section="points"].section-empty + [data-section="amounts"]:not(.section-empty),
  [data-section="risks"]:not(.section-empty):has(+ [data-section="paths"].section-empty),
  [data-section="risks"].section-empty + [data-section="paths"]:not(.section-empty)
) { grid-column: 1 / -1; }
.grid .card [hidden] { display: none; }
#trash .trash-purge { color: #98372b; }
#trash .trash-purge:hover { background: #fce4e1; }
.compact-section {
  display: flex;
  flex-direction: column;
}
.compact-section .section-head { flex-shrink: 0; }
.compact-section .section-content {
  flex: 1;
  min-height: 0;
  overflow: auto;
}
.card{border-color:#e1e4ed;padding:17px 20px}
.section-head h2{font-size:17px;font-weight:600}
#board:not(.is-editing) .edit-only{display:none}
.diagram-scroll{overflow-x:auto}
.diagram-scroll svg{display:block;width:100%;max-height:390px}
.diagram-scroll .node-label{font-family:"Microsoft YaHei",sans-serif;font-size:16px;font-weight:600}
.diagram-scroll .edge-label{font-size:11px;paint-order:stroke;stroke:#fff;stroke-width:4;stroke-linejoin:round}
.evidence{font-size:12px;color:#526177;white-space:pre-wrap;overflow-wrap:anywhere;margin-top:4px}
.amount-row{border:0;padding:2px 0}
.amount-row .amount{margin-left:auto;white-space:nowrap}
.amount-row h3{font-weight:500;font-size:14px}
.amount-row .bar{height:13px;margin:4px 0 2px}
.amount-row .bar div{background:linear-gradient(90deg,#315a83,#5687b6)}
.amount-row:nth-child(3n+2) .bar div{background:linear-gradient(90deg,#137366,#4eaa9d)}
.amount-row:nth-child(3n+3) .bar div{background:linear-gradient(90deg,#ae741b,#e6ad4f)}
.table-wrap td{background:#fff}
.table-wrap tr:nth-child(even) td{background:#f8f9fc}
.timeline{grid-auto-columns:minmax(145px,1fr);padding-top:8px}
.timeline .record{border-right:0;border-bottom:0;text-align:center}
.timeline .record::before{left:calc(50% - 7px)}
.timeline .record-head{justify-content:center}
@media(max-width:620px){.top{grid-template-columns:auto minmax(0,1fr) auto;gap:7px;padding:0 7px}.top .backup{display:none}.card{padding:13px}.timeline{grid-auto-columns:minmax(135px,1fr)}}

#notes-dialog{width:min(680px,calc(100% - 24px));max-height:90vh}
#notes-form footer{position:sticky;bottom:-22px;background:white;padding:10px 0}
.draft-group{margin:12px 0}
.draft-group h3{margin-bottom:6px}
.draft-group .record{margin:7px 0}
#notes-form .draft-include{display:flex;align-items:center;gap:6px}
#notes-error{color:#9b342a}
.case-list-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;margin:5px 0;border:1px solid #d7dfe8;border-radius:7px;background:#fff;padding-right:6px}
.case-list-row:hover{background:#eef3f9}
.case-list-row.active{background:#dce8f5;border-color:#aac2db}
.case-list-row .case-link{margin:0;border:0;background:transparent}
.case-list-row .case-delete{display:grid;place-items:center;width:32px;height:32px;padding:0;border:0;background:transparent;color:#65798e}
.case-list-row .case-delete:hover,.case-list-row .case-delete:focus-visible{background:#fce4e1;color:#9b342a}
.case-delete svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.template-group,#notes-paste{margin:9px 0;padding:9px 12px;border:1px solid #dbe2eb;border-radius:8px}
.template-group summary,#notes-paste summary{cursor:pointer;font-weight:600}
.template-rows{display:grid;gap:8px;margin:8px 0}
.template-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 12px}
.template-row label{margin:0}
.template-row textarea{min-height:54px}
.template-remove{justify-self:start;align-self:end}
@media(max-width:480px){.template-row{grid-template-columns:minmax(0,1fr)}}
.auth-shell{
  min-height:100vh;
  color:#f8f4e9;
  background:radial-gradient(ellipse at 10% 90%,#254867 0%,transparent 52%),linear-gradient(135deg,#122238,#182d46 52%,#0c1728);
}
.auth-page{
  position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,405px);
  align-items:center;gap:clamp(24px,7vw,110px);max-width:1180px;min-height:100svh;
  padding:clamp(24px,6vw,88px);
}
.auth-brand{position:relative;display:grid;gap:22px}
.auth-brand h1{font-size:clamp(38px,5vw,72px);line-height:1.15;letter-spacing:.08em;font-weight:700}
.auth-brand h1+p{margin-top:12px;color:#d8c5a2;font-size:clamp(16px,2vw,21px);letter-spacing:.14em}
.auth-art{position:relative;width:min(100%,370px);height:clamp(165px,19vw,245px);isolation:isolate}
.auth-art::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,#d8c5a21f 0 1px,transparent 1px 25px),repeating-linear-gradient(#d8c5a21f 0 1px,transparent 1px 25px);mask-image:radial-gradient(ellipse,#000 25%,transparent 74%)}
.auth-art i{position:absolute;left:25%;top:15%;width:51%;height:70%;border:1px solid #ccb1847d;border-radius:8px;background:#213953;transform:rotate(-13deg)}
.auth-art i:nth-child(2){transform:rotate(12deg);background:#1a304a}
.auth-art i:nth-child(3){transform:none;background:linear-gradient(150deg,#324d66,#182e48);box-shadow:0 12px 40px #0a152966}
.auth-art span{position:absolute;inset:0;display:grid;place-items:center;color:#e1c48e;font-family:"Segoe UI Symbol","Arial Unicode MS",serif;font-size:clamp(62px,8vw,105px);font-variant-emoji:text}
.auth-caption{font-size:14px;color:#c1cfdd;letter-spacing:.06em}
.auth-caption span{margin:0 .35em;color:#e1c48e}
.auth-card{color:#22374e;background:#fbfaf7;border:1px solid #fff9;border-radius:18px;padding:clamp(24px,4vw,46px);box-shadow:0 24px 65px #07132366}
.auth-card h2{font-size:27px;line-height:1.3}
.auth-card form{margin-top:25px;font-family:Inter,"Microsoft YaHei",sans-serif}
.auth-card label{font-weight:600;gap:7px;margin-bottom:16px}
.auth-card input{width:100%;min-height:46px;padding:10px 12px}
.auth-card input:focus-visible,.auth-card button:focus-visible{outline:2px solid #39658e}
.auth-card button{min-height:44px}
.auth-actions{display:grid;grid-template-columns:2fr 1fr;gap:10px;margin-top:23px}
.auth-status{margin-top:12px;color:#834021;overflow-wrap:anywhere}
@media(max-width:740px){
  .auth-page{grid-template-columns:minmax(0,1fr);max-width:500px;align-content:center;gap:24px}
  .auth-brand{gap:10px}.auth-art{display:none}.auth-brand h1{font-size:38px}.auth-brand h1+p{margin-top:5px}
}
#share-fields{margin:12px 0}#share-form .draft-include{display:flex;align-items:center;gap:6px}

/* Shared visual language for the workspace and sign-in page. */
:root {
  --ink: #172b43;
  --muted: #536479;
  --line: #dce3eb;
  --paper: #fffefa;
  --gold: #e2c38f;
  --navy: #1c3655;
  --workspace-top: 58px;
}
body:not(.auth-shell) {
  color: var(--ink);
  background: radial-gradient(ellipse at 0 0, #e6edf5, transparent 55%), #f4f6f9;
  font-family: Inter, "Microsoft YaHei", "PingFang SC", sans-serif;
}
.top {
  height: var(--workspace-top);
  padding-inline: clamp(12px, 3vw, 36px);
  grid-template-columns: 1fr minmax(0, 1.4fr) 1fr;
  gap: 12px;
  border-bottom: 1px solid #38516a;
  background: linear-gradient(110deg, #172a42, #203d5c);
  color: #f8f5ee;
}
.top #page-title { font-size: 14px; }
.top button, .top .backup {
  background: #ffffff0b;
  color: inherit;
  border-color: #ffffff42;
  padding: 5px 9px;
}
.top button:hover, .top .backup:hover, .top [aria-expanded="true"] { background: #ffffff25; }
.top .record-tools { align-items: center; white-space: nowrap; }
#case-panel {
  top: var(--workspace-top);
  max-height: calc(100dvh - var(--workspace-top));
  width: min(332px, 90vw);
  padding: 22px 18px;
  border: 1px solid var(--line);
  border-top: 0;
  border-radius: 0 0 16px 0;
  background: #f8fafc;
  box-shadow: 12px 16px 38px #14283e24;
}
.case-list-row { border-radius: 10px; margin-block: 7px; }
.case-list-row.active {
  background: #e8eff7;
  border-color: #a8bbd0;
  box-shadow: inset 3px 0 #3c5d82;
}
.case-list-row .case-link { padding-block: 10px; }
.case-link small, .meta, .muted { color: var(--muted); }
#board, #shared-board { padding-top: clamp(20px, 3.8vw, 52px); }
#board .hero, #shared-board .hero {
  padding: clamp(18px, 3vw, 34px);
  margin-bottom: 20px;
  background: linear-gradient(115deg, #fffefa, #f0f4f8);
  border: 1px solid var(--line);
  border-radius: 17px;
  box-shadow: inset 0 3px #ad8b56, 0 4px 12px #172b4309;
}
.hero h1, .section-head h2 { font-family: "Noto Serif SC", "Songti SC", SimSun, serif; }
.hero .summary { max-width: none; line-height: 1.75; overflow-wrap: anywhere; }
.hero .summary-preview {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 8;
  overflow: hidden;
}
.hero .summary-toggle { margin-top: 10px; }
.hero .record-tools { flex-wrap: wrap; justify-content: flex-end; }
.hero .record-tools button:first-child { background: var(--navy); color: white; border-color: var(--navy); }
.hero .record-tools button:first-child:hover { background: #2a4e75; }
#board .card, #shared-board .card, #board .welcome {
  background: var(--paper);
  border-color: var(--line);
  border-radius: 15px;
  box-shadow: 0 5px 18px #172b4309;
}
.section-head h2 { border-left-color: #a78652; }
.diagram-scroll {
  border: 1px solid #e2e8ef;
  border-radius: 11px;
  background: radial-gradient(circle, #c6d3e2 0.8px, transparent 0.9px) 0 0 / 16px 16px, #f8fafc;
}
.diagram-scroll .edge-label { stroke: #f8fafc; }
.amount-row .bar { height: 9px; border-radius: 999px; }
dialog {
  background: var(--paper);
  border-color: var(--line);
  border-radius: 16px;
  box-shadow: 0 20px 65px #14283e44;
}
dialog::backdrop { background: #14283e75; }
#notes-form footer { background: var(--paper); }
.auth-shell {
  background: radial-gradient(ellipse at 12% 85%, #294c6d, transparent 54%),
    repeating-linear-gradient(135deg, #ffffff08 0 1px, transparent 1px 30px),
    linear-gradient(135deg, #15263c, #101c2e);
}
.auth-card { border-top: 3px solid var(--gold); border-radius: 20px; }
.auth-card h2 { color: var(--ink); }
.auth-card .primary { background: var(--navy); }
.auth-card .primary:hover { background: #2a4e75; }
.auth-brand {
  justify-items: center;
  justify-self: center;
  text-align: center;
  gap: clamp(14px, 2vw, 24px);
  width: 100%;
}
.auth-brand h1 {
  font-size: clamp(38px, 4.3vw, 64px);
  letter-spacing: .06em;
}
.auth-art {
  width: min(100%, 320px);
  height: clamp(155px, 16vw, 205px);
}
.auth-art i { left: 24.5%; }
.auth-art span { font-size: clamp(60px, 7vw, 86px); }
.auth-caption { text-wrap: balance; }
@media (max-width: 680px) {
  :root { --workspace-top: 76px; }
  .top { grid-template-columns: auto minmax(0, 1fr); gap: 0 8px; padding-block: 5px; }
  .top #page-title { text-align: right; }
  .top .record-tools { grid-column: 1 / -1; }
  .hero .board-head { flex-wrap: wrap; }
  .hero .record-tools { justify-content: flex-start; }
}
.timeline-detail {
  margin-top: 16px;
  padding: 16px 20px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #f5f8fb;
  scroll-margin-block: 90px 16px;
}
.timeline-detail p {
  margin-top: 8px;
  max-width: 78ch;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  line-height: 1.75;
}
.timeline .timeline-expand { margin-top: 6px; }
