/* 人生选择实验室: tone cards, film subtitles, study cards and the day timeline. */
.tone-picker{display:grid;gap:10px}.tone-title{font-weight:700;font-size:16px}
.tone-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.tone-card{display:flex;flex-direction:column;text-align:left;padding:0;border:2px solid var(--line);border-radius:18px;overflow:hidden;background:var(--panel);color:var(--ink);transition:transform .3s var(--spring),border-color .2s}
.tone-card img{aspect-ratio:4/3;object-fit:cover;width:100%}.tone-card span{padding:8px 10px 10px}.tone-card b{display:block;font-size:15.5px}.tone-card small{display:block;font-size:13px;color:var(--muted);line-height:1.5}
.tone-card:hover{transform:translateY(-3px)}.tone-card[aria-pressed=true]{border-color:var(--accent);box-shadow:var(--glow)}
.film-card{position:relative;padding:22px 24px 22px 26px;border-radius:20px;background:linear-gradient(135deg,rgb(0 0 0/.35),rgb(0 0 0/.15));border:1px solid var(--line);box-shadow:inset 0 0 40px rgb(0 0 0/.25)}
html[data-theme=light] .film-card{background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 10%,var(--panel)),var(--panel))}
.film-clock{display:inline-block;font:800 14px var(--mono);letter-spacing:.08em;color:var(--accent);padding:3px 10px;border:1px solid var(--accent);border-radius:999px;margin-bottom:10px}
.film-text{font-size:18.5px;line-height:1.95;min-height:3.8em}
.film-card.consequence{border-left:4px solid var(--accent-2);animation:result-in .5s var(--spring)}
.study-card{display:grid;gap:8px;padding:18px 20px;border-radius:18px;background:var(--panel);border:1px solid var(--line)}
.study-card h4{margin:6px 0 0;font-size:17px;color:var(--accent)}.study-card p{margin:0;font-size:16.5px;line-height:1.85}.study-card small{color:var(--muted)}
.day-timeline{list-style:none;margin:10px 0 24px;padding:0 0 0 18px;border-left:3px solid var(--line);display:grid;gap:12px}
.day-timeline li{position:relative;padding:8px 14px;border-radius:14px;background:var(--panel);border:1px solid var(--line);opacity:.6}
.day-timeline li::before{content:"";position:absolute;left:-27px;top:16px;width:14px;height:14px;border-radius:50%;background:var(--line)}
.day-timeline li.done{opacity:1}.day-timeline li.done::before{background:var(--accent);box-shadow:0 0 12px var(--accent)}
.day-timeline b{font:800 15px var(--mono);color:var(--accent);margin-right:10px}.day-timeline span{font-weight:700}.day-timeline small{display:block;color:var(--muted);font-size:14.5px}
@media (max-width:720px){.tone-cards{grid-template-columns:1fr 1fr 1fr;gap:6px}.tone-card small{display:none}.film-text{font-size:17px}}