:root {
  --rail-width: 216px;
  --shadow: none;
  --bg: #f5f7f8;
  --line: #dde4ea;
}

* { letter-spacing: 0 !important; }
.app { display: block; }
.rail { width: var(--rail-width); }
.main { width: calc(100% - var(--rail-width)); margin-left: var(--rail-width); }
.content { width: 100%; max-width: 2048px; margin: 0 auto; padding: 20px 28px 36px; }
.topbar { padding: 14px max(28px, calc((100% - 2048px) / 2 + 28px)); min-height: 72px; }
.rail-label-spaced { margin-top: 16px; }
.custom-range { display:none; align-items:center; gap:5px; font-size:11px; color:var(--muted); }
.custom-range.show { display:inline-flex; }
.custom-range input { height:30px; border:1px solid var(--line); border-radius:6px; padding:0 6px; color:var(--ink); }
.crumb { font-size: 11px; }
.page-title { font-size: 19px; }
.rail { padding: 20px 12px; }
.brand { font-size: 15px; padding-bottom: 24px; }
.brand-mark { border-radius: 6px; box-shadow: none; }
.notice { margin-bottom: 18px; padding: 12px 14px; box-shadow: none; }
.notice-title { font-size: 13px; }
.notice p { max-width: 1200px; line-height: 1.65; }
.notice-actions { flex-shrink: 0; }
.kpis { margin-bottom: 20px; gap: 12px; }
.kpi { border-radius: 6px; padding: 14px 16px; box-shadow: none; }
.kpi-value { font-size: 25px; margin: 8px 0 5px; }
.kpi-sub { font-size: 11px; line-height: 1.5; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.kpis { grid-template-columns: repeat(6,minmax(0,1fr)); }
.kpi { padding:12px 14px; }
.kpi-value { margin:6px 0 4px; }
.kpi-trend,.kpi-target { font-size:10px; line-height:1.4; margin-top:4px; color:#72839a; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.kpi-target { color:#52677f; font-weight:650; }
.kpi-value.metric-good { color:var(--green); }.kpi-value.metric-risk { color:var(--red); }
.panel { border: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); border-radius: 0; box-shadow: none; }
.panel-head { padding: 14px 16px; align-items: center; }
.panel-title { font-size: 14px; }
.panel-meta { font-size: 11px; line-height: 1.5; }
.product-panel { margin-bottom: 20px; }
.product-toolbar { display: grid; grid-template-columns: 220px minmax(180px,360px) auto minmax(0,1fr); padding: 10px 16px; }
.product-toolbar input { min-width: 0; width: 100%; font-size: 12px; }
.product-filter { min-width: 0; width: 100%; font-size: 12px; }
.product-meta { white-space: normal; text-align: right; line-height: 1.5; }
.product-list { grid-template-columns: repeat(auto-fit,minmax(310px,1fr)); max-height: 260px; gap: 10px; padding: 12px 16px; scrollbar-gutter: stable; }
.product-card { display: grid; grid-template-columns: 76px minmax(0,1fr); align-items: start; gap: 12px; padding: 12px; border-radius: 6px; }
.product-card-media { width: 76px; height: 90px; margin: 0; background: #f7f9fa; border-radius: 4px; }
.product-card-media .empty { padding: 8px; font-size: 10px; }
.product-card-content { min-width: 0; }
.product-card-head { align-items: center; }
.product-asin { font-size: 12px; }
.product-parent { font-size: 10px; margin-top: 3px; }
.product-title { font-size: 11px; margin: 7px 0; min-height: 0; line-height: 1.45; }
.product-variant { font-size: 10px; white-space: normal; overflow: visible; line-height: 1.5; margin-bottom: 6px; }
.product-details { margin-bottom: 8px; flex-wrap: wrap; font-size: 11px; }
.product-card-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.product-card-actions .link { margin: 0 !important; }
.product-quick { display:flex; flex-wrap:wrap; gap:5px 9px; color:#5d718a; font-size:10px; line-height:1.45; }
.product-more { margin-top:7px; font-size:10px; color:#6c7c90; }.product-more summary { cursor:pointer; color:var(--blue); }.product-more-line { margin-top:4px; line-height:1.45; overflow-wrap:anywhere; }
.product-card.selected { border-color: #8aa9d8; background: #f7faff; box-shadow: none; }
.product-panel.is-collapsed .product-toolbar,.product-panel.is-collapsed .product-list { display: none; }
.grid-main { gap: 20px; }
.keyword-controls { padding: 10px 16px; }
.keyword-panel-table .data-table th { font-size: 11px; padding: 10px 12px; }
.keyword-panel-table .data-table td { padding: 12px; }
.keyword-panel-table .keyword { font-size: 13px; }
.keyword-panel-table .data-table th:nth-child(1) { width: 24%; }
.keyword-panel-table .data-table th:nth-child(2),.keyword-panel-table .data-table th:nth-child(3) { width: 9%; }
.keyword-panel-table .data-table th:nth-child(4) { width: 11%; }
.keyword-panel-table .data-table th:nth-child(5) { width: 7%; }
.keyword-panel-table .data-table th:nth-child(6) { width: 23%; }
.keyword-panel-table .data-table th:nth-child(7) { width: 17%; }
.side-stack { gap: 20px; }
.side-body { padding: 16px; }
.priority { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.priority-item { grid-template-columns: 24px minmax(0,1fr); }
.priority-item strong { overflow-wrap: anywhere; }
.priority-intro { margin-bottom:12px; padding:9px 10px; border-left:3px solid #8eb4f3; background:#f7faff; color:#52677f; font-size:11px; line-height:1.55; }
.priority-item { grid-template-columns:24px minmax(0,1fr); gap:9px; padding-bottom:12px; border-bottom:1px solid #eef1f5; }
.priority-item:last-child { padding-bottom:0; border-bottom:0; }
.priority-item strong { font-size:12px; line-height:1.4; }
.priority-item p { margin:3px 0 0; }
.priority-action { margin-top:5px; color:#234a86 !important; font-weight:650; }
.priority-button { margin-top:6px; }
.section { margin-top: 20px; }
.campaign-grid { grid-template-columns: repeat(auto-fit,minmax(300px,1fr)); padding: 16px; gap: 12px; }
.campaign-card { border-radius: 6px; }
.playbook { grid-template-columns: 230px minmax(0,1fr); }
.playbook-detail .panel-meta { margin:0 0 12px; }
.detail-context { margin:12px 0 16px; padding:11px 12px; border:1px solid #dbe8fb; background:#f7faff; border-radius:6px; color:#3d5570; font-size:11px; line-height:1.6; }
.detail-context strong { color:#234a86; }
.execution-rule { margin-top:12px; padding:10px 12px; border:1px solid #f0d8a5; background:#fffaf0; color:#795414; border-radius:6px; font-size:11px; line-height:1.55; }
.task-item { display:grid; grid-template-columns:24px minmax(0,1fr); gap:9px; align-items:start; padding:10px 0 13px; border-bottom:1px solid #eef1f5; }.task-item:last-child { border-bottom:0; }.task-item.is-done { opacity:.58; }.task-head { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }.task-head strong { font-size:12px; line-height:1.4; overflow-wrap:anywhere; }.task-why,.task-action { margin:5px 0 0; color:#52677f; font-size:11px; line-height:1.5; overflow-wrap:anywhere; }.task-action { color:#234a86; }.task-meta { display:flex; flex-wrap:wrap; gap:5px 12px; color:#7b8b9e; font-size:10px; line-height:1.45; margin-top:5px; }.task-buttons { display:flex; flex-wrap:wrap; gap:7px; margin-top:7px; }.action-btn { border:1px solid #b7cdef; border-radius:5px; background:var(--blue-soft); color:var(--blue); padding:5px 8px; font-size:10px; font-weight:700; }.action-btn.secondary { border-color:#dbe2ea; background:#fff; color:#65768c; }.action-btn.scale { background:var(--green-soft); border-color:#b7e2cf; color:var(--green); }.action-btn.cut { background:var(--red-soft); border-color:#efc1c1; color:var(--red); }.action-btn.harvest { background:var(--blue-soft); color:var(--blue); }.action-btn.observe { background:#f1f4f7; border-color:#dbe2ea; color:#6d7b8e; }.action-btn:disabled { cursor:default; opacity:.75; }
.keyword-action-buttons { display:flex; flex-wrap:wrap; gap:5px; margin:6px 0 4px; }.keyword-action-buttons .action-btn { font-size:10px; padding:4px 6px; }
.freshness-strip { display:flex; flex-wrap:wrap; gap:6px 12px; align-items:center; margin-top:8px; color:#65768b; font-size:10px; line-height:1.45; }.freshness-strip b { color:#234a86; }.source-tag { border:0; border-bottom:1px dashed #8aa9d8; background:none; color:var(--blue); padding:0; font-size:10px; cursor:pointer; }
.execution-summary { padding:11px 16px 0; color:#6b7d91; font-size:11px; }.execution-list { display:grid; gap:10px; padding:12px 16px 16px; }.execution-record { border:1px solid var(--line); border-left:3px solid var(--green); border-radius:6px; padding:11px 12px; background:#fff; }.execution-record.is-undone { border-left-color:#aeb9c6; opacity:.7; }.execution-record-head { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }.execution-record-head strong { font-size:12px; overflow-wrap:anywhere; }.execution-record-meta { margin-top:5px; color:#7a8a9c; font-size:10px; overflow-wrap:anywhere; }.execution-record-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:9px 0; }.execution-record-grid label { display:block; color:#8291a2; font-size:10px; margin-bottom:3px; }.execution-record-grid b { display:block; color:#344f70; font-size:11px; line-height:1.45; overflow-wrap:anywhere; }.execution-undo-note { color:#7a8a9c; font-size:10px; }
.scale-roster { margin-top:16px; border:1px solid #cfe0fb; background:#fbfdff; border-radius:7px; padding:12px; }
.scale-roster-title { color:#234a86; font-size:12px; font-weight:750; margin-bottom:9px; }
.scale-candidate { border-top:1px solid #e5edf8; padding:11px 0 9px; }
.scale-candidate:first-of-type { border-top:0; padding-top:2px; }
.scale-candidate-head { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.scale-candidate-head strong { color:#1b3555; font-size:13px; overflow-wrap:anywhere; }
.scale-candidate-meta,.scale-candidate-metrics,.scale-candidate-action { color:#5d718a; font-size:11px; line-height:1.55; margin-top:4px; overflow-wrap:anywhere; }
.scale-candidate-action { color:#234a86; }
.scale-candidate-action strong { color:#1a9a6a; }
.scale-candidate .link { display:inline-block; margin-top:6px; }
.recipe-grid .recipe-item { min-width:0; }
.keyword-guide { display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; padding:10px 16px; border-bottom:1px solid var(--line); background:#fbfcfe; color:#68788d; font-size:11px; line-height:1.5; }
.keyword-guide-title { color:#234a86; font-weight:750; }
.guide-dot { display:inline-block; width:7px; height:7px; margin-right:5px; border-radius:50%; background:#9aa6b5; }
.guide-dot.scale { background:var(--green); }.guide-dot.harvest { background:var(--blue); }.guide-dot.cut { background:var(--amber); }.guide-dot.observe { background:#9aa6b5; }
.keyword-decision { display:inline-flex; margin-bottom:4px; padding:3px 6px; border-radius:4px; font-size:10px; font-weight:750; }
.keyword-decision.scale { background:var(--green-soft); color:var(--green); }.keyword-decision.harvest { background:var(--blue-soft); color:var(--blue); }.keyword-decision.cut { background:var(--amber-soft); color:var(--amber); }.keyword-decision.observe { background:#f1f4f7; color:#6d7b8e; }
.campaign-head-tools { display:flex; align-items:center; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.campaign-status-filters { display:flex; flex-wrap:wrap; gap:5px; }
.campaign-summary { display:flex; flex-wrap:wrap; gap:7px; padding:11px 16px 0; }
.campaign-count { display:inline-flex; align-items:center; gap:4px; padding:4px 8px; border-radius:999px; background:#f1f4f7; color:#6d7b8e; font-size:11px; }
.campaign-count.enabled { background:var(--green-soft); color:var(--green); }.campaign-count.paused { background:var(--amber-soft); color:var(--amber); }.campaign-count.archived { background:#eef1f5; color:#6d7b8e; }.campaign-count.unknown { background:var(--red-soft); color:var(--red); }
#campaignCards { display:block; padding:12px 16px 16px; }
.campaign-group { border-top:1px solid var(--line); padding-top:12px; margin-top:4px; }
.campaign-group:first-child { border-top:0; padding-top:0; }
.campaign-group-head { display:flex; justify-content:space-between; align-items:baseline; gap:10px; margin-bottom:9px; color:#234a86; }
.campaign-group-head strong { display:inline-block; margin-right:8px; font-size:13px; }.campaign-group-head span { color:var(--muted); font-size:11px; }.campaign-group-head > b { color:#6d7b8e; font-size:11px; white-space:nowrap; }
.campaign-group-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; }
.campaign-group-grid .campaign-card { height:100%; }
.campaign-state-archived { background:#fbfcfd; opacity:.82; }
.campaign-state-archived .campaign-name { color:#6d7b8e; }
.campaign-group-grid .campaign-metrics { grid-template-columns:repeat(4,minmax(0,1fr)); }
.campaign-period-result { margin:0 0 8px; }
.campaign-why { font-size:10px; line-height:1.5; color:#5d718a; background:#fbfcfe; border-left:2px solid #b9cce6; padding:5px 7px; margin-bottom:9px; overflow-wrap:anywhere; }.campaign-why b { color:#234a86; }
.campaign-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:7px; }
.campaign-normal { border-top:1px solid var(--line); margin-top:14px; padding:12px 0 0; }.campaign-normal summary { cursor:pointer; color:#61728a; font-size:12px; font-weight:700; padding:3px 0 10px; }.campaign-normal .campaign-group-grid { margin-top:5px; }

@media (max-width:1200px) {
  :root { --rail-width: 200px; }
  .content { max-width: none; padding: 18px 20px 30px; }
  .topbar { padding: 14px 20px; }
  .product-toolbar { grid-template-columns: 200px minmax(0,1fr) auto; }
  .product-meta { grid-column: 1/-1; justify-self: start; margin: 0; text-align: left; }
  .priority { grid-template-columns: 1fr; }
  .kpis { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .campaign-group-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}

@media (min-width:1800px) {
  .product-list { grid-template-columns: repeat(5,minmax(0,1fr)); }
}

@media (max-width:900px) {
  .topbar { flex-wrap: wrap; }
  .top-actions { flex-wrap: wrap; }
  .kpis { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .product-list { grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); }
  .notice { flex-wrap: wrap; gap: 8px; }
  .campaign-head-tools { width:100%; justify-content:flex-start; }
}

@media (max-width:760px) {
  :root { --rail-width: 112px; }
  .rail { padding: 16px 6px; }
  .content { padding: 14px 10px 28px; }
  .topbar { padding: 14px 12px; }
  .kpis { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .execution-record-grid { grid-template-columns:1fr; }
  .custom-range { flex-wrap:wrap; }
  .top-actions { gap: 8px; }
  .panel-head { padding: 12px; align-items: flex-start; }
  .panel-tools { gap: 6px; }
  .product-toolbar { grid-template-columns: minmax(0,1fr) auto; padding: 10px 12px; }
  .product-filter { grid-column: 1/-1; }
  .product-toolbar input { font-size: 11px; }
  .product-list { grid-template-columns: minmax(0,1fr); max-height: 320px; padding: 10px 12px; }
  .product-card { grid-template-columns: 52px minmax(0,1fr); padding: 10px; gap: 8px; }
  .product-card-media { width: 52px; height: 72px; }
  .product-card-head { flex-wrap: wrap; gap: 4px; }
  .product-title { font-size: 11px; }
  .kpis { grid-template-columns: minmax(0,1fr); gap: 8px; }
  .kpi { padding: 12px; }
  .kpi-value { font-size: 23px; }
  .notice { padding: 10px 12px; }
  .keyword-controls { padding: 10px 12px; }
  .keyword-panel-table .data-table td { padding: 5px 0; }
  .side-stack,.priority { grid-template-columns: minmax(0,1fr); }
  .campaign-grid { grid-template-columns: minmax(0,1fr); padding: 12px; }
  #campaignCards { padding:10px 12px 12px; }
  .campaign-group-grid { grid-template-columns:minmax(0,1fr); }
  .campaign-group-grid .campaign-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .campaign-group-head { align-items:flex-start; }
  .keyword-guide { display:grid; grid-template-columns:minmax(0,1fr); gap:5px; padding:9px 12px; }
  .playbook { grid-template-columns: minmax(0,1fr); }
}