/* TI: editable composition, then a quiet finished title with no text fields. */
html.tc-locked,html.tc-locked body { overflow:hidden; }
#titlecard { --tc-play:paused; position:fixed; inset:0; padding:0; display:none; overflow:hidden;
  color:#f4f6fa; text-align:left; cursor:default; isolation:isolate; outline:none;
  background:radial-gradient(ellipse at 72% 25%,#182b45 0,#101b2d 46%,#0b1421 100%); }
#titlecard.show { display:block; animation:tc-stage-open .45s ease both; }
#titlecard::before,#titlecard::after,#titlecard .thanks-net,#titlecard .tk-hud { display:none; }
#titlecard *,#titlecard *::before,#titlecard *::after { box-sizing:border-box; }
#titlecard [hidden] { display:none!important; }
#titlecard :is(h2,p) { margin:0; }
#titlecard .tc-atmosphere { position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
#titlecard .tc-atmosphere i { position:absolute; width:75vw; height:85vh; top:-25vh; right:-22vw;
  background:radial-gradient(ellipse,#5581b731,transparent 68%); border-radius:50%;
  animation:tc-light 29s ease-in-out infinite alternate; animation-play-state:var(--tc-play); }
#titlecard .tc-atmosphere i+i { top:auto; right:auto; bottom:-42vh; left:-24vw;
  background:radial-gradient(ellipse,#5b809323,transparent 68%); animation-duration:37s; animation-direction:alternate-reverse; }
#titlecard.tc-motion-active { --tc-play:running; }
#titlecard .tc-arc { position:absolute; width:100vh; height:100vh; right:-35vh; top:-27vh;
  border:1px solid #bad5ed18; border-radius:50%; pointer-events:none; z-index:0; }
#titlecard .tc-arc::after { content:''; position:absolute; inset:10%; border:1px solid #bad5ed0d; border-radius:50%; }
#titlecard .tc-shell { position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1fr);
  gap:38px; width:100%; height:100%; padding:clamp(74px,10vh,112px) clamp(28px,7vw,135px) clamp(42px,7vh,78px); }
#titlecard.tc-is-editing .tc-shell { grid-template-columns:minmax(0,1fr) minmax(310px,390px); padding:76px 28px 28px; gap:32px; }
#titlecard .tc-stage { display:grid; grid-template-rows:auto minmax(0,1fr) auto; gap:clamp(24px,4vh,42px);
  height:100%; min-width:0; min-height:0; width:100%; max-width:1500px; margin:auto; }
#titlecard.tc-is-editing .tc-stage { padding:24px clamp(16px,3vw,56px); }
#titlecard .tc-meta { display:flex; align-items:baseline; justify-content:flex-start; gap:20px;
  flex-wrap:wrap; margin:0; min-width:0; animation:none; }
#titlecard.show .tc-meta { animation:none; opacity:1; transform:none; }
#titlecard .tc-eyebrow { color:#d0e2f4; font:500 12px/1.6 var(--font-ja-sans); letter-spacing:.2em; flex:none; }
#titlecard .tc-date { color:#aabbd0; border:0; border-left:1px solid #c6d9ef36; padding:0 0 0 20px;
  min-width:0; font:400 clamp(13px,1.35vw,20px)/1.65 var(--font-ja-sans); letter-spacing:.035em; overflow-wrap:anywhere; }
#titlecard .tc-date:hover,#titlecard .tc-title:hover { background:none; }
#titlecard .tc-content { display:flex; align-items:center; min-width:0; min-height:0; overflow:visible; }
#titlecard .tc-copy { width:100%; min-width:0; }
#titlecard .tc-title,#titlecard.show .tc-title { display:block; max-width:100%; width:100%; padding:0;
  margin:0; color:#f5f7fb; font:500 80px/1.4 var(--font-ja-sans); letter-spacing:.035em;
  white-space:pre-wrap; overflow-wrap:anywhere; text-wrap:balance; text-shadow:none; animation:none;
  transform:none; opacity:1; border:0; border-radius:0; transition:none; }
#titlecard .tc-title.is-placeholder { color:#93a8c24f; }
#titlecard .tc-subtitle { max-width:100%; margin-top:clamp(20px,3.4vh,36px); color:#b8cde2;
  font:400 28px/1.75 var(--font-ja-sans); letter-spacing:.035em; white-space:pre-wrap; overflow-wrap:anywhere; }
#titlecard .tc-byline { display:flex; align-items:flex-end; justify-content:space-between; gap:24px;
  border-top:1px solid #c6d9ef2b; padding-top:clamp(20px,3.4vh,36px); }
#titlecard .tc-byline p { font:500 clamp(18px,1.65vw,26px)/1.5 var(--font-ja-sans); letter-spacing:.07em; }
#titlecard .tc-byline p span { margin-left:16px; color:#afc1d6; font-size:.62em; letter-spacing:.04em; }
#titlecard .tc-byline small { display:block; margin-top:9px; color:#93a8c1; font:400 clamp(12px,1.08vw,17px)/1.65 var(--font-ja-sans); }
#titlecard .tc-signature { color:#d0deee; font:400 clamp(12px,1.2vw,19px)/1 var(--font-en); letter-spacing:.19em; }
#titlecard .tc-tools { position:absolute; z-index:6; top:20px; right:24px; display:flex; gap:8px;
  opacity:0; pointer-events:none; transition:opacity .22s ease; }
#titlecard.tc-controls-visible .tc-tools,#titlecard.tc-is-editing .tc-tools,#titlecard .tc-tools:focus-within { opacity:1; pointer-events:auto; }
#titlecard .tc-tools button { min-height:40px; padding:9px 16px; border:1px solid #c6d9ef35; border-radius:30px;
  color:#d3e0ef; background:#102034d9; font:400 12px/1.4 var(--font-ja-sans); cursor:pointer; }
