/* Primitive palette comes from styles.css; semantic and component aliases stay local. */
:root { --space-panel-bg: var(--surface); --space-panel-border: var(--line); --space-emphasis: var(--jade); --space-panel-padding: 30px; --space-panel-radius: 12px; }
.space-skip { position: absolute; top: -80px; left: 20px; z-index: 20; padding: 10px 14px; background: var(--surface); color: var(--jade); }
.space-skip:focus { top: 10px; }
.space-page { padding-bottom: 80px; }
.space-intro { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(230px, .7fr); gap: 80px; padding: 70px 0 48px; align-items: end; }
.space-intro h1 { font-size: clamp(39px, 4.9vw, 63px); letter-spacing: -.035em; line-height: 1.19; max-width: 710px; }
.space-lead { max-width: 620px; color: var(--ink-muted); font-size: 16px; line-height: 1.85; margin-bottom: 0; }
.space-intro-note { border-left: 1px solid var(--line); padding-left: 28px; }
.space-intro-note p { color: var(--ink-muted); font-size: 14px; line-height: 1.8; margin-top: 14px; }
.space-intro-note .text-cta { padding: 0; border: 0; }
.space-seal { display: grid; place-items: center; width: 53px; height: 53px; border: 1px solid var(--jade); color: var(--jade); font-family: var(--serif); font-size: 29px; border-radius: 5px; }
.space-layout { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(300px, .85fr); gap: 28px; align-items: start; }
.space-form { display: grid; gap: 20px; }
.space-group { min-width: 0; margin: 0; padding: var(--space-panel-padding); border: 1px solid var(--space-panel-border); border-radius: var(--space-panel-radius); background: var(--space-panel-bg); }
.space-group > legend { display: flex; align-items: center; gap: 10px; padding: 0 8px; margin-left: -8px; color: var(--ink); font-size: 17px; font-weight: 720; }
.space-type-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 10px 0 25px; }
.space-type-card { position: relative; display: grid; gap: 5px; padding: 15px 14px 15px 40px; border: 1px solid var(--line); border-radius: 6px; cursor: pointer; }
.space-type-card input { position: absolute; top: 17px; left: 14px; width: 16px; height: 16px; min-height: 0; padding: 0; accent-color: var(--jade); }
.space-type-card:has(input:checked) { border-color: var(--jade); background: var(--jade-pale); }
.space-type-card strong { font-size: 15px; color: var(--jade-dark); }
.space-type-card small { font-size: 12px; color: var(--ink-muted); line-height: 1.6; }
.space-field { display: grid; gap: 7px; min-width: 0; margin: 0 0 19px; font-size: 13px; font-weight: 680; color: var(--ink); }
.space-field input, .space-field select { min-width: 0; font-size: 14px; font-weight: 400; }
.space-field small { font-size: 12px; font-weight: 400; line-height: 1.65; color: var(--ink-muted); }
.space-fields-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
.space-choice-group { border: 0; padding: 0; margin: 22px 0; }
.space-choice-group > legend { padding: 0; margin-bottom: 10px; color: var(--ink); font-size: 13px; font-weight: 680; }
.space-check-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.space-check { display: flex; align-items: start; gap: 8px; color: var(--ink-muted); font-size: 13px; line-height: 1.6; cursor: pointer; }
.space-check input, .space-confirm input { flex: 0 0 auto; width: 16px; height: 16px; min-height: 0; margin-top: 3px; padding: 0; accent-color: var(--jade); }
.space-photo { margin-top: 20px; border-top: 1px solid var(--line); padding-top: 17px; }
.space-photo summary { cursor: pointer; font-size: 13px; color: var(--jade); font-weight: 650; }
.space-photo > p { font-size: 12px; line-height: 1.8; color: var(--ink-muted); margin: 14px 0; }
.space-photo input { padding: 8px; font-size: 12px; }
.space-photo img { display: block; width: 100%; max-height: 330px; object-fit: contain; border-radius: 6px; background: var(--paper-deep); }
.space-photo .button { margin-top: 8px; }
.space-note { color: var(--ink-muted); font-size: 12px; line-height: 1.8; margin-bottom: 15px; }
.space-unknown-note { margin: 0; padding: 12px; border-left: 2px solid var(--gold); background: var(--gold-pale); font-size: 12px; color: #645331; line-height: 1.8; }
.space-confirm { display: flex; align-items: start; gap: 10px; margin: 22px 0; color: var(--ink-muted); font-size: 12px; line-height: 1.8; }
.space-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 25px; }
.space-actions .button { flex: 1; min-width: 170px; }
.space-status { min-height: 0; white-space: pre-line; overflow-wrap: anywhere; color: var(--jade); font-size: 13px; line-height: 1.7; margin: 14px 0; }
.space-status:empty { display: none; }
.space-status[data-error="true"] { color: var(--error); }
.space-info { padding: 13px 16px; background: var(--gold-pale); border-left: 2px solid var(--gold); font-size: 13px; }
.space-sidebar { position: sticky; top: 24px; display: grid; gap: 20px; }
.space-summary { padding: 25px; border: 1px solid var(--line); border-radius: var(--space-panel-radius); background: var(--surface); }
.space-summary h2, .space-purchase h2 { font-size: 29px; line-height: 1.2; letter-spacing: -.035em; margin: 0 0 16px; }
.space-progress { color: var(--ink-muted); font-size: 12px; margin-bottom: 7px; }
.space-summary progress { display: block; width: 100%; height: 5px; margin: 0 0 18px; accent-color: var(--jade); border: 0; border-radius: 10px; }
.space-summary progress::-webkit-progress-bar { background: var(--paper-deep); border-radius: 10px; }
.space-summary progress::-webkit-progress-value { background: var(--jade); border-radius: 10px; }
.space-observations { display: grid; grid-template-columns: 1fr 1.3fr; gap: 9px 16px; font-size: 12px; margin: 0; }
.space-observations dt { color: var(--ink-muted); }
.space-observations dd { margin: 0; text-align: right; color: var(--jade-dark); }
.space-quick-result { border-top: 1px solid var(--line); margin-top: 20px; padding-top: 18px; }
.space-quick-result h3 { font-size: 15px; margin-bottom: 9px; }
.space-quick-result ol { margin: 0; padding-left: 20px; font-size: 12px; line-height: 1.8; color: var(--ink-muted); }
.space-quick-result li + li { margin-top: 8px; }
.space-purchase { padding: 27px; border-radius: var(--space-panel-radius); background: var(--jade-dark); color: #eff5f1; }
.space-purchase .eyebrow { color: #e2ba69; }
.space-purchase > p:not(.eyebrow):not(.space-price), .space-purchase li { font-size: 12px; line-height: 1.85; color: #d0e0d8; }
.space-purchase h2 { color: white; }
.space-price { font-size: 46px; font-family: var(--serif); line-height: 1; margin-bottom: 15px; }
.space-price span { font: 11px var(--sans); color: #b8cfc4; letter-spacing: .06em; }
.space-purchase ul { padding-left: 17px; margin: 19px 0; }
.space-purchase .space-method-label { border-top: 1px solid #386257; padding-top: 16px; font-size: 11px !important; }
.space-purchase .button-primary { background: #e1b761; color: #213f32; gap: 8px; box-shadow: none; }
.space-purchase .button-primary:hover:not(:disabled) { background: #f2cc82; }
.space-purchase .button-primary:disabled { cursor: not-allowed; opacity: .56; }
.space-purchase-note { margin: 11px 0; font-size: 11px !important; }
.space-refund-link { color: #cadcd2; font-size: 11px; text-underline-offset: 3px; }
@media (max-width: 1000px) { .space-intro { gap: 35px; }.space-layout { gap: 20px; grid-template-columns: minmax(0, 1.35fr) minmax(280px, .8fr); }:root { --space-panel-padding: 22px; }.space-fields-grid { grid-template-columns: 1fr; }.space-type-grid { grid-template-columns: 1fr; }.space-sidebar { position: static; } }
@media (max-width: 720px) { .space-intro { grid-template-columns: 1fr; gap: 28px; padding-top: 45px; }.space-intro-note { display: none; }.space-layout { grid-template-columns: 1fr; }.space-fields-grid, .space-type-grid { grid-template-columns: 1fr 1fr; }.space-page { padding-bottom: 45px; }.space-intro h1 { font-size: 42px; }.space-purchase { padding: 27px; } }
@media (max-width: 430px) { .space-fields-grid, .space-type-grid { grid-template-columns: 1fr; }.space-check-grid { grid-template-columns: 1fr; }.space-group { padding: 20px 18px; }.space-group > legend { font-size: 15px; }.space-intro h1 { font-size: 37px; }.space-actions { flex-direction: column; }.space-actions .button { width: 100%; }.space-summary { padding: 22px; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; }.space-page .button { transition: none; } }