.play-page{background:radial-gradient(circle at 80% 4%, #8f3d2626, transparent 32rem), var(--ink);min-height:100vh}.play-topbar{z-index:30;position:sticky;top:0}.play-intro,.play-section,.play-loop,.play-dialogue{width:min(1180px,100% - 40px);margin:0 auto}.play-intro{grid-template-columns:minmax(0,1.1fr) minmax(280px,.65fr);align-items:center;gap:clamp(36px,8vw,100px);padding:clamp(64px,9vw,112px) 0 72px;display:grid}.play-intro h1{color:#f1dfc8;max-width:760px;margin:8px 0 20px;font-family:Noto Serif TC,serif;font-size:clamp(42px,6vw,72px);line-height:1.14}.play-intro p:not(.eyebrow){color:#ae9e8b;max-width:720px;font-size:17px;line-height:1.8}.play-intro figure{background:#151312;border:1px solid #5d4b3d;margin:0}.play-intro img{aspect-ratio:4/5;object-fit:cover;width:100%;display:block}.play-intro figcaption{color:#9c8c78;padding:12px 14px;font-size:11px;line-height:1.6}.play-section{padding:72px 0}.play-section>header{justify-content:space-between;align-items:end;gap:30px;margin-bottom:30px;display:flex}.play-section h2,.play-loop h2,.play-dialogue h2{color:#ead5b9;max-width:760px;font-size:clamp(28px,4vw,46px)}.play-path-grid{grid-template-columns:repeat(4,1fr);gap:10px;display:grid}.play-path{border:1px solid #4d443d;border-top:3px solid var(--tone,#8c6c49);background:linear-gradient(160deg, color-mix(in srgb, var(--tone,#8c6c49) 14%, #171514), #151312 58%);flex-direction:column;min-height:330px;padding:22px;display:flex}.play-path>div{justify-content:space-between;align-items:center;gap:10px;display:flex}.play-path>div>span{border:1px solid color-mix(in srgb, var(--tone,#8c6c49) 60%, #d8b988);color:#ead2ad;border-radius:50%;place-items:center;width:42px;height:42px;font-family:Noto Serif TC,serif;display:grid}.play-path small{color:#8f8274;letter-spacing:.08em;font-size:9px}.play-path h3{color:#e8d1b2;margin:28px 0 10px;font-size:22px;line-height:1.35}.play-path p{color:#9a8c7c;margin:0;font-size:12px;line-height:1.7}.play-path>a{color:#e1aa66;justify-content:space-between;gap:12px;margin-top:auto;padding-top:24px;font-size:12px;font-weight:800;text-decoration:none;display:flex}:is(.play-path>a:hover,.play-path>a:focus-visible){color:#ffd19a;text-underline-offset:5px;text-decoration:underline}.play-loop{border-block:1px solid #403a34;grid-template-columns:minmax(260px,.7fr) minmax(460px,1.3fr);gap:clamp(40px,8vw,100px);padding:88px 0;display:grid}.play-loop>div>p:last-child{color:#9e9080;line-height:1.75}.play-loop ol{gap:2px;margin:0;padding:0;list-style:none;display:grid}.play-loop li{border-top:1px solid #463e37;grid-template-columns:52px 1fr;gap:16px;padding:18px 0;display:grid}.play-loop li>span{color:#c8864c;letter-spacing:.1em;font-family:ui-monospace,monospace;font-size:10px}.play-loop strong{color:#dec7a9;font-size:16px}.play-loop li p{color:#918476;margin:3px 0 0;font-size:11px;line-height:1.65}.play-dialogue{padding:88px 0}.play-dialogue>header{margin-bottom:28px}.play-dialogue>div{background:#181513e6;border:1px solid #59493d;gap:1px;padding:22px;display:grid}.play-dialogue p{color:#ac9c88;background:#ffffff04;border-left:3px solid #6c5846;margin:0;padding:15px 16px;font-size:13px;line-height:1.75}.play-dialogue p:nth-child(2n){border-left-color:#647e66}.play-dialogue strong{color:#e2c6a2}.play-tools{padding-bottom:110px}.play-tools>div{grid-template-columns:repeat(2,1fr);gap:9px;display:grid}.play-tools>div>a{color:inherit;background:#171514;border:1px solid #4f453c;grid-template-columns:1fr auto;gap:4px 20px;padding:22px;text-decoration:none;display:grid}.play-tools small,.play-tools strong,.play-tools p{grid-column:1}.play-tools small{color:#ad7547;letter-spacing:.1em;font-size:8px;font-weight:800}.play-tools strong{color:#ddc6a7;font-size:17px}.play-tools p{color:#8f8375;margin:5px 0 0;font-size:11px;line-height:1.65}.play-tools a>span{color:#c88b52;grid-area:1/2/4;align-self:center;font-size:10px}:is(.play-tools a:hover,.play-tools a:focus-visible){background:#60351c33;border-color:#b37041;outline:none}@media (max-width:900px){.play-path-grid{grid-template-columns:repeat(2,1fr)}.play-intro,.play-loop{grid-template-columns:1fr}.play-intro figure{max-width:460px}}@media (max-width:620px){.play-intro,.play-section,.play-loop,.play-dialogue{width:min(100% - 24px,1180px)}.play-intro{padding-top:44px}.play-intro h1{font-size:40px}.play-path-grid,.play-tools>div{grid-template-columns:1fr}.play-path{min-height:280px}.play-section>header{display:block}}