:root { color-scheme: light; font-family: -apple-system, BlinkMacSystemFont, "Noto Sans TC", "PingFang TC", sans-serif; color: #22231f; background: #e7e4dc; }
* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; background: linear-gradient(145deg, #e5e2d9, #f4f1e9 48%, #ddd9ce); }
button, select, textarea, input { font: inherit; }
button { cursor: pointer; }
.app-shell { max-width: 620px; min-height: 100vh; margin: auto; padding: calc(24px + env(safe-area-inset-top)) 20px calc(32px + env(safe-area-inset-bottom)); }
header { padding: 10px 4px 20px; } .eyebrow { margin: 0 0 6px; color: #8f4c31; font-size: .78rem; font-weight: 700; letter-spacing: .08em; } h1, h2, p { margin-top: 0; } h1 { margin-bottom: 5px; font-size: 2rem; letter-spacing: .02em; } .subhead { margin: 0; color: #65645d; }
.tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; padding: 5px; margin-bottom: 18px; border-radius: 14px; background: #d9d6cd; }.tab { border: 0; border-radius: 10px; padding: 11px; background: transparent; color: #65645d; font-weight: 700; }.tab.is-active { background: #fffdf8; color: #22231f; box-shadow: 0 2px 7px #7773; }
.form-card, .extras, .admin-intro, .data-tools { background: #fffdf8; border: 1px solid #e1ddd4; border-radius: 18px; padding: 18px; box-shadow: 0 8px 25px #6661; }.form-card label, .data-tools label { display: block; margin: 0 0 7px; font-size: .86rem; font-weight: 700; }.form-card select, textarea { width: 100%; margin: 0 0 18px; border: 1px solid #c9c4ba; border-radius: 10px; padding: 12px; color: #22231f; background: #fff; } .form-card select:last-child { margin-bottom: 0; }
.segmented { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-bottom: 18px; }.choice { padding: 11px; border: 1px solid #c9c4ba; border-radius: 10px; color: #5f5e58; background: #fff; }.choice.is-selected { color: #fff; border-color: #8f4c31; background: #8f4c31; }.notice { margin: 0; color: #a3392a; font-size: .88rem; line-height: 1.45; }
.extras { margin-top: 16px; }.section-title { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }.section-title h2, .admin-intro h2 { margin-bottom: 3px; font-size: 1.05rem; }.section-title span, .hint, .admin-intro p, .data-tools p { color: #77756e; font-size: .82rem; }.extra-row { display: flex; align-items: center; justify-content: space-between; padding: 12px 0; border-top: 1px solid #ece8df; }.extra-row label { display: flex; align-items: center; gap: 10px; }.extra-row input { width: 19px; height: 19px; accent-color: #8f4c31; }.extra-row span { color: #8f4c31; font-weight: 700; }
.total-card { margin: 18px 0 12px; padding: 22px; border-radius: 18px; color: #fff; background: #293a35; box-shadow: 0 8px 25px #26332d4d; }.total-card span { font-size: .86rem; opacity: .75; }.total-card strong { display: block; margin: 3px 0 7px; font-size: 2.15rem; letter-spacing: .03em; }.total-card p { margin: 0; font-size: .9rem; opacity: .82; }.primary-button, .secondary-button, .text-button { border-radius: 12px; padding: 13px 16px; font-weight: 700; }.primary-button { width: 100%; border: 0; color: #fff; background: #8f4c31; }.secondary-button { border: 1px solid #8f4c31; background: #fffdf8; color: #8f4c31; }.text-button { border: 0; background: transparent; color: #a3392a; }.copy-status { min-height: 1.2em; margin: 10px 0 0; color: #406e5a; font-size: .85rem; text-align: center; }.hint { margin: 17px 4px 0; line-height: 1.5; text-align: center; }
.admin-intro { margin-bottom: 16px; }.admin-intro p { margin-bottom: 0; line-height: 1.45; }.price-paper { margin-bottom: 14px; padding: 16px; border: 1px solid #e1ddd4; border-radius: 16px; background: #fffdf8; }.paper-name-label { display: block; margin-bottom: 13px; color: #65645d; font-size: .76rem; }.paper-name-input { width: 100%; margin-top: 4px; border: 1px solid #c9c4ba; border-radius: 8px; padding: 10px; color: #22231f; background: #fff; font-weight: 700; }.price-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 7px; align-items: end; }.price-grid label { color: #65645d; font-size: .76rem; }.price-grid input { width: 100%; margin-top: 4px; border: 1px solid #c9c4ba; border-radius: 8px; padding: 9px; }.price-grid input:disabled { background: #efede7; }.data-tools { margin-top: 16px; }.data-tools summary { cursor: pointer; font-weight: 700; }.data-actions { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0; }.data-tools textarea { resize: vertical; margin-bottom: 10px; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .75rem; }
@media (max-width: 380px) { .app-shell { padding-left: 14px; padding-right: 14px; } .total-card strong { font-size: 1.9rem; } }
.admin-category { margin: 22px 0; }.admin-category > h3 { margin: 0 0 10px; color: #8f4c31; font-size: 1rem; }
#dynamic-fields > label { display: block; margin: 0 0 8px; font-size: .86rem; font-weight: 700; } #dynamic-fields input { width: 100%; margin: 4px 0 16px; border: 1px solid #c9c4ba; border-radius: 10px; padding: 12px; color: #22231f; background: #fff; } .check-list { margin: 4px 0 16px; } .field-title { margin: 14px 0 0; font-weight: 700; }
