/* v1.14.3 — 开始界面「云溪开卷」：水墨远山 + 旧纸卷轴 + 动态落英。全部尺寸按 --u（390px 高为基准）缩放。 */
#title { --u: calc(min(100vh / 390, 100vw / 844)); --zhu:#b23a2b; --tink:#1d211f; display:block; background:none; overflow:hidden; font-family:"猫田楷", var(--serif); }
#title > * { position:absolute; }
#title button { font-family:inherit; }
.t-sky { top:0;right:0;bottom:0;left:0; background:
  linear-gradient(180deg, rgba(244,214,168,.62) 0%, rgba(246,226,190,.36) 30%, rgba(246,236,214,0) 56%),
  linear-gradient(0deg, rgba(18,26,22,.66) 0%, rgba(18,26,22,0) 38%); backdrop-filter: blur(1.4px) saturate(.82); -webkit-backdrop-filter: blur(1.4px) saturate(.82); }
.t-sun { right:calc(330*var(--u)); top:calc(44*var(--u)); width:calc(56*var(--u)); height:calc(56*var(--u)); border-radius:50%;
  background:radial-gradient(circle at 40% 38%, #e2704f, #c4432f 62%, #a93325); opacity:.92; box-shadow:0 0 calc(40*var(--u)) calc(10*var(--u)) rgba(226,112,79,.35); animation:t-sun 7s ease-in-out infinite alternate; }
@keyframes t-sun { from { box-shadow:0 0 calc(30*var(--u)) calc(6*var(--u)) rgba(226,112,79,.28); transform:translateY(0); } to { box-shadow:0 0 calc(56*var(--u)) calc(16*var(--u)) rgba(240,140,90,.45); transform:translateY(calc(-3*var(--u))); } }
.t-mt { left:-6%; width:112%; top:-2%; height:64%; background:url(../assets/ui/ink/mountains.webp) center bottom / cover no-repeat; mix-blend-mode:multiply; -webkit-mask-image:linear-gradient(#000 52%, transparent); mask-image:linear-gradient(#000 52%, transparent); }
.t-mt3 { opacity:.22; transform:scale(1.15) translateY(-4%); animation:t-drift 60s ease-in-out infinite alternate; }
.t-mt2 { opacity:.32; transform:scale(1.06); animation:t-drift 44s ease-in-out infinite alternate-reverse; }
.t-mt1 { opacity:.5; top:4%; animation:t-drift 32s ease-in-out infinite alternate; }
@keyframes t-drift { from { translate:-2.2% 0; } to { translate:2.2% 0; } }
.t-mist { left:-30%; width:160%; }
.t-mist1 { bottom:18%; height:34%; background:radial-gradient(ellipse 22% 50% at 20% 60%, rgba(255,250,236,.55), transparent 70%), radial-gradient(ellipse 26% 45% at 62% 55%, rgba(255,250,236,.4), transparent 70%); animation:t-mist 38s linear infinite alternate; }
.t-mist2 { bottom:34%; height:26%; background:radial-gradient(ellipse 20% 50% at 35% 50%, rgba(255,246,226,.42), transparent 70%), radial-gradient(ellipse 24% 48% at 80% 50%, rgba(255,246,226,.3), transparent 70%); animation:t-mist 52s linear infinite alternate-reverse; }
@keyframes t-mist { from { translate:-9% 0; } to { translate:9% 0; } }
.t-fade { top:0;right:0;bottom:0;left:0; background:linear-gradient(90deg, rgba(239,230,208,.95) 0%, rgba(239,230,208,.86) 28%, rgba(239,230,208,.3) 50%, rgba(239,230,208,0) 64%); }
#title-fx { top:0;right:0;bottom:0;left:0; width:100%; height:100%; pointer-events:none; }
.t-grain { top:0;right:0;bottom:0;left:0; background:url(../assets/ui/ink/paper.webp); opacity:.14; mix-blend-mode:multiply; pointer-events:none; }
/* 标题 */
.t-name { left:calc(58*var(--u)); top:calc(26*var(--u)); width:calc(250*var(--u)); height:calc(340*var(--u)); }
.t-vt { position:absolute; right:calc(30*var(--u)); top:0; writing-mode:vertical-rl; font-size:calc(70*var(--u)); line-height:1; letter-spacing:calc(6*var(--u)); color:var(--tink);
  text-shadow:1px 1px 0 rgba(255,250,236,.7), 0 0 18px rgba(255,248,230,.9); animation:t-in 1.6s ease-out both; }
.t-vt span { display:block; white-space:nowrap; }
.t-vt span:nth-child(2) { margin-top:calc(8*var(--u)); }
@keyframes t-in { from { opacity:0; filter:blur(6px); transform:translateY(-10px); } to { opacity:1; filter:none; transform:none; } }
.t-vs { position:absolute; left:0; top:calc(44*var(--u)); writing-mode:vertical-rl; white-space:nowrap; font-size:calc(14*var(--u)); letter-spacing:calc(6*var(--u)); color:#5b5443; font-family:var(--serif); animation:t-in 2.2s .5s ease-out both; }
.t-seal { position:absolute; left:calc(-46*var(--u)); top:calc(220*var(--u)); width:calc(34*var(--u)); height:calc(34*var(--u)); background:var(--zhu); color:#f5ead0; font-size:calc(15*var(--u)); display:grid; grid-template-columns:1fr 1fr; place-items:center; transform:rotate(-4deg); box-shadow:0 0 0 1.5px #8a2a1f inset; border-radius:2px; animation:t-seal .5s 1.6s cubic-bezier(.3,1.6,.5,1) both; }
.t-seal i { font-style:normal; writing-mode:vertical-rl; line-height:1; }
@keyframes t-seal { from { opacity:0; transform:rotate(-4deg) scale(1.9); } to { opacity:.95; transform:rotate(-4deg) scale(1); } }
/* 小猫 */
.t-cat { left:calc(232*var(--u)); top:calc(246*var(--u)); width:calc(120*var(--u)); height:calc(144*var(--u)); background:url(../assets/characters/cat/cat.webp) 0 0 / calc(1920*var(--u)) calc(2160*var(--u)) no-repeat; image-rendering:pixelated; filter:drop-shadow(calc(3*var(--u)) calc(4*var(--u)) 0 rgba(30,40,30,.25)); transform-origin:50% 100%; animation:t-breathe 3.4s ease-in-out infinite; }
@keyframes t-breathe { 0%,100% { transform:scaleY(1); } 50% { transform:scaleY(1.03) scaleX(.995); } }
/* 卷轴菜单 */
.t-scroll { right:calc(52*var(--u)); top:calc(-260*var(--u)); width:calc(236*var(--u)); height:calc(284*var(--u)); filter:drop-shadow(0 calc(12*var(--u)) calc(16*var(--u)) rgba(20,24,20,.45)); animation:t-drop 1.5s .3s cubic-bezier(.2,.9,.25,1) forwards; }
@keyframes t-drop { to { top:calc(52*var(--u)); } }
.t-rod { position:absolute; left:calc(-10*var(--u)); right:calc(-10*var(--u)); height:calc(14*var(--u)); background:linear-gradient(#a3703f, #7a4c26 55%, #5a3618); border-radius:calc(7*var(--u)); z-index:3; box-shadow:0 2px 3px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,220,170,.4); }
.t-rod::before, .t-rod::after { content:""; position:absolute; top:calc(-3*var(--u)); width:calc(8*var(--u)); height:calc(20*var(--u)); background:#4a2c14; border-radius:calc(4*var(--u)); }
.t-rod::before { left:calc(-4*var(--u)); } .t-rod::after { right:calc(-4*var(--u)); }
.t-rod.t { top:0; } .t-rod.b { bottom:0; }
.t-sheet { position:absolute; left:calc(6*var(--u)); right:calc(6*var(--u)); top:calc(8*var(--u)); bottom:calc(8*var(--u)); padding:calc(22*var(--u)) calc(26*var(--u)) calc(16*var(--u)); display:flex; flex-direction:column; justify-content:center; gap:calc(11*var(--u));
  background:linear-gradient(90deg, rgba(0,0,0,.09), transparent 6%, transparent 94%, rgba(0,0,0,.09)), url(../assets/ui/ink/oldpaper.jpg) center / cover; }
.t-sheet::before { content:""; position:absolute; top:calc(6*var(--u));right:calc(6*var(--u));bottom:calc(6*var(--u));left:calc(6*var(--u)); border:1px solid rgba(40,34,22,.35); pointer-events:none; }
.t-sheet::after { content:""; position:absolute; top:calc(9*var(--u));right:calc(9*var(--u));bottom:calc(9*var(--u));left:calc(9*var(--u)); border:1px solid rgba(40,34,22,.14); pointer-events:none; }
.t-hd { text-align:center; font-size:calc(13*var(--u)); letter-spacing:calc(8*var(--u)); text-indent:calc(8*var(--u)); color:#7a6e58; margin-bottom:calc(2*var(--u)); }
.t-btn { position:relative; display:flex !important; flex-direction:column; align-items:center; justify-content:center; width:100% !important; margin:0 !important; height:calc(46*var(--u)); padding:0 !important; border:0 !important; border-radius:0 !important; cursor:pointer;
  color:#f4ecd8 !important; font-size:calc(22*var(--u)) !important; letter-spacing:calc(9*var(--u)) !important; text-indent:calc(9*var(--u)); text-shadow:0 1px 0 rgba(0,0,0,.4);
  background:url(../assets/ui/ink/stroke.webp) center / 100% 100% no-repeat !important; transition:transform .25s, filter .25s; }
.t-btn.pri { height:calc(54*var(--u)); font-size:calc(26*var(--u)) !important; }
.t-btn.pri::before { content:""; position:absolute; left:calc(-8*var(--u)); top:50%; border-left:calc(8*var(--u)) solid var(--zhu); border-top:calc(6*var(--u)) solid transparent; border-bottom:calc(6*var(--u)) solid transparent; transform:translateY(-50%); animation:t-nudge 1.4s ease-in-out infinite; }
@keyframes t-nudge { 50% { translate:calc(3*var(--u)) 0; } }
.t-btn span { font-family:var(--serif); font-size:calc(10*var(--u)); letter-spacing:2px; text-indent:2px; color:#d9cfb4; margin-top:1px; }
.t-btn:disabled { opacity:.5; filter:grayscale(.6); cursor:default; }
.t-btn:not(:disabled):hover { filter:brightness(1.3); transform:scale(1.03); }
.t-tools { display:flex; justify-content:center; padding-top:calc(4*var(--u)); }
.t-tools button { background:none; border:0; border-bottom:1px solid rgba(40,34,22,.35); padding:0 calc(6*var(--u)) 1px; font-family:var(--serif); font-size:calc(11*var(--u)); letter-spacing:2px; color:#6b624c; cursor:pointer; }
.t-term { left:calc(58*var(--u)); bottom:calc(16*var(--u)); font-family:var(--serif); font-size:calc(11*var(--u)); letter-spacing:4px; color:#f2e9d3; text-shadow:0 1px 3px rgba(0,0,0,.7); display:flex; gap:calc(12*var(--u)); align-items:center; }
.t-term i { width:5px; height:5px; background:var(--zhu); transform:rotate(45deg); }
.t-ver { right:calc(56*var(--u)); bottom:calc(16*var(--u)); font-family:var(--serif); font-size:calc(10*var(--u)); letter-spacing:2px; color:#e6dcc2; text-shadow:0 1px 3px rgba(0,0,0,.7); }

body:not(.playing) #fps { display:none !important; }