.tmn-story-page {
    --tmn-story-header: 69px;
    --tmn-story-viewport: 100vh;
    background: #141518;
}
@supports (height: 100dvh) {
    .tmn-story-page { --tmn-story-viewport: 100dvh; }
}
.tmn-inner-tasaroman { padding-top: 0; color: #f4f0f4; }
.tmn-story-track { overflow-anchor: none; }
.tmn-story-pin {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: clamp(150px, 12vw, 190px) minmax(0, 1fr);
    align-items: start;
    width: min(100%, 1680px);
    margin-inline: auto;
    padding-inline: clamp(16px, 4.6vw, 80px);
}
.tmn-story-atmosphere {
    position: absolute;
    z-index: -1;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
}
.tmn-story-light {
    position: absolute;
    inset: -6%;
    opacity: 0;
    transform: translate3d(var(--tmn-story-light-x, 0px), var(--tmn-story-light-y, 0px), 0);
}
.tmn-story-light:first-child { opacity: 1; }
.tmn-story-light::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 69% 24%, var(--tmn-story-glow), transparent 66%),
                radial-gradient(ellipse at 22% 89%, var(--tmn-story-wash), transparent 61%);
    opacity: .62;
}
.tmn-story-track[data-tmn-story-live] { height: var(--tmn-story-track-height); }
[data-tmn-story-live] .tmn-story-pin {
    position: sticky;
    top: var(--tmn-story-header);
    height: calc(var(--tmn-story-viewport) - var(--tmn-story-header));
    align-items: stretch;
    overflow: hidden;
}
.tmn-story-nav { position: sticky; z-index: 2; top: calc(var(--tmn-story-header) + 20px); align-self: start; padding: 20px 0; }
[data-tmn-story-live] .tmn-story-nav { position: relative; top: auto; height: 100%; padding-block: clamp(12px, 4vh, 52px); }
.tmn-story-nav ol {
    --tmn-story-node-size: 30px;
    --tmn-story-rail-pad: 22px;
    position: relative;
    display: grid;
    grid-template-rows: repeat(6, minmax(44px, 1fr));
    height: 100%;
    list-style: none;
    margin: 0;
    padding: 0;
}
[data-tmn-story-live] .tmn-story-nav ol {
    --tmn-story-rail-pad: calc(100% / 12);
}
.tmn-story-nav ol::before, .tmn-story-nav ol::after {
    content: "";
    position: absolute;
    top: var(--tmn-story-rail-pad);
    bottom: var(--tmn-story-rail-pad);
    left: calc(var(--tmn-story-node-size) / 2 - 1px);
    width: 2px;
    border-radius: 2px;
    background: #50505d;
}
.tmn-story-nav ol::after {
    background: linear-gradient(#aa8bd8, #dc88ba);
    transform: scaleY(var(--tmn-story-progress, 0));
    transform-origin: top;
}
.tmn-story-nav li { display: grid; align-items: center; z-index: 1; }
.tmn-story-nav a {
    display: grid;
    grid-template: "node year" auto "node name" auto / var(--tmn-story-node-size) minmax(0, 1fr);
    align-content: center;
    column-gap: 10px;
    min-height: 44px;
    padding-right: 8px;
    border-radius: 8px;
    color: #c1b9c9;
}
.tmn-story-nav-year { grid-area: year; font-size: .87rem; font-weight: 720; line-height: 1.15; font-variant-numeric: tabular-nums; }
.tmn-story-nav-name { grid-area: name; font-size: .68rem; line-height: 1.35; }
.tmn-story-node {
    grid-area: node;
    align-self: center;
    display: grid;
    place-items: center;
    width: var(--tmn-story-node-size);
    aspect-ratio: 1;
    border: 1px solid #555060;
    border-radius: 50%;
    background: #212128;
    color: #c3b3d1;
}
.tmn-story-node svg { width: 15px; height: 15px; }
.tmn-story-nav a:hover, .tmn-story-nav a[aria-current] { color: #fff5ff; }
.tmn-story-nav li { --tmn-story-node-accent: #c0a4ed; }
.tmn-story-nav li:nth-child(2) { --tmn-story-node-accent: #efa4c5; }
.tmn-story-nav li:nth-child(3) { --tmn-story-node-accent: #9bd5b5; }
.tmn-story-nav li:nth-child(4) { --tmn-story-node-accent: #a6c8f2; }
.tmn-story-nav li:nth-child(5) { --tmn-story-node-accent: #f2c196; }
.tmn-story-nav li:nth-child(6) { --tmn-story-node-accent: #e2aceb; }
.tmn-story-nav a:is([data-tmn-story-passed], [aria-current]) .tmn-story-node {
    border-color: var(--tmn-story-node-accent);
    color: var(--tmn-story-node-accent);
    background: color-mix(in srgb, var(--tmn-story-node-accent) 19%, #212128);
}
.tmn-story-nav a[aria-current] .tmn-story-node { transform: scale(1.12); box-shadow: 0 0 16px color-mix(in srgb, var(--tmn-story-node-accent) 33%, transparent); }

.tmn-story-stage { position: relative; min-width: 0; }
.tmn-story-scenes { position: relative; list-style: none; margin: 0; padding: 0; }
[data-tmn-story-live] .tmn-story-scenes { height: 100%; }
.tmn-story-preview { display: none; }
[data-tmn-story-live] .tmn-story-preview {
    display: block;
    position: absolute;
    inset: auto 6% 6% auto;
    width: min(48%, 420px);
    height: 38%;
    opacity: .13;
    background: linear-gradient(155deg, #16171c, #29202e8c), var(--tmn-story-preview, none) center 55% / cover;
    filter: blur(13px);
    border-radius: 50%;
    pointer-events: none;
}
.tmn-story-chapter {
    --tmn-story-accent: #c0a4ed;
    --tmn-story-tint: #282233;
    display: grid;
    grid-template: "copy visual" auto / minmax(0, 1fr) minmax(0, 1.15fr);
    align-items: center;
    align-content: safe center;
    gap: clamp(15px, 3.6vw, 62px);
    padding: clamp(28px, 5vw, 80px) clamp(2px, 1.6vw, 26px);
    scroll-margin-top: 12px;
}
[data-tmn-story-live] .tmn-story-chapter {
    position: absolute;
    inset: 0;
    padding-block: 16px;
    visibility: hidden;
    pointer-events: none;
}
[data-tmn-story-live] .tmn-story-chapter[data-tmn-story-visible] { visibility: visible; }
[data-tmn-story-live] .tmn-story-chapter[aria-hidden="false"] { pointer-events: auto; }
@media (min-width: 701px) {
    .tmn-story-chapter:nth-child(even):not(:last-child) {
        grid-template: "visual copy" auto / minmax(0, 1.15fr) minmax(0, 1fr);
    }
}
.tmn-story-chapter-2016 { --tmn-story-accent: #efa4c5; --tmn-story-tint: #34222d; }
.tmn-story-chapter-2019 { --tmn-story-accent: #9bd5b5; --tmn-story-tint: #20322d; }
.tmn-story-chapter-2021 { --tmn-story-accent: #a6c8f2; --tmn-story-tint: #202d3b; }
.tmn-story-chapter-2026 { --tmn-story-accent: #f2c196; --tmn-story-tint: #372a26; }
.tmn-story-chapter-2027 {
    --tmn-story-accent: #e2aceb;
    grid-template: "copy" auto "visual" auto / minmax(0, 1fr);
    justify-items: center;
    gap: clamp(14px, 2.6vh, 24px);
    text-align: center;
    background: radial-gradient(ellipse at 52% 50%, #56233680, transparent 67%);
}
.tmn-story-copy { grid-area: copy; min-width: 0; }
.tmn-story-copy h2 {
    font-size: clamp(1.55rem, 3.3vw, 3.6rem);
    font-weight: 760;
    line-height: 1.08;
    letter-spacing: -.045em;
    overflow-wrap: anywhere;
    text-wrap: balance;
}
.tmn-story-copy time {
    display: block;
    margin-bottom: .21em;
    color: var(--tmn-story-accent);
    font-size: clamp(3.15rem, 7.8vw, 8rem);
    font-weight: 800;
    line-height: .92;
    letter-spacing: -.07em;
    font-variant-numeric: tabular-nums;
}
.tmn-story-title { display: block; }
.tmn-story-highlight { margin-top: 12px; color: var(--tmn-story-accent); font-size: clamp(.8rem, 1.25vw, 1rem); font-weight: 650; }
.tmn-story-next-label { display: block; margin-block: 8px 7px; color: var(--tmn-story-accent); font-size: .68rem; font-weight: 680; letter-spacing: .15em; }
.tmn-story-description { max-width: 49ch; margin-top: 9px; color: #d2cbd5; font-size: clamp(.81rem, 1.1vw, .98rem); line-height: 1.61; }
.tmn-story-chapter-2027 .tmn-story-description { margin-inline: auto; }
.tmn-story-typed { display: none; }
[data-tmn-story-live] .tmn-story-typed { display: inline; }
.tmn-story-letter[data-tmn-story-letter-hidden] { visibility: hidden; }
.tmn-story-details { display: flex; flex-wrap: wrap; gap: 7px 12px; list-style: none; margin: 14px 0 0; padding: 0; }
.tmn-story-details li { display: inline-flex; align-items: center; gap: 5px; color: #eee8f0; font-size: .7rem; font-weight: 520; }
.tmn-story-details svg { width: 15px; height: 15px; color: var(--tmn-story-accent); }

.tmn-story-visual { grid-area: visual; min-width: 0; margin: 0; }
.tmn-story-photo {
    position: relative;
    aspect-ratio: 5 / 4;
    max-height: min(56vh, 580px);
    overflow: hidden;
    border: 1px solid #ffffff20;
    border-radius: 23px;
    background: var(--tmn-story-tint);
    box-shadow: 0 23px 48px #0c0c127d;
}
.tmn-story-photo::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(160deg, transparent 37%, #14111b62);
    pointer-events: none;
}
.tmn-story-photo :is(img, video), .tmn-story-tile img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: var(--tmn-story-photo-position, center);
}
.tmn-story-photo video { position: absolute; inset: 0; pointer-events: none; }
.tmn-story-gallery {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(6px, .7vw, 10px);
}
.tmn-story-tile {
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: clamp(12px, 1.15vw, 16px);
    background: var(--tmn-story-tint);
    box-shadow: 0 13px 28px #0c0c1255;
}
.tmn-story-gallery-portraits .tmn-story-tile { aspect-ratio: 3 / 4; }
@media (hover: hover) and (pointer: fine) {
    [data-tmn-story-live] .tmn-story-photo :is(img, video) { transform: scale(1.055); }
    [data-tmn-story-live] .tmn-story-chapter[aria-hidden="false"] .tmn-story-photo :is(img, video) {
        transform: translate3d(var(--tmn-story-mouse-x, 0px), var(--tmn-story-mouse-y, 0px), 0) scale(1.055);
    }
    [data-tmn-story-live] .tmn-story-chapter[aria-hidden="false"] .tmn-story-gallery {
        translate: var(--tmn-story-mouse-x, 0px) var(--tmn-story-mouse-y, 0px);
    }
}
.tmn-story-teaser { width: 100%; display: grid; grid-template-columns: minmax(0, 1fr); justify-items: center; gap: 11px; }
.tmn-story-teaser p { color: #e4cbe7; font-size: .8rem; }
.tmn-story-loading { width: min(85%, 245px); height: 3px; overflow: hidden; border-radius: 8px; background: #65436b; }
.tmn-story-loading::before { content: ""; display: block; width: 43%; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #ad84d9, #efa7cf); transform: translateX(67%); }
.tmn-story-dots { display: flex; gap: 5px; color: #e4b4e5; }
.tmn-story-dots i { width: 4px; height: 4px; border-radius: 50%; background: currentColor; }
.tmn-story-thanks {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 6px;
    margin-top: clamp(12px, 2.5vh, 23px);
    color: #f4edf4;
    font-size: 11pt;
    font-weight: 450;
    white-space: nowrap;
}
.tmn-story-heart {
    position: relative;
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    padding: 0;
    border: 0;
    border-radius: 5px;
    background: transparent;
    color: #ff506b;
    vertical-align: middle;
}
.tmn-story-heart::after { content: ""; position: absolute; inset: -10px; }
.tmn-story-heart:focus-visible { outline: 2px solid #ffc5da; outline-offset: 4px; }
.tmn-story-heart:disabled { cursor: default; }
.tmn-story-heart svg { display: block; width: 100%; height: 100%; pointer-events: none; }
.tmn-story-heart[data-tmn-heart-feedback] { color: #ff9cbb; transform: scale(1.08); }
.tmn-story-heart-particle { position: absolute; z-index: 1; pointer-events: none; }
.tmn-story-scroll-hint { display: none; }
[data-tmn-story-live] .tmn-story-scroll-hint {
    position: absolute;
    right: max(8px, env(safe-area-inset-right));
    top: 50%;
    translate: 0 -50%;
    display: flex;
    align-items: center;
    gap: 8px;
    writing-mode: vertical-rl;
    color: #c4bbc9;
    font-size: .61rem;
    letter-spacing: .055em;
    pointer-events: none;
    transition: opacity .28s ease;
}
.tmn-story-scroll-hint svg { width: 14px; height: 14px; }
[data-tmn-story-finished] .tmn-story-scroll-hint { opacity: 0; }

@media (max-width: 1050px) {
    .tmn-story-pin { grid-template-columns: 135px minmax(0, 1fr); padding-inline: 20px; }
    .tmn-story-nav a { column-gap: 7px; }
}
@media (max-width: 700px) {
    .tmn-story-pin { grid-template-columns: 65px minmax(0, 1fr); padding-inline: 9px; }
    .tmn-story-nav ol { --tmn-story-node-size: 18px; }
    .tmn-story-nav a { grid-template: "node year" auto / var(--tmn-story-node-size) minmax(0, 1fr); column-gap: 5px; }
    .tmn-story-nav-year { font-size: .73rem; align-self: center; }
    .tmn-story-node svg { width: 10px; height: 10px; }
    .tmn-story-nav-name { display: none; }
    .tmn-story-chapter { grid-template: "copy" auto "visual" auto / minmax(0, 1fr); gap: 13px; padding: 24px 2px 32px; }
    [data-tmn-story-live] .tmn-story-chapter { padding-block: 11px; }
    .tmn-story-copy h2 { font-size: clamp(1.36rem, 5.7vw, 2.15rem); }
    .tmn-story-copy time { font-size: clamp(2.6rem, 10vw, 4.3rem); }
    .tmn-story-description { line-height: 1.49; }
    .tmn-story-highlight, .tmn-story-details { margin-top: 9px; }
    .tmn-story-photo { aspect-ratio: 16 / 10; max-height: 28svh; border-radius: 21px; }
    .tmn-story-preview { inset-inline-end: 0; }
    .tmn-story-thanks {
        width: calc(100% + 60px);
        translate: -30px 0;
        font-size: clamp(.67rem, 2.76vw, 9pt);
        letter-spacing: -.025em;
    }
    .tmn-story-heart { width: 14px; height: 14px; }
    [data-tmn-story-live] .tmn-story-scroll-hint { right: 5px; top: auto; bottom: max(13px, env(safe-area-inset-bottom)); translate: none; }
    .tmn-story-scroll-hint span { display: none; }
}
@media (max-width: 360px) {
    .tmn-story-thanks { display: block; width: 100%; translate: none; white-space: normal; }
    .tmn-story-thanks .tmn-story-heart { margin-inline-start: 3px; }
}
@media (prefers-reduced-motion: no-preference) {
    .tmn-story-node { transition: background .23s, border-color .23s, box-shadow .23s, transform .23s; }
    .tmn-story-chapter-2027[aria-hidden="false"] .tmn-story-loading::before { animation: tmn-story-load 2.8s ease-in-out infinite; }
    .tmn-story-chapter-2027[aria-hidden="false"] .tmn-story-dots i { animation: tmn-story-dot 1.65s ease-in-out infinite alternate; }
    .tmn-story-dots i:nth-child(2) { animation-delay: .2s; }
    .tmn-story-dots i:nth-child(3) { animation-delay: .4s; }
    [data-tmn-story-live] .tmn-story-light[data-tmn-story-lit]::before { animation: tmn-story-light-drift 26s ease-in-out infinite alternate; }
    [data-tmn-story-live] .tmn-story-scroll-hint svg { animation: tmn-story-scroll-drift 2.8s ease-in-out infinite; }
    .tmn-story-chapter-2027[aria-hidden="false"] .tmn-story-heart svg:first-child { animation: tmn-story-heartbeat 3s ease-in-out infinite; }
}
@keyframes tmn-story-load { from { transform: translateX(-110%); } to { transform: translateX(330%); } }
@keyframes tmn-story-dot { from { opacity: .35; transform: translateY(1px); } to { opacity: 1; transform: translateY(-2px); } }
@keyframes tmn-story-light-drift { from { transform: translate3d(-1%, -1%, 0) scale(1.02); } to { transform: translate3d(2%, 1.4%, 0) scale(1.1); } }
@keyframes tmn-story-scroll-drift { 0%, 100% { transform: translateY(-2px); opacity: .58; } 50% { transform: translateY(3px); opacity: 1; } }
@keyframes tmn-story-heartbeat {
    0%, 18%, 36%, 100% { transform: scale(1); }
    9% { transform: scale(1.19); }
    26% { transform: scale(1.11); }
}

[data-tmn-story-live] .tmn-story-typing-source {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}
