/* Large cards and a quiet, continuous reading column. */
/* Service examples read as one editorial column; no nested report panels. */
body.gyeol-mobile-ui #reading-app:has(.service-intro-hero){padding-top:0}
body.gyeol-mobile-ui #reading-app .service-intro-hero{width:100%;margin:0;border-radius:15px;height:clamp(350px,55svh,470px);min-height:350px;max-height:470px;aspect-ratio:auto}
body.gyeol-mobile-ui #reading-app .service-intro-copy{inset:auto 24px 32px}
body.gyeol-mobile-ui #reading-app .service-intro-description{font-size:14px;line-height:1.7;color:#f4f3e9;margin:12px 0 20px}
body.gyeol-mobile-ui #reading-app button.report-example-anchor{padding:8px 0;min-height:44px;border:0;background:transparent;color:#fffdf6;font-size:12px}
body.gyeol-mobile-ui #reading-app .report-example{padding:30px 0 0;margin:0;border:0;background:none;scroll-margin-top:84px}
#reading-app .example-heading .eyebrow{color:#65735d;letter-spacing:0;font-size:12px;margin:0 0 7px}
body.gyeol-mobile-ui #reading-app .example-heading h2{font-size:23px;line-height:1.45;margin:0 0 12px}
body.gyeol-mobile-ui #reading-app .example-heading>p:last-child,#reading-app .example-footnote{font-size:12px;line-height:1.7;color:#748073;margin:0 0 18px}
body.gyeol-mobile-ui #reading-app .example-subject{font-size:12px;padding:0;margin:0 0 8px;background:none;color:#63725e}
#reading-app .example-input{border-bottom:1px solid #e4e5dc;padding-bottom:18px;margin-bottom:28px;font-size:12px}
#reading-app .example-input summary{cursor:pointer;min-height:44px;padding:12px 0}
#reading-app .example-input dl{margin:10px 0}#reading-app .example-input dt{color:#748073}#reading-app .example-input dd{margin:4px 0 16px}
#reading-app .example-summary{margin:0 0 30px}
body.gyeol-mobile-ui #reading-app .report-example h3{font-size:20px;line-height:1.5;margin:0 0 16px}
body.gyeol-mobile-ui #reading-app .report-example p{font-size:15px;line-height:1.9;margin:0 0 16px}
body.gyeol-mobile-ui #reading-app .example-takeaway{padding:16px;border-radius:12px;background:#eef1e7;font-size:14px}
#reading-app .example-takeaway strong{display:block;font-size:12px;margin-bottom:5px;color:#4f6b51}
#reading-app .example-visual{margin:32px 0}
body.gyeol-mobile-ui #reading-app p.example-footnote,#reading-app p.example-section-count{font-size:11px;line-height:1.7;color:#748073}
#reading-app .example-card-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
#reading-app .example-card-row figure{margin:0;min-width:0}#reading-app .example-card-row img{width:100%;height:auto;aspect-ratio:3/5;object-fit:contain;border-radius:9px}
#reading-app .example-card-row figcaption>*{display:block;text-align:center;font-size:12px;line-height:1.6;margin-top:6px}#reading-app .example-card-row figcaption span{font-size:11px;color:#748073}
#reading-app .example-chapter{padding:26px 0;border-top:1px solid #e4e5dc}
#reading-app .example-chapter-number{font-size:12px;color:#7f8c77;display:block;margin-bottom:8px}
#reading-app .example-month{padding:18px 0 0}#reading-app .example-month h4{font-size:16px;margin:0 0 12px}
#reading-app .example-placeholder{min-height:420px;padding-top:6px}#reading-app .example-placeholder span{display:block;height:14px;background:#eceee5;border-radius:4px;margin:18px 0}#reading-app .example-placeholder span:last-child{width:65%}
/* Example-only visual language: lightweight vector symbols and real-count charts. */
#reading-app .report-example{--example-accent:#526b54;--example-line:#e5e6dd;color:#303c35}
#reading-app [data-element=wood]{--element-color:#719c78;--element-light:#eaf1e7}
#reading-app [data-element=fire]{--element-color:#c98172;--element-light:#faece7}
#reading-app [data-element=earth]{--element-color:#b49969;--element-light:#f4eddf}
#reading-app [data-element=metal]{--element-color:#8295ae;--element-light:#edf0f6}
#reading-app [data-element=water]{--element-color:#6eaaa8;--element-light:#e6f2ef}
body.gyeol-mobile-ui #reading-app .report-example .example-kicker{font-size:12px;letter-spacing:.15em;font-weight:600;color:#7b8b76;margin:0 0 8px;line-height:1.5}
#reading-app .example-pillars{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin:22px 0 30px;text-align:center}
#reading-app .example-pillar-column{min-width:0}
#reading-app .example-pillar-column h4{font-size:13px;font-weight:500;color:#737d70;margin:0 0 10px}
#reading-app .example-pillar-tile{display:flex;flex-direction:column;align-items:center;gap:4px;background:var(--element-light);border:1px solid #fff9;border-radius:15px;padding:10px 2px 9px;margin-bottom:6px;color:var(--element-color)}
#reading-app .example-tile-kind{font-size:12px;color:#737d70}
#reading-app .example-symbol{display:block;width:48px;height:48px;fill:var(--element-color);fill-opacity:.14;stroke:var(--element-color);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
#reading-app .example-tile-name{font-size:12px;color:#56604f;white-space:nowrap}
#reading-app .example-tile-name b{font-size:16px;font-weight:500;margin-right:2px}
#reading-app .example-pillar-god{font-size:12px;color:#7b8576;display:block;margin-top:8px}
#reading-app .example-chart{background:#ffffff80;border:1px solid #e9e9df;border-radius:20px;padding:22px 16px 16px}
#reading-app .example-chart-heading{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
body.gyeol-mobile-ui #reading-app .example-chart-heading h3{font-size:15px;margin:0}
#reading-app .example-chart-heading>span{font-size:10px;color:#7a8578}
#reading-app .example-elements{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:22px 0 12px}
#reading-app .example-element{text-align:center;display:flex;flex-direction:column;gap:8px;min-width:0}
#reading-app .example-element>strong{font-size:16px;font-weight:600;color:#485745}
#reading-app .example-element small{font-size:10px;font-weight:400;color:#778171;margin-left:3px}
#reading-app .example-element-track{height:120px;background:var(--element-light);border-radius:10px;display:flex;align-items:flex-end;overflow:hidden}
#reading-app .example-element-track>span{display:block;width:100%;background:var(--element-color);border-radius:10px 10px 0 0;min-height:0}
#reading-app .example-element-label{font-size:12px;color:#64715f}
body.gyeol-mobile-ui #reading-app .example-chart .example-footnote{font-size:10px;line-height:1.6;color:#7b8577;margin:16px 0 0}
#reading-app .example-keywords{list-style:none;display:flex;flex-wrap:wrap;gap:6px;padding:0;margin:20px 0 0}
#reading-app .example-keywords li{padding:6px 10px;border-radius:20px;background:#edeFE5;color:#62715b;font-size:11px;line-height:1.4}
body.gyeol-mobile-ui #reading-app .example-takeaway{position:relative;padding:18px 18px 18px 22px;background:#eff2e8;border:1px solid #e3e8d8;border-radius:14px;font-size:13px;line-height:1.8}
#reading-app .example-takeaway strong{font-size:11px;letter-spacing:.02em;margin-bottom:8px}
#reading-app .example-insights{background:#f4eee6;border:1px solid #ece3d6;border-radius:18px;padding:22px 18px;margin:32px 0}
body.gyeol-mobile-ui #reading-app .example-insights h3{font-size:15px;color:#776448;margin:0 0 16px}
#reading-app .example-insights>div{display:grid;grid-template-columns:24px minmax(0,1fr);gap:10px;padding:14px 0;border-top:1px solid #e7ddd0}
#reading-app .example-insights>div>span{font-size:11px;color:#9c8462;padding-top:4px}
body.gyeol-mobile-ui #reading-app .example-insights p{font-size:13px;line-height:1.85;margin:0}
#reading-app .example-chapter-number{display:inline-flex;align-items:center;gap:8px;color:#60725b;font-size:14px;letter-spacing:.08em}
#reading-app .example-chapter-number:after{content:'';width:24px;height:1px;background:#becbb5}
body.gyeol-mobile-ui #reading-app .example-chapter h3{font:600 24px/1.5 var(--serif);letter-spacing:-.035em;margin-bottom:18px}
body.gyeol-mobile-ui #reading-app .example-chapter>p:first-of-type{border-left:2px solid #c0cdb6;padding-left:14px;color:#4e624a}
#reading-app .example-tarot-image{padding:12px 8px;background:#eceee4;border-radius:16px}
#reading-app .example-card-row .example-card-index{font-size:9px;letter-spacing:.12em;color:#8a977d}
body.gyeol-mobile-ui #reading-app .example-summary>h3{font-size:21px;line-height:1.5;letter-spacing:-.035em}
body.gyeol-mobile-ui #reading-app .example-heading>p:last-child{font-size:13px;line-height:1.7;color:#53634c}
@media(max-width:350px){#reading-app .example-symbol{width:40px;height:40px}#reading-app .example-chart{padding:18px 12px}#reading-app .example-elements{gap:7px}#reading-app .example-tile-name{font-size:10px}}
.deck-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:18px 14px;padding:16px 2px 28px}
.deck-grid button{position:relative;padding:0;border-radius:7px;transition:transform .15s,border-color .15s}
.deck-grid button img{aspect-ratio:3/5}
.deck-grid button span{position:absolute;bottom:0;left:0;width:100%;min-height:30px;display:grid;place-items:center;font-size:12px;line-height:1.5}
.deck-grid button[aria-pressed=true]{transform:translateY(-6px);border-color:var(--ink);outline:2px solid var(--ink);outline-offset:3px}
.deck-grid button[aria-pressed=true] span{background:var(--ink);color:var(--paper)}
.deck-slots{gap:14px;margin:28px 0 18px}
.deck-slot{display:grid;justify-items:center;align-content:center;gap:6px;padding:16px 10px;min-height:116px}
.deck-slot strong{font-size:13px;line-height:1.6;font-weight:500}
.deck-slot>span:last-child{font-size:12px;color:var(--muted)}
.selected-cards{padding:26px 20px}
.report-cards{gap:18px;align-items:start}
.report-cards img{max-height:320px;aspect-ratio:3/5;object-fit:contain}
.report-cards .role{min-height:38px;line-height:1.5;font-size:12px;margin-bottom:12px}
.report-cards h3{text-align:center;margin:14px 0 8px}
.report-cards article>p:not(.role){text-align:center;font-size:12px}
.report-cards details{font-size:13px;line-height:1.8}
.report-cards summary{cursor:pointer;text-align:center;text-underline-offset:4px;text-decoration:underline;color:var(--muted)}
.report-cards details p{margin-top:12px}
.reading-summary{padding:30px}
.report-section{padding:38px 34px;margin:36px 0;scroll-margin-top:28px}
.report-section h2{font-size:clamp(23px,3vw,28px);margin:6px 0 24px}
.report-section p{font-size:17px;line-height:1.95;letter-spacing:-.02em;margin-bottom:24px;word-break:normal;overflow-wrap:break-word}
.chapter-number{color:var(--muted);font-size:13px;letter-spacing:.1em}
.report-toc{grid-template-columns:1fr;gap:0}
.report-toc li{border-bottom:1px solid var(--line);padding:12px 0;line-height:1.6;font-size:15px}
.report-toc a{border:0;padding:0;font-size:15px}
.report-toc li:last-child{border:0}
.reading-share{margin:2px 0 12px;font-size:13px}
.checkout-product{display:flex;gap:20px;align-items:center;border:1px solid var(--line);border-radius:8px;background:var(--paper);overflow:hidden;margin:24px 0}
.checkout-product img{width:150px;aspect-ratio:1;object-fit:cover}
.checkout-product>div{padding:12px 18px 12px 0}
.checkout-product h2{font-size:22px;margin:0 0 7px}
.checkout-product p{font-size:13px;margin:0;color:var(--muted)}
.share-copy{display:block;width:100%;min-height:180px;padding:14px;font:inherit;line-height:1.6;border:1px solid var(--line);background:var(--paper);color:var(--ink)}
@media all{main{padding:28px 18px}.deck-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 10px}.deck-slots{gap:7px}.deck-slot{padding:12px 5px;min-height:110px}.deck-slot strong{font-size:11px}.deck-slot>span:last-child{font-size:11px}.reading-panel{padding:24px 20px}.selected-cards{padding:22px 14px}.report-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.report-cards img{width:100%;max-height:none}.report-cards h3{font-size:15px}.report-cards .role{font-size:10px}.report-cards article>p:not(.role){font-size:10px}.report-section{margin:28px 0;padding:28px 22px}.report-section p{font-size:16px;line-height:1.95}.checkout-product{gap:14px}.checkout-product img{width:104px}.checkout-product h2{font-size:18px}.checkout-product>div{padding-right:12px}}
@media(prefers-reduced-motion:reduce){.deck-grid button{transition:none}}
.deck-grid button span:empty{display:none}

