:root {
    --bg: #f7f8fb;
    --ink: #1c2430;
    --muted: #657386;
    --line: #d9e0ea;
    --panel: #fff;
    --accent: #1d65f2;
    --accent-dark: #154ebc;
    --danger: #a40022;
    --warn-bg: #fff8d6;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif; color: var(--ink); background: var(--bg); }
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
.topbar { display: flex; align-items: center; justify-content: space-between; padding: 1rem 2rem; background: #0f172a; color: #fff; }
.topbar a { color: #fff; margin-right: 1rem; }
.brand { font-weight: 700; font-size: 1.1rem; }
.container { width: min(1180px, calc(100% - 2rem)); margin: 2rem auto; }
.footer { padding: 2rem; color: var(--muted); text-align: center; }
.hero { background: var(--panel); border: 1px solid var(--line); border-radius: 16px; padding: 2rem; }
.hero h1 { margin-top: 0; font-size: clamp(2rem, 5vw, 3.25rem); }
.disclaimer { color: var(--muted); }
.actions, .actions-cell { display: flex; gap: .8rem; align-items: center; flex-wrap: wrap; }
.button, button { border: 1px solid var(--line); border-radius: 8px; padding: .65rem 1rem; background: #fff; color: var(--ink); cursor: pointer; font: inherit; display: inline-block; }
.button.primary, button.primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.button.primary:hover, button.primary:hover { background: var(--accent-dark); }
.link-button { background: transparent; border: 0; color: var(--accent); padding: 0; }
.topbar .link-button { color: #fff; }
.link-button.danger { color: var(--danger); }
.inline { display: inline; }
.panel, .cards article, .summary-grid div { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 1rem; margin: 1rem 0; }
.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; margin: 1rem 0; }
.summary-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1rem; }
label { display: block; margin: .75rem 0 .35rem; font-weight: 600; }
input { width: 100%; border: 1px solid var(--line); border-radius: 8px; padding: .55rem; font: inherit; }
input.coord { min-width: 150px; }
table { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--line); }
th, td { padding: .65rem; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
th { background: #eef2f7; font-weight: 700; }
.table-scroll { overflow-x: auto; margin: 1rem 0; }
.compact { font-size: .92rem; }
.warning-row { background: var(--warn-bg); }
.alert { border: 1px solid var(--line); border-radius: 8px; padding: .8rem 1rem; background: #eef5ff; margin: 1rem 0; }
.alert.error { background: #fff0f3; border-color: #ffc1ca; }
.alert.success { background: #effaf3; border-color: #b8e5c7; }
.alert.warning { background: #fff8d6; border-color: #efd476; }
.pill { display: inline-block; font-size: .78rem; border: 1px solid var(--line); border-radius: 999px; padding: .15rem .5rem; background: #fff; }
.pill.warn { background: #ffe8a3; }
.muted { color: var(--muted); }
.batch-grid, .station-search { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .75rem; align-items: end; }
.align-header { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; margin-bottom: 1rem; }
.alignment-workspace { display: grid; grid-template-columns: minmax(300px, 380px) 1fr; gap: 1rem; align-items: start; }
.alignment-sidebar { max-height: calc(100vh - 160px); overflow: auto; padding-right: .25rem; }
.alignment-map-panel { position: sticky; top: 1rem; }
#alignment-map { min-height: 720px; height: calc(100vh - 210px); width: 100%; border: 1px solid var(--line); border-radius: 14px; background: #d9e0ea; }
.map-help { margin-top: .5rem; color: var(--muted); font-size: .9rem; }
.compact-panel { padding: .85rem; }
.compact-panel h2 { margin-top: .2rem; font-size: 1.1rem; }
.mini-grid { display: grid; grid-template-columns: repeat(2, minmax(120px, 1fr)); gap: .6rem; }
.checkbox-row label { display: flex; align-items: flex-start; gap: .5rem; font-weight: 500; }
.checkbox-row input { width: auto; margin-top: .2rem; }
select { width: 100%; border: 1px solid var(--line); border-radius: 8px; padding: .55rem; font: inherit; background: #fff; }
.small { font-size: .86rem; }
.small-button { padding: .35rem .6rem; font-size: .86rem; }
.photo-preview-wrap { border: 1px solid var(--line); border-radius: 10px; padding: .5rem; background: #fff; margin: .75rem 0; }
#photo-preview { width: 100%; max-height: 260px; object-fit: contain; display: block; background: #f1f4f8; border-radius: 8px; }
.control-points-list { display: grid; gap: .5rem; margin-top: .75rem; }
.control-point-row { display: grid; grid-template-columns: 1fr auto; gap: .5rem; align-items: center; border: 1px solid var(--line); border-radius: 8px; padding: .5rem; background: #fff; }
@media (max-width: 980px) {
    .alignment-workspace { grid-template-columns: 1fr; }
    .alignment-sidebar { max-height: none; overflow: visible; }
    .alignment-map-panel { position: static; }
    #alignment-map { height: 560px; min-height: 480px; }
    .align-header { flex-direction: column; }
}
.hidden { display: none !important; }
.compact-header { margin-bottom: 1rem; }
.page-header h1 { margin-bottom: .35rem; }
.upload-panel { max-width: 820px; }
.hint { color: var(--muted); font-size: .92rem; margin-top: .4rem; }
.status-panel { max-width: 820px; }
.progress-bar { width: 100%; height: 12px; border-radius: 999px; background: #e8edf5; overflow: hidden; border: 1px solid var(--line); }
#progress-bar-fill { height: 100%; width: 0; background: var(--accent); transition: width .25s ease; }
.production-summary div strong { color: var(--muted); font-size: .86rem; text-transform: uppercase; letter-spacing: .04em; }
.production-summary div span { font-size: 1.25rem; font-weight: 700; }
.result-copy { font-size: 1.02rem; line-height: 1.55; }
.pricing-card { display: flex; flex-direction: column; gap: .8rem; }
.pricing-card .price { font-size: 2rem; font-weight: 800; margin: 0; }
.pricing-card .quota { font-weight: 700; }
.pricing-card.highlight { border-color: var(--accent); box-shadow: 0 0 0 1px rgba(29, 101, 242, .2); }
.plan-badge { display: inline-block; border-radius: 999px; padding: .2rem .6rem; background: #eef5ff; color: var(--accent); font-size: .82rem; font-weight: 700; }
textarea { width: 100%; border: 1px solid var(--line); border-radius: 8px; padding: .55rem; font: inherit; resize: vertical; }
pre { overflow-x: auto; background: #0f172a; color: #e5eefc; padding: 1rem; border-radius: 10px; line-height: 1.45; }
code { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; }
.inline-form { display: grid; grid-template-columns: 1fr auto; gap: .75rem; align-items: end; }
.inline-form label { grid-column: 1 / -1; margin-bottom: -.35rem; }
.data-table { margin-top: 1rem; }
.api-key-reveal { border-color: var(--accent); box-shadow: 0 0 0 1px rgba(29, 101, 242, .18); }
.api-docs h3 { margin-top: 1.6rem; }
.contact-panel { max-width: 760px; }
.field-validation-error { color: var(--danger); font-size: .9rem; }
@media (max-width: 720px) {
    .inline-form { grid-template-columns: 1fr; }
    .topbar { align-items: flex-start; gap: 1rem; flex-direction: column; }
}
.optional-upload { margin-top: 1rem; padding-top: .75rem; border-top: 1px solid var(--line); }
.upload-guidance { margin: 1rem 0; padding: .85rem 1rem; border: 1px solid var(--line); border-radius: 10px; background: #f8fbff; }
.upload-guidance h2 { margin: 0 0 .4rem; font-size: 1rem; }
.upload-guidance ul { margin: .25rem 0 0 1.1rem; padding: 0; color: var(--muted); }
.upload-guidance li { margin: .2rem 0; }
.api-hero { background: linear-gradient(180deg, #ffffff, #f4f8ff); }
.api-value-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; margin: 1rem 0; }
.api-value-grid article { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 1rem; }
.disabled-plan { opacity: .82; }
.disabled-plan .button.primary { background: #8a96a8; border-color: #8a96a8; cursor: not-allowed; }
.metric-list { display: grid; gap: .35rem; margin: .75rem 0; }
.metric-list span { color: var(--muted); }
.accuracy-note { border-left: 4px solid var(--accent); }
.auth-layout { display: grid; grid-template-columns: minmax(280px, 520px) minmax(220px, 1fr); gap: 1rem; align-items: start; }
.auth-panel { max-width: 540px; }
.auth-side h2 { margin-top: 0; }
.auth-check { margin: .85rem 0; }
.full-width { width: 100%; text-align: center; }
.account-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; }
.detail-list { display: grid; grid-template-columns: minmax(120px, 180px) 1fr; gap: .55rem 1rem; }
.detail-list dt { color: var(--muted); font-weight: 700; }
.detail-list dd { margin: 0; }
.accuracy-explainer { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; margin: 1rem 0; }
.accuracy-explainer h2 { margin-top: 0; }
.accuracy-box { border: 1px solid var(--line); border-radius: 10px; padding: .8rem; background: #f8fbff; }
.accuracy-box.subtle { background: #fff; }
.accuracy-box h3 { margin: 0 0 .4rem; font-size: .98rem; }
.accuracy-box p { margin: .35rem 0; }
@media (max-width: 780px) {
    .auth-layout { grid-template-columns: 1fr; }
}

/* Marketing refresh */
:root {
    --bg: #f5f7fb;
    --ink: #0c1727;
    --muted: #64748b;
    --line: #dbe4f0;
    --panel: #ffffff;
    --accent: #2563eb;
    --accent-dark: #1d4ed8;
    --accent-soft: #eaf1ff;
    --green: #13a167;
    --orange: #ff9f1c;
    --purple: #6d5dfc;
    --shadow: 0 18px 60px rgba(15, 23, 42, .10);
    --shadow-soft: 0 10px 30px rgba(15, 23, 42, .07);
}

body {
    background:
        radial-gradient(circle at top left, rgba(37, 99, 235, .12), transparent 32rem),
        radial-gradient(circle at top right, rgba(19, 161, 103, .10), transparent 28rem),
        var(--bg);
}

.topbar {
    position: sticky;
    top: 0;
    z-index: 20;
    background: rgba(255, 255, 255, .82);
    color: var(--ink);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border-bottom: 1px solid rgba(219, 228, 240, .9);
    box-shadow: 0 1px 0 rgba(15, 23, 42, .03);
}
.topbar a { color: var(--ink); font-weight: 650; margin-right: 1rem; }
.topbar a:hover { color: var(--accent); text-decoration: none; }
.topbar nav { display: flex; align-items: center; gap: .15rem; flex-wrap: wrap; }
.topbar .link-button { color: var(--ink); font-weight: 650; }
.topbar .link-button:hover { color: var(--accent); }
.brand { display: inline-flex; align-items: center; gap: .55rem; font-size: 1.18rem; letter-spacing: -.02em; }
.brand-mark {
    width: 2rem;
    height: 2rem;
    border-radius: .7rem;
    background: linear-gradient(135deg, var(--accent), #63d5ae);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 26px rgba(37, 99, 235, .28);
}
.container { width: min(1220px, calc(100% - 2rem)); margin: 1.35rem auto 2.5rem; }
.footer { color: #7a8798; font-size: .92rem; }

.button, button {
    border-radius: 999px;
    font-weight: 750;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease;
}
.button:hover, button:hover { transform: translateY(-1px); text-decoration: none; }
.button.primary, button.primary {
    background: linear-gradient(135deg, var(--accent), #4f8df7);
    border-color: transparent;
    box-shadow: 0 12px 28px rgba(37, 99, 235, .22);
}
.button.primary:hover, button.primary:hover { background: linear-gradient(135deg, var(--accent-dark), var(--accent)); }
.button.ghost {
    background: rgba(255,255,255,.74);
    border-color: rgba(37, 99, 235, .18);
    color: var(--accent-dark);
}
.button.large { padding: .9rem 1.25rem; font-size: 1rem; }
.hero-actions { display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; }

.home-hero {
    min-height: 620px;
    display: grid;
    grid-template-columns: minmax(0, 1.02fr) minmax(340px, .98fr);
    gap: 2rem;
    align-items: center;
    padding: clamp(2rem, 5vw, 4rem);
    border: 1px solid rgba(219, 228, 240, .9);
    border-radius: 34px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .96), rgba(248, 251, 255, .86)),
        radial-gradient(circle at 78% 10%, rgba(37, 99, 235, .18), transparent 28rem);
    box-shadow: var(--shadow);
    overflow: hidden;
    position: relative;
}
.home-hero:after {
    content: "";
    position: absolute;
    width: 24rem;
    height: 24rem;
    right: -10rem;
    bottom: -13rem;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(19, 161, 103, .16), transparent 68%);
    pointer-events: none;
}
.eyebrow, .mini-label {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    border-radius: 999px;
    padding: .4rem .7rem;
    background: rgba(37, 99, 235, .09);
    color: var(--accent-dark);
    font-weight: 850;
    font-size: .78rem;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.hero-copy h1, .pricing-hero h1 {
    margin: .9rem 0 1rem;
    font-size: clamp(2.5rem, 6vw, 5rem);
    line-height: .96;
    letter-spacing: -.06em;
    max-width: 13ch;
}
.pricing-hero h1 { max-width: 18ch; }
.lead {
    color: #475569;
    font-size: clamp(1.08rem, 2.2vw, 1.32rem);
    line-height: 1.55;
    max-width: 54rem;
}
.micro-proof {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    margin-top: 1.25rem;
}
.micro-proof span {
    padding: .48rem .7rem;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: rgba(255,255,255,.72);
    color: #475569;
    font-size: .92rem;
    font-weight: 700;
}

.hero-visual { position: relative; z-index: 1; }
.map-card {
    border: 1px solid rgba(219, 228, 240, .95);
    border-radius: 28px;
    overflow: hidden;
    background: rgba(255,255,255,.9);
    box-shadow: var(--shadow);
    transform: rotate(1.5deg);
}
.map-topbar {
    display: flex;
    gap: .45rem;
    padding: 1rem 1.15rem;
    border-bottom: 1px solid var(--line);
}
.map-topbar span { width: .7rem; height: .7rem; border-radius: 50%; background: #dbe4f0; }
.map-topbar span:first-child { background: #ff6b6b; }
.map-topbar span:nth-child(2) { background: #ffd166; }
.map-topbar span:nth-child(3) { background: #06d6a0; }
.map-stage {
    position: relative;
    min-height: 370px;
    background:
        linear-gradient(135deg, rgba(236, 244, 255, .75), rgba(229, 249, 241, .65)),
        radial-gradient(circle at 30% 40%, rgba(37,99,235,.16), transparent 12rem);
    overflow: hidden;
}
.grid-lines {
    position: absolute;
    inset: -20%;
    background-image:
        linear-gradient(rgba(15, 23, 42, .05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(15, 23, 42, .05) 1px, transparent 1px);
    background-size: 42px 42px;
    transform: rotate(-11deg);
}
.route {
    position: absolute;
    width: 68%;
    height: 9px;
    border-radius: 999px;
    left: 14%;
    transform-origin: left center;
}
.route-before { top: 48%; background: rgba(255, 159, 28, .72); transform: rotate(-12deg); box-shadow: 0 0 0 8px rgba(255,159,28,.09); }
.route-after { top: 57%; background: rgba(19, 161, 103, .82); transform: rotate(-12deg); box-shadow: 0 0 0 8px rgba(19,161,103,.09); }
.pin {
    position: absolute;
    width: 1.05rem;
    height: 1.05rem;
    border-radius: 50%;
    border: 4px solid #fff;
    background: var(--accent);
    box-shadow: 0 10px 22px rgba(15,23,42,.16);
}
.pin-a { left: 25%; top: 50%; }
.pin-b { left: 52%; top: 43%; background: var(--orange); }
.pin-c { left: 70%; top: 58%; background: var(--green); }
.result-card.mini {
    margin: -3.6rem 1.25rem 1.25rem auto;
    width: min(310px, calc(100% - 2.5rem));
    position: relative;
    z-index: 3;
    display: grid;
    gap: .35rem;
    padding: 1rem;
    border-radius: 18px;
    background: rgba(255,255,255,.92);
    border: 1px solid rgba(219, 228, 240, .95);
    box-shadow: var(--shadow-soft);
    transform: rotate(-1.5deg);
}
.result-card.mini span { color: var(--muted); font-weight: 650; }

.workflow-band {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin: 1.2rem 0;
}
.workflow-band article,
.marketing-panel,
.split-section,
.accuracy-preview,
.accuracy-duo article,
.plan-card-v2 {
    background: rgba(255,255,255,.88);
    border: 1px solid rgba(219, 228, 240, .95);
    box-shadow: var(--shadow-soft);
}
.workflow-band article {
    border-radius: 24px;
    padding: 1.4rem;
}
.step-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.15rem;
    height: 2.15rem;
    border-radius: .75rem;
    color: #fff;
    background: linear-gradient(135deg, var(--accent), #63d5ae);
    font-weight: 900;
}
.workflow-band h2 { margin: .9rem 0 .4rem; font-size: 1.2rem; letter-spacing: -.02em; }
.workflow-band p, .split-section p, .accuracy-preview p, .pricing-note p { color: var(--muted); line-height: 1.55; }

.split-section {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, .9fr);
    gap: 2rem;
    align-items: center;
    border-radius: 30px;
    padding: clamp(1.5rem, 4vw, 3rem);
    margin: 1.2rem 0;
}
.split-section h2,
.section-heading h2,
.pricing-note h2 {
    margin: .7rem 0 1rem;
    font-size: clamp(2rem, 4vw, 3.4rem);
    letter-spacing: -.045em;
    line-height: 1.02;
}
.compact-actions { margin-top: 1.3rem; }
.benefit-list { display: grid; gap: .85rem; }
.benefit-list div {
    display: grid;
    gap: .2rem;
    padding: 1rem;
    border-radius: 18px;
    background: #f8fbff;
    border: 1px solid var(--line);
}
.benefit-list span { color: var(--muted); }

.accuracy-preview {
    border-radius: 30px;
    padding: clamp(1.5rem, 4vw, 3rem);
    margin: 1.2rem 0;
}
.centered { text-align: center; display: grid; justify-items: center; }
.centered-text { text-align: center; }
.accuracy-tiles {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    margin-top: 1.5rem;
}
.accuracy-tiles article {
    min-height: 170px;
    border-radius: 24px;
    padding: 1.25rem;
    background: linear-gradient(180deg, #fff, #f8fbff);
    border: 1px solid var(--line);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.accuracy-tiles span { color: var(--muted); font-weight: 850; text-transform: uppercase; font-size: .82rem; letter-spacing: .04em; }
.accuracy-tiles strong { font-size: clamp(2rem, 4vw, 3rem); letter-spacing: -.05em; color: var(--accent-dark); }
.accuracy-tiles p { margin: 0; }
.featured-tile { box-shadow: 0 18px 50px rgba(37,99,235,.16); border-color: rgba(37,99,235,.35) !important; }
.fine-print { color: var(--muted); font-size: .93rem; }

.pricing-hero {
    border-radius: 34px;
    padding: clamp(2rem, 5vw, 3.6rem);
    margin-bottom: 1rem;
    background:
        linear-gradient(135deg, rgba(255,255,255,.96), rgba(243,248,255,.92)),
        radial-gradient(circle at 78% 10%, rgba(37,99,235,.15), transparent 30rem);
}
.pricing-hero .lead { max-width: 44rem; }
.accuracy-duo {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin: 1rem 0;
}
.accuracy-duo article {
    border-radius: 24px;
    padding: 1.35rem;
}
.accuracy-duo h2 { margin: .65rem 0 .4rem; font-size: 1.35rem; letter-spacing: -.02em; }
.accuracy-duo p { color: var(--muted); margin: 0; line-height: 1.55; }

.pricing-grid-v2 {
    display: grid;
    grid-template-columns: repeat(5, minmax(220px, 1fr));
    gap: 1rem;
    align-items: stretch;
    margin: 1rem 0;
}
.plan-card-v2 {
    border-radius: 26px;
    padding: 1.3rem;
    display: flex;
    flex-direction: column;
    gap: .9rem;
    position: relative;
    overflow: hidden;
}
.plan-card-v2:before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 5px;
    background: linear-gradient(90deg, var(--accent), #63d5ae);
    opacity: .78;
}
.plan-card-v2 h2 { margin: .25rem 0 0; font-size: 1.45rem; letter-spacing: -.03em; }
.plan-topline { min-height: 1.75rem; display: flex; gap: .4rem; align-items: center; flex-wrap: wrap; }
.plan-chip, .popular-chip, .coming-chip {
    display: inline-flex;
    width: fit-content;
    padding: .32rem .62rem;
    border-radius: 999px;
    font-size: .76rem;
    font-weight: 850;
    letter-spacing: .02em;
}
.plan-chip { background: var(--accent-soft); color: var(--accent-dark); }
.popular-chip { background: #ecfdf5; color: #047857; }
.coming-chip { background: #fff7ed; color: #c2410c; }
.plan-price { margin: 0; font-size: 2.55rem; font-weight: 950; letter-spacing: -.06em; }
.plan-price span { font-size: .98rem; color: var(--muted); letter-spacing: 0; font-weight: 750; margin-left: .15rem; }
.plan-subtitle { color: var(--muted); line-height: 1.45; min-height: 3.9rem; }
.plan-metrics {
    display: grid;
    gap: .55rem;
    margin: .15rem 0;
}
.plan-metrics div {
    display: grid;
    gap: .12rem;
    padding: .75rem;
    border-radius: 16px;
    background: #f8fbff;
    border: 1px solid rgba(219,228,240,.95);
}
.plan-metrics span { color: var(--muted); font-weight: 800; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; }
.plan-metrics strong { font-size: 1.02rem; }
.clean-list {
    padding: 0;
    margin: .25rem 0 .25rem;
    list-style: none;
    display: grid;
    gap: .55rem;
}
.clean-list li {
    position: relative;
    padding-left: 1.45rem;
    color: #334155;
    line-height: 1.35;
}
.clean-list li:before {
    content: "✓";
    position: absolute;
    left: 0;
    top: -.03rem;
    color: var(--green);
    font-weight: 950;
}
.plan-card-v2 .button { margin-top: auto; }
.popular-plan {
    transform: translateY(-6px);
    border-color: rgba(37, 99, 235, .45) !important;
    box-shadow: 0 24px 70px rgba(37,99,235,.18) !important;
}
.popular-plan:before { height: 7px; opacity: 1; }
.disabled-plan { opacity: .72; filter: grayscale(.08); }
.plan-note, .usage-line { color: var(--muted); font-size: .92rem; margin: 0; }
.enterprise-plan:before { background: linear-gradient(90deg, #111827, #6d5dfc); }
.compact-marketing-panel { border-radius: 26px; padding: 1.5rem; }
.note-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}
.note-grid p {
    margin: 0;
    padding: 1rem;
    border-radius: 18px;
    border: 1px solid var(--line);
    background: #f8fbff;
}

@media (max-width: 1180px) {
    .pricing-grid-v2 { grid-template-columns: repeat(2, minmax(260px, 1fr)); }
    .plan-card-v2.popular-plan { transform: none; }
}
@media (max-width: 960px) {
    .home-hero, .split-section { grid-template-columns: 1fr; }
    .home-hero { min-height: auto; }
    .hero-copy h1, .pricing-hero h1 { max-width: 100%; }
    .workflow-band, .accuracy-tiles, .note-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
    .topbar { align-items: stretch; }
    .topbar nav { gap: .45rem; }
    .topbar a { margin-right: .4rem; }
    .home-hero, .pricing-hero, .split-section, .accuracy-preview { border-radius: 24px; padding: 1.35rem; }
    .workflow-band, .accuracy-tiles, .accuracy-duo, .pricing-grid-v2, .note-grid { grid-template-columns: 1fr; }
    .map-stage { min-height: 300px; }
    .plan-subtitle { min-height: 0; }
}

/* Upload workspace refresh */
.upload-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(280px, .75fr);
    gap: 1.5rem;
    align-items: stretch;
    margin-bottom: 1.5rem;
}
.upload-hero .hero-copy,
.upload-hero-card {
    border-radius: 30px;
    padding: 2rem;
    background: linear-gradient(135deg, #f8fbff 0%, #ffffff 56%, #eef6ff 100%);
    border: 1px solid rgba(219,228,240,.92);
    box-shadow: 0 20px 55px rgba(15,23,42,.06);
}
.upload-hero .hero-copy h1 {
    margin: .4rem 0 .85rem;
    font-size: clamp(2.25rem, 4vw, 4rem);
    line-height: .96;
    letter-spacing: -.07em;
}
.upload-hero .hero-copy p { max-width: 680px; color: var(--muted); font-size: 1.08rem; line-height: 1.55; }
.upload-hero-card {
    display: grid;
    align-content: center;
    gap: 1rem;
    background: #0f172a;
    color: #fff;
}
.upload-hero-card p { color: rgba(255,255,255,.72); margin: 0; line-height: 1.5; }
.upload-hero-card strong { font-size: 2rem; letter-spacing: -.05em; }
.upload-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 1.4rem;
    align-items: start;
}
.upload-main-card,
.optional-context-card,
.upload-status-card,
.results-card {
    border-radius: 28px;
    padding: 1.35rem;
    background: #fff;
    border: 1px solid rgba(219,228,240,.95);
    box-shadow: 0 18px 50px rgba(15,23,42,.055);
}
.upload-step-heading {
    display: flex;
    align-items: flex-start;
    gap: .85rem;
    margin-bottom: 1.05rem;
}
.upload-step-heading h2,
.upload-step-heading h3 { margin: 0; letter-spacing: -.035em; }
.upload-step-heading p { margin: .25rem 0 0; color: var(--muted); }
.step-number {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--accent);
    color: #fff;
    font-weight: 900;
    box-shadow: 0 10px 24px rgba(37,99,235,.22);
}
.upload-drop-area {
    border: 1.5px dashed rgba(37,99,235,.34);
    border-radius: 24px;
    padding: 1.35rem;
    background: linear-gradient(180deg,#f8fbff,#ffffff);
}
.upload-drop-area input[type="file"] { width: 100%; }
.file-selection-summary,
.file-summary {
    margin: .75rem 0 0;
    color: var(--muted);
    font-weight: 700;
}
.image-preview-panel {
    margin-top: 1rem;
    border-radius: 22px;
    border: 1px solid rgba(219,228,240,.95);
    background: #f8fbff;
    overflow: hidden;
}
.preview-header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .85rem 1rem;
    border-bottom: 1px solid rgba(219,228,240,.95);
    color: var(--muted);
    font-weight: 800;
}
.image-preview-list {
    max-height: 315px;
    overflow: auto;
    padding: .9rem;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
    gap: .75rem;
}
.image-preview-item,
.image-preview-more {
    min-height: 118px;
    border-radius: 16px;
    background: #fff;
    border: 1px solid rgba(219,228,240,.95);
    overflow: hidden;
    display: grid;
    grid-template-rows: 80px auto;
    box-shadow: 0 10px 22px rgba(15,23,42,.04);
}
.image-preview-item img { width: 100%; height: 80px; object-fit: cover; display: block; }
.image-preview-item span {
    padding: .48rem .55rem;
    font-size: .75rem;
    color: #475569;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.image-preview-more {
    place-items: center;
    grid-template-rows: 1fr;
    color: var(--muted);
    font-weight: 850;
}
.optional-context-card { margin-top: 1.2rem; }
.upload-disclosure {
    border: 1px solid rgba(219,228,240,.95);
    border-radius: 20px;
    margin-top: .8rem;
    overflow: hidden;
    background: #fbfdff;
}
.upload-disclosure summary {
    cursor: pointer;
    padding: 1rem 1.05rem;
    font-weight: 900;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.upload-disclosure summary::after { content: "+"; color: var(--accent); font-size: 1.25rem; }
.upload-disclosure[open] summary::after { content: "–"; }
.disclosure-body {
    padding: 0 1.05rem 1.05rem;
    color: #475569;
}
.mini-guide {
    margin: .85rem 0;
    padding: .95rem;
    border-radius: 16px;
    background: #eef6ff;
    border: 1px solid rgba(191,219,254,.9);
}
.mini-guide p,
.mini-guide ol { margin: .35rem 0; }
.mini-guide ol { padding-left: 1.15rem; }
.upload-status-card { position: sticky; top: 1rem; }
.stage-list {
    list-style: none;
    padding: 0;
    margin: 1rem 0;
    display: grid;
    gap: .55rem;
}
.stage-list li {
    display: flex;
    gap: .6rem;
    align-items: center;
    color: var(--muted);
    font-weight: 800;
}
.stage-list li::before {
    content: "";
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #cbd5e1;
    box-shadow: inset 0 0 0 2px #e2e8f0;
}
.stage-list li.active { color: var(--accent-dark); }
.stage-list li.active::before { background: var(--accent); box-shadow: 0 0 0 4px rgba(37,99,235,.13); }
.stage-list li.complete { color: #047857; }
.stage-list li.complete::before { background: var(--green); box-shadow: 0 0 0 4px rgba(16,185,129,.12); }
.progress-shell {
    height: 12px;
    background: #e8eef6;
    border-radius: 999px;
    overflow: hidden;
    margin: .85rem 0;
}
.progress-fill { height: 100%; width: 0; background: linear-gradient(90deg,var(--accent),#14b8a6); transition: width .25s ease; }
.results-card { margin-top: 1rem; }
.result-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
    margin: 1rem 0;
}
.result-grid div {
    border-radius: 16px;
    padding: .85rem;
    background: #f8fbff;
    border: 1px solid rgba(219,228,240,.95);
}
.result-grid span { display: block; color: var(--muted); font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; font-weight: 850; }
.result-grid strong { display: block; margin-top: .2rem; font-size: 1.05rem; }
.result-summary {
    margin-top: .8rem;
    padding: .95rem;
    border-radius: 18px;
    background: #f8fbff;
    border: 1px solid rgba(219,228,240,.95);
    color: #334155;
    line-height: 1.45;
}
.button.large { padding: .95rem 1.25rem; font-size: 1.02rem; }
.hidden { display: none !important; }
@media (max-width: 1040px) {
    .upload-hero,
    .upload-workspace { grid-template-columns: 1fr; }
    .upload-status-card { position: static; }
}
@media (max-width: 640px) {
    .upload-hero .hero-copy,
    .upload-hero-card,
    .upload-main-card,
    .optional-context-card,
    .upload-status-card,
    .results-card { padding: 1.05rem; border-radius: 22px; }
    .result-grid { grid-template-columns: 1fr; }
    .image-preview-list { grid-template-columns: repeat(auto-fill, minmax(94px, 1fr)); max-height: 250px; }
}

/* Known point location workflow */
.known-point-grid {
    display: grid;
    grid-template-columns: minmax(240px, .82fr) minmax(0, 1.18fr);
    gap: 1rem;
    align-items: start;
}
.known-point-actions {
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
    margin-bottom: .75rem;
}
.button.small {
    padding: .55rem .78rem;
    font-size: .88rem;
}
.button.ghost {
    background: #fff;
    color: #334155;
    border: 1px solid rgba(203,213,225,.9);
}
.known-point-list {
    display: grid;
    gap: .75rem;
    max-height: 520px;
    overflow: auto;
    padding-right: .25rem;
}
.known-point-card {
    border: 1px solid rgba(219,228,240,.95);
    background: #fff;
    border-radius: 18px;
    padding: .8rem;
    box-shadow: 0 10px 22px rgba(15,23,42,.035);
}
.known-point-card.active {
    border-color: rgba(37,99,235,.42);
    box-shadow: 0 0 0 4px rgba(37,99,235,.08), 0 10px 22px rgba(15,23,42,.035);
}
.known-point-card-header {
    display: flex;
    justify-content: space-between;
    gap: .65rem;
    align-items: center;
    margin-bottom: .5rem;
}
.link-button {
    border: 0;
    padding: 0;
    background: transparent;
    color: var(--accent);
    cursor: pointer;
    font-weight: 850;
}
.link-button.danger { color: #b91c1c; }
.known-point-card label {
    display: grid;
    gap: .3rem;
    margin: .45rem 0;
    font-size: .84rem;
    color: #475569;
    font-weight: 850;
}
.known-point-card input,
.known-point-picker select {
    width: 100%;
}
.known-point-latlon {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .55rem;
}
.known-point-observations {
    margin-top: .65rem;
    padding: .65rem;
    border-radius: 14px;
    background: #f8fbff;
    border: 1px solid rgba(219,228,240,.95);
}
.known-observation-list {
    list-style: none;
    padding: 0;
    margin: .35rem 0 0;
    display: grid;
    gap: .35rem;
}
.known-observation-list li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .55rem;
    font-size: .82rem;
}
.known-observation-list span {
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.known-point-picker label {
    display: block;
    margin-bottom: .4rem;
    color: #475569;
    font-weight: 850;
}
.known-point-photo-box {
    position: relative;
    margin-top: .65rem;
    min-height: 260px;
    max-height: 520px;
    overflow: auto;
    border-radius: 20px;
    background: #0f172a;
    border: 1px solid rgba(15,23,42,.2);
    display: grid;
    place-items: center;
}
.known-point-photo-box img {
    max-width: 100%;
    max-height: 500px;
    object-fit: contain;
    cursor: crosshair;
    display: block;
}
.known-point-empty {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 1rem;
    text-align: center;
    color: rgba(255,255,255,.82);
    background: linear-gradient(135deg, rgba(15,23,42,.88), rgba(30,41,59,.88));
}
.compact-copy {
    margin: .35rem 0;
    line-height: 1.45;
}
@media (max-width: 840px) {
    .known-point-grid { grid-template-columns: 1fr; }
    .known-point-latlon { grid-template-columns: 1fr; }
}

.known-point-photo-marker {
    position: absolute;
    width: 18px;
    height: 18px;
    border-radius: 999px;
    border: 3px solid #ffffff;
    background: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.32), 0 10px 24px rgba(15, 23, 42, 0.28);
    transform: translate(-50%, -50%);
    pointer-events: none;
    z-index: 4;
}

/* Upload page simplification and optional context layout fix */
.simple-upload-hero,
.upload-hero.simple-upload-hero {
    display: block;
    max-width: 1040px;
}
.simple-upload-hero .hero-copy {
    width: 100%;
}
.upload-workspace {
    grid-template-columns: minmax(0, 1040px);
    justify-content: start;
    max-width: 1040px;
}
.optional-context-card,
.upload-status-card,
.upload-main-card {
    grid-column: 1 / -1;
}
.optional-context-card {
    margin-top: 0;
}
.upload-status-card {
    position: static;
}
.optional-heading {
    align-items: center;
}
.optional-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 78px;
    height: 34px;
    padding: 0 .85rem;
    border-radius: 999px;
    background: #eef6ff;
    color: var(--accent);
    font-weight: 900;
    letter-spacing: .02em;
    text-transform: uppercase;
    font-size: .76rem;
}
.upload-disclosure summary {
    gap: 1rem;
}
.upload-disclosure summary span,
.upload-disclosure summary small {
    min-width: 0;
}
.upload-disclosure summary small {
    color: var(--muted);
    font-weight: 800;
    text-align: right;
}
.known-point-grid {
    grid-template-columns: minmax(280px, .62fr) minmax(420px, 1.38fr);
}
.known-point-photo-box {
    min-height: 360px;
}
.known-point-photo-box img {
    max-height: 680px;
}
.status-panel {
    max-width: 1040px;
}
.results-card {
    max-width: 1040px;
}
@media (max-width: 960px) {
    .known-point-grid { grid-template-columns: 1fr; }
    .upload-disclosure summary { align-items: flex-start; }
    .upload-disclosure summary small { text-align: left; }
}
@media (max-width: 640px) {
    .optional-heading { align-items: flex-start; }
    .upload-disclosure summary { display: grid; grid-template-columns: 1fr auto; }
    .upload-disclosure summary small { grid-column: 1 / -1; }
    .known-point-photo-box { min-height: 260px; }
}


/* Upload page simplification: keep optional context full-width and readable. */
.simple-upload-hero {
    display: block;
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
}
.simple-upload-hero .hero-copy {
    width: 100%;
}
.upload-workspace {
    grid-template-columns: 1fr !important;
    max-width: 980px;
    margin: 0 auto;
}
.optional-context-card {
    margin-top: 0;
}
.optional-heading {
    margin-bottom: 1rem;
}
.optional-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;
    border-radius: 999px;
    padding: .45rem .75rem;
    background: #eef4ff;
    color: #1d4ed8;
    font-weight: 900;
    font-size: .78rem;
    letter-spacing: .04em;
    text-transform: uppercase;
    white-space: nowrap;
}
.optional-context-card .upload-disclosure summary {
    gap: 1rem;
}
.optional-context-card .upload-disclosure summary span,
.optional-context-card .upload-disclosure summary small {
    min-width: 0;
}
.known-point-grid {
    grid-template-columns: minmax(260px, .9fr) minmax(0, 1.35fr);
}
.upload-status-card {
    position: static;
}
.status-panel,
.results-card {
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
}
@media (max-width: 900px) {
    .known-point-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .optional-context-card .upload-disclosure summary {
        align-items: flex-start;
        flex-direction: column;
    }
}


/* Simple upload layout fix */
.simple-upload-hero {
    display: block;
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
}
.simple-upload-hero .hero-copy {
    width: 100%;
}
.upload-workspace,
.status-panel,
.results-card {
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
}
.upload-workspace {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.15rem;
}
.optional-context-card,
.upload-status-card {
    margin-top: 0;
    position: static;
}
.optional-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: .42rem .75rem;
    border-radius: 999px;
    background: #eef6ff;
    color: var(--accent-dark);
    font-weight: 900;
    font-size: .78rem;
    letter-spacing: .05em;
    text-transform: uppercase;
    white-space: nowrap;
}
.upload-disclosure summary {
    gap: 1rem;
}
.upload-disclosure summary small {
    text-align: right;
    color: var(--muted);
    font-weight: 800;
}
.known-point-grid {
    grid-template-columns: minmax(260px, 360px) minmax(0, 1fr);
}
.known-point-picker {
    min-width: 0;
}
.known-point-photo-box {
    min-height: 320px;
    max-height: 620px;
}
.known-point-photo-box img {
    max-height: 600px;
}
@media (max-width: 900px) {
    .known-point-grid { grid-template-columns: 1fr; }
    .upload-disclosure summary { align-items: flex-start; }
    .upload-disclosure summary small { text-align: left; }
}

/* Processing state */
.upload-workspace.is-processing {
    cursor: progress;
}
.upload-workspace.is-processing input,
.upload-workspace.is-processing select,
.upload-workspace.is-processing button:not(#download-again-button) {
    cursor: progress;
}
.button[disabled],
button[disabled],
input[disabled],
select[disabled] {
    opacity: .58;
    cursor: not-allowed !important;
}
#start-correction-button[aria-busy="true"] {
    position: relative;
    padding-right: 3rem;
}
#start-correction-button[aria-busy="true"]::after {
    content: "";
    position: absolute;
    width: 1rem;
    height: 1rem;
    right: 1.1rem;
    top: 50%;
    margin-top: -.5rem;
    border: 2px solid rgba(255,255,255,.55);
    border-top-color: #fff;
    border-radius: 999px;
    animation: aerialalign-spin .75s linear infinite;
}
@keyframes aerialalign-spin {
    to { transform: rotate(360deg); }
}

/* Known point zoom and precise placement */
.known-point-picker-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    margin-bottom: .45rem;
}
.known-point-zoom-controls {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.button.tiny {
    min-height: 0;
    padding: .32rem .55rem;
    border-radius: 999px;
    font-size: .78rem;
    line-height: 1;
}
.zoom-label {
    min-width: 44px;
    color: var(--muted);
    font-size: .78rem;
    font-weight: 850;
    text-align: right;
}
.known-point-photo-box {
    display: block !important;
    place-items: unset !important;
    overflow: auto;
    cursor: grab;
}
.known-point-photo-box:active {
    cursor: grabbing;
}
.known-point-image-stage {
    position: relative;
    display: block;
    width: 100%;
    min-width: 100%;
    line-height: 0;
    margin: 0 auto;
}
.known-point-image-stage img,
.known-point-photo-box img#known-point-image {
    display: block;
    width: 100% !important;
    height: auto !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: contain;
    cursor: crosshair;
    user-select: none;
}
.known-point-photo-marker {
    position: absolute;
    z-index: 6;
}
@media (max-width: 640px) {
    .known-point-picker-head {
        align-items: flex-start;
        flex-direction: column;
    }
    .known-point-zoom-controls {
        justify-content: flex-start;
    }
}

/* Known point image zoom and precise click placement */
.known-point-picker-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: .45rem;
}
.known-point-zoom-controls {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    flex-wrap: wrap;
}
.button.tiny {
    padding: .35rem .55rem;
    font-size: .78rem;
    min-height: 30px;
}
.zoom-label {
    min-width: 46px;
    text-align: right;
    color: var(--muted);
    font-weight: 900;
    font-size: .82rem;
}
.known-point-photo-box {
    display: block;
    place-items: initial;
    overflow: auto;
    cursor: crosshair;
    overscroll-behavior: contain;
}
.known-point-image-stage {
    position: relative;
    display: block;
    width: 100%;
    min-width: 100%;
    margin: 0 auto;
    line-height: 0;
}
.known-point-image-stage img,
.known-point-photo-box img {
    width: 100%;
    max-width: none;
    max-height: none;
    height: auto;
    object-fit: contain;
    display: block;
    cursor: crosshair;
    user-select: none;
}
.known-point-photo-marker {
    position: absolute;
}
.known-point-photo-box:focus-within,
.known-point-photo-box:hover {
    border-color: rgba(37, 99, 235, .48);
}
@media (max-width: 640px) {
    .known-point-picker-head {
        align-items: flex-start;
        flex-direction: column;
    }
    .known-point-zoom-controls {
        width: 100%;
        justify-content: flex-start;
    }
}


/* Pricing list cleanup: use simple dots instead of heavy check marks. */
.clean-list li {
    padding-left: 1rem;
}
.clean-list li:before {
    content: "";
    width: .38rem;
    height: .38rem;
    top: .48rem;
    border-radius: 999px;
    background: #2563eb;
}

.upgrade-hint {
    margin-top: .75rem;
    padding: .85rem 1rem;
    border-radius: 16px;
    background: #f8fbff;
    border: 1px solid rgba(37, 99, 235, .18);
    color: #334155;
}
.upgrade-hint a { font-weight: 900; }
.result-next-steps { margin-top: 1rem; }
.next-step-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding: 1rem;
    border-radius: 18px;
    background: #f8fbff;
    border: 1px solid rgba(37, 99, 235, .18);
}
.next-step-card p { margin: 0; color: #334155; }
.known-point-estimate {
    margin: .65rem 0;
    padding: .7rem .8rem;
    border-radius: 14px;
    background: #f8fafc;
    border: 1px solid #dbe4f0;
}
.known-point-estimate p { margin: 0 0 .5rem; color: #475569; font-size: .86rem; line-height: 1.35; }
.known-point-estimate.needs-confirmation {
    background: #fff7ed;
    border-color: #fed7aa;
}
.known-point-photo-box {
    height: 520px !important;
    min-height: 520px !important;
    max-height: 520px !important;
    overflow: auto !important;
    cursor: grab !important;
    resize: vertical;
}
.known-point-photo-box.is-dragging { cursor: grabbing !important; }
.known-point-image-stage img,
.known-point-photo-box img#known-point-image { cursor: inherit !important; }
.known-point-image-stage {
    transform-origin: top left;
}
@media (max-width: 700px) {
    .known-point-photo-box {
        height: 360px !important;
        min-height: 360px !important;
        max-height: 420px !important;
    }
    .next-step-card { align-items: flex-start; }
}

/* Known point pan fix: make drag-panning reliable and prevent browser image drag/selection. */
.known-point-photo-box {
    touch-action: none !important;
    user-select: none !important;
    -webkit-user-select: none !important;
}
.known-point-image-stage,
.known-point-image-stage img,
.known-point-photo-box img#known-point-image {
    user-select: none !important;
    -webkit-user-select: none !important;
    -webkit-user-drag: none !important;
}
.known-point-photo-box.is-dragging,
.known-point-photo-box.is-dragging * {
    cursor: grabbing !important;
}

/* Known point viewer: reliable zoom + drag-to-pan. */
.known-point-photo-box {
    touch-action: none !important;
    user-select: none !important;
    -webkit-user-select: none !important;
    overscroll-behavior: contain !important;
    cursor: grab !important;
}
.known-point-photo-box.is-dragging {
    cursor: grabbing !important;
}
.known-point-image-stage img,
.known-point-photo-box img#known-point-image {
    -webkit-user-drag: none !important;
    user-select: none !important;
    pointer-events: auto !important;
}

/* Site and photo fit preview */
.site-lookup {
    margin: 1.25rem 0 2rem;
}
.site-preview-panel {
    display: grid;
    grid-template-columns: minmax(285px, .78fr) minmax(0, 1.22fr);
    gap: clamp(1.25rem, 3.5vw, 2.35rem);
    align-items: stretch;
    border-radius: 36px;
    padding: clamp(1.45rem, 4vw, 3.25rem);
    background:
        radial-gradient(circle at 86% 12%, rgba(37,99,235,.12), transparent 25rem),
        radial-gradient(circle at 12% 92%, rgba(19,161,103,.11), transparent 23rem),
        linear-gradient(135deg, rgba(255,255,255,.97), rgba(248,251,255,.88));
    border: 1px solid rgba(219, 228, 240, .96);
    box-shadow: var(--shadow-soft);
    position: relative;
    overflow: hidden;
}
.site-preview-panel::before {
    content: "";
    position: absolute;
    inset: 1rem;
    border-radius: 30px;
    background-image:
        linear-gradient(rgba(37,99,235,.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(37,99,235,.035) 1px, transparent 1px);
    background-size: 34px 34px;
    mask-image: linear-gradient(110deg, transparent, black 35%, transparent 82%);
    pointer-events: none;
}
.site-preview-copy,
.site-preview-tool,
.site-lookup-result { position: relative; z-index: 1; }
.site-preview-copy {
    align-self: center;
}
.site-preview-copy h2 {
    margin: .75rem 0 1rem;
    font-size: clamp(2.45rem, 5vw, 4.3rem);
    letter-spacing: -.065em;
    line-height: .95;
    max-width: 10.5ch;
}
.site-preview-copy p {
    color: #526174;
    line-height: 1.58;
    max-width: 33rem;
    font-size: 1.02rem;
}
.preview-mini-points {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-top: 1.15rem;
}
.preview-mini-points span {
    border-radius: 999px;
    padding: .48rem .72rem;
    background: rgba(255,255,255,.78);
    border: 1px solid rgba(219,228,240,.96);
    color: #475569;
    font-weight: 800;
    font-size: .9rem;
}
.site-preview-tool {
    align-self: center;
}
.site-lookup-form {
    display: grid;
    gap: 1rem;
    padding: clamp(1rem, 2.3vw, 1.35rem);
    border: 1px solid rgba(219, 228, 240, .96);
    border-radius: 30px;
    background: rgba(255,255,255,.86);
    box-shadow: 0 22px 60px rgba(15, 23, 42, .075);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}
.site-form-grid {
    display: grid;
    grid-template-columns: minmax(220px, 1.35fr) minmax(120px, .62fr);
    gap: .9rem;
}
.site-form-field,
.site-lookup-form .site-form-field {
    display: flex;
    flex-direction: column;
    gap: .42rem;
    margin: 0;
    color: #0f172a;
    font-weight: 900;
}
.site-form-field input[type="text"],
.site-form-field input[type="number"] {
    width: 100%;
    border: 1px solid #dbe4f0;
    border-radius: 17px;
    padding: .98rem 1.05rem;
    font: inherit;
    background: #fff;
    color: #0f172a;
    box-shadow: inset 0 1px 0 rgba(15,23,42,.02);
}
.site-form-field input:focus,
.sample-photo-drop:focus-within {
    outline: none;
    border-color: rgba(37,99,235,.58);
    box-shadow: 0 0 0 4px rgba(37,99,235,.10);
}
.preview-card-grid {
    display: grid;
    grid-template-columns: minmax(190px, .72fr) minmax(260px, 1.28fr);
    gap: .9rem;
    align-items: stretch;
}
.site-lookup-form .checkbox-label.preview-toggle-tile {
    margin: 0;
    height: 100%;
    display: flex;
    align-items: center;
    gap: .8rem;
    padding: 1rem;
    border: 1px solid #dbe4f0;
    border-radius: 22px;
    background: linear-gradient(180deg,#f8fbff,#fff);
    color: #0f172a;
    font-weight: 900;
}
.preview-toggle-tile input {
    width: 1.05rem;
    height: 1.05rem;
    flex: 0 0 auto;
    accent-color: var(--accent);
}
.preview-toggle-tile span {
    display: grid;
    gap: .2rem;
}
.preview-toggle-tile small,
.sample-photo-head span,
.sample-photo-drop small,
.photo-metadata-result span {
    color: #64748b;
    font-weight: 700;
}
.sample-photo-card {
    border: 1px solid rgba(219,228,240,.96);
    border-radius: 22px;
    background: linear-gradient(180deg,#ffffff,#f8fbff);
    padding: .95rem;
    display: grid;
    gap: .8rem;
}
.sample-photo-head,
.photo-fit-head,
.preview-submit-row,
.site-result-head,
.site-plan-title {
    display: flex;
    justify-content: space-between;
    gap: .85rem;
    align-items: flex-start;
}
.sample-photo-head strong,
.photo-fit-head strong { display: block; color: #0f172a; }
.sample-photo-head span,
.photo-fit-head span { display: block; margin-top: .15rem; }
.local-badge,
.photo-fit-pill {
    flex: 0 0 auto;
    border-radius: 999px;
    padding: .32rem .55rem;
    background: #ecfdf5;
    color: #047857;
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .02em;
}
.sample-photo-drop {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: .85rem;
    align-items: center;
    margin: 0;
    cursor: pointer;
    border-radius: 18px;
    border: 1.5px dashed rgba(37,99,235,.35);
    background: rgba(239,246,255,.72);
    padding: .9rem;
    transition: border-color .15s ease, transform .15s ease, background .15s ease;
}
.sample-photo-drop:hover {
    border-color: rgba(37,99,235,.62);
    background: #eff6ff;
    transform: translateY(-1px);
}
.sample-photo-drop input { display: none; }
.sample-photo-drop strong,
.sample-photo-drop small { display: block; }
.sample-icon {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg,var(--accent),#4f8df7);
    color: #fff;
    font-size: 1.25rem;
    font-weight: 900;
    box-shadow: 0 12px 24px rgba(37,99,235,.22);
}
.photo-metadata-result {
    border-radius: 18px;
    border: 1px solid #e2e8f0;
    background: #fff;
    padding: .9rem;
    display: grid;
    gap: .8rem;
}
.photo-metadata-result.empty,
.photo-metadata-result.loading {
    color: #64748b;
    background: #f8fafc;
}
.photo-metadata-result.strong { border-color: rgba(19,161,103,.32); background: #f8fffc; }
.photo-metadata-result.good { border-color: rgba(37,99,235,.25); background: #f8fbff; }
.photo-metadata-result.limited { border-color: rgba(255,159,28,.36); background: #fffaf0; }
.photo-metadata-result.basic { border-color: rgba(148,163,184,.4); background: #f8fafc; }
.metadata-status-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .55rem;
}
.metadata-status {
    border-radius: 14px;
    padding: .68rem .72rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}
.metadata-status span {
    display: block;
    color: #64748b;
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-weight: 900;
}
.metadata-status strong {
    display: block;
    margin-top: .14rem;
    color: #0f172a;
    font-size: .92rem;
}
.metadata-status.good { background: #ecfdf5; border-color: rgba(19,161,103,.2); }
.metadata-status.warn { background: #fff7ed; border-color: #fed7aa; }
.metadata-status.neutral { background: #f8fafc; }
.metadata-notes {
    margin: 0;
    padding-left: 1.15rem;
    color: #475569;
    line-height: 1.4;
    font-size: .92rem;
}
.preview-submit-row {
    align-items: center;
    border-top: 1px solid rgba(219,228,240,.86);
    padding-top: .95rem;
}
.preview-submit-row p {
    margin: 0;
    color: #64748b;
    font-size: .9rem;
    line-height: 1.35;
}
.preview-submit-row .button {
    min-width: 9.5rem;
    min-height: 3.15rem;
}
.site-lookup-result.hidden { display: none; }
.site-lookup-result {
    grid-column: 1 / -1;
    margin-top: .2rem;
}
.site-result-card {
    border: 1px solid rgba(37, 99, 235, .18);
    border-radius: 28px;
    background: rgba(255,255,255,.92);
    padding: clamp(1rem, 2.4vw, 1.35rem);
    box-shadow: 0 20px 54px rgba(15, 23, 42, .08);
}
.loading-card { min-height: 5rem; display: grid; align-items: center; }
.site-result-head {
    align-items: flex-start;
    border-bottom: 1px solid #e5edf8;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
}
.site-result-head h3 { margin: .45rem 0 0; line-height: 1.2; }
.site-location-count {
    min-width: 150px;
    padding: .82rem 1rem;
    border-radius: 18px;
    background: #eff6ff;
    border: 1px solid rgba(37, 99, 235, .16);
    text-align: center;
}
.site-location-count span,
.site-plan-row span {
    display: block;
    color: #64748b;
    font-size: .78rem;
    font-weight: 850;
    letter-spacing: .02em;
}
.site-location-count strong { font-size: 1.25rem; }
.site-result-summary {
    color: #475569;
    line-height: 1.55;
    margin: 0 0 1rem;
}
.site-plan-table {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .8rem;
    margin-top: 1rem;
}
.site-plan-row {
    display: grid;
    gap: .72rem;
    align-items: start;
    padding: .95rem;
    border-radius: 20px;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
}
.site-plan-row.premium {
    background: #f8fbff;
    border-color: rgba(37, 99, 235, .24);
    box-shadow: 0 12px 28px rgba(37,99,235,.06);
}
.site-plan-row.unavailable { opacity: .72; }
.site-plan-title strong { font-size: 1.05rem; }
.site-plan-metrics {
    display: grid;
    grid-template-columns: 1fr;
    gap: .45rem;
}
.site-plan-metrics div {
    border-radius: 14px;
    background: rgba(255,255,255,.8);
    border: 1px solid rgba(226,232,240,.86);
    padding: .65rem;
}
.site-plan-metrics strong { display: block; margin-top: .1rem; }
.site-plan-row p { margin: 0; color: #475569; line-height: 1.42; font-size: .92rem; }
.site-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .85rem;
    margin-top: 1rem;
}
.site-signal-list,
.site-warning-list {
    padding: .95rem 1rem;
    border-radius: 20px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}
.site-signal-list { background: #f8fffc; border-color: rgba(19,161,103,.18); }
.site-warning-list { background: #fff7ed; border-color: #fed7aa; }
.site-signal-list strong,
.site-warning-list strong { display: block; margin-bottom: .35rem; }
.site-signal-list ul,
.site-warning-list ul { margin: 0; padding-left: 1.15rem; color: #475569; line-height: 1.45; }
@media (max-width: 1120px) {
    .site-preview-panel,
    .site-plan-table { grid-template-columns: 1fr 1fr; }
    .site-preview-copy h2 { max-width: 16ch; }
    .site-preview-tool { grid-column: span 1; }
}
@media (max-width: 900px) {
    .site-preview-panel,
    .site-form-grid,
    .preview-card-grid,
    .site-plan-table,
    .site-detail-grid {
        grid-template-columns: 1fr;
    }
    .site-result-head,
    .preview-submit-row,
    .sample-photo-head,
    .photo-fit-head {
        flex-direction: column;
    }
    .site-location-count,
    .preview-submit-row .button { width: 100%; }
    .metadata-status-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
    .site-preview-panel { padding: 1rem; border-radius: 24px; }
    .site-lookup-form { padding: .85rem; border-radius: 22px; }
    .metadata-status-grid { grid-template-columns: 1fr; }
}

/* Manual straight-down upload override */
.manual-nadir-list {
    display: grid;
    gap: .6rem;
    max-height: 260px;
    overflow: auto;
    margin-top: .75rem;
}
.manual-nadir-row {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: .35rem .65rem;
    align-items: center;
    padding: .8rem;
    border: 1px solid #dbe4f0;
    border-radius: 14px;
    background: #fff;
}
.manual-nadir-row span {
    font-weight: 850;
    color: #0f172a;
    overflow-wrap: anywhere;
}
.manual-nadir-row small {
    grid-column: 2;
    color: #64748b;
}
.compact-copy { margin-top: .75rem; }

/* Pricing explanation */
.plan-explanation-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}
.plan-explanation-grid article {
    padding: 1rem;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #fff;
}
.plan-explanation-grid h3 { margin-top: 0; }
.plan-explanation-grid p { color: #475569; }

@media (max-width: 1000px) {
    .site-preview-panel,
    .site-lookup-form,
    .site-plan-table,
    .site-plan-row,
    .plan-explanation-grid {
        grid-template-columns: 1fr;
    }
    .site-result-head {
        flex-direction: column;
    }
    .site-location-count {
        width: 100%;
    }
}

/* Slimmer home-page fit preview */
.clean-site-preview {
    grid-template-columns: minmax(260px, .82fr) minmax(360px, 1.18fr);
    gap: clamp(1rem, 3vw, 2rem);
    align-items: center;
    padding: clamp(1.35rem, 4vw, 2.4rem);
    overflow: hidden;
}
.clean-site-preview .site-preview-copy h2 {
    max-width: 11ch;
    font-size: clamp(2.25rem, 4.4vw, 3.75rem);
    line-height: .96;
    margin-bottom: .8rem;
}
.clean-site-preview .site-preview-copy p {
    max-width: 30rem;
    margin-bottom: .75rem;
}
.clean-site-preview .preview-mini-points {
    gap: .45rem;
    margin-top: .8rem;
}
.clean-site-preview .preview-mini-points span {
    font-size: .82rem;
    padding: .42rem .64rem;
    background: rgba(255,255,255,.86);
}
.clean-preview-form {
    border-radius: 26px;
    padding: clamp(.95rem, 2vw, 1.2rem);
    gap: .85rem;
}
.clean-form-grid {
    grid-template-columns: minmax(200px, 1fr) minmax(100px, .32fr);
    gap: .7rem;
}
.clean-preview-form .site-form-field {
    gap: .32rem;
    font-size: .9rem;
}
.clean-preview-form .site-form-field input[type="text"],
.clean-preview-form .site-form-field input[type="number"] {
    min-height: 3rem;
    border-radius: 16px;
    padding: .78rem .9rem;
}
.straightdown-help-tile,
.site-lookup-form .checkbox-label.straightdown-help-tile {
    min-height: auto;
    height: auto;
    padding: .85rem .95rem;
    border-radius: 18px;
    background: linear-gradient(135deg,#f8fbff,#fff);
}
.straightdown-help-tile small { max-width: none; }
.compact-sample-card {
    border-radius: 20px;
    padding: .85rem;
    gap: .7rem;
}
.compact-sample-card .sample-photo-head {
    align-items: center;
}
.compact-sample-card .sample-photo-head span { font-size: .86rem; }
.compact-drop {
    padding: .78rem;
    border-radius: 16px;
}
.compact-drop .sample-icon {
    width: 2rem;
    height: 2rem;
    font-size: 1.05rem;
}
.compact-metadata-result {
    padding: .75rem;
    border-radius: 16px;
    gap: .6rem;
}
.compact-photo-fit-head {
    align-items: center;
}
.compact-status-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .45rem;
}
.compact-status-grid .metadata-status {
    padding: .55rem .58rem;
    border-radius: 12px;
}
.compact-status-grid .metadata-status span {
    font-size: .64rem;
}
.compact-status-grid .metadata-status strong {
    font-size: .82rem;
}
.compact-notes {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .45rem 1rem;
    padding-left: 1rem;
    font-size: .86rem;
}
.clean-submit-row {
    padding-top: .78rem;
    gap: 1rem;
}
.clean-submit-row p {
    max-width: 30rem;
    font-weight: 700;
}
.clean-submit-row .button {
    min-height: 2.85rem;
    min-width: 8.75rem;
    border-radius: 999px;
}
.clean-result-card {
    margin-top: .25rem;
    padding: clamp(.95rem, 2vw, 1.15rem);
}
.clean-result-top {
    display: grid;
    grid-template-columns: 1fr minmax(260px, .72fr);
    gap: 1rem;
    align-items: start;
    padding-bottom: .85rem;
    border-bottom: 1px solid #e5edf8;
}
.clean-result-top h3 {
    margin: .35rem 0 .35rem;
    font-size: clamp(1.3rem, 2vw, 1.75rem);
    line-height: 1.1;
    letter-spacing: -.035em;
}
.clean-result-top p {
    margin: 0;
    color: #526174;
    line-height: 1.45;
}
.result-stat-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .55rem;
}
.result-stat-grid div {
    border: 1px solid rgba(219,228,240,.95);
    border-radius: 16px;
    padding: .7rem;
    background: #f8fbff;
    text-align: center;
}
.result-stat-grid span,
.fit-plan-chip span {
    display: block;
    color: #64748b;
    font-size: .72rem;
    font-weight: 850;
}
.result-stat-grid strong {
    display: block;
    margin-top: .18rem;
    color: #0f172a;
}
.fit-plan-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .65rem;
    margin-top: .85rem;
}
.fit-plan-chip {
    border-radius: 18px;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    padding: .78rem;
    display: grid;
    gap: .4rem;
}
.fit-plan-chip div {
    display: flex;
    justify-content: space-between;
    gap: .5rem;
    align-items: baseline;
}
.fit-plan-chip > strong {
    font-size: 1.05rem;
    color: #0f172a;
}
.fit-plan-chip.premium { background: #f8fbff; border-color: rgba(37,99,235,.24); }
.fit-plan-chip.recommended {
    border-color: rgba(37,99,235,.55);
    box-shadow: 0 12px 28px rgba(37,99,235,.10);
}
.fit-plan-chip.unavailable { opacity: .58; }
.fit-note-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
    margin-top: .85rem;
}
.fit-note-row div {
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #fff;
    padding: .85rem;
}
.fit-note-row strong { display: block; margin-bottom: .25rem; }
.fit-note-row p {
    margin: 0;
    color: #526174;
    line-height: 1.42;
    font-size: .92rem;
}
@media (max-width: 980px) {
    .clean-site-preview,
    .clean-result-top,
    .fit-plan-strip,
    .fit-note-row { grid-template-columns: 1fr; }
    .clean-site-preview .site-preview-copy h2 { max-width: 14ch; }
}
@media (max-width: 640px) {
    .clean-form-grid,
    .result-stat-grid,
    .compact-status-grid,
    .compact-notes { grid-template-columns: 1fr; }
}
