.compare-shell{width:min(1180px,calc(100% - 36px));margin:0 auto;padding:46px 0 72px}.compare-heading{margin-bottom:28px}.compare-heading h1{margin:0 0 9px;font-size:clamp(32px,4.1vw,52px);letter-spacing:-.065em}.compare-heading>p:last-child{margin:0;max-width:680px;color:var(--muted);line-height:1.7;font-size:15px}.panel{border:1px solid var(--line);background:var(--panel);border-radius:18px}.compare-controls{display:flex;justify-content:space-between;gap:28px;padding:20px 22px;margin-bottom:16px}.control-block{min-width:0}.control-label{display:block;margin-bottom:8px;color:var(--muted);font-size:12px}.selector-row{display:flex;gap:8px}.selector-row select{min-width:245px;max-width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:9px;background:var(--bg);color:var(--ink);font:inherit;outline:none}.selector-row button,.segmented button{border:1px solid var(--line);background:transparent;color:var(--muted);font:inherit;cursor:pointer}.selector-row button{padding:8px 14px;border-radius:9px;color:var(--ink)}.selected-instruments{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}.instrument-chip{display:flex;align-items:center;gap:7px;padding:6px 8px;border:1px solid var(--line);border-radius:999px;background:color-mix(in srgb,var(--panel) 88%,var(--accent));font-size:12px}.instrument-chip i{width:7px;height:7px;border-radius:50%;display:block}.instrument-chip button{width:19px;height:19px;border:0;border-radius:50%;background:transparent;color:var(--muted);font:17px/1 Arial,sans-serif;cursor:pointer}.compact-controls{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap;justify-content:flex-end}.compact-controls .control-label{margin:0 0 8px}.range-label{margin-left:4px!important}.segmented{display:flex;gap:4px}.segmented button{border-radius:8px;padding:8px 10px;font-size:12px}.segmented button.active{background:var(--ink);border-color:var(--ink);color:var(--bg)}.chart-panel{padding:20px 20px 15px}.panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px}.panel-head h2,.how-to h2,.section-title h2{margin:0 0 5px;font-size:18px;letter-spacing:-.035em}.panel-head p,.section-title p,.chart-note{margin:0;color:var(--muted);font-size:12px;line-height:1.6}.chart-legend{display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-wrap:wrap;font-size:12px;color:var(--muted)}.chart-legend span{display:flex;gap:5px;align-items:center;white-space:nowrap}.chart-legend i{display:block;width:14px;height:2px;border-radius:1px}.canvas-wrap{position:relative;margin-top:14px}.canvas-wrap canvas{display:block;width:100%;height:390px;cursor:crosshair}.compare-tooltip{position:absolute;z-index:2;min-width:170px;padding:10px 11px;border:1px solid var(--line);border-radius:9px;background:color-mix(in srgb,var(--panel) 94%,#111);color:var(--ink);box-shadow:0 8px 25px rgba(0,0,0,.16);font-size:12px;line-height:1.6;pointer-events:none}.compare-tooltip strong{display:block;margin-bottom:4px}.tooltip-row{display:flex;justify-content:space-between;gap:14px}.chart-note{margin-top:6px}.comparison-summary{margin-top:30px}.section-title{margin-bottom:13px}.summary-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(205px,1fr));gap:10px}.summary-card{display:block;padding:16px;border:1px solid var(--line);border-radius:15px;background:var(--panel);transition:transform .15s ease,border-color .15s ease}.summary-card:hover{transform:translateY(-2px);border-color:var(--muted)}.summary-card-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.summary-name{display:flex;align-items:center;gap:7px;min-width:0;font-size:13px;font-weight:700}.summary-name i{width:8px;height:8px;border-radius:50%;flex:none}.summary-name span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.summary-card code{font:11px/1.2 Inter,sans-serif;color:var(--muted);background:none}.summary-values{display:flex;gap:18px;margin-top:15px}.summary-values span{color:var(--muted);font-size:11px}.summary-values b{display:block;margin-top:3px;color:var(--ink);font-size:19px;letter-spacing:-.04em}.summary-up{color:#d94f74!important}.summary-down{color:#13976d!important}.how-to{margin-top:30px;padding:20px}.how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.how-grid p{margin:0;color:var(--muted);font-size:13px;line-height:1.75}.how-grid b{color:var(--ink)}@media(max-width:880px){.compare-controls{display:block}.compact-controls{justify-content:flex-start;margin-top:17px}.canvas-wrap canvas{height:350px}}@media(max-width:600px){.compare-shell{width:min(100% - 24px,1180px);padding:30px 0 48px}.compare-controls,.chart-panel,.how-to{padding:15px}.selector-row select{min-width:0;flex:1}.compact-controls{gap:8px}.range-label{margin-left:0!important}.canvas-wrap canvas{height:290px}.panel-head{display:block}.chart-legend{justify-content:flex-start;margin-top:10px}.how-grid{grid-template-columns:1fr;gap:12px}.summary-cards{grid-template-columns:1fr 1fr}}
