:root { --ink:#18332b; --leaf:#35634b; --paper:#fffdf8; --cream:#f2eee4; --line:#253b34; --muted:#52635d; --accent:#d7a43c; font-family: Georgia, "Times New Roman", serif; color:var(--ink); background:var(--paper); }
* { box-sizing:border-box; }
body { margin:0; line-height:1.5; }
a { color:#174f3b; text-underline-offset:3px; }
button, input, textarea { font:inherit; }
button { cursor:pointer; border:1px solid var(--ink); border-radius:2px; background:var(--ink); color:white; padding:.65rem 1rem; font-weight:bold; }
button:hover { background:#285442; }
button.secondary { background:transparent; color:var(--ink); }
button.secondary:hover { background:#e5eadf; }
button.remove { padding:.38rem .6rem; font-size:.9rem; }
.site-header { display:flex; justify-content:space-between; gap:1rem; align-items:center; padding:1rem max(1.25rem, calc((100% - 1050px)/2)); border-bottom:1px solid #d9ded5; font-family:Arial, sans-serif; }
.brand { color:var(--ink); font-weight:bold; text-decoration:none; }
nav { display:flex; flex-wrap:wrap; gap:1rem; font-size:.9rem; }
main, footer { max-width:1050px; margin:auto; padding-left:1.25rem; padding-right:1.25rem; }
.intro { max-width:700px; padding:4rem 0 2.5rem; }
.eyebrow, .step { font:700 .76rem/1.2 Arial, sans-serif; letter-spacing:.12em; color:var(--leaf); text-transform:uppercase; }
h1 { margin:.25rem 0 .7rem; font-size:clamp(2.2rem, 6vw, 4.2rem); line-height:1; letter-spacing:-.04em; }
h2 { margin:.15rem 0 .6rem; font-size:1.55rem; line-height:1.1; }
.builder, .settings, .how-it-works { border-top:1px solid #cad3ca; padding:1.8rem 0; }
.section-heading, .actions { display:flex; gap:1rem; align-items:start; justify-content:space-between; }
.hint, .optional { color:var(--muted); font: .9rem Arial, sans-serif; }
.table-wrap { overflow-x:auto; }
table { width:100%; min-width:690px; border-collapse:collapse; font-family:Arial, sans-serif; }
th { text-align:left; font-size:.82rem; font-weight:normal; color:var(--muted); }
th, td { padding:.4rem .25rem; border-bottom:1px solid #dde2dc; vertical-align:top; }
input[type="text"], input[type="number"], textarea { width:100%; border:1px solid #9aa89d; border-radius:2px; padding:.48rem; background:white; color:var(--ink); }
input:focus, textarea:focus, button:focus, summary:focus { outline:3px solid #e6bc64; outline-offset:2px; }
td.name { min-width:190px; } td.note { min-width:180px; } td.year { width:115px; } td.qty { width:92px; }
.paste-box { margin-top:1.5rem; padding:1rem; background:var(--cream); font-family:Arial, sans-serif; }
.paste-box summary { cursor:pointer; font-weight:bold; } .paste-box textarea { display:block; max-width:680px; margin:.6rem 0; }
fieldset { display:flex; gap:1rem; border:0; padding:0; font-family:Arial, sans-serif; } legend { font-weight:bold; margin-bottom:.5rem; }
.actions { align-items:center; padding:1.8rem 0 .8rem; border-top:3px solid var(--ink); }
.messages:empty { display:none; }.messages { margin-bottom:1rem; padding:.8rem 1rem; background:#f7e5df; border-left:4px solid #a53e28; font-family:Arial, sans-serif; }.count { font-family:Arial, sans-serif; font-weight:bold; }
.print-output { display:grid; grid-template-columns:repeat(auto-fit, minmax(290px, 1fr)); gap:1.5rem; padding-bottom:3rem; }
.sheet { --scale:1; position:relative; width:calc(var(--sheet-width) * var(--scale)); height:calc(var(--sheet-height) * var(--scale)); overflow:hidden; background:white; border:1px solid #b9c0b8; box-shadow:0 3px 12px #18332b22; font-family:Arial, sans-serif; }
.sheet-label { position:absolute; top:8px; left:10px; font-size:10px; color:#506158; }.packet { position:absolute; width:130mm; height:105mm; transform:scale(var(--scale)); transform-origin:top left; }
.packet.one { top:25mm; left:40mm; }.packet.two { top:142mm; left:40mm; }
.packet .outline { position:absolute; left:0; top:0; width:130mm; height:105mm; border:1.2px solid var(--line); clip-path:polygon(0 25mm, 10mm 25mm, 10mm 0, 70mm 0, 70mm 25mm, 130mm 25mm, 130mm 105mm, 0 105mm); }
.front, .back, .side-flap, .top-flap { position:absolute; border:0; overflow:hidden; }.front { left:10mm; top:25mm; width:60mm; height:80mm; padding:7mm 5mm; }.back { left:70mm; top:25mm; width:60mm; height:80mm; padding:7mm 5mm; }.side-flap { left:0; top:25mm; width:10mm; height:80mm; background:repeating-linear-gradient(135deg, transparent 0 2mm, #d6ddd5 2mm 2.5mm); }.top-flap { left:10mm; top:0; width:60mm; height:25mm; padding:6mm 5mm; text-align:center; }
.fold-v { position:absolute; top:25mm; height:80mm; border-left:1px dashed #53665c; }.fold-v.a { left:10mm; }.fold-v.b { left:70mm; }.fold-v.c { left:130mm; }.fold-h { position:absolute; left:10mm; top:25mm; width:60mm; border-top:1px dashed #53665c; }
.glue { position:absolute; left:1mm; top:58mm; width:8mm; font-size:2.9mm; line-height:1.1; text-align:center; color:#4b5e54; }.front .small, .back .small, .top-flap .small { margin:0; font-size:3.1mm; }.variety { margin:0 0 4mm; font-size:6.1mm; line-height:1.05; font-weight:bold; overflow-wrap:anywhere; }.note { margin:0; font-size:3.4mm; line-height:1.25; overflow-wrap:anywhere; }.year-label { margin:0 0 2mm; font-size:2.9mm; letter-spacing:.08em; color:#53665c; text-transform:uppercase; }.packet-mark { position:absolute; bottom:7mm; left:5mm; font:700 2.6mm Arial, sans-serif; letter-spacing:.09em; color:#53665c; }.fold-label { font-size:2.7mm; color:#53665c; }.top-flap .fold-label { position:absolute; bottom:2mm; left:0; width:100%; }
.measure { position:absolute; left:calc(50% - 25mm); bottom:12mm; width:50mm; height:5mm; border-bottom:1px solid #111; font-size:9px; text-align:center; color:#111; }.measure::before, .measure::after { content:""; position:absolute; bottom:-2px; height:5px; border-left:1px solid #111; }.measure::before { left:0; }.measure::after { right:0; }.sheet-note { position:absolute; bottom:4mm; left:0; width:100%; text-align:center; font-size:2.5mm; color:#42564b; }
.how-it-works { max-width:720px; }.how-it-works li { margin-bottom:.35rem; } footer { border-top:1px solid #d9ded5; padding-top:1.5rem; padding-bottom:2rem; color:var(--muted); font: .85rem Arial, sans-serif; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width:600px) { .site-header, .section-heading, .actions { align-items:flex-start; flex-direction:column; }.intro { padding-top:2.5rem; }.sheet { --scale:.72; } }
@page { size:A4 portrait; margin:0; }
@media print { body { background:#fff; }.site-header, .intro, .builder, .settings, .actions, .messages, .count, .how-it-works, footer { display:none !important; } main { max-width:none; margin:0; padding:0; }.print-output { display:block; padding:0; }.sheet { --scale:1; width:var(--sheet-width); height:var(--sheet-height); margin:0; border:0; box-shadow:none; break-after:page; page-break-after:always; }.sheet:last-child { break-after:auto; page-break-after:auto; }.sheet-label { display:none; } }