:root{
  --ink:#1c1917;
  --paper:#faf7f2;
  --panel:#ffffff;
  --line:#e7e2d8;
  --accent:#e8462f;
  --accent2:#1a7a6c;
  --muted:#8a8378;
  --warn:#b5842a;
}
*{box-sizing:border-box;}
body{
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: var(--paper);
  color: var(--ink);
  margin:0;
}
.mono{ font-family: 'IBM Plex Mono','SFMono-Regular',Menlo,monospace; }
a{ color:inherit; text-decoration:none; }

.layout{ display:flex; height:100vh; overflow:hidden; }
.sidebar{ width:224px; flex-shrink:0; background:var(--ink); padding:20px 12px; display:flex; flex-direction:column; }
.brand{ display:flex; align-items:center; gap:10px; padding:0 8px; margin-bottom:28px; }
.brand-mark{ width:34px; height:34px; border-radius:3px; background: repeating-linear-gradient(135deg, var(--accent), var(--accent) 4px, var(--accent2) 4px, var(--accent2) 8px); flex-shrink:0; }
.brand-title{ color:#fff; font-weight:700; font-size:14px; line-height:1.2; }
.brand-sub{ color:#a19a8c; font-size:11px; }
.nav-item{ display:flex; align-items:center; gap:10px; padding:10px 14px; border-radius:6px; color:#d8d2c6; font-size:14px; border-left:2px solid transparent; }
.nav-item:hover{ background:#2a2622; }
.nav-item.active{ background:#2a2622; color:#fff; border-left:2px solid var(--accent); }
.sidebar-footer{ margin-top:auto; padding:0 8px; font-size:11px; color:#7d766a; line-height:1.5; }

.main{ flex:1; display:flex; flex-direction:column; overflow:hidden; }
.topbar{ border-bottom:1px solid var(--line); background:var(--panel); padding:16px 32px; display:flex; align-items:center; justify-content:space-between; }
.topbar h1{ font-size:18px; font-weight:700; margin:0; }
.date{ font-size:12px; color:var(--muted); }
.content{ flex:1; overflow-y:auto; }
.wrap{ max-width:1080px; margin:0 auto; padding:32px; }

.card{ background:var(--panel); border:1px solid var(--line); border-radius:10px; }
.p-4{padding:16px;} .p-5{padding:20px;} .p-6{padding:24px;} .p-3{padding:12px;}
.mb-2{margin-bottom:8px;} .mb-3{margin-bottom:12px;} .mb-4{margin-bottom:16px;} .mb-6{margin-bottom:24px;}
.mt-1{margin-top:4px;} .mt-2{margin-top:8px;} .mt-3{margin-top:12px;} .mt-4{margin-top:16px;} .mt-6{margin-top:24px;}
.flex{display:flex;} .items-center{align-items:center;} .items-end{align-items:flex-end;}
.justify-between{justify-content:space-between;} .justify-end{justify-content:flex-end;} .justify-center{justify-content:center;}
.gap-2{gap:8px;} .gap-3{gap:12px;} .gap-4{gap:16px;}
.grid{display:grid;} .grid-2{grid-template-columns:1fr 1fr;} .grid-3{grid-template-columns:1fr 1fr 1fr;} .grid-4{grid-template-columns:repeat(4,1fr);} .grid-5{grid-template-columns:repeat(5,1fr);}
.text-right{text-align:right;} .text-center{text-align:center;}
.text-xs{font-size:11px;} .text-sm{font-size:13px;} .text-lg{font-size:18px;} .text-2xl{font-size:26px;}
.font-bold{font-weight:700;} .font-semibold{font-weight:600;} .font-medium{font-weight:500;}
.muted{color:var(--muted);}
.w-full{width:100%;}

.btn{ display:inline-flex; align-items:center; gap:6px; padding:8px 14px; border-radius:6px; font-size:14px; font-weight:600; cursor:pointer; border:1px solid transparent; background:none; }
.btn-primary{ background:var(--ink); color:#fff; }
.btn-accent{ background:var(--accent); color:#fff; }
.btn-outline{ border-color:var(--line); background:#fff; color:var(--ink); }
.btn-ghost{ color:var(--muted); }
.btn-ghost:hover{ color:var(--ink); }
.btn-sm{ padding:5px 10px; font-size:12.5px; }
.btn-danger{ background:#fff; color:#a63a24; border-color:#f2c7bb; }

label{ display:block; font-size:11px; font-weight:700; color:var(--muted); text-transform:uppercase; letter-spacing:.03em; margin-bottom:4px; }
input, select, textarea{ border:1px solid var(--line); border-radius:6px; padding:7px 10px; font-size:14px; width:100%; background:#fff; color:var(--ink); font-family:inherit; }
input:focus, select:focus, textarea:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(232,70,47,.12); }
.field{ margin-bottom:12px; }

table{ width:100%; border-collapse:collapse; font-size:14px; }
th{ text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); padding:8px 10px; border-bottom:1px solid var(--line); }
td{ padding:9px 10px; border-bottom:1px solid #f0ece3; vertical-align:middle; }
tr.row-link:hover td{ background:#faf8f3; cursor:pointer; }

.badge{ display:inline-block; padding:2px 9px; border-radius:99px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; }
.badge-gray{ background:#efece5; color:#6b6355; }
.badge-amber{ background:#fbeed4; color:#8a5a10; }
.badge-green{ background:#dcefe9; color:#106a56; }
.badge-red{ background:#fbe0da; color:#a63a24; }

.internal-zone{ background:#fff7ed; border:1px dashed #e3b878; border-radius:8px; }
.lock-label{ color:#8a5a10; }

.tabs{ display:flex; gap:4px; margin-bottom:12px; }
.tab{ padding:8px 16px; font-size:13px; font-weight:700; border-radius:6px 6px 0 0; color:var(--muted); border-bottom:2px solid transparent; }
.tab.active{ color:var(--ink); border-bottom:2px solid var(--accent); }

.flash{ background:#dcefe9; border:1px solid #b8ddd2; color:#106a56; padding:10px 16px; border-radius:8px; margin-bottom:16px; font-size:14px; }
.empty{ text-align:center; padding:56px 0; }
.empty .icon{ font-size:28px; margin-bottom:8px; }
.empty .sub{ color:var(--muted); font-size:13px; }

.line-row{ margin-bottom:8px; }
.remove-x{ color:var(--muted); cursor:pointer; }

@media print{
  @page{ size: A4; margin: 10mm; }
  body *{ visibility:hidden; }
  #printArea, #printArea *{ visibility:visible; }
  #printArea{ position:absolute; top:0; left:0; width:100%; padding:0; margin:0; min-height:277mm; display:flex; flex-direction:column; }
  #printArea .detail-area{ flex:1 0 auto; }
  .no-print{ display:none !important; }
}
