:root { color-scheme: light; --ink: #1e2530; --muted: #687180; --line: #e2e5e9; --accent: #15191f; }
* { box-sizing: border-box; }
body { min-height: 100vh; margin: 0; background: #f5f5f3; color: var(--ink); font-family: "Prompt", "Segoe UI", sans-serif; }
button { font: inherit; }
.create-header { position: sticky; top: 0; z-index: 10; display: flex; min-height: 76px; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.94); padding: 14px clamp(20px, 5vw, 72px); backdrop-filter: blur(12px); }
.brand { color: #161b22; font-size: 17px; font-weight: 700; letter-spacing: .08em; text-decoration: none; }
.steps { display: flex; align-items: center; gap: clamp(12px, 3vw, 38px); margin: 0; padding: 0; list-style: none; }
.steps li { display: flex; align-items: center; gap: 8px; color: #9298a1; font-size: 13px; }
.steps span { display: grid; width: 27px; height: 27px; place-items: center; border: 1px solid #cfd3d8; border-radius: 50%; font-size: 11px; }
.steps li.active { color: var(--ink); font-weight: 500; }
.steps li.active span { border-color: var(--accent); background: var(--accent); color: #fff; }
.create-shell { width: min(1180px, calc(100% - 36px)); margin: 0 auto; padding: clamp(44px, 6vw, 76px) 0 88px; }
.flow-panel[hidden] { display: none; }
.section-heading { max-width: 720px; margin-bottom: 38px; }
.eyebrow { color: #777e87; font-size: 11px; font-weight: 600; letter-spacing: .16em; }
h1, .section-heading h2 { margin: 9px 0 8px; font-size: clamp(30px, 4vw, 50px); font-weight: 500; letter-spacing: -.025em; }
.section-heading p { margin: 0; color: var(--muted); font-size: 16px; line-height: 1.7; }
fieldset { margin: 0 0 32px; padding: 0; border: 0; }
legend { margin-bottom: 14px; font-size: 14px; font-weight: 500; }
.cover-options { display: flex; flex-wrap: wrap; gap: 10px; }
.choice-button { min-height: 46px; border: 1px solid #d9dde2; border-radius: 999px; background: #fff; color: #4e5662; cursor: pointer; padding: 0 22px; }
.choice-button.selected { border-color: #1c222b; background: #1c222b; color: #fff; }
.size-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.size-card { display: flex; min-height: 170px; align-items: center; justify-content: center; flex-direction: column; gap: 9px; border: 1px solid var(--line); border-radius: 16px; background: #fff; color: var(--ink); cursor: pointer; padding: 20px; transition: border 150ms ease, transform 150ms ease, box-shadow 150ms ease; }
.size-card:hover { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(29,34,42,.07); }
.size-card.selected { border-color: #1b2027; box-shadow: inset 0 0 0 1px #1b2027; }
.size-card small { color: #838a94; }
.size-card .pricing-pending { color: #a45d00; }
.size-group-heading { grid-column: 1 / -1; margin: 18px 0 0; font-size: 17px; color: var(--ink); }
.size-group-heading:first-child { margin-top: 0; }
.size-shape { display: block; height: 58px; border: 1px solid #aeb5be; background: #fafafa; box-shadow: 2px 3px 0 #e4e6e9; }
.size-shape.square { width: 58px; } .size-shape.landscape { width: 76px; } .size-shape.portrait { width: 46px; }
.flow-actions { display: flex; gap: 10px; margin-top: 30px; } .flow-actions.end { justify-content: flex-end; }
.primary-button, .secondary-button { min-height: 48px; border-radius: 9px; cursor: pointer; padding: 0 22px; font-weight: 500; }
.primary-button { border: 1px solid var(--accent); background: var(--accent); color: #fff; } .primary-button:hover { background: #343a43; }
.secondary-button { display: inline-flex; align-items: center; justify-content: center; border: 1px solid #d8dce1; background: #fff; color: #555e6a; text-decoration: none; } .secondary-button:disabled { cursor: not-allowed; opacity: .55; }
.template-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.project-name-field { display: grid; max-width: 560px; gap: 7px; margin: -14px 0 30px; }
.project-name-field > span { font-size: 13px; font-weight: 500; }
.project-name-field input { min-height: 48px; border: 1px solid #ccd3dc; border-radius: 9px; background: #fff; color: var(--ink); padding: 0 14px; font: inherit; }
.project-name-field input:focus { border-color: #1c222b; outline: 2px solid rgba(28,34,43,.1); }
.project-name-field small { color: var(--muted); font-size: 11px; }
.template-card { overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: 0 12px 34px rgba(33,38,45,.06); }
.template-minimal-white { grid-column: span 2; } .template-card.disabled { box-shadow: none; }
.template-section-heading { display: flex; grid-column: 1 / -1; align-items: flex-end; justify-content: space-between; gap: 16px; margin: 10px 0 -4px; }
.template-section-heading strong { font-size: 20px; font-weight: 500; }
.template-section-heading span { color: var(--muted); font-size: 12px; }
.template-section-heading.blank-heading { align-items: flex-start; flex-direction: column; gap: 3px; margin-top: 24px; padding-top: 25px; border-top: 1px solid var(--line); }
.blank-template-card { display: grid; grid-column: 1 / -1; grid-template-columns: minmax(230px, .7fr) 1.3fr; box-shadow: none; }
.blank-template-card .template-preview { min-height: 205px; }
.template-preview { display: grid; min-height: 250px; place-items: center; overflow: hidden; background: #e9e8e4; }
.minimal-preview { min-height: 330px; background: #e9e9e6; }
.minimal-showcase { position: relative; width: min(510px, 88%); height: 270px; }
.showcase-cover { position: absolute; top: 2px; left: 1%; z-index: 2; display: flex; width: 152px; aspect-ratio: .78; align-items: center; flex-direction: column; background: #fff; box-shadow: 0 14px 28px rgba(23,23,23,.15); padding: 15px; transform: rotate(-4deg); }
.showcase-cover-image { width: 100%; height: 145px; background: linear-gradient(145deg, #d7d5d0 0 23%, #8d918d 23% 47%, #c3bcb2 47% 68%, #6f746f 68%); }
.showcase-cover strong { margin-top: 14px; color: #171717; font-size: 10px; font-weight: 500; letter-spacing: .11em; }
.showcase-cover small { margin-top: 4px; color: #737373; font-size: 6px; letter-spacing: .12em; }
.showcase-spread { position: absolute; right: 0; bottom: 3px; display: grid; width: 72%; height: 190px; grid-template: repeat(2, 1fr) / 1.55fr 1fr; gap: 8px; background: linear-gradient(90deg, #fff 49.65%, #e7e7e3 50%, #fff 50.35%); box-shadow: 0 12px 28px rgba(23,23,23,.13); padding: 18px 18px 20px; transform: rotate(2deg); }
.showcase-photo { min-width: 0; background: linear-gradient(135deg, #b9b8b3, #777b77); }
.showcase-photo-large { grid-row: 1 / 3; background: linear-gradient(145deg, #7f847e, #c9c5bd 54%, #999d97); }
.showcase-spread i { position: absolute; bottom: 10px; left: 56%; width: 28%; height: 2px; background: #d7d7d2; }
.coming-preview { min-height: 180px; background: repeating-linear-gradient(135deg, #f2f2f0, #f2f2f0 12px, #ececea 12px, #ececea 24px); }
.preview-book { display: flex; width: 148px; aspect-ratio: .8; align-items: center; flex-direction: column; background: #fff; box-shadow: -4px 9px 24px rgba(40,42,46,.2); padding: 15px; transform: rotate(-3deg); }
.preview-image { width: 100%; flex: 1; background: linear-gradient(145deg, #b8bec5, #575f69); }
.preview-book strong { margin-top: 12px; font-size: 11px; font-weight: 500; letter-spacing: .14em; }
.coming-preview .preview-book { width: 116px; opacity: .48; filter: grayscale(1); } .coming-preview .preview-image { background: #bdc1c5; }
.config-preview { min-height: 320px; background: linear-gradient(145deg, #eeeee9, #deded8); }
.config-showcase { position: relative; width: min(540px, 90%); height: 276px; }
.config-cover { position: absolute; top: 2px; left: 2%; z-index: 2; display: flex; width: 150px; aspect-ratio: .78; align-items: center; flex-direction: column; border: 1px solid rgba(30,35,42,.08); background: #fff; box-shadow: 0 15px 30px rgba(23,23,23,.17); padding: 14px; transform: rotate(-4deg); }
.config-cover-image { display: block; width: 100%; height: 142px; background-color: #c8cbc5; background-image: var(--sample-image, linear-gradient(145deg, #bfc5bd, var(--preview-accent) 48%, #d6c7b8)); background-position: center; background-size: cover; object-fit: cover; }
.config-cover strong { margin-top: 13px; color: #171717; font-size: 9px; font-weight: 600; letter-spacing: .1em; text-align: center; }
.config-cover small { margin-top: 4px; color: #747b84; font-size: 6px; letter-spacing: .1em; text-align: center; }
.preview-blank .config-cover-image { height: 118px; border: 1px dashed #c8ced6; background: repeating-linear-gradient(135deg, #fff, #fff 8px, #f7f8f9 8px, #f7f8f9 16px); }
.config-spread { position: absolute; right: 0; bottom: 34px; display: grid; width: 72%; height: 184px; grid-template: repeat(2, 1fr) / 1.55fr 1fr; gap: 7px; border: 1px solid rgba(30,35,42,.08); background: linear-gradient(90deg, #fff 49.6%, #deded9 50%, #fff 50.4%); box-shadow: 0 12px 27px rgba(23,23,23,.13); padding: 17px; transform: rotate(2deg); }
.spread-photo { min-width: 0; background-color: #bbbdb7; background-image: var(--sample-image, linear-gradient(140deg, #bbbdb7, var(--preview-accent))); background-position: center; background-size: cover; }
.spread-photo > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.spread-photo:nth-child(2) > img { object-position: 25% center; }.spread-photo:nth-child(3) > img { object-position: 75% center; }
.spread-photo:nth-child(2) { background-position: 25% center; }.spread-photo:nth-child(3) { background-position: 75% center; }
.spread-photo.feature { grid-row: 1 / 3; }
.config-spread i { position: absolute; right: 10%; bottom: 8px; width: 26%; height: 2px; background: #d7d9d5; }
.spread-diagram .spread-photo { border: 1px dashed #acb4bf; background: #fafbfc; }
.spread-grid { grid-template: repeat(2, 1fr) / repeat(2, 1fr); }
.spread-grid .spread-photo.feature { grid-row: auto; }
.layout-mini-strip { position: absolute; right: 3%; bottom: 0; display: flex; gap: 7px; }
.layout-mini { display: grid; width: 52px; height: 31px; grid-template-columns: repeat(2, 1fr); gap: 2px; border: 1px solid #bdc3cb; background: #fff; padding: 4px; }
.layout-mini i { border: 1px solid #ccd1d7; background: #f1f3f4; }
.layout-mini-1 i:first-child { grid-area: 1 / 1 / 3 / 3; }.layout-mini-1 i:not(:first-child) { display: none; }
.layout-mini-2 i:first-child { grid-row: 1 / 3; }.layout-mini-2 i:nth-child(n+3) { display: none; }
.coming-preview .config-showcase { opacity: .82; filter: saturate(.82); }
.dialog-template-preview { min-height: 180px; border-radius: 12px; }
.dialog-template-preview .config-showcase { height: 170px; transform: scale(.62); transform-origin: center; }
.template-card-body { padding: 22px; } .template-status { color: #747b84; font-size: 10px; font-weight: 600; letter-spacing: .12em; }
.template-card h2 { margin: 7px 0 5px; font-size: 22px; font-weight: 500; }
.template-card p { min-height: 48px; margin: 0 0 18px; color: var(--muted); font-size: 13px; line-height: 1.7; }
.template-tags { display: flex; min-height: 30px; flex-wrap: wrap; gap: 6px; margin: -8px 0 16px; }
.template-tags span { border: 1px solid #e0e3e7; border-radius: 999px; background: #f7f8f9; color: #69727f; font-size: 10px; padding: 4px 8px; }
.template-card .primary-button, .template-card .secondary-button { width: 100%; }
@media (max-width: 860px) { .size-grid, .template-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .template-minimal-white { grid-column: span 2; } .blank-template-card { grid-template-columns: 1fr 1fr; } }
@media (max-width: 620px) { .create-header { align-items: flex-start; flex-direction: column; } .steps { width: 100%; justify-content: space-between; gap: 5px; } .steps li { flex-direction: column; font-size: 10px; text-align: center; } .create-shell { width: min(100% - 24px, 1180px); padding-top: 34px; } .size-grid, .template-grid { grid-template-columns: 1fr; } .template-minimal-white { grid-column: auto; } .blank-template-card { display: block; grid-column: auto; } .template-section-heading { align-items: flex-start; flex-direction: column; gap: 3px; } .template-preview { min-height: 250px; } .config-showcase { height: 230px; transform: scale(.82); } .flow-actions.end .primary-button { width: 100%; } .template-navigation { flex-direction: column; } }
.product-choice-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px; }
.product-choice { min-height:190px;display:flex;align-items:flex-start;flex-direction:column;border:1px solid var(--line);border-radius:18px;background:#fff;color:var(--ink);cursor:pointer;padding:25px;text-align:left;transition:transform .16s,box-shadow .16s; }.product-choice:hover{transform:translateY(-3px);box-shadow:0 16px 34px rgba(50,36,49,.08)}.product-choice>span{display:grid;width:43px;height:43px;place-items:center;border-radius:13px;background:#f8e9f0;color:#a84d74;font-size:21px}.product-choice strong{margin-top:20px;font-size:20px}.product-choice small{margin-top:7px;color:var(--muted);line-height:1.6}.product-choice.coming{opacity:.6}.photobook-choice>span{background:#eee9f7;color:#6d54a0}.photo-print-choice>span{background:#e6efff;color:#3157d5}
.create-template-preview{min-height:285px;display:grid;place-items:center;background:#fff9ef}.create-template-preview>div{display:flex;width:66%;aspect-ratio:.714;align-items:center;justify-content:center;flex-direction:column;border:1px solid #d6b9b0;background:#fffaf0;box-shadow:0 16px 30px rgba(61,43,52,.13);text-align:center}.create-template-preview small{font-size:9px;letter-spacing:.16em}.create-template-preview strong{margin-top:18px;font:600 22px "Noto Serif Thai",serif}.create-template-preview.wedding-floral{background:radial-gradient(circle at 15% 15%,#d9a8ad 0 7%,transparent 7.5%),#f3ece8}.create-template-preview.ordination-gold>div{border:3px double #b48a32;color:#79591d}.book-template-preview{background:#e9e9e6}.book-template-preview>div{aspect-ratio:.78;border:0;background:linear-gradient(145deg,#f7f7f5,#d8d6d1)}.template-empty{grid-column:1/-1;border:1px dashed #cfd3d8;border-radius:16px;background:#fff;padding:34px;color:var(--muted);text-align:center}
.card-template-preview{background:linear-gradient(145deg,#eee9e5,#ded7d8)}.create-card-thumbnail{display:block;width:min(66%,250px);height:auto;border:1px solid rgba(75,59,65,.12);background:#fff;box-shadow:0 16px 30px rgba(61,43,52,.16)}
@media(max-width:860px){.product-choice-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:620px){.product-choice-grid{grid-template-columns:1fr}.steps{overflow-x:auto}.steps li{min-width:58px}}

/* Readable typography scale */
body{font-size:16px}.brand{font-size:20px}.steps li{font-size:15px}.steps span{font-size:14px}.eyebrow{font-size:14px}h1{font-size:clamp(36px,4vw,54px)}legend,.project-name-field>span{font-size:16px}.choice-button,.primary-button,.secondary-button,.project-name-field input{font-size:16px}.project-name-field small,.size-card small,.template-section-heading span,.template-status,.template-tags span{font-size:13px}.template-card p{font-size:15px}.template-card h2{font-size:22px}.product-choice small{font-size:14px}
@media(max-width:620px){.steps li{font-size:13px}}

/* Photo Book template selection */
.template-step { --template-purple:#7147dc; --template-purple-dark:#5934bf; }
.template-step-hero { position:relative; display:grid; grid-template-columns:minmax(0,1.4fr) minmax(300px,.6fr); gap:40px; align-items:end; margin:-18px 0 26px; padding:34px 36px; overflow:hidden; border:1px solid #e7e0f6; border-radius:28px; background:radial-gradient(circle at 88% 14%,rgba(136,93,225,.18),transparent 26%),linear-gradient(135deg,#fff 0%,#fbf9ff 54%,#f2edff 100%); box-shadow:0 18px 55px rgba(70,48,120,.08); }
.template-step-hero::after { content:""; position:absolute; right:-60px; bottom:-105px; width:310px; height:210px; border:28px solid rgba(113,71,220,.055); border-radius:50%; transform:rotate(-14deg); }
.template-step-heading { position:relative; z-index:1; display:flex; gap:18px; align-items:flex-start; }
.template-heading-icon { display:grid; width:54px; height:54px; flex:0 0 54px; place-items:center; border:1px solid #ded1fa; border-radius:16px; background:#fff; color:var(--template-purple); font-size:27px; box-shadow:0 8px 24px rgba(93,59,177,.12); }
.template-step-heading h1,.template-step-heading h2 { margin:5px 0 7px; font-family:"Noto Serif Thai","Maitree",serif; font-size:clamp(31px,3.4vw,48px); font-weight:600; letter-spacing:-.035em; }
.template-step-heading p { max-width:670px; margin:0; color:#697187; font-size:15px; line-height:1.7; }
.template-step .eyebrow { color:var(--template-purple); font-size:12px; }
.template-step .project-name-field { position:relative; z-index:1; max-width:none; margin:0; }
.template-step .project-name-field > span:first-child { color:#32384a; font-weight:600; }
.project-name-control { position:relative; display:block; }
.project-name-control input { width:100%; padding-right:44px; border-color:#dcd6e8; border-radius:12px; box-shadow:0 7px 20px rgba(60,47,91,.05); }
.project-name-control > span { position:absolute; top:50%; right:15px; color:#20a45b; transform:translateY(-50%); font-weight:700; }
.template-intro { display:flex; gap:15px; align-items:flex-start; margin:0 0 26px; padding:17px 20px; border:1px solid #ddd4f5; border-radius:16px; background:linear-gradient(100deg,#f8f5ff,#fff); color:#4d5063; }
.template-intro > span { display:grid; width:31px; height:31px; flex:0 0 31px; place-items:center; border-radius:50%; background:var(--template-purple); color:#fff; font-family:serif; font-weight:700; }
.template-intro strong { color:#29283a; }
.template-intro p { margin:2px 0 0; font-size:13px; line-height:1.65; }
.template-intro b { color:var(--template-purple-dark); }
.template-step:not(.card-template-step) .template-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.template-step:not(.card-template-step) .template-minimal-white { grid-column:auto; }
.card-template-step .template-step-hero { display:block; margin:0 0 28px; padding:0; overflow:visible; border:0; border-radius:0; background:transparent; box-shadow:none; }
.card-template-step .template-step-hero::after,.card-template-step .template-heading-icon { display:none; }
.card-template-step .project-name-field { max-width:620px; margin-top:22px; }
.photo-book-template-card { position:relative; display:flex; min-width:0; overflow:hidden; flex-direction:column; border:1px solid #e6e2ed; border-radius:22px; background:#fff; box-shadow:0 14px 38px rgba(39,31,59,.075); cursor:pointer; transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.photo-book-template-card:hover { z-index:2; border-color:#cbbaf2; box-shadow:0 22px 50px rgba(74,48,130,.15); transform:translateY(-6px); }
.photo-book-template-card:focus-visible { outline:3px solid rgba(113,71,220,.3); outline-offset:3px; }
.photo-book-template-card.selected { border-color:var(--template-purple); box-shadow:0 0 0 3px rgba(113,71,220,.13),0 22px 50px rgba(74,48,130,.15); }
.photo-book-template-card.selected::after { content:"✓ เลือกแล้ว"; position:absolute; top:13px; right:13px; z-index:6; border-radius:999px; background:var(--template-purple); color:#fff; padding:5px 9px; font-size:11px; font-weight:600; box-shadow:0 6px 15px rgba(72,42,150,.25); }
.photo-book-template-card .book-template-preview { position:relative; min-height:310px; overflow:hidden; background:radial-gradient(circle at 50% 22%,#fff 0 7%,transparent 45%),linear-gradient(145deg,#f4f1f7,#e7e2eb); }
.book-template-preview > .template-book-scene { position:relative; display:grid; width:100%; height:310px; aspect-ratio:auto; place-items:center; border:0; background:transparent; box-shadow:none; padding:0; perspective:1000px; transform:none; }
.template-book-scene::after { content:""; position:absolute; left:50%; bottom:27px; width:63%; height:25px; border-radius:50%; background:rgba(33,27,43,.2); filter:blur(15px); transform:translateX(-47%); }
.template-book-mockup { position:relative; z-index:2; width:176px; height:228px; transform:rotateY(-8deg) rotateX(2deg) rotateZ(-1deg); transform-style:preserve-3d; transition:transform .25s ease; }
.photo-book-template-card:hover .template-book-mockup { transform:rotateY(-3deg) rotateX(1deg) translateY(-4px); }
.template-book-pages { position:absolute; top:8px; right:-8px; bottom:-7px; left:7px; border-radius:2px 6px 7px 3px; background:repeating-linear-gradient(90deg,#e8e4dc 0 1px,#fff 1px 3px); box-shadow:7px 10px 16px rgba(43,36,49,.14); transform:translateZ(-8px); }
.template-book-spine { position:absolute; z-index:3; top:0; bottom:0; left:-9px; width:16px; border-radius:4px 0 0 4px; background:var(--template-accent); background:linear-gradient(90deg,color-mix(in srgb,var(--template-accent) 65%,#302a37),color-mix(in srgb,var(--template-accent) 35%,var(--template-paper))); box-shadow:inset -3px 0 4px rgba(0,0,0,.18); transform:rotateY(-24deg); transform-origin:right; }
.template-book-cover { position:absolute; z-index:4; inset:0; overflow:hidden; border:1px solid rgba(41,34,48,.1); border-radius:3px 7px 7px 3px; background:var(--template-paper); color:var(--template-ink); box-shadow:inset 0 0 25px rgba(255,255,255,.25),0 10px 22px rgba(39,32,44,.14); }
.template-cover-image { position:absolute; top:15px; right:14px; left:14px; height:57%; overflow:hidden; background:linear-gradient(145deg,#e5e1e7,var(--template-accent)); }
.template-cover-image img { width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
.photo-book-template-card:hover .template-cover-image img { transform:scale(1.035); }
.template-cover-copy { position:absolute; right:13px; bottom:13px; left:13px; display:flex; align-items:center; flex-direction:column; text-align:center; }
.template-cover-copy small { font-size:6px; letter-spacing:.2em; opacity:.67; }
.template-cover-copy strong { max-width:100%; margin-top:6px; font:600 16px/1.15 "Noto Serif Thai",serif; letter-spacing:.035em; }
.template-cover-copy em { margin-top:5px; font:500 7px/1.3 "Prompt",sans-serif; letter-spacing:.09em; opacity:.72; }
.blank-cover-art { display:grid; height:48%; grid-template-columns:repeat(3,1fr); gap:5px; align-items:end; border:1px solid #d8d2cd; background:linear-gradient(145deg,#faf9f7,#eeeae5); padding:18px; }
.blank-cover-art i { display:block; height:55%; border:1px solid #a69b90; border-radius:50% 50% 5px 5px; opacity:.55; }
.blank-cover-art i:nth-child(2) { height:85%; }
.cover-minimal .template-cover-image { height:52%; }
.cover-travel .template-book-cover,.cover-graduation .template-book-cover { color:#fff; }
.cover-travel .template-cover-image,.cover-graduation .template-cover-image { inset:0; height:auto; }
.cover-travel .template-cover-image::after,.cover-graduation .template-cover-image::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(10,24,38,.12),rgba(8,23,40,.72)); }
.cover-travel .template-cover-copy,.cover-graduation .template-cover-copy { z-index:2; top:25px; bottom:auto; text-shadow:0 2px 9px rgba(0,0,0,.42); }
.cover-travel .template-cover-copy strong,.cover-graduation .template-cover-copy strong { font-size:20px; }
.cover-wedding .template-book-cover { background:#fff9ed; }
.cover-wedding .template-cover-image { top:58px; height:54%; border-radius:90px 90px 4px 4px; outline:1px solid rgba(180,145,89,.38); outline-offset:4px; }
.cover-wedding .template-cover-copy { top:19px; bottom:auto; color:#876b3e; }
.cover-wedding .template-cover-copy em { display:none; }
.cover-baby .template-cover-image { top:auto; right:0; bottom:0; left:42%; height:100%; }
.cover-baby .template-cover-copy { top:40px; right:56%; bottom:auto; left:12px; align-items:flex-start; text-align:left; }
.cover-baby .template-cover-copy strong { font-size:18px; }
.cover-graduation .template-cover-image img { object-position:center 34%; }
.cover-graduation .template-cover-copy { top:22px; padding:9px 5px; background:rgba(14,37,70,.72); }
.photo-book-template-card .template-card-body { display:flex; flex:1; flex-direction:column; padding:20px 21px 21px; }
.template-badge { align-self:flex-start; border-radius:999px; background:#f0eaff; color:#6c43cc; padding:4px 9px; font-size:11px; font-weight:600; }
.photo-book-template-card h2 { margin:10px 0 2px; font-family:"Noto Serif Thai","Maitree",serif; font-size:23px; font-weight:600; }
.template-card-subtitle { color:#37384a; font-size:13px; font-weight:500; }
.photo-book-template-card .template-card-body > p:not(.template-recommendation) { min-height:69px; margin:7px 0 13px; color:#687084; font-size:13px; line-height:1.65; }
.template-best-for,.template-style-tags { display:flex; flex-wrap:wrap; gap:5px; align-items:center; margin-bottom:9px; }
.template-best-for > span,.template-style-tags > span { min-width:54px; color:#747b8d; font-size:11px; font-weight:600; }
.template-best-for small,.template-style-tags small { border:1px solid #e3ddef; border-radius:999px; background:#faf8ff; color:#655c74; padding:3px 7px; font-size:10px; }
.template-layout-feature { margin:5px 0 10px; padding:11px 12px; border-radius:11px; background:#f7f4fc; }
.template-layout-feature > span { color:#6241b8; font-size:11px; font-weight:700; }
.template-layout-feature p { min-height:0 !important; margin:4px 0 0 !important; color:#52566a !important; font-size:11px !important; line-height:1.55 !important; }
.template-recommendation { min-height:0 !important; margin:0 0 15px !important; color:#777d8c !important; font-size:11px !important; line-height:1.55 !important; }
.photo-book-template-card .primary-button { margin-top:auto; min-height:46px; border:0; border-radius:11px; background:linear-gradient(135deg,var(--template-purple),#8658e6); box-shadow:0 8px 18px rgba(96,57,190,.18); font-weight:600; transition:transform .15s ease,box-shadow .15s ease; }
.photo-book-template-card .primary-button:hover { background:linear-gradient(135deg,var(--template-purple-dark),#7446d3); box-shadow:0 11px 23px rgba(96,57,190,.27); transform:translateY(-1px); }
.template-back-actions { margin-top:26px; }

@media (max-width:980px) {
    .template-step-hero { grid-template-columns:1fr; gap:24px; }
    .template-step .project-name-field { max-width:560px; }
    .template-step:not(.card-template-step) .template-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:620px) {
    .template-step-hero { margin-top:-8px; padding:24px 19px; border-radius:20px; }
    .template-step-heading { gap:12px; }
    .template-heading-icon { width:44px; height:44px; flex-basis:44px; border-radius:13px; font-size:22px; }
    .template-step-heading h1,.template-step-heading h2 { font-size:29px; }
    .template-intro { padding:14px; }
    .template-intro p { font-size:12px; }
    .template-step:not(.card-template-step) .template-grid { grid-template-columns:1fr; }
    .photo-book-template-card .book-template-preview { min-height:285px; }
    .book-template-preview > .template-book-scene { height:285px; }
}
@media (prefers-reduced-motion:reduce) {
    .photo-book-template-card,.template-book-mockup,.template-cover-image img,.photo-book-template-card .primary-button { transition:none; }
}

/* Book Theme Flow V2 */
.book-theme-hero { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin:-12px 0 28px; padding:32px; border:1px solid #e6def2; border-radius:24px; background:linear-gradient(135deg,#fff 0%,#faf7ff 60%,#f0e9fb 100%); }
.book-theme-hero h2 { margin:6px 0 8px; font:600 clamp(30px,4vw,48px) "Noto Serif Thai",serif; letter-spacing:-.03em; }
.book-theme-hero p { max-width:720px; margin:0; color:var(--muted); line-height:1.7; }
.special-theme-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-bottom:28px; }
.special-theme-grid .book-theme-card button { grid-template-columns:150px minmax(0,1fr); }
.theme-catalog-layout { display:grid; grid-template-columns:190px minmax(0,1fr); gap:28px; align-items:start; }
.theme-category-sidebar { position:sticky; top:100px; display:grid; gap:6px; }
.theme-category-sidebar button { min-height:43px; border:0; border-radius:10px; background:transparent; color:#626b78; padding:9px 13px; text-align:left; cursor:pointer; font:inherit; }
.theme-category-sidebar button:hover,.theme-category-sidebar button.active { background:#f0eafb; color:#6841a3; font-weight:600; }
.book-theme-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.book-theme-card { min-width:0; overflow:hidden; border:1px solid #e3dfe8; border-radius:18px; background:#fff; box-shadow:0 10px 28px rgba(43,32,60,.07); }
.book-theme-card > button { display:grid; width:100%; height:100%; border:0; background:#fff; color:inherit; padding:0; text-align:left; cursor:pointer; font:inherit; }
.book-theme-card:hover { border-color:#cdbce0; box-shadow:0 17px 34px rgba(43,32,60,.13); transform:translateY(-2px); }
.book-theme-card-body { position:relative; display:grid; align-content:start; gap:6px; padding:17px; }
.book-theme-card-body h3 { margin:0; font-size:19px; }
.book-theme-card-body p { min-height:43px; margin:0; color:var(--muted); font-size:13px; line-height:1.6; }
.book-theme-card-body > strong { margin-top:5px; color:#6841a3; font-size:13px; }
.book-theme-card-body em { position:absolute; top:16px; right:16px; border-radius:999px; background:#e9f8ee; color:#168044; padding:3px 7px; font-size:10px; font-style:normal; font-weight:600; }
.book-theme-category { color:#7653a7; font-size:10px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; }
.book-theme-cover-art { position:relative; overflow:hidden; width:100%; aspect-ratio:1; border-bottom:1px solid #e7e2ea; background:var(--theme-cover-background,#fff); }
.theme-book-mockup-scene{position:relative;display:grid;min-height:245px;place-items:center;overflow:hidden;background:radial-gradient(circle at 48% 34%,#fff 0,#f4f0f6 58%,#e9e3ed 100%);padding:22px;perspective:950px}.theme-book-mockup-scene::after{position:absolute;right:14%;bottom:19px;left:17%;height:14px;border-radius:50%;background:rgba(42,31,49,.2);content:"";filter:blur(10px);transform:rotate(-2deg)}.theme-book-mockup{position:relative;z-index:1;width:min(158px,70%);aspect-ratio:.82;filter:drop-shadow(12px 14px 9px rgba(45,33,52,.22));transform:rotateY(-10deg) rotateX(2deg) rotateZ(-1.5deg);transform-style:preserve-3d;transition:transform .25s ease}.book-theme-card:hover .theme-book-mockup{transform:rotateY(-4deg) rotateX(1deg) rotateZ(0) translateY(-3px)}.theme-book-page-thickness{position:absolute;z-index:0;top:3%;right:-6%;bottom:-3%;left:5%;border-radius:1px 7px 7px 2px;background:repeating-linear-gradient(0deg,#ddd9dc 0 1px,#fff 1px 3px);box-shadow:5px 6px 9px rgba(42,31,48,.14);transform:translateZ(-7px)}.theme-book-cover-spine{position:absolute;z-index:5;top:0;bottom:0;left:0;width:9%;border-radius:5px 0 0 5px;background:linear-gradient(90deg,rgba(29,22,35,.27),rgba(255,255,255,.18) 45%,rgba(29,22,35,.13));box-shadow:inset -2px 0 3px rgba(0,0,0,.14);pointer-events:none;transform:translateZ(5px)}.theme-book-mockup>.book-theme-cover-art,.theme-book-mockup>.public-template-art{position:absolute;z-index:3;inset:0;width:100%;height:100%;aspect-ratio:auto;border:1px solid rgba(45,34,51,.12);border-radius:5px 9px 9px 5px;box-shadow:inset -8px 0 13px rgba(255,255,255,.18);transform:translateZ(3px)}
.theme-book-mockup-scene.representative-photo{padding:0;background:#f6f2f5}.theme-book-mockup-scene.representative-photo::after{display:none}.theme-book-representative-photo{display:block;width:100%;height:100%;min-height:245px;object-fit:contain;transition:transform .3s ease}.book-theme-card:hover .theme-book-representative-photo{transform:scale(1.025)}
.book-theme-cover-art.large { width:min(470px,100%); border:1px solid #ded8e3; border-radius:8px; box-shadow:0 18px 44px rgba(39,29,51,.16); }
.book-theme-cover-shape,.book-theme-cover-photo,.book-theme-cover-sticker,.book-theme-cover-text { position:absolute; box-sizing:border-box; }
.book-theme-cover-shape { z-index:1; border:0 solid transparent; }.book-theme-cover-shape.shape-rounded{border-radius:12%}.book-theme-cover-shape.shape-ellipse{border-radius:50%}.book-theme-cover-shape.shape-frame{border-width:1px;background:transparent!important}.book-theme-cover-shape.shape-line{height:1px!important;border-top:1px solid;background:transparent!important}
.book-theme-cover-photo { z-index:2; display:grid; place-items:center; border:2px solid rgba(255,255,255,.94); background:linear-gradient(145deg,#d7dce2,#eef1f3); color:#8995a3; font-size:12px; box-shadow:0 3px 8px rgba(30,42,55,.14); }
.book-theme-cover-photo img { width:100%; height:100%; object-fit:cover; }
.book-theme-cover-sticker { z-index:5; display:grid; place-items:center; font-size:clamp(10px,1.5vw,20px); }
.book-theme-cover-text { z-index:6; overflow:hidden; line-height:1.15; white-space:nowrap; }.book-theme-cover-text.role-cover-title{font-size:clamp(9px,1.25vw,17px)}.book-theme-cover-text:not(.role-cover-title){font-size:clamp(6px,.7vw,10px)}
.theme-detail-back { margin-bottom:18px; border:0; background:transparent; color:#654092; cursor:pointer; font:inherit; }
.theme-detail-layout { display:grid; grid-template-columns:minmax(380px,1.05fr) minmax(360px,.95fr); gap:48px; align-items:start; }
.theme-detail-preview { position:sticky; top:100px; }.theme-detail-preview > div:first-child{display:grid; min-height:480px; place-items:center; overflow:hidden; border-radius:22px; background:radial-gradient(circle at 50% 34%,#fff,#f0ebf3); padding:30px;}.theme-detail-preview>div[data-preview-aspect="cover"]{background:radial-gradient(circle at 50% 34%,#fff,#eee8f1)}.theme-detail-preview>div[data-preview-aspect="spine"],.theme-detail-preview>div[data-preview-aspect="spread"]{background:linear-gradient(145deg,#f8f6f9,#ece7ef)}
.theme-preview-thumbnails { display:grid; grid-template-columns:repeat(4,1fr); gap:9px; margin-top:12px; }
.theme-interior-fallback-heading{position:absolute;inset:auto 8% 10%;color:var(--theme-accent);font:600 12px/1.3 Prompt,sans-serif;text-align:center;letter-spacing:.05em}
.theme-preview-thumbnails button { overflow:hidden; aspect-ratio:1.25; border:2px solid transparent; border-radius:10px; background:#f3f0f4; padding:0; cursor:pointer; }.theme-preview-thumbnails button.selected{border-color:#7147dc;box-shadow:0 0 0 2px rgba(113,71,220,.14)}.theme-preview-thumbnails button:focus-visible{outline:3px solid rgba(113,71,220,.28);outline-offset:2px}.theme-preview-thumbnails .book-theme-cover-art{border:0}.theme-preview-thumbnails .book-theme-cover-text{font-size:4px!important}
.theme-detail-controls h2 { margin:5px 0 6px; font:600 clamp(30px,3.5vw,44px) "Noto Serif Thai",serif; }.theme-detail-controls>p{margin:0 0 10px;color:var(--muted);line-height:1.7}.theme-detail-controls fieldset{margin:20px 0 0}.theme-project-name{margin:20px 0 0}.theme-project-name input{width:100%}
.theme-detail-tags { display:flex; flex-wrap:wrap; gap:6px; }.theme-detail-tags span{border:1px solid #e3dce9;border-radius:999px;background:#faf8fc;color:#6b6373;padding:4px 8px;font-size:11px}
.theme-size-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }.theme-size-option{display:flex;min-height:76px;align-items:center;gap:12px;border:1px solid #dce0e5;border-radius:12px;background:#fff;padding:11px 13px;text-align:left;cursor:pointer}.theme-size-option.selected{border-color:#232831;box-shadow:inset 0 0 0 1px #232831}.theme-size-option .size-shape{width:34px;height:34px;flex:0 0 auto}.theme-size-option .size-shape.landscape{width:44px}.theme-size-option .size-shape.portrait{width:27px}.theme-size-option>span:last-child{display:grid;gap:2px}.theme-size-option small{color:var(--muted)}
.theme-page-count { display:grid; gap:6px; margin-top:18px; }.theme-page-count span,.theme-coupon>label{font-weight:600}.theme-page-count select,.theme-coupon input{min-height:46px;border:1px solid #ccd3dc;border-radius:9px;background:#fff;padding:0 13px;font:inherit}
.theme-price-card { display:grid; gap:2px; margin-top:20px; border-radius:14px; background:#1f2530; color:#fff; padding:18px 20px; }.theme-price-card span{font-size:12px;opacity:.72}.theme-price-card strong{font-size:28px}.theme-price-card small{opacity:.72}
.theme-coupon { display:grid; gap:7px; margin-top:18px; }.theme-coupon>div{display:grid;grid-template-columns:1fr auto;gap:8px}.theme-coupon p{min-height:22px;margin:0;color:#287047;font-size:13px}.theme-start-button{width:100%;margin-top:8px;min-height:56px;font-size:17px}
.book-theme-spine-scene { display:flex!important; min-height:100%!important; align-items:center; justify-content:center; background:#eae6ec; padding:10%!important; perspective:700px; }.book-theme-spine-scene.large{width:min(680px,100%);min-height:0!important;aspect-ratio:1.55}.book-theme-spine-scene>span{width:9%;height:76%;border-radius:5px 0 0 5px;box-shadow:-5px 8px 10px rgba(0,0,0,.18);transform:skewY(-7deg)}.book-theme-spine-scene .book-theme-cover-art{width:70%;border:0;box-shadow:8px 10px 18px rgba(0,0,0,.18);transform:skewY(1deg)}
.book-theme-interior-preview { position:relative; display:grid!important; width:100%; min-height:100%!important; grid-template-columns:1.45fr 1fr; grid-template-rows:1fr 1fr; gap:3%; background-color:var(--theme-paper); padding:8%!important; box-shadow:0 12px 30px rgba(30,25,35,.13); transform:none!important; }.book-theme-interior-preview.large{width:min(720px,100%);min-height:0!important;aspect-ratio:1.62}.book-theme-interior-preview span{overflow:hidden;background:color-mix(in srgb,var(--theme-accent) 30%,#ddd)}.book-theme-interior-preview span:first-child{grid-row:1/3}.book-theme-interior-preview img{width:100%;height:100%;object-fit:cover}.book-theme-interior-preview.sample{grid-template:1fr/repeat(2,1fr)}.book-theme-interior-preview.sample span:first-child{grid-row:auto}
@media(max-width:980px){.book-theme-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.theme-detail-layout{grid-template-columns:1fr;gap:28px}.theme-detail-preview{position:static}.theme-detail-preview>div:first-child{min-height:400px}}
@media(max-width:700px){.book-theme-hero{align-items:stretch;flex-direction:column;padding:23px 19px}.special-theme-grid{grid-template-columns:1fr}.special-theme-grid .book-theme-card button{grid-template-columns:115px minmax(0,1fr)}.theme-catalog-layout{grid-template-columns:1fr;gap:16px}.theme-category-sidebar{position:static;display:flex;overflow-x:auto;padding-bottom:5px}.theme-category-sidebar button{flex:0 0 auto}.book-theme-grid{grid-template-columns:1fr}.book-theme-card>button{grid-template-columns:120px minmax(0,1fr)}.book-theme-cover-art{border-right:1px solid #e7e2ea;border-bottom:0}.theme-detail-preview>div:first-child{min-height:330px;padding:20px}.theme-preview-thumbnails{grid-template-columns:repeat(4,minmax(66px,1fr));overflow-x:auto}.theme-size-grid{grid-template-columns:1fr}.theme-detail-layout{display:block}.theme-detail-controls{margin-top:25px}.theme-coupon>div{grid-template-columns:1fr}.theme-coupon button{width:100%}}

/* Cover Template Browser reuses the public composition adapter. */
.cover-template-browser-card .book-theme-card-body{gap:7px;padding:14px 15px 16px}.cover-template-browser-card .book-theme-card-body p{min-height:0;font-size:11px}.cover-template-browser-card .book-theme-card-body>strong{margin-top:2px}.legacy-theme-card .book-theme-card-body>strong{color:#7b7180}.cover-template-browser-empty{grid-column:1/-1;margin:0;border:1px dashed #d8cfdf;border-radius:16px;background:#faf8fc;padding:44px;color:var(--muted);text-align:center}
.public-template-art{position:relative;overflow:hidden;width:100%;aspect-ratio:1;container-type:inline-size;border-bottom:1px solid #e7e2ea;background:#fff no-repeat center/cover}.public-template-art.large{width:min(470px,100%);border:1px solid #ded8e3;border-radius:8px;box-shadow:0 18px 44px rgba(39,29,51,.16)}.public-template-photo,.public-template-shape,.public-template-decoration,.public-template-text{position:absolute;box-sizing:border-box}.public-template-photo{overflow:hidden;background:#e5e9ee}.public-template-photo[data-photo-style="ivory-mat"],.public-template-photo[data-photo-style="polaroid"]{background:#fffaf0}.public-template-photo img{display:block;width:100%;height:100%;object-fit:cover}.public-template-decoration{display:grid;background-repeat:no-repeat;background-position:center;background-size:contain;place-items:center;font-size:3.2cqw}.public-template-shape.shape-rounded{border-radius:10px}.public-template-text{z-index:12;overflow:hidden;line-height:1.12;text-overflow:ellipsis;white-space:nowrap}.public-template-text.role-cover-title{text-wrap:balance}
@media(max-width:700px){.cover-template-browser-card>button{display:grid;grid-template-columns:120px minmax(0,1fr)}.cover-template-browser-card .public-template-art{height:100%;border-right:1px solid #e7e2ea;border-bottom:0}.theme-detail-preview #themeMainPreview>.public-template-art{width:min(280px,100%);height:auto}}

/* Phase 3.4: Theme-first cover template detail. */
.theme-detail-preview{position:static}
.theme-cover-template-options,.shared-interior-layouts{margin-top:24px;padding-top:22px;border-top:1px solid #e4dfe8}
.theme-cover-template-options h3,.shared-interior-layouts h3{margin:0;font:600 21px "Noto Serif Thai",serif}
.theme-cover-template-options>div:first-child>p,.shared-interior-layouts>div:first-child>p{margin:5px 0 14px;color:var(--muted);font-size:13px;line-height:1.65}
.theme-cover-template-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.theme-cover-template-grid .book-theme-card{border-radius:14px;box-shadow:0 7px 20px rgba(43,32,60,.06)}
.theme-cover-template-grid .book-theme-card.selected{border-color:#7147dc;box-shadow:0 0 0 2px rgba(113,71,220,.13),0 10px 26px rgba(43,32,60,.1)}
.theme-cover-template-grid .book-theme-card.selected .book-theme-card-body>strong{color:#5732bb}
.theme-cover-template-grid .public-template-art{aspect-ratio:.82}
.theme-cover-template-grid .book-theme-card-body h3{font-size:16px}
.theme-cover-template-grid .book-theme-card-body p{font-size:10px}
.theme-cover-template-fallback{grid-column:1/-1;margin:0;border:1px dashed #d8cfdf;border-radius:12px;background:#faf8fc;padding:20px;color:#6e6575;text-align:center}
.shared-interior-layout-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}
.shared-interior-layout-grid article{min-width:0}
.shared-interior-layout-grid small{display:block;margin-top:6px;overflow:hidden;color:#6f6876;font-size:10px;text-align:center;text-overflow:ellipsis;white-space:nowrap}
.theme-production-preview{margin:24px 0}.theme-production-preview h3{font-size:16px;margin:0 0 12px}#themeProductionPreview{display:grid;place-items:center;padding:20px;background:#f3f1ed;border-radius:14px}#themeProductionPreview .public-template-art{width:min(280px,90%);transform:none;box-shadow:0 8px 22px rgba(35,32,28,.12)}
.shared-interior-layout-preview{display:grid;overflow:hidden;aspect-ratio:1.55;gap:3px;border:1px solid #ddd7e1;border-radius:7px;background:#fff;padding:5px;box-shadow:0 4px 10px rgba(45,37,52,.06)}
.shared-interior-layout-preview span{min-width:0;min-height:0;background:#dadde0 var(--shared-layout-image,linear-gradient(145deg,#d6d9dc,#eceeef)) center/cover}
.shared-interior-layout-preview.layout-1{grid-template:1fr/1fr}
.shared-interior-layout-preview.layout-2{grid-template:1fr/repeat(2,1fr)}
.shared-interior-layout-preview.layout-3{grid-template:repeat(2,1fr)/repeat(2,1fr)}
.shared-interior-layout-preview.layout-3 span:first-child{grid-row:1/3}
.shared-interior-layout-preview.layout-4{grid-template:repeat(2,1fr)/repeat(2,1fr)}
.shared-interior-layout-preview.layout-5{grid-template:repeat(2,1fr)/repeat(3,1fr)}
.shared-interior-layout-preview.layout-5 span:first-child{grid-row:1/3}
@media(max-width:1100px){.shared-interior-layout-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.theme-cover-template-grid{grid-template-columns:1fr}.theme-cover-template-grid .cover-template-browser-card>button{grid-template-columns:105px minmax(0,1fr)}.shared-interior-layout-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.theme-book-mockup-scene{min-height:178px;padding:14px}.theme-book-mockup{width:min(94px,76%)}}
@media(max-width:700px){.theme-book-mockup-scene.representative-photo{padding:0}.theme-book-representative-photo{min-height:178px}}

/* P0 Theme Gallery: all representative image areas share one fixed presentation height. */
.theme-book-mockup-scene{height:245px}
@media(max-width:700px){.theme-book-mockup-scene{height:178px}}

/* Phase 6 Batch 2: improve reading size without changing the theme-flow layout. */
.book-theme-hero p{font-size:17px;line-height:1.75}
.theme-category-sidebar button{font-size:15px;line-height:1.45}
.book-theme-card-body h3{font-size:21px;line-height:1.35}
.book-theme-card-body p{font-size:15px;line-height:1.68}
.book-theme-card-body>strong{font-size:15px;line-height:1.45}
.book-theme-card-body em,.book-theme-category{font-size:12px}
.theme-detail-back{font-size:15px}
.theme-detail-controls>p{font-size:16px;line-height:1.75}
.theme-detail-tags span{font-size:13px;line-height:1.4}
.theme-size-option strong,.theme-size-option small,.theme-page-count,.theme-coupon{font-size:15px}
.theme-price-card span,.theme-price-card small{font-size:14px;line-height:1.5}
.theme-cover-template-options h3,.shared-interior-layouts h3{font-size:23px}
.theme-cover-template-options>div:first-child>p,.shared-interior-layouts>div:first-child>p{font-size:15px;line-height:1.72}
.theme-cover-template-grid .book-theme-card-body h3{font-size:18px}
.theme-cover-template-grid .book-theme-card-body p,.cover-template-browser-card .book-theme-card-body p{font-size:12px;line-height:1.55}
.shared-interior-layout-grid small{font-size:12px;line-height:1.45}
@media(max-width:700px){
    .book-theme-hero p,.theme-detail-controls>p{font-size:15px}
    .theme-category-sidebar button{font-size:14px}
    .book-theme-card-body h3{font-size:19px}
    .book-theme-card-body p,.book-theme-card-body>strong{font-size:14px}
}