/* Floralia — the dungeon pages, easy to read (2026-10-18, the user: "แก้ไขปุ่มเข้าดันเจี้ยนให้เห็นง่าย และแก้ไข ui ให้ดูง่าย สะอาด").
   - The enter bar (js/dgcards.js DgCards.foot) pinned to the bottom of the right page of all three dungeon pages: one big
     gold button saying what happens and the runs left; grey when locked; the dungeon ticket's button when today's runs are
     used up. It carries its own look, so it reads on every book skin.
   - The daily dungeon's right page (js/ddg.js DG.page): the tier, CP, three facts, the foes, the rewards as icon tiles in
     three tabs. Dark plates with light text on the dark book; light plates with dark text on the light books
     (html[data-booklight]); no soft halos round text. */

/* ---------------------------------------------------------------- the enter bar */
/* (the button rules carry html:root ... :not(#_) to outweigh the light books' "primary label is cream" rule in
   css/booktext_fix.css: this gold plate keeps its dark label on every skin) */
#ui .dgx-foot { position: sticky; bottom: 0; z-index: 4; margin-top: auto; display: flex; align-items: center; gap: 10px; padding: 7px;
  border-radius: 14px; background: linear-gradient(180deg, #2a2233, #17121e); border: 2px solid color-mix(in srgb, var(--tc) 55%, #c9a24a);
  box-shadow: 0 -8px 16px -8px rgba(0, 0, 0, 0.7), inset 0 1px 0 rgba(255, 236, 190, 0.12); }
