.pm-game,.pm-game{background:#0A0B18}.pm-game{ color-scheme: dark; --ink:#fff9ee; --muted:#c9bfd8; --gold:#f3d58a; --violet:#a879ff; --coral:#ff8b73; --panel:rgba(30,19,54,.86); }.pm-game *{ box-sizing: border-box; }.pm-game,.pm-game,.pm-game #game-container{ width:100%; min-height:100%; margin:0; }.pm-game{ background:#0c1024; }.pm-game{ font-family:"DM Sans",system-ui,sans-serif; color:var(--ink); overflow-x:hidden; touch-action:pan-y; background:#0c1024; }.pm-game button,.pm-game input{ font:inherit; }.pm-game button{ -webkit-tap-highlight-color:transparent; }.pm-game #game-container{ position:relative; min-height:100dvh; background:linear-gradient(180deg,rgba(1,7,28,.8),rgba(2,5,22,.95)),url('quiromancia-game/assets/celestial-indigo-background.webp') center/cover fixed; overflow:hidden; }.pm-game #game-container::before{ content:""; position:fixed; z-index:0; inset:0; pointer-events:none; background:
        radial-gradient(circle at 9% 14%,rgba(255,255,255,.72) 0 1px,transparent 1.8px),
        radial-gradient(circle at 23% 31%,rgba(190,215,255,.58) 0 1px,transparent 1.7px),
        radial-gradient(circle at 78% 16%,rgba(220,230,255,.62) 0 1px,transparent 1.8px),
        radial-gradient(circle at 91% 42%,rgba(255,255,255,.54) 0 1px,transparent 1.7px),
        radial-gradient(circle at 14% 68%,rgba(190,215,255,.5) 0 1px,transparent 1.7px),
        radial-gradient(circle at 84% 78%,rgba(220,230,255,.52) 0 1px,transparent 1.8px),
        radial-gradient(circle at 48% 88%,rgba(255,255,255,.48) 0 1px,transparent 1.7px),
        radial-gradient(circle at 50% 18%,rgba(47,93,190,.1),transparent 34%); }.pm-game #game-container::after{ content:""; position:fixed; z-index:0; inset:-12%; pointer-events:none; opacity:.72; filter:blur(28px); background:
        radial-gradient(ellipse at 8% 34%,rgba(90,132,210,.2),transparent 25%),
        radial-gradient(ellipse at 92% 58%,rgba(105,89,190,.18),transparent 26%),
        radial-gradient(ellipse at 42% 78%,rgba(48,91,166,.16),transparent 30%),
        radial-gradient(ellipse at 68% 8%,rgba(151,138,220,.1),transparent 22%); }.pm-game .app{ z-index:1; }.pm-game .app{ position:relative; width:min(100%,520px); min-height:100dvh; margin:auto; padding:max(5vh,env(safe-area-inset-top)) max(4vw,16px) max(5vh,env(safe-area-inset-bottom)); }.pm-game .topbar{ height:52px; display:grid; grid-template-columns:46px minmax(0,1fr) 46px; align-items:center; }.pm-game .brand{ grid-column:2; justify-self:center; display:flex; align-items:center; gap:11px; font-family:"Playfair Display",serif; font-size:clamp(25px,7vw,32px); font-weight:700; letter-spacing:.35px; line-height:1; color:#fff8e9; text-shadow:0 0 18px rgba(243,213,138,.2); white-space:nowrap; }.pm-game .brand-mark{ width:38px; height:38px; display:grid; place-items:center; border:1px solid rgba(243,213,138,.55); border-radius:50%; color:var(--gold); background:rgba(27,17,50,.68); }.pm-game .topbar .icon-btn{ grid-column:3; justify-self:end; }.pm-game .icon-btn{ width:46px; height:46px; border:1px solid rgba(255,255,255,.14); border-radius:50%; color:var(--ink); background:rgba(21,15,45,.7); display:grid; place-items:center; cursor:pointer; }.pm-game .screen{ animation:enter .42s ease both; }.pm-game .hero{ text-align:center; padding-top:clamp(14px,4vh,42px); }.pm-game .eyebrow{ margin:0 0 10px; color:var(--gold); font-size:11px; font-weight:700; letter-spacing:2.4px; text-transform:uppercase; }.pm-game h1,.pm-game h2,.pm-game h3{ font-family:"Playfair Display",serif; margin:0; }.pm-game h1{ font-size:clamp(38px,11vw,58px); line-height:.98; }.pm-game .subtitle{ max-width:350px; margin:15px auto 0; color:var(--muted); line-height:1.55; font-size:15px; }.pm-game .palm-wrap{ position:relative; height:clamp(145px,20vh,190px); margin:8px auto 0; display:grid; place-items:center; overflow:visible; }.pm-game .palm-wrap::before{ content:""; position:absolute; width:170px; height:170px; border-radius:50%; background:radial-gradient(circle,rgba(174,100,255,.22),transparent 67%); filter:blur(6px); animation:pulse 3s ease-in-out infinite; }.pm-game .palm-art{ position:relative; z-index:1; display:block; width:auto; height:120px; max-width:48%; max-height:calc(100% - 12px); object-fit:contain; filter:drop-shadow(0 0 14px rgba(211,137,255,.3)); }.pm-game .primary{ position:relative; z-index:2; width:min(86%,320px); min-height:48px; margin:32px auto 0; border:0; border-radius:16px; padding:11px 16px; display:flex; align-items:center; justify-content:center; gap:10px; color:#241234; font-weight:800; background:linear-gradient(110deg,#f5d994,#f4bda8); box-shadow:0 12px 30px rgba(242,177,151,.22); cursor:pointer; transition:transform .15s,filter .15s; }.pm-game .primary:active,.pm-game .choice:active,.pm-game .line-card:active{ transform:scale(.975); }.pm-game .secondary{ width:100%; min-height:50px; border:1px solid rgba(255,255,255,.16); border-radius:16px; color:var(--ink); background:rgba(24,17,47,.7); font-weight:700; cursor:pointer; }.pm-game .trust{ margin:14px 0 0; display:flex; justify-content:center; align-items:center; gap:7px; color:#bdb2ce; font-size:12px; }.pm-game .tip-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:22px; }.pm-game .tip{ padding:12px 5px; min-height:72px; display:grid; place-items:center; align-content:center; gap:5px; border:1px solid rgba(255,255,255,.1); border-radius:15px; background:rgba(28,18,51,.5); font-size:11px; color:#cfc5dc; }.pm-game .tip span:first-child{ font-size:19px; color:var(--gold); }.pm-game .disclaimer{ margin:20px auto 0; color:#9f95af; font-size:11px; line-height:1.4; text-align:center; max-width:410px; }.pm-game .sheet-backdrop{ position:fixed; inset:0; z-index:20; background:rgba(6,7,20,.72); backdrop-filter:blur(7px); display:flex; align-items:flex-end; justify-content:center; padding:0 max(3vw,12px) max(3vh,env(safe-area-inset-bottom)); animation:fade .2s both; }.pm-game .sheet{ width:min(100%,500px); padding:20px; border:1px solid rgba(255,255,255,.13); border-radius:26px; background:#211539; box-shadow:0 -20px 80px rgba(0,0,0,.35); }.pm-game .grab{ width:42px; height:4px; border-radius:3px; margin:-6px auto 15px; background:rgba(255,255,255,.25); }.pm-game .sheet h2{ font-size:26px; }.pm-game .sheet p{ color:var(--muted); font-size:14px; }.pm-game .choices{ display:grid; gap:10px; margin-top:16px; }.pm-game .choice{ min-height:68px; border:1px solid rgba(255,255,255,.13); border-radius:17px; background:rgba(255,255,255,.055); color:var(--ink); display:flex; align-items:center; gap:14px; padding:12px 15px; text-align:left; cursor:pointer; }.pm-game .choice-icon{ width:43px; height:43px; flex:0 0 auto; display:grid; place-items:center; border-radius:13px; color:var(--gold); background:rgba(243,213,138,.1); font-size:20px; }.pm-game .choice strong,.pm-game .choice small{ display:block; }.pm-game .choice small{ color:#aca2bc; margin-top:3px; }.pm-game .camera-modal{ position:fixed; inset:0; z-index:30; display:flex; flex-direction:column; background:#080b18; }.pm-game .camera-head{ display:flex; justify-content:space-between; align-items:center; padding:max(4vh,env(safe-area-inset-top)) 4vw 12px; }.pm-game .camera-stage{ position:relative; flex:1; min-height:0; overflow:hidden; background:#060711; }.pm-game video{ width:100%; height:100%; object-fit:cover; }.pm-game .guide{ position:absolute; inset:1.5% 1%; border:2px dashed rgba(245,217,148,.82); border-radius:35% 35% 24% 24%; box-shadow:0 0 0 100vmax rgba(5,5,15,.24); pointer-events:none; display:grid; place-items:center; transition:border-color .2s ease,box-shadow .2s ease; }.pm-game .guide.ready{ border-color:#78f0a9; box-shadow:0 0 0 100vmax rgba(5,5,15,.2),0 0 22px rgba(120,240,169,.85),inset 0 0 22px rgba(120,240,169,.18); }.pm-game .guide img{ width:94%; height:90%; object-fit:contain; transform:scaleX(1.28); opacity:.2; filter:sepia(1) saturate(.9) hue-rotate(350deg); }.pm-game .landmark-layer{ position:absolute; inset:0; pointer-events:none; }.pm-game .landmark-layer i{ position:absolute; width:7px; height:7px; margin:-3.5px 0 0 -3.5px; border:1px solid #08251a; border-radius:50%; background:#78f0a9; box-shadow:0 0 9px rgba(120,240,169,.95); }.pm-game .guide-status{ position:absolute; left:50%; bottom:12px; transform:translateX(-50%); width:min(92%,340px); padding:8px 10px; border-radius:10px; text-align:center; color:white; background:rgba(8,7,22,.78); font-size:13px; transition:background .2s ease,color .2s ease; }.pm-game .guide.ready .guide-status{ color:#062414; background:rgba(120,240,169,.94); font-weight:800; }.pm-game .palm-guide{ position:relative; height:250px; margin:16px auto 22px; max-width:100%; display:grid; place-items:center; border:1px dashed rgba(243,213,138,.5); border-radius:34% 34% 23% 23%; background:rgba(255,255,255,.025); }.pm-game .palm-guide img{ width:94%; height:224px; max-width:none; object-fit:contain; transform:scaleX(1.24); opacity:.42; }.pm-game .guide-label{ position:absolute; bottom:8px; color:var(--gold); font-size:11px; }.pm-game .dual-preview{ display:grid; grid-template-columns:1fr 1fr; gap:3px; height:100%; }.pm-game .dual-preview img{ width:100%; height:100%; object-fit:cover; min-width:0; }.pm-game .camera-controls{ min-height:160px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:12px; padding-bottom:max(4vh,env(safe-area-inset-bottom)); }.pm-game .shutter{ width:76px; height:76px; border-radius:50%; border:5px solid #f8e7bd; background:transparent; padding:6px; cursor:pointer; }.pm-game .shutter:disabled{ opacity:.35; cursor:wait; }.pm-game .camera-gallery{ min-height:38px; max-width:92%; padding:8px 16px; border:1px solid rgba(255,255,255,.2); border-radius:13px; color:var(--ink); background:rgba(255,255,255,.08); cursor:pointer; text-align:center; }.pm-game #native-camera{ border-color:rgba(243,213,138,.62); color:#241234; background:linear-gradient(110deg,#f5d994,#f4bda8); font-weight:800; }.pm-game .shutter::after{ content:""; display:block; width:100%; height:100%; border-radius:50%; background:#f2c88f; }.pm-game .analysis{ padding-top:18px; }.pm-game .analysis h2,.pm-game .results h2{ font-size:34px; line-height:1.08; }.pm-game .preview-card{ position:relative; height:min(50vh,455px); margin:22px 0 18px; border-radius:28px; overflow:hidden; border:1px solid rgba(255,255,255,.16); background:#191226; box-shadow:0 18px 50px rgba(0,0,0,.25); }.pm-game .preview-card img{ width:100%; height:100%; object-fit:cover; }.pm-game .scanline{ position:absolute; left:0; right:0; height:2px; background:linear-gradient(90deg,transparent,#f6d997,transparent); box-shadow:0 0 18px #d99aff; animation:scan 2s ease-in-out infinite; }.pm-game .scan-frame{ position:absolute; inset:7%; border:1px solid rgba(246,217,151,.45); border-radius:24px; }.pm-game .progress-row{ display:flex; justify-content:space-between; font-size:13px; color:var(--muted); }.pm-game .bar{ height:7px; margin-top:9px; border-radius:9px; overflow:hidden; background:rgba(255,255,255,.1); }.pm-game .bar > i{ display:block; height:100%; width:0; border-radius:inherit; background:linear-gradient(90deg,var(--violet),var(--gold)); transition:width .35s ease; }.pm-game .results{ padding-top:18px; padding-bottom:20px; }.pm-game .result-image{ position:relative; height:245px; margin:18px 0; overflow:hidden; border-radius:25px; }.pm-game .result-image img{ width:100%; height:100%; object-fit:cover; filter:saturate(.86) brightness(.78); }.pm-game .result-image::after{ content:""; position:absolute; inset:0; background:linear-gradient(transparent,rgba(15,9,35,.68)); }.pm-game .overlay-lines{ position:absolute; z-index:2; inset:0; width:100%; height:100%; }.pm-game .overlay-lines path{ fill:none; stroke-width:2.4; stroke-linecap:round; filter:drop-shadow(0 0 4px currentColor); stroke-dasharray:200; animation:draw 1.5s ease both; }.pm-game .reading-intro{ padding:18px; margin-bottom:12px; border:1px solid rgba(243,213,138,.22); border-radius:19px; background:linear-gradient(135deg,rgba(243,213,138,.1),rgba(168,121,255,.08)); line-height:1.52; color:#e8dfef; font-size:14px; }.pm-game .score-pill{ display:inline-flex; align-items:center; gap:7px; padding:7px 10px; margin-bottom:10px; border-radius:20px; background:rgba(243,213,138,.12); color:var(--gold); font-size:12px; font-weight:700; }.pm-game .line-list{ display:grid; gap:9px; }.pm-game .line-card{ width:100%; border:1px solid rgba(255,255,255,.11); border-radius:18px; background:rgba(28,18,51,.72); color:var(--ink); padding:16px; text-align:left; cursor:pointer; }.pm-game .line-head{ display:flex; align-items:center; justify-content:space-between; }.pm-game .line-title{ display:flex; align-items:center; gap:10px; font-weight:700; }.pm-game .dot{ width:10px; height:10px; border-radius:50%; box-shadow:0 0 9px currentColor; }.pm-game .line-summary{ display:block; margin:10px 0 0; color:#e3d9e9; font-size:13px; line-height:1.45; }.pm-game .line-summary strong{ color:var(--gold); }.pm-game .line-card p{ display:block; margin:12px 0 0; padding-top:12px; border-top:1px solid rgba(255,255,255,.09); color:#c9bfd6; font-size:13px; line-height:1.58; }.pm-game .line-card p strong{ color:#f3d58a; }.pm-game .line-card.open{ border-color:rgba(243,213,138,.55); box-shadow:0 0 0 1px rgba(243,213,138,.14); }.pm-game .line-card.open p{ animation:fade .25s both; }.pm-game .line-meaning-intro{ margin:0 0 12px; font-size:13px; }.pm-game .line-meaning-intro .score-pill{ margin-bottom:8px; }.pm-game .prediction{ margin:14px 0; padding:20px; border-radius:20px; color:#281936; background:linear-gradient(135deg,#f3d58a,#f0b6a7); }.pm-game .prediction small{ font-weight:800; letter-spacing:1.5px; text-transform:uppercase; }.pm-game .prediction h3{ font-size:24px; margin:6px 0; }.pm-game .prediction p{ margin:0; font-size:14px; line-height:1.5; }.pm-game .result-actions{ display:grid; grid-template-columns:1fr 1fr; gap:9px; }.pm-game .toast{ position:fixed; z-index:50; left:50%; bottom:max(6vh,env(safe-area-inset-bottom)); transform:translate(-50%,20px); opacity:0; width:max-content; max-width:86vw; padding:11px 16px; border-radius:20px; background:#f8e7bd; color:#281936; font-size:13px; font-weight:700; transition:.25s; pointer-events:none; }.pm-game .toast.show{ opacity:1; transform:translate(-50%,0); }.pm-game .hidden{ display:none !important; }@keyframes enter{ from{opacity:0;transform:translateY(10px)} }@keyframes fade{ from{opacity:0} }@keyframes pulse{ 50%{transform:scale(1.09);opacity:.65} }@keyframes scan{ 0%,100%{top:8%} 50%{top:90%} }@keyframes draw{ from{stroke-dashoffset:200} to{stroke-dashoffset:0} }.pm-game .setup h2,.pm-game .capture h2,.pm-game .results h2,.pm-game .history h2{ font-size:34px; line-height:1.08; }.pm-game .setup,.pm-game .capture,.pm-game .history{ padding-top:18px; padding-bottom:28px; }.pm-game .mode-grid,.pm-game .dominance-grid{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:18px 0; }.pm-game .mode-card,.pm-game .dominance-card,.pm-game .history-card{ border:1px solid rgba(255,255,255,.13); border-radius:18px; background:rgba(28,18,51,.72); color:var(--ink); padding:16px; text-align:left; cursor:pointer; }.pm-game .mode-card.selected,.pm-game .dominance-card.selected{ border-color:var(--gold); background:rgba(243,213,138,.12); box-shadow:0 0 0 1px rgba(243,213,138,.25); }.pm-game .mode-card strong,.pm-game .dominance-card strong{ display:block; margin-bottom:5px; }.pm-game .mode-card small,.pm-game .dominance-card small,.pm-game .muted{ color:var(--muted); font-size:12px; line-height:1.4; }.pm-game .section-label{ margin:22px 0 8px; color:var(--gold); font-size:11px; letter-spacing:1.6px; text-transform:uppercase; font-weight:800; }.pm-game .capture-instructions{ display:grid; gap:7px; margin:18px 0; padding:16px; border:1px solid rgba(255,255,255,.11); border-radius:18px; background:rgba(28,18,51,.62); color:#d4cadd; font-size:13px; }.pm-game .capture-instructions span::before{ content:'✓'; color:var(--gold); margin-right:8px; }.pm-game .hand-stepper{ display:flex; gap:8px; margin:20px 0; }.pm-game .hand-step{ flex:1; padding:10px; border-radius:14px; text-align:center; font-size:12px; color:var(--muted); background:rgba(255,255,255,.07); }.pm-game .hand-step.active{ color:#2b1835; background:var(--gold); font-weight:800; }.pm-game .quality-card{ margin:16px 0; padding:16px; border-radius:18px; background:rgba(28,18,51,.72); border:1px solid rgba(255,255,255,.12); }.pm-game .quality-check{ display:flex; gap:9px; padding:7px 0; color:#c8bdd1; font-size:13px; }.pm-game .quality-check.ok{ color:#afe5c8; }.pm-game .quality-check.bad{ color:#ffb6a8; }.pm-game .pipeline{ display:grid; gap:10px; margin:24px 0; }.pm-game .pipeline-item{ display:flex; align-items:center; gap:12px; padding:11px 13px; border-radius:14px; background:rgba(255,255,255,.06); color:#aaa1b7; font-size:13px; }.pm-game .pipeline-item.active{ color:var(--ink); border:1px solid rgba(243,213,138,.36); background:rgba(243,213,138,.1); }.pm-game .pipeline-item.done{ color:#b5e4cc; }.pm-game .pipeline-dot{ width:10px; height:10px; border-radius:50%; background:#655a71; }.pm-game .active .pipeline-dot{ background:var(--gold); box-shadow:0 0 10px var(--gold); }.pm-game .done .pipeline-dot{ background:#8de0b1; }.pm-game .notice{ padding:14px 16px; margin:14px 0; border-radius:17px; color:#d9cee4; background:rgba(168,121,255,.11); border:1px solid rgba(168,121,255,.22); font-size:13px; line-height:1.5; }.pm-game .notice strong{ color:var(--gold); }.pm-game .viewer{ margin:16px 0; }.pm-game .viewer-tabs{ display:flex; gap:8px; margin-bottom:9px; }.pm-game .viewer-tab{ flex:1; padding:10px; border:1px solid rgba(255,255,255,.13); border-radius:13px; color:var(--muted); background:rgba(255,255,255,.06); cursor:pointer; }.pm-game .viewer-tab.active{ color:#2a1835; background:var(--gold); font-weight:800; }.pm-game .annotated-palm{ position:relative; height:310px; overflow:hidden; border-radius:23px; background:#191226; border:1px solid rgba(255,255,255,.14); }.pm-game .annotated-palm img{ width:100%; height:100%; object-fit:cover; }.pm-game .annotated-palm.original img{ filter:none; }.pm-game .annotated-palm svg{ position:absolute; inset:0; width:100%; height:100%; pointer-events:auto; }.pm-game .annotated-palm path{ fill:none; vector-effect:non-scaling-stroke; stroke-width:2.7; stroke-linecap:round; filter:drop-shadow(0 0 4px currentColor); cursor:pointer; }.pm-game .annotated-palm path.dim{ opacity:.18; }.pm-game .annotated-palm path.focus{ stroke-width:5; opacity:1; }.pm-game .viewer-caption{ padding:10px 2px; color:#c8bdd1; font-size:12px; }.pm-game .fact-card{ padding:15px; margin:9px 0; border:1px solid rgba(255,255,255,.11); border-radius:17px; background:rgba(28,18,51,.7); }.pm-game .fact-card h3{ font-size:18px; margin-bottom:8px; }.pm-game .fact-card p,.pm-game .fact-card li{ color:#c9bfd6; font-size:13px; line-height:1.5; }.pm-game .fact-card ul{ padding-left:18px; margin:8px 0 0; }.pm-game .confidence{ display:inline-flex; margin-top:7px; padding:5px 8px; border-radius:12px; background:rgba(243,213,138,.1); color:var(--gold); font-size:11px; }.pm-game .report-nav{ display:flex; gap:8px; overflow:auto; padding:3px 0 10px; scrollbar-width:none; }.pm-game .report-nav button{ flex:none; border:1px solid rgba(255,255,255,.12); border-radius:14px; padding:9px 11px; color:var(--muted); background:rgba(255,255,255,.06); cursor:pointer; }.pm-game .report-nav button.active{ color:#2a1835; background:var(--gold); }.pm-game .history-card{ margin:10px 0; cursor:default; }.pm-game .history-card strong{ display:block; margin-bottom:6px; }.pm-game .history-empty{ text-align:center; padding:35px 15px; color:var(--muted); }.pm-game .danger-note{ color:#ffbdb2; font-size:12px; line-height:1.45; }@media (max-width:360px){.pm-game .mode-grid,.pm-game .dominance-grid{ grid-template-columns:1fr; }.pm-game .annotated-palm{ height:260px; }}@media (min-width:700px){.pm-game .app{ padding-left:24px; padding-right:24px; }}@media (min-width:1000px) and (min-height:560px){.pm-game .app{zoom:1.3;width:min(100%,660px);min-height:calc(100dvh / 1.3);}.pm-game .subtitle{max-width:460px;}}.pm-game .annotated-palm{ height:auto !important; max-width:440px; margin:0 auto; }.pm-game .annotated-palm img{ display:block; width:100%; height:auto; object-fit:contain; }.pm-game .viewer-tab small.tab-role{ display:block; font-size:10.5px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; opacity:.75; margin-top:2px; }.pm-game .shape-card p{ margin:8px 0; }.pm-game .overlay-lines path.estimated,.pm-game .annotated-palm svg path.estimated{ stroke-dasharray:4 5 !important; animation:none !important; opacity:.8; }.pm-game,.pm-game{background:#0A0B18!important}.pm-game #game-container,.pm-game #game-container.app,.pm-game .app{background:radial-gradient(ellipse at 50% -18%,#24204d 0%,#111126 37%,#0A0B18 76%)!important}.pm-game #game-container::before,.pm-game #game-container::after,.pm-game .app::before,.pm-game .app::after{background-image:none!important}.pm-game #game-container>img.bg,.pm-game #game-container .bg-image,.pm-game .bg-image{display:none!important}
.pm-game #game-container{height:100%}
