💻 代码预览 · 小草剧本杀

1<!DOCTYPE html><html lang="zh-CN"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"><title>剧本详情 · 小草剧本杀</title><link rel="stylesheet" href="style.css"></head><body>
2<div class="header"><span class="back" onclick="history.back()">‹</span><h1>剧本详情</h1><span class="right">⭐</span></div>
3<div class="detail-hero" id="d-hero">🕵️</div>
4<div class="detail-info">
5  <div class="di-name" id="d-name">雾都迷案</div>
6  <div class="di-meta" id="d-meta"></div>
7  <div class="di-desc" id="d-desc"></div>
8</div>
9<div class="card">
10  <div class="section-title" style="margin:0 0 8px">剧本信息</div>
11  <div id="d-info"></div>
12</div>
13<div class="card">
14  <div class="section-title" style="margin:0 0 8px">可选角色 <span>到店随机/自选</span></div>
15  <div class="role-row" id="role-list"></div>
16</div>
17<div class="card">
18  <div class="section-title" style="margin:0 0 8px">可选DM <span>金牌主持</span></div>
19  <div id="dm-list"></div>
20</div>
21<div style="height:90px"></div>
22<div style="position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:430px;background:#241014;display:flex;gap:10px;padding:10px 12px;border-top:1px solid #3a1a24;z-index:99">
23  <button class="btn btn-outline" style="flex:1" onclick="toast('已收藏该剧本')">⭐ 收藏</button>
24  <button class="btn btn-gold" style="flex:1" onclick="location.href='join.html'">🚗 拼车</button>
25  <button class="btn btn-primary" style="flex:1" onclick="bookScript()">立即预约</button>
26</div>
27<script src="data.js"></script><script src="app.js"></script>
28<script>renderDetail();</script>
29</body></html>