html:root #ui :is(#content, #bdg) .dgx-foot button.btn.dgx-go:not(#_) { flex: 1; min-width: 0; min-height: 58px; height: auto; display: flex; align-items: center; justify-content: space-between; gap: 10px;
  margin: 0; padding: 6px 8px 6px 18px; border-radius: 11px !important; border: 2px solid #fff0bd !important; border-image: none !important;
  background: linear-gradient(180deg, #ffe48e 0%, #f6bf45 52%, #d48d1f 100%) !important; box-shadow: 0 0 0 1px #6a420c, inset 0 -3px 0 rgba(120, 66, 0, 0.35), 0 3px 10px rgba(0, 0, 0, 0.35) !important;
  color: #3a2204 !important; -webkit-text-fill-color: #3a2204 !important; text-shadow: none !important; font-family: var(--thai, 'Mali', sans-serif); text-align: left; filter: none !important; opacity: 1 !important; cursor: pointer; }
html:root #ui :is(#content, #bdg) .dgx-foot button.btn.dgx-go:not(#_) * { text-shadow: none !important; }
html:root #ui :is(#content, #bdg) .dgx-foot.go button.btn.dgx-go:not(#_) { animation: dgxGlow 2.6s ease-in-out infinite; }
html:root #ui :is(#content, #bdg) .dgx-foot button.btn.dgx-go:not(#_):hover:not(:disabled) { filter: brightness(1.07) !important; }
html:root #ui :is(#content, #bdg) .dgx-foot button.btn.dgx-go:not(#_):active:not(:disabled) { transform: translateY(1px); }
@keyframes dgxGlow { 0%, 100% { box-shadow: 0 0 0 1px #6a420c, inset 0 -3px 0 rgba(120, 66, 0, 0.35), 0 3px 10px rgba(0, 0, 0, 0.35); }
  50% { box-shadow: 0 0 0 1px #6a420c, inset 0 -3px 0 rgba(120, 66, 0, 0.35), 0 0 16px rgba(255, 210, 90, 0.75); } }
#ui .dgx-foot .dgx-l { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
html:root #ui :is(#content, #bdg) .dgx-foot button.btn.dgx-go:not(#_) .dgx-l b { font: 800 1.3rem/1.2 var(--thai, 'Mali', sans-serif); color: #3a2204 !important; -webkit-text-fill-color: #3a2204 !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html:root #ui :is(#content, #bdg) .dgx-foot button.btn.dgx-go:not(#_) .dgx-l small { font: 600 0.78rem/1.3 var(--thai, 'Mali', sans-serif); color: #6a4410 !important; -webkit-text-fill-color: #6a4410 !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html:root #ui :is(#content, #bdg) .dgx-foot button.btn.dgx-go:not(#_) .dgx-n { flex: none; font: 800 1rem/1 var(--thai, 'Mali', sans-serif); font-style: normal; padding: 8px 12px; border-radius: 999px;
  background: #3a2204; color: #ffe7a0 !important; -webkit-text-fill-color: #ffe7a0 !important; }
/* locked / no runs / waiting: a plain grey plate, the reason readable */
html:root #ui :is(#content, #bdg) .dgx-foot button.btn.dgx-go:not(#_):disabled { cursor: default; animation: none;
  background: linear-gradient(180deg, #3a3342, #29232f) !important; border-color: rgba(255, 216, 130, 0.28) !important; box-shadow: none !important;
  color: #ece2cc !important; -webkit-text-fill-color: #ece2cc !important; }
html:root #ui :is(#content, #bdg) .dgx-foot button.btn.dgx-go:not(#_):disabled .dgx-l b { color: #ece2cc !important; -webkit-text-fill-color: #ece2cc !important; }
html:root #ui :is(#content, #bdg) .dgx-foot button.btn.dgx-go:not(#_):disabled .dgx-l small { color: #c4b89c !important; -webkit-text-fill-color: #c4b89c !important; }
html:root #ui :is(#content, #bdg) .dgx-foot button.btn.dgx-go:not(#_):disabled .dgx-n { background: #1a1520; color: #ffc2b6 !important; -webkit-text-fill-color: #ffc2b6 !important; }
/* in a run: a plain leave button */
html:root #ui :is(#content, #bdg) .dgx-foot.run button.btn.dgx-go:not(#_) { justify-content: center; background: linear-gradient(180deg, #4a3d52, #2e2536) !important; border-color: #c9a24a !important; animation: none; }
html:root #ui :is(#content, #bdg) .dgx-foot.run button.btn.dgx-go:not(#_) .dgx-l b { color: #fff1cf !important; -webkit-text-fill-color: #fff1cf !important; text-align: center; }
/* no runs left, a ticket to use or buy: the shut button says so, the ticket's own button (css/dgticket.css) beside it */
html:root #ui :is(#content, #bdg) .dgx-foot.tk button.btn.dgx-go:not(#_) { padding-left: 12px; }
html:root #ui :is(#content, #bdg) .dgx-foot.tk button.btn.dgx-go:not(#_) .dgx-l b { font-size: 1.02rem; color: #ffc2b6 !important; -webkit-text-fill-color: #ffc2b6 !important; }
#ui .dgx-foot .dgtk-row { margin: 0 !important; flex: none; }
#ui .dgx-foot .dgtk-btn { min-height: 58px; }

/* the light books: a light plate round the bar (the gold button stays gold), a light grey shut button with dark words */
html:root[data-booklight] #ui .dgx-foot { background: linear-gradient(180deg, #fffaf2, #f3e6d2); border-color: color-mix(in srgb, var(--tc) 55%, #a9824e);
  box-shadow: 0 -8px 16px -8px rgba(90, 50, 40, 0.35), inset 0 1px 0 #fff; }
html:root[data-booklight] #ui :is(#content, #bdg) .dgx-foot button.btn.dgx-go:not(#_):disabled { background: linear-gradient(180deg, #ece4d8, #ddd2c2) !important; border-color: #b9a88c !important; }
html:root[data-booklight] #ui :is(#content, #bdg) .dgx-foot button.btn.dgx-go:not(#_):disabled .dgx-l b { color: #3e2c30 !important; -webkit-text-fill-color: #3e2c30 !important; }
html:root[data-booklight] #ui :is(#content, #bdg) .dgx-foot button.btn.dgx-go:not(#_):disabled .dgx-l small { color: #5e4a4e !important; -webkit-text-fill-color: #5e4a4e !important; }
html:root[data-booklight] #ui :is(#content, #bdg) .dgx-foot button.btn.dgx-go:not(#_):disabled .dgx-n { background: #6a2a20; color: #ffe0d8 !important; -webkit-text-fill-color: #ffe0d8 !important; }
html:root[data-booklight] #ui :is(#content, #bdg) .dgx-foot.tk button.btn.dgx-go:not(#_) .dgx-l b { color: #a3281a !important; -webkit-text-fill-color: #a3281a !important; }

/* ---------------------------------------------------------------- the daily dungeon's right page */
#ui .eco-side:has(> .dgx-head) { gap: 8px; }
#ui .dgx-head { display: flex; align-items: baseline; gap: 10px; padding: 5px 14px; border-radius: 13px; min-width: 0;
  background: linear-gradient(90deg, color-mix(in srgb, var(--tc) 36%, rgba(22, 18, 32, 0.92)), rgba(22, 18, 32, 0.86)); border: 2px solid var(--tc); }
#ui .dgx-head i { font-style: normal; font-size: 0.85rem; letter-spacing: 1px; color: var(--tc) !important; -webkit-text-fill-color: var(--tc) !important; }
#ui .dgx-head b { font: 800 1.5rem/1.2 var(--thai, 'Mali', sans-serif); color: var(--tc) !important; -webkit-text-fill-color: var(--tc) !important; text-shadow: 0 1px 0 #000; white-space: nowrap; }
#ui .dgx-head span { min-width: 0; font: 700 1rem/1.3 var(--thai, 'Mali', sans-serif); color: #f4ecd8 !important; -webkit-text-fill-color: #f4ecd8 !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#ui .dgt-cp.dgx-cp { margin: 0; padding: 6px 12px; }
#ui .dgt-cp.dgx-cp .cp-l b { font-size: 1.25rem; }
#ui .dgt-facts.dgx-facts { grid-template-columns: repeat(3, 1fr); }
html:root[data-booklight] #ui .dgt-cp.dgx-cp { background: #fffaf3; box-shadow: 0 1px 4px rgba(90, 50, 40, 0.12); }
html:root[data-booklight] #ui .dgt-cp.dgx-cp .cp-l small, html:root[data-booklight] #ui .dgt-cp.dgx-cp .cp-r span { color: #5e4a4e !important; -webkit-text-fill-color: #5e4a4e !important; }
html:root[data-booklight] #ui .dgt-cp.dgx-cp .cp-l b { color: #2e1c26 !important; -webkit-text-fill-color: #2e1c26 !important; }
html:root[data-booklight] #ui .dgt-cp.dgx-cp .cp-r i { background: #eadfd2; }
html:root[data-booklight] #ui .dgt-cp.dgx-cp.ok .cp-r strong { color: #2f7516 !important; -webkit-text-fill-color: #2f7516 !important; }
html:root[data-booklight] #ui .dgt-cp.dgx-cp.warn .cp-r strong { color: #8a5200 !important; -webkit-text-fill-color: #8a5200 !important; }
html:root[data-booklight] #ui .dgt-cp.dgx-cp.bad .cp-r strong { color: #b0281c !important; -webkit-text-fill-color: #b0281c !important; }
#ui .dgt-facts.dgx-facts > div { padding: 5px 4px 6px; }
#ui .dgt-facts.dgx-facts b { font-size: 1.1rem; }

/* a section: a plate with a small gold header */
#ui .dgx-sec { padding: 7px 10px 8px; border-radius: 12px; background: rgba(22, 18, 32, 0.84); border: 1px solid rgba(255, 216, 130, 0.16); }
#ui .dgx-sec h5 { margin: 0 0 6px; font: 800 0.98rem var(--thai, 'Mali', sans-serif); color: #ffd98a !important; -webkit-text-fill-color: #ffd98a !important; }
#ui .dgx-sec h5 small { margin-left: 4px; font-weight: 600; font-size: 0.74rem; color: #b9ad8f !important; -webkit-text-fill-color: #b9ad8f !important; }

/* the foes: the boss first (its key move in a line), then the monsters, then short tips */
#ui .dgx-boss { display: flex; align-items: center; gap: 10px; width: 100%; padding: 5px 10px 5px 6px; border-radius: 11px; cursor: pointer; text-align: left;
  font-family: var(--thai, 'Mali', sans-serif); background: linear-gradient(90deg, rgba(70, 18, 24, 0.9), rgba(32, 14, 20, 0.86)); border: 1.5px solid color-mix(in srgb, var(--tc) 50%, #ff6a5a); }
#ui .dgx-boss:hover { box-shadow: 0 0 12px color-mix(in srgb, var(--tc) 45%, transparent); }
#ui .dgx-boss .ddg-mpic, #ui .dgx-boss > img { width: 58px; height: 52px; flex: none; }
#ui .dgx-boss > span { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
#ui .dgx-boss em { align-self: flex-start; font: 800 0.62rem/1 var(--thai, 'Mali', sans-serif); font-style: normal; padding: 2px 6px 1px; border-radius: 6px; background: #d23a2a; color: #fff !important; -webkit-text-fill-color: #fff !important; }
#ui .dgx-boss b { font: 800 1rem var(--thai, 'Mali', sans-serif); color: #ffc0b0 !important; -webkit-text-fill-color: #ffc0b0 !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#ui .dgx-boss small { font: 600 0.74rem var(--thai, 'Mali', sans-serif); color: #e2d9c4 !important; -webkit-text-fill-color: #e2d9c4 !important; }
#ui .dgx-boss i { font: 600 0.74rem var(--thai, 'Mali', sans-serif); font-style: normal; color: #ffcf9a !important; -webkit-text-fill-color: #ffcf9a !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#ui .dgx-mobs { display: grid; grid-template-columns: repeat(auto-fill, minmax(78px, 1fr)); gap: 5px; margin-top: 6px; }
#ui .dgx-mob { position: relative; display: flex; flex-direction: column; align-items: center; min-width: 0; padding: 3px 3px 4px; border-radius: 10px; cursor: pointer;
  border: 1px solid rgba(255, 255, 255, 0.14); background: radial-gradient(circle at 50% 36%, rgba(255, 255, 255, 0.12), rgba(10, 8, 18, 0.6) 70%); font-family: var(--thai, 'Mali', sans-serif); }
#ui .dgx-mob:hover { border-color: #ffd98a; }
#ui .dgx-mob.el { border-color: #ffb347; }
#ui .dgx-mob .ddg-mpic { width: 44px; height: 40px; }
#ui .dgx-mob b { max-width: 100%; font: 700 0.64rem/1.18 var(--thai, 'Mali', sans-serif); text-align: center; color: #f4ecd8 !important; -webkit-text-fill-color: #f4ecd8 !important;
  display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
#ui .dgx-mob em { font: 700 0.6rem/1.2 var(--thai, 'Mali', sans-serif); font-style: normal; color: #9fe8ff !important; -webkit-text-fill-color: #9fe8ff !important; }
#ui .dgx-mob em.el { color: #ffb347 !important; -webkit-text-fill-color: #ffb347 !important; }
#ui .dgx-tips { margin: 6px 0 0; padding: 3px 8px; border-radius: 8px; background: rgba(255, 207, 154, 0.1); font: 600 0.74rem/1.4 var(--thai, 'Mali', sans-serif); color: #ffd9ae !important; -webkit-text-fill-color: #ffd9ae !important; }

/* the rewards: three tabs, icon tiles */
#ui .dgx-rh { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
#ui .dgx-rh h5 { margin: 0; flex: none; }
#ui .dgx-rtabs { display: flex; gap: 4px; margin-left: auto; }
#ui .dgx-rtabs button { position: relative; display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border-radius: 999px; cursor: pointer;
  border: 1px solid rgba(255, 216, 130, 0.35); background: rgba(255, 255, 255, 0.05); font: 700 0.78rem var(--thai, 'Mali', sans-serif); color: #e8dcc0 !important; -webkit-text-fill-color: #e8dcc0 !important; }
#ui .dgx-rtabs button i { font-style: normal; font-size: 0.7rem; padding: 0 5px; border-radius: 7px; background: rgba(0, 0, 0, 0.35); color: #cfc4a8 !important; -webkit-text-fill-color: #cfc4a8 !important; }
#ui .dgx-rtabs button.on { background: linear-gradient(180deg, #ffe08a, #e8a838); border-color: #fff0bd; color: #3a2204 !important; -webkit-text-fill-color: #3a2204 !important; }
#ui .dgx-rtabs button.on i { background: rgba(58, 34, 4, 0.2); color: #3a2204 !important; -webkit-text-fill-color: #3a2204 !important; }
#ui .dgx-rtabs button.new::after { content: ""; position: absolute; right: -2px; top: -2px; width: 8px; height: 8px; border-radius: 50%; background: #ff5a4a; box-shadow: 0 0 0 1.5px #1a1420; }
#ui .dgx-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
#ui .dgx-it { position: relative; display: flex; flex-direction: column; align-items: center; gap: 1px; min-width: 0; padding: 10px 3px 4px; border-radius: 10px; cursor: pointer;
  background: radial-gradient(circle at 50% 34%, color-mix(in srgb, var(--gc) 22%, rgba(40, 34, 52, 0.95)), rgba(14, 11, 20, 0.95) 75%);
  border: 1.5px solid color-mix(in srgb, var(--gc) 45%, rgba(255, 255, 255, 0.12)); }
#ui .dgx-it:hover { border-color: var(--gc); transform: translateY(-1px); }
#ui .dgx-it img { width: 36px; height: 36px; object-fit: contain; }
#ui .dgx-it > b { position: absolute; right: 5px; top: 30px; font: 800 0.72rem/1 Fredoka, var(--thai, 'Mali', sans-serif); padding: 2px 4px; border-radius: 6px;
  background: rgba(10, 8, 18, 0.85); color: #fff !important; -webkit-text-fill-color: #fff !important; }
#ui .dgx-it > span { max-width: 100%; font: 700 0.68rem/1.25 var(--thai, 'Mali', sans-serif); color: #f0e6cf !important; -webkit-text-fill-color: #f0e6cf !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#ui .dgx-it > em { position: absolute; left: 50%; top: -6px; transform: translateX(-50%); max-width: calc(100% + 4px); font: 800 0.6rem/1 var(--thai, 'Mali', sans-serif); font-style: normal; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  padding: 2px 6px 1px; border-radius: 6px; background: #2f6fd0; color: #fff !important; -webkit-text-fill-color: #fff !important; }
#ui .dgx-it.ttl { --gc: #ffd24a; }
#ui .dgx-grid.got .dgx-it { opacity: 0.55; }
#ui .dgx-note { margin: 6px 0 0; font: 600 0.72rem var(--thai, 'Mali', sans-serif); color: #b9ad8f !important; -webkit-text-fill-color: #b9ad8f !important; }

/* ---- the light books: light plates, dark text */
html:root[data-booklight] #ui .dgx-head { background: linear-gradient(90deg, color-mix(in srgb, var(--tc) 30%, #fffaf3), #fffaf3 80%); border-color: color-mix(in srgb, var(--tc) 75%, #4a3040); }
html:root[data-booklight] #ui .dgx-head b, html:root[data-booklight] #ui .dgx-head i { color: color-mix(in srgb, var(--tc) 45%, #241018) !important; -webkit-text-fill-color: color-mix(in srgb, var(--tc) 45%, #241018) !important; text-shadow: none; }
html:root[data-booklight] #ui .dgx-head span { color: #3a2830 !important; -webkit-text-fill-color: #3a2830 !important; }
html:root[data-booklight] #ui .dgx-sec { background: #fffaf3; border-color: color-mix(in srgb, var(--bk-acc, #b07a4a) 35%, #e6d8c6); box-shadow: 0 1px 4px rgba(90, 50, 40, 0.12); }
html:root[data-booklight] #ui .dgx-sec h5 { color: color-mix(in srgb, var(--bk-acc, #8a4a20) 80%, #2a1810) !important; -webkit-text-fill-color: color-mix(in srgb, var(--bk-acc, #8a4a20) 80%, #2a1810) !important; }
html:root[data-booklight] #ui .dgx-sec h5 small, html:root[data-booklight] #ui .dgx-note { color: #6a5a5e !important; -webkit-text-fill-color: #6a5a5e !important; }
html:root[data-booklight] #ui .dgx-boss { background: linear-gradient(90deg, #ffe8e2, #fff6f2); border-color: color-mix(in srgb, var(--tc) 45%, #d0604e); }
html:root[data-booklight] #ui .dgx-boss b { color: #8e1e14 !important; -webkit-text-fill-color: #8e1e14 !important; }
html:root[data-booklight] #ui .dgx-boss small { color: #4a3438 !important; -webkit-text-fill-color: #4a3438 !important; }
html:root[data-booklight] #ui .dgx-boss i { color: #8a4a08 !important; -webkit-text-fill-color: #8a4a08 !important; }
html:root[data-booklight] #ui .dgx-mob { background: radial-gradient(circle at 50% 36%, #ffffff, #efe6da 75%); border-color: #d8c8b4; }
html:root[data-booklight] #ui .dgx-mob b { color: #2e1c26 !important; -webkit-text-fill-color: #2e1c26 !important; }
html:root[data-booklight] #ui .dgx-mob em { color: #135f8a !important; -webkit-text-fill-color: #135f8a !important; }
html:root[data-booklight] #ui .dgx-mob em.el { color: #9a4a00 !important; -webkit-text-fill-color: #9a4a00 !important; }
html:root[data-booklight] #ui .dgx-mob.el { border-color: #e09a3a; }
html:root[data-booklight] #ui .dgx-tips { background: #fff0dc; color: #7a3c06 !important; -webkit-text-fill-color: #7a3c06 !important; }
html:root[data-booklight] #ui .dgx-rtabs button { background: #fff; border-color: #d8c4a8; color: #4a3438 !important; -webkit-text-fill-color: #4a3438 !important; }
html:root[data-booklight] #ui .dgx-rtabs button i { background: #f0e6da; color: #5a4448 !important; -webkit-text-fill-color: #5a4448 !important; }
html:root[data-booklight] #ui .dgx-rtabs button.on { background: linear-gradient(180deg, #ffe08a, #e8a838); border-color: #b47a1a; color: #3a2204 !important; -webkit-text-fill-color: #3a2204 !important; }
html:root[data-booklight] #ui .dgx-rtabs button.on i { background: rgba(58, 34, 4, 0.15); color: #3a2204 !important; -webkit-text-fill-color: #3a2204 !important; }
html:root[data-booklight] #ui .dgx-rtabs button.new::after { box-shadow: 0 0 0 1.5px #fff; }
html:root[data-booklight] #ui .dgx-it { background: radial-gradient(circle at 50% 34%, #ffffff, color-mix(in srgb, var(--gc) 14%, #f3ebe0) 78%); border-color: color-mix(in srgb, var(--gc) 55%, #c8b8a4); }
html:root[data-booklight] #ui .dgx-it > span { color: #2e1c26 !important; -webkit-text-fill-color: #2e1c26 !important; }
html:root[data-booklight] #ui .dgx-it > b { background: #3a2830; }

/* ---- the daily page's left side: the story in two lines, the cards' one number line */
#ui .ddg-hero small { display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
#ui .dgc.wide .dgc-req { font-size: 0.74rem; }
#ui .dgc.wide .dgc-you { font-size: 0.78rem; }

/* ---------------------------------------------------------------- the boss / party window: the bar at the right page's foot */
#bdg .bdg-side > * { flex-shrink: 0; }
#bdg .bdg-center .bdg-hero { flex: 1 1 auto; }
/* (the reward names on the light books: dark, not pale) */
html:root[data-booklight] #bdg .bdg-rw-it span { color: #2e1c26 !important; -webkit-text-fill-color: #2e1c26 !important; }
html:root[data-booklight] #bdg .bdg-rnote { color: #5e4a4e !important; -webkit-text-fill-color: #5e4a4e !important; }

@media (prefers-reduced-motion: reduce) { html:root #ui .dgx-foot button.btn.dgx-go:not(#_) { animation: none !important; } }
/* (a long tab: its first four + "ดูทั้งหมด"; open, a "ย่อ" tile at its end) */
#ui .dgx-it.more { justify-content: center; gap: 2px; padding: 6px 3px; border-style: dashed; --gc: #ffd98a; }
#ui .dgx-it.more strong { font: 800 1.35rem/1.1 Fredoka, var(--thai, 'Mali', sans-serif); color: #ffd98a !important; -webkit-text-fill-color: #ffd98a !important; }
html:root[data-booklight] #ui .dgx-it.more strong { color: #8a5a10 !important; -webkit-text-fill-color: #8a5a10 !important; }