#medis-pricing-calculator-root { --calc-ink: #1c1a17; --calc-paper: #fcfaf4; --calc-soft: #f3eee2; --calc-rule: #d9d3c5; --calc-orange: #f07523; --calc-muted: #6e6a62; font-family: 'Noto Sans TC', 'Inter', sans-serif; color: var(--calc-ink); }
.medis-calc { border: 1px solid var(--calc-rule); background: var(--calc-paper); box-shadow: 0 18px 40px -32px rgba(28,26,23,.55); }
.medis-calc__head { display: flex; justify-content: space-between; gap: 24px; align-items: flex-start; padding: clamp(22px, 4vw, 40px); border-bottom: 1px solid var(--calc-ink); }
.medis-calc__eyebrow { color: var(--calc-orange); font: 10px/1.4 'JetBrains Mono', monospace; letter-spacing: .16em; margin-bottom: 10px; }
.medis-calc h2 { font: 700 clamp(25px, 3vw, 36px)/1.3 'Noto Serif TC', serif; margin: 0 0 10px; }
.medis-calc__head p { color: var(--calc-muted); font-size: 14px; line-height: 1.8; margin: 0; }
.medis-calc__cai { flex: 0 0 auto; min-width: 104px; border-left: 2px solid var(--calc-orange); padding-left: 14px; }
.medis-calc__cai span, .medis-calc__cai small { display: block; color: var(--calc-muted); font-size: 12px; }
.medis-calc__cai strong { display: inline-block; color: var(--calc-orange); font: 600 42px/1.1 Inter, sans-serif; font-variant-numeric: tabular-nums; }
.medis-calc__body { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(280px, .7fr); }
.medis-calc__form { padding: clamp(22px, 4vw, 40px); }
.medis-calc fieldset { border: 0; border-top: 1px solid var(--calc-rule); margin: 0; padding: 22px 0 0; }
.medis-calc fieldset + fieldset { margin-top: 26px; }
.medis-calc legend { font: 700 16px/1.4 'Noto Serif TC', serif; padding: 0 10px 0 0; }
.medis-calc legend small { color: var(--calc-muted); font: 12px 'Noto Sans TC', sans-serif; margin-left: 5px; }
.medis-calc__dimensions { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: end; gap: 12px; margin-top: 16px; }
.medis-calc label { display: block; font-size: 13px; }
.medis-calc__dimensions > span { padding-bottom: 11px; color: var(--calc-muted); }
.medis-calc input[type=number] { width: 100%; min-height: 44px; border: 1px solid var(--calc-rule); background: #fff; color: var(--calc-ink); font: 600 16px Inter, sans-serif; padding: 9px 11px; margin-top: 7px; }
.medis-calc input:focus-visible, .medis-calc button:focus-visible { outline: 2px solid var(--calc-orange); outline-offset: 2px; }
.medis-calc__hint { color: var(--calc-muted); font-size: 12px; line-height: 1.7; margin-top: 9px; }
.medis-calc__materials, .medis-calc__finishings { display: grid; gap: 8px; margin-top: 14px; }
.medis-calc__choice { display: flex; align-items: center; gap: 10px; border: 1px solid var(--calc-rule); background: #fff; cursor: pointer; padding: 10px 12px; transition: border-color 120ms, background 120ms; }
.medis-calc__choice:has(input:checked) { border-color: var(--calc-orange); background: #fff7f0; }
.medis-calc__choice input { accent-color: var(--calc-orange); flex: 0 0 auto; }
.medis-calc__choice span { display: flex; justify-content: space-between; gap: 12px; width: 100%; align-items: baseline; }
.medis-calc__choice strong { font-size: 13px; font-weight: 600; }
.medis-calc__choice small { color: var(--calc-muted); font-size: 12px; white-space: nowrap; }
.medis-calc__qty { display: grid; grid-template-columns: 44px 92px 44px; gap: 0; margin-top: 14px; }
.medis-calc__qty button { border: 1px solid var(--calc-ink); background: var(--calc-ink); color: var(--calc-paper); cursor: pointer; font-size: 22px; }
.medis-calc__qty input { border-left: 0; border-right: 0; text-align: center; margin: 0; }
.medis-calc__summary { border-left: 1px solid var(--calc-rule); background: var(--calc-soft); padding: clamp(22px, 4vw, 40px); }
.medis-calc__status { color: var(--calc-orange); font: 10px 'JetBrains Mono', monospace; letter-spacing: .08em; margin-bottom: 20px; }
.medis-calc__price-row, .medis-calc__total { display: flex; justify-content: space-between; gap: 15px; align-items: baseline; padding: 13px 0; border-bottom: 1px dotted #c9c2b2; font-size: 13px; }
.medis-calc__price-row strong { font: 600 16px Inter, sans-serif; font-variant-numeric: tabular-nums; }
.medis-calc__total { border-bottom: 0; padding: 20px 0 4px; font-size: 14px; }
.medis-calc__total strong { font: 600 22px Inter, sans-serif; font-variant-numeric: tabular-nums; }
.medis-calc__total--tax { border-top: 1px solid var(--calc-ink); padding-top: 18px; }
.medis-calc__total--tax strong { color: var(--calc-orange); font-size: 27px; }
.medis-calc__total small { display: block; color: var(--calc-muted); font-size: 11px; margin-top: 3px; }
.medis-calc__lead { border-left: 2px solid var(--calc-orange); color: var(--calc-muted); font-size: 12px; line-height: 1.8; margin: 22px 0; padding-left: 10px; }
.medis-calc__add { width: 100%; min-height: 48px; border: 0; background: var(--calc-orange); color: #fff; cursor: pointer; font: 600 15px 'Noto Serif TC', serif; transition: background 120ms; }
.medis-calc__add:hover:not(:disabled) { background: #c05a12; }
.medis-calc__add:disabled { background: #b4ae9f; cursor: not-allowed; }
.medis-calc__fineprint { color: var(--calc-muted); font-size: 11px; line-height: 1.7; margin: 12px 0 0; }
.medis-calc__message { display: none; border-top: 1px solid var(--calc-orange); background: #fff7f0; color: #8e3f08; font-size: 13px; line-height: 1.7; padding: 12px 18px; }
.medis-calc__message.is-visible { display: block; }
@media (max-width: 720px) { .medis-calc__head { gap: 16px; } .medis-calc__body { grid-template-columns: 1fr; } .medis-calc__summary { border-left: 0; border-top: 1px solid var(--calc-rule); } }
@media (max-width: 420px) { .medis-calc__head { display: block; } .medis-calc__cai { margin-top: 20px; } .medis-calc__choice span { display: block; } .medis-calc__choice small { display: block; margin-top: 3px; } }
