:root{--gold: var(--amber);--bg-card: var(--black-2);--text-muted: var(--white-3);--text-secondary: var(--white-2);--text: var(--white-1);--green: var(--emerald);--bg-elevated: rgba(255, 255, 255, .05);--max-w: 1240px;--font-serif: "Noto Serif TC", serif;--hairline: rgba(239, 235, 226, .1);--gold-faint: rgba(235, 188, 66, .22);--gold-soft: rgba(235, 188, 66, .45)}.tool-grid{display:grid;grid-template-columns:1fr;gap:32px;margin-bottom:40px}.tool-card{background:var(--bg-card);border:1px solid var(--hairline);border-radius:0;padding:32px;overflow:hidden}.tool-card h3{font-family:var(--font-serif);font-size:21px;font-weight:600;letter-spacing:.04em;margin-bottom:4px;display:flex;align-items:center;gap:10px}.tool-card .tool-subtitle{font-size:13.5px;color:var(--text-muted);margin-bottom:24px}.tool-inner{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start}.slider-group{margin-bottom:20px}.slider-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.slider-label span{font-size:14px;color:var(--text-secondary)}.slider-value{font-size:17px;font-weight:600;color:var(--text);font-family:var(--font-serif);font-variant-numeric:tabular-nums}input[type=range]{-webkit-appearance:none;width:100%;height:2px;border-radius:0;background:#efebe21f;outline:none;transition:background .2s}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:var(--gold);cursor:pointer}input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--gold);cursor:pointer;border:none}.result-box{background:var(--black);border:1px solid var(--gold-faint);border-radius:0;padding:24px;text-align:center;margin-bottom:16px}.result-big{font-size:36px;font-weight:600;font-family:var(--font-serif);font-variant-numeric:tabular-nums;margin-bottom:4px}.result-label{font-size:12px;color:var(--text-muted);letter-spacing:.14em}.result-row{display:flex;gap:12px;margin-top:12px}.result-item{flex:1;background:var(--black);border:1px solid var(--hairline);border-radius:0;padding:12px;text-align:center}.result-item .val{font-size:19px;font-weight:600;font-family:var(--font-serif);font-variant-numeric:tabular-nums}.result-item .lbl{font-size:11px;color:var(--text-muted);margin-top:3px;letter-spacing:.1em}.chart-area{position:relative;height:240px;background:var(--black);border:1px solid var(--hairline);border-radius:0;overflow:hidden}.bar-viz{display:flex;align-items:flex-end;gap:3px;height:200px;padding:0 4px}.bar-viz .bar{flex:1;border-radius:0;transition:height .3s ease;min-width:4px;position:relative}.bar-labels{display:flex;justify-content:space-between;font-size:10px;color:var(--text-muted);margin-top:4px;padding:0 4px;letter-spacing:.08em}.input-group{margin-bottom:16px}.input-group label{display:block;font-size:13px;color:var(--text-secondary);margin-bottom:6px}.input-field{width:100%;padding:11px 14px;border-radius:0;border:1px solid rgba(239,235,226,.22);background:var(--black);color:var(--text);font-size:15px;font-family:var(--font-serif);font-variant-numeric:tabular-nums}.input-field:focus{outline:none;border-color:var(--gold-soft)}.input-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.rr-visual{position:relative;height:200px;display:flex;align-items:center;justify-content:center}.rr-bar-wrap{display:flex;gap:24px;align-items:flex-end;height:180px}.rr-bar{width:80px;border-radius:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding-bottom:8px;transition:height .4s ease}.rr-bar .rr-val{font-size:18px;font-weight:600;font-family:var(--font-serif);font-variant-numeric:tabular-nums;margin-bottom:4px}.rr-bar .rr-lbl{font-size:11px;opacity:.8}@media(max-width:768px){.tool-inner,.input-row{grid-template-columns:1fr}.result-big{font-size:28px}.result-row{flex-wrap:wrap}.result-item{min-width:calc(50% - 8px)}.result-item .val{font-size:16px}.rr-bar-wrap{gap:16px}.rr-bar{width:60px}.bar-viz{height:160px}.slider-value{font-size:16px}.tool-card{padding:16px}}@media(max-width:380px){.result-item{min-width:100%}.result-item .val{font-size:14px}.rr-bar{width:50px}}
