.coord-tool{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:24px;margin-top:24px;display:grid}.coord-card,.coord-result{border:1px solid var(--color-base-300);border-radius:var(--radius-box);min-width:0;padding:24px}.coord-card-head{justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:20px;display:flex}.coord-card-head>div{min-width:0}.coord-card-head h2,.coord-result>h2{margin:0;font-size:1.25rem;font-weight:600;line-height:1.4}.coord-card-head p{color:color-mix(in oklab, var(--color-base-content) 65%, transparent);margin:4px 0 0;font-size:12px;line-height:1.5}.coord-clear{flex:none;height:44px;min-height:44px;padding:0 16px}.coord-mode{gap:8px;margin-bottom:12px;display:grid}.coord-mode>span,.coord-field>span{font-size:.875rem;font-weight:600}.coord-mode select,.coord-field input{box-sizing:border-box;width:100%;min-height:44px}.coord-help{color:color-mix(in oklab, var(--color-base-content) 70%, transparent);margin:8px 0 16px;font-size:.875rem;line-height:1.55}.coord-points{grid-template-columns:1fr 1fr;gap:12px;display:grid}.coord-point{border:1px solid var(--color-base-300);background:color-mix(in oklab, var(--color-base-200) 60%, var(--color-base-100));border-radius:10px;min-width:0;margin:0;padding:14px}.coord-point-head{grid-template-columns:auto 1fr;align-items:center;gap:2px 8px;margin-bottom:12px;display:grid}.coord-point-head strong{font-size:.9rem;line-height:1.3}.coord-point-badge{background:var(--color-primary);width:30px;height:30px;color:var(--color-primary-content);border-radius:999px;grid-row:1/3;place-items:center;font-weight:800;display:grid}.coord-point[data-point=B] .coord-point-badge{background:var(--color-secondary);color:var(--color-secondary-content)}.coord-point[data-point=P] .coord-point-badge{background:var(--color-accent);color:var(--color-accent-content)}.coord-point-preview{min-width:0;color:color-mix(in oklab, var(--color-base-content) 68%, transparent);overflow-wrap:anywhere;font-size:.78rem;font-weight:650}.coord-field-row{grid-template-columns:1fr 1fr;align-items:start;gap:12px;display:grid}.coord-field{gap:8px;min-width:0;display:grid}.coord-field-error,.coord-error{color:var(--color-error);font-size:.875rem;line-height:1.45}.coord-ratio{grid-template-columns:1fr auto 1fr;align-items:center;margin-top:16px}.coord-colon{padding-top:28px;font-weight:700}.coord-single{max-width:calc(50% - 6px);margin-top:16px}.coord-actions{justify-content:center;margin-top:20px;display:flex}.coord-actions .btn{box-sizing:border-box;width:min(220px,100%);height:44px;min-height:44px;padding:0 16px;font-size:14px;line-height:20px}.coord-error{margin:12px 0 0}.coord-result{background:color-mix(in oklab, var(--color-primary) 8%, var(--color-base-100))}.coord-empty{text-align:center;padding:32px 0}.coord-empty h3{font-size:1rem;font-weight:600}.coord-empty p{color:color-mix(in oklab, var(--color-base-content) 65%, transparent);margin-top:8px}.coord-summary{gap:12px;margin:20px 0 0;display:grid}.coord-summary div{background:var(--color-base-100);overflow-wrap:anywhere;border-radius:8px;padding:12px}.coord-summary dt{color:color-mix(in oklab, var(--color-base-content) 65%, transparent);font-size:.8rem;font-weight:600}.coord-summary dd{margin:4px 0 0;font-size:1rem;line-height:1.55}.coord-summary div:first-child dd{font-size:1.35rem;font-weight:700}.coord-result-actions{justify-content:center;margin-top:12px;display:flex}.coord-result-actions .btn{width:min(220px,100%);height:44px;min-height:44px}.coord-diagram{margin:20px 0 0}.coord-diagram svg{border:1px solid var(--color-base-300);background:var(--color-base-100);border-radius:8px;width:100%;height:auto;max-height:240px;display:block}.coord-axis{stroke:color-mix(in oklab, var(--color-base-content) 45%, transparent);stroke-width:1.5px}.coord-axis-arrow{fill:color-mix(in oklab, var(--color-base-content) 55%, transparent)}.coord-axis-label{fill:var(--color-base-content);font-size:13px;font-weight:800}.coord-segment{stroke:var(--color-primary);stroke-width:3px;stroke-linecap:round}.coord-line{stroke-width:2.5px}.coord-line-arrow{fill:var(--color-primary)}.coord-delta{stroke:var(--color-secondary);stroke-width:2px;stroke-dasharray:5 4}.coord-delta-label{fill:var(--color-secondary);stroke:var(--color-base-100);stroke-width:5px;stroke-linejoin:round;paint-order:stroke;font-size:12px;font-weight:800}.coord-dot{fill:var(--color-primary);stroke:var(--color-base-100);stroke-width:2px}.coord-diagram [data-point=B] .coord-dot{fill:var(--color-secondary)}.coord-diagram [data-point=P] .coord-dot{fill:var(--color-accent)}.coord-label{fill:var(--color-base-content);stroke:var(--color-base-100);stroke-width:4px;stroke-linejoin:round;paint-order:stroke;font-size:12px;font-weight:750}@media (width<=760px){.coord-tool{grid-template-columns:1fr;gap:16px}.coord-card,.coord-result{padding:16px}.coord-card-head p{white-space:normal}.coord-single{max-width:none}}@media (width<=420px){.coord-points{grid-template-columns:1fr}.coord-field-row{grid-template-columns:1fr 1fr}.coord-summary div:first-child dd{font-size:1.15rem}.coord-result-actions .btn{width:100%}}