/* Trading calculator: the platform's trading tools in its black skin, inside the site's frame.
   Black-skin tokens from act-intrgrate-crm src/styles/globals.css (html[data-theme="dark"]:root.black-theme). */
.calc-app{--k-bg:#000;--k-card:#0f0f0f;--k-line:#2f2e2e;--k-text:#c3c3c2;--k-strong:#ddd;--k-muted:#a8a8a8;--k-faint:#757575;--k-control:#575757;--k-accent:#c97b4a;--k-up:#4ade80;--k-down:#f87171}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.calc-hero .hero-bottom{margin-bottom:56px}
.calc-stage{padding:0 6% 95px}
.calc-frame{background:#000}
.frame-bar span span{margin:0}

.calc-app{display:grid;grid-template-columns:230px minmax(0,1fr);min-height:640px;background:var(--k-bg);color:var(--k-text);font-size:14px}
.calc-app :focus-visible{outline:2px solid var(--k-accent);outline-offset:2px}

/* Left list */
.calc-list{border-right:1px solid var(--k-line);padding:22px 12px;background:var(--k-bg)}
.calc-list-title{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--k-faint);padding:0 12px 12px}
.calc-list ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.calc-list button{width:100%;text-align:left;font:inherit;font-size:14px;color:var(--k-text);background:none;border:0;border-left:2px solid transparent;border-radius:6px;padding:11px 12px;cursor:pointer}
.calc-list button:hover{background:var(--k-card);color:var(--k-strong)}
.calc-list button[aria-pressed=true]{background:var(--k-card);color:var(--k-accent);border-left-color:var(--k-accent)}

/* Right panel */
.calc-panel{padding:28px 32px 30px;min-width:0}
.calc-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.calc-head h2{font-size:24px;font-weight:500;letter-spacing:-.02em;color:var(--k-strong)}
.calc-head h2:focus{outline:none}
.calc-feed{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--k-muted);margin-top:6px}
.calc-feed i{width:7px;height:7px;border-radius:50%;background:var(--k-faint);flex:none}
.calc-feed[data-feed=live] i{background:var(--k-up)}
.calc-feed[data-feed=down] i{background:var(--k-down)}
.calc-desc{color:var(--k-muted);line-height:1.7;max-width:720px;margin:10px 0 24px}

.calc-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 22px}
.calc-field{display:flex;flex-direction:column;gap:7px;min-width:0;margin:0;padding:0;border:0}
.calc-field>label,.calc-field legend{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13px;color:var(--k-strong);padding:0}
.calc-field legend{margin-bottom:7px}
.calc-field small{font-size:11.5px;line-height:1.5;color:var(--k-faint)}
.calc-field input[type=number],.calc-select select{width:100%;box-sizing:border-box;height:44px;padding:0 12px;font:inherit;font-size:15px;color:var(--k-strong);background:var(--k-card);border:1px solid var(--k-line);border-radius:8px;font-variant-numeric:tabular-nums}
.calc-field input[type=number]:hover,.calc-select select:hover{border-color:var(--k-control)}
.calc-field input[type=number]:focus-visible,.calc-select select:focus-visible{outline:none;border-color:var(--k-accent);box-shadow:0 0 0 1px var(--k-accent)}
.calc-field input::placeholder{color:var(--k-faint)}
.calc-select{position:relative}
.calc-select::after{content:'';position:absolute;right:15px;top:50%;width:7px;height:7px;border-right:1.5px solid var(--k-muted);border-bottom:1.5px solid var(--k-muted);transform:translateY(-70%) rotate(45deg);pointer-events:none}
.calc-select select{appearance:none;-webkit-appearance:none;padding-right:36px;cursor:pointer}
.calc-select option{background:var(--k-card);color:var(--k-strong)}

.calc-tag{font-size:10.5px;letter-spacing:.04em;color:var(--k-faint);white-space:nowrap}
.calc-tag[data-state=live]{color:var(--k-up)}
.calc-tag[data-state=live]::before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--k-up);margin-right:5px;vertical-align:1px}
.calc-tag[data-state=typed]{color:var(--k-accent)}

