:root { --ink:#292038; --muted:#6e6578; --purple:#7150a5; --light:#f7f2fb; --border:#e6dcef; --good:#287651; --warn:#996716; --bad:#a33a45; }
* { box-sizing:border-box }
.palm-page [hidden] { display:none !important }
.palm-page { margin:0; background:#fbf9fd; color:var(--ink) }
.palm-header { min-height:64px; padding:10px 18px; display:flex; align-items:center; justify-content:space-between; background:#fff; border-bottom:1px solid var(--border) }
.palm-header .brand { text-decoration:none }
.test-badge { padding:6px 10px; border-radius:999px; background:#eee5f6; color:#604487; font-size:.78rem; font-weight:700 }
.palm-main { max-width:760px; margin:auto; padding-bottom:72px }
.palm-hero { text-align:center; padding:42px 20px 28px; background:linear-gradient(180deg,#f1e9f8,#fbf9fd) }
.palm-hero h1 { margin:7px 0 12px; font-size:clamp(1.9rem,7vw,2.8rem); line-height:1.35 }
.palm-hero>p:not(.eyebrow), .guide-note, .section-lead, .quality-footnote { color:var(--muted); line-height:1.7 }
.palm-hero-visual { width:min(100%,680px); margin:24px auto 0; overflow:hidden; border:1px solid rgba(113,80,165,.2); border-radius:20px; background:#f6effa; box-shadow:0 14px 34px rgba(70,45,101,.14) }
.palm-hero-visual picture, .palm-hero-visual img { display:block; width:100% }
.palm-hero-visual img { height:auto; aspect-ratio:1426/1103; object-fit:cover }
.local-notice { margin:24px auto 0; padding:16px; text-align:left; display:grid; gap:5px; max-width:620px; border:1px solid #cdbbe0; border-radius:14px; background:#fff }
.local-notice strong { color:#5e3d8c }
.local-notice span, .guide-note, .section-lead, .quality-footnote { font-size:.86rem }
.palm-guide, .form-card { margin:18px 14px; padding:22px 18px; background:#fff; border:1px solid var(--border); border-radius:18px; box-shadow:0 8px 24px rgba(69,45,92,.05) }
.palm-guide h2, .form-card h2 { margin:0 0 16px; font-size:1.3rem }
.guide-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px }
.guide-grid p { margin:0; padding:12px 5px; text-align:center; border-radius:12px; background:var(--light); font-size:.78rem; line-height:1.55 }
.guide-grid b { display:grid; place-items:center; width:25px; height:25px; margin:0 auto 7px; border-radius:50%; background:var(--purple); color:#fff }
.step { display:block; margin-bottom:7px; color:var(--purple); font-size:.75rem; font-weight:800; letter-spacing:.12em }
.choice-row { display:grid; grid-template-columns:repeat(3,1fr); gap:8px }
.choice-row input { position:absolute; opacity:0 }
.choice-row span { display:block; padding:13px 4px; text-align:center; border:1px solid var(--border); border-radius:10px; font-weight:700 }
.choice-row input:checked+span { border-color:var(--purple); background:var(--light); color:#5d3b8a; box-shadow:inset 0 0 0 1px var(--purple) }
.choice-row input:focus-visible+span, .upload-button:focus-within { outline:3px solid #cbb8df; outline-offset:2px }
.hand-upload { margin-top:22px; padding-top:22px; border-top:1px solid var(--border) }
.hand-heading { display:flex; align-items:center; gap:11px; margin-bottom:12px }
.hand-heading>span { display:grid; place-items:center; width:42px; height:42px; border-radius:50%; background:var(--purple); color:#fff; font-weight:800 }
.hand-heading h3, .hand-heading p { margin:0 }.hand-heading h3 { font-size:1.05rem }.hand-heading p { font-size:.78rem; color:var(--muted) }
.photo-stage { display:grid; place-items:center; aspect-ratio:4/3; overflow:hidden; border:2px dashed #d5c7e1; border-radius:14px; background:#faf7fc }
.photo-stage img { width:100%; height:100%; object-fit:contain; background:#17131c }
.photo-placeholder { text-align:center; color:#8c7e98 }.photo-placeholder span { font-size:3rem }.photo-placeholder p { margin:4px 0 0; font-size:.85rem; line-height:1.5 }
.hand-upload[data-hand="left"] .photo-placeholder span { display:inline-block; transform:scaleX(-1) }
.upload-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:10px }
.upload-button { position:relative; padding:13px 7px; text-align:center; border-radius:10px; font-family:inherit; font-weight:750; font-size:.9rem; cursor:pointer }
.upload-button.primary { background:var(--purple); color:#fff }.upload-button.secondary { border:1px solid #bfaed1; background:#fff; color:#5d3b8a }.upload-button input { position:absolute; width:1px; height:1px; opacity:0 }
.quality-result { margin-top:10px; padding:13px; border-radius:11px; font-size:.86rem; line-height:1.6 }.quality-result strong { display:block; font-size:.95rem }
.quality-result.good { background:#eaf6f0; color:var(--good) }.quality-result.warn { background:#fff5df; color:var(--warn) }.quality-result.bad { background:#fdebed; color:var(--bad) }
.quality-footnote { margin:18px 0 0; padding:12px; background:#f7f4f9; border-radius:10px }
.form-card select, .form-card input[type="date"], .form-card input[type="text"], .form-card textarea { width:100%; padding:13px; border:1px solid #cfc3d8; border-radius:10px; background:#fff; font:inherit; color:inherit }.form-card textarea { resize:vertical; min-height:110px }.field-label { display:block; margin-top:16px; font-weight:700 }.field-label em, .handedness-field em { color:#8e3b59; font-size:.72rem; font-style:normal }.field-label>span { color:var(--muted); font-size:.75rem; font-weight:500 }.field-label input, .field-label select, .field-label textarea { display:block; margin-top:7px }.handedness-field { margin:20px 0 0; padding:0; border:0 }.handedness-field legend { margin-bottom:9px; font-weight:700 }
.form-card input[type="date"] { width:100%!important; min-width:0; max-width:100%; min-height:52px; box-sizing:border-box; line-height:1.4; text-align:left; direction:ltr; appearance:none; -webkit-appearance:none }
.form-card input[type="date"]::-webkit-date-and-time-value, .form-card input[type="date"]::-webkit-datetime-edit { min-width:0; margin:0; padding:0; text-align:left }
.form-card input[type="date"]::-webkit-calendar-picker-indicator { display:none; -webkit-appearance:none }
.consent { display:flex; align-items:flex-start; gap:10px; margin-top:20px; font-size:.88rem; line-height:1.65 }.consent input { width:20px; height:20px; margin-top:2px; accent-color:var(--purple); flex:0 0 auto }
.payment-price { padding:16px; border:1px solid #d8c8e7; border-radius:14px; background:linear-gradient(135deg,#faf6fd,#f3ebf9) }.payment-price>div { display:flex; align-items:flex-end; justify-content:space-between; gap:12px }.payment-price span { color:#604487; font-weight:700 }.payment-price strong { color:#4f2e7b; font-size:2.2rem; line-height:1 }.payment-price strong small { margin-left:3px; font-size:.9rem }.payment-price p { margin:12px 0 0; color:var(--muted); font-size:.84rem; line-height:1.7 }.payment-status { margin:14px 0 0; padding:12px 14px; border-radius:10px; background:#f7f4f9; color:var(--muted); font-size:.86rem; line-height:1.65 }.payment-status.paid { background:#eaf6f0; color:var(--good); font-weight:700 }.payment-status.error { background:#fdebed; color:var(--bad) }
.submit-area { text-align:center; padding:8px 18px }.palm-submit { width:100%; max-width:480px; padding:16px; border:0; border-radius:12px; background:linear-gradient(135deg,#7550a8,#4e3279); color:#fff; font-size:1rem; font-weight:800 }.submit-area small { display:block; margin-top:8px; color:var(--muted) }
.form-message { min-height:1.5em; margin:0 0 8px; color:var(--bad); font-size:.88rem }
.complete-card { margin:24px 14px; padding:36px 22px; text-align:center; border:1px solid #cdbbe0; border-radius:18px; background:#fff }.complete-card>span { display:grid; place-items:center; width:54px; height:54px; margin:auto; border-radius:50%; background:#e7f5ee; color:var(--good); font-size:1.7rem; font-weight:800 }.complete-card p { color:var(--muted); line-height:1.75 }.complete-card button { padding:11px 16px; border:1px solid #bfaed1; border-radius:9px; background:#fff; color:#5d3b8a; font-weight:700 }
.palm-loading, .palm-result { margin:24px 14px; padding:30px 20px; border:1px solid #cdbbe0; border-radius:18px; background:#fff; box-shadow:0 10px 28px rgba(69,45,92,.08) }
.palm-loading { text-align:center }.palm-loading h2 { margin:18px 0 8px }.palm-loading p { color:var(--muted); line-height:1.75 }
.palm-orb { width:66px; height:66px; margin:auto; border:5px solid #eadff3; border-top-color:var(--purple); border-radius:50%; animation:palm-spin .9s linear infinite }
@keyframes palm-spin { to { transform:rotate(360deg) } }
.palm-result>.eyebrow { text-align:center }.palm-result>h2 { margin:4px 0 24px; text-align:center; font-size:clamp(1.65rem,5vw,2.25rem); line-height:1.45 }
.palm-result article { margin-top:12px; padding:18px; border-radius:14px; background:#f9f6fb }.palm-result article h3 { margin:0 0 8px; color:#5b3c84; font-size:1.05rem }.palm-result article p { margin:0; line-height:1.9; white-space:pre-line }
.result-hands { display:grid; grid-template-columns:1fr 1fr; gap:12px }.result-hands article { height:100% }
.palm-result ol { margin:0; padding-left:1.5em }.palm-result li { margin:9px 0; padding-left:4px; line-height:1.75 }
.palm-result ul { margin:0; padding-left:1.35em }.reading-examples li { margin:10px 0; padding-left:5px; line-height:1.8 }
.palm-result>button { display:block; width:100%; margin-top:22px; padding:13px; border:1px solid #bfaed1; border-radius:10px; background:#fff; color:#5d3b8a; font:700 .9rem inherit }
.palm-result>.save-pdf-button { border:0; background:linear-gradient(135deg,#7550a8,#4e3279); color:#fff; font-size:1rem }
.pdf-promo { display:none }
.pdf-document-head { display:none }
.camera-modal { position:fixed; z-index:9999; inset:0; padding:16px; display:grid; place-items:center; background:rgba(17,12,23,.88) }
.camera-panel { width:min(100%,560px); padding:16px; border-radius:18px; background:#fff }
.camera-panel__head { display:flex; align-items:center; justify-content:space-between; gap:12px }.camera-panel__head h2 { margin:0; font-size:1.2rem }.camera-panel__head button { width:42px; height:42px; border:0; border-radius:50%; background:#eee8f3; color:#4e3b60; font-size:1.7rem }
.camera-panel>p { color:var(--muted); font-size:.85rem; line-height:1.6 }.camera-square { position:relative; width:100%; aspect-ratio:1/1; overflow:hidden; border-radius:12px; background:#17131c }.camera-panel video { display:block; width:100%; height:100%; background:#17131c; object-fit:cover }.camera-guide { position:absolute; inset:7%; border:3px dashed rgba(255,255,255,.82); border-radius:22px; box-shadow:0 0 0 999px rgba(15,10,20,.14); pointer-events:none }.camera-guide span { position:absolute; left:50%; bottom:10px; transform:translateX(-50%); width:max-content; max-width:90%; padding:5px 9px; border-radius:999px; background:rgba(20,14,27,.72); color:#fff; font-size:.72rem }
.camera-error { color:var(--bad) !important }.camera-shutter { display:flex; align-items:center; justify-content:center; gap:10px; width:100%; margin-top:12px; padding:14px; border:0; border-radius:12px; background:var(--purple); color:#fff; font:700 1rem inherit }.camera-shutter span { width:22px; height:22px; border:3px solid #fff; border-radius:50% }
.camera-shutter small { font-size:.72rem; font-weight:500; opacity:.82 }
.camera-shutter:disabled { opacity:.45 }
@media(max-width:560px) { .result-hands { grid-template-columns:1fr } }
@media(max-width:420px) { .palm-hero { padding:32px 14px 24px }.palm-hero h1 { font-size:1.8rem }.palm-hero-visual { margin-top:20px; border-radius:16px }.guide-grid p { font-size:.72rem }.palm-guide,.form-card { margin-left:10px; margin-right:10px; padding-left:14px; padding-right:14px }.upload-actions { grid-template-columns:1fr }.photo-stage { aspect-ratio:1/1 } }
@media print {
  @page { size:A4; margin:12mm 14mm }
  html, body.palm-page { width:auto !important; height:auto !important; min-height:0 !important; margin:0 !important; padding:0 !important; overflow:visible !important; background:#fff !important; color:#17131c; font-size:11pt }
  body.palm-page::before, body.palm-page::after, .palm-main::before, .palm-main::after, .palm-result::before, .palm-result::after { display:none !important; position:static !important; width:0 !important; height:0 !important; content:none !important; background:none !important }
  .palm-page> :not(.palm-main), .palm-main> :not(.palm-result), .palm-result>button { display:none !important }
  .palm-main { display:block !important; width:auto !important; height:auto !important; min-height:0 !important; max-width:none; margin:0 !important; padding:0 !important; overflow:visible !important }
  .palm-result { display:block !important; width:auto !important; height:auto !important; min-height:0 !important; margin:0; padding:0; border:0; box-shadow:none; break-after:avoid-page; page-break-after:avoid }
  .pdf-document-head { display:block; margin-bottom:9mm; padding:8mm 7mm 7mm; border-top:3px solid #7150a5; border-bottom:1px solid #d9cce5; background:#fff !important }
  .pdf-brand { margin:0; text-align:center; color:#7150a5; font-size:10pt; font-weight:800; letter-spacing:.12em }.pdf-document-head h1 { margin:2mm 0 1mm; text-align:center; color:#241a3b; font-size:27pt; letter-spacing:.08em }.pdf-document-lead { margin:0 0 6mm; text-align:center; color:#6e6578; font-size:9.5pt }
  .pdf-profile { display:grid; grid-template-columns:1fr 1fr 1fr; margin:0; border-top:1px solid #e6dcef; border-left:1px solid #e6dcef }.pdf-profile div { min-width:0; padding:3mm 4mm; border-right:1px solid #e6dcef; border-bottom:1px solid #e6dcef }.pdf-profile dt { color:#78678a; font-size:8pt; font-weight:700 }.pdf-profile dd { margin:1mm 0 0; color:#292038; font-size:10pt; font-weight:700; overflow-wrap:anywhere }
  .palm-result>.eyebrow { display:none }.palm-result>h2 { font-size:19pt; margin:0 0 8mm; padding:0 5mm; text-align:center }
  .palm-result article { break-inside:avoid-page; page-break-inside:avoid; margin:0 0 4mm; padding:4mm 5mm; border:1px solid #e6dcef; background:#faf8fc !important }
  .palm-result article h3 { color:#5b3c84 !important }
  .palm-result article p, .palm-result li { line-height:1.6 }
  .palm-result article h3 { break-after:avoid-page }
  .result-hands { grid-template-columns:1fr 1fr; gap:4mm; break-inside:avoid-page; page-break-inside:avoid }
  .pdf-promo { display:block; break-inside:avoid; break-before:avoid-page; margin-top:5mm; padding:5mm 4mm; border-top:2px solid #7150a5; text-align:center; background:#fff !important }
  .pdf-promo strong { display:block; color:#5b3c84; font-size:15pt; letter-spacing:.05em }.pdf-promo p { margin:2mm 0 1mm; font-size:10pt }.pdf-promo span { display:block; color:#6e6578; font-size:8.5pt }.pdf-promo a { display:block; margin-top:2mm; color:#5b3c84; font-size:9pt; text-decoration:none }
  .palm-result>:last-child, .pdf-promo>:last-child { margin-bottom:0 !important }
  * { -webkit-print-color-adjust:exact; print-color-adjust:exact }
}