/* Keep the price visible before input and all four chart pillars in the panel. */
.intro-price{margin:10px 0 6px;font-size:14px;color:var(--ink)}
.intro-price strong{font-size:19px}
.intro-condition{margin:0 0 20px;font-size:13px;line-height:1.7;color:var(--muted)}
.report-chart{overflow:visible}
.report-chart table{min-width:0;table-layout:fixed;width:100%}
.checkout-notice{margin-top:22px;border-top:1px solid var(--line);padding-top:18px;font-size:13px;line-height:1.8}
.checkout-notice p{margin-bottom:12px}
@media all{.report-chart th,.report-chart td{padding:10px 2px;font-size:12px;overflow-wrap:anywhere}.report-chart strong{font-size:22px}.intro-price{font-size:12px}.intro-price strong{font-size:18px}.reading-action .action-caption{max-width:none;text-align:center}}

#reading-app .example-animal-face{fill:currentColor;fill-opacity:1;stroke:none}
#reading-app .example-animal{color:var(--element-color);stroke-width:2;fill-opacity:.12}
#reading-app .example-tile-animal{font-size:11px;color:#62705f;line-height:1.4}
#reading-app [data-element=unknown]{--element-color:#8d9686;--element-light:#eeeee6}
#reading-app .example-unknown{display:grid;place-items:center;font-size:27px;color:#8d9686}
body.gyeol-mobile-ui #reading-app .example-chart-context{border-top:1px solid #e4e8dc;padding-top:14px;font-size:12px;line-height:1.8;color:#566950;margin:14px 0 0}
body.gyeol-mobile-ui #reading-app .report-chart .example-visual h3{font-size:17px;line-height:1.5;margin-bottom:18px}
body.gyeol-mobile-ui #reading-app .report-chart .example-elements strong{font-size:16px;display:inline;line-height:1.5;font-weight:600}
body.gyeol-mobile-ui #reading-app .report-chart .example-chart-heading h3{font-size:15px;margin:0}
body.gyeol-mobile-ui #reading-app .report-example :is(.example-tile-kind,.example-pillar-god,.example-kicker){font-size:11px}
body.gyeol-mobile-ui #reading-app .report-example :is(.example-footnote,.example-section-count){font-size:12px;line-height:1.75;color:#64745f}

