/* Normal-flow rows: never overlay the stems or branches. */
.branch-analysis-row > .branch-analysis-cell { padding: 0 !important; white-space: normal !important; background: #fffcf5 !important; text-align: left !important; height: auto !important; }
.branch-analysis-controls { display:flex; flex-wrap:wrap; align-items:center; gap:6px; padding:8px; color:#466766; font-size:12px; line-height:1.5; }
.branch-analysis-controls select,.branch-analysis-controls button { max-width:100%; border:1px solid #adc9c7; background:#fffdf7; border-radius:6px; padding:5px; color:#355e5d; font-size:12px; }
.branch-analysis-canvas { position:relative; width:100%; min-height:30px; overflow:hidden; font-size:12px; color:#466766; }
.branch-analysis-graph { max-height:224px; overflow-y:auto; overflow-x:hidden; scrollbar-width:thin; scrollbar-color:#bba389 #f8f0e6; }
.branch-analysis-canvas svg { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.branch-analysis-label { position:absolute; transform:translate(-50%,-50%); min-width:34px; min-height:26px; padding:1px 5px; border:1px solid currentColor; border-radius:6px; background:#fffcf5; font-size:12px; line-height:20px; cursor:pointer; white-space:nowrap; }
.branch-analysis-label[aria-expanded=true] { box-shadow:0 0 0 2px #e4ccb4; font-weight:bold; }
.branch-analysis-explanation { position:relative; margin:8px; padding:0; border:2px solid #9b4f13; border-radius:9px; background:rgba(255,253,249,.98); color:#3c2412; font:14px/1.6 'Microsoft YaHei',sans-serif; text-align:left; overflow-wrap:anywhere; overflow:hidden; }
.branch-analysis-title { position:relative; padding:12px 46px 10px 16px; background:linear-gradient(90deg,rgba(139,69,19,.12),rgba(211,154,82,.08)); border-bottom:1px solid rgba(170,103,43,.16); color:#8b4513; font-size:16px; font-weight:800; }
.branch-analysis-close { position:absolute; top:8px; right:9px; width:30px; height:30px; border:1px solid rgba(155,79,19,.34); border-radius:50%; background:#fffdf9; color:#8b4513; font-size:18px; cursor:pointer; }
.branch-analysis-body { padding:10px 12px 12px; max-height:320px; box-sizing:border-box; overflow-y:auto; overflow-x:hidden; scrollbar-gutter:stable; scrollbar-width:thin; scrollbar-color:#bba389 #f8f0e6; overscroll-behavior-y:auto; -webkit-overflow-scrolling:touch; }
.branch-analysis-body::-webkit-scrollbar,.branch-analysis-graph::-webkit-scrollbar { width:8px; }
.branch-analysis-body::-webkit-scrollbar-thumb,.branch-analysis-graph::-webkit-scrollbar-thumb { background:#bba389; border-radius:6px; }
.branch-analysis-body::-webkit-scrollbar-track,.branch-analysis-graph::-webkit-scrollbar-track { background:#f8f0e6; }
.branch-analysis-body .day-pillar-source-table { width:100%; table-layout:fixed; border-collapse:collapse; font:inherit; }
.branch-analysis-body .day-pillar-source-table th,.branch-analysis-body .day-pillar-source-table td { border:1px solid #e0cbb7; padding:8px; white-space:pre-wrap; word-break:break-word; height:auto; vertical-align:top; text-align:left; font:inherit; color:#3c2412; background:#fffdf9; }
.branch-analysis-body .day-pillar-source-table th { width:6em; font-weight:bold; color:#8b4513; background:#f8f0e6; }
.branch-analysis-controls button[aria-pressed=true] { background:#f5e3cd; color:#8b4513; }
.branch-analysis-explanation p { margin:8px 0; }
.branch-analysis-source { font-size:12px; color:#526c6c; }
.branch-analysis-toggle[aria-pressed=true] { background:#426f6d !important; color:white !important; }
.branch-analysis-toggle:focus-visible,.branch-analysis-label:focus-visible { outline:3px solid #426f6d; outline-offset:2px; }
/* Transparent arcs sit over the original lower rows; only labels receive input. */
.branch-analysis-floating-row > .branch-analysis-cell { position:relative; overflow:visible; }
.branch-analysis-floating-row .branch-analysis-graph { position:absolute; top:100%; left:0; right:0; z-index:3; max-height:none; overflow:visible; pointer-events:none; background:transparent; }
.branch-analysis-floating-row .branch-analysis-canvas { overflow:visible; background:transparent; }
.branch-analysis-floating-row .branch-analysis-label { pointer-events:auto; background:rgba(255,252,245,.82); min-height:22px; line-height:18px; padding:0 4px; }
.branch-analysis-floating-row path { opacity:.55; }
.branch-analysis-more summary { cursor:pointer; color:#805128; font-size:12px; }
/* Relation details float within the lower chart, without adding table rows. */
.branch-analysis-floating-row .branch-analysis-detail { position:absolute; top:100%; left:0; right:0; z-index:6; }
.branch-analysis-floating-row .branch-analysis-detail .branch-analysis-explanation { display:flex; flex-direction:column; max-height:var(--branch-detail-height); box-sizing:border-box; margin:4px 8px; box-shadow:0 5px 16px rgba(90,55,24,.18); }
.branch-analysis-floating-row .branch-analysis-detail .branch-analysis-title { flex:none; }
.branch-analysis-floating-row .branch-analysis-detail .branch-analysis-body { min-height:0; flex:1 1 auto; }
/* Controls live above the chart; the floating anchor adds no blank table row. */
.branch-analysis-floating-row { height:0 !important; }
.branch-analysis-floating-row > .branch-analysis-cell { height:0 !important; border:0 !important; line-height:0; }
.branch-analysis-detail { line-height:normal; }
/* The pointer follows the clicked relation label; the card stays within chart width. */
.branch-analysis-floating-row .branch-analysis-detail { left:8px; right:8px; }
.branch-analysis-floating-row .branch-analysis-detail .branch-analysis-explanation { margin:0; }
.branch-analysis-floating-row .branch-analysis-detail::before { content:''; position:absolute; top:-6px; left:clamp(14px,var(--branch-arrow-x),calc(100% - 14px)); width:10px; height:10px; background:#f8f0e6; border-top:2px solid #9b4f13; border-left:2px solid #9b4f13; transform:translateX(-50%) rotate(45deg); z-index:1; pointer-events:none; }
.branch-analysis-popover { position:fixed; z-index:10020; }
.branch-analysis-popover .branch-analysis-explanation { display:flex; flex-direction:column; max-height:320px; margin:0; box-sizing:border-box; box-shadow:0 5px 16px rgba(90,55,24,.18); }
.branch-analysis-popover .branch-analysis-title { flex:none; }
.branch-analysis-popover .branch-analysis-body { min-height:0; flex:1 1 auto; }
.day-pillar-popover .branch-analysis-explanation { height:var(--day-pillar-height,320px); max-height:var(--day-pillar-height,320px); }
.day-pillar-popover .branch-analysis-body { max-height:none; overscroll-behavior:contain; }
.branch-analysis-popover::before { content:''; position:absolute; top:-6px; left:clamp(14px,var(--branch-arrow-x),calc(100% - 14px)); width:10px; height:10px; background:#f8f0e6; border-top:2px solid #9b4f13; border-left:2px solid #9b4f13; transform:translateX(-50%) rotate(45deg); z-index:1; pointer-events:none; }
.branch-analysis-toolbar { position:fixed; z-index:10010; width:max-content; max-width:calc(100vw - 16px); box-sizing:border-box; padding:8px; gap:7px; border:1px solid #c89768; border-radius:12px; background:#fffaf1; box-shadow:0 6px 18px rgba(100,62,28,.16); }
.branch-analysis-toolbar::before { content:''; position:absolute; top:-5px; left:var(--tools-arrow-x); width:8px; height:8px; background:#fffaf1; border-left:1px solid #c89768; border-top:1px solid #c89768; transform:translateX(-50%) rotate(45deg); }
.branch-analysis-toolbar button,.branch-analysis-toolbar select { padding:7px 10px; border-radius:8px; }
.branch-analysis-toolbar { gap:4px; padding:6px; }
.branch-analysis-toolbar button,.branch-analysis-toolbar select { padding:5px 6px; font-size:12px; }
/* Narrow web/App chart toolbar: retain the three primary controls. */
@media (max-width:760px) {
  .chart-section > .panel-head-row > #copy-pan-button { display:none !important; }
}
body.case-detail-embed-mobile .chart-section > .panel-head-row > #copy-pan-button { display:none !important; }

/* pan-toolbar-fit-20261023: contain all chart toolbar controls on phones. */
@media (max-width: 760px) {
  body .chart-section > .panel-head-row {
    display:flex !important;
    flex-wrap:nowrap !important;
    gap:6px !important;
    width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }
  body .chart-section > .panel-head-row > :is(.panel-tab-btn,.panel-copy-pan-btn,.branch-analysis-toggle) {
    flex:1 1 0 !important;
    width:0 !important;
    min-width:0 !important;
    max-width:100% !important;
    box-sizing:border-box !important;
    padding:6px 2px !important;
    font-size:12px !important;
    white-space:nowrap !important;
  }
}
/* Include both tablet orientations, including coarse-pointer wide tablets. */
@media (min-width:600px) and (max-width:1024px), (pointer:coarse) and (min-width:600px) {
  body #copy-pan-button { display:none !important; }
}

/* pan-toolbar-fit-20261023-quiz: quiz toolbar uses a separate container. */
@media (max-width:760px) {
  body #answer-case-panel .quiz-case-panel-tabs,
  body .quiz-answer-case-pane .quiz-case-panel-tabs {
    display:flex !important;
    flex-wrap:nowrap !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    gap:6px !important;
  }
  body #answer-case-panel .quiz-case-panel-tabs > button,
  body .quiz-answer-case-pane .quiz-case-panel-tabs > button {
    flex:1 1 0 !important;
    width:0 !important;
    min-width:0 !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding:8px 2px !important;
    box-sizing:border-box !important;
    font-size:12px !important;
    white-space:nowrap !important;
  }
}

/* pan-toolbar-tablet-20261023: keep analysis visible in tablet portrait. */
@media (min-width:600px) and (max-width:1024px), (pointer:coarse) and (min-width:600px) {
  body .chart-section > .panel-head-row,
  body #answer-case-panel .quiz-case-panel-tabs {
    display:flex !important; flex-wrap:nowrap !important;
    width:100% !important; max-width:100% !important; min-width:0 !important;
    box-sizing:border-box !important; gap:6px !important;
  }
  body .chart-section > .panel-head-row > :is(.panel-tab-btn,.branch-analysis-toggle),
  body #answer-case-panel .quiz-case-panel-tabs > .quiz-case-panel-btn {
    display:inline-flex !important; align-items:center !important; justify-content:center !important;
    flex:1 1 0 !important; width:0 !important; min-width:0 !important;
    box-sizing:border-box !important; white-space:nowrap !important;
    padding:8px 3px !important;
  }
  body .chart-section > .panel-head-row > #copy-pan-button { display:none !important; }
}
