@import url('https://fonts.googleapis.com/css2?family=Frank+Ruhl+Libre:wght@400;500;700;900&family=Assistant:wght@400;500;600;700;800&family=Karantina:wght@400;700&display=swap');

:root {
  --plum: #10233b; --plum-2: #1f4e5f; --coral: #d4a24c; --coral-2: #c08a2e; --gold: #d4a24c; --ribbon: #a8323f;
  --cream: #f7f2e7; --paper: #fffcf5; --ink: #1b2430; --muted: #5d6673; --line: #e6dccb;
  --ok: #2f7d5b; --err: #b3261e; --r: 14px; --shadow: 0 12px 34px rgba(16, 35, 59, .12);
}
* { box-sizing: border-box }
html { scroll-behavior: smooth }
body { margin: 0; font-family: 'Assistant', system-ui, sans-serif; color: var(--ink); background: var(--cream); line-height: 1.6; direction: rtl }
a { color: var(--plum-2) }
img { max-width: 100% }
h1, h2, h3 { line-height: 1.2; color: var(--plum); margin: 0 0 .5em; font-family: 'Frank Ruhl Libre', serif; font-weight: 700 }
.serif { font-family: 'Frank Ruhl Libre', serif }
.wrap { max-width: 1120px; margin: 0 auto; padding: 0 20px }
.muted { color: var(--muted) }
.center { text-align: center }
.hidden { display: none !important }

