@import url("https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Noto+Sans+KR:wght@400;500;600;700&display=swap");
:root {
  --ink: #172235;
  --muted: #788393;
  --line: #e6eaf0;
  --paper: #f7f8fa;
  --red: #d53d49;
  --blue: #1e64d7;
  --navy: #14213d;
}
* {
  box-sizing: border-box;
}
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: "Noto Sans KR", sans-serif;
}
body.auth-locked main > section,
body.auth-locked main > .disclaimer { display:none; }
main {
  max-width: 1300px;
  margin: auto;
  padding: 56px 32px;
}
header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 28px;
}
.eyebrow {
  font:
    500 11px "DM Mono",
    monospace;
  letter-spacing: 0.11em;
  color: var(--blue);
}
h1 {
  margin: 8px 0;
  font-size: 36px;
  letter-spacing: -1.5px;
}
.subtitle {
  color: var(--muted);
  font-size: 15px;
}
.status {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 16px;
  min-width: 190px;
  height: max-content;
}
.status button {
  margin-top: 9px;
}
.watch-overview {
  margin: 0 0 16px;
}
.watch-overview h2 {
  color: var(--navy);
  font-size: 19px;
  letter-spacing: -0.6px;
  margin: 0;
}
.metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin: 20px 0;
}
.metrics div {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 18px;
}
.metrics b {
  display: block;
  font:
    600 24px "DM Mono",
    monospace;
}
.panel {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
  margin-top: 20px;
}
.panel-head {
  padding: 18px 20px;
  border-bottom: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.panel h2 {
  font-size: 19px;
  margin: 0;
}
.validation {
  border-top: 2px solid #c8b89a;
  margin-top: 48px;
  padding-top: 24px;
}
.operating-status { margin-top:48px; padding-top:24px; border-top:2px solid #b9c6d9; }
.operating-status .eyebrow { color:#285c91; }
.status-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0; }
.status-grid div { padding:16px 18px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
.status-grid div:nth-child(2n) { border-right:0; }
.status-grid small { display:block; color:var(--muted); margin-bottom:5px; }
.status-grid .status-detail { display:block; margin-top:7px; color:var(--muted); font-size:13px; font-weight:400; line-height:1.5; }
@media(max-width:700px){.status-grid{grid-template-columns:1fr}.status-grid div{border-right:0}.status-grid div:last-child{border-bottom:0}}
.secondary-watch {
  border-top: 1px solid var(--line);
  margin-top: 44px;
  padding-top: 36px;
}
.secondary-watch > .subtitle {
  margin: 0 0 20px;
}
.market-state {
  display: flex;
  gap: 12px;
  align-items: center;
  margin: 18px 0 24px;
  padding: 12px 15px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}
.market-state span {
  color: var(--muted);
  font-size: 13px;
}
.activity,
.strategy,
.market-close-report,
.daily-candidates {
  margin-top: 48px;
  padding-top: 24px;
  border-top: 2px solid #d7e0eb;
}
.strategy {
  border-top-color: #c8b89a;
}
.market-close-report {
  border-top-color: #9db6d2;
}
.market-close-report .eyebrow {
  color: #285c91;
}
.market-close-report-panel {
  padding: 0;
}
.market-close-report-meta {
  margin: 0;
  padding: 14px 18px;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: 13px;
}
.market-close-report-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.market-close-report-group {
  padding: 17px 18px;
  border-right: 1px solid var(--line);
}
.market-close-report-group:nth-child(2n) {
  border-right: 0;
}
.market-close-report-group h2 {
  margin: 0 0 12px;
  color: var(--navy);
  font-size: 16px;
}
.market-close-report-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px;
  align-items: center;
  padding: 9px 0;
  border-top: 1px solid var(--line);
  font-size: 13px;
}
.market-close-report-row small {
  display: block;
  color: var(--muted);
  font-size: 11px;
}
.market-close-report-price,
.market-close-report-rate {
  font-family: "DM Mono", monospace;
  text-align: right;
  white-space: nowrap;
}
.market-close-report-flow {
  margin: 0;
  padding: 14px 18px;
  border-top: 1px solid var(--line);
  background: #faf7f1;
  color: #755014;
  font-size: 13px;
}
.market-close-investor-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border-top: 1px solid var(--line);
}
.market-close-investor-summary div { padding: 15px 18px; border-right: 1px solid var(--line); }
.market-close-investor-summary div:last-child { border-right: 0; }
.market-close-investor-summary small,
.market-close-flow-unit { color: var(--muted); font-size: 12px; }
.market-close-investor-summary strong { display: block; margin-top: 5px; font: 600 18px "DM Mono", monospace; }
.market-close-flow-unit { margin: 0; padding: 9px 18px; border-top: 1px solid var(--line); background: #fafcff; }
.market-close-investor-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--line); }
.market-close-investor { padding: 16px 18px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.market-close-investor:nth-child(2n) { border-right: 0; }
.market-close-investor h2, .market-close-brokers h2 { margin: 0 0 10px; color: var(--navy); font-size: 16px; }
.market-close-investor-row { display: flex; justify-content: space-between; gap: 10px; padding: 8px 0; border-top: 1px solid var(--line); font: 500 13px "DM Mono", monospace; }
.market-close-investor-row strong { color: var(--ink); font-family: "Noto Sans KR", sans-serif; }
.market-close-report .market-close-flow-columns { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; }
.market-close-report .market-close-flow-column { min-width:0; border:1px solid var(--line); border-radius:8px; padding:12px; }
.market-close-report .market-close-flow-column h4 { margin:0 0 12px; }
.market-close-report .market-close-investor h2,
.market-close-report .market-close-flow-column h4 { color:var(--ink); font-family:"Noto Sans KR",sans-serif; font-size:16px; font-weight:700; line-height:normal; }
.market-close-report .market-close-investor-row { color:var(--ink); font-family:"Noto Sans KR",sans-serif; font-size:13px; font-weight:400; line-height:normal; }
.market-close-report .market-close-investor-row strong { color:var(--ink); font-family:inherit; font-size:inherit; font-weight:400; }
@media(max-width:700px) { .market-close-report .market-close-flow-columns { grid-template-columns:minmax(0,1fr); } }
.market-close-investor-row small { display: block; margin-top: 2px; color: var(--muted); font: 11px "Noto Sans KR", sans-serif; }
.market-close-brokers { padding: 16px 18px; border-top: 1px solid var(--line); }
.market-close-broker-row { display: grid; grid-template-columns: 180px minmax(0, 1fr); gap: 10px; padding: 8px 0; border-top: 1px solid var(--line); font-size: 13px; }
.market-close-broker-row span { color: var(--muted); }
.market-close-pressure-method {
  margin: 0;
  padding: 12px 18px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 12px;
}
.market-close-pressure-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--line);
}
.market-close-pressure {
  padding: 17px 18px;
  border-right: 1px solid var(--line);
}
.market-close-pressure:last-child { border-right: 0; }
.market-close-pressure h2 { margin: 0 0 11px; font-size: 16px; color: var(--navy); }
.market-close-pressure-row {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 0;
  border-top: 1px solid var(--line);
  font: 500 13px "DM Mono", monospace;
}
.market-close-pressure-row strong { color: var(--ink); font-family: "Noto Sans KR", sans-serif; }
.market-close-pressure-row small { display: block; margin-top: 3px; color: var(--muted); font: 11px "Noto Sans KR", sans-serif; }
.market-close-empty {
  margin: 0;
  padding: 18px;
  color: var(--muted);
}
.market-close-report .market-close-title { margin: 8px 0; color: var(--navy); font-size: clamp(23px, 3vw, 34px); letter-spacing: -1px; }
.market-close-report .market-close-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.market-close-report #marketCloseReportNotice:empty { display: none; }
.market-close-report #marketCloseReportNotice, .market-close-report .market-close-repair { color: var(--muted); font-size: 13px; line-height: 1.7; }
.market-close-report .market-close-etf-flow { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px 18px; padding-top: 6px; color: var(--muted); font-size: 12px; }
.market-close-report .market-close-etf-flow strong { margin-left: 5px; font-weight: 500; }
.market-close-report .market-close-broker-row small { display: block; margin-top: 6px; }
.market-close-report .report-live-value { display: block; margin-top: 5px; padding-top: 5px; border-top: 1px dashed var(--line); color: var(--ink); font-family:inherit; font-size:inherit; line-height:1.5; font-weight:400; white-space:nowrap; }
.market-close-report .market-close-etf-flow strong { display:inline-block; vertical-align:top; }
.market-close-report .report-live-value.positive { color:var(--red); }
.market-close-report .report-live-value.negative { color:var(--blue); }
.market-close-report .report-live-value[hidden] { display: none; }
.market-close-report .report-live-value { position:relative; width:max-content; margin-left:auto; text-align:right; font-variant-numeric:tabular-nums; }
.market-close-report .report-live-value:not([data-field="rate"])::before { content:"현재"; position:absolute; right:calc(100% + 6px); top:5px; color:var(--muted); font-family:"Noto Sans KR",sans-serif; font-size:12px; font-weight:400; }
.market-close-report .market-close-investor-row > span { text-align:right; }
.market-close-report .market-close-etf-flow .report-live-value { font-weight:inherit; }
.market-close-report .market-close-table-scroll td:not(:nth-child(3)) .report-live-value::before { content:none; }
.market-close-report .market-close-investor-row, .market-close-report .market-close-investor-head { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(104px,1fr) minmax(104px,0.8fr); gap:12px; align-items:center; }
.market-close-report .market-close-investor-head { padding:10px 0; color:var(--muted); font-size:11px; }
.market-close-report .market-close-investor-head > :nth-child(2) { text-align:center; }
.market-close-report .market-close-investor-head > :last-child { text-align:right; }
.market-close-report .market-close-investor-row > :first-child { overflow-wrap:anywhere; }
.market-close-report .report-quote-column { text-align:right; white-space:nowrap; font-size:13px; font-weight:400; color:var(--ink); padding-right:12px; }
.market-close-report .report-quote-column > span { display:block; line-height:1.6; }
.market-close-report .report-quote-column > button { display:block; margin-left:auto; margin-right:0; font:inherit; line-height:1.6; }
.market-close-report .report-quote-column > span:last-child { font-size:11px; }
.market-close-report .report-quote-column .positive { color:var(--red); }
.market-close-report .report-quote-column .negative { color:var(--blue); }
.market-close-report .market-close-table-scroll .report-live-value { font-size:13px; }
.market-close-report .market-close-sort-note { color: var(--muted); font-size: 12px; line-height: 1.7; }
.market-close-report .market-close-report-panel { background: transparent; border: 0; overflow: visible; }
.market-close-report .market-close-report-meta { padding: 0 0 10px; border-bottom: 0; }
.market-close-report .market-close-card .market-close-brokers { padding: 0; border-top: 0; }
.market-close-report .market-close-card { background: #fff; border: 1px solid var(--line); border-radius: 12px; margin: 14px 0; padding: 18px; overflow: hidden; }
.market-close-report .market-close-card h3 { margin: 0 0 14px; font-size: 17px; color: var(--navy); }
.market-close-report .market-close-card p { color: var(--muted); line-height: 1.8; font-size: 13px; }
.market-close-report .market-close-investor-summary { border-radius: 9px; background: #f3f8fc; }
.market-close-report .market-close-report-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.market-close-report .market-close-report-group { background: #f6f9fc; border: 0; border-radius: 9px; }
.market-close-report .market-close-report-group:nth-child(2n) { border: 0; }
.market-close-report .market-close-table-scroll { overflow-x: auto; margin-top: 16px; }
.market-close-report .market-close-table-scroll table { width: 100%; min-width: 560px; table-layout:fixed; border-collapse: collapse; }
.market-close-report .market-close-table-scroll th:first-child { width:28%; }
.market-close-report .market-close-table-scroll th:nth-child(2) { width:24%; }
.market-close-report .market-close-table-scroll th:nth-child(n+3) { width:16%; }
.market-close-report .market-close-table-scroll .report-quote-column { padding-right:0; }
.market-close-report .market-close-investor { min-width:0; overflow-x:auto; }
.market-close-report .market-close-investor-row, .market-close-report .market-close-investor-head { min-width:340px; }
.market-close-report .market-close-table-scroll th:nth-child(2), .market-close-report .market-close-table-scroll td:nth-child(2) { text-align:center; padding-left:12px; padding-right:24px; }
.market-close-report .market-close-table-scroll td, .market-close-report .market-close-table-scroll th { padding: 12px 8px; text-align: right; border-bottom: 1px solid var(--line); }
.market-close-report .market-close-table-scroll td:first-child, .market-close-report .market-close-table-scroll th:first-child { text-align: left; }
.market-close-report .market-close-table-scroll small { display: block; color: var(--muted); font-size: 11px; }
@media (max-width: 640px) {
  .market-close-report .market-close-report-grid, .market-close-report .market-close-investor-grid, .market-close-report .market-close-investor-summary { grid-template-columns: 1fr; }
  .market-close-report .market-close-card { padding: 12px; }
}
.market-close-progress { padding: 18px; }
.market-close-progress strong { display: inline-block; color: var(--navy); }
.market-close-progress span { float: right; color: var(--blue); font: 600 13px "DM Mono", monospace; }
.market-close-progress progress { display: block; width: 100%; height: 10px; margin: 13px 0 8px; accent-color: var(--blue); }
.market-close-progress small { color: var(--muted); font-size: 12px; }
@media (max-width: 700px) {
  .market-close-report-grid { grid-template-columns: 1fr; }
  .market-close-report-group { border-right: 0; border-bottom: 1px solid var(--line); }
  .market-close-report-group:last-child { border-bottom: 0; }
  .market-close-pressure-grid { grid-template-columns: 1fr; }
  .market-close-pressure { border-right: 0; border-bottom: 1px solid var(--line); }
  .market-close-pressure:last-child { border-bottom: 0; }
  .market-close-investor-summary, .market-close-investor-grid { grid-template-columns: 1fr; }
  .market-close-investor-summary div, .market-close-investor { border-right: 0; border-bottom: 1px solid var(--line); }
  .market-close-investor-summary div:last-child, .market-close-investor:last-child { border-bottom: 0; }
  .market-close-broker-row { grid-template-columns: 1fr; gap: 2px; }
}
.daily-candidates {
  border-top-color: #8eb7a6;
}
.activity .eyebrow {
  color: #285c91;
}
.activity-type {
  font-weight: 600;
}
.activity-type-holding-up {
  color: var(--red);
}
.activity-type-holding-down {
  color: var(--blue);
}
.activity-type-watch-signal {
  color: #285c91;
}
.activity-type-daily-candidate {
  color: #a34b17;
}
.activity-type-default {
  color: var(--muted);
}
.activity-result {
  font-weight: 600;
}
.activity-result-holding-up {
  color: var(--red);
}
.activity-result-holding-down {
  color: var(--blue);
}
.activity-result-order {
  color: #285c91;
}
.activity-result-default {
  color: var(--muted);
}
.activity-target-rate {
  display: block;
  margin-top: 3px;
  font: 500 13px "DM Mono", monospace;
}
.strategy-current {
  display: block;
  margin-top: 3px;
  font: 500 13px "DM Mono", monospace;
}
.strategy .eyebrow {
  color: #8b6424;
}
.strategy .panel-head {
  background: #fff4df;
  border-bottom-color: #ead2a7;
}
.strategy .panel-head h2 {
  color: #755014;
}
.daily-candidates .eyebrow {
  color: #19745a;
}
.daily-candidates .panel-head {
  background: #eef8f3;
  border-bottom-color: #c6dfd2;
}
.daily-candidates .panel-head h2 {
  color: #16533f;
}
.daily-candidates .panel-head small {
  font-weight: 400;
  color: var(--muted);
  margin-left: 8px;
}
.daily-candidate-rate {
  display: block;
  margin-top: 4px;
  color: #61708a;
  font: 500 13px "DM Mono", monospace;
  opacity: 0.88;
}
dialog .order-preview {
  display: block;
  width: 100%;
  margin: 14px 0 4px;
  padding: 11px 12px;
  border: 1px solid #c8d9ea;
  border-radius: 7px;
  background: #eef5fb;
  color: #163c68;
  font:
    600 13px "DM Mono",
    monospace;
  text-align: right;
  white-space: nowrap;
}
.validation .panel-head {
  background: #f7efe2;
}
.validation .panel-head h2 {
  color: #67491a;
}
.validation th small {
  font-size: 10px;
  font-weight: 500;
  color: #9aa5b7;
}
.watch-current,
.watch-previous {
  display: block;
  white-space: nowrap;
  text-align: right;
}
.watch-current {
  padding-bottom: 8px;
}
.watch-previous {
  padding-top: 8px;
  border-top: 1px dashed #e5eaf1;
  color: #65748a;
}
.table-wrap {
  overflow: auto;
}
table {
  width: 100%;
  min-width: 1070px;
  border-collapse: collapse;
}
th,
td {
  padding: 13px 12px;
  border-bottom: 1px solid var(--line);
  text-align: right;
  font-size: 13px;
}
th {
  background: #fafbfc;
  color: var(--muted);
  font-size: 11px;
}
th:first-child,
td:first-child {
  text-align: left;
  padding-left: 19px;
}
.name {
  font-weight: 600;
}
.code {
  display: block;
  color: var(--muted);
  font:
    10px "DM Mono",
    monospace;
  margin-top: 3px;
}
.positive {
  color: var(--red);
}
.negative {
  color: var(--blue);
}
.portfolio-detail {
  display: block;
  margin-top: 3px;
  font: 13px "DM Mono";
}
.quote-history-trigger { border: 0; background: transparent; color: inherit; font: inherit; padding: 0; cursor: pointer; text-decoration: none; }
.quote-history-trigger:hover { color: var(--blue); text-decoration: underline dotted; text-underline-offset: 3px; }
.price-history-dialog { width: min(620px, calc(100vw - 28px)); max-height: calc(100vh - 24px); overflow-x: hidden; overflow-y: auto; box-sizing: border-box; border: 0; border-radius: 14px; padding: 16px; color: var(--ink); background: var(--paper); }
.price-history-dialog::backdrop { background: rgba(15, 23, 42, .46); }
.price-history-dialog h2 { margin: 7px 0 10px; font-size: 20px; }
.price-history-title-row { display: flex; align-items: center; gap: 10px; margin-right: 36px; }
.price-history-title-row h2 { flex: 1; }
.price-history-copy { white-space: nowrap; }
.price-history-dialog .table-wrap { overflow: visible; }
.price-history-dialog table { width: 100%; min-width: 0; table-layout: fixed; font-size: 12px; }
.price-history-dialog th, .price-history-dialog td { padding: 7px 1px; white-space: nowrap; }
.price-history-dialog th { font-size: 11px; }
.price-history-dialog th:nth-child(1), .price-history-dialog td:nth-child(1) { width: 13%; }
.price-history-dialog th:nth-child(2), .price-history-dialog td:nth-child(2) { width: 19%; }
.price-history-dialog th:nth-child(3), .price-history-dialog td:nth-child(3) { width: 19%; }
.price-history-dialog th:nth-child(4), .price-history-dialog td:nth-child(4) { width: 15%; }
.price-history-dialog th:nth-child(5), .price-history-dialog td:nth-child(5) { width: 17%; }
.price-history-dialog th:nth-child(6), .price-history-dialog td:nth-child(6) { width: 17%; }
.average-price {
  color: var(--ink);
}
.portfolio-cost {
  color: var(--muted);
}
button {
  border: 0;
  border-radius: 7px;
  padding: 8px 11px;
  font:
    600 12px "Noto Sans KR",
    sans-serif;
  cursor: pointer;
  background: #eef3fb;
  color: var(--blue);
}
.buy {
  background: var(--navy);
  color: #fff;
}
.gpt {
  background: #1d7f5f;
  color: #fff;
}
.purchase-transfer {
  margin-right: 4px;
  padding: 5px 7px;
  font-size: 11px;
  background: #eef4ff;
  color: var(--blue);
}
.pending-settlement { color: var(--muted); }
.alert {
  background: #fff0f1;
  color: #c33440;
}
.alert.alert-setting { background: #eef3fb; color: #496887; }
.alert.alert-done { background: #e9f7ef; color: #187247; }
.alert.alert-threshold-3 { background: #fff0f1; color: #c33440; }
.alert.alert-threshold-7 { background: #f1edff; color: #6348a6; }
.auto {
  background: #fff4e2;
  color: #9b6200;
}
.active {
  outline: 1px solid currentColor;
}
.disclaimer {
  color: var(--muted);
  font-size: 11px;
  margin: 18px 2px;
}
dialog {
  border: 1px solid #d9e0e9;
  border-radius: 14px;
  padding: 8px;
  width: min(430px, calc(100% - 32px));
  box-shadow: 0 20px 60px #14213d40;
}
dialog::backdrop {
  background: #14213d80;
}
dialog form {
  padding: 28px 30px;
  position: relative;
}
dialog h2 {
  margin: 8px 0;
}
dialog p {
  color: var(--muted);
  font-size: 13px;
}
dialog label {
  display: block;
  margin: 14px 0;
  font-size: 13px;
}
dialog input {
  width: 100%;
  margin-top: 6px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
}
.title-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.title-row h1 { margin: 0; }
.system-notice { display: flex; align-items: center; gap: 8px; margin: 12px 0 0; padding: 10px 12px; border: 1px solid #f1c5c9; border-radius: 8px; background: #fff1f2; color: #a12735; font-size: 13px; }
.system-notice[hidden] { display: none; }
.system-notice span { flex: 1; line-height: 1.45; }
.system-notice button { padding: 0 4px; border: 0; background: transparent; color: inherit; font-size: 18px; line-height: 1; }
@media (max-width: 620px) { .title-row { gap: 8px; } }
.close {
  position: absolute;
  right: 12px;
  top: 10px;
  background: none;
  font-size: 22px;
}
#toast {
  position: fixed;
  right: 22px;
  bottom: 22px;
  background: var(--navy);
  color: #fff;
  padding: 13px 16px;
  border-radius: 8px;
  display: none;
}
.primary {
  width: 100%;
  background: var(--blue);
  color: #fff;
  margin-top: 8px;
}
@media (max-width: 700px) {
  main {
    padding: 28px 13px;
  }
  header {
    display: block;
  }
  .status {
    margin-top: 18px;
  }
  .metrics {
    gap: 7px;
  }
  .metrics div {
    padding: 11px;
  }
  .metrics b {
    font-size: 16px;
  }
}

.portfolio {
  border-top: 2px solid #a6b9ce;
  margin-top: 48px;
  padding-top: 24px;
}
.portfolio .panel-head {
  background: #eef5fb;
}
.portfolio .panel-head h2 {
  color: #163c68;
}
.panel-head .account-portfolio-title {
  color: #dc3545;
}
.portfolio .panel-head small {
  font-weight: 400;
  color: #65748a;
  margin-left: 8px;
}
.portfolio .panel-head strong {
  font-size: 15px;
}
.portfolio-head-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}
.portfolio-head-actions .secondary {
  white-space: nowrap;
}
.period-error p {
  margin: 12px 0 0;
  color: #9a3f23;
  font-size: 13px;
  line-height: 1.55;
}
.manual-portfolio {
  border-top: 2px solid #8caa9b;
  margin-top: 48px;
  padding-top: 24px;
}
.manual-portfolio .eyebrow {
  color: #27664d;
}
.manual-portfolio .panel-head {
  background: #eff8f2;
}
.manual-portfolio .panel-head h2 {
  color: #1b5a42;
}
.manual-portfolio .panel-head small {
  font-weight: 400;
  color: #65748a;
  margin-left: 8px;
}
/* ISA·연금의 녹색과 구분되도록 매수 대기 제목만 연한 주황색으로 표시한다. */
.purchase-wait .panel-head {
  background: #fff4e5;
  border-bottom-color: #f0d3a5;
}
.purchase-wait .panel-head h2,
.purchase-wait .panel-head strong {
  color: #7b4d0c;
}
.manual-holding-form {
  margin-top: 20px;
  padding: 18px;
  border: 1px solid #c9ded1;
  border-radius: 12px;
  background: #fbfefc;
}
.manual-holding-open {
  margin-top: 20px;
}
.manual-holding-fields {
  display: grid;
  gap: 10px;
}
.manual-holding-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr)) auto;
  gap: 12px;
  align-items: end;
}
.manual-holding-row label {
  display: grid;
  gap: 5px;
  color: var(--muted);
  font-size: 12px;
}
.manual-holding-row input {
  width: auto;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 7px;
  text-align: left;
  font: 14px "DM Mono", monospace;
}
.manual-holding-row .manual-pension-check {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 42px;
  padding-bottom: 1px;
  white-space: nowrap;
  color: var(--muted);
}
.manual-holding-row .manual-pension-check input {
  width: 14px;
  min-width: 14px;
  height: 14px;
  margin: 0;
  padding: 0;
}
.manual-symbol-search {
  position: relative;
}
.manual-symbol-results {
  position: absolute;
  z-index: 20;
  top: calc(100% + 4px);
  right: 0;
  left: 0;
  max-height: 230px;
  overflow-y: auto;
  border: 1px solid #b9cedf;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 10px 24px #14213d24;
}
.manual-symbol-results button {
  display: flex;
  width: 100%;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 10px;
  border: 0;
  border-bottom: 1px solid #edf0f4;
  border-radius: 0;
  background: #fff;
  color: var(--navy);
  text-align: left;
}
.manual-symbol-results button:hover {
  background: #eef5fb;
}
.manual-symbol-results small,
.manual-symbol-results p {
  color: var(--muted);
  font: 12px "DM Mono", monospace;
}
.manual-symbol-results p {
  margin: 0;
  padding: 10px;
}
.manual-holding-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 14px;
}
.manual-holding-actions button:first-child {
  margin-right: auto;
  min-width: 64px;
}
.manual-holding-actions button {
  box-sizing: border-box;
  height: 40px;
  min-height: 40px;
  margin-top: 0;
  padding: 0 14px;
  font-size: 14px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.manual-holding-actions button:nth-child(3) {
  min-width: 116px;
  white-space: nowrap;
}
.manual-holding-actions .primary {
  flex: 0 1 250px;
  white-space: nowrap;
  margin-top: 0;
}
.manual-holding-name {
  display: block;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--navy);
  font: inherit;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}
.manual-holding-name:hover {
  color: var(--blue);
  text-decoration: underline;
}
.manual-row-actions {
  display: flex;
  gap: 5px;
  margin-top: 7px;
  width: 160px;
  align-items: stretch;
}
.manual-row-actions button {
  flex: 1 1 0;
  min-width: 0;
  height: 32px;
  min-height: 32px;
  padding: 0 4px;
  font-size: 11px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}
.manual-row-actions .primary,
.manual-row-actions .danger {
  width: auto;
  margin-top: 0;
}
.manual-inline-label {
  display: grid;
  gap: 4px;
  font-size: 11px;
  color: var(--muted);
}
.manual-inline-input {
  width: 100%;
  min-width: 84px;
  box-sizing: border-box;
  text-align: right;
}
.trading-periods {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  margin-top: 20px;
}
.period-card {
  border: 1px solid #c8d9ea;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
}
.period-card h2 {
  padding: 17px 19px;
  margin: 0;
  background: #eef5fb;
  color: #163c68;
  font-size: 18px;
}
.period-card small {
  display: block;
  padding: 0 19px 13px;
  background: #eef5fb;
  color: #65748a;
}
.trading-metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}
.trading-metrics div {
  padding: 18px;
  border-right: 1px solid #e6eaf0;
}
.trading-metrics div:last-child {
  border: 0;
}
.trading-metrics b {
  display: block;
  font:
    600 20px "DM Mono",
    monospace;
}
.trading-metrics span {
  font-size: 12px;
  color: #788393;
}
@media (max-width: 700px) {
  .trading-periods {
    grid-template-columns: 1fr;
  }
  .trading-metrics {
    grid-template-columns: 1fr;
  }
  .trading-metrics div {
    border-right: 0;
    border-bottom: 1px solid #e6eaf0;
  }
  .manual-holding-row {
    grid-template-columns: 1fr;
  }
  .manual-holding-actions {
    justify-content: stretch;
  }
  .manual-holding-actions button {
    flex: 1;
  }
  .manual-row-actions button { flex: 1 1 0; }
}