/* ver63: bright editorial card layout replaces the game backdrop; existing result/lottery classes remain. */
:root{color-scheme:light;--bg:#f6f7fc;--ink:#18213f;--muted:#626e87;--card:#ffffff;--line:#dfe4ef;--accent:#243561;--gold:#875e10;--surface:#eef2f9;--hover:#e4eaf6;--warning-bg:#fff3d9;--warning-ink:#77500b;--danger-bg:#fff0f4;--danger-ink:#a92349;--shadow:#17314818;--on-accent:#ffffff}
:root[data-theme="dark"]{color-scheme:dark;--bg:#10182a;--ink:#edf4ff;--muted:#a9bbd1;--card:#1a253d;--line:#354361;--accent:#b6cafb;--gold:#efcf8f;--surface:#25334f;--hover:#304260;--warning-bg:#36281a;--warning-ink:#f4ce76;--danger-bg:#331c2d;--danger-ink:#ffabc6;--shadow:#00000055;--on-accent:#061d26}
*{box-sizing:border-box}
body{font-size:14px;margin:0;padding:0 0 max(20px,env(safe-area-inset-bottom));background-color:var(--bg);color:var(--ink);font-family:Pretendard,'Noto Sans KR',system-ui,sans-serif}
/* ver24: 헤더 외곽은 화면 전체, 내부만 본문과 정렬한다. 떠 있는 헤더와 고정 메뉴 여백을 대체한다. */
.site-header{position:sticky;top:0;z-index:30;width:100%;margin:0 0 20px;background:var(--card);border-bottom:1px solid var(--card);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);box-shadow:0 6px 24px var(--shadow)}
.header-inner{width:min(1120px,100%);min-height:58px;margin:auto;padding:7px 24px;display:grid;grid-template-columns:minmax(36px,1fr) auto minmax(36px,1fr);align-items:center;gap:12px}
.brand{display:flex;align-items:center;gap:8px;justify-self:center;min-width:0;text-decoration:none;color:var(--ink)}
/* ver61: Shared header/footer brand copy, separate from the logo artwork. */
.brand-copy{display:flex;flex-direction:column;gap:3px;white-space:nowrap}.brand-copy strong{font-size:28px;line-height:1.1}.brand-copy em{font-size:14px;line-height:1.3;color:var(--muted)}
/* ver56: supplied full-color logo replaces the monochrome SVG and inversion filter. */
/* ver57: ver58: text-free yin-yang and lottery icon replaces the horizontal wordmark. */
.brand-logo{display:block;width:48px;height:48px;object-fit:contain}
nav{display:flex;gap:20px;align-items:center}
nav a{color:var(--ink);text-decoration:none;font-size:14px}
button,.primary{border:0;cursor:pointer;font:inherit}
.ghost{background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:10px 16px}
.primary{display:inline-block;background:linear-gradient(135deg,#354777,#202d54);color:#ffffff;box-shadow:0 4px 20px var(--shadow);border-radius:10px;padding:13px 22px;text-decoration:none}
.game-hero{position:relative;margin:0;overflow:hidden;border-radius:20px;background:#ffffff;width:270px;max-width:100%;justify-self:center}
.game-hero img{display:block;width:100%;height:auto;max-height:270px;aspect-ratio:1;object-fit:contain;background:#fff}
.game-hero figcaption{padding:12px 16px;background:var(--card);color:var(--gold);font-size:14px}
.game-scene{display:flex;align-items:center;justify-content:space-between;width:min(1050px,calc(100% - 24px));margin:12px auto 20px;border:1px solid var(--line);border-radius:20px;background:var(--card);overflow:hidden;box-shadow:0 8px 28px var(--shadow)}
.game-scene>div{padding:16px 20px;min-width:0}.game-scene h2{font-size:16px;margin:8px 0}.game-scene p{font-size:14px;color:var(--muted);margin:0}.game-scene img{width:30%;max-width:210px;height:126px;object-fit:cover;flex-shrink:0}
.eyebrow{font-size:12px;letter-spacing:2px;color:var(--gold);font-weight:800}
.hero h1{font-size:28px;line-height:1.35;letter-spacing:-1px;margin:14px 0}
.hero p{font-size:14px;line-height:1.8;color:var(--muted);max-width:650px}
.panel,.three article,.notice{background:var(--card);border:1px solid var(--line);border-radius:16px;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.panel{max-width:1050px;margin:20px auto;padding:26px;box-shadow:0 16px 45px var(--shadow)}
.section-title{display:flex;gap:16px;align-items:flex-start}
.section-title>span{color:var(--gold);font-weight:800}
.section-title h1{margin:0;font-size:28px}
.section-title h2{margin:0;font-size:16px}
.section-title p{margin:6px 0;color:var(--muted)}
.formgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}
.formgrid label{font-size:14px;color:var(--muted)}
input,select,textarea{width:100%;min-width:0;margin-top:7px;padding:13px 14px;border:1px solid var(--line);border-radius:16px;background:var(--card);color:var(--ink);font:inherit;font-size:16px}
.full{grid-column:1/-1}
.three{max-width:1050px;margin:40px auto;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.three article{padding:25px}
.three b{color:var(--gold);font-size:12px}
.three h3{font-family:inherit;font-size:16px}
.three p,.notice p{color:var(--muted);line-height:1.7}
.notice{max-width:1050px;margin:40px auto 80px;padding:25px}
.result{margin-top:30px;border-top:1px solid var(--line);padding-top:28px}
.pillars,.elements,.balls,.combos{display:flex;gap:10px;flex-wrap:wrap}
.pillar{background:var(--card);padding:12px 16px;border-radius:16px;text-align:center}
.pillar strong{display:block;font-size:24px;font-family:monospace}
.bar{display:flex;align-items:center;gap:8px;margin:7px 0}
.bar i{height:8px;background:var(--accent);display:block;border-radius:9px}
/* ver25: 번호 색상은 이 정의 하나로 통일. 채점 일치는 외곽선으로 표시하여 번호 구간색을 보존한다. */
.ball{width:43px;height:43px;border-radius:50%;display:inline-grid;place-items:center;background:var(--ball-bg);color:var(--ball-ink);font-weight:800;flex-shrink:0}
.ball:is([data-number="1"],[data-number="2"],[data-number="3"],[data-number="4"],[data-number="5"],[data-number="6"],[data-number="7"],[data-number="8"],[data-number="9"],[data-number="10"]){--ball-bg:#facc15;--ball-ink:#000000}
.ball:is([data-number="11"],[data-number="12"],[data-number="13"],[data-number="14"],[data-number="15"],[data-number="16"],[data-number="17"],[data-number="18"],[data-number="19"],[data-number="20"]){--ball-bg:#2563eb;--ball-ink:#ffffff}
.ball:is([data-number="21"],[data-number="22"],[data-number="23"],[data-number="24"],[data-number="25"],[data-number="26"],[data-number="27"],[data-number="28"],[data-number="29"],[data-number="30"]){--ball-bg:#dc2626;--ball-ink:#ffffff}
.ball:is([data-number="31"],[data-number="32"],[data-number="33"],[data-number="34"],[data-number="35"],[data-number="36"],[data-number="37"],[data-number="38"],[data-number="39"],[data-number="40"]){--ball-bg:#000000;--ball-ink:#ffffff}
.ball:is([data-number="41"],[data-number="42"],[data-number="43"],[data-number="44"],[data-number="45"]){--ball-bg:#15803d;--ball-ink:#ffffff}
.combo{padding:14px;background:var(--card);border-radius:16px;margin:8px 0}
.combo b{display:inline-block;width:75px}
.warning{padding:14px;background:var(--warning-bg);border-radius:16px;color:var(--warning-ink);margin-top:16px}
.modal{z-index:100;display:none;position:fixed;inset:0;width:100%;height:100dvh;max-width:none;max-height:none;margin:0;border:0;background:#0008;place-items:center;padding:20px}
.modal[open]{display:grid}
.modalbox{background:var(--card);border-radius:16px;padding:28px;width:min(430px,100%);position:relative;max-height:calc(100dvh - 36px);overflow:auto}
.modalbox input{margin:6px 0}
.x{position:absolute;right:15px;top:12px;background:none;font-size:26px}
.actions{display:flex;gap:10px;margin-top:12px}
.postform{margin:25px 0}
.postform textarea{min-height:110px}
.posts article{padding:20px 0;border-top:1px solid var(--line)}
.posts h3{margin:0 0 6px}
.posts small{color:var(--muted)}
.result-hero{padding:22px;background:var(--card);border-radius:16px;margin-bottom:24px}
/* ver39: 리포트 요약의 기존 크기를 두 배로 변경한다. 일반 본문·상세 풀이는 기존 크기를 유지한다. */
.result-hero h2{font-family:inherit;font-size:32px;margin:8px 0;line-height:1.4}
.result-hero>.eyebrow{font-size:24px;letter-spacing:1px}
.result-hero>p{font-size:28px;line-height:1.6}
.result-title{font-family:inherit;font-size:16px;margin:34px 0 14px;padding-top:18px;border-top:1px solid var(--line)}
.reading-grid,.fortune-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:14px 0}
.reading-card{border:1px solid var(--line);background:var(--card);border-radius:16px;padding:17px}
.reading-card h4{margin:0 0 10px;font-size:16px}
/* ver40: 모든 운세 풀이 카드의 본문을 14px에서 20px로 확대한다. 입력·표·번호의 기존 크기는 유지한다. */
.reading-card p{margin:0 0 12px;color:var(--muted);line-height:1.8;font-size:20px}
.metrics{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}
.metric{background:var(--card);border-radius:16px;padding:9px 12px}
.metric b{margin-right:7px}
.tag{display:inline-block;background:var(--card);color:var(--accent);border-radius:999px;padding:7px 10px;margin:3px;font-size:13px}
.detail-box{padding:15px 0;border-bottom:1px dashed var(--line)}
.detail-box p{color:var(--muted);line-height:1.7}
.daewoon{display:grid;grid-template-columns:repeat(8,1fr);gap:7px}
.dae{background:var(--card);border-radius:13px;padding:12px 7px;text-align:center}
.dae b,.dae strong,.dae small{display:block}
.dae strong{font-family:inherit;font-size:20px;margin:5px 0}
.dae small{color:var(--muted);font-size:10px}
.scoreline{display:flex;align-items:baseline;gap:8px;margin-bottom:9px}
.scoreline strong{font-size:30px;font-family:monospace}
.scoreline span{color:var(--gold);font-weight:700}
.luck-pillar{font-family:inherit;font-size:24px;margin-bottom:8px}
.luck-pillar small{font-family:inherit;color:var(--gold);font-size:13px}
.muted{color:var(--muted)}
.lotto-data{padding:18px;background:var(--card);border-radius:16px;margin:15px 0}
.lotto-data h4{margin-top:0}
[hidden]{display:none}
h3,h4{font-size:16px}
button:disabled{opacity:.6;cursor:wait}
fieldset{border:1px solid var(--line);border-radius:16px;padding:18px}
fieldset .formgrid{margin-top:0}
.profile-option{display:flex;align-items:center;gap:8px}
.profile-option input{width:auto;margin:0;min-width:18px;height:18px;accent-color:var(--accent);padding:0}
.table-scroll{overflow:auto;max-height:480px}
table{width:100%;border-collapse:collapse}
th,td{padding:10px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
th{background:var(--card);position:sticky;top:0}
.lotto-overview{margin:24px 0;padding:24px;border:1px solid var(--line);border-radius:16px;background:var(--card)}
.lotto-overview h2{font-size:16px}
.number-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.number-card{min-width:0;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:12px}
.number-card summary{cursor:pointer;list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.number-card summary small{width:100%;color:var(--muted)}
.number-card[open]{grid-column:span 2}
.number-card p{font-size:14px;line-height:1.6}
.component{border-top:1px solid var(--line);padding:9px 0}
.component b,.component span{display:block}
.component span{color:var(--gold);font-size:12px}
.combo p{font-size:14px;margin-bottom:5px}
.combo small{color:var(--muted)}
.long-reading{display:grid;gap:18px;margin:24px 0}
.reading-prose{padding:18px}
.reading-prose p{line-height:1.9}
.reading-prose p:last-child{margin-bottom:0}
.daily-pulse{max-width:1050px;margin:20px auto 0;padding:18px 22px;display:grid;grid-template-columns:1fr 1fr;gap:22px;background:var(--card);color:var(--ink);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:16px;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.daily-pulse h2{font-size:16px;margin:10px 0}
.daily-pulse p{font-size:14px;line-height:1.8}
/* ver53: old inline-link color is removed; shared shortcut cards own their colors. */
.pulse-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px}
.pulse-draw .balls{margin-top:14px;align-items:center}
.cross-report{margin-top:32px;border:1px solid var(--line);border-radius:16px;padding:24px;background:var(--card)}
.cross-heading h2{font-size:16px;font-family:inherit;margin:10px 0}
.cross-heading p,.cross-columns p{line-height:1.8}
.cross-columns{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:24px 0}
.cross-columns article{min-width:0}
.cross-columns .pillar{padding:10px}
.cross-details{padding:16px 0}
.cross-details>summary{font-size:16px;cursor:pointer;font-weight:700}
.report-actions{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0}
.visit-journal{border-top:1px solid var(--line);margin-top:30px;padding-top:18px}
.visit-journal p{line-height:1.8;color:var(--muted)}
#journalItems{display:grid;gap:12px}
#journalItems article{padding:16px;border:1px solid var(--line);border-radius:12px}
.tarot-face{min-height:190px;background:var(--card);color:var(--gold);border:6px double #a890ff;border-radius:16px;padding:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;margin-bottom:15px}
.tarot-face span{font-size:30px}
.tarot-face b{font-size:16px}
.tarot-face small{font-size:14px}
.workspace-tabs{display:flex;flex-direction:column;gap:4px;align-items:stretch;margin:8px 0;position:static}
.workspace-tabs a{padding:11px 12px;border:1px solid transparent;border-radius:10px;font-size:14px;color:var(--muted);min-height:44px}
.workspace-tabs a[aria-current="page"]{background:var(--accent);color:var(--on-accent)}
.workspace-section{margin:0;padding:22px;border:1px solid var(--line);border-radius:16px;background:var(--card);min-width:0}
.workspace-section>h2{font-size:28px;font-family:inherit;margin:0 0 14px}
.workspace-section p{line-height:1.8}
.workspace-section label{display:block;margin:14px 0}
.workspace-section select,.workspace-section input{max-width:320px}
.workspace-metrics{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}
.workspace-metrics span{background:var(--card);border-radius:10px;padding:10px 14px}
.dashboard-combos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.dashboard-combos .combo b{width:auto;margin-bottom:12px}
.graded-game{padding:20px 0;border-bottom:1px solid var(--line)}
.graded-game .balls{margin:12px 0}
.matched-ball{outline:3px solid var(--accent);outline-offset:3px}
.day-reading,.backtest-row{margin:18px 0;padding:16px;border:1px solid var(--line);border-radius:12px}
.day-reading>summary,.backtest-row>summary{cursor:pointer;font-size:16px;font-weight:700}
.day-reading .reading-card{margin-top:14px}
.reason-cell{white-space:normal;min-width:260px;line-height:1.7}
.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin-top:20px}
.calendar-grid>b{text-align:center;padding:10px 0}
.calendar-day{display:flex;flex-direction:column;gap:8px;align-items:flex-start;text-align:left;min-height:140px;padding:10px;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:10px}
.calendar-day span{font-size:16px}
.calendar-day small{font-size:12px;overflow-wrap:anywhere}
#calendarDetail .reading-card{margin-top:14px}
#workspaceStatus{color:var(--accent);line-height:1.8}
/* ver33: 실제 간지·오행 숫자를 표/도식/운 카드로 표시한다. 긴 문장을 시각 표로 대체하고 공 색 규칙은 그대로 유지한다. */
.saju-visual-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:start}
.saju-matrix{width:100%;border-collapse:collapse;table-layout:fixed;text-align:center}.saju-matrix caption{font-size:16px;font-weight:700;padding:10px}.saju-matrix th,.saju-matrix td{border:1px solid var(--line);padding:6px 3px;font-size:12px;word-break:keep-all;white-space:normal;text-align:center}.saju-matrix th{color:var(--muted);position:static}.saju-matrix td:nth-child(3){background:var(--surface)}
.ganji-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:36px;width:clamp(36px,5vw,58px);margin:2px auto;padding:3px;border:1px solid #0003;border-radius:6px;line-height:1.1;background:var(--element-color);color:var(--element-ink)}.ganji-tile b{font-size:28px;font-weight:700}.ganji-tile small{font-size:12px;margin:3px 0}
[data-element="목"]{--element-color:#27894c;--element-ink:#fff}[data-element="화"]{--element-color:#cc3540;--element-ink:#fff}[data-element="토"]{--element-color:#edbd42;--element-ink:#171717}[data-element="금"]{--element-color:#f5f5f5;--element-ink:#202020}[data-element="수"]{--element-color:#173148;--element-ink:#fff}
.hidden-stem{display:inline-block;padding:2px;border-radius:3px;margin:1px;background:var(--element-color);color:var(--element-ink);font-size:11px}
.element-bars meter::-webkit-meter-optimum-value{background:var(--element-color)}
.yin-yang-strip meter::-webkit-meter-optimum-value{background:#173148}
.yin-yang-strip{display:flex;align-items:center;gap:8px;font-size:12px;margin:14px 0}.yin-yang-strip meter{flex:1;min-width:30px}
.element-map{display:block;width:100%;max-height:290px}.element-map circle{fill:var(--element-color);stroke:var(--line);stroke-width:2}.element-map text{fill:var(--element-ink);font-size:16px;font-weight:700}.element-map .element-percent{font-size:12px}.generate-edge{stroke:#16866f;stroke-width:2.5}.control-edge{stroke:#c5394c;stroke-width:2.5}.element-map[data-relation="generate"] .control-edge,.element-map[data-relation="control"] .generate-edge{display:none}
.relation-controls{display:flex;gap:8px;justify-content:center}.relation-controls button{padding:7px 18px;border-radius:8px;background:var(--surface);color:var(--ink)}.relation-controls button[aria-pressed="true"]{background:var(--accent);color:var(--on-accent)}
.element-bars{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}.element-bars>div{display:flex;flex-direction:column;gap:4px;align-items:center;font-size:12px}.element-bars meter{width:100%}
/* ver34: 가로 카드의 contain이 세로 휠까지 차단하던 원인을 제거한다. 네이티브 스크롤을 유지하며 별도 휠 이벤트는 추가하지 않는다. */
.visual-luck{margin-top:16px}.visual-luck summary,.easy-reading-fold summary{cursor:pointer;font-weight:700;padding:10px 0}.luck-strip{display:flex;gap:8px;overflow-x:auto;overflow-y:hidden;padding:6px 0 12px;overscroll-behavior-x:auto;overscroll-behavior-y:auto}.luck-card{flex:0 0 82px;text-align:center;border:1px solid var(--line);border-radius:10px;padding:8px 3px;background:var(--card)}.luck-card[data-current="true"]{border:2px solid var(--accent);background:var(--surface)}.luck-card>small{display:block;font-size:11px;margin:4px 0}
.fortune-catalog{max-width:1050px;margin:16px auto;padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--card)}.fortune-catalog h2{font-size:16px}.fortune-catalog summary{padding:10px 0;color:var(--accent);font-weight:700;cursor:pointer}.fortune-card-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.fortune-launch{display:flex;align-items:center;gap:14px;text-align:left;border:1px solid var(--line);border-radius:12px;padding:10px;background:var(--card);color:var(--ink);min-width:0}.fortune-launch img:not(.starter-art){width:72px;height:60px;object-fit:cover;border-radius:8px}.fortune-launch>span:nth-child(2){flex:1;min-width:0}.fortune-launch b{display:block;font-size:16px}.fortune-launch small{display:block;margin-top:6px;color:var(--muted);font-size:12px}.fortune-launch[aria-pressed="true"]{border-color:var(--accent)}
.report-summary{background:color-mix(in srgb,#498ecc 6%,var(--card));border:1px solid var(--line);border-left:5px solid #498ecc;padding:22px;border-radius:16px;margin:16px 0 24px}
.report-summary h3{font-size:16px}
.report-summary p,.report-summary li{font-size:20px;line-height:1.8}
.report-chapter p,.easy-reading-fold p,.evidence-reading p,.day-reading p{font-size:20px;line-height:1.8}
.report-summary ul{padding-left:20px}
.combo-explanation,.evidence-reading{padding:12px 0;line-height:1.8}
.combo-explanation>summary,.evidence-reading>summary{cursor:pointer;font-size:14px;font-weight:700;color:var(--accent)}
.combo-basis{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.combo-basis p{padding:12px;background:var(--card);border-radius:10px;overflow-wrap:anywhere}
.record-editor{border:1px solid var(--line);border-radius:16px;padding:20px;margin:18px 0}
.record-editor label{display:block}
.record-status{color:var(--accent)}
#benchmarkHistory{display:grid;gap:10px;margin:16px 0}
.share-preview{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-top:18px}
.share-preview img{display:block;width:100%;max-width:360px;height:auto;border-radius:12px}
.share-preview a{color:var(--accent);font-weight:700}
.number-picker{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:8px;margin:18px 0}
.number-picker button{padding:12px 4px;background:var(--accent);color:var(--on-accent);border-radius:10px}
.digest-text{overflow-wrap:anywhere}
.family-profile{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:14px 0;border-bottom:1px solid var(--line)}
.data-status{padding:10px;border-radius:16px;background:var(--card)}
.data-status[data-state="stale"],.data-status[data-state="failed"]{border-left:4px solid #a890ff}
.luck-timeline{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0}
.timeline-point{border-left:3px solid var(--line);padding:16px;background:var(--card);border-radius:10px;min-width:0}
.timeline-point p{line-height:1.8}
.timeline-active{border-left-color:var(--accent)}
.selection-flow{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;padding:0;list-style:none}
.selection-flow li{padding:14px;background:var(--card);border-radius:16px;min-width:0}
.selection-flow p{line-height:1.8}
.trace-meter{display:grid;grid-template-columns:150px 1fr;align-items:center;gap:12px;margin:12px 0}
.trace-meter meter{width:100%;height:22px}
.engagement-tools{margin:24px 0;padding:20px;border:1px solid var(--line);border-radius:16px}
.engagement-tools h3{font-size:16px;margin:24px 0 12px}
.engagement-tools p{font-size:14px;line-height:1.8}
.diary-entry{padding:16px;margin:12px 0;border:1px solid var(--line);border-radius:16px;overflow-wrap:anywhere}
.start-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.start-columns article{min-width:0}
.month-metrics{display:flex;flex-wrap:wrap;gap:12px;margin:16px 0}
.month-metrics span{padding:10px;background:var(--card);border-radius:16px}
.birthplace-field{min-width:0;display:grid;gap:8px}
.birthplace-dialog{width:min(860px,calc(100vw - 32px));max-height:90vh;box-sizing:border-box;overflow:auto;padding:22px;border:1px solid var(--line);border-radius:16px;background:var(--card)}
.birthplace-dialog::backdrop{background:rgba(20,35,28,.5)}
.birthplace-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
.birthplace-heading h2{font-size:16px;margin:0}
.birthplace-dialog p{font-size:14px;line-height:1.7}
.birthplace-map{height:380px;width:100%;border-radius:10px;isolation:isolate;background:#172a40}
html{scroll-padding-top:84px}
main{width:min(1120px,100%);margin:auto;padding:0 24px 24px;min-height:55vh}
a{color:var(--accent)}
/* ver38: 모든 펼침 제목의 색상은 공통 정의 하나에서 구분한다. 기존 동일 배경을 직접 대체하며 추가 클릭 이벤트는 없다. */
details{--fold-hue:265}
details:nth-of-type(4n+2){--fold-hue:165}details:nth-of-type(4n+3){--fold-hue:35}details:nth-of-type(4n){--fold-hue:335}
details:is(.cross-report,.cross-details,.combo-explanation,.chart-data){--fold-hue:205}details:is(.shared-saju,.visual-luck,.calculation-settings){--fold-hue:165}
summary{cursor:pointer;border-left:5px solid hsl(var(--fold-hue,265) 55% 54%);background:color-mix(in srgb,hsl(var(--fold-hue,265) 55% 54%) 13%,var(--card));border-radius:8px;padding:12px;line-height:1.6}
/* ver38: 비교 지표는 0~100 동일 축으로 표시한다. 원본 표는 접어서 초기 스크롤을 줄인다. */
/* ver41: 전용 분석실의 실제 출현 열은 한 가로 스크롤 영역만 사용한다. 휠/터치를 가로채지 않는다. */
.lab-number-grid,.lab-group-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:16px}.lab-number{padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--card)}.lab-number .score-chart{margin:12px 0;padding:10px}.lab-number .score-bar{grid-template-columns:50px minmax(0,1fr) 45px}/* ver43: a single scrollable positional table replaces stacked omission cards. */
.lab-nak-scroll{max-height:650px;overflow:auto;border:1px solid var(--line);border-radius:12px}.lab-nak-table{border-collapse:collapse;width:100%;min-width:340px;table-layout:fixed}.lab-nak-table th,.lab-nak-table td{text-align:center;border:1px solid var(--line);padding:6px 2px;height:48px}.lab-nak-table thead th{position:sticky;top:0;z-index:2;background:var(--surface)}.lab-nak-table th:first-child{width:64px}.lab-nak-table small{display:block;font-size:11px;font-weight:400}.lab-nak-number{position:relative;display:inline-block}.lab-nak-number .ball{width:32px;height:32px;font-size:14px}.lab-nak-number.saju-favored .ball{outline:2px solid var(--accent);outline-offset:2px}.lab-nak-number sup{position:absolute;right:-5px;top:-9px;color:#db2777;font-size:11px;font-weight:800}.lab-nak-number sub{position:absolute;right:-4px;bottom:-5px;background:var(--ink);color:var(--card);font-size:10px;line-height:12px;padding:0 2px}.lab-basic-rule input[type="checkbox"]{width:auto;min-height:0}.lab-basic-rule{min-width:0}.lab-basic-rule label{display:block}#labDbGroups input{min-width:64px}#labUserNumbers [aria-pressed="true"]{background:var(--accent);color:var(--on-accent)}
.score-chart{display:grid;gap:12px;width:100%;padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--card)}
.score-bar{display:grid;grid-template-columns:90px minmax(0,1fr) 32px;align-items:center;gap:10px}.score-bar meter{width:100%;height:18px;accent-color:var(--series)}.score-bar meter::-webkit-meter-optimum-value{background:var(--series)}.score-bar b{color:var(--ink)}
.score-meter{width:100%;height:18px;accent-color:var(--accent)}
.trend-chart{margin:18px 0;padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--card);min-width:0}.trend-chart figcaption{font-size:16px;font-weight:700}.trend-chart svg{display:block;width:100%;height:auto;margin-top:12px;overflow:visible}.trend-chart text{font-size:14px;fill:var(--ink)}.chart-grid line{stroke:var(--line);stroke-width:1}.trend-chart polyline{stroke:var(--series);stroke-width:2;vector-effect:non-scaling-stroke}.trend-chart rect{fill:var(--series)}.trend-chart label{display:flex;gap:12px;align-items:center;margin-top:10px}.trend-chart select{width:auto;margin:0;max-width:100%}.chart-legend{display:flex;flex-wrap:wrap;gap:12px;margin:12px 0}.chart-legend span::before{content:"";display:inline-block;width:10px;height:10px;background:var(--series);margin-right:6px;border-radius:50%}.trend-chart small{color:var(--muted)}.chart-data{margin:16px 0}.chart-data>label{display:block;margin:16px 0}.day-chart-title{font-size:16px;margin:16px 0}.period-charts{min-width:0}
button,input:not([type="checkbox"]),select,textarea{min-height:44px}
p{overflow-wrap:anywhere}
h1{font-size:28px}
h2{font-size:16px}
.dashboard-layout{display:block;margin:22px 0}
.workspace-body{min-width:0}
.calculation-settings{border:1px solid var(--line);border-radius:16px;padding:14px}
.calculation-settings>summary{font-weight:700}
.calculation-settings fieldset{margin-top:14px}
.tool-directory,.guide-directory{max-width:1050px;margin:18px auto;border:1px solid var(--line);border-radius:16px;background:var(--card);padding:16px}
.tool-directory>summary,.guide-directory>summary,.engagement-tools>summary,.visit-journal>summary{font-size:16px;font-weight:700}
.tool-directory small{font-size:12px;color:var(--muted);margin-left:12px}
.tool-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:16px}
.tool-panel,.report-chapter{border:1px solid var(--line);border-radius:16px;padding:14px;background:var(--card);min-width:0}
.tool-panel[open]{grid-column:1/-1}
.tool-panel>summary,.report-chapter>summary{font-weight:700}
.tool-body{padding-top:14px}
.report-chapter{margin:12px 0}
.report-chapter>summary{color:var(--accent)}
.report-chapter .result-title{margin-top:16px}
.guide-directory .three,.guide-directory .notice{margin:16px 0}
.reading-prose>summary{font-weight:700;font-size:16px}
.reading-prose[open]{grid-column:1/-1}
.hero em{font-style:normal;color:var(--accent)}
/* ver50: dedicated shortcut cards replace generic inline buttons; only the hero navigation uses these rules. */
.hero-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:24px}
.hero-shortcut{display:flex;align-items:center;gap:10px;min-width:0;min-height:88px;padding:4px 4px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(135deg,var(--card),var(--surface));color:var(--ink);text-decoration:none;box-shadow:0 5px 18px var(--shadow);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.hero-shortcut:hover{transform:translateY(-3px);border-color:var(--accent);box-shadow:0 10px 24px var(--shadow)}
.hero-shortcut:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.shortcut-icon{display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--accent);font-size:24px}
.shortcut-copy{display:flex;flex-direction:column;gap:5px;min-width:0;flex:1}.shortcut-copy strong{font-size:16px;line-height:1.4;word-break:keep-all}.shortcut-copy small{font-size:12px;line-height:1.5;color:var(--muted);word-break:keep-all}
.shortcut-arrow{font-size:18px;color:var(--accent);flex-shrink:0}
.hero-shortcut-start{background:linear-gradient(135deg,#9370d2,#6543a4);border-color:#9d7cd6;color:#fff}.hero-shortcut-start .shortcut-icon{background:#ffffff20;border-color:#ffffff45;color:#fff}.hero-shortcut-start .shortcut-copy small,.hero-shortcut-start .shortcut-arrow{color:#fff}
@media(max-width:420px){.hero-shortcut{padding:12px 10px;gap:8px}.shortcut-icon{flex-basis:28px;width:28px;height:32px;font-size:20px}.shortcut-copy strong{font-size:14px}.shortcut-arrow{display:none}}
@media(prefers-reduced-motion:reduce){.hero-shortcut{transition:none}.hero-shortcut:hover{transform:none}}
.signup-consent{margin:14px 0;font-size:12px;line-height:1.7}
.danger{border:1px solid #e44e78;color:var(--danger-ink);background:var(--danger-bg);border-radius:10px;padding:13px 18px}
.post-heading{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.post-controls{margin-top:16px}
.post-controls>summary{color:var(--muted)}
.post-controls label{display:block;max-width:340px;margin:12px 0}
.post-controls button{margin-right:8px}
.information-main{max-width:1050px;margin:32px auto}
.information-heading{margin:0 0 28px}
.information-heading h1{letter-spacing:-1px}
.information-heading p{color:var(--muted)}
.information-layout{display:block}
.information-nav{display:flex;flex-direction:column;gap:4px;align-items:stretch;position:static;margin:8px 0}
.information-nav a{padding:10px;border-left:2px solid var(--line);color:var(--muted);min-height:44px}
.information-nav a:hover{border-left-color:var(--accent);color:var(--accent)}
.information-content{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:28px;min-width:0}
.information-content p,.information-content li{line-height:1.9;color:var(--muted)}
.information-content h2{margin:28px 0 12px;color:var(--ink)}
.information-content h2:first-child{margin-top:0}
.document-label{font-family:monospace;color:var(--accent);font-size:12px;letter-spacing:1px}
.company-facts{display:grid;grid-template-columns:120px 1fr;gap:12px}
.company-facts dt{color:var(--muted)}
.company-facts dd{margin:0;overflow-wrap:anywhere}
.principle-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:24px 0}
.principle-grid section{padding:18px;border:1px solid var(--line);border-radius:10px}
.principle-grid span{font-family:monospace;color:var(--accent)}
.device-category{display:flex;padding:14px;border-bottom:1px solid var(--line)}
.site-footer{width:calc(100% - 48px);max-width:1050px;margin:50px auto 0;padding:28px 0 18px;border-top:1px solid var(--line)}
.footer-top{display:grid;grid-template-columns:260px 1fr;gap:24px}
.footer-brand{display:flex;align-items:center;gap:12px;text-decoration:none;max-width:100%;color:var(--ink)}.footer-brand img{display:block;width:112px;max-width:100%;height:auto;object-fit:contain}

.footer-top nav{flex-wrap:wrap;gap:12px 18px}
.footer-top nav a{font-size:12px;color:var(--muted)}
.footer-traffic{margin:24px 0;border-radius:12px;overflow:hidden;color:#fff;background:linear-gradient(110deg,#733ccc,#4239ae,#341b98)}
.footer-traffic h2{margin:0;font-size:16px;text-align:center;flex:1}.traffic-heading{display:flex;align-items:center;padding:5px 12px;background:#ffffff18}.traffic-heading button{background:transparent;color:#ff7474;font-size:22px;min-width:36px;min-height:32px;border-radius:8px}.traffic-heading button:focus-visible{outline:2px solid #fff}.footer-traffic ul{list-style:none;margin:0;padding:8px 12px}.footer-traffic li{display:flex;justify-content:space-between;align-items:center;padding:7px 0;font-size:14px}.footer-traffic li span::before{content:"•";margin-right:8px}




#visitCounts{color:#fff;font-weight:700}
.footer-bottom p{line-height:1.7;color:var(--muted);font-size:12px}
.footer-bottom small{font-size:11px;color:var(--muted)}
button:hover,.primary:hover{filter:brightness(1.12)}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
/* ver24: dialog의 top layer로 본문 위에 열리며 레이아웃 공간을 차지하지 않는다. */
.site-sidebar{position:fixed;inset:0 auto 0 0;width:min(340px,88vw);max-width:none;height:100dvh;max-height:100dvh;margin:0;padding:calc(20px + env(safe-area-inset-top)) 18px calc(20px + env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain;color:var(--ink);border:1px solid var(--line);border-radius:0 24px 24px 0;background:var(--card);backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);box-shadow:16px 0 50px var(--shadow);z-index:60}
.site-sidebar[open]{display:flex;flex-direction:column;gap:16px;animation:menu-reveal .18s ease-out}
@keyframes menu-reveal{from{transform:translateX(-24px);opacity:0}to{transform:translateX(0);opacity:1}}
.site-sidebar:not([open]){display:none}
.site-sidebar::backdrop{background:rgba(0,6,15,.72);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.sidebar-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}
.sidebar-heading h2{margin:7px 0 0;font-size:16px}
.sidebar-main{display:flex;flex-direction:column;align-items:stretch;gap:5px}
.sidebar-main a{display:flex;gap:12px;align-items:center;padding:12px;border:1px solid transparent;border-radius:16px;color:var(--ink);min-height:44px}

.sidebar-main a[aria-current="page"]{background:var(--surface);border-color:var(--accent);color:var(--accent);box-shadow:0 4px 16px #6680ab0c}
.sidebar-fortunes h3{font-size:12px;color:var(--muted);margin:0 0 10px;font-weight:600}
.sidebar-group{border-top:1px solid var(--line);padding-top:12px;margin-top:10px}
.sidebar-group>summary{font-size:14px;font-weight:700;min-height:32px;line-height:1.8}
.sidebar-services{display:flex;flex-direction:column;gap:5px;margin:8px 0}
.sidebar-services .service-tile{display:flex;text-align:left;padding:10px 4px;min-height:62px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--ink);text-decoration:none;font-size:14px}
.sidebar-services button[aria-pressed="true"]{background:var(--hover);color:var(--accent);border-color:var(--accent)}
.sidebar-note{flex:0 0 auto;font-size:11px;color:var(--muted);line-height:1.8;margin:16px 0 0}
.menu-close{display:inline-block}
.current-service{font-size:12px;color:var(--muted);padding:8px 10px;background:var(--surface);border:1px solid var(--line);border-radius:999px}.header-hud{font-family:monospace;color:var(--gold);font-weight:800;text-decoration:none;border:1px solid var(--line);border-radius:6px;padding:7px 9px;font-size:12px}
.sidebar-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:18px 0;padding:14px;background:var(--surface);border:1px solid var(--line);border-radius:14px}

/* ver68: fixed equal dimensions replace minimum width and the competing mobile width. */
.menu-toggle{justify-self:start;display:flex;background:var(--surface);color:var(--accent);border:1px solid var(--line);border-radius:10px;width:44px;height:44px;padding:0;align-items:center;justify-content:center}
.menu-toggle span{font-size:21px;line-height:1}
.reading-card,.workspace-section,.information-content,.report-summary,.engagement-tools,.tool-directory,.guide-directory,.tool-panel,.report-chapter,.footer-traffic,.birthplace-dialog,.modalbox{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 8px 28px var(--shadow)}
.sidebar-main a:hover,.sidebar-services button:hover,.sidebar-services a:hover,.information-nav a:hover{background:var(--hover)}
/* ver29: 쉬운 풀이와 용어 설명은 기본 본문 크기로 제공한다. 전문 해설의 기존 스타일을 덮지 않는다. */
/* ver28: PC 작전실은 메뉴와 실제 상태를 두 칸으로 제공한다. 모바일 메뉴 DOM은 그대로 재사용한다. */
/* ver67: single-scroll menu must retain content height; flex shrinking previously placed the note over overflowing links. */
.sidebar-columns{display:block;flex:0 0 auto}
.sidebar-navigation{min-width:0}
.sidebar-intel{display:grid;gap:12px;margin-top:12px}
.sidebar-card{padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--card);min-width:0}
.sidebar-card h3{font-size:16px;margin:10px 0}
.sidebar-card p{line-height:1.7;font-size:14px}
.sidebar-card .ball{width:30px;height:30px;font-size:12px}
.sidebar-card .balls{gap:5px;align-items:center}
.sidebar-card progress{width:100%;height:10px;accent-color:var(--accent)}
.sidebar-play-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.sidebar-play-links a{padding:8px;border:1px solid var(--line);border-radius:6px;font-size:14px;text-decoration:none}

.header-tools{display:flex;align-items:center;gap:4px;justify-self:start}
.theme-toggle{min-width:36px;min-height:36px;padding:6px;font-size:18px}
.results-dialog{width:min(600px,calc(100vw - 24px));max-height:85dvh;overflow:auto;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:16px;padding:20px;box-shadow:0 12px 40px var(--shadow)}
.results-dialog::backdrop{background:#0007;backdrop-filter:blur(4px)}
.results-dialog select{width:100%;margin:8px 0 12px}
.results-dialog h2{font-size:16px}

/* ver27: 놀이터의 여섯 탭은 하나의 내용만 펼친다. 기존 운세·대시보드 스타일을 덮지 않는다. */
.play-progress{padding:16px;background:var(--card);border:1px solid var(--line);border-radius:16px;margin:18px 0}
.play-progress p{margin:8px 0}
.play-tabs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;margin:20px 0}
.play-tabs button{background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:16px;padding:12px 6px;font-size:14px}
.play-tabs button[aria-selected="true"]{background:var(--accent);color:var(--on-accent)}
.play-panel{min-width:0;margin-bottom:20px}
.play-panel[hidden]{display:none}
.play-character{display:flex;gap:20px;align-items:center;background:var(--card);border:1px solid var(--line);padding:20px;border-radius:22px}
.character-glyph{display:grid;place-items:center;width:80px;height:80px;flex-shrink:0;border-radius:28px;background:var(--surface);color:var(--accent);font-size:42px}
.play-panel .reading-card{margin:12px 0}
.play-panel textarea{width:100%}
@media(max-width:1023px){.header-inner{padding:7px 18px}



.site-footer{margin:32px auto 0}}
@media(max-width:760px){.play-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}.play-character{gap:12px;padding:14px}.character-glyph{width:56px;height:56px;font-size:32px}.game-scene>div{padding:12px}.game-scene img{height:112px}
.hero h1{font-size:28px;line-height:1.4}
.three{grid-template-columns:1fr}
.panel,.three,.notice{margin-left:0;margin-right:0}
.panel{padding:22px}
.number-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.lotto-overview{padding:14px}
.number-card[open]{grid-column:1/-1}
.daily-pulse{margin:16px 0;grid-template-columns:1fr;padding:20px;gap:12px}
.cross-columns{grid-template-columns:1fr}
.cross-report{padding:18px}
.cross-heading h2{font-size:16px}
.dashboard-combos{grid-template-columns:1fr}
.calendar-grid{gap:3px}
.calendar-day{padding:5px;min-height:120px;gap:6px}
.calendar-day span{font-size:14px}
.calendar-day small{font-size:10px}
.workspace-section>h2{font-size:16px}
.luck-timeline,.selection-flow{grid-template-columns:1fr}
.trace-meter{grid-template-columns:1fr}
.start-columns{grid-template-columns:1fr}
.engagement-tools{padding:14px}
.dashboard-layout{grid-template-columns:1fr}
.workspace-section{padding:16px}
.tool-grid{grid-template-columns:1fr}
.formgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
.formgrid label{min-width:0}
.guide-directory{margin:18px 0}
.tool-directory small{display:block;margin:6px 0}
main{padding:0 10px 24px}
.header-inner{min-height:54px;padding:6px max(10px,env(safe-area-inset-right)) 6px max(10px,env(safe-area-inset-left));gap:8px}

.information-main{margin:20px auto}
.information-layout{grid-template-columns:1fr;gap:16px}
.information-content{padding:18px}
.company-facts{grid-template-columns:88px 1fr}
.principle-grid{grid-template-columns:1fr}
.site-footer{width:calc(100% - 20px);margin:32px auto 0}
.footer-top{grid-template-columns:1fr;gap:20px}
.footer-top nav{gap:12px}

.post-heading{flex-direction:column}
.signup-consent{align-items:flex-start}
.site-header 
.sidebar-actions{gap:8px}
.sidebar-actions .ghost{font-size:12px;padding:8px 10px}
.brand-logo{width:32px;height:32px}
.brand{gap:4px}
.brand .brand-copy strong{font-size:18px}.brand .brand-copy em{font-size:9px}


}
@media(max-width:900px){.reading-grid,.fortune-grid{grid-template-columns:1fr 1fr}
.daewoon{grid-template-columns:repeat(4,1fr)}}
@media(max-width:600px){.trend-chart text{font-size:24px}.saju-visual-grid{grid-template-columns:1fr;gap:14px}.fortune-card-list{grid-template-columns:1fr}.fortune-catalog{margin:12px 0;padding:14px}.reading-grid,.fortune-grid{grid-template-columns:1fr}
.daewoon{grid-template-columns:repeat(2,1fr)}
.combo-basis{grid-template-columns:1fr}
.record-editor{padding:14px}
.report-summary{padding:16px}
.number-picker{grid-template-columns:repeat(5,minmax(0,1fr))}
.birthplace-dialog{padding:14px}
.birthplace-map{height:320px}}

@media print{:root,:root[data-theme="dark"]{color-scheme:light;--bg:#ffffff;--ink:#111111;--muted:#333333;--card:#ffffff;--line:#cccccc;--accent:#174f64;--gold:#7b5815}body *{visibility:hidden}
#libraryReading,#libraryReading *{visibility:visible}
#libraryReading{position:absolute;left:0;top:0;width:100%}
#libraryReading button,#libraryReading .share-preview{display:none}
#libraryReading details{display:none}
#libraryReading .reading-card{break-inside:avoid}
body{background:white;padding:0;color:black}
.site-sidebar,.site-header,.site-footer{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.site-sidebar[open]{animation:none}}

/* ver62: dedicated non-overlay ad area, separated from service actions. */
.advertising{width:min(1050px,calc(100% - 24px));margin:32px auto;padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--card)}
#adPlacement{text-align:center;margin-top:20px;min-width:0}

/* ver63: home-only selection components reuse data-service; no duplicate click listeners. */
.home-intro,.home-section,.home-feature{max-width:1050px;margin:28px auto}
.home-intro{padding-top:12px}.home-intro h1{font-size:28px;margin:12px 0}.home-intro>p,.home-section-heading p{color:var(--muted);line-height:1.7}
.concern-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin:22px 0}.concern-card{display:flex;flex-direction:column;align-items:center;gap:10px;padding:16px 8px;border:1px solid var(--line);border-radius:20px;background:var(--card);color:var(--ink);box-shadow:0 3px 10px var(--shadow)}
.concern-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;font-size:24px;background:#fff0f6;color:#b82c60}.concern-wealth .concern-icon{background:#fff6d8;color:#8f690e}.concern-lifetime .concern-icon{background:#eaf2ff;color:#3158a3}.concern-tarot .concern-icon{background:#f3edff;color:#7950aa}.concern-personality .concern-icon{background:#e8f7ef;color:#267356}.concern-dates .concern-icon{background:#fff0e7;color:#ab5131}
.concern-card small{color:var(--muted);font-size:12px}.concern-card[aria-pressed=true],.fortune-launch[aria-pressed=true]{border-color:var(--accent);box-shadow:0 0 0 2px var(--line)}
.situation-chips{display:flex;flex-wrap:wrap;gap:10px}.situation-chips button{background:var(--card);border:1px solid var(--line);border-radius:24px;padding:11px 16px;color:var(--ink)}.situation-chips button[aria-pressed=true]{background:var(--accent);color:var(--on-accent)}
.home-feature{display:grid;grid-template-columns:1fr 320px;gap:24px;align-items:center;background:#212c55;color:#ffffff;border-radius:26px;padding:36px;box-shadow:0 12px 30px var(--shadow)}.feature-tag{display:inline-block;border-radius:8px;padding:8px 12px;background:#f3d78b;color:#18213f;font-size:12px;font-weight:700}.home-feature h2{font-size:28px;line-height:1.5;margin:16px 0}.home-feature p{color:#d9e4ff;line-height:1.8}.feature-button{padding:14px 20px;border-radius:14px;background:#f3d78b;color:#18213f;font-weight:700}.feature-link{display:block;color:#d9e4ff;margin-top:16px;font-size:12px}
.home-section-heading h2{font-size:16px;margin:0}.home-picks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.pick-icon{display:grid;place-items:center;width:44px;height:44px;background:var(--surface);border-radius:12px;color:var(--accent);font-size:24px;flex-shrink:0}
@media(max-width:760px){.concern-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.concern-card small{font-size:11px}.home-feature{grid-template-columns:1fr;padding:24px}.home-feature .game-hero{width:180px}.home-feature h2{font-size:28px}.home-picks{grid-template-columns:1fr}.home-intro,.home-section,.home-feature{margin:24px auto}.situation-chips{gap:8px}.situation-chips button{padding:9px 12px;font-size:12px}}

/* ver65: shared service metadata and flat home grids replace the accordion catalog presentation. */
.all-services{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.service-tile{display:flex;align-items:center;gap:12px;text-align:left;min-width:0;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--card);color:var(--ink);text-decoration:none}
.service-symbol{display:grid;place-items:center;background:#ffc64d;color:#ffffff;box-shadow:inset 0 0 0 2px #ffffff50;border-radius:50%;width:38px;height:38px;flex-shrink:0;font-size:22px}.symbol-tarot,.symbol-personality,.symbol-numerology{background:#9761e8}.symbol-compatibility,.symbol-love,.symbol-children{background:#f47caa}.symbol-star,.symbol-week,.symbol-month{background:#6479ec}.symbol-mbti,.symbol-blood,.symbol-color{background:#55c6a3}.symbol-dream,.symbol-dates{background:#81bafa}
.service-copy{flex:1;min-width:0}.service-copy b,.service-copy small{display:block}.service-copy b{font-size:14px}.service-copy small{margin-top:4px;line-height:1.5;color:var(--muted);font-size:12px}.service-badge{display:inline-block;border-radius:6px;padding:4px 7px;background:#e8f7f0;color:#216d53;font-size:11px;white-space:nowrap}.sidebar-services .service-symbol{width:28px;height:28px;font-size:18px}.sidebar-services .service-badge{font-size:10px;padding:3px 5px}.sidebar-group summary{color:var(--accent)}
.home-picks .fortune-launch{display:flex;flex-wrap:wrap;align-items:center;padding:16px}.starter-art{width:100%;height:160px;object-fit:cover;border-radius:14px;margin-bottom:14px}.home-picks .fortune-launch>span:nth-child(2){flex:1}
.heading-with-link{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.heading-with-link>a{color:var(--accent);text-decoration:none;font-size:12px}
.question-grid,.story-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.question-card{display:flex;align-items:center;justify-content:space-between;gap:20px;min-width:0;min-height:158px;padding:24px 18px;border:1px solid var(--line);border-radius:20px;background:var(--card);color:var(--ink);text-align:left;box-shadow:0 5px 16px var(--shadow)}.question-card>span{flex:1;min-width:0}.question-card b{display:block;font-size:16px;line-height:1.5;margin:10px 0}.question-tag{padding:5px 8px;border-radius:7px;background:#fff0f6;color:#a93060}.tag-wealth,.tag-dates{background:#fff6dc;color:#876413}.tag-lifetime{background:#edf3ff;color:#2e5799}.tag-tarot{background:#f1edff;color:#7053a6}.question-method{display:block;font-size:12px;color:var(--muted);margin-bottom:10px}.question-card img,.story-card img{width:88px;height:88px;object-fit:cover;border-radius:16px;flex-shrink:0}
.home-guide{max-width:1050px;margin:48px auto;padding:30px;border-radius:24px;background:#fff7df;color:#18213f;display:grid;grid-template-columns:1.1fr 1fr;gap:30px}.home-guide h2{font-size:16px;line-height:1.6}.home-guide p{line-height:1.7}.guide-question{background:#ffffff;border:1px solid #ecdba6;border-radius:16px;padding:10px 14px;font-size:14px}.home-guide .primary{display:block;text-align:center}.story-card{display:flex;align-items:center;gap:18px;padding:20px;background:var(--card);border:1px solid var(--line);border-radius:20px;text-decoration:none;color:var(--ink)}.story-card>span{flex:1;min-width:0}.story-card small{color:var(--accent);font-size:12px}.story-card b{display:block;margin-top:10px;font-size:16px}.story-card p{color:var(--muted);font-size:12px;line-height:1.6}
@media(max-width:760px){.all-services{grid-template-columns:repeat(2,minmax(0,1fr))}.service-tile{padding:12px;gap:8px;flex-wrap:wrap}.all-services .service-badge{margin-left:46px}.question-grid,.story-grid,.home-guide{grid-template-columns:1fr}.home-guide{padding:20px;margin:28px auto}.question-card{padding:18px 14px}.question-card img{width:72px;height:72px}}
@media(max-width:440px){.all-services{grid-template-columns:1fr}.all-services .service-badge{margin-left:0}.service-tile{flex-wrap:nowrap}}

/* ver70: four-level birthplace selection; no duplicated form inputs or numeric submission fields. */
.region-selects{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:10px}.region-selects label,.region-selects select{min-width:0;width:100%}.birthplace-field>small{display:block;color:var(--muted);font-size:11px;line-height:1.6}

/* ver71: 독립적인 웹 대화 작업창. 기존 결과 레이아웃/CSS를 덮어쓰지 않는다. */
.hybrid-launch{position:fixed;right:20px;bottom:20px;z-index:40;box-shadow:0 5px 24px #15245030;border-radius:14px;padding:12px 18px}
.hybrid-dialog{width:min(1120px,94vw);max-height:90dvh;overflow:auto;border:1px solid var(--line);border-radius:20px;background:var(--card,#fff);color:var(--ink);padding:24px}
.hybrid-dialog::backdrop{background:#10182c88}
.hybrid-heading,.hybrid-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.hybrid-columns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;margin-top:20px}
.hybrid-columns section{min-width:0}
.hybrid-dialog label{display:block;margin:12px 0}
.hybrid-dialog textarea,.hybrid-dialog select{width:100%;box-sizing:border-box;font:inherit}
.hybrid-dialog h2{font-size:28px}.hybrid-dialog h3{font-size:16px}
.hybrid-dialog p,.hybrid-dialog label{font-size:14px;line-height:1.65}
.hybrid-dialog pre{max-height:440px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;padding:16px;border:1px solid var(--line);border-radius:12px;font-size:13px}
.hybrid-consent input{width:auto}.hybrid-actions .button{display:inline-block;text-decoration:none;border-radius:10px;padding:12px 16px;background:#253761;color:white}
#hybridCommentary{border-top:1px solid var(--line);margin-top:20px;padding-top:16px}
#hybridAnswer{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.8}
@media(max-width:720px){.hybrid-columns{grid-template-columns:minmax(0,1fr)}.hybrid-dialog{padding:16px}.hybrid-dialog pre{max-height:220px}.hybrid-launch{right:12px;bottom:12px;max-width:calc(100vw - 24px)}}