:root{--bg: #f5f5f7;--card: #ffffff;--ink: #1d1d1f;--sub: #6b7280;--line: #e5e7eb;--accent: #a58477;--accent-ink: #ffffff;--disabled: #f0f0f2}*{box-sizing:border-box}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Hiragino Sans,Yu Gothic,sans-serif;background:var(--bg);color:var(--ink)}.app{max-width:480px;margin:0 auto;padding:0 16px 40px}.topbar{position:sticky;top:0;background:var(--bg);padding:16px 0 8px;z-index:5}.brand{font-size:20px;font-weight:700;letter-spacing:.04em}.brand small{font-weight:500;color:var(--sub);margin-left:8px;font-size:13px}.ticket-line{font-size:13px;color:var(--sub);margin-top:4px}.ticket-line b{color:var(--accent);font-size:16px}.ticket-remain{font-size:15px}.ticket-remain b{color:var(--accent);font-size:22px}.ticket-detail{font-size:12px;color:var(--sub);margin-left:6px}.ticket-after{font-size:12px;color:var(--accent);white-space:nowrap}.tabs{display:flex;gap:8px;margin-top:10px}.tab{flex:1;padding:10px;border:1px solid var(--line);background:var(--card);border-radius:10px;font-size:15px;font-weight:600;color:var(--sub);cursor:pointer}.tab.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;margin-top:14px}.section-title{font-size:14px;font-weight:700;color:var(--sub);margin:6px 2px 10px}.dates{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px}.date{flex:0 0 auto;width:64px;padding:10px 0;text-align:center;border:1px solid var(--line);border-radius:12px;background:var(--card);cursor:pointer}.date.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.date .d{font-size:18px;font-weight:700}.date .w{font-size:12px;color:var(--sub)}.date.on .w{color:#f1e8e3}.slots{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.slot{padding:12px 0;text-align:center;border:1px solid var(--line);border-radius:10px;background:var(--card);font-size:15px;font-weight:600;cursor:pointer}.slot:disabled{background:var(--disabled);color:#c7c7cc;cursor:default}.slot.picked{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.empty{color:var(--sub);font-size:14px;padding:20px 0;text-align:center}.cart{position:sticky;bottom:0;background:var(--card);border-top:1px solid var(--line);margin:14px -16px 0;padding:12px 16px}.cart .list{font-size:14px;margin-bottom:8px}.cart .row{display:flex;justify-content:space-between;padding:2px 0}.cart .row button{border:none;background:none;color:#c0392b;font-size:13px;cursor:pointer}.namefield{display:flex;align-items:center;gap:10px;margin-bottom:10px}.namefield label{font-size:14px;font-weight:700;color:var(--sub);white-space:nowrap}.namefield input,.namefield select{flex:1;padding:10px 12px;font-size:16px;border:1px solid var(--line);border-radius:10px;outline:none;background:var(--card)}.namefield input:focus,.namefield select:focus{border-color:var(--accent)}.namefield-ok{padding:8px 14px;border:1px solid var(--accent);background:var(--accent);color:var(--accent-ink);border-radius:10px;font-size:14px;font-weight:700;cursor:pointer;white-space:nowrap}.namecompact{font-size:14px;color:var(--ink);margin-bottom:10px}.namecompact b{font-size:15px}.namecompact button{margin-left:10px;border:1px solid var(--line);background:var(--card);border-radius:8px;padding:4px 10px;font-size:12px;color:var(--sub);cursor:pointer}.btn{width:100%;padding:14px;border:none;border-radius:12px;background:var(--accent);color:var(--accent-ink);font-size:16px;font-weight:700;cursor:pointer}.btn:disabled{background:#c7c7cc;cursor:default}.booking-item{display:flex;justify-content:space-between;align-items:center;padding:12px 2px;border-bottom:1px solid var(--line)}.booking-item:last-child{border-bottom:none}.booking-item .when{font-size:15px;font-weight:600}.booking-item .cancel{border:1px solid var(--line);background:var(--card);border-radius:8px;padding:6px 12px;font-size:13px;color:#c0392b;cursor:pointer}.note{font-size:12px;color:var(--sub);margin-top:10px;line-height:1.6}.demo-banner{background:#fff7e6;border:1px solid #ffe2a8;color:#8a6d3b;font-size:12px;border-radius:10px;padding:8px 10px;margin-top:12px}.conn-warn{background:#fdecea;border:1px solid #f5c2bd;color:#a1362b;font-size:13px;line-height:1.6;border-radius:10px;padding:10px 12px;margin-top:12px}.modal-back{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;display:flex;align-items:center;justify-content:center;padding:20px;z-index:100}.modal{background:var(--card);border-radius:16px;padding:20px 18px 18px;width:100%;max-width:380px;box-shadow:0 10px 40px #00000040}.modal-title{font-size:17px;font-weight:700;margin-bottom:10px}.modal-msg{font-size:15px;line-height:1.7;color:var(--sub);white-space:pre-line;margin-bottom:18px}.modal-keep,.modal-danger{display:block;width:100%;border-radius:12px;font-size:16px;font-weight:700;padding:14px 12px;cursor:pointer}.modal-keep{background:var(--card);border:1px solid var(--line);color:var(--ink)}.modal-danger{margin-top:14px;background:#fff;border:1px solid #d9776c;color:#b3261e}.notice{background:#e9f6ec;border:1px solid #b6ddc0;color:#256b35;font-size:14px;line-height:1.6;border-radius:10px;padding:10px 12px;margin-top:12px}.date.off{opacity:.4;pointer-events:none}.done-when{font-size:19px;font-weight:700;margin:6px 0 14px}
