/* ─────────────────────────────────────────────────────────────
   QUEST LOG · each schedule day as a scroll-bound chapter
   ───────────────────────────────────────────────────────────── */
.qlog { --c1: var(--tone-violet); --c2: var(--tone-rose);
  position: relative; margin-block: 14px; background: linear-gradient(180deg, #24104f, #140a33 70%); border-inline: 1px solid rgba(233,189,103,.35);
  box-shadow: inset 0 0 40px rgba(106,58,168,.25), 0 18px 40px rgba(0,0,0,.4); transition: transform .45s cubic-bezier(.3,1.4,.5,1); }
.qlog::before, .qlog::after { content: ""; position: absolute; left: -10px; right: -10px; height: 16px; border-radius: 8px; z-index: 2;
  background: linear-gradient(180deg, #7a4a12, #fff3c4 40%, #e9bd67 60%, #7a4a12); box-shadow: 0 0 12px rgba(243,195,95,.45); }
.qlog::before { top: -8px; }
.qlog::after { bottom: -8px; }
.qlog:hover { transform: translateY(-6px); }

.qlog__head { position: relative; overflow: hidden; padding: 30px 24px 30px; text-align: center; clip-path: polygon(0 0, 100% 0, 100% calc(100% - 16px), 50% 100%, 0 calc(100% - 16px));
  background: radial-gradient(80% 120% at 50% 0%, color-mix(in srgb, var(--c2) 45%, transparent), transparent 70%), linear-gradient(90deg, #3a1a78, #5a1a6e, #3a1a78); }
.qlog__chapter { display: block; font: italic 800 .72rem/1 var(--f-ui); letter-spacing: .3em; text-transform: uppercase; color: var(--gold-soft); }
.qlog__chapter b { display: inline-block; margin-left: 6px; font: 400 1.5rem/1 var(--f-display); color: #fff; text-shadow: 0 0 12px var(--c2); vertical-align: -.2em; }
.qlog__title { margin: 12px 0 6px; font: 400 1.4rem/1.15 var(--f-display); color: #fff; text-shadow: 0 2px 0 #1c0838; }
.qlog__day { font: italic 700 .8rem/1 var(--f-ui); letter-spacing: .16em; text-transform: uppercase; color: var(--mist); }

.qlog__list { list-style: none; margin: 0; padding: 20px 22px 30px; position: relative; }
.qlog__list::before { content: ""; position: absolute; left: 30px; top: 30px; bottom: 40px; width: 2px; background: repeating-linear-gradient(180deg, rgba(243,195,95,.6) 0 6px, transparent 6px 11px); }
.qlog__item { position: relative; display: grid; grid-template-columns: 18px 64px 1fr; align-items: start; gap: 10px; padding: 11px 0; }
.qlog__item + .qlog__item { border-top: 1px dashed rgba(184,167,216,.16); }
.qlog__node { width: 14px; height: 14px; margin: 4px 0 0 1px; transform: rotate(45deg); border: 2px solid var(--gold); background: #140a33; box-shadow: 0 0 10px rgba(243,195,95,.4); transition: background .3s, transform .4s; position: relative; z-index: 1; }
.qlog__item:hover .qlog__node { background: var(--gold-soft); transform: rotate(225deg) scale(1.15); }
.qlog__item time { font: 400 .78rem/1 var(--f-display); color: var(--gold-soft); padding: 6px 7px 5px; background: rgba(243,195,95,.1); border: 1px solid rgba(243,195,95,.3); clip-path: polygon(5px 0, 100% 0, calc(100% - 5px) 100%, 0 100%); text-align: center; font-variant-numeric: tabular-nums; }
.qlog__item span { font-size: .93rem; color: var(--ivory); padding-top: 2px; }
.qlog__boss { grid-column: 3; justify-self: start; font: italic 800 .62rem/1 var(--f-ui); letter-spacing: .22em; text-transform: uppercase; color: #fff; padding: 5px 10px; background: linear-gradient(90deg, var(--crimson-hi), var(--magenta)); clip-path: polygon(5px 0, 100% 0, calc(100% - 5px) 100%, 0 100%); box-shadow: 0 0 12px rgba(217,54,127,.6); }

/* final day: gold "boss chapter" */
.qlog--final { border-inline-color: rgba(243,195,95,.8); box-shadow: inset 0 0 50px rgba(243,195,95,.15), 0 0 40px rgba(243,195,95,.25), 0 18px 40px rgba(0,0,0,.4); }
.qlog--final .qlog__head { background: radial-gradient(80% 120% at 50% 0%, rgba(255,214,121,.55), transparent 70%), linear-gradient(90deg, #6a2a10, #8e1636, #6a2a10); }
.qlog--final .qlog__head::after { content: ""; position: absolute; left: 50%; top: 50%; width: 140%; aspect-ratio: 1; translate: -50% -50%; pointer-events: none;
  background: repeating-conic-gradient(rgba(255,214,121,.22) 0 5deg, transparent 5deg 15deg); -webkit-mask: radial-gradient(circle, #000 5%, transparent 45%); mask: radial-gradient(circle, #000 5%, transparent 45%); animation: spin 30s linear infinite; }
.qlog--final .qlog__chapter b { text-shadow: 0 0 14px #ffd679; }
