.overlay{position:fixed;inset:0;background:#132b2b;z-index:30;overflow:auto}
.intro-art{position:absolute;inset:0;background-position:center;background-size:cover;image-rendering:pixelated;opacity:.8}
.intro-shade{position:absolute;inset:0;background:linear-gradient(90deg,#0a1b21fa 0%,#0c2328ed 28%,#10272b90 58%,#0e212650),linear-gradient(0deg,#081c22e8,transparent 60%)}
.intro-content{position:relative;max-width:600px;margin:10vh 0 80px 10vw}
.intro-kicker{color:#b8c7bc;margin-top:35px;font-size:13px;letter-spacing:3px}
.intro-content h2{font-family:"STSong","SimSun",serif;font-size:45px;font-weight:400;letter-spacing:13px;margin:10px 0 25px;color:#d3dfd6}
.intro-content h2 span{display:block;font-size:88px;line-height:1.2;color:#efd6a5;letter-spacing:18px;margin-top:8px;text-shadow:0 5px 35px #050f16}
.intro-content>p:not(.intro-kicker){color:#a9c1bb;font-size:13px;line-height:2.2;letter-spacing:1px}
.intro-tags{display:flex;gap:10px;margin:25px 0;color:#a9bcb4;font-size:10px}
.intro-tags span{padding:2px 9px;border:1px solid #445a52;background:#152c2c70}
.intro-content>small{display:block;color:#849c97;font-size:10px;margin-top:12px}
.intro-bottom{position:absolute;bottom:30px;left:10vw;right:7vw;display:flex;justify-content:space-between;color:#b1bda7;font-size:10px;letter-spacing:2px}
@media(max-width:850px){.intro-content{margin-left:7vw;margin-top:9vh}
.intro-content h2{font-size:33px}
.intro-content h2 span{font-size:65px}
.intro-bottom{left:7vw;right:7vw;font-size:8px}
.intro-bottom>span:last-child{display:none}}
@media(max-width:580px){.intro-content h2 span{font-size:56px}
.intro-content h2{font-size:30px}
.intro-tags{font-size:9px;gap:5px}
.intro-content{margin-top:8vh}
.intro-kicker{font-size:10px}
.intro-content>p:not(.intro-kicker){font-size:11px}}
.intro-preview{position:absolute;right:8vw;bottom:16vh;width:220px;display:grid;gap:10px;background:#10252bea;padding:20px;border:1px solid #6b7256;box-shadow:0 15px 50px #0005}
.intro-preview>span{font-size:11px;color:var(--gold);letter-spacing:2px;margin-bottom:5px}
.intro-preview button{padding:12px 10px;font-size:12px;text-align:left}
@media(max-width:850px){.intro-preview{right:5vw;width:190px;bottom:12vh}}
@media(max-width:580px){.intro-preview{position:relative;right:auto;bottom:auto;width:auto;margin:20px 7vw 70px;grid-template-columns:1fr 1fr;padding:12px}
.intro-preview>span{grid-column:1/-1}
.overlay#intro{overflow:auto}
.intro-preview button{padding:8px;font-size:10px}
.intro-bottom{position:fixed;background:#10252b;padding:5px}
.intro-content{margin-top:4vh}}
.pixel-art{ image-rendering:pixelated; object-fit:contain; pointer-events:none; }
.overlay{ padding:0 5vw; background:#101916; }
.intro-top{ height:90px; display:flex; align-items:center; gap:35px; max-width:1520px; margin:auto; border-bottom:1px solid #75684455; }
.intro-top-caption{ padding-left:30px; border-left:1px solid #665c3a; font-family:var(--serif); letter-spacing:3px; font-size:12px; color:#96a28d; }
.intro-stage{ position:relative; max-width:1520px; margin:0 auto; min-height:570px; height:calc(100vh - 290px); max-height:780px; border-bottom:1px solid #75684455; isolation:isolate; }
.intro-art{ inset:0 -5vw 0 21%; opacity:1; background-position:68% center; background-size:cover; }
.intro-shade{ inset:0 -5vw 0 -5vw; background:linear-gradient(90deg,#101916 3%,#101916f7 23%,#101916c4 35%,#10191636 55%,#10191608 80%),linear-gradient(0deg,#101916 0%,#10191600 28%,#10191600 80%,#10191640); }
.intro-stage:after{ content:""; position:absolute; inset:0; z-index:2; pointer-events:none; border-right:1px solid #b2934d22; }
.intro-content{ margin:0; max-width:560px; padding:44px 0 28px 30px; position:relative; z-index:3; }
.intro-content>.eyebrow{ display:flex; align-items:center; gap:13px; font-size:9px; }
.intro-content>.eyebrow i{ width:25px; height:1px; background:#8f784a; }
.intro-kicker{ font-family:var(--serif); color:#c0c7af; font-size:13px; letter-spacing:3px; margin-top:28px; }
.intro-content h2{ font-family:var(--serif); font-size:31px; line-height:1.2; letter-spacing:10px; margin:16px 0 22px; color:#d0d5c3; font-weight:400; }
.intro-content h2>span{ display:block; font-size:83px; line-height:1.25; color:#eddbb3; letter-spacing:10px; margin-top:7px; text-shadow:0 4px 35px #0005; }
.intro-content h2 .title-period{ display:inline; font-size:48px; letter-spacing:0; color:#bba16a; margin-left:-9px; }
.intro-content>.intro-story{ font-size:12px; line-height:2.15; color:#aebca9; letter-spacing:1.5px; }
.intro-tags{ display:flex; gap:13px; margin:21px 0; font-size:10px; color:#b7bea3; letter-spacing:2px; }
.intro-tags span{ border:0; padding:0; background:none; }
.intro-tags b{ font-weight:400; color:#907e51; }
.intro-content>small{ font-size:9px; color:#8f9c87; letter-spacing:.5px; margin-top:13px; }
.intro-chapter-mark{ position:absolute; right:27px; top:33px; writing-mode:vertical-rl; display:flex; align-items:center; gap:15px; color:#d4d0ae; letter-spacing:6px; font:12px var(--serif); z-index:3; text-shadow:0 2px 6px #000; }
.intro-chapter-mark span{ display:grid; place-items:center; width:32px; height:42px; border:1px solid #b19962; background:#24352988; font-size:21px; }
.scene-caption{ position:absolute; right:28px; bottom:27px; z-index:3; text-align:right; color:#d1cfb6; font:12px var(--serif); letter-spacing:3px; }
.scene-caption small{ display:block; font:8px Georgia,serif; color:#a0ad91; margin-top:9px; letter-spacing:2px; }
.intro-experiences{ display:grid; grid-template-columns:290px minmax(0,1fr); gap:32px; max-width:1520px; margin:auto; padding:28px 0 23px; align-items:center; }
.intro-preview{ position:static; width:auto; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; padding:0; background:transparent; border:0; box-shadow:none; margin:0; }
.intro-preview button{ padding:20px 15px; min-height:92px; display:flex; gap:12px; align-items:center; border:1px solid #77704d66; background:linear-gradient(120deg,#29332588,#17221b); text-align:left; position:relative; }
.intro-preview button:hover{ background:#34412e; border-color:#b3a06a; }
.intro-preview button:before{ content:""; position:absolute; width:16px; height:1px; top:-1px; left:12px; background:#ba9b60; }
.intro-preview b{ display:block; font:17px var(--serif); color:#ddd9bc; letter-spacing:2px; white-space:nowrap; }
.intro-preview small{ display:block; font-size:9px; color:#94a28b; margin-top:9px; white-space:nowrap; }
.intro-bottom{ position:static; max-width:1520px; margin:auto; min-height:58px; border-top:1px solid #75684444; display:flex; align-items:center; justify-content:space-between; gap:20px; font-size:9px; letter-spacing:1px; color:#8d9c83; }
.intro-bottom>span:first-child{ font-family:var(--serif); font-size:12px; letter-spacing:3px; }
.intro-bottom i{ font-style:normal; margin:0 9px; color:#536049; }
.intro-bottom kbd{ border:0; padding:0; background:none; color:#b9bda4; font-size:9px; }
@keyframes lantern-breathe{ 50% { filter:drop-shadow(0 0 18px #dba85566); transform:translateY(-4px); } }
@media(min-width:1550px){.intro-content{ padding-top:60px; }
.intro-content h2>span{ font-size:96px; }
.intro-content h2{ margin-bottom:27px; }
.intro-tags{ margin:26px 0; }}
@media(max-width:1200px){.intro-experiences{ grid-template-columns:220px minmax(0,1fr); gap:20px; }
.intro-preview{ gap:9px; }
.intro-preview button{ padding:17px 11px; gap:9px; }
.intro-preview small{ font-size:8px; }}
@media(max-width:950px){.intro-top-caption{ display:none; }
.intro-content{ padding-left:6px; }
.intro-art{ left:10%; background-position:57% center; }
.intro-experiences{ grid-template-columns:1fr; gap:18px; padding:22px 0; }
.intro-preview button{ padding:17px; }
.intro-preview small{ font-size:9px; }
.intro-bottom{ font-size:8px; }
.intro-bottom i{ margin:0 4px; }}
@media(max-width:850px){.intro-content h2>span{ font-size:72px; }
.intro-content h2{ font-size:30px; }
.intro-bottom>span:last-child{ display:block; }
.intro-top{ height:82px; }}
@media(max-width:600px){.overlay{ padding:0 22px; }
.intro-top{ height:80px; gap:8px; }
.intro-top .brand{ min-width:0; gap:6px; }
.intro-top .brand-mark{ width:34px; height:44px; }
.intro-top .brand strong{ font-size:19px; letter-spacing:3px; }
.intro-top .brand small{ font-size:8px; letter-spacing:2px; }
.intro-stage{ min-height:620px; height:auto; max-height:none; }
.intro-art{ inset:0 -22px; background-position:61% 45%; }
.intro-shade{ inset:0 -22px; background:linear-gradient(90deg,#101916f2,#101916af 65%,#10191633),linear-gradient(0deg,#101916,transparent 50%); }
.intro-content{ padding:36px 0 100px; max-width:100%; }
.intro-content>.eyebrow{ font-size:8px; gap:8px; letter-spacing:1.8px; }
.intro-content>.eyebrow i{ width:16px; }
.intro-kicker{ font-size:11px; letter-spacing:2px; margin-top:32px; }
.intro-content h2{ font-size:30px; margin:18px 0 23px; }
.intro-content h2>span{ font-size:64px; letter-spacing:7px; }
.intro-content h2 .title-period{ font-size:35px; }
.intro-content>.intro-story{ font-size:11px; line-height:2.1; }
.intro-tags{ font-size:9px; gap:9px; margin:24px 0; }
.intro-chapter-mark{ display:none; }
.scene-caption{ left:0; right:auto; bottom:28px; text-align:left; font-size:10px; }
.scene-caption small{ font-size:7px; }
.intro-preview{ grid-template-columns:1fr; gap:12px; }
.intro-preview button{ padding:17px 18px; min-height:78px; }
.intro-preview b{ font-size:18px; }
.intro-preview small{ font-size:10px; margin-top:6px; }
.intro-bottom{ position:static; background:none; display:block; padding:18px 0; }
.intro-bottom>span{ display:block; }
.intro-bottom>span:last-child{ margin-top:14px; line-height:2; }}
.energy-potion .pixel-art{ filter:hue-rotate(165deg) saturate(1.3); }
.intro-behavior{ max-width:480px; margin:18px 0 12px; }
.intro-behavior .behavior-options small{ display:none; }
.intro-behavior .behavior-options button{ padding:9px 10px; }
.intro-behavior .behavior-note{ color:#b5bca9; }
#intro .intro-stage{ height:auto; min-height:650px; max-height:none; }
#intro .intro-content{ padding-top:32px; padding-bottom:36px; }
#intro .intro-content h2{ margin-top:12px; margin-bottom:14px; }
#intro .intro-tags{ margin:16px 0; }
@media(max-width:600px){#intro .intro-content{ padding-top:25px; padding-bottom:80px; }
#intro .intro-stage{ min-height:650px; }
.intro-behavior .behavior-options button{ padding:8px 6px; }
.intro-behavior{ margin-top:16px; }}
#intro{ --page-title:84px; --page-copy:490px; --page-height:700px; --page-image:64%; --page-gap:44px; background:#0c1c1e; padding:0 5vw; }
#intro .intro-top{ position:relative; height:94px; border:0; z-index:5; gap:25px; }
#intro .intro-top .brand strong{ font-family:var(--serif); color:#e9d6ae; letter-spacing:6px; }
#intro .intro-top-caption{ border:0; padding:0; color:#9aa99c; font-size:11px; }
#intro .edition{ font-size:9px; color:#a4b7ac; letter-spacing:1px; }
#intro #site-layout-open{ margin-left:6px; padding:8px 13px; color:#d6c5a0; background:#17312bbd; border:1px solid #9e8f6055; border-radius:15px 2px; font-size:11px; white-space:nowrap; }
#intro .intro-stage{ min-height:var(--page-height); max-height:none; height:auto; border:0; margin-bottom:20px; }
#intro .intro-stage:after{ border:0; inset:28px 1% 16px 35%; border-top:1px solid #b8ac6b44; border-bottom:1px solid #b8ac6b33; transform:rotate(-2deg); }
#intro .intro-art{ inset:8px -2vw 20px 28%; background-position:var(--page-image) center; opacity:1; border-radius:44% 3% 17% 3%; clip-path:polygon(7% 0,95% 3%,100% 18%,97% 69%,100% 93%,88% 100%,2% 95%,0 30%); filter:saturate(.82); }
#intro .intro-shade{ inset:0 -5vw; background:linear-gradient(90deg,#0c1c1e 2%,#0c1c1ef5 24%,#0c1c1eb8 39%,#0c1c1e22 65%),linear-gradient(0deg,#0c1c1e,transparent 26%,transparent 80%,#0c1c1e70); }
#intro .intro-content{ width:var(--page-copy); max-width:100%; margin:0; padding:57px 0 68px 24px; }
#intro .intro-content>.eyebrow{ color:#a59568; letter-spacing:4px; font-size:9px; }
#intro .intro-kicker{ margin-top:30px; color:#bcc7ae; letter-spacing:3px; font-size:12px; }
#intro .intro-content h2{ font-size:28px; margin:22px 0 21px; letter-spacing:12px; }
#intro .intro-content h2>span{ font-size:var(--page-title); line-height:1.25; letter-spacing:10px; color:#e5cca2; text-shadow:0 7px 24px #0006; }
#intro .intro-content>.intro-story{ color:#acbbae; font-size:12px; line-height:2.2; }
#intro .intro-tags{ color:#bfbf9e; margin:23px 0; font-size:10px; }
#intro .intro-behavior{ margin:28px 0 15px; }
#intro .behavior-options{ gap:12px; }
#intro .behavior-options button{ padding:8px 5px; text-align:center; border:0; border-bottom:1px solid #74896a66; background:transparent; border-radius:0; }
#intro .behavior-options button[aria-pressed=true]{ border-color:#c4a46a; background:linear-gradient(0deg,#c3a46b15,transparent); box-shadow:none; color:#e7d0a1; }
#intro .behavior-options button[aria-pressed=true]:after{ content:'◆'; top:auto; right:calc(50% - 3px); bottom:-7px; font-size:8px; background:#0c1c1e; padding:0 3px; }
#intro .behavior-options b{ font-size:11px; font-weight:400; }
#intro .behavior-note{ margin-top:14px; color:#819d91; font-size:9px; }
#intro .arena-try{ padding:5px 0; background:none; border:0; color:#c2b38c; font-size:11px; margin-bottom:10px; }
#intro #start-button{ display:flex; width:260px; max-width:100%; justify-content:space-between; padding:17px 23px; border:1px solid #b69c66; border-radius:22px 2px 22px 2px; color:#e8d6ab; background:linear-gradient(100deg,#3e5344,#1d3b32); box-shadow:0 6px 20px #0003; }
#intro #start-button:hover{ background:#49614a; }
#intro .intro-chapter-mark{ top:35px; right:28px; letter-spacing:5px; color:#c9c8a8; }
#intro .intro-chapter-mark span{ border-radius:3px; border:1px solid #b99159; color:#dec69b; background:#754b3044; transform:rotate(5deg); }
#intro .lantern-vignette{ bottom:115px; right:11%; transform:rotate(4deg); }
#intro .scene-caption{ right:9%; bottom:55px; }
#intro .intro-experiences{ display:block; padding:var(--page-gap) 24px 45px; position:relative; }
#intro .preview-heading{ display:block; max-width:400px; margin:0 0 16px; }
#intro .preview-heading h3{ color:#dbcfad; font:24px/1.8 var(--serif); letter-spacing:3px; }
#intro .preview-heading p{ color:#91a799; font-size:10px; }
#intro .intro-preview{ display:flex; align-items:start; justify-content:flex-end; gap:30px; width:85%; margin:0 0 0 auto; }
#intro .intro-preview button{ flex:1; min-width:0; min-height:115px; border:0; border-top:1px solid #8b956455; background:linear-gradient(135deg,#31504577,transparent); padding:22px 15px; border-radius:26px 2px 20px 2px; transform:rotate(-2deg); }
#intro .intro-preview button:nth-child(2){ margin-top:28px; transform:rotate(2deg); }
#intro .intro-preview button:nth-child(3){ margin-top:58px; transform:rotate(-1deg); }
#intro .intro-preview button:before{ display:none; }
#intro .intro-preview button:hover{ background:#3d594c; border-color:#c6b37b; }
#intro .intro-preview b{ color:#dcd0ad; font-size:18px; }
.intro-preview small{ color:#9cad9e; }
#intro .intro-preview .preview-number{ color:#8fa58c; font:italic 28px Georgia,serif; }
#intro .intro-bottom{ border:0; padding:18px 24px 30px; color:#8ca295; }
#intro[data-page-side=right] .intro-content{ margin-left:auto; padding-left:0; padding-right:24px; }
#intro[data-page-side=right] .intro-art{ left:-2vw; right:28%; }
#intro[data-page-side=right] .intro-shade{ background:linear-gradient(270deg,#0c1c1e 2%,#0c1c1ef5 24%,#0c1c1eb8 39%,#0c1c1e22 65%),linear-gradient(0deg,#0c1c1e,transparent 26%); }
#intro[data-page-side=right] .intro-chapter-mark{ left:28px; right:auto; }
#intro[data-page-side=right] .lantern-vignette{ left:11%; right:auto; }
#intro[data-page-side=right] .scene-caption{ left:9%; right:auto; text-align:left; }
#intro[data-page-flow=compact] .intro-preview{ width:100%; gap:18px; }
#intro[data-page-flow=compact] .intro-preview button{ margin-top:0; transform:none; }
#intro .site-editor{ position:fixed; z-index:100; right:20px; top:90px; width:292px; max-height:calc(100dvh - 110px); overflow:auto; padding:22px; border:1px solid #a58f6266; border-radius:22px 2px; background:#112721f5; box-shadow:0 18px 70px #000a; color:#ddceb0; font:12px/1.8 "Microsoft YaHei",sans-serif; }
#intro .site-editor h2{ font:21px var(--serif); letter-spacing:3px; margin:0 0 9px; }
#intro .site-editor p{ font-size:10px; color:#9ab3a2; margin:6px 0 15px; }
#intro .site-editor label{ display:block; margin:12px 0; }
#intro .site-editor select{ width:100%; color:#ddceb0; background:#0b1d19; border:1px solid #6e8061; padding:7px; font-size:11px; border-radius:3px; }
#intro .site-editor input[type=range]{ display:block; width:100%; accent-color:#c6ac78; }
#intro .site-editor output{ float:right; color:#bba16e; }
#intro .site-editor-actions{ display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
#intro .site-editor button{ padding:8px 12px; border:1px solid #86916b66; border-radius:10px 2px; background:#2e493a; font-size:11px; color:#e7d5ad; }
#intro .site-editor #site-save{ background:#c5aa75; color:#18342a; }
#intro .site-editor-status{ min-height:20px; font-size:10px; color:#d6ba86; }
#intro .site-editor.folded .site-editor-body{ display:none; }
#intro .site-editor header{ display:flex; align-items:center; justify-content:space-between; }
@media(max-width:1000px){#intro .intro-top-caption{ display:none; }
#intro .intro-content{ padding-left:0; }
#intro .intro-preview{ width:100%; gap:16px; }
#intro .intro-preview button{ padding:18px 10px; gap:9px; }
#intro .intro-preview b{ font-size:15px; }}
@media(max-width:600px){#intro{ padding:0 22px; }
#intro .intro-top{ height:84px; gap:6px; }
#intro .edition{ display:none; }
#intro #site-layout-open{ margin-left:auto; font-size:10px; padding:7px 9px; }
#intro .intro-top .brand strong{ font-size:18px; letter-spacing:3px; }
#intro .intro-stage{ min-height:700px; }
#intro .intro-content,#intro[data-page-side=right] .intro-content{ padding:38px 0 110px; width:100%; margin:0; }
#intro .intro-content h2>span{ font-size:clamp(46px,calc(var(--page-title)*.77),78px); letter-spacing:7px; }
#intro .intro-content>.eyebrow{ letter-spacing:2px; font-size:8px; }
#intro .intro-art,#intro[data-page-side=right] .intro-art{ inset:0 -22px; border-radius:0; opacity:.7; }
#intro .intro-shade,#intro[data-page-side=right] .intro-shade{ background:linear-gradient(90deg,#0c1c1eea,#0c1c1e90),linear-gradient(0deg,#0c1c1e,transparent 70%); }
#intro .intro-stage:after{ display:none; }
#intro .lantern-vignette,#intro[data-page-side=right] .lantern-vignette{ bottom:14px; right:0; left:auto; }
#intro .scene-caption,#intro[data-page-side=right] .scene-caption{ bottom:35px; right:auto; left:0; text-align:left; }
#intro .intro-experiences{ padding:24px 0 25px; }
#intro .preview-heading h3{ font-size:20px; }
#intro .intro-preview,#intro[data-page-flow=compact] .intro-preview{ display:flex; flex-direction:column; gap:16px; width:100%; padding:15px 6px; }
#intro .intro-preview button{ width:92%; min-height:90px; flex:none; padding:20px; }
#intro .intro-preview button:nth-child(2){ margin:0 0 0 auto; }
#intro .intro-preview button:nth-child(3){ margin:0; }
#intro .intro-bottom{ padding:15px 0 25px; }
#intro .site-editor{ top:auto; bottom:12px; right:12px; width:calc(100% - 24px); max-height:60dvh; padding:16px 20px; }}
@media(prefers-reduced-motion:reduce){#intro .lantern-vignette img{ animation:none; }}
#intro.title-screen{position:fixed;inset:0;display:block;padding:0;background:#111e2b;color:#f1dfb8;overflow:auto;font-family:'Microsoft YaHei',sans-serif;isolation:isolate}
#intro.title-screen[hidden]{display:none}
#intro .intro-art,#intro[data-page-side=right] .intro-art{position:fixed;inset:0;border-radius:0;clip-path:none;opacity:1;filter:none;background-size:cover;background-position:var(--page-image,64%) center;image-rendering:pixelated;z-index:-3}
#intro .intro-shade,#intro[data-page-side=right] .intro-shade{position:fixed;inset:0;z-index:-2;background:linear-gradient(90deg,#0c162bef 0%,#0d1b2bd9 17%,#101c2a95 35%,#121c290d 65%),linear-gradient(0deg,#0b1425cc,transparent 20%,transparent 85%,#101b2b50);pointer-events:none}
#intro .intro-top{position:relative;height:92px;margin:0 5.8vw;padding:0;border:0;display:flex;align-items:center;justify-content:space-between;z-index:3}
#intro .chapter-tab{font:15px 'SimSun',serif;letter-spacing:3px;color:#d8c7a5;display:flex;gap:14px;align-items:center}
#intro .chapter-tab b{font:25px EmberBrush,serif;color:#e1b77e;border:1px solid #b795635e;padding:5px 7px;background:#18233380;font-weight:400}
#intro #site-layout-open{background:#111c2880;border:1px solid #c3b08450;border-radius:0;padding:9px 15px;color:#e0cfb1;font:13px 'SimSun',serif;letter-spacing:2px}
#intro .intro-stage{min-height:calc(100svh - 170px);height:auto;max-height:none;border:0;margin:0;padding:0 7.5vw;position:relative;display:flex;align-items:center}
#intro .intro-stage:after{display:none}
#intro .intro-content,#intro[data-page-side=right] .intro-content{width:var(--page-copy,400px);max-width:90vw;padding:28px 0 48px;margin:0;position:relative;z-index:2}
#intro[data-page-side=right] .intro-content{margin-left:auto}
#intro .title-lockup{position:relative;width:340px;max-width:100%;padding:0 0 0 0}
#intro .title-lockup h2{font-family:EmberBrush,'KaiTi',serif;font-weight:400;font-size:clamp(90px,calc(var(--page-title,88px)*1.5),156px);line-height:.93;letter-spacing:0;margin:0;padding:0;color:#f4e5c6;transform:rotate(-4deg);text-shadow:2px 4px 0 #26313b,0 8px 22px #080c1599}
#intro .title-lockup h2>span{display:block;font:inherit;color:inherit;letter-spacing:0;line-height:.93;text-shadow:inherit}
#intro .title-lockup .title-second{margin:4px 0 0 60px}
#intro .title-lantern{position:absolute;right:-14px;top:-18px;width:72px;height:96px;object-fit:contain;filter:drop-shadow(0 0 12px #e8a34b32)}
#intro .title-seal{position:absolute;left:10px;bottom:12px;color:#efc8a3;background:#873f34;border:1px solid #ca8261;box-shadow:inset 0 0 0 3px #873f34,inset 0 0 0 4px #d89f7488;font:20px/1.05 EmberBrush,serif;padding:7px 5px;transform:rotate(-5deg)}
#intro .title-motto{font:17px/1.6 'KaiTi','SimSun',serif;letter-spacing:5px;color:#c6c1af;margin:28px 0 34px 12px}
#intro .title-menu{display:flex;flex-direction:column;align-items:stretch;gap:9px;width:320px;max-width:100%}
#intro .title-menu button{margin:0;min-height:48px;width:100%;display:flex;align-items:center;justify-content:space-between;text-align:left;padding:8px 23px;border:1px solid transparent;border-radius:0;background:transparent;color:#d5ccb8;font:27px EmberBrush,'KaiTi',serif;letter-spacing:2px;box-shadow:none;transition:color .15s,background .15s}
#intro .title-menu button:hover,#intro .title-menu button:focus-visible{color:#fff0c8;background:#d6ae6820;border-color:#b3946055;outline:1px solid #c8ab7560;outline-offset:3px}
#intro #start-button{min-height:60px;color:#ffedc3;background:linear-gradient(90deg,#b285412e,#b2854118 70%,transparent);border:0;border-top:1px solid #c9a56885;border-bottom:1px solid #c9a56860;position:relative;font-size:31px}
#intro #start-button:before{content:'◆';position:absolute;left:-10px;top:21px;font:12px serif;color:#edc57b;text-shadow:0 0 8px #dca75a}
#intro .title-menu #start-button{width:100%;max-width:none;border-radius:0;padding:12px 23px;gap:10px;white-space:nowrap}
#intro .title-menu .arena-try small{font:11px 'Microsoft YaHei',sans-serif;letter-spacing:0;color:#9ba9ab}
#intro .title-party{position:relative;width:320px;max-width:100%;margin:16px 0 10px;color:#b6c0b7;font-size:12px}
#intro .title-party summary{padding:10px 22px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;border-bottom:1px solid #b8ac8728;letter-spacing:3px}
#intro .title-party[open]{background:#101e2cef;border:1px solid #b1955a50}
#intro .intro-behavior{margin:0;padding:12px;border:0}
#intro .intro-behavior legend{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
#intro .behavior-options{gap:8px}
#intro .behavior-options button{padding:10px 2px;background:#1a2938;border:1px solid #9d8a633c;color:#a8b6bc;min-width:0;border-radius:0}
#intro .behavior-options button[aria-pressed=true]{background:#493e2c;border-color:#c2a26c;color:#f6dc9e}
#intro .behavior-options b{font:12px 'Microsoft YaHei',sans-serif}
#intro .behavior-options small,#intro .behavior-options button:after{display:none}
#intro .behavior-note{margin:12px 0 0;font-size:11px}
#intro #load-status{display:block;margin:14px 0 0 22px;color:#a6b0b2;font-size:11px;letter-spacing:1px}
#intro .scene-caption,#intro[data-page-side=right] .scene-caption{position:absolute;right:6vw;bottom:60px;left:auto;text-align:right;border:0;display:flex;flex-direction:column;gap:8px}
#intro .scene-caption>span{font:34px EmberBrush,'KaiTi',serif;color:#f4deaf;letter-spacing:5px;text-shadow:0 2px 5px #08131e}
#intro .scene-caption>small{font:12px 'SimSun',serif;color:#cbbf9f;letter-spacing:3px}
#intro .intro-bottom{height:78px;padding:0 5.8vw;display:flex;align-items:center;gap:32px;margin:0;border-top:1px solid #b09d6e30;background:#0d17267a;color:#a1acb0;font:12px 'Microsoft YaHei',sans-serif;letter-spacing:1px;position:relative;z-index:4}
#intro .title-keys{margin-left:auto;font-size:11px}
#intro .title-previews{position:relative}
#intro .title-previews summary{cursor:pointer;padding:10px;color:#dbc8a2;list-style:none}
#intro .title-previews summary span{margin-left:22px}
#intro .intro-preview,#intro[data-page-flow=compact] .intro-preview{position:absolute;bottom:44px;left:0;width:300px;display:flex;flex-direction:column;gap:0;padding:10px;background:#111f2cf5;border:1px solid #b29868;box-shadow:0 8px 24px #0006}
#intro .intro-preview button,#intro .intro-preview button:nth-child(n){width:100%;padding:15px 12px;margin:0;min-height:0;border:0;border-bottom:1px solid #b2986833;border-radius:0;background:transparent;display:flex;align-items:center;justify-content:space-between;transform:none}
#intro .intro-preview b{font:24px EmberBrush,serif;color:#ecd7ac}
#intro .intro-preview small{font-size:11px;color:#a7b5ba}
#intro .site-editor{z-index:10}
#intro.title-screen{overflow-x:hidden}
#intro .intro-bottom{left:auto;right:auto;bottom:auto;width:100%;max-width:none;justify-content:flex-start;flex-wrap:nowrap;box-sizing:border-box}
#intro .title-previews:not([open]) .intro-preview{display:none}
#intro[data-page-side=right] .intro-shade{background:linear-gradient(270deg,#0c162bef 0%,#0d1b2bd9 17%,#101c2a95 35%,#121c290d 65%),linear-gradient(0deg,#0b1425cc,transparent 25%)}
#intro[data-page-side=right] .scene-caption{right:auto;left:6vw;text-align:left}
@media(min-height:1000px) and (min-width:800px){#intro .intro-content{padding-bottom:60px}
#intro .title-motto{margin-top:40px;margin-bottom:44px}
#intro .title-menu{gap:15px}}
@media(max-width:760px){#intro .intro-top{height:72px;margin:0 6vw}
#intro .intro-stage{padding:0 9vw;min-height:calc(100svh - 140px)}
#intro .intro-content{padding:30px 0;width:340px}
#intro .title-lockup{width:270px}
#intro .title-lockup h2{font-size:100px}
#intro .title-lantern{width:55px;height:74px;right:-5px}
#intro .title-motto{font-size:14px;letter-spacing:3px;margin:24px 0}
#intro .title-menu{width:290px}
#intro .scene-caption{display:none}
#intro .intro-bottom{height:68px;padding:0 6vw;gap:15px;font-size:10px}
#intro .title-keys{display:none}
#intro .intro-art{background-position:62% center}
#intro .intro-shade{background:linear-gradient(90deg,#0b172be8,#0c182bc5 40%,#0c182b55),linear-gradient(0deg,#0b172b,transparent 35%)}
#intro .intro-preview{left:auto;right:-10vw;width:270px}}
@media(max-height:740px) and (min-width:761px){#intro .intro-top{height:60px}
#intro .intro-stage{min-height:calc(100svh - 116px)}
#intro .intro-content{padding:12px 0 20px}
#intro .title-lockup{width:270px}
#intro .title-lockup h2{font-size:88px}
#intro .title-motto{margin:18px 0 18px;font-size:14px}
#intro .title-lantern{width:54px;height:72px}
#intro .title-menu button{min-height:36px;font-size:23px}
#intro #start-button{min-height:48px;font-size:27px}
#intro #start-button:before{top:17px}
#intro .title-party{margin:6px 0}
#intro #load-status{margin-top:6px}
#intro .intro-bottom{height:56px}}
@media(prefers-reduced-motion:reduce){#intro *{animation:none!important;transition:none!important}}
@media(max-width:760px){#intro .title-previews{margin-left:auto}
#intro .intro-preview,#intro[data-page-flow=compact] .intro-preview{left:auto;right:0}
#intro .chapter-tab{font-size:12px;letter-spacing:1px;gap:8px}
#intro #site-layout-open{font-size:11px;padding:8px 10px}}
.guide-intro small{color:#a8b9a8;font-size:10px;letter-spacing:2px}
.guide-intro h3{font-size:26px;color:var(--guide-color);margin:10px 0}
.guide-intro h3 span{font-size:12px;color:#c5cdb9;display:inline-block;margin-left:14px}
.guide-intro p{margin:8px 0;color:#c5d0c7}
#game-root :is(h1,h2,h3,h4),#game-root :is(h1,h2,h3,h4)>span,#game-root #intro.title-screen :is(h1,h2,h3),#game-root .deck-caption,#game-root #gear-name h3{font-family:var(--lantern-art)!important;font-weight:400;letter-spacing:.06em}
#game-root #hero-guide-modal :is(.guide-intro h3 span,.guide-skill>div>span,.guide-identity>span,.guide-milestones li>b){color:#8d6447}