.calc-seg>div{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--k-line);border-radius:8px;overflow:hidden;background:var(--k-card)}
.calc-seg label{position:relative;cursor:pointer}
.calc-seg input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.calc-seg span{display:flex;align-items:center;justify-content:center;height:42px;font-size:14px;color:var(--k-muted)}
.calc-seg label+label span{border-left:1px solid var(--k-line)}
.calc-seg input:checked+span{background:var(--k-accent);color:#000;font-weight:500}
.calc-seg input:focus-visible+span{outline:2px solid var(--k-strong);outline-offset:-4px}

.calc-submit{margin-top:24px}
.calc-button{font:inherit;font-size:14px;font-weight:600;color:#000;background:var(--k-accent);border:0;border-radius:8px;height:46px;padding:0 34px;cursor:pointer}
.calc-button:hover{background:#d88d5e}
.calc-app .calc-button:focus-visible{outline:2px solid var(--k-strong);outline-offset:3px}

.calc-results{margin-top:24px;border-top:1px solid var(--k-line);padding-top:20px}
.calc-results:empty{display:none}
.calc-out{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:0}
.calc-out div{background:var(--k-card);border:1px solid var(--k-line);border-radius:8px;padding:14px 16px;min-width:0}
.calc-out dt{font-size:12px;color:var(--k-muted)}
.calc-out dd{margin:6px 0 0;font-size:16px;color:var(--k-strong);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.calc-out .is-main dd{font-size:22px;font-weight:500;letter-spacing:-.01em}
.calc-out dd.is-up,.calc-table .is-up{color:var(--k-up)}
.calc-out dd.is-down,.calc-table .is-down{color:var(--k-down)}
.calc-note{color:var(--k-muted);line-height:1.6;margin-top:10px}
.calc-results>.calc-note:first-child{margin-top:0}

.calc-table-wrap{overflow-x:auto;margin-bottom:14px;border:1px solid var(--k-line);border-radius:8px}
.calc-table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:13.5px}
.calc-table th,.calc-table td{padding:10px 14px;text-align:right;border-bottom:1px solid var(--k-line);white-space:nowrap}
.calc-table th:first-child{text-align:left}
.calc-table thead th{font-size:12px;font-weight:500;color:var(--k-muted);background:var(--k-card)}
.calc-table tbody th{font-weight:400;color:var(--k-text)}
.calc-table td{color:var(--k-strong)}
.calc-table tbody tr:last-child>*{border-bottom:0}
.calc-levels .is-res th{color:var(--k-down)}
.calc-levels .is-sup th{color:var(--k-up)}
.calc-levels .is-pivot>*{background:var(--k-card);color:var(--k-accent)}

.calc-disclaimer{margin-top:18px;font-size:11.5px;line-height:1.6;color:var(--k-faint)}
.calc-stage .frame-caption{max-width:760px}

/* Search content */
.calc-guide-title{font-size:clamp(36px,4vw,64px);font-weight:400;line-height:1.08;letter-spacing:-.05em}
.calc-guide .editorial-intro{align-self:start;position:sticky;top:30px}
.calc-guide .capability h2{font-size:21px;font-weight:400;letter-spacing:-.5px;line-height:1.3}
.calc-guide .capability p+p{margin-top:8px}

@media(max-width:900px){
  .calc-app{grid-template-columns:minmax(0,1fr);min-height:0}
  .calc-list{border-right:0;border-bottom:1px solid var(--k-line);padding:12px 0;min-width:0}
  .calc-list-title{padding:0 16px 8px}
  .calc-list ul{display:flex;gap:6px;overflow-x:auto;padding:0 16px 4px;scrollbar-width:none}
  .calc-list ul::-webkit-scrollbar{display:none}
  .calc-list li{flex:none}
  .calc-list button{white-space:nowrap;border-left:0;border:1px solid var(--k-line);border-radius:20px;padding:8px 14px}
  .calc-list button[aria-pressed=true]{border-color:var(--k-accent)}
  .calc-guide .editorial-intro{position:static}
}
@media(max-width:760px){
  .calc-stage{padding:0 4% 65px}
  .calc-panel{padding:22px 16px 24px}
  .calc-fields{grid-template-columns:minmax(0,1fr);gap:16px}
  .calc-head h2{font-size:21px}
  .calc-button{width:100%}
  .calc-out{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .calc-out .is-main{grid-column:1/-1}
  .calc-table th,.calc-table td{padding:9px 10px}
}
