.lrf-app { --lrf-ink:#193d36; --lrf-soft:#5d756d; --lrf-seal:#b3473f; --lrf-paper:#fffdf8; --lrf-line:#cad7ce; box-sizing:border-box; max-width:1420px; margin:28px auto; padding:0 18px; display:grid; grid-template-columns:minmax(345px,.72fr) minmax(0,1.28fr); gap:24px; color:#223630; font-family:"Noto Sans TC","Microsoft JhengHei",Arial,sans-serif; }
.lrf-app *, .lrf-app *::before, .lrf-app *::after { box-sizing:border-box; }
.lrf-app button, .lrf-app input, .lrf-app select { font:inherit; }
.lrf-app button { cursor:pointer; }
.lrf-editor { align-self:start; position:sticky; top:18px; overflow:hidden; border:1px solid rgba(25,61,54,.22); background:rgba(255,253,248,.94); box-shadow:8px 10px 0 rgba(25,61,54,.08); }
.lrf-editor__header { padding:25px 25px 20px; color:#fff; background:var(--lrf-ink); }
.lrf-editor__header p { margin:0; color:#c7d8ce; font-size:12px; font-weight:700; letter-spacing:.15em; }
.lrf-editor__header h2 { margin:9px 0 0; color:#fff; font-family:Georgia,"Noto Serif TC",serif; font-size:27px; letter-spacing:.08em; }
.lrf-editor__header span { display:block; margin-top:7px; color:#dce9e3; font-size:12px; line-height:1.6; }
.lrf-form { padding:20px 25px 24px; }
.lrf-form__section { padding:17px 0 19px; border-bottom:1px solid var(--lrf-line); }
.lrf-form__section:last-of-type { border-bottom:0; }
.lrf-form__section h3 { display:flex; align-items:center; gap:8px; margin:0 0 14px; color:var(--lrf-ink); font-family:Georgia,"Noto Serif TC",serif; font-size:17px; letter-spacing:.05em; }
.lrf-form__section h3 i { display:grid; width:25px; height:25px; place-items:center; color:var(--lrf-seal); border:1px solid var(--lrf-seal); font-family:Arial,sans-serif; font-size:10px; font-style:normal; }
.lrf-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.lrf-full { grid-column:1 / -1; }
.lrf-app label { display:block; min-width:0; color:#63766f; font-size:12px; font-weight:700; letter-spacing:.03em; }
.lrf-app input { display:block; width:100%; margin-top:6px; padding:8px 3px 7px; color:var(--lrf-ink); border:0; border-bottom:2px solid #d6e2da; border-radius:0; background:transparent; font-size:14px; font-weight:600; outline:none; }
.lrf-app input:focus { border-bottom-color:var(--lrf-seal); box-shadow:none; }
.lrf-app input::placeholder { color:#aebbb3; font-weight:400; }
.lrf-option-row { display:grid; grid-template-columns:1fr 1fr; gap:7px; }
.lrf-option { min-height:39px; display:flex; align-items:center; justify-content:center; gap:5px; color:#597169; border:1px solid #cbd9d0; border-radius:0; background:#fbfdfb; font-size:13px; font-weight:700; transition:.16s ease; }
.lrf-option:hover { border-color:var(--lrf-ink); }
.lrf-option.is-selected { color:#fff; border-color:var(--lrf-ink); background:var(--lrf-ink); box-shadow:2px 2px 0 var(--lrf-seal); }
.lrf-option--unpaid.is-selected { border-color:#a06b45; background:#a06b45; box-shadow:2px 2px 0 #efd6c3; }
.lrf-memory-note { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-top:11px; color:#61756c; font-size:11px; line-height:1.55; }
.lrf-memory-note b { color:var(--lrf-ink); }
.lrf-small-button { padding:5px 7px; color:#4d665d; border:1px solid #afc2b7; border-radius:0; background:#fbfdfb; font-size:11px; font-weight:700; white-space:nowrap; }
.lrf-small-button:hover { color:#fff; border-color:var(--lrf-ink); background:var(--lrf-ink); }
.lrf-small-button:disabled { opacity:.45; cursor:not-allowed; }
.lrf-small-button--danger { color:#9b5149; border-color:#d9b4ac; }
.lrf-small-button--danger:hover { border-color:#9b5149; background:#9b5149; }
.lrf-recipient-memory { margin-top:14px; padding:12px; background:#eef4ef; border:1px dashed #a7bbaf; }
.lrf-recipient-memory__head { display:flex; align-items:baseline; justify-content:space-between; gap:8px; }
.lrf-recipient-memory__head b { color:var(--lrf-ink); font-size:12px; }
.lrf-recipient-memory__head span { color:#698077; font-size:10px; }
.lrf-recipient-memory__actions { display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:7px; margin-top:9px; }
.lrf-app select { min-width:0; padding:0 8px; color:var(--lrf-ink); border:1px solid #c1d2c7; border-radius:0; background:#fffdf8; font-size:12px; font-weight:600; }
.lrf-amount-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin-top:14px; }
.lrf-amount-summary div { min-width:0; padding:10px; background:#eef4ee; border:1px solid #d5e0d7; }
.lrf-amount-summary span { display:block; color:#697c74; font-size:11px; font-weight:700; }
.lrf-amount-summary b { display:block; margin-top:5px; color:var(--lrf-ink); font-size:14px; overflow-wrap:anywhere; }
.lrf-amount-summary__net { color:#fff; background:var(--lrf-ink)!important; border-color:var(--lrf-ink)!important; }
.lrf-amount-summary__net span, .lrf-amount-summary__net b { color:#fff!important; }
.lrf-privacy-note { display:flex; gap:9px; margin:3px 0 18px; padding:11px; color:#4e655d; background:#eef4ef; border:1px dashed #a9bdaf; font-size:12px; line-height:1.6; }
.lrf-privacy-note b { color:var(--lrf-ink); }
.lrf-actions { display:grid; grid-template-columns:1fr auto; gap:10px; }
.lrf-export { display:flex; align-items:center; justify-content:center; gap:7px; min-height:45px; color:#fff; border:1px solid var(--lrf-seal); border-radius:0; background:var(--lrf-seal); box-shadow:3px 3px 0 rgba(25,61,54,.35); font-weight:700; }
.lrf-reset { min-height:45px; padding:0 14px; color:var(--lrf-ink); border:1px solid #bdcdc4; border-radius:0; background:#fffdf8; font-weight:700; }
.lrf-export:disabled { opacity:.6; cursor:wait; }
.lrf-preview-pane { min-width:0; }
.lrf-preview-note { display:flex; justify-content:space-between; align-items:center; gap:12px; margin:0 0 11px; color:#5f7169; font-size:13px; }
.lrf-preview-note strong { color:var(--lrf-ink); }
.lrf-preview-frame { overflow:auto; padding:22px; background:rgba(255,253,248,.4); border:1px solid rgba(25,61,54,.15); }
.lrf-receipt { width:min(100%,794px); min-height:1123px; margin:auto; padding:50px 54px 44px; color:#193d36; background:#fffdf8; box-shadow:8px 11px 0 rgba(25,61,54,.09),0 18px 32px rgba(61,64,48,.1); }
.lrf-receipt__head { display:flex; justify-content:space-between; gap:28px; padding:0 0 24px; border-bottom:3px double #193d36; }
.lrf-receipt__head p { margin:0; color:#a74b43; font-size:11px; font-weight:700; letter-spacing:.18em; }
.lrf-receipt__head h2 { margin:8px 0 4px; color:#193d36; font-family:Georgia,"Noto Serif TC",serif; font-size:34px; letter-spacing:.13em; line-height:1.15; white-space:nowrap; writing-mode:horizontal-tb; text-orientation:mixed; }
.lrf-receipt__head > div:first-child > span { color:#718079; font-size:12px; }
.lrf-receipt__status { display:flex; min-width:174px; flex-direction:column; align-items:flex-end; gap:7px; text-align:right; }
.lrf-receipt__status b { padding:5px 9px; color:#a06b45; border:1px dashed currentColor; font-size:13px; letter-spacing:.08em; }
.lrf-receipt__status.is-paid b { color:#326e56; border-style:solid; }
.lrf-receipt__status span { color:#6f7d76; font-size:11px; white-space:nowrap; }
.lrf-receipt__section { padding:18px 0 16px; border-bottom:1px solid #cad7ce; }
.lrf-receipt__section h3 { display:flex; align-items:center; gap:9px; margin:0 0 13px; color:#193d36; font-family:Georgia,"Noto Serif TC",serif; font-size:17px; letter-spacing:.07em; }
.lrf-receipt__section h3 i { display:grid; width:25px; height:25px; place-items:center; color:#a74b43; border:1px solid #a74b43; font-family:Arial,sans-serif; font-size:10px; font-style:normal; }
.lrf-receipt-grid { display:grid; gap:11px 18px; }
.lrf-receipt-grid--two { grid-template-columns:1.5fr 1fr; }
.lrf-receipt-grid--three { grid-template-columns:repeat(3,1fr); }
.lrf-receipt-field { min-width:0; padding-bottom:7px; border-bottom:1px solid #d7e1da; }
.lrf-receipt-field--full { grid-column:1 / -1; }
.lrf-receipt-field span, .lrf-receipt-amounts span { display:block; margin-bottom:4px; color:#718078; font-size:10px; font-weight:700; letter-spacing:.03em; }
.lrf-receipt-field strong { display:block; color:#1d3731; font-size:13px; font-weight:600; line-height:1.45; overflow-wrap:anywhere; word-break:break-word; }
.lrf-service-field { margin-bottom:14px; }
.lrf-receipt-amounts { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.lrf-receipt-amounts div { padding:9px 11px; background:#f2f5ef; border:1px solid #d6e0d8; }
.lrf-receipt-amounts__net { background:#193d36!important; border-color:#193d36!important; }
.lrf-receipt-amounts__net span, .lrf-receipt-amounts__net strong { color:#fffdf8!important; }
.lrf-receipt-amounts strong { color:#1d3731; font-size:15px; }
.lrf-receipt__footer { display:grid; grid-template-columns:1.6fr 1fr; align-items:end; gap:24px; padding-top:20px; }
.lrf-receipt__footer p { margin:0; color:#5f7069; font-size:10px; line-height:1.65; }
.lrf-receipt__footer div { display:flex; flex-direction:column; align-items:flex-end; gap:11px; }
.lrf-receipt__footer span { color:#5f7069; font-size:11px; }
.lrf-receipt__footer i { display:block; width:155px; border-bottom:1px solid #708078; }
.lrf-toast { position:fixed; right:22px; bottom:22px; z-index:999999; max-width:340px; padding:13px 15px; color:#fff; background:var(--lrf-ink); box-shadow:0 12px 30px rgba(0,0,0,.2); font-size:13px; line-height:1.5; opacity:0; transform:translateY(10px); pointer-events:none; transition:.2s ease; }
.lrf-toast.is-visible { opacity:1; transform:translateY(0); }
@media (max-width:960px) { .lrf-app { grid-template-columns:1fr; } .lrf-editor { position:static; } }
@media (max-width:640px) { .lrf-app { margin:0 auto; padding:0; gap:0; } .lrf-editor { border:0; box-shadow:none; } .lrf-preview-pane { padding:16px; } .lrf-preview-frame { padding:8px; } .lrf-receipt { min-width:640px; transform:scale(.84); transform-origin:top left; margin-bottom:-180px; } .lrf-grid { grid-template-columns:1fr; } .lrf-full { grid-column:auto; } .lrf-amount-summary { grid-template-columns:1fr; } .lrf-memory-note, .lrf-recipient-memory__head { align-items:flex-start; flex-direction:column; } .lrf-recipient-memory__actions { grid-template-columns:1fr 1fr; } .lrf-recipient-memory__actions select { grid-column:1 / -1; min-height:36px; } }