/* =====================================================================
   theme-share.css — GEOMETRIE: chalk white, bold cubist blocks.
   Only variables + motif decorations.
   ===================================================================== */
:root { --bg: #F5F1E8; --bg-2: #E9E2D2; --ink: #111; --ink-2: #4b463e; --paper: #fff; --line: rgba(17,17,17,.14); }
/* dark mode: auto (system) unless the reader picked light */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { --bg: #141312; --bg-2: #22201d; --ink: #F5F1E8; --ink-2: #c9c1b2; --paper: #1d1b19; --line: rgba(245,241,232,.16); color-scheme: dark; }
}
:root[data-theme="dark"] { --bg: #141312; --bg-2: #22201d; --ink: #F5F1E8; --ink-2: #c9c1b2; --paper: #1d1b19; --line: rgba(245,241,232,.16); color-scheme: dark; }

body.ed-share { font-family: var(--f-body); }
.ed-share .L3-head, .ed-share .open-title, .ed-share .sec-title, .ed-share .L4-head { font-family: var(--f-zh-display); font-weight: 900; }
.ed-share .chip-stamp { background: var(--accent); border-color: var(--ink); color: #111; }

/* book cover (share) */
.ed-share .bc-face { background: #D99A2B; color: #111; }
.ed-share .bc-face::before { content: ""; position: absolute; right: 0; top: 0; width: 60%; height: 55%; background: #B8442E; clip-path: polygon(100% 0, 100% 100%, 0 0); }
.ed-share .bc-face::after { content: ""; position: absolute; left: 0; bottom: 0; width: 45%; height: 40%; background: #1F5A7A; clip-path: polygon(0 0, 100% 100%, 0 100%); }
.ed-share .bc-face b { position: relative; z-index: 1; font-family: var(--f-en); font-weight: 900; font-size: clamp(64px, 19vw, 220px); line-height: .85; letter-spacing: -.04em; }
.ed-share .bc-no, .ed-share .bc-face em { position: relative; z-index: 1; font-family: var(--f-data); font-weight: 700; letter-spacing: .2em; font-style: normal; }
.ed-share .bc-caron { position: absolute; right: 10vw; bottom: 8vh; font-family: var(--f-serif); font-size: 40vw; line-height: 1; color: #6D4AFF; z-index: 1; }

/* opener motifs */
.ed-share .C-open { background: var(--bg); }
.ed-share .open-shards i:nth-child(1) { right: 0; top: 0; width: 48vw; height: 48vw; max-width: 620px; max-height: 620px; background: var(--accent); clip-path: polygon(100% 0, 100% 100%, 0 0); opacity: .9; }
.ed-share .open-shards i:nth-child(2) { left: 0; bottom: 0; width: 34vw; height: 22vw; background: var(--accent-2); clip-path: polygon(0 0, 100% 100%, 0 100%); opacity: .85; }
.ed-share .open-shards i:nth-child(3) { right: 18vw; bottom: 12vh; width: 9vw; height: 9vw; min-width: 46px; min-height: 46px; background: var(--play); border-radius: 50%; }
.ed-share .open-shards i:nth-child(4) { left: 40vw; top: 18vh; width: 4px; height: 30vh; background: var(--ink); opacity: .2; transform: rotate(28deg); }
/* cubist chapter: more blocks, gyroscope-driven */
[data-motif="cubist"] .open-shards i:nth-child(1) { clip-path: polygon(30% 0, 100% 0, 100% 70%, 60% 100%); }
[data-motif="cubist"] .open-shards i:nth-child(2) { width: 52vw; height: 40vw; clip-path: polygon(0 20%, 70% 0, 100% 100%, 0 100%); background: #111; opacity: .9; }
[data-motif="cubist"] .open-shards i:nth-child(4) { width: 28vw; height: 28vw; background: #B8442E; opacity: .8; clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); transform: none; left: 46vw; top: 30vh; }
[data-motif="cubist"] .C-open .open-big { color: #111; -webkit-text-stroke: 0; text-shadow: 6px 6px 0 var(--accent); }
/* bones chapter: dark page */
body[data-dark="1"].ed-share { --bg: #121110; --bg-2: #1f1d1a; --ink: #EDE6D6; --ink-2: #bdb4a2; --paper: #1a1816; --line: rgba(237,230,214,.16); color-scheme: dark; }
[data-motif="bones"] .open-shards i:nth-child(1) { background: repeating-linear-gradient(-30deg, #EDE6D6 0 6px, transparent 6px 26px); opacity: .18; clip-path: none; width: 100%; height: 100%; max-width: none; max-height: none; }
[data-motif="bones"] .open-shards i:nth-child(2) { background: #8A8F94; opacity: .35; }
[data-motif="bones"] .open-big { color: #EDE6D6; letter-spacing: .02em; }
/* fog chapter */
[data-motif="fog"] .C-open { background: linear-gradient(180deg, #dfe5df, var(--bg)); }
[data-motif="fog"] .open-big { font-size: clamp(120px, 44vw, 460px); line-height: .8; color: #2F6B3A; }
[data-motif="fog"] .open-shards i:nth-child(1) { background: #2F6B3A; clip-path: polygon(0 100%, 30% 40%, 50% 70%, 75% 20%, 100% 60%, 100% 100%); top: auto; bottom: 0; width: 100%; height: 40vh; max-width: none; opacity: .18; }
[data-motif="fog"] .open-shards i:nth-child(2) { display: none; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) [data-motif="fog"] .C-open { background: linear-gradient(180deg, #1b2420, var(--bg)); } }
:root[data-theme="dark"] [data-motif="fog"] .C-open { background: linear-gradient(180deg, #1b2420, var(--bg)); }
[data-motif="secese"] .open-shards i:nth-child(1) { clip-path: none; border-radius: 0 0 0 100%; }
[data-motif="secese"] .open-shards i:nth-child(2) { border-radius: 0 100% 0 0; clip-path: none; }
[data-motif="opera"] .open-shards i:nth-child(1) { background: radial-gradient(circle at 100% 0, #C9A227, #7A1E2B 70%); clip-path: polygon(20% 0, 100% 0, 100% 100%); }
[data-motif="hyperboloid"] .open-shards i:nth-child(1) { background: repeating-linear-gradient(80deg, var(--accent) 0 2px, transparent 2px 18px); clip-path: polygon(40% 0, 100% 0, 100% 100%, 70% 100%); opacity: .5; }
[data-motif="river"] .open-shards i:nth-child(1) { background: repeating-radial-gradient(circle at 100% 0, var(--accent-2) 0 3px, transparent 3px 22px); clip-path: none; opacity: .4; }
[data-motif="road"] .open-shards i:nth-child(4) { width: 100vw; left: 0; top: 70%; height: 6px; transform: rotate(-8deg); background: repeating-linear-gradient(90deg, var(--ink) 0 28px, transparent 28px 48px); opacity: .5; }

/* fact cards: colour cycle */
.ed-share .fcard:nth-child(4n+1) { --card: var(--accent); --on-card: #111; }
.ed-share .fcard:nth-child(4n+2) { --card: #B8442E; --on-card: #fff; }
.ed-share .fcard:nth-child(4n+3) { --card: #1F5A7A; --on-card: #fff; }
.ed-share .fcard:nth-child(4n+4) { --card: #6D4AFF; --on-card: #fff; }
.ed-share .fcard:nth-child(4n+4) .fcard-hint { background: #111; }

/* color-block reveal (share photo entrance) */
.blocks-cover { position: absolute; inset: 0; z-index: 3; pointer-events: none; display: grid; grid-template-columns: repeat(3, 1fr); }
.blocks-cover i { display: block; }
.blocks-cover i:nth-child(3n+1) { background: var(--accent); } .blocks-cover i:nth-child(3n+2) { background: var(--accent-2); } .blocks-cover i:nth-child(3n) { background: #111; }

/* acts on home TOC */
.ed-share .toc-act:nth-child(1) { --act: #D99A2B; } .ed-share .toc-act:nth-child(2) { --act: #2F6B3A; } .ed-share .toc-act:nth-child(3) { --act: #1F5A7A; }
/* keep small text readable over the opener's colour blocks */
.ed-share .open-kicker { background: var(--bg); box-shadow: 0 0 0 8px var(--bg); width: fit-content; max-width: 34em; }
.ed-share .open-items li { background: var(--bg); }
.ed-share .open-date { background: var(--bg); width: fit-content; box-shadow: 0 0 0 6px var(--bg); }
[data-motif="cubist"] .open-shards i:nth-child(2) { width: 44vw; height: 26vw; }