/* ---------- ניווט ---------- */
.nav { position: sticky; top: 0; z-index: 50; background: rgba(247, 242, 231, .92); backdrop-filter: blur(8px); border-bottom: 1px solid var(--line) }
.nav .wrap { display: flex; align-items: center; justify-content: space-between; height: 64px; gap: 16px }
.logo { font-weight: 800; font-size: 22px; color: var(--plum); text-decoration: none; display: flex; align-items: center; gap: 8px }
.logo span { font-size: 26px }
.nav nav { display: flex; gap: 22px; align-items: center }
.nav nav a { color: var(--ink); text-decoration: none; font-weight: 500 }
.nav nav a:hover { color: #8a5f14 }
@media (max-width: 760px) { .nav nav a:not(.btn) { display: none } }

/* ---------- כפתורים וטפסים ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 0; cursor: pointer; font: 600 16px 'Assistant', sans-serif; padding: 13px 26px; border-radius: 999px; background: linear-gradient(180deg,#e2b65f,#c99637); color: #10233b !important; text-decoration: none; transition: .15s; box-shadow: 0 6px 18px rgba(201, 150, 55, .35), inset 0 1px 0 rgba(255,255,255,.35) }
.btn:hover { background: linear-gradient(180deg,#e8c070,#c08a2e); transform: translateY(-1px) }
.btn:disabled { opacity: .5; cursor: not-allowed; transform: none }
.btn.big { padding: 17px 36px; font-size: 18px }
.btn.ghost { background: transparent; color: var(--plum) !important; border: 2px solid var(--plum); box-shadow: none }
.btn.ghost:hover { background: var(--plum); color: #fff !important }
.btn.small { padding: 8px 16px; font-size: 14px }
.btn.plum { background: var(--plum); color: #fff !important; box-shadow: none }
label { display: block; font-weight: 600; margin: 14px 0 6px; color: var(--plum) }
label .hint { font-weight: 400; color: var(--muted); font-size: 13px }
input, select, textarea { width: 100%; font: 16px 'Assistant', sans-serif; padding: 12px 14px; border: 1.5px solid var(--line); border-radius: 12px; background: #fff; color: var(--ink); direction: rtl }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--plum-2); box-shadow: 0 0 0 3px rgba(31, 78, 95, .12) }
textarea { min-height: 90px; resize: vertical; line-height: 1.7 }
.row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px }
.row3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px }
@media (max-width: 640px) { .row, .row3 { grid-template-columns: 1fr } }
.card { background: var(--paper); border-radius: var(--r); box-shadow: var(--shadow); padding: 28px; border: 1px solid var(--line) }
.alert { padding: 12px 16px; border-radius: 12px; margin: 12px 0; font-size: 15px }
.alert.err { background: #fdecea; color: var(--err) }
.alert.ok { background: #e8f5ee; color: var(--ok) }
.alert.info { background: #eef3f4; color: var(--plum) }
.demo-banner { background: #fff4d6; color: #7a5a00; text-align: center; font-size: 13px; padding: 6px }

/* ---------- דף הבית ---------- */
.hero { padding: 64px 0 40px; overflow: hidden }
.hero .wrap { display: grid; grid-template-columns: 1.1fr .9fr; gap: 40px; align-items: center }
.hero h1 { font-size: clamp(34px, 5vw, 56px); font-weight: 800 }
.hero h1 em { font-style: normal; color: #8a5f14 }
.hero p.lead { font-size: 20px; color: var(--muted); max-width: 540px }
.hero .ctas { display: flex; gap: 14px; flex-wrap: wrap; margin: 26px 0 16px }
.hero .trust { display: flex; gap: 18px; flex-wrap: wrap; color: var(--muted); font-size: 15px }
@media (max-width: 860px) { .hero .wrap { grid-template-columns: 1fr; gap: 10px } .book3d { width: 170px; height: 240px } .book3d .front { padding: 18px 16px } .book3d .front .t { font-size: 21px } .book3d .front .s { font-size: 11px } .sticker { width: 70px; height: 70px; font-size: 11px; top: 14px } .home .hero { padding-top: 26px } }

.book3d-wrap { perspective: 1400px; display: flex; justify-content: center; padding: 20px }
.book3d { width: 270px; height: 380px; position: relative; transform-style: preserve-3d; transform: rotateY(-28deg) rotateX(6deg); animation: float 6s ease-in-out infinite }
@keyframes float { 50% { transform: rotateY(-20deg) rotateX(4deg) translateY(-10px) } }
.book3d .front { position: absolute; inset: 0; border-radius: 4px 12px 12px 4px; background: linear-gradient(160deg, #f6c9a0, #d4a24c 55%, #1f4e5f); box-shadow: 20px 25px 50px rgba(16, 35, 59, .35); display: flex; flex-direction: column; justify-content: space-between; padding: 30px 24px; color: #fff; overflow: hidden }
.book3d .front::before { content: ''; position: absolute; width: 260px; height: 260px; border-radius: 50%; background: rgba(255, 255, 255, .18); top: 70px; left: -40px }
.book3d .front .t { font: 800 30px/1.15 'Assistant'; position: relative; text-shadow: 0 2px 10px rgba(0, 0, 0, .2) }
.book3d .front .s { font: 500 15px 'Frank Ruhl Libre'; position: relative; opacity: .95 }
.book3d .pages { position: absolute; top: 6px; bottom: 6px; left: -18px; width: 18px; background: repeating-linear-gradient(to bottom, #fff 0 2px, #eee4d8 2px 3px); transform: rotateY(-90deg); transform-origin: right }

.section { padding: 70px 0 }
.section.alt { background: var(--paper); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line) }
.section h2 { font-size: clamp(28px, 3.5vw, 40px); text-align: center }
.section .sub { text-align: center; color: var(--muted); font-size: 18px; max-width: 640px; margin: 0 auto 38px }

.occasions { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 14px }
.occ { background: #fff; border: 1.5px solid var(--line); border-radius: 14px; padding: 18px 12px; text-align: center; cursor: pointer; transition: .15s; text-decoration: none; color: var(--ink); font-weight: 600 }
.occ .e { font-size: 32px; display: block; margin-bottom: 6px }
.occ:hover, .occ.sel { border-color: var(--coral); transform: translateY(-2px); box-shadow: var(--shadow) }
.occ.sel { background: #fbf1dc }

.steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; counter-reset: s }
.steps .st { text-align: center; padding: 10px }
.steps .st .i { width: 64px; height: 64px; border-radius: 50%; background: #eef3f4; display: flex; align-items: center; justify-content: center; font-size: 28px; margin: 0 auto 12px }
.steps h3 { font-size: 19px }
@media (max-width: 760px) { .steps { grid-template-columns: 1fr 1fr } }

.included { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; max-width: 900px; margin: 0 auto }
.included div { background: #fff; border-radius: 12px; padding: 16px; border: 1px solid var(--line); font-weight: 500 }
.included div::before { content: '✓'; color: var(--ok); font-weight: 800; margin-left: 8px }
@media (max-width: 760px) { .included { grid-template-columns: 1fr } }

.price-box { max-width: 760px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: stretch }
.price-main { background: var(--plum); color: #fff; border-radius: var(--r); padding: 32px; text-align: center }
.price-main h3 { color: #fff }
.price-main .num { font: 800 64px/1 'Assistant' }
.price-main .num small { font-size: 26px }
.tiers { width: 100%; border-collapse: collapse; background: #fff; border-radius: var(--r); overflow: hidden; box-shadow: var(--shadow) }
.tiers th, .tiers td { padding: 13px 16px; border-bottom: 1px solid var(--line); text-align: right }
.tiers th { background: #eef3f4; color: var(--plum) }
@media (max-width: 760px) { .price-box { grid-template-columns: 1fr } }

.faq details { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 16px 20px; margin-bottom: 10px; max-width: 820px; margin-inline: auto }
.faq summary { font-weight: 600; cursor: pointer; color: var(--plum) }
.faq p { margin: 10px 0 0; color: var(--muted) }

footer { background: var(--plum); color: #d8cfe2; padding: 40px 0; margin-top: 40px; font-size: 14px }
footer a { color: #fff }
footer .wrap { display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap }

/* ---------- אשף יצירה ---------- */
.wizard { padding: 30px 0 80px }
.progress { display: flex; gap: 6px; margin: 0 auto 28px; max-width: 760px }
.progress div { flex: 1; text-align: center; font-size: 13px; color: var(--muted); padding-top: 10px; border-top: 4px solid var(--line); font-weight: 500 }
.progress div.on { border-color: var(--coral); color: var(--plum); font-weight: 700 }
.progress div.done { border-color: var(--plum-2) }
.panel { max-width: 860px; margin: 0 auto }
.panel h2 { font-size: 30px }
.chips { display: flex; gap: 10px; flex-wrap: wrap }
.chip { border: 1.5px solid var(--line); background: #fff; border-radius: 999px; padding: 8px 16px; cursor: pointer; font: 500 15px 'Assistant'; color: var(--ink) }
.chip.sel, .chip:hover { border-color: var(--coral); background: #fbf1dc }
.nav-btns { display: flex; justify-content: space-between; gap: 12px; margin-top: 26px; flex-wrap: wrap }

.chat { background: #fff; border: 1px solid var(--line); border-radius: var(--r); height: 460px; overflow-y: auto; padding: 18px; display: flex; flex-direction: column; gap: 12px }
.msg { max-width: 82%; padding: 12px 16px; border-radius: 18px; white-space: pre-wrap }
.msg.bot { background: #eef3f4; align-self: flex-start; border-bottom-right-radius: 4px }
.msg.me { background: var(--coral); color: #fff; align-self: flex-end; border-bottom-left-radius: 4px }
.msg.typing { color: var(--muted); font-style: italic }
.chat-input { display: flex; gap: 10px; margin-top: 12px }
.chat-input textarea { min-height: 54px; height: 54px }
.sugs { margin-top: 10px }

.ch-card { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px; margin-bottom: 12px }
.ch-card .head { display: flex; gap: 10px; align-items: center }
.ch-card .num { background: var(--plum); color: #fff; border-radius: 50%; width: 30px; height: 30px; flex: none; display: flex; align-items: center; justify-content: center; font-weight: 700 }
.ch-card .tools { display: flex; gap: 6px; margin-right: auto }
.icon-btn { border: 1px solid var(--line); background: #fff; border-radius: 8px; width: 34px; height: 34px; cursor: pointer; font-size: 15px }
.icon-btn:hover { border-color: var(--plum-2) }

.editor-ch { display: grid; grid-template-columns: 240px 1fr; gap: 20px; background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 18px; margin-bottom: 18px }
.editor-ch .img { aspect-ratio: 2/3; background: #eef3f4; border-radius: 12px; overflow: hidden; display: flex; align-items: center; justify-content: center; color: var(--muted); text-align: center; font-size: 14px }
.editor-ch .img img { width: 100%; height: 100%; object-fit: cover }
.editor-ch textarea.text { min-height: 260px; font-family: 'Frank Ruhl Libre', serif; font-size: 16px }
@media (max-width: 760px) { .editor-ch { grid-template-columns: 1fr } }
.photos-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 12px }
.photos-grid .ph { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 8px; position: relative }
.photos-grid img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 8px }
.photos-grid .del { position: absolute; top: 12px; left: 12px; background: rgba(0, 0, 0, .6); color: #fff; border: 0; border-radius: 50%; width: 26px; height: 26px; cursor: pointer }
.photos-grid input { font-size: 13px; padding: 6px 8px; margin-top: 6px }

.progress-list { list-style: none; padding: 0 }
.progress-list li { padding: 8px 0; border-bottom: 1px dashed var(--line) }
.progress-list li.done::before { content: '✓ '; color: var(--ok); font-weight: 800 }
.progress-list li.now::before { content: '⏳ ' }
.bar { height: 10px; background: var(--line); border-radius: 99px; overflow: hidden; margin: 12px 0 }
.bar div { height: 100%; background: linear-gradient(90deg, var(--coral), var(--plum-2)); width: 0; transition: width .4s }

.summary { background: #f7f2ec; border-radius: 12px; padding: 16px 20px }
.summary .ln { display: flex; justify-content: space-between; padding: 6px 0 }
.summary .tot { border-top: 2px solid var(--line); margin-top: 6px; padding-top: 10px; font-weight: 800; font-size: 20px; color: var(--plum) }
.qty { display: flex; align-items: center; gap: 10px }
.qty button { width: 40px; height: 40px; border-radius: 50%; border: 1.5px solid var(--line); background: #fff; font-size: 20px; cursor: pointer }
.qty input { width: 70px; text-align: center }

/* ---------- מעקב ---------- */
.timeline { list-style: none; padding: 0; margin: 20px 0; position: relative }
.timeline li { padding: 0 44px 22px 0; position: relative; color: var(--muted) }
.timeline li::before { content: ''; position: absolute; right: 9px; top: 6px; bottom: -6px; width: 2px; background: var(--line) }
.timeline li:last-child::before { display: none }
.timeline li::after { content: ''; position: absolute; right: 0; top: 2px; width: 20px; height: 20px; border-radius: 50%; background: #fff; border: 2px solid var(--line) }
.timeline li.done { color: var(--ink); font-weight: 600 }
.timeline li.done::after { background: var(--ok); border-color: var(--ok) }
.timeline li.done::before { background: var(--ok) }

/* ---------- ניהול ---------- */
table.adm { width: 100%; border-collapse: collapse; background: #fff; font-size: 14px }
table.adm th, table.adm td { padding: 10px; border-bottom: 1px solid var(--line); text-align: right; vertical-align: top }
table.adm th { background: #eef3f4 }
.badge { display: inline-block; padding: 2px 10px; border-radius: 99px; font-size: 12px; font-weight: 600; background: #eee }
.badge.sent { background: #e8f5ee; color: var(--ok) } .badge.error { background: #fdecea; color: var(--err) } .badge.producing, .badge.paid { background: #fff4d6; color: #7a5a00 }
.spinner { width: 18px; height: 18px; border: 3px solid rgba(255, 255, 255, .4); border-top-color: #fff; border-radius: 50%; animation: spin .8s linear infinite; display: inline-block }
.spinner.dark { border-color: rgba(16, 35, 59, .2); border-top-color: var(--plum) }
@keyframes spin { to { transform: rotate(360deg) } }

/* ================= דף בית שיווקי ================= */
.topbar { background: var(--plum); color: #fff; text-align: center; padding: 9px 14px; font-size: 14px; font-weight: 500 }
.topbar a { color: #f1dca8; font-weight: 700 }
.eyebrow { display: inline-block; background: #fff; border: 1px solid var(--line); border-radius: 99px; padding: 6px 14px; font-size: 14px; font-weight: 600; color: var(--plum); margin-bottom: 18px; box-shadow: 0 2px 8px rgba(0,0,0,.04) }
.home .hero { padding: 54px 0 50px; background: radial-gradient(1000px 500px at 85% 20%, #fbf1dc 0, transparent 60%), radial-gradient(800px 500px at 10% 90%, #ece3f5 0, transparent 60%) }
.home .hero h1 { font-size: clamp(36px, 5.2vw, 60px); line-height: 1.12 }
.home .hero h1 em { display: inline-block; margin-top: 6px }
.micro { color: var(--muted); font-size: 14.5px; margin-top: 6px }
.book3d-wrap { position: relative }
.sticker { position: absolute; top: 30px; left: 18%; background: var(--coral); color: #fff; width: 96px; height: 96px; border-radius: 50%; display: flex; align-items: center; justify-content: center; text-align: center; font-size: 14px; line-height: 1.2; transform: rotate(-12deg); box-shadow: 0 8px 20px rgba(232,115,90,.4) }
.strip { background: var(--plum); color: #fff; padding: 20px 0 }
.strip .wrap { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; text-align: center }
.strip b { display: block; font-size: 19px }
.strip span { font-size: 14px; opacity: .8 }
@media (max-width: 700px) { .strip .wrap { grid-template-columns: 1fr 1fr; row-gap: 16px } }
.two { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center }
@media (max-width: 860px) { .two { grid-template-columns: 1fr } }
h2.r { text-align: right !important }
.big-p { font-size: 18px; color: #4a4038 }
.mini-steps { padding-right: 20px; margin: 18px 0 24px; font-size: 17px; line-height: 2 }
.demo-chat { background: #fff; border-radius: 22px; box-shadow: var(--shadow); padding: 22px; min-height: 380px; display: flex; flex-direction: column; gap: 12px; border: 1px solid var(--line) }
.demo-chat::before { content: '💬 המדריך'; font-weight: 700; color: var(--plum); border-bottom: 1px solid var(--line); padding-bottom: 10px; margin-bottom: 4px }
.demo-chat .msg { animation: pop .35s ease-out }
@keyframes pop { from { opacity: 0; transform: translateY(8px) } }
.spread { display: grid; grid-template-columns: 1fr 1fr; max-width: 900px; margin: 0 auto; box-shadow: 0 30px 60px rgba(16,35,59,.18); border-radius: 6px; overflow: hidden; background: #fffdf8 }
.leaf { padding: 38px 40px; min-height: 480px; position: relative }
.leaf.left { order: 2; background: linear-gradient(to left, #f3ece2 0, #fffdf8 6%) }
.leaf.right { order: 1; background: linear-gradient(to right, #f3ece2 0, #fffdf8 6%); display: flex; align-items: center }
.ch-num { font-size: 13px; letter-spacing: .3em; color: var(--coral); font-weight: 700 }
.leaf h3, .dlg-book h3 { font-size: 26px; margin: 6px 0 16px }
.peek-text { font-family: 'Frank Ruhl Libre', serif; font-size: 16.5px; line-height: 1.85; color: #2f2925; text-align: justify }
.peek-text p { margin: 0 0 .5em; text-indent: 1.3em }
.peek-text p.first { text-indent: 0 }
.peek-text p.first::first-letter { font: 700 2.3em/1 'Assistant'; color: #1f4e5f; float: right; margin-left: .12em }
.peek-text .fade { color: var(--muted); text-indent: 0 }
.leaf .quote { font-family: 'Frank Ruhl Libre', serif; font-size: 26px; line-height: 1.6; color: var(--plum); text-align: center; padding: 0 10px }
.leaf .quote span { display: block; font: 600 13px 'Assistant'; color: var(--muted); margin-top: 18px; letter-spacing: .1em }
@media (max-width: 760px) { .spread { grid-template-columns: 1fr } .leaf.right { min-height: 220px; order: 3 } .leaf { padding: 26px 22px } }
.compare { max-width: 760px; margin: 0 auto; background: #fff; border-radius: var(--r); box-shadow: var(--shadow); overflow: hidden }
.compare .row-h, .compare .row-c { display: grid; grid-template-columns: 1.6fr 1fr 1fr; padding: 14px 20px; border-bottom: 1px solid var(--line); align-items: center }
.compare .row-h { background: #eef3f4; color: var(--plum) }
.compare i { font-style: normal; color: var(--muted); font-size: 15px }
.compare i.y { color: var(--ok); font-weight: 700 }
.guarantee { display: flex; gap: 28px; align-items: center; max-width: 860px; margin: 0 auto; background: linear-gradient(135deg, #fbf1dc, #f4eefa); border-radius: 24px; padding: 36px 40px; border: 1px solid var(--line) }
.guarantee .seal { font-size: 64px; flex: none }
@media (max-width: 640px) { .guarantee { flex-direction: column; text-align: center; padding: 28px 22px } .guarantee h2.r { text-align: center !important } }
.reviews { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px }
.review { background: #fff; border-radius: 16px; padding: 22px; margin: 0; border: 1px solid var(--line) }
.review .stars { color: #f2b01e; letter-spacing: 2px }
.review blockquote { margin: 10px 0; font-family: 'Frank Ruhl Libre', serif; font-size: 17px }
.review figcaption { color: var(--muted); font-size: 14px }
.price-main .incl { list-style: none; padding: 0; margin: 16px 0 22px; text-align: right; display: inline-block }
.price-main .incl li::before { content: '✓  '; color: #f1dca8; font-weight: 800 }
.price-main .incl li { padding: 3px 0 }
.final-cta { background: radial-gradient(700px 300px at 50% 100%, #fbf1dc 0, transparent 70%) }
.sticky-cta { display: none }
@media (max-width: 760px) {
  .sticky-cta { display: block; position: fixed; bottom: 0; right: 0; left: 0; padding: 10px 14px calc(10px + env(safe-area-inset-bottom)); background: rgba(251,247,242,.96); border-top: 1px solid var(--line); z-index: 60 }
  .sticky-cta .btn { width: 100% }
  body.home { padding-bottom: 76px }
  .sticker { left: 4% }
}
.wa { position: fixed; bottom: 22px; left: 22px; width: 56px; height: 56px; border-radius: 50%; background: #25d366; color: #fff; display: flex; align-items: center; justify-content: center; font-size: 26px; text-decoration: none; box-shadow: 0 8px 20px rgba(0,0,0,.2); z-index: 61 }
@media (max-width: 760px) { .wa { bottom: 90px } }
dialog { border: 0; border-radius: 18px; padding: 0; max-width: 720px; width: calc(100% - 28px); max-height: 86vh; box-shadow: 0 30px 80px rgba(0,0,0,.35) }
dialog::backdrop { background: rgba(30,20,40,.55) }
.dlg-book { padding: 34px 40px; overflow-y: auto; max-height: 86vh; background: #fffdf8 }
dialog .close { position: sticky; top: 10px; float: left; margin: 10px; border: 0; background: #eee; border-radius: 50%; width: 34px; height: 34px; cursor: pointer; z-index: 2 }
.photos-grid .tg { display: flex; gap: 6px; align-items: center; font-weight: 400; font-size: 13px; margin: 4px 0 0; color: var(--ink) }
.photos-grid .tg input { width: auto; margin: 0 }
.photos-grid .cap { font-size: 13px }

/* כלי השאלון: הקלטה, רעיונות, ניסוח */
.qtools{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 8px}
.qtools .tool{border:1.5px solid #e3d8c5;background:#fffcf5;border-radius:999px;padding:9px 16px;font:inherit;font-size:15px;cursor:pointer;color:#3b2a20;transition:.15s}
.qtools .tool:hover{border-color:#a8323f;background:#fff}
.qtools .tool:disabled{opacity:.55;cursor:wait}
.qtools .rec-btn{border-color:#a8323f;color:#a8323f;font-weight:600}
.ideas{background:#fffcf5;border:1px dashed #e0c9b2;border-radius:14px;padding:12px;margin-bottom:10px;display:grid;gap:8px}
.ideas .it{display:block;width:100%;text-align:right;border:0;background:#fff;border-radius:10px;padding:10px 12px;font:inherit;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.ideas .it:hover{background:#fdeee3}
.ideas .ttl{font-size:13px;color:#8a7a6d}
.rec{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:#fff1ec;border:1.5px solid #f3b9a3;border-radius:14px;padding:12px 14px;margin-bottom:10px}
.rec b{font-variant-numeric:tabular-nums;margin-inline-start:auto}
.rdot{width:12px;height:12px;border-radius:50%;background:#dc2626;animation:pulse 1s infinite}
@keyframes pulse{50%{opacity:.25}}
.qfoot{display:flex;justify-content:space-between;gap:10px;font-size:13px;margin-top:4px}
.undo{font-size:13px;color:#166534;margin-top:6px}
.chips.small .chip{font-size:13px;padding:5px 11px}
.score{display:inline-block;width:90px;height:8px;border-radius:9px;background:#ece3d2;vertical-align:middle;overflow:hidden;margin-inline-end:6px}
.score i{display:block;height:100%;background:linear-gradient(90deg,#f59e0b,#16a34a);border-radius:9px;transition:width .3s}

.coverbox{margin-top:12px;padding-top:10px;border-top:1px dashed #e3d8c5}
.cover-prev.drag{cursor:grab;touch-action:none}
.cover-prev.drag:active{cursor:grabbing}
.cover-prev.drag::after{content:"✥ גררו למיקום";position:absolute;bottom:8px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,.55);color:#fff;font-size:12px;padding:3px 9px;border-radius:9px;pointer-events:none}
.chip.ph{display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 4px}
.chip.ph img{width:28px;height:28px;border-radius:50%;object-fit:cover}
.book-head{display:flex;gap:24px;align-items:flex-start;flex-wrap:wrap}
.cover-prev{position:relative;width:220px;aspect-ratio:17/24;border-radius:6px 14px 14px 6px;overflow:hidden;background:linear-gradient(135deg,#1f4e5f,#e9a86b);box-shadow:0 14px 30px rgba(60,30,20,.25),inset 6px 0 10px rgba(0,0,0,.18);flex:0 0 auto;user-select:none}
.cover-prev img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.cover-prev .shade{position:absolute;inset:0 0 auto 0;height:45%;pointer-events:none;background:linear-gradient(rgba(0,0,0,.42),transparent)}.cover-prev .shade.light{background:linear-gradient(rgba(255,255,255,.55),transparent)}
.cover-prev .ct{position:absolute;top:8%;left:7%;right:7%;text-align:center;color:#fff;line-height:1.15;pointer-events:none}.cover-prev .ct b{display:block;font-weight:800;font-size:22px;text-shadow:0 1px 8px rgba(0,0,0,.35)}.cover-prev .ct small{display:block;font-size:11px;margin-top:6px;opacity:.92;line-height:1.35}
.cover-more{margin-top:10px}.cover-more summary{cursor:pointer;color:#7a6b86;font-size:14px}
#coverOpts .opts img{width:64px;height:90px;object-fit:cover;border-radius:6px;cursor:pointer;border:3px solid transparent}#coverOpts .opts img.sel{border-color:#d4a24c}#coverOpts .opts{display:flex;gap:6px;flex-wrap:wrap}
@media(max-width:640px){.book-head{flex-direction:column;align-items:center}.cover-prev{width:180px}}

#qStart input{margin:0}
.ans-row{display:grid;gap:2px;padding:9px 4px;border-bottom:1px solid #f0e6dc;cursor:pointer;font-size:14px}
.ans-row:hover{background:#fffcf5}

.greet-ed{display:grid;gap:6px;padding:10px;border:1px solid #ece3d2;border-radius:12px;margin-bottom:10px}
.greet-ed textarea{min-height:70px}
.greet-ed .btn{justify-self:start}
.badge{display:inline-block;font-size:12px;font-weight:600;background:#dcfce7;color:#166534;border-radius:99px;padding:2px 9px;vertical-align:middle}

/* קופה: חבילה, תוספות, עותקים */
.sec-h{margin:26px 0 10px;font-size:19px}
.bundle-pick{display:grid;grid-template-columns:1.5fr 1fr;gap:12px}
.bp{position:relative;border:2px solid #e6dccb;border-radius:18px;padding:18px;cursor:pointer;background:#fff;transition:.15s}
.bp.sel{border-color:#a8323f;box-shadow:0 8px 24px rgba(194,65,12,.15);background:#fffaf6}
.bp .tag{position:absolute;top:-11px;right:16px;background:#a8323f;color:#fff;font-size:12px;font-weight:700;padding:3px 10px;border-radius:99px}
.bp h4{margin:0 0 4px;font-size:18px}
.bp .pr{font-size:28px;font-weight:800;color:#10233b}
.bp .pr s{font-size:15px;color:#9a8b7f;font-weight:400;margin-inline-start:6px}
.bp ul{margin:8px 0 0;padding-inline-start:18px;font-size:14px;color:#5b4d43}
.bp .save{display:inline-block;margin-top:6px;font-size:13px;font-weight:700;color:#166534;background:#dcfce7;border-radius:99px;padding:2px 10px}
.addon-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.ad{display:flex;gap:12px;align-items:flex-start;border:1.5px solid #e6dccb;border-radius:14px;padding:13px;cursor:pointer;background:#fff}
.ad.sel{border-color:#a8323f;background:#fffaf6}
.ad.inc{opacity:.75;cursor:default;background:#f6fbf6;border-color:#bfe3c6}
.ad .ck{flex:0 0 22px;height:22px;border-radius:7px;border:2px solid #d6c4b4;display:grid;place-items:center;font-size:14px;color:#fff}
.ad.sel .ck,.ad.inc .ck{background:#a8323f;border-color:#a8323f}.ad.inc .ck{background:#16a34a;border-color:#16a34a}
.ad b{display:block}.ad p{margin:3px 0 0;font-size:13px;color:#6d5f55}
.ad .ap{margin-inline-start:auto;font-weight:800;white-space:nowrap;color:#10233b}
.ad .bd{display:inline-block;font-size:11px;font-weight:700;background:#fde68a;color:#7c4a03;border-radius:99px;padding:1px 8px;margin-inline-start:6px}
.copy-tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.ct-card{border:1.5px solid #e6dccb;border-radius:14px;padding:12px;text-align:center;cursor:pointer;background:#fff;position:relative}
.ct-card.sel{border-color:#a8323f;background:#fffaf6}
.ct-card b{display:block;font-size:20px}.ct-card span{font-size:13px;color:#6d5f55}
.ct-card .tag{position:absolute;top:-10px;left:50%;transform:translateX(-50%);background:#10233b;color:#fff;font-size:11px;padding:2px 9px;border-radius:99px;white-space:nowrap}
.qty-more{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:12px 0}
.sum-box{margin-top:18px}
.ln .note{display:block;font-size:12px;color:#16a34a}
.lock-note{background:#fbf4e4;border:1px dashed #f0b58a;border-radius:12px;padding:10px 12px;font-size:14px;margin:10px 0;display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.img .notin{position:absolute;top:8px;right:8px;background:rgba(0,0,0,.6);color:#fff;font-size:12px;padding:3px 9px;border-radius:99px}
.editor-ch .img{position:relative}
@media(max-width:640px){.bundle-pick{grid-template-columns:1fr}.copy-tiers{gap:6px}}

.bundle-mini{margin:12px 0 16px;padding:12px 14px;border-radius:14px;background:#fbf4e4;border:1px dashed #f0b58a;font-size:15px;line-height:1.6}

.sale-bar{position:relative;z-index:60;background:linear-gradient(90deg,#b91c1c,#a8323f);color:#fff;text-align:center;font-size:14px;padding:8px 12px;line-height:1.5}
.sale-bar s{opacity:.75}.sale-bar a{color:#fff;font-weight:700;margin-inline-start:6px}
.sale-bar .cd{font-variant-numeric:tabular-nums;font-weight:800;background:rgba(0,0,0,.2);padding:1px 8px;border-radius:6px}
s.was{color:#9a8b7f;font-weight:400;font-size:.85em;margin-inline-start:4px}
s.was.big{font-size:22px;margin-inline-start:10px}
.sale-tag{display:inline-block;margin-inline-start:8px;background:#b91c1c;color:#fff;font-size:13px;font-weight:700;padding:2px 10px;border-radius:99px;vertical-align:middle}
body.has-sale #deadline{display:none!important}
.price-main .bundle-mini{color:#3b2a20}.price-main .bundle-mini .muted{color:#6d5f55}.price-main s.was{color:#cbb8d6}
.qmsg{margin-top:8px;font-size:14px;background:#fef3c7;color:#7c4a03;border-radius:10px;padding:8px 12px}
.ch-tools{display:flex;justify-content:space-between;align-items:center}.ch-tools .ib{border:1px solid #e3d8c5;background:#fff;border-radius:8px;padding:2px 7px;margin-inline-start:4px;cursor:pointer;font-size:13px}.ch-tools .ib:disabled{opacity:.35;cursor:default}

/* הדמויות בספר */
.cast{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.person{border:1.5px solid #e6dccb;border-radius:16px;padding:10px;background:#fff;text-align:center;position:relative}
.person .face{width:96px;height:96px;border-radius:50%;object-fit:cover;display:block;margin:4px auto 8px;border:3px solid #f6e7c4}
.person input{margin:4px 0 0;font-size:14px;padding:7px 9px;text-align:center}
.person .del{position:absolute;top:6px;left:6px;border:0;background:#fff;border-radius:50%;width:26px;height:26px;cursor:pointer;box-shadow:0 1px 4px rgba(0,0,0,.15)}
.person.main{border-color:#a8323f}.person .tag{font-size:11px;font-weight:700;color:#a8323f}
.person.add{display:grid;place-items:center;min-height:190px;border-style:dashed;cursor:pointer;color:#8a7a6d}
.person.add b{display:block;font-size:30px;color:#a8323f}
.person.busy{opacity:.6}
.cast-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.cast-chips .chip{font-size:12px;padding:3px 9px;display:inline-flex;align-items:center;gap:5px}
.cast-chips .chip img{width:20px;height:20px;border-radius:50%;object-fit:cover}
.person .kind{display:flex;gap:4px;justify-content:center;margin:2px 0 4px}.person .kind button{border:1px solid #e3d8c5;background:#fff;border-radius:99px;font-size:11px;padding:2px 8px;cursor:pointer}.person .kind button.on{background:#10233b;color:#fff;border-color:#10233b}.person.pet{border-color:#86c79a}

.mode-pick{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mp{border:1.5px solid #e6dccb;border-radius:14px;padding:12px 14px;cursor:pointer;background:#fff}
.mp b{display:block;font-size:16px}.mp span{font-size:13px;color:#6d5f55}
.mp.sel{border-color:#a8323f;background:#fffaf6;box-shadow:0 4px 14px rgba(194,65,12,.12)}
.tpl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px;margin-top:10px}
.tpl{border:1.5px solid #e6dccb;border-radius:14px;padding:12px;cursor:pointer;background:#fff;position:relative}
.tpl.sel{border-color:#a8323f;background:#fffaf6}
.tpl .em{font-size:26px}.tpl b{display:block;margin:2px 0}.tpl p{margin:0;font-size:13px;color:#6d5f55}
.tpl .aud{position:absolute;top:10px;left:10px;font-size:11px;background:#ece3d2;border-radius:99px;padding:1px 8px}
@media(max-width:640px){.mode-pick{grid-template-columns:1fr}}
.opts{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:6px}.opts img{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:8px;cursor:pointer;border:3px solid transparent;opacity:.85}.opts img.sel{border-color:#a8323f;opacity:1}.opts img:hover{opacity:1}

.img.locked{display:grid;place-items:center;text-align:center;background:repeating-linear-gradient(45deg,#f4ece4,#f4ece4 10px,#ece3d2 10px,#ece3d2 20px);color:#8a7a6d;font-size:34px;aspect-ratio:2/3;border-radius:12px}
.img.locked span{display:block;font-size:13px;margin-top:6px}
.teaser{margin-top:10px;background:#fffcf5;border-radius:12px;padding:12px 14px;border-inline-start:4px solid #a8323f}
.teaser b{display:block;font-size:13px;color:#a8323f;margin-bottom:4px}.teaser p{margin:0 0 6px;font-family:'Frank Ruhl Libre',serif;line-height:1.75;font-size:16px}
.saved{font-size:12px;color:#16a34a;opacity:0;transition:.3s}.saved.on{opacity:1}
.person .faces{display:flex;align-items:center;justify-content:center;gap:4px;margin:4px 0 6px}.person .faces .face{margin:0}.person .faces .face.sm{width:56px;height:56px}
.person .addph{border:1.5px dashed #d6c4b4;background:#fffcf5;border-radius:50%;width:40px;height:40px;cursor:pointer;font-size:12px}
.person textarea.ca{min-height:54px;font-size:13px;padding:7px 9px;margin-top:4px}
.cast{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
.realsw{display:flex;gap:4px;margin-bottom:6px}.realsw button{flex:1;border:1px solid #e3d8c5;background:#fff;border-radius:99px;font-size:12px;padding:4px 6px;cursor:pointer}.realsw button.on{background:#10233b;color:#fff;border-color:#10233b}
.ph-warn{background:#fff3e0;color:#9a4b00;border-radius:10px;padding:6px 8px;font-size:12px;margin:6px 0;line-height:1.4}.ph-tip{color:#4a6170;font-size:12px;margin:6px 0;line-height:1.4}
.wa-btn{position:fixed;bottom:18px;left:18px;z-index:60;display:flex;align-items:center;gap:8px;background:#25d366;color:#fff;text-decoration:none;font-weight:bold;border-radius:99px;padding:10px 16px 10px 12px;box-shadow:0 6px 18px rgba(0,0,0,.18);font-size:14px}.wa-btn:hover{filter:brightness(1.05)}@media(max-width:600px){.wa-btn span{display:none}.wa-btn{padding:12px}}
.person .faces{flex-wrap:wrap;max-width:100%}.person .faces .face{width:76px;height:76px}.person .faces .face.sm{width:44px;height:44px}.person .addph{width:34px;height:34px;flex:none}
.restart-row{text-align:left;margin:-6px 0 10px;font-size:14px}.linkbtn{background:none;border:0;color:#7a6b86;cursor:pointer;text-decoration:underline;font:inherit;padding:2px}.restart-confirm{margin-top:8px;background:#fff;border:1px solid #eee2d6;border-radius:12px;padding:10px 12px;text-align:right}
@keyframes qswap{from{opacity:.25;transform:translateX(-14px)}to{opacity:1;transform:none}}.qswap #qText,.qswap #qHint,.qswap #qAns,.qswap #qChips{animation:qswap .28s ease-out}
.facew{width:76px;height:76px;border-radius:50%;overflow:hidden;border:3px solid #f6e7c4;display:block;cursor:pointer;position:relative;flex:none}.facew img{width:100%;height:100%;object-fit:cover;display:block}.facew i{position:absolute;bottom:2px;left:50%;transform:translateX(-50%);background:rgba(16,35,59,.75);color:#fff;font-style:normal;font-size:11px;border-radius:99px;padding:0 6px;opacity:.85}
.person select.crs{width:100%;margin:4px 0;padding:8px 10px;border:1px solid #e6dccb;border-radius:12px;background:#fff;font:inherit;font-size:14px}
.modal{position:fixed;inset:0;background:rgba(30,20,40,.45);z-index:80;display:flex;align-items:center;justify-content:center;padding:16px}.modal.hidden{display:none}.mbox{background:#fff;border-radius:18px;padding:20px;max-width:360px;width:100%;text-align:center;box-shadow:0 20px 50px rgba(0,0,0,.25)}
.cropc{width:240px;height:240px;border-radius:50%;overflow:hidden;margin:0 auto;border:4px solid #f6e7c4;cursor:grab;touch-action:none;user-select:none}.cropc img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.micwrap{position:relative;display:block}.micwrap textarea{padding-left:46px}
.fmic{position:absolute;left:8px;bottom:10px;width:32px;height:32px;border-radius:50%;border:1px solid #e6dccb;background:#fff;cursor:pointer;font-size:15px;line-height:1;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(0,0,0,.06)}
.fmic:hover{background:#fff4ec}.fmic.on{background:#e8513a;color:#fff;border-color:#e8513a;animation:micp 1.2s infinite}
@keyframes micp{0%{box-shadow:0 0 0 0 rgba(212,162,76,.45)}70%{box-shadow:0 0 0 10px rgba(212,162,76,0)}100%{box-shadow:0 0 0 0 rgba(212,162,76,0)}}
.fb-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:4px}.fb-chips .chip{font-size:12px;padding:4px 9px}
.img.locked{display:flex;flex-direction:column;gap:8px;align-items:center;justify-content:center}.img.locked span{font-size:12px}
.realpick{background:#fffcf5;border:1px dashed #e6d4c2;border-radius:12px;padding:8px;margin-bottom:6px}.rp-grid{display:flex;flex-wrap:wrap;gap:6px}.rp-grid img{width:54px;height:54px;object-fit:cover;border-radius:8px;cursor:pointer;border:2px solid transparent}.rp-grid img:hover{border-color:#d4a24c}.rp-up{width:54px;height:54px;border-radius:8px;border:1.5px dashed #d6c4b4;background:#fff;font-size:10px;cursor:pointer;line-height:1.2}
.cover-prev .ct small{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

@media(max-width:600px){.wa-btn{bottom:84px;left:12px}}

/* ===== מדף ספרים לדוגמה: נפתח במעבר עכבר ===== */
.shelf{display:flex;justify-content:center;align-items:flex-start;height:335px;padding:28px 0 0;position:relative;margin-top:0}
.shelf::after{content:"";position:absolute;left:6%;right:6%;top:258px;height:16px;border-radius:6px;background:linear-gradient(#caa47f,#98714f);box-shadow:0 12px 20px rgba(80,50,30,.25);z-index:0}
.sbook{--so:1;--dx:0px;position:relative;flex:none;width:168px;height:235px;margin:0 -10px;perspective:2200px;cursor:pointer;outline:none}
.sb-3d{position:absolute;left:0;top:0;width:300px;height:420px;transform-origin:top left;transform-style:preserve-3d;transform:scale(.56) rotateY(-14deg);transition:transform .75s cubic-bezier(.2,.8,.2,1)}
.sb-block{position:absolute;inset:0;border-radius:4px 0 0 4px}
.sb-cover{position:absolute;inset:0;transform-origin:right center;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.3,.7,.2,1) .05s}
.sb-cover .face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.sb-cover .face.back{transform:rotateY(180deg)}
.sb-edge{position:absolute;top:6px;bottom:6px;left:-16px;width:16px;background:repeating-linear-gradient(to bottom,#fff 0 2px,#eee4d8 2px 3px);transform:rotateY(-90deg);transform-origin:right center}
.sb-cover-art{position:absolute;inset:0;border-radius:16px 5px 5px 16px;background:linear-gradient(160deg,var(--c1),var(--c2) 55%,var(--c3));color:#fff;display:flex;flex-direction:column;align-items:center;text-align:center;padding:42px 26px 24px;gap:10px;overflow:hidden;box-shadow:inset -12px 0 18px rgba(0,0,0,.2),18px 22px 40px rgba(16,35,59,.3)}
.sb-cover-art::before{content:"";position:absolute;width:330px;height:330px;border-radius:50%;background:rgba(255,255,255,.16);bottom:-110px;left:-90px}
.sb-cover-art::after{content:"";position:absolute;top:0;bottom:0;right:14px;width:3px;background:rgba(255,255,255,.25)}
.sb-cover-art .em{font-size:78px;line-height:1;filter:drop-shadow(0 6px 12px rgba(0,0,0,.18));position:relative}
.sb-cover-art b{font:800 30px/1.15 'Assistant',sans-serif;text-shadow:0 2px 10px rgba(0,0,0,.25);position:relative}
.sb-cover-art small{font:400 16px/1.4 'Frank Ruhl Libre',serif;opacity:.95;position:relative}
.sb-cover-art i{position:absolute;bottom:22px;left:0;right:0;font-style:normal;font-size:16px;letter-spacing:.5px;opacity:.9}
.sb-page{background:#fffcf6;color:#3a302a;padding:30px 26px 34px;overflow:hidden;display:flex;flex-direction:column;box-shadow:inset 0 0 0 1px #ece3d2}
.sb-block.sb-page{box-shadow:inset 0 0 0 1px #ece3d2,inset -22px 0 26px -18px rgba(0,0,0,.18),-10px 18px 34px rgba(16,35,59,.18)}
.face.back.sb-page{border-radius:0 5px 5px 0;box-shadow:inset 0 0 0 1px #ece3d2,inset 22px 0 26px -18px rgba(0,0,0,.18),12px 18px 34px rgba(16,35,59,.18)}
.sb-page .pg-run{font:500 10px 'Assistant',sans-serif;color:#a2958a;text-align:center;letter-spacing:1px;margin-bottom:12px}
.sb-page .pg-ch{font:600 11px 'Assistant',sans-serif;color:#d4a24c;letter-spacing:3px;text-align:center}
.sb-page h4{font:800 21px/1.2 'Assistant',sans-serif;color:#10233b;text-align:center;margin:4px 0 12px}
.sb-page .pg-txt{font:400 12.6px/1.62 'Frank Ruhl Libre',serif;text-align:justify;flex:1;overflow:hidden;-webkit-mask-image:linear-gradient(#000 86%,transparent);mask-image:linear-gradient(#000 86%,transparent)}
.sb-page .pg-txt p{margin:0 0 6px;text-indent:14px}.sb-page .pg-txt p.first{text-indent:0}
.sb-page .pg-no{font:400 10px 'Assistant',sans-serif;color:#a2958a;text-align:center;margin-top:8px}
.sb-tag{position:absolute;top:252px;left:50%;transform:translateX(-50%);font-size:13px;color:#4a6170;background:#fff;border:1px solid #eee2d6;border-radius:99px;padding:4px 12px;white-space:nowrap;transition:opacity .3s}
.sbook:not(.open):hover .sb-3d{transform:translateY(-8px) scale(.58) rotateY(-6deg)}
.sbook.open{z-index:60 !important}
.sbook.open .sb-3d{transform:translateX(var(--dx)) translateY(-34px) scale(var(--so)) rotateY(0)}
.sbook.open .sb-cover{transform:rotateY(-180deg)}
.sbook.open .sb-tag{opacity:0}
.shelf.has-open .sbook:not(.open){filter:brightness(.82) blur(1px);transition:filter .4s}
.sbook{transition:filter .4s}
#peek{overflow-x:clip}
.shelf{z-index:5}
@media(max-width:700px){.shelf{height:230px}.shelf::after{top:150px}.sbook{width:96px;height:134px;margin:0 -14px}.sb-3d{transform:scale(.32) rotateY(-14deg)}.sbook:not(.open):hover .sb-3d{transform:scale(.32)}.sb-tag{display:none}}
/* ===== הטלפון של המדריך ===== */
.phone{width:340px;max-width:100%;margin:0 auto;background:#1e1626;border-radius:44px;padding:14px;box-shadow:0 30px 60px rgba(16,35,59,.35);position:relative}
.ph-notch{position:absolute;top:14px;left:50%;transform:translateX(-50%);width:110px;height:22px;background:#1e1626;border-radius:0 0 16px 16px;z-index:2}
.ph-head{background:#fff;border-radius:32px 32px 0 0;padding:30px 16px 12px;display:flex;align-items:center;gap:10px;border-bottom:1px solid #f0e7dd}
.ph-head .av{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#f6c9a0,#d4a24c);display:flex;align-items:center;justify-content:center;font-size:18px}
.ph-head b{display:block;color:#10233b;font-size:15px}.ph-head small{color:#2fae6b;font-size:12px}
.ph-q{margin-right:auto;font-size:11px;color:#8a7f92;background:#f6f1ec;border-radius:99px;padding:3px 9px}
.ph-body{background:#f7f2e7;height:410px;overflow-y:auto;padding:14px 12px;display:flex;flex-direction:column;gap:10px;scroll-behavior:smooth}
.ph-body .msg{font-size:14.5px;line-height:1.5;padding:10px 13px;max-width:86%;animation:pop .35s ease-out}
.ph-body .msg.bot{background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.06)}
.ph-body .msg.dots{display:flex;gap:4px;padding:13px 14px}.ph-body .msg.dots i{width:7px;height:7px;border-radius:50%;background:#b9aec4;animation:blink 1s infinite}.ph-body .msg.dots i:nth-child(2){animation-delay:.15s}.ph-body .msg.dots i:nth-child(3){animation-delay:.3s}
@keyframes blink{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
.ph-body .msg.voice{display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-width:220px}
.ph-body .vplay{width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.25);display:flex;align-items:center;justify-content:center;font-size:11px}
.ph-body .wave{display:flex;align-items:center;gap:2px;flex:1}.ph-body .wave b{width:3px;border-radius:2px;background:rgba(255,255,255,.85);height:8px;animation:wv 1s ease-in-out infinite}
.ph-body .wave b:nth-child(3n){height:16px;animation-delay:.2s}.ph-body .wave b:nth-child(4n){height:12px;animation-delay:.4s}.ph-body .wave b:nth-child(5n){height:20px;animation-delay:.1s}
@keyframes wv{50%{transform:scaleY(.5)}}
.ph-body .vt{font-size:11px;opacity:.85}.ph-body .vtxt{flex-basis:100%;font-size:13.5px;border-top:1px solid rgba(255,255,255,.3);padding-top:6px;animation:pop .35s}
.ph-body .meter-line{align-self:flex-end;font-size:12px;color:#4a6170;display:flex;align-items:center;gap:6px;animation:pop .35s}.ph-body .meter-line .score{width:70px}
.ph-body .chap-card{align-self:flex-start;max-width:88%;background:#fffcf6;border:1px solid #ece3d2;border-radius:6px 14px 14px 6px;box-shadow:0 8px 20px rgba(16,35,59,.15);padding:14px 16px;border-right:5px solid #1f4e5f;animation:pop .45s ease-out}
.chap-card .cc-num{font:600 11px 'Assistant';color:#d4a24c;letter-spacing:3px}.chap-card .cc-t{font:800 18px 'Assistant';color:#10233b;margin:2px 0 6px}.chap-card .cc-s{font:italic 13.5px/1.55 'Frank Ruhl Libre',serif;color:#4a3f38}
.ph-bar{background:#fff;border-radius:0 0 32px 32px;padding:12px 14px 18px;display:flex;align-items:center;gap:10px;border-top:1px solid #f0e7dd}
.ph-in{flex:1;background:#f6f1ec;border-radius:99px;padding:9px 14px;color:#a2958a;font-size:13px}.ph-mic{width:40px;height:40px;border-radius:50%;background:#d4a24c;color:#fff;display:flex;align-items:center;justify-content:center;font-size:18px;box-shadow:0 4px 12px rgba(238,116,88,.4)}

/* ===== דף הבית: למה ===== */
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:26px}
.why-c{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px 20px;box-shadow:0 6px 18px rgba(16,35,59,.06);transition:transform .25s,box-shadow .25s}
.why-c:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(16,35,59,.12)}
.why-c span{font-size:34px;display:block;margin-bottom:10px}.why-c b{display:block;font-size:18px;color:var(--plum);margin-bottom:6px}.why-c p{margin:0;color:var(--muted);line-height:1.6;font-size:15px}
@media(max-width:860px){.why-grid{grid-template-columns:1fr 1fr}}@media(max-width:520px){.why-grid{grid-template-columns:1fr}}
/* ===== רצועת מחיר ===== */
.price-band{padding-top:10px}
.pb-card{display:flex;align-items:center;justify-content:space-between;gap:24px;background:linear-gradient(120deg,#10233b,#6b4a7e);color:#fff;border-radius:26px;padding:30px 34px;box-shadow:0 20px 44px rgba(16,35,59,.25);flex-wrap:wrap}
.pb-k{display:inline-block;background:rgba(255,255,255,.14);border-radius:99px;padding:3px 12px;font-size:13px;margin-bottom:8px}
.pb-price{font-size:21px;line-height:1.5}.pb-price b{font-size:30px;color:#ffd7a8;white-space:nowrap}.pb-price s,.pb-price .was{color:rgba(255,255,255,.6)}
.pb-card .muted{color:rgba(255,255,255,.75);margin-top:6px}
.pb-btns{display:flex;gap:10px;flex-wrap:wrap}.pb-btns .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}
/* ===== דף מחירים ===== */
.page-h{text-align:center;font-size:clamp(30px,5vw,48px);color:var(--plum);margin:0 0 8px}
.addon-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:900px;margin:22px auto 0}
.addon-c{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px}
.addon-c .ic{font-size:26px}.addon-c b{color:var(--plum)}.addon-c p{margin:4px 0 0;color:var(--muted);font-size:14px;line-height:1.55}.addon-c .pr{margin-right:auto;font-weight:800;color:var(--coral);white-space:nowrap;font-size:18px}
.bundle-big{max-width:900px;margin:22px auto 0;display:flex;gap:24px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:linear-gradient(120deg,#fff4ea,#fde7f0);border:2px solid #f3c7a6;border-radius:22px;padding:24px 28px}
.bb-k{font-weight:800;font-size:20px;color:var(--plum)}.bundle-big p{margin:6px 0;color:#4a3f38}.bb-p{font:800 38px 'Assistant';color:var(--plum)}.bb-r{text-align:center}.bb-r .btn{margin-top:8px}
@media(max-width:700px){.addon-grid{grid-template-columns:1fr}.pb-card{padding:24px 20px}}
nav a.on{color:var(--coral)}
.pb-card .btn.ghost{background:transparent !important;color:#fff !important;border:2px solid rgba(255,255,255,.7) !important;box-shadow:none}
.price-main .num s.was{margin-right:12px;font-size:22px;opacity:.65}

/* ===== מניפת ספרים בפתיחה ===== */
.hero-fan{position:relative;height:420px;display:flex;align-items:center;justify-content:center;perspective:1600px}
.fan-b{position:absolute;width:230px;height:322px;display:block;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.fan-b .sb-cover-art{padding:34px 20px 20px}.fan-b .sb-cover-art .em{font-size:60px}.fan-b .sb-cover-art b{font-size:24px}.fan-b .sb-cover-art small{font-size:13px}.fan-b .sb-cover-art i{font-size:13px}
.fan-b.f0{transform:translateX(130px) rotate(9deg) translateY(16px);z-index:1}
.fan-b.f1{transform:rotateY(-10deg);z-index:3}
.fan-b.f2{transform:translateX(-130px) rotate(-9deg) translateY(16px);z-index:2}
.hero-fan:hover .fan-b.f0{transform:translateX(165px) rotate(13deg) translateY(10px)}
.hero-fan:hover .fan-b.f2{transform:translateX(-165px) rotate(-13deg) translateY(10px)}
.hero-fan:hover .fan-b.f1{transform:translateY(-10px) scale(1.04)}
.hero-fan .sticker{z-index:5;top:10px;left:auto;right:10%}
@media(max-width:860px){.hero-fan{height:300px;transform:scale(.72);margin:-30px 0}}
.burger{display:none;background:none;border:1px solid var(--line);border-radius:10px;width:40px;height:38px;font-size:20px;cursor:pointer;color:var(--plum)}
@media(max-width:760px){.burger{display:inline-flex;align-items:center;justify-content:center}
.nav.menu-open nav a:not(.btn){display:block;position:absolute;right:0;left:0;background:#fffcf5;padding:14px 22px;border-bottom:1px solid var(--line);font-size:17px}
.nav.menu-open nav a:nth-child(1){top:64px}.nav.menu-open nav a:nth-child(2){top:116px}.nav.menu-open nav a:nth-child(3){top:168px}.nav.menu-open nav a:nth-child(4){top:220px}
.nav.menu-open{box-shadow:0 200px 0 200vh rgba(30,20,40,.25)}}
.occ b{display:block;font-weight:700}.occ small{display:block;font-size:12.5px;color:var(--muted);font-weight:400;margin-top:4px;line-height:1.35}
#occList{grid-template-columns:repeat(4,1fr)!important}#occ{grid-template-columns:repeat(4,1fr)!important}
@media(max-width:700px){#occList,#occ{grid-template-columns:1fr 1fr!important}}
.occ-meta{text-align:center;color:var(--muted);margin:-6px 0 22px;font-size:15px}

/* ===== קרוסלת כריכות ===== */
.marquee{overflow:hidden;display:flex;flex-direction:column;gap:22px;padding:14px 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.mrow{overflow:visible}.mtrack{display:flex;gap:22px;width:max-content;animation:mq 60s linear infinite}
.mrow.r .mtrack{animation-direction:reverse;animation-duration:70s}
.marquee:hover .mtrack{animation-play-state:paused}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(50%)}}
.mcover{position:relative;flex:none;width:190px;height:270px;border-radius:6px 14px 14px 6px;overflow:hidden;display:block;box-shadow:0 12px 26px rgba(16,35,59,.22),inset 6px 0 10px rgba(0,0,0,.18);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s;text-decoration:none;background:#eadfd2}
.mcover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mcover .mshade{position:absolute;inset:0 0 auto 0;height:48%;background:linear-gradient(rgba(0,0,0,.5),transparent)}
.mcover::after{content:"";position:absolute;top:0;bottom:0;left:7px;width:2px;background:rgba(255,255,255,.3)}
.mcover b{position:absolute;top:14px;left:12px;right:12px;text-align:center;color:#fff;font:800 18px/1.2 'Assistant',sans-serif;text-shadow:0 2px 10px rgba(0,0,0,.45)}
.mcover .mtag{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);white-space:nowrap;background:rgba(255,255,255,.92);color:var(--plum);font-size:12px;font-weight:600;border-radius:99px;padding:3px 10px}
.mcover:hover{transform:translateY(-8px) scale(1.06) rotate(-1deg);box-shadow:0 22px 40px rgba(16,35,59,.32)}
.mcover.big{width:230px;height:330px}.mcover.big b{font-size:22px;top:18px}
@media(max-width:700px){.mcover{width:140px;height:200px}.mcover b{font-size:14px}.mtrack{gap:14px}}
@media(prefers-reduced-motion:reduce){.mtrack{animation:none}}
/* ===== תצוגת סגנון במעבר עכבר ===== */
#illus .chip{position:relative}
#illus .chip .sprev{display:none;position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%);width:150px;height:225px;border-radius:12px;overflow:hidden;box-shadow:0 16px 34px rgba(0,0,0,.28);z-index:20;background:#eee;border:3px solid #fff;pointer-events:none}
#illus .chip .sprev img{width:100%;height:100%;object-fit:cover}
@media(hover:hover){#illus .chip:hover .sprev{display:block}}
.illus-prev{display:flex;gap:12px;align-items:center;margin-top:10px;background:#fffcf5;border:1px solid var(--line);border-radius:14px;padding:10px}
.illus-prev img{width:70px;height:105px;object-fit:cover;border-radius:8px}.illus-prev span{color:var(--muted);font-size:14px}
.dropzone{display:flex;flex-direction:column;align-items:center;gap:4px;margin-top:12px;border:2px dashed #e0cdbb;border-radius:18px;padding:22px;background:#fffcf5;cursor:pointer;font-size:28px;text-align:center;transition:background .2s,border-color .2s}
.dropzone b{font-size:17px;color:var(--plum)}.dropzone span{font-size:13px;color:var(--muted)}.dropzone:hover{background:#fff3e8;border-color:var(--coral)}
.one-photo{background:linear-gradient(120deg,#f3ecfb,#fff1e8);border-radius:14px;padding:12px 16px;margin:14px 0 4px;color:#10233b;font-size:15px}

/* ===== מסך ההמתנה ===== */
.gen2 { text-align: center }
.gen2 h2 { margin-top: 10px }
.gen-book { position: relative; width: 84px; height: 64px; margin: 6px auto 4px; perspective: 400px }
.gen-book b { position: absolute; inset: 0 41px 0 0; background: #10233b; border-radius: 4px 0 0 4px }
.gen-book::after { content: ''; position: absolute; inset: 0 0 0 41px; background: #10233b; border-radius: 0 4px 4px 0 }
.gen-book i { position: absolute; top: 4px; bottom: 4px; left: 42px; width: 38px; background: #fffcf5; border-radius: 0 3px 3px 0; transform-origin: left center; animation: flip 2.4s ease-in-out infinite; z-index: 2; box-shadow: inset 6px 0 6px -4px #0002 }
.gen-book i:nth-child(2) { animation-delay: .8s } .gen-book i:nth-child(3) { animation-delay: 1.6s }
@keyframes flip { 0% { transform: rotateY(0) } 45%, 100% { transform: rotateY(-180deg) } }
.gen-stages { list-style: none; padding: 0; margin: 18px auto 16px; max-width: 420px; text-align: right }
.gen-stages li { padding: 9px 14px; margin: 6px 0; border-radius: 10px; color: #9aa3ad; background: #f7f2e7; transition: .3s; position: relative }
.gen-stages li.now { color: var(--plum); background: #fbf1dc; font-weight: 600 }
.gen-stages li.now::after { content: ''; position: absolute; left: 14px; top: 50%; width: 14px; height: 14px; margin-top: -7px; border: 2px solid #d4a24c; border-top-color: transparent; border-radius: 50%; animation: spin .8s linear infinite }
.gen-stages li.done { color: var(--ok); background: #eaf4ee }
.gen-stages li.done::after { content: '✓'; position: absolute; left: 14px; font-weight: 700 }
@keyframes spin { to { transform: rotate(360deg) } }
.gen-tip { color: var(--muted); font-size: 15px; min-height: 1.5em; margin: 12px 0 6px }
.gen-details { text-align: right; margin-top: 8px; font-size: 14px }
.gen-details summary { cursor: pointer; color: var(--muted) }

/* ===== חשיפת הגרסה הראשונית ===== */
.rv-head { text-align: center; margin: 4px 0 22px }
.rv-head h2 { font-size: clamp(26px, 3.4vw, 38px); margin: 10px 0 6px }
.rv-badge { display: inline-block; background: #10233b; color: #f3d48a; padding: 6px 16px; border-radius: 999px; font-weight: 700; font-size: 14px; animation: pop .5s ease-out }
.rv-spread { display: grid; grid-template-columns: 1fr 1fr; background: #fffcf5; border-radius: 6px; box-shadow: 0 24px 50px rgba(16, 35, 59, .18), 0 0 0 1px #e6dccb; margin-bottom: 26px; position: relative; overflow: hidden }
.rv-spread::after { content: ''; position: absolute; top: 0; bottom: 0; left: 50%; width: 40px; margin-left: -20px; background: linear-gradient(90deg, transparent, rgba(16, 35, 59, .1) 45%, rgba(16, 35, 59, .16) 50%, rgba(16, 35, 59, .1) 55%, transparent); pointer-events: none }
.rv-page { padding: 30px 32px; min-width: 0 }
.rv-right { background: linear-gradient(90deg, #fffcf5, #f8f1e1) }
.rv-left { background: linear-gradient(270deg, #fffcf5, #f8f1e1) }
.rv-cv { width: 100%; max-width: 300px; margin: 0 auto; cursor: default }
.rv-names { max-width: 300px; margin: 14px auto 0 }
.rv-names label { margin: 8px 0 4px; font-size: 13px; color: var(--muted) }
.rv-names input { padding: 9px 12px; font-family: 'Frank Ruhl Libre', serif; font-size: 17px; font-weight: 700; background: #fff }
.rv-ded { text-align: center; font-family: 'Frank Ruhl Libre', serif; color: #3b3b3b; margin-bottom: 14px }
.rv-ded small { display: block; font: 600 12px 'Assistant'; letter-spacing: .12em; color: var(--ribbon) }
.rv-ded p { font-size: 16px; font-style: italic; line-height: 1.7; margin: 6px 0 0 }
.rv-left h3 { text-align: center; font-size: 22px; border-top: 1px solid #e6dccb; padding-top: 14px; margin-bottom: 10px }
.rv-toc { list-style: none; padding: 0; margin: 0 }
.rv-toc li { display: flex; align-items: center; gap: 10px; border-bottom: 1px dotted #d8ccb4; padding: 2px 0 }
.rv-toc .n { flex: none; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: #10233b; color: #f3d48a; font: 700 13px 'Frank Ruhl Libre', serif }
.rv-toc input { border: 0; background: transparent; padding: 8px 4px; font-family: 'Frank Ruhl Libre', serif; font-size: 16.5px; border-radius: 6px }
.rv-toc input:hover { background: #fbf1dc }
.rv-toc input:focus { background: #fff; box-shadow: 0 0 0 2px #d4a24c66 }
.rv-toc .pen { opacity: .35; font-size: 13px }
.rv-toc li:hover .pen { opacity: 1 }
.rv-hint { margin-top: 12px; font-size: 13.5px; color: var(--muted); background: #f7f2e7; border-radius: 8px; padding: 8px 12px }
.rv-ch1 .rv-ill { display: block; width: 100%; aspect-ratio: 3/4; object-fit: cover; border-radius: 4px; box-shadow: 0 8px 20px rgba(0, 0, 0, .15) }
.rv-ch1 .rv-ill.empty { display: grid; place-items: center; font-size: 40px; background: #f2ead9 }
.rv-k { display: block; text-align: center; font-weight: 700; letter-spacing: .14em; color: var(--ribbon); font-size: 13px }
.rv-ch1 h3 { text-align: center; font-size: 26px; margin: 6px 0 16px }
.rv-text { font-family: 'Frank Ruhl Libre', serif; font-size: 17px; line-height: 1.85; color: #2b2b2b; max-height: 420px; overflow: hidden; -webkit-mask-image: linear-gradient(#000 70%, transparent); mask-image: linear-gradient(#000 70%, transparent) }
.rv-more { text-align: center; color: var(--muted); font-style: italic; margin-top: 4px }
.rv-strip { margin-bottom: 26px }
.rv-strip h3 { text-align: center; margin-bottom: 14px }
.rv-imgs { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 190px)); gap: 16px; justify-content: center }
.rv-imgs figure { margin: 0; text-align: center }
.rv-imgs img { width: 100%; aspect-ratio: 3/4; object-fit: cover; border-radius: 8px; box-shadow: 0 8px 18px rgba(16, 35, 59, .15) }
.rv-imgs figcaption { font-size: 13px; color: var(--muted); margin-top: 4px }
.rv-imgs .lk div { aspect-ratio: 3/4; border-radius: 8px; background: repeating-linear-gradient(45deg, #10233b, #10233b 10px, #15304d 10px, #15304d 20px); color: #f3d48a; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; font-size: 22px }
.rv-imgs .lk b { font: 900 30px 'Frank Ruhl Libre', serif } .rv-imgs .lk span { font-size: 13px; color: #cbd5df }
.rv-after { background: #10233b; color: #d9e0e8; border-radius: 14px; padding: 26px 28px; margin-bottom: 22px }
.rv-after h3 { color: #fff; text-align: center; margin-bottom: 16px }
.rv-after ol { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px }
.rv-after li { background: #ffffff10; border: 1px solid #ffffff24; border-radius: 10px; padding: 14px }
.rv-after b { display: block; color: #f3d48a; margin-bottom: 4px } .rv-after span { font-size: 14px }
.rv-ctas { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; margin-bottom: 10px }
.ed-back { margin-bottom: 12px }
@media (max-width: 760px) {
  .rv-spread { grid-template-columns: 1fr } .rv-spread::after { display: none }
  .rv-page { padding: 22px 18px } .rv-after ol { grid-template-columns: 1fr 1fr }
}
.rv-cvload { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; background: rgba(16, 35, 59, .78); color: #f3d48a; font-weight: 700; z-index: 3 }
/* שדות חסרים בטופס ההזמנה */
input.bad { border-color: var(--err) !important; background: #fdf3f2 }
label.bad { color: var(--err) }
.ferr { color: var(--err); font-size: 13px; margin-top: 4px; font-weight: 600 }
#payErr { margin-top: 18px; font-weight: 600 }
/* כריכה קדמית ואחורית בתצוגה, זו לצד זו */
.rv-covers2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; max-width: 380px; margin: 0 auto }
.rv-covers2 figure { margin: 0; text-align: center }
.rv-covers2 .rv-cv { width: 100%; max-width: none }
.rv-covers2 figcaption { font-size: 13px; color: var(--muted); margin-top: 6px }
.rv-covers2 .ct b { font-size: 16px } .rv-covers2 .ct small { font-size: 9.5px }
.rv-backcv { background: linear-gradient(160deg, #10233b, #1f4e5f); color: #e8edf2 }
.rv-backcv .bk-in { position: absolute; inset: 0; padding: 18px 14px; display: flex; flex-direction: column; gap: 8px; text-align: center }
.rv-backcv blockquote { margin: 0; font: italic 700 13px/1.45 'Frank Ruhl Libre', serif; color: #f3d48a }
.rv-backcv p { margin: 0; font-size: 10.5px; line-height: 1.6; flex: 1; overflow: hidden }
.rv-backcv .bk-foot { display: flex; justify-content: space-between; align-items: flex-end; font-size: 10px }
.rv-backcv .bk-bar { width: 46px; height: 28px; background: repeating-linear-gradient(90deg, #fff 0 2px, transparent 2px 4px, #fff 4px 5px, transparent 5px 8px); border: 3px solid #fff; border-radius: 2px }
.rv-note { position: relative; background: #fffdf6; border: 1px solid #ebdfc4; border-radius: 4px; padding: 14px 18px 10px; margin: 8px auto 6px; max-width: 360px; box-shadow: 0 6px 14px rgba(16, 35, 59, .08); transform: rotate(-1.2deg); background-image: repeating-linear-gradient(transparent 0 29px, #e9dcc0 29px 30px) }
.rv-note p { font-family: 'Karantina', 'Frank Ruhl Libre', serif; font-size: 24px !important; line-height: 30px !important; font-style: normal !important; color: #1d3a6e; margin: 0 !important }
.rv-edit-hint { display: block; font-size: 12px; color: var(--muted); font-family: 'Assistant' }

/* נגישות */
.skip-link{position:absolute;top:-60px;right:12px;z-index:10000;background:#10233b;color:#fff;padding:10px 16px;border-radius:8px;font-weight:700;text-decoration:none}
.skip-link:focus{top:12px}
:focus-visible{outline:3px solid #d4a24c;outline-offset:2px}
main:focus{outline:none}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

.consent{display:flex;gap:10px;align-items:flex-start;font-weight:400;font-size:14.5px;line-height:1.55;margin:14px 0 4px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:#fffcf5;cursor:pointer}.consent input{width:22px!important;height:22px;flex:none;margin-top:1px;accent-color:#10233b}.consent.bad{border-color:var(--err);background:#fdf1f0}

.qdots{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin:14px 0 4px}
.qdots span{width:30px;height:30px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:13px;border:1px solid var(--line);background:#fff;color:var(--muted);cursor:pointer}
.qdots span.ok{background:#eaf4ee;border-color:#b9dcc7;color:var(--ok)}
.qdots span.on{background:var(--plum);border-color:var(--plum);color:#fff;font-weight:700}
@media (max-width:640px){
  [data-step="2"] .qtools{margin:10px 0 6px}
  [data-step="2"] .qtools .rec-btn{flex:1 1 100%;justify-content:center;padding:13px 16px;font-size:16px}
  [data-step="2"] .qtools .tool:not(.rec-btn){flex:1 1 calc(50% - 8px);text-align:center;font-size:14px;padding:9px 10px}
  [data-step="2"] #qAns{min-height:150px;font-size:16px}
}

/* טלפון: לחיצה על סגנון איור מציגה דוגמה גדולה באמצע המסך */
@media(hover:none){
  #illus .chip.peek .sprev{display:block;position:fixed;top:50%;left:50%;bottom:auto;transform:translate(-50%,-50%);width:min(68vw,270px);height:auto;aspect-ratio:2/3;z-index:90;border-width:4px;box-shadow:0 24px 60px rgba(0,0,0,.45)}
  #illus .chip.peek .sprev::after{content:attr(data-name);position:absolute;left:0;right:0;bottom:0;padding:22px 10px 10px;background:linear-gradient(transparent,rgba(0,0,0,.75));color:#fff;font-weight:700;font-size:16px;text-align:center}
  .illus-prev img{width:96px;height:144px}
}
.wa-btn.wa-hide{transition:.2s;opacity:0;pointer-events:none;transform:scale(.6)}