:root{--green:#0b4d33;--green-dk:#073a27;--tint:#eef4f0;--ink:#1b2420;--mute:#5d6a63;--line:#d9e0db;--warn:#b42318;
--font:"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic",Meiryo,sans-serif}
*{box-sizing:border-box}
html,body{margin:0;overflow-x:hidden}
body{font-family:var(--font);color:var(--ink);background:#f6f8f7;font-size:15px;line-height:1.6}
.top{display:flex;align-items:center;gap:12px;background:#fff;border-bottom:3px solid var(--green);padding:8px 16px}
.top-logo{height:36px;width:auto}
.top-title b{display:block;color:var(--green);font-size:17px;line-height:1.2}
.top-title small{color:var(--mute);font-size:12px}
.banner{margin:0;background:#fff7e0;border-bottom:1px solid #ecd9a0;padding:8px 16px;font-size:13px}
.layout{display:grid;grid-template-columns:minmax(0,480px) minmax(0,1fr);gap:20px;padding:16px;max-width:1400px;margin:0 auto}
.editor{min-width:0}
fieldset{background:#fff;border:1px solid var(--line);border-radius:8px;margin:0 0 14px;padding:12px 14px 14px;min-width:0}
legend{font-weight:700;color:var(--green);padding:0 6px}
label{display:block;font-size:12px;color:var(--mute);margin-top:8px}
input,select,textarea{display:block;width:100%;min-width:0;margin-top:3px;font:inherit;font-size:16px;color:var(--ink);
border:1px solid #bcc7c0;border-radius:6px;padding:8px 10px;background:#fff}
input:focus,select:focus,textarea:focus,button:focus-visible{outline:2px solid var(--green);outline-offset:1px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 10px}
.actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px}
.btn{font:inherit;font-size:14px;border:1px solid var(--green);background:#fff;color:var(--green);border-radius:6px;padding:9px 14px;cursor:pointer;min-height:40px}
.btn.primary{background:var(--green);color:#fff}
.btn.ghost{border-color:#bcc7c0;color:var(--mute)}
.btn.danger{color:var(--warn);border-color:#e3b3ae}
.toast{font-size:13px;color:var(--green);opacity:0;transition:opacity .2s}
.toast.on{opacity:1}
.line{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0 8px;border:1px solid var(--line);border-radius:6px;padding:8px 10px 10px;margin-bottom:10px;background:#fbfcfb}
.line.kind-discount{background:#fff6f5}.line.kind-extra{background:#f5f9ff}
.line-head{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center}
.tag{font-size:11px;background:var(--tint);color:var(--green);border-radius:4px;padding:1px 8px}
.del{font:inherit;font-size:12px;border:0;background:none;color:var(--warn);cursor:pointer;padding:6px 4px}
.f-name{grid-column:1/-1}
.f-qty{grid-column:1}.f-unit{grid-column:2}.f-price{grid-column:3}
.f-amt{grid-column:1/3;font-size:12px;color:var(--mute);margin-top:8px}.f-amt b{display:block;font-size:17px;color:var(--ink)}
.f-tax{grid-column:3;display:flex;align-items:center;gap:6px;margin-top:14px;color:var(--ink);font-size:14px}
.f-tax input{width:20px;height:20px;margin:0}
.row-add{display:flex;flex-wrap:wrap;gap:8px}
.hint{font-size:12px;color:var(--mute);margin:8px 0 0}
details summary{cursor:pointer;margin-top:10px;color:var(--green);font-size:14px}

.preview-wrap{min-width:0}
.pv-label{font-size:14px;color:var(--mute);margin:0 0 6px}
.paper{background:#fff;border:1px solid var(--line);box-shadow:0 2px 10px rgba(0,0,0,.06);padding:28px 30px;width:100%;max-width:210mm;font-size:13px;color:#111;overflow-wrap:anywhere}
.p-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;border-bottom:2px solid var(--green);padding-bottom:8px}
.p-head h1{margin:0;font-size:24px;letter-spacing:.3em;color:var(--green)}
.p-meta{text-align:right;font-size:12px}
.p-top{display:flex;justify-content:space-between;gap:16px;margin-top:14px}
.p-to{flex:1;min-width:0}.to-name{font-size:17px;font-weight:700;border-bottom:1px solid #333;padding-bottom:2px}
.to-addr{font-size:12px;margin-top:4px}.p-sub{margin-top:10px}.p-lead{margin:6px 0 0;font-size:12px}
.p-from{flex:0 0 46%;font-size:12px;min-width:0}.p-logo{height:34px;width:auto;display:block;margin-bottom:4px}
.p-total{display:flex;justify-content:space-between;align-items:baseline;background:var(--tint);border-top:2px solid var(--green);border-bottom:2px solid var(--green);margin:16px 0;padding:8px 12px}
.p-total b{font-size:22px}
.p-table,.p-sum{width:100%;border-collapse:collapse;table-layout:fixed}
.p-table th{background:var(--green);color:#fff;font-weight:600;padding:5px 6px;font-size:12px}
.p-table td{border-bottom:1px solid var(--line);padding:6px;vertical-align:top}
.c-no{width:8%;text-align:center}.c-qty{width:15%;text-align:right}.c-price{width:19%;text-align:right}.c-amt{width:20%;text-align:right}
.c-name{text-align:left}.p-table th.c-name{text-align:left}
.neg{color:var(--warn)}.k{color:var(--mute)}.empty{text-align:center;color:var(--mute)}
.p-table tr{break-inside:avoid}
.p-sum{width:55%;margin:10px 0 0 auto}.p-sum th{text-align:left;font-weight:400;padding:4px 6px}.p-sum td{text-align:right;padding:4px 6px}
.p-sum .grand th,.p-sum .grand td{font-weight:700;font-size:15px;border-top:2px solid #333}
.p-note{margin-top:18px;border:1px solid var(--line);padding:8px 10px;font-size:12px;break-inside:avoid}
.p-note p{margin:4px 0 0}

@media (max-width:900px){
 .layout{grid-template-columns:minmax(0,1fr);padding:12px}
 .paper{padding:16px 14px;font-size:12px}
 .p-head{flex-direction:column;align-items:flex-start}.p-meta{text-align:left}
 .p-head h1{font-size:20px}
 .p-top{flex-direction:column}.p-from{flex:1}
 .p-total b{font-size:18px}.p-sum{width:100%}
 .c-no{width:7%}.c-qty{width:16%}.c-price{width:21%}.c-amt{width:22%}
 .p-table td,.p-table th{padding:5px 3px;font-size:11px}
}
@media (max-width:420px){.grid2{grid-template-columns:1fr}}

@page{size:A4;margin:12mm}
@media print{
 body{background:#fff;font-size:12px}
 .top,.banner,.editor,.pv-label{display:none!important}
 .layout{display:block;padding:0;max-width:none}
 .paper{border:0;box-shadow:none;padding:0;max-width:none;font-size:12px}
 .p-head,.p-top,.p-total{flex-direction:row!important}
 .p-top{align-items:flex-start}.p-from{flex:0 0 46%!important}
 .p-head{align-items:flex-end!important}.p-meta{text-align:right!important}
 .p-total,.p-table th{-webkit-print-color-adjust:exact;print-color-adjust:exact}
 .p-sum{width:55%}
}
@media (min-width:901px){.preview-wrap{position:sticky;top:12px;align-self:start;max-height:calc(100vh - 24px);overflow:auto}}
@media print{.preview-wrap{position:static;max-height:none;overflow:visible}}

#seedIn{width:100%;font-family:ui-monospace,Menlo,monospace;font-size:12px}
.seed-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:8px}
.seed-msg{font-size:13px;color:var(--green)}
.seed-msg.ng{color:#b3261e;font-weight:600}

input.needs-attention{border-color:var(--warn);background:#fff6f5;box-shadow:0 0 0 1px var(--warn)}