.cc{max-width:640px;margin:2rem auto;background:#fff;border:1px solid var(--line);border-radius:.8rem;padding:1.5rem 1.6rem;box-shadow:0 8px 30px rgb(15 23 42 / 6%)}.cc-field{margin:0 0 1.2rem}.cc-field>label{display:block;font-weight:600;color:var(--ink);margin-bottom:.4rem}.cc-field input[type="number"]{width:100%;padding:.6rem .7rem;border:1.5px solid #cbd5e1;border-radius:.5rem;font-size:1rem}.cc-field input[type="number"]:focus{outline:none;border-color:var(--sky);box-shadow:0 0 0 3px rgb(14 165 233 / 15%)}.cc-field input[type="range"]{width:100%;accent-color:var(--sky);margin:.35rem 0 .15rem;cursor:pointer}.cc-field output{font-weight:700;color:var(--sky-d)}.cc-hint{margin:.35rem 0 0;font-size:.83rem;color:var(--muted);line-height:1.45}.cc-out{display:none;margin-top:1.5rem;padding-top:1.4rem;border-top:1px dashed var(--line)}.cc-out.show{display:block}.cc-cols{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}.cc-col{display:flex;flex-direction:column;gap:.15rem;text-align:center;padding:1.1rem .7rem;border-radius:.6rem;border:1.5px solid var(--line)}.cc-col-ga4{background:#fef2f2;border-color:#fecaca}.cc-col-real{background:#f0f9ff;border-color:#bae6fd}.cc-col-h{font-size:.74rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}.cc-num{font-size:2.1rem;font-weight:800;line-height:1.1;color:var(--ink)}.cc-col-ga4 .cc-num{color:#dc2626}.cc-col-real .cc-num{color:var(--sky-d)}.cc-unit{font-size:.8rem;color:var(--muted)}.cc-sub{margin-top:.35rem;font-size:.85rem;font-weight:600;color:#334155}.cc-gap{margin:1.2rem 0 0;padding:.9rem 1.05rem;background:#fffbeb;border:1px solid #fde68a;border-radius:.55rem;text-align:center;color:#334155;font-size:1rem;line-height:1.6}.cc-gap strong{color:#b45309;font-weight:700}.cc-disclaimer{margin:1rem 0 0;font-size:.8rem;color:var(--muted);line-height:1.5}@media(max-width:480px){.cc{padding:1.2rem 1.1rem}.cc-cols{grid-template-columns:1fr}.cc-num{font-size:1.8rem}}