@font-face{font-family:'BC Romance Capitals';src:url('fonts/bc-romance-capitals.woff2') format('woff2');font-weight:400;font-style:normal;font-display:block}
.name-page{background:#f4eee3;min-height:100svh;padding:clamp(28px,5vh,55px) 28px;isolation:isolate;animation:none;color:#654534}
.name-page:before{content:'';position:absolute;inset:0;background:url('assets/art/damask.svg') center/320px auto;opacity:.045;pointer-events:none;z-index:-1}
.name-frame{position:absolute;inset:10px;background:url('assets/art/window-ornate.svg') center/100% 100% no-repeat;pointer-events:none;z-index:-1}
.name-content{width:min(100%,410px);display:flex;flex-direction:column;align-items:center;text-align:center;padding:22px 4px 16px}
.name-invitation{font:10px/1.8 'Cormorant Garamond',serif;letter-spacing:.16em;color:#9c805b}
.name-page .name-logo{width:100%;margin:20px 0 8px;line-height:1;font-size:0;letter-spacing:0}
.name-logo img{display:block;width:100%;height:auto}
.name-subtitle{font:10px/1.6 'Cormorant Garamond',serif;letter-spacing:.14em;color:#8a6f52}
.name-crest{height:46px;width:180px;margin:12px 0 0;background:url('assets/art/crest.svg') center/contain no-repeat}
.name-page .name-prompt{font:17px/1.9 'BC Literary Narrative','Noto Serif SC',serif;letter-spacing:.07em;margin:8px 0 12px;color:#63473c}
.name-form{display:flex;flex-direction:column;align-items:center;width:100%;margin:0}
.name-form label{font:10px/1.6 'Cormorant Garamond','BC Literary Narrative',serif;letter-spacing:.15em;color:#8e7457}
.name-form input{width:min(100%,280px);height:52px;margin:8px 0 24px;padding:9px 10px;border:0;border-bottom:1px solid #b69b72;background:linear-gradient(transparent,#fff8);border-radius:0;font:22px/1.3 'BC Literary Narrative','Noto Serif SC',serif;color:#4a2630;letter-spacing:.08em;min-width:0}
.name-form input::placeholder{font-size:15px;letter-spacing:.1em;color:#b09b89}
.name-form input:focus{outline:1px solid #b89a7040;outline-offset:5px;border-color:#803c48}
.name-start{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1px;width:260px;height:70px;min-height:70px;max-width:100%;border:0;padding:7px 20px;background:url('assets/art/button.svg') center/100% 100% no-repeat!important;color:#67452e}
.name-start span{font:15px/1.5 'BC Ornament Display','Noto Serif SC',serif;letter-spacing:.18em}
.name-start b{font:400 15px/1.5 'BC Romance Capitals',serif;letter-spacing:.06em}
.name-start:active{transform:translateY(1px);filter:brightness(.94)}
.name-start:disabled{opacity:.65;cursor:progress}
.name-form #error{min-height:22px;font:12px/1.7 'BC Literary Narrative','Noto Serif SC',serif;letter-spacing:.03em;margin:7px 0 3px;color:#803c48}
.name-footnote{font:11px/1.8 'BC Literary Narrative','Noto Serif SC',serif;letter-spacing:.24em;color:#a38d73}
/* Each English name is a two-line title composition, not a caption. */
.cast-name,.cast-1 .cast-name,.cast-2 .cast-name,.cast-3 .cast-name,.cast-4 .cast-name{left:9%;right:9%;max-width:none;bottom:13%;padding:0;border:0;background:none;transform:none;text-align:center;z-index:8;animation:none}
.cast-name h2{margin:5px 0 0;line-height:1.1;font-family:'BC Romance Capitals',serif;font-size:clamp(29px,8.9vw,46px);font-weight:400;letter-spacing:0;color:var(--ink);text-shadow:0 1px 0 #fff3,0 -1px 0 #20152625}
.cast-name h2 span{font-family:'BC Romance Capitals',serif;line-height:1.2;letter-spacing:.025em;white-space:nowrap;animation:none;clip-path:none;display:block}
.cast-name h2 .cast-surname{font-size:.61em;margin-bottom:3px;letter-spacing:.12em;animation:surname-inscribe 1.05s .65s cubic-bezier(.22,.61,.36,1) both}
.cast-name h2 .cast-given{font-size:1em;animation:given-unveil 1.25s .85s cubic-bezier(.22,.61,.36,1) both}
.cast-given b{font:inherit;font-size:1.12em;letter-spacing:-.025em}
.cast-name small{font:15px/1.2 'Cormorant Garamond',serif;letter-spacing:.18em;margin-bottom:6px}
.cast-name:before{content:'';display:block;width:100px;height:24px;background:url('assets/art/crest.svg') center/contain no-repeat;margin:0 auto 5px;opacity:.8;animation:crest-unveil 1.4s .55s both}
.cast-name:after{left:12%;width:76%;bottom:-30px;height:24px;opacity:.65}
.cast-0 .cast-name{left:8%;right:14%;bottom:13.5%}
.cast-1 .cast-name{left:16%;right:7%;bottom:13.5%}
.cast-2 .cast-name{left:8%;right:14%;bottom:14.5%}
.cast-3 .cast-name{left:10%;right:10%;bottom:12.5%}
.cast-4 .cast-name{left:15%;right:7%;bottom:13.5%}
@keyframes surname-inscribe{from{clip-path:inset(0 100% 0 0);translate:-5px 0}to{clip-path:inset(0);translate:0 0}}
@keyframes given-unveil{from{clip-path:inset(100% 0 0);translate:0 9px}to{clip-path:inset(0);translate:0 0}}
@media(max-height:700px){.name-page{padding:24px 25px}.name-content{padding:18px 0 8px}.name-page .name-logo{width:90%;margin:8px 0}.name-crest{height:27px;margin:7px 0 0}.name-page .name-prompt{font-size:15px;line-height:1.8;margin:7px 0 10px}.name-form input{height:44px;margin:5px 0 15px}.name-start{height:61px;min-height:61px}.name-footnote{font-size:10px}.cast-name h2{font-size:clamp(27px,8.5vw,39px)}.cast-name small{font-size:13px}.cast-name:before{height:17px;margin-bottom:3px}.cast-name,.cast-1 .cast-name,.cast-2 .cast-name,.cast-3 .cast-name,.cast-4 .cast-name{bottom:13%}}
@media(min-width:750px){.name-frame{inset:14px max(14px,calc(50% - 290px))}.cast-name,.cast-1 .cast-name,.cast-2 .cast-name,.cast-3 .cast-name,.cast-4 .cast-name{left:29%!important;right:29%!important;max-width:none}.cast-name h2{font-size:min(5.5vh,44px)}}
@media(prefers-reduced-motion:reduce){.cast-name h2 .cast-surname,.cast-name h2 .cast-given,.cast-name:before{animation-duration:.2s;animation-delay:0s}}
.name-start span{display:none}.name-start b{font-size:16px;line-height:1;letter-spacing:.05em}
.name-page .name-logo{width:94%;margin-top:14px;margin-bottom:5px}
.name-invitation{font-size:9px;letter-spacing:.09em}.name-footnote{margin-top:0;font-size:10px}
.name-content{padding-top:30px;padding-bottom:28px}

/* Final detail corrections: retain the existing photo movement and masks. */
.cast-2 .cast-portrait img{rotate:3deg}
.cast-3 .cast-portrait img{rotate:6deg}
.cast-name h2{font-size:clamp(36.25px,11.125vw,57.5px)}
.cast-0 .cast-name{left:4%;right:4%}
@media(max-height:700px){.cast-name h2{font-size:clamp(33.75px,10.625vw,48.75px)}}
@media(min-width:750px){.cast-name h2{font-size:min(6.875vh,55px)}}
.cast-0 .cast-name h2{font-size:clamp(34.8px,10.68vw,55.2px)}
.cast-0 .cast-name h2 .cast-given{letter-spacing:-.015em}
.cast-0 .cast-name h2 .cast-given b{font-size:1em;letter-spacing:0}
@media(max-height:700px){.cast-0 .cast-name h2{font-size:clamp(32.4px,10.2vw,46.8px)}}
@media(min-width:750px){.cast-0 .cast-name h2{font-size:min(6.6vh,52.8px)}}