/* A scoped Luma surface: luminous bezel, a quiet light pool, and honest graph edges. */
.history-workspace { height:100%; display:flex; flex-direction:column; overflow:hidden; --history-ink:#e7e0d8; --history-muted:#a29ba6; --history-accent:#d9b375; color:var(--history-ink); font-family:inherit; min-width:0; }
.history-workspace button { font:inherit; color:inherit; cursor:pointer; }
.history-workspace button:focus-visible,.history-canvas:focus-visible { outline:2px solid #e8c18a; outline-offset:3px; }
.history-toolbar { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:0 0 16px; }
.history-mode-switch { display:flex; gap:3px; padding:4px; border:1px solid #ffffff10; border-radius:10px; background:#ffffff04; }
.history-mode-switch button { padding:9px 11px; border:0; border-radius:7px; background:transparent; color:#a9a0ad; font-size:11px; white-space:nowrap; }
.history-mode-switch button[aria-pressed="true"] { background:#d9b3751c; color:#e6c99e; box-shadow:0 1px 4px #0003; }
.history-progress { font-size:10px; color:var(--history-muted); white-space:nowrap; }
.history-score-strip { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:20px; }
.history-score-strip>span { display:flex; align-items:center; gap:7px; font-size:10px; color:#afa7b5; border-bottom:1px solid #ffffff10; padding:7px 0 10px; }
.history-score-strip strong { margin-left:auto; font-size:19px; line-height:1; color:#eee3d7; font-weight:500; font-variant-numeric:tabular-nums; }
.history-team-dot { width:5px; height:5px; border-radius:50%; background:#d9b375; }
.history-team-dot.theirs { background:#a994de; }
.history-sequence { display:flex; flex-direction:column; gap:10px; flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding-right:8px; scrollbar-width:thin; scrollbar-color:#8b7a9855 transparent; }
.history-sequence > .history-list-trick { flex:none; }
.history-list-trick { position:relative; border:1px solid #ffffff12; border-radius:13px; background:radial-gradient(ellipse at 15% 0%,#d9b37507,transparent 65%),#1c1b2280; overflow:hidden; }
.history-list-trick.is-selected { border-color:color-mix(in srgb,var(--history-accent) 45%,transparent); box-shadow:0 0 25px color-mix(in srgb,var(--history-accent) 5%,transparent); }
.history-list-heading { display:flex; width:100%; align-items:center; justify-content:space-between; gap:12px; padding:15px 14px 9px; text-align:left; background:transparent; border:0; }
.history-list-heading>span:first-child { display:flex; flex-direction:column; gap:7px; font-size:9px; letter-spacing:.15em; color:#a9a0ad; }
.history-list-heading strong { font-size:15px; letter-spacing:0; color:var(--history-ink); font-weight:500; }
.history-point-badge { font-size:11px; color:var(--history-accent); white-space:nowrap; }
.history-point-badge i { margin-left:8px; font-style:normal; color:#bbb2c2; }
.history-card-ribbon { display:flex; flex-wrap:wrap; gap:6px; padding:0 14px 14px; }
.history-card-ribbon>span { border:1px solid #ffffff0c; border-radius:4px; padding:5px 6px; font-size:8px; color:#8c8495; }
.history-card-ribbon b { margin-left:3px; font-size:11px; font-weight:500; color:#bcb5c4; }
.history-card-ribbon>span.is-winner { border-color:color-mix(in srgb,var(--history-accent) 35%,transparent); color:var(--history-accent); background:color-mix(in srgb,var(--history-accent) 8%,transparent); }
.history-card-ribbon>span.is-winner b { color:var(--history-accent); }
.history-list-plays { margin:0 14px; padding:2px 0; list-style:none; border-top:1px solid #ffffff0b; }
.history-list-play { display:flex; align-items:center; gap:10px; min-height:73px; padding:9px 0; border-bottom:1px solid #ffffff08; }
.history-order { font-size:9px; color:#797280; width:16px; flex:none; }
.history-card-frame { display:block; width:38px; height:54px; flex:none; pointer-events:none; position:relative; }
.history-card-frame .playing-card { width:38px!important; height:54px!important; min-width:0!important; min-height:0!important; --card-width:38px; --card-height:54px; border-radius:4px!important; }
.history-list-play>span:nth-of-type(3) { display:flex; flex-direction:column; gap:5px; }
.history-list-play strong { font-size:11px; font-weight:500; color:#dcd4e0; }
.history-list-play small { font-size:10px; color:#928a9b; }
.history-winner-label { margin-left:auto; color:var(--history-accent); font-size:8px; letter-spacing:.08em; }
.history-rule-reason { margin:14px 14px 10px; color:#c6bdcd; font-size:11px; line-height:1.7; }
.history-trump-note { margin:0 14px 15px; color:#8c8496; font-size:9px; }
.history-list-trick.is-pending { padding:15px 14px; border-style:dashed; background:transparent; opacity:.56; }
.history-trick-label { display:flex; justify-content:space-between; align-items:center; color:#9d95a7; font-size:9px; letter-spacing:.12em; }
.history-trick-label small { font-size:9px; letter-spacing:0; color:#827a8b; }
.history-pending-line { display:flex; gap:6px; margin-top:13px; }
.history-pending-line span { width:27px; height:34px; border:1px solid #ffffff15; border-radius:4px; }
.history-footer { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:18px; padding-top:14px; border-top:1px solid #ffffff0a; color:#7e7689; font-size:9px; line-height:1.5; }
.history-footer small { white-space:nowrap; font-size:8px; }
.history-trick-nav { display:flex; gap:5px; margin:0 0 12px; }
.history-trick-nav button { flex:1; padding:8px 6px; border:1px solid #ffffff12; border-radius:6px; background:#ffffff03; color:#a79daf; font-size:10px; }
.history-trick-nav button[aria-pressed="true"] { color:#e1c396; border-color:#d9b37566; background:#d9b3750a; }
.history-canvas { position:relative; height:clamp(180px,45vh,510px); min-height:180px; flex:1; width:100%; overflow:hidden; border:1px solid #ffffff13; border-radius:12px; isolation:isolate; background-color:#17161d; background-image:radial-gradient(circle,#9280a242 .7px,transparent .9px); background-size:24px 24px; touch-action:none; cursor:grab; }
.history-canvas::before { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(ellipse at 80% 5%,#9e7dd312,transparent 55%),radial-gradient(ellipse at 5% 90%,#d9b37508,transparent 50%); z-index:-1; }
.history-canvas.is-dragging { cursor:grabbing; user-select:none; }
.history-canvas-world { position:absolute; left:0; top:0; width:2400px; height:1100px; transform-origin:0 0; will-change:transform; }
.history-links { position:absolute; inset:0; overflow:visible; pointer-events:none; }
.history-edge { fill:none; stroke:#a994de50; stroke-width:1.5px; }
.history-edge.sequence { stroke:#d9b37577; stroke-width:2px; stroke-dasharray:5 5; }
.history-edge.winner { stroke:#e0c394a0; stroke-width:2px; }
.history-edge-dot { fill:#9e8ab9; }
.history-edge-dot.winner,.history-edge-dot.sequence { fill:#d9b375; }
.history-node { --history-px:50%; --history-py:0%; --node-accent:#b4a0ce; position:absolute; border:1px solid #9881b83d; border-radius:14px; background:radial-gradient(ellipse at var(--history-px) var(--history-py),color-mix(in srgb,var(--node-accent) 12%,transparent),transparent 72%),#23202c; box-shadow:0 10px 30px #0004; overflow:hidden; color:#e9e1ed; }
.history-node::after { content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; box-shadow:inset 0 1px 0 #ffffff08; }
.history-node:hover { border-color:color-mix(in srgb,var(--node-accent) 65%,transparent); box-shadow:0 0 25px color-mix(in srgb,var(--node-accent) 10%,transparent),0 12px 28px #0005; }
.history-node.ours { --node-accent:#d9b375; }
.history-node.theirs { --node-accent:#a994de; }
.history-node.pending { opacity:.55; border-style:dashed; }
.history-trick-node.is-selected { border-color:#dec18b; box-shadow:0 0 0 1px #dec18b30,0 0 32px #dec18b12; }
.history-node-grip { position:relative; display:flex; align-items:center; justify-content:space-between; padding:13px 15px; width:100%; background:#ffffff03; border:0; border-bottom:1px solid #ffffff09; font-size:9px!important; letter-spacing:.1em; color:#b3a6bf!important; cursor:grab!important; text-align:left; }
.history-node-grip i { font-style:normal; font-size:16px; opacity:.5; }
.history-node-body { padding:15px 17px; }
.history-node-body h3 { margin:0 0 8px; font-size:23px; font-weight:500; letter-spacing:-.025em; }
.history-node-body p { font-size:11px; color:#a295af; margin:0 0 13px; }
.history-node-tag { font-size:8px; letter-spacing:.12em; color:var(--node-accent); }
.history-play-node-content { display:flex; align-items:center; gap:16px; padding:14px 17px; }
.history-play-node .history-card-frame { width:44px; height:62px; }
.history-play-node .history-card-frame .playing-card { width:44px!important; height:62px!important; }
.history-play-node-content>span:last-child { display:flex; flex-direction:column; gap:7px; }
.history-play-node-content strong { font-size:21px; font-weight:500; }
.history-play-node-content small { font-size:9px; color:#9e91aa; }
.history-play-node-content b { font-size:8px; font-weight:500; letter-spacing:.06em; color:var(--node-accent); }
.history-play-node.is-winner { border-color:color-mix(in srgb,var(--node-accent) 65%,transparent); }
.history-canvas-caption { position:absolute; bottom:13px; left:15px; color:#8b7d98; font-size:7px; letter-spacing:.12em; pointer-events:none; background:#17161dcc; padding:5px; border-radius:4px; }
.history-zoom-controls { display:flex; align-items:center; gap:7px; margin-top:10px; }
.history-zoom-controls button { border:1px solid #ffffff12; background:#ffffff04; border-radius:6px; font-size:10px; padding:8px 11px; min-height:32px; }
.history-zoom-value { min-width:35px; color:#a89bb4; text-align:center; font-size:9px; }
.history-zoom-controls [data-history-action="reset"] { margin-left:auto; }
.history-graph-detail { flex:none; max-height:130px; overflow:auto; margin-top:18px; padding:16px; border:1px solid #d9b37529; border-radius:12px; background:#d9b37504; }
.history-graph-detail small { display:block; font-size:8px; color:#a28f74; letter-spacing:.12em; margin-bottom:9px; }
.history-graph-detail strong { display:block; font-size:16px; font-weight:500; }
.history-graph-detail p { font-size:11px; line-height:1.8; color:#a99fb5; margin:10px 0; }
.history-graph-detail>span { font-size:9px; color:#8c7c9a; }
#history-dialog #history-container { overflow:hidden; }
.history-toolbar,.history-score-strip,.history-trick-nav,.history-zoom-controls,.history-footer { flex:none; }
@media (max-height:700px) { .history-score-strip { margin-bottom:10px; } .history-graph-detail { max-height:95px; margin-top:10px; padding:11px; } .history-graph-detail p { margin:6px 0; line-height:1.5; } .history-footer { margin-top:10px; padding-top:8px; } .history-toolbar { padding-bottom:10px; } }
@media (prefers-reduced-motion:reduce) { .history-node,.history-list-trick { transition:none!important; } .history-canvas-world { will-change:auto; } }

/* Match receipts are public engine results; no audit-only foul state is exposed. */
.history-round-receipt { flex:none; margin:0 0 12px; padding:12px 14px; border:1px solid #d9b37542; border-radius:11px; background:linear-gradient(120deg,#d9b3750a,#a994de05); max-height:110px; overflow-y:auto; scrollbar-width:thin; scrollbar-color:#b5996b55 transparent; }
.history-round-receipt>span { display:block; color:#a99880; font-size:8px; letter-spacing:.13em; margin-bottom:6px; }
.history-round-receipt strong { font-size:14px; font-weight:500; color:#edddc5; }
.history-round-receipt p { font-size:10px; line-height:1.6; color:#a99faf; margin:6px 0; }
.history-round-receipt>b { font-size:10px; font-weight:500; color:#dec095; }
.history-score-strip>span { flex-wrap:wrap; row-gap:7px; }
.history-points-breakdown { flex-basis:100%; color:#8f839a; font-size:8px; line-height:1.5; }
.history-match-balls { flex:none; display:flex; justify-content:space-between; align-items:center; gap:12px; margin:-8px 0 15px; color:#9d91a8; font-size:9px; }
.history-match-balls strong { margin-left:7px; color:#d9c8b1; font-size:12px; font-weight:500; font-variant-numeric:tabular-nums; }
.history-match-balls>span:last-child { text-align:right; line-height:1.6; }
.history-list-trick.is-closed { padding:14px; background:#ffffff02; border-style:dashed; border-color:#ffffff0c; }
.history-unplayed { margin:10px 0 0; font-size:10px; color:#776d83; }
.history-node.closed { opacity:.5; border-style:dashed; }
.history-workspace[data-history-mode="graph"] { overflow-y:auto; scrollbar-width:thin; scrollbar-color:#8b7a9855 transparent; }
@media (max-height:700px) { .history-round-receipt { max-height:85px; padding:9px 12px; margin-bottom:9px; } .history-match-balls { margin-bottom:9px; } }

.history-edge.next-lead { stroke:#a5c8b599; stroke-width:1.75px; stroke-dasharray:3 5; }
.history-edge-dot.next-lead { fill:#a5c8b5; }

/* Keep the selected hand readable while the graph remains an overview. */
.history-reading-layout { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr); gap:16px; flex:1; min-height:0; }
.history-content-pane { display:flex; flex-direction:column; min-width:0; min-height:0; overflow:hidden; }
.history-trick-inspector { min-width:0; min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:16px; border:1px solid #d9b37542; border-radius:14px; background:linear-gradient(145deg,#d9b37509,#a994de04),#1c1d24; scrollbar-width:thin; scrollbar-color:#b5996b55 transparent; }
.history-trick-inspector header>span { font-size:12px; letter-spacing:.08em; color:#d4bd96; }
.history-trick-inspector header h3 { margin:8px 0; font:26px/1.15 Georgia,serif; color:#f1e6d8; }
.history-trick-inspector header p { color:#c9bdce; font-size:14px; line-height:1.55; margin:0 0 15px; }
.history-step-controls { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:8px; padding-bottom:16px; }
.history-step-controls button { min-height:40px; padding:8px 9px; border:1px solid #d9b37540; border-radius:7px; background:#d9b3750a; font-size:13px; white-space:nowrap; }
.history-step-controls button:last-child { text-align:right; }
.history-step-controls>span { color:#bcb1c5; font-size:12px; text-align:center; }
.history-focus-plays { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.history-focus-plays li { min-width:0; border:1px solid #ffffff12; border-radius:9px; padding:10px; background:#ffffff03; }
.history-focus-plays li.is-winner { border-color:#e3c38199; background:#e3c3810e; box-shadow:inset 0 1px 0 #e3c38120; }
.history-focus-order { display:flex; align-items:center; gap:6px; margin-bottom:9px; min-height:22px; }
.history-focus-order>span { display:grid; place-items:center; width:21px; height:21px; flex:none; border-radius:50%; border:1px solid #ffffff20; color:#b6a9c2; font-size:12px; }
.history-focus-order strong { font-size:13px; color:#e3d9e8; font-weight:500; overflow-wrap:anywhere; }
.history-focus-order b { margin-left:auto; color:#f0d18f; font-size:11px; font-weight:500; }
.history-focus-card { display:flex; align-items:center; gap:10px; min-width:0; }
.history-focus-card>.history-card-frame { width:48px; height:68px; }
.history-focus-card>.history-card-frame .playing-card { width:48px!important; height:68px!important; }
.history-focus-card>span:last-child { display:flex; flex-direction:column; gap:7px; min-width:0; }
.history-focus-card strong { font-size:14px; font-weight:500; color:#eee3ed; line-height:1.35; overflow-wrap:anywhere; }
.history-focus-card small { font-size:12px; line-height:1.4; color:#b5a9bf; }
.history-focus-facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding:15px 0 0; }
.history-focus-facts>span { display:flex; flex-direction:column; gap:5px; color:#ac9fb6; font-size:12px; }
.history-focus-facts strong { font-size:14px; color:#e4d8eb; font-weight:500; }
.history-focus-reason { font-size:14px; line-height:1.6; margin:15px 0 8px; color:#dfd2e6; }
.history-focus-points { font-size:13px; line-height:1.5; margin:0 0 15px; color:#d9bd8a; }
.history-next-lead { border-top:1px solid #d9b37522; padding-top:13px; }
.history-next-lead>span { display:block; color:#a8c8b6; font-size:12px; margin-bottom:7px; }
.history-next-lead>strong { display:block; font-size:14px; line-height:1.5; color:#e4dfcf; font-weight:500; }
.history-next-lead p,.history-inspection-empty p { font-size:14px; line-height:1.6; color:#c1b6c9; margin:8px 0 0; }
.history-inspection-empty h3 { margin:0 0 12px; font:25px/1.2 Georgia,serif; }
.history-mode-switch button { font-size:14px; min-height:40px; }
.history-progress,.history-match-balls { font-size:13px; }
.history-score-strip { margin-bottom:13px; }
.history-score-strip>span { font-size:13px; }
.history-score-strip strong { font-size:23px; }
.history-points-breakdown { font-size:12px; }
.history-match-balls { margin:0 0 14px; }
.history-match-balls strong { font-size:15px; }
.history-round-receipt>span { font-size:11px; }
.history-round-receipt strong { font-size:16px; }
.history-round-receipt p,.history-round-receipt>b { font-size:13px; line-height:1.5; }
.history-list-heading>span:first-child { font-size:11px; letter-spacing:.07em; }
.history-list-heading strong { font-size:19px; }
.history-point-badge { font-size:13px; }
.history-point-badge i { font-size:11px; }
.history-card-ribbon>span { font-size:11px; padding:6px 8px; color:#b9aec5; }
.history-card-ribbon b { font-size:14px; }
.history-trick-nav button { min-height:40px; font-size:13px; }
.history-zoom-controls { flex-wrap:wrap; }
.history-zoom-controls button { font-size:12px; min-height:38px; }
.history-zoom-value { font-size:12px; }
.history-canvas-caption { max-width:calc(100% - 24px); font-size:10px; letter-spacing:.02em; }
.history-node-grip { font-size:12px!important; }
.history-node-body p,.history-play-node-content small { font-size:12px; line-height:1.4; }
.history-node-tag,.history-play-node-content b { font-size:10px; }
.history-footer,.history-footer small { font-size:12px; }
.history-workspace[data-history-mode="graph"] { overflow:hidden; }
@media (max-width:760px) {
  .history-reading-layout { display:flex; flex-direction:column; overflow-y:auto; overscroll-behavior:contain; }
  .history-trick-inspector { order:-1; flex:none; overflow:visible; }
  .history-content-pane { flex:none; min-height:320px; overflow:visible; }
  .history-sequence { flex:none; overflow:visible; padding-right:0; }
  .history-canvas { flex:none; height:400px; min-height:320px; }
  .history-toolbar { flex-wrap:wrap; }
  .history-round-receipt { max-height:90px; }
  .history-footer { flex-wrap:wrap; margin-top:12px; padding-top:10px; }
}
@media (max-height:700px) and (min-width:761px) {
  .history-round-receipt { max-height:80px; }
  .history-trick-inspector { padding:12px; }
}