body.gyeol-mobile-ui .birth-field select{appearance:none;padding-right:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%235e6d61' stroke-width='1.5'%3E%3Cpath d='m5 8 5 5 5-5'/%3E%3C/svg%3E");background-size:18px;background-position:right 14px center;background-repeat:no-repeat}
body.gyeol-mobile-ui .birth-fields{gap:20px 12px;margin:28px 0 12px}
body.gyeol-mobile-ui .birth-field{gap:9px;font-size:13px;line-height:1.6}
body.gyeol-mobile-ui .birth-field small{font-size:12px;color:var(--ui-muted)}
body.gyeol-mobile-ui .birth-line{margin:10px 0 24px}
body.gyeol-mobile-ui .birth-line label{min-height:44px;font-size:13px;color:var(--ui-muted)}
body.gyeol-mobile-ui .city-caption{font-size:12px;color:var(--ui-muted);line-height:1.7}
body.gyeol-mobile-ui .choice-progress{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;border:0;padding:0;margin:4px 0 28px;font-size:12px;color:var(--ui-muted)}
body.gyeol-mobile-ui .choice-progress progress{appearance:none;display:block;width:100%;height:4px;border:0;border-radius:4px;background:#e6e9df;overflow:hidden}
body.gyeol-mobile-ui .choice-progress progress::-webkit-progress-bar{background:#e6e9df;border-radius:4px}
body.gyeol-mobile-ui .choice-progress progress::-webkit-progress-value{background:#69846c;border-radius:4px}
body.gyeol-mobile-ui .choice-progress progress::-moz-progress-bar{background:#69846c;border-radius:4px}
body.gyeol-mobile-ui #reading-app:has(#report-form)>h1{font-size:25px;line-height:1.5;margin:0 0 16px}
body.gyeol-mobile-ui .choice-option{border-radius:12px;padding:15px 16px;min-height:56px;background:#fffdf8;border-color:var(--ui-line)}
body.gyeol-mobile-ui .choice-option:has(input:checked){background:#edf2e7;border-color:#69846c}
body.gyeol-mobile-ui .choice-option input[type=radio]{appearance:none;width:18px;height:18px;border:1.5px solid #a8b6a1;border-radius:50%;background:#fffdf8;margin:0}
body.gyeol-mobile-ui .choice-option input[type=radio]:checked{background:#52715c;border-color:#52715c;box-shadow:inset 0 0 0 4px #edf2e7}
body.gyeol-mobile-ui .reading-action{background:#fbf8f1f5;border-color:var(--ui-line)}
body.gyeol-mobile-ui .reading-action>button{min-height:52px;font:600 15px/1.5 var(--sans);border-radius:10px}
body.gyeol-mobile-ui .reading-action .action-caption{font-size:12px;color:var(--ui-muted);line-height:1.6}

body.gyeol-mobile-ui .service-intro-copy .eyebrow{display:inline-block;border-left:2px solid #e4d6b8;padding-left:9px;font-size:12px;line-height:1.7}
body.gyeol-mobile-ui .service-intro-hero .service-intro-copy h1{font:700 32px/1.35 GyeolBrand,'Batang',serif;letter-spacing:-.04em;max-width:12em;text-wrap:balance}

body.gyeol-mobile-ui :is(.birth-field,.inline-form) :is(input,select),body.gyeol-mobile-ui .directory-search input,body.gyeol-mobile-ui #support-form :is(select,textarea){box-sizing:border-box;min-height:52px;padding:12px 14px;border:1px solid var(--ui-line);border-radius:10px;background-color:#fffdf8;color:var(--ui-ink);font:400 16px/1.5 var(--sans);box-shadow:none}

@media(max-width:360px){body.gyeol-mobile-ui header.site-header,body.gyeol-mobile-ui .workspace>header.site-header{padding-left:16px;padding-right:16px}body.gyeol-mobile-ui .service-intro-hero .service-intro-copy h1{font-size:29px}body.gyeol-mobile-ui #reading-app .birth-fields{grid-template-columns:1fr}}

/* A readable first chapter; supporting inputs and production details stay optional. */
#report-example-title{scroll-margin-top:84px}
body.gyeol-mobile-ui #reading-app .example-heading>.example-qualification{font-size:13px;line-height:1.7;color:#53634c;margin-bottom:12px}
#reading-app .example-input{margin:0;padding:0;border:0}
#reading-app .example-input>summary{font-size:13px;color:#435b4c}

/* Fictional excerpts show the reading style; remaining topics lead to the existing free start. */
#reading-app .example-excerpt{padding-bottom:12px}
#reading-app .example-included{margin:18px 0 28px}
body.gyeol-mobile-ui #reading-app .example-included h3{font-size:20px;line-height:1.6;margin-bottom:16px;color:#344b3b}
#reading-app .example-included ol{list-style:none;padding:0;margin:0;border-bottom:1px solid #d9dfd2}
#reading-app .example-included li{display:grid;grid-template-columns:24px minmax(0,1fr);gap:10px;padding:15px 0;border-top:1px solid #d9dfd2;font-size:15px;line-height:1.7;color:#435a48;word-break:keep-all}
#reading-app .example-chapter-index{color:#66785c;font-size:12px}
#reading-app .example-invitation{padding:28px 0;background:transparent;border:0;border-top:1px solid #d9dfd2;border-radius:0;text-align:center}
body.gyeol-mobile-ui #reading-app .example-invitation h3{font-size:20px;line-height:1.6;word-break:keep-all;margin:0 0 18px}
#reading-app .example-invitation>a{display:flex;align-items:center;justify-content:center;width:100%;min-height:50px;text-decoration:none;font-size:15px}

.checkout-contents{margin:20px 0 24px;padding:16px 0;border-block:1px solid var(--line,#deded0)}.checkout-contents summary{font-size:14px;line-height:1.7;cursor:pointer}.checkout-contents ol{padding-left:23px;margin:14px 0 0}.checkout-contents li{font-size:14px;line-height:1.8;padding:4px 0;word-break:keep-all}
