.sms-board{
    --sms-blue:#1565d8; --sms-blue-ink:#0b3f8f; --sms-red:#d32f2f;
    --sms-std-bg:#f2f7ff; --sms-std-edge:#cfe0fb;
    --sms-pro-bg:#fff6ee; --sms-pro-edge:#f5d9c2;
    --sms-line:#e6e9ee; --sms-ink:#1f2733; --sms-sub:#667085; --sms-muted:#a3aab5;
    --sms-card:#ffffff; --sms-hover:#f7f9fc;
    margin:32px 0; color:var(--sms-ink);
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Hiragino Sans","Noto Sans JP",Meiryo,sans-serif;
}
.sms-board *,.sms-board *::before,.sms-board *::after{box-sizing:border-box}
.sms-board.sms-empty{padding:20px;background:#f6f7f9;border-radius:14px;color:#6b7280;text-align:center}

/* ---- header ---- */
.sms-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}
.sms-head-main{display:flex;align-items:center;gap:10px;min-width:0}
.sms-symbol-badge{
    flex:none;display:inline-block;padding:5px 12px;border-radius:999px;
    background:linear-gradient(135deg,#1565d8,#3b8ae8);color:#fff;
    font-size:.78rem;font-weight:700;letter-spacing:.03em;box-shadow:0 2px 6px rgba(21,101,216,.28);
}
.sms-board .sms-title{margin:0;font-size:1.22rem;font-weight:700;line-height:1.35}
.sms-head-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sms-reset{
    display:inline-block;border:1px solid var(--sms-line);background:#fff;color:var(--sms-sub);
    font-size:.74rem;padding:5px 11px;border-radius:999px;cursor:pointer;
    transition:background .15s,color .15s,border-color .15s;user-select:none;
}
.sms-reset:hover{background:var(--sms-blue);border-color:var(--sms-blue);color:#fff}
.sms-updated{display:inline-flex;align-items:center;gap:6px;font-size:.74rem;color:var(--sms-sub);background:#f2f4f7;border-radius:999px;padding:5px 12px;white-space:nowrap}
.sms-dot{width:6px;height:6px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.18)}

/* ---- table shell ---- */
.sms-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--sms-line);border-radius:16px;background:var(--sms-card);box-shadow:0 1px 2px rgba(16,24,40,.04),0 8px 24px -12px rgba(16,24,40,.14)}
.sms-board .sms-table{width:100%;border-collapse:separate;border-spacing:0;font-size:.9rem;min-width:720px;margin:0;background:none}
.sms-board .sms-table th,.sms-board .sms-table td{border:none}

/* Data columns size to their content so the gap between the account name and
   the figures stays constant; the broker column absorbs any leftover width. */
.sms-board .sms-table th.sms-acct,.sms-board .sms-table td.sms-acct,
.sms-board .sms-table th.sms-num,.sms-board .sms-table td.sms-num{width:1%;white-space:nowrap}
.sms-board .sms-table th.sms-acct,.sms-board .sms-table td.sms-acct{padding-right:6px}
.sms-board .sms-table th.sms-num,.sms-board .sms-table td.sms-num{padding-left:6px}

/* ---- account zone tinting (standard = cool, pro = warm) ---- */
.sms-board .sms-table th.sms-std,.sms-board .sms-table td.sms-std{background:var(--sms-std-bg)}
.sms-board .sms-table th.sms-pro,.sms-board .sms-table td.sms-pro{background:var(--sms-pro-bg)}
.sms-board .sms-table .sms-std.sms-zone-start{border-left:2px solid var(--sms-std-edge)}
.sms-board .sms-table .sms-pro.sms-zone-start{border-left:2px solid var(--sms-pro-edge)}

