/* Hominic Tools · Stock Calculator v1.0.0 — styles stay inside the widget. */
[data-hominic-stock] { width:100%; min-width:0; container:hmstock / inline-size; }
.hm-stock-tool { --hm-navy:#102b4d; --hm-blue:#1475ef; --hm-ink:#152b46; --hm-muted:#62738a; --hm-border:#dfe7f1; --hm-red:#d73543; --hm-green:#087c57; color:var(--hm-ink); font:15px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI","Malgun Gothic",sans-serif; text-align:left; background:#f2f6fb; border:1px solid var(--hm-border); border-radius:20px; overflow:hidden; margin:24px 0; isolation:isolate; }
.hm-stock-tool *, .hm-stock-tool *::before, .hm-stock-tool *::after { box-sizing:border-box; }
.hm-stock-tool [hidden] { display:none !important; }
.hm-stock-tool h2, .hm-stock-tool h3, .hm-stock-tool h4, .hm-stock-tool p, .hm-stock-tool ul { margin:0; padding:0; border:0; font-family:inherit; color:inherit; text-align:inherit; letter-spacing:normal; background:none; }
.hm-stock-tool h2::before, .hm-stock-tool h3::before, .hm-stock-tool h4::before, .hm-stock-tool h2::after, .hm-stock-tool h3::after, .hm-stock-tool h4::after { content:none; }
.hm-stock-tool button, .hm-stock-tool input, .hm-stock-tool textarea { font:inherit; letter-spacing:normal; box-shadow:none; margin:0; }
.hm-stock-tool button { display:inline-flex; align-items:center; justify-content:center; min-height:44px; border:1px solid var(--hm-border); border-radius:10px; cursor:pointer; background:white; color:var(--hm-ink); padding:9px 12px; text-decoration:none; line-height:1.4; white-space:normal; font-weight:650; transition:background .15s,border-color .15s; }
.hm-stock-tool button:hover { background:#edf4ff; border-color:#9cc3f5; }
.hm-stock-tool button:focus-visible, .hm-stock-tool input:focus-visible, .hm-stock-tool textarea:focus-visible, .hm-stock-tool summary:focus-visible { outline:3px solid #6eafff; outline-offset:3px; }
.hm-stock-tool .hm-head { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; padding:17px 22px; color:#fff; background:var(--hm-navy); }
.hm-stock-tool .hm-brand { display:flex; align-items:center; gap:10px; font-size:20px; font-weight:750; }
.hm-stock-tool .hm-logo { display:inline-grid; place-items:center; width:33px; height:33px; border-radius:9px; font-size:24px; font-weight:850; background:#fff; color:var(--hm-navy); position:relative; line-height:1; }
.hm-stock-tool .hm-logo::after { content:""; position:absolute; width:7px; height:7px; right:3px; top:3px; border-radius:50%; background:#ffac39; }
.hm-stock-tool .hm-headnote { font-size:12px; padding:5px 10px; background:#ffffff15; border:1px solid #ffffff24; border-radius:30px; }
.hm-stock-tool .hm-intro { padding:23px 22px 19px; background:linear-gradient(110deg,#fff,#eaf3ff); }
.hm-stock-tool .hm-kicker { font-size:11px; font-weight:800; color:#47729e; letter-spacing:1.7px; margin-bottom:7px; }
.hm-stock-tool h2 { font-size:clamp(23px,4cqi,31px); font-weight:800; line-height:1.3; margin-bottom:8px; }
.hm-stock-tool .hm-intro p { font-size:14px; color:var(--hm-muted); }
.hm-stock-tool .hm-grid { display:grid; gap:14px; padding:16px; align-items:start; }
.hm-stock-tool .hm-card { min-width:0; background:white; border:1px solid #e6edf5; border-radius:14px; padding:20px; box-shadow:0 3px 12px #12284a04; }
.hm-stock-tool .hm-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; padding:5px; margin-bottom:22px; background:#f0f4f9; border-radius:12px; }
.hm-stock-tool .hm-tab { background:transparent; border:0; padding:9px 4px; min-height:44px; font-size:13px; }
.hm-stock-tool .hm-tab[aria-selected="true"] { background:var(--hm-blue); color:#fff; }
.hm-stock-tool .hm-tab[aria-selected="true"]:hover { background:#0864d8; }
.hm-stock-tool .hm-section-title { display:flex; gap:9px; align-items:center; margin:20px 0 13px; font-size:16px; font-weight:750; }
.hm-stock-tool .hm-step { display:inline-grid; place-items:center; flex:0 0 25px; width:25px; height:25px; border-radius:50%; background:var(--hm-blue); color:#fff; font-size:13px; line-height:1; }
.hm-stock-tool .hm-step.green { background:#0d9c70; }
.hm-stock-tool .hm-step.orange { background:#e59115; }
.hm-stock-tool .hm-field { display:block; min-width:0; margin:0 0 12px; font-size:13px; font-weight:650; }
.hm-stock-tool .hm-field > span:first-child { display:block; margin-bottom:6px; }
.hm-stock-tool .hm-input-wrap { position:relative; display:block; }
.hm-stock-tool input { display:block; width:100%; min-width:0; height:46px; padding:10px 39px 10px 12px; font-size:16px; font-weight:650; color:var(--hm-ink); border:1px solid #ccd8e7; border-radius:9px; background:#fff; line-height:1.3; }
.hm-stock-tool input::placeholder { color:#9aabba; font-weight:400; opacity:1; }
.hm-stock-tool input[aria-invalid="true"] { border-color:var(--hm-red); background:#fff7f8; }
.hm-stock-tool .hm-unit { position:absolute; right:12px; top:50%; transform:translateY(-50%); font-size:12px; color:var(--hm-muted); font-weight:400; pointer-events:none; }
.hm-stock-tool .hm-hint { color:var(--hm-muted); font-size:12px; font-weight:400; margin:1px 0 12px; }
.hm-stock-tool .hm-buy-row { background:#f7faff; border:1px solid #e1eaf7; border-radius:10px; padding:12px; margin-bottom:9px; }
.hm-stock-tool .hm-rowhead { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:8px; font-size:12px; color:#47729e; font-weight:750; }
.hm-stock-tool .hm-remove { min-width:44px; min-height:44px; padding:8px; font-size:12px; font-weight:400; background:transparent; }
.hm-stock-tool .hm-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.hm-stock-tool .hm-pair .hm-field { margin-bottom:0; }
.hm-stock-tool .hm-add { width:100%; border:1px dashed #9ac2ed; color:#266dc0; background:#f5f9ff; font-size:13px; }
.hm-stock-tool .hm-status { margin:14px 0; min-height:24px; padding:9px 11px; border:1px solid #dce8f8; border-radius:9px; color:#496781; font-size:12px; background:#f5f9ff; overflow-wrap:anywhere; }
.hm-stock-tool .hm-status.error { color:#a32335; background:#fff4f5; border-color:#f3c9d0; }
.hm-stock-tool .hm-actions { display:grid; grid-template-columns:1.4fr 1fr; gap:8px; }
.hm-stock-tool .hm-primary { background:var(--hm-blue); color:white; border-color:var(--hm-blue); min-height:48px; }
.hm-stock-tool .hm-primary:hover { background:#0864d8; color:#fff; }
.hm-stock-tool .hm-example { width:100%; font-size:12px; margin-top:9px; background:#fff; color:#62738a; }
.hm-stock-tool .hm-card-title { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px; margin-bottom:17px; }
.hm-stock-tool h3 { font-size:20px; font-weight:800; line-height:1.35; }
.hm-stock-tool .hm-badge { font-size:11px; color:#567390; background:#edf3fa; border-radius:20px; padding:4px 9px; }
.hm-stock-tool .hm-mainmetrics { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.hm-stock-tool .hm-metric { min-width:0; background:#f6f9fd; border:1px solid #e9eff7; border-radius:11px; padding:13px 10px; }
.hm-stock-tool .hm-metric.big { text-align:center; padding:19px 10px; background:#edf6ff; border-color:#cee5ff; }
.hm-stock-tool .hm-metric.big.profit { background:#fff2f4; border-color:#ffdde3; }
.hm-stock-tool .hm-metric .hm-label { display:block; font-size:12px; color:var(--hm-muted); margin-bottom:7px; }
.hm-stock-tool .hm-value { display:block; font-size:17px; font-weight:800; line-height:1.4; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
.hm-stock-tool .hm-metric.big .hm-value { color:var(--hm-blue); font-size:clamp(22px,3.6cqi,32px); }
.hm-stock-tool .hm-subvalue { display:block; color:var(--hm-muted); font-size:12px; margin-top:5px; }
.hm-stock-tool .hm-positive { color:var(--hm-red) !important; }
.hm-stock-tool .hm-negative { color:var(--hm-blue) !important; }
.hm-stock-tool .hm-neutral { color:var(--hm-muted) !important; }
.hm-stock-tool .hm-smallmetrics { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:10px; }
.hm-stock-tool .hm-context { margin-top:13px; color:#426480; font-size:12px; background:#f5f9ff; border-left:3px solid #75b2fb; padding:10px 12px; overflow-wrap:anywhere; }
.hm-stock-tool .hm-special { margin-top:13px; background:#f0fbf7; border:1px solid #cbeadf; border-radius:11px; padding:15px; }
.hm-stock-tool .hm-special h4 { font-size:14px; font-weight:750; margin-bottom:5px; }
.hm-stock-tool .hm-special .hm-value { font-size:23px; color:var(--hm-green); }
.hm-stock-tool .hm-special p { margin-top:8px; color:#476958; font-size:12px; }
.hm-stock-tool .hm-subtitle { font-size:15px; font-weight:750; margin:22px 0 10px; }
.hm-stock-tool .hm-chart { min-height:158px; color:var(--hm-muted); background:#fbfdff; border:1px solid #edf2f7; border-radius:10px; padding:10px 5px 3px; }
.hm-stock-tool .hm-chart svg { display:block; width:100%; height:auto; overflow:visible; }
.hm-stock-tool .hm-chart-empty { display:grid; place-items:center; min-height:155px; font-size:13px; padding:20px; text-align:center; }
.hm-stock-tool .hm-legend { display:flex; gap:14px; flex-wrap:wrap; font-size:11px; color:var(--hm-muted); margin-top:8px; }
.hm-stock-tool .hm-legend i { display:inline-block; width:8px; height:8px; border-radius:50%; background:var(--hm-blue); margin-right:4px; }
.hm-stock-tool .hm-legend i.green { background:#0d9c70; }
.hm-stock-tool .hm-table-wrap { width:100%; overflow-x:auto; border:1px solid #e4ecf5; border-radius:10px; }
.hm-stock-tool table { border-collapse:collapse; width:100%; margin:0; border:0; table-layout:fixed; font-size:12px; line-height:1.5; text-align:right; }
.hm-stock-tool thead { background:#edf3fa; }
.hm-stock-tool th, .hm-stock-tool td { border:0; border-bottom:1px solid #e7edf5; padding:10px 5px; color:var(--hm-ink); overflow-wrap:anywhere; white-space:normal; text-align:right; font-weight:400; }
.hm-stock-tool th { font-weight:700; font-size:11px; }
.hm-stock-tool th:first-child, .hm-stock-tool td:first-child { text-align:left; width:21%; padding-left:9px; }
.hm-stock-tool tfoot td { font-weight:750; background:#fff8e8; border-bottom:0; }
.hm-stock-tool .hm-empty-cell { text-align:center !important; color:var(--hm-muted); padding:20px; }
.hm-stock-tool .hm-copy { width:100%; margin-top:13px; font-size:13px; }
.hm-stock-tool .hm-copy-message { font-size:12px; color:var(--hm-muted); min-height:20px; margin-top:7px; }
.hm-stock-tool .hm-copy-fallback { display:block; width:100%; min-height:140px; padding:10px; color:var(--hm-ink); border:1px solid var(--hm-border); border-radius:8px; background:#fff; font-size:12px; }
.hm-stock-tool .hm-aside { display:grid; gap:14px; min-width:0; }
.hm-stock-tool .hm-shortcuts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:16px; }
.hm-stock-tool .hm-shortcut { flex-direction:column; align-items:flex-start; text-align:left; min-height:92px; font-size:12px; padding:12px; background:#f3f8ff; }
.hm-stock-tool .hm-shortcut b { color:#2a6bb7; margin-bottom:3px; font-size:14px; }
.hm-stock-tool .hm-shortcut span { color:var(--hm-muted); font-weight:400; font-size:11px; }
.hm-stock-tool .hm-example-box { margin-top:15px; padding:14px; background:#fff3f4; border:1px solid #ffe0e5; border-radius:11px; }
.hm-stock-tool .hm-example-box b { display:block; margin-bottom:7px; font-size:14px; color:#ca3846; }
.hm-stock-tool .hm-example-box p { font-size:12px; line-height:1.8; }
.hm-stock-tool .hm-example-box strong { color:var(--hm-blue); }
.hm-stock-tool .hm-tips { display:grid; gap:11px; list-style:none; margin-top:15px; font-size:12px; color:#597087; }
.hm-stock-tool .hm-tips li { list-style:none; margin:0; padding:0 0 0 21px; position:relative; }
.hm-stock-tool .hm-tips li::before { content:"✓"; position:absolute; left:0; color:#0d9c70; font-weight:800; }
.hm-stock-tool .hm-formula { margin-top:16px; padding:12px 14px; background:#fff8e8; border:1px solid #f4e7c4; border-radius:10px; font-size:12px; color:#715c2d; }
.hm-stock-tool .hm-formula summary { cursor:pointer; min-height:44px; font-weight:750; padding:10px 0; }
.hm-stock-tool .hm-formula p { margin-top:8px; overflow-wrap:anywhere; }
.hm-stock-tool .hm-footer { padding:0 20px 17px; color:#7b899a; font-size:11px; text-align:center; }
@container hmstock (min-width:760px) {
  .hm-stock-tool .hm-grid { grid-template-columns:minmax(285px,.9fr) minmax(0,1.3fr); }
  .hm-stock-tool .hm-aside { grid-column:1/-1; grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@container hmstock (min-width:1160px) {
  .hm-stock-tool .hm-grid { grid-template-columns:minmax(290px,.95fr) minmax(0,1.35fr) minmax(235px,.85fr); }
  .hm-stock-tool .hm-aside { grid-column:auto; grid-template-columns:1fr; }
  .hm-stock-tool .hm-smallmetrics { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@container hmstock (max-width:390px) {
  .hm-stock-tool { border-radius:13px; font-size:14px; }
  .hm-stock-tool .hm-head { padding:14px; }
  .hm-stock-tool .hm-brand { font-size:18px; }
  .hm-stock-tool .hm-intro { padding:18px 14px; }
  .hm-stock-tool .hm-grid { padding:9px; gap:10px; }
  .hm-stock-tool .hm-card { padding:14px; }
  .hm-stock-tool .hm-mainmetrics { grid-template-columns:1fr; }
  .hm-stock-tool .hm-metric.big { padding:14px; }
  .hm-stock-tool .hm-pair { grid-template-columns:1fr; }
  .hm-stock-tool .hm-pair .hm-field + .hm-field { margin-top:10px; }
  .hm-stock-tool .hm-shortcuts { grid-template-columns:1fr; }
  .hm-stock-tool .hm-shortcut { min-height:70px; }
  .hm-stock-tool .hm-tabs { font-size:12px; }
}
@media (prefers-reduced-motion:reduce) { .hm-stock-tool button { transition:none; } }