#titlecard .tc-tools button:hover { border-color:#c6d9ef80; background:#1a304c; }
#titlecard button:focus-visible,#titlecard input:focus-visible,#titlecard textarea:focus-visible { outline:2px solid #b5d6f5; outline-offset:4px; }
#titlecard .tc-editor { display:flex; flex-direction:column; gap:22px; min-height:0; overflow-y:auto;
  padding:28px; border:1px solid #c6d9ef28; border-radius:26px; background:#152438ed;
  box-shadow:0 24px 68px #0002; scrollbar-width:thin; scrollbar-color:#829bb340 transparent; }
#titlecard .tc-editor header > p { color:#a7bad1; font:400 11px/1.6 var(--font-ja-sans); letter-spacing:.1em; }
#titlecard .tc-editor header h2 { margin-top:7px; font:500 22px/1.5 var(--font-ja-sans); color:#edf4fb; }
#titlecard .tc-field { display:flex; flex-direction:column; gap:9px; }
#titlecard .tc-field > span,#titlecard .tc-slider > span { font:500 13px/1.5 var(--font-ja-sans); color:#c8d8e9; }
#titlecard .tc-field small { color:#8ea4be; margin-left:8px; font-weight:400; font-size:11px; }
#titlecard .tc-field :is(input,textarea) { display:block; width:100%; min-width:0; border:1px solid #c6d9ef30;
  border-radius:12px; padding:12px 14px; font:400 15px/1.65 var(--font-ja-sans); color:#edf4fb;
  background:#0c192b9e; outline-offset:3px; }
#titlecard .tc-field textarea { resize:vertical; min-height:80px; max-height:40vh; }
#titlecard .tc-field :is(input,textarea)::placeholder { color:#71869f; }
#titlecard .tc-slider { display:grid; grid-template-columns:1fr auto; gap:9px 12px; align-items:center; }
#titlecard .tc-slider output { color:#d0e2f4; font:500 13px/1.5 var(--font-en); font-variant-numeric:tabular-nums; }
#titlecard .tc-slider input { grid-column:1/-1; width:100%; height:20px; margin:0; accent-color:#b4d3ee; cursor:pointer; }
#titlecard .tc-fit-note { font:400 12px/1.75 var(--font-ja-sans); color:#a7bdd4; }
#titlecard .tc-fit-note.is-error { color:#f0c3a4; }
#titlecard .tc-editor-actions { border-top:1px solid #c6d9ef23; padding-top:22px; margin-top:auto; }
#titlecard .tc-editor-actions button { display:block; width:100%; min-height:46px; padding:11px 20px;
  border:0; border-radius:14px; background:#d0e3f4; color:#15263d; font:600 14px/1.5 var(--font-ja-sans); cursor:pointer; }
#titlecard .tc-editor-actions button:hover { background:#e2eef9; }
#titlecard .tc-editor-actions p { margin-top:14px; color:#a7b9d0; font:400 11px/1.8 var(--font-ja-sans); }
#titlecard .tc-editor-actions small { display:block; margin-top:12px; color:#8197b0; font:400 10px/1.7 var(--font-ja-sans); }
#titlecard.tc-fit-overflow .tc-content { align-items:flex-start; overflow:auto; overscroll-behavior:contain; }
@keyframes tc-light { from { transform:translate3d(-3%,-2%,0); opacity:.65; } to { transform:translate3d(5%,5%,0); opacity:1; } }
@keyframes tc-stage-open { from { opacity:0; } to { opacity:1; } }
@media(max-width:960px) {
  #titlecard.tc-is-editing { overflow-y:auto; }
  #titlecard.tc-is-editing .tc-shell { grid-template-columns:1fr; height:auto; min-height:100%; padding:74px 24px 28px; gap:28px; }
  #titlecard.tc-is-editing .tc-stage { height:60svh; min-height:420px; padding:20px 0; }
  #titlecard .tc-editor { overflow:visible; max-width:620px; width:100%; margin:auto; }
  #titlecard .tc-tools { right:20px; }
}
@media(max-width:540px) {
  #titlecard .tc-shell { padding:78px 7vw 36px; }
  #titlecard .tc-stage { gap:24px; }
  #titlecard .tc-meta { gap:10px 14px; }
  #titlecard .tc-eyebrow { font-size:11px; }
  #titlecard .tc-date { padding-left:14px; font-size:12px; }
  #titlecard .tc-byline { gap:15px; padding-top:20px; }
  #titlecard .tc-byline p { font-size:18px; }
  #titlecard .tc-byline p span { margin-left:10px; }
  #titlecard .tc-byline small { font-size:11px; }
  #titlecard .tc-signature { display:none; }
  #titlecard .tc-tools { top:17px; right:16px; gap:6px; }
  #titlecard .tc-tools button { padding:9px 13px; }
  #titlecard.tc-is-editing .tc-shell { padding:74px 7vw 24px; }
  #titlecard .tc-editor { border-radius:22px; padding:22px; }
  #titlecard .tc-editor header h2 { font-size:20px; }
}
@media(max-height:560px) and (min-width:961px) {
  #titlecard .tc-shell { padding:70px 7vw 30px; }
  #titlecard .tc-stage { gap:18px; }
  #titlecard .tc-byline { padding-top:18px; }
  #titlecard .tc-byline p { font-size:18px; }
  #titlecard .tc-byline small { font-size:12px; }
}
@media(prefers-reduced-motion:reduce) {
  #titlecard,#titlecard *,#titlecard *::before,#titlecard *::after { animation:none!important; transition:none!important; }
}
@media print { #titlecard { display:none!important; } }