.frac-header{border-bottom:0;padding-bottom:10px}.frac-main{padding-top:10px}.frac-workbench{display:grid;gap:22px;padding:clamp(24px,3.5vw,34px);overflow:hidden;border:1px solid color-mix(in srgb,var(--brand) 22%,var(--line));border-radius:18px;background:var(--surface);box-shadow:0 18px 45px #0f172a12}.frac-card{min-width:0;padding:clamp(20px,3vw,26px);border:1px solid color-mix(in srgb,var(--brand) 16%,var(--line));border-radius:14px;background:color-mix(in srgb,var(--surface) 88%,transparent)}.frac-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.frac-card-heading{display:flex;align-items:flex-start;gap:11px;margin-bottom:20px}.frac-step{display:grid;width:30px;height:30px;flex:0 0 30px;place-items:center;color:var(--brand);border-radius:8px;background:var(--brand-soft);font-size:.72rem;font-weight:760;letter-spacing:.04em}.frac-card h2{font-size:1rem;line-height:1.35}.frac-card-heading p:not(.frac-step){margin-top:4px;color:var(--muted);font-size:.8rem;line-height:1.5}.frac-arith{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:14px;margin-bottom:20px}.frac-fraction{display:flex;align-items:center;gap:9px}.frac-fraction input[type=number]{width:68px;height:40px;padding:0 6px;border:1px solid var(--line);border-radius:9px;background:var(--canvas);color:var(--ink);font-size:1rem;font-variant-numeric:tabular-nums;text-align:center}.frac-fraction input[type=number]:focus{border-color:var(--brand);outline:2px solid color-mix(in srgb,var(--brand) 38%,transparent)}.frac-stack{display:inline-flex;flex-direction:column;gap:6px}.frac-stack input[type=number]{height:38px}.frac-bar{height:2px;border-radius:2px;background:var(--ink);opacity:.7}.frac-op{display:inline-flex;gap:3px;padding:4px;border:1px solid var(--line);border-radius:11px;background:var(--canvas)}.frac-op-btn{width:42px;height:38px;border:0;border-radius:8px;background:transparent;color:var(--muted);font-size:1.05rem;font-weight:750;cursor:pointer}.frac-op-btn:hover{color:var(--brand);background:var(--brand-soft)}.frac-op-btn.is-active{color:#fff;background:var(--brand)}.frac-equals{margin:0;font-size:1.45rem;font-weight:800;color:var(--brand)}.frac-results{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.frac-results--compact{grid-template-columns:repeat(2,minmax(0,1fr))}.frac-result-card{min-width:0;padding:14px;border:1px solid color-mix(in srgb,var(--brand) 14%,var(--line));border-radius:11px;background:color-mix(in srgb,var(--surface) 84%,transparent)}.frac-result-card span,.frac-result-card strong{display:block}.frac-result-card span{color:var(--muted);font-size:.76rem;font-weight:650}.frac-result-card strong{margin-top:6px;overflow-wrap:anywhere;color:color-mix(in srgb,var(--brand) 78%,var(--ink));font-size:clamp(1rem,1.7vw,1.25rem);font-variant-numeric:tabular-nums}.frac-result-card--primary{border-color:color-mix(in srgb,var(--brand) 34%,var(--line));background:var(--brand-soft)}.frac-results--compact .frac-result-card--primary{grid-column:1 / -1}.frac-result-card--primary strong{color:color-mix(in srgb,var(--brand) 88%,var(--ink));font-size:clamp(1.25rem,2.2vw,1.55rem)}.frac-status{margin-top:12px;padding:10px 12px;border:1px solid transparent;border-radius:9px;font-size:.82rem;font-weight:650}.frac-status.error{color:var(--danger);border-color:color-mix(in srgb,var(--danger) 30%,var(--line));background:color-mix(in srgb,var(--danger) 7%,var(--surface))}.frac-decimal-field{margin-bottom:16px}.frac-decimal-field>label{color:var(--ink);font-size:.8rem}.frac-decimal-field input[type=text]{width:100%}.frac-hint{margin-top:7px;color:var(--muted);font-size:.78rem}.frac-actions{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-top:22px}.frac-actions .btn{min-height:44px;margin:0}.frac-privacy-note{margin:0;color:var(--muted);font-size:.78rem}@media (max-width: 960px){.frac-results{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 760px){.frac-grid{grid-template-columns:1fr}.frac-arith{gap:12px}}@media (max-width: 440px){.frac-workbench{padding:18px}.frac-results,.frac-results--compact{grid-template-columns:1fr}.frac-results--compact .frac-result-card--primary{grid-column:auto}.frac-fraction input[type=number]{width:60px}}