/* ---- header rows ---- */
.sms-board .sms-table thead th{padding:9px 12px;font-weight:700;white-space:nowrap;border-bottom:1px solid var(--sms-line)}
.sms-zone-row th.sms-zone{text-align:center;padding-top:11px;padding-bottom:7px}
.sms-zone-tag{display:inline-block;padding:3px 14px;border-radius:999px;font-size:.76rem;letter-spacing:.04em}
.sms-zone.sms-std .sms-zone-tag{background:#dceafe;color:#134a9c}
.sms-zone.sms-pro .sms-zone-tag{background:#fde4cf;color:#93500f}
.sms-board .sms-table thead th.sms-broker{background:#fbfcfe;text-align:left;vertical-align:middle;font-size:.8rem;color:var(--sms-sub);border-right:1px solid var(--sms-line)}
.sms-sub-row th{font-size:.76rem;padding-top:6px;padding-bottom:8px}
.sms-sub-row th.sms-acct{color:var(--sms-sub);font-weight:600;text-align:left}
.sms-th-plus .sms-th-label{color:var(--sms-blue)}
.sms-th-minus .sms-th-label{color:var(--sms-red)}

/* ---- sortable headers ---- */
.sms-sortable{cursor:pointer;user-select:none;text-align:right;transition:filter .15s}
.sms-sortable:hover{filter:brightness(.95)}
.sms-sort-ind{display:inline-block;margin-left:5px;font-size:.72rem;color:var(--sms-muted)}
.sms-sort-ind::before{content:"\2195"}
.sms-sortable.sms-desc .sms-sort-ind::before{content:"\25BC"}
.sms-sortable.sms-asc .sms-sort-ind::before{content:"\25B2"}
.sms-th-plus.sms-desc .sms-sort-ind,.sms-th-plus.sms-asc .sms-sort-ind{color:var(--sms-blue)}
.sms-th-minus.sms-desc .sms-sort-ind,.sms-th-minus.sms-asc .sms-sort-ind{color:var(--sms-red)}
.sms-th-plus.sms-desc,.sms-th-plus.sms-asc{box-shadow:inset 0 -3px 0 var(--sms-blue)}
.sms-th-minus.sms-desc,.sms-th-minus.sms-asc{box-shadow:inset 0 -3px 0 var(--sms-red)}

/* ---- body ---- */
.sms-board .sms-table tbody td{padding:11px 12px;border-bottom:1px solid rgba(16,24,40,.06);vertical-align:middle;text-align:right}
.sms-board .sms-table tbody tr:last-child td{border-bottom:none}
.sms-board .sms-table tbody tr:hover td{filter:brightness(.985)}
.sms-board .sms-table tbody tr:hover td.sms-broker{background:var(--sms-hover)}
.sms-board .sms-table td.sms-broker{text-align:left;white-space:nowrap;font-weight:700;background:#fff;border-right:1px solid var(--sms-line)}
.sms-board .sms-broker-link{color:var(--sms-blue-ink);text-decoration:none;border-bottom:1px solid rgba(21,101,216,.3);box-shadow:none}
.sms-board .sms-broker-link:hover{color:var(--sms-blue);border-bottom-color:var(--sms-blue)}
.sms-ext{display:inline-block;width:.52em;height:.52em;margin-left:.4em;border:1.5px solid currentColor;border-left:none;border-bottom:none;transform:rotate(45deg) translateY(.12em);opacity:.65}
.sms-board .sms-table td.sms-acct{text-align:left;white-space:nowrap}
.sms-acct-chip{display:inline-block;padding:2px 9px;border-radius:6px;background:rgba(255,255,255,.75);border:1px solid rgba(16,24,40,.07);font-size:.78rem;color:#425066}
td.sms-acct.sms-std .sms-acct-chip{color:#1a4f9e}
td.sms-acct.sms-pro .sms-acct-chip{color:#8a4c12}
.sms-board .sms-table td.sms-num{min-width:74px;font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}
.sms-val{display:block;font-size:1.04rem;font-weight:700;line-height:1.2;letter-spacing:-.01em}
.sms-up{color:var(--sms-blue)}
.sms-down{color:var(--sms-red)}
.sms-flat{color:var(--sms-sub)}
.sms-chg{display:block;font-size:.7rem;line-height:1.4;margin-top:2px;font-weight:600}
.sms-chg-up{color:var(--sms-blue)}
.sms-chg-down{color:var(--sms-red)}
.sms-chg-none{color:var(--sms-muted);font-weight:500}
.sms-muted,.sms-na{color:var(--sms-muted);font-weight:500}
.sms-note{margin:12px 4px 0;font-size:.75rem;color:var(--sms-sub);line-height:1.75}
.sms-note strong{color:var(--sms-ink)}

/* ---- plus / minus side toggle ---- */
.sms-toggle{display:inline-flex;border:1px solid var(--sms-line);border-radius:999px;overflow:hidden;background:#fff}
.sms-toggle-btn{padding:5px 13px;font-size:.74rem;font-weight:600;cursor:pointer;user-select:none;color:var(--sms-sub);transition:background .15s,color .15s}
.sms-toggle-btn:hover{background:rgba(21,101,216,.07)}
.sms-summary[data-side="plus"] .sms-toggle-plus{background:var(--sms-blue);color:#fff}
.sms-summary[data-side="minus"] .sms-toggle-minus{background:var(--sms-red);color:#fff}
.sms-summary[data-side="plus"] .sms-side-minus{display:none}
.sms-summary[data-side="minus"] .sms-side-plus{display:none}
.sms-side{display:block}

/* ---- 30-day summary ---- */
.sms-summary .sms-sum-table{min-width:640px}
.sms-summary .sms-sum-table td.sms-broker{white-space:nowrap;line-height:1.35}
.sms-summary .sms-sum-table td.sms-broker .sms-acct-chip{display:block;margin-top:3px;font-size:.72rem}
.sms-chip-std{background:var(--sms-std-bg);border-color:var(--sms-std-edge);color:#1a4f9e}
.sms-chip-pro{background:var(--sms-pro-bg);border-color:var(--sms-pro-edge);color:#8a4c12}
.sms-summary .sms-sum-table tbody tr.sms-std td{background:linear-gradient(90deg,var(--sms-std-bg) 0 4px,transparent 4px)}
.sms-summary .sms-sum-table tbody tr.sms-pro td{background:linear-gradient(90deg,var(--sms-pro-bg) 0 4px,transparent 4px)}
.sms-summary .sms-sum-table tbody tr:hover td{background-color:var(--sms-hover)}
.sms-summary td.sms-soft .sms-val{font-size:.92rem;font-weight:600;opacity:.82}
.sms-summary th.sms-spark-col,.sms-summary td.sms-spark-col{text-align:center;width:1%;white-space:nowrap;padding-left:10px}
.sms-spark-btn{display:inline-flex;flex-direction:column;align-items:center;gap:1px;cursor:pointer;padding:3px 6px;border-radius:8px;transition:background .15s}
.sms-spark-btn:hover{background:rgba(21,101,216,.09)}
.sms-spark{display:block;color:var(--sms-sub);overflow:visible}
.sms-spark-up{color:var(--sms-blue)}
.sms-spark-down{color:var(--sms-red)}
.sms-spark-days{font-size:.62rem;color:var(--sms-muted);letter-spacing:.02em}
.sms-spark-na{color:var(--sms-muted)}

/* ---- expanded detail chart ---- */
.sms-detail{margin-top:14px;border:1px solid var(--sms-line);border-radius:14px;background:var(--sms-card);padding:16px 18px}
.sms-detail-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}
.sms-detail-title{font-size:1rem;font-weight:700}
.sms-detail-close{cursor:pointer;border:1px solid var(--sms-line);border-radius:999px;padding:3px 12px;font-size:.74rem;color:var(--sms-sub);user-select:none}
.sms-detail-close:hover{background:var(--sms-red);border-color:var(--sms-red);color:#fff}
.sms-legend{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:10px;font-size:.76rem}
.sms-legend span{display:inline-flex;align-items:center;gap:6px;color:var(--sms-sub)}
.sms-legend i{width:14px;height:3px;border-radius:2px;display:inline-block}
.sms-chart{width:100%;height:230px;overflow:visible}
.sms-chart .grid{stroke:var(--sms-line);stroke-width:1}
.sms-chart .axis-label{fill:var(--sms-muted);font-size:10px}
.sms-chart .line-std{stroke:#1565d8;fill:none;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
.sms-chart .line-pro{stroke:#e8833a;fill:none;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
.sms-chart .dot-std{fill:#1565d8}
.sms-chart .dot-pro{fill:#e8833a}

@media (max-width:640px){
    .sms-board .sms-title{font-size:1.04rem}
    .sms-board .sms-table{font-size:.84rem;min-width:650px}
    .sms-board .sms-table tbody td{padding:9px 8px}
    .sms-val{font-size:.95rem}
    .sms-board .sms-table td.sms-num{min-width:66px}
    .sms-board .sms-table th.sms-acct,.sms-board .sms-table td.sms-acct{padding-right:4px}
    .sms-board .sms-table th.sms-num,.sms-board .sms-table td.sms-num{padding-left:4px}
}

@media (prefers-color-scheme:dark){
    .sms-board{
        --sms-blue:#6ba4ff; --sms-blue-ink:#8fbcff; --sms-red:#ff7b72;
        --sms-std-bg:#161f30; --sms-std-edge:#2b4166; --sms-pro-bg:#2a2018; --sms-pro-edge:#5c3f26;
        --sms-line:#2b313b; --sms-ink:#e7eaee; --sms-sub:#9aa3b0; --sms-muted:#6f7885;
        --sms-card:#12151a; --sms-hover:#1a1f27;
    }
    .sms-scroll{box-shadow:none}
    .sms-board .sms-table thead th.sms-broker,.sms-board .sms-table td.sms-broker{background:#12151a}
    .sms-zone.sms-std .sms-zone-tag{background:#1e3358;color:#a8c8ff}
    .sms-zone.sms-pro .sms-zone-tag{background:#4a3520;color:#ffc98f}
    .sms-acct-chip{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.09)}
    td.sms-acct.sms-std .sms-acct-chip{color:#a8c8ff}
    td.sms-acct.sms-pro .sms-acct-chip{color:#ffc08a}
    .sms-reset{background:#1a1f27;border-color:#2b313b;color:#9aa3b0}
    .sms-updated{background:#1a1f27}
    .sms-board .sms-table tbody td{border-bottom-color:rgba(255,255,255,.06)}
    .sms-board .sms-table tbody tr:hover td{filter:brightness(1.12)}
}