:root {
  --green: #1b6b3a; --green-d: #124d29; --green-l: #e6f4ea;
  --bg: #f4f6f4; --card: #fff; --text: #1d2a22; --muted: #5d6b62; --line: #d5ddd7;
  --red: #b3261e; --red-l: #fdecea; --amber: #b26a00; --amber-l: #fff4e0; --blue: #1a5fb4;
  --r: 14px;
}
* { box-sizing: border-box; }
html { font-size: 18px; }
body { margin: 0; font-family: "Noto Sans Devanagari", "Mukta", system-ui, -apple-system, "Segoe UI", sans-serif;
  background: var(--bg); color: var(--text); line-height: 1.45; padding-bottom: 84px; }
a { color: var(--blue); }
h1 { font-size: 1.5rem; margin: .4rem 0 .8rem; }
h2 { font-size: 1.2rem; margin: 1rem 0 .4rem; }
.wrap { max-width: 980px; margin: 0 auto; padding: 12px 16px; }

.top { background: var(--green); color: #fff; display: flex; justify-content: space-between; align-items: center; padding: 8px 14px; }
.brand { color: #fff; text-decoration: none; font-weight: 700; font-size: 1.15rem; }
.top-right { display: flex; gap: 6px; }
.lang { color: #fff; text-decoration: none; border: 2px solid rgba(255,255,255,.5); border-radius: 10px; padding: 4px 10px; font-size: .9rem; }
.lang.on { background: #fff; color: var(--green); border-color: #fff; font-weight: 700; }

.syncbar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; padding: 6px 14px; font-size: .9rem; background: var(--green-l); border-bottom: 1px solid var(--line); }
.syncbar.off { background: var(--amber-l); }
.dot { width: 12px; height: 12px; border-radius: 50%; background: #2e9e55; display: inline-block; }
.off .dot { background: var(--amber); }
.syncbar button { padding: 2px 12px; min-height: 0; font-size: .85rem; }

.bottom { position: fixed; bottom: 0; left: 0; right: 0; background: #fff; border-top: 2px solid var(--line); display: flex; justify-content: space-around; z-index: 10; }
.bottom a { flex: 1; text-align: center; text-decoration: none; color: var(--text); font-size: .8rem; padding: 6px 2px 8px; }
.bottom a span { display: block; font-size: 1.6rem; line-height: 1.2; }

.card { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 12px; margin: 8px 0; }
.narrow { max-width: 460px; margin: 20px auto; }
.muted { color: var(--muted); font-size: .9rem; }
.err { background: var(--red-l); color: var(--red); border-radius: 10px; padding: 8px 12px; margin: 8px 0; }
.ok { background: var(--green-l); color: var(--green-d); border-radius: 10px; padding: 8px 12px; margin: 8px 0; }
.warn { background: var(--amber-l); color: var(--amber); border-radius: 10px; padding: 8px 12px; margin: 8px 0; }

label { display: block; font-weight: 600; margin: 8px 0 3px; }
input, select, textarea { width: 100%; font: inherit; padding: 10px 12px; min-height: 48px; border: 2px solid var(--line); border-radius: 12px; background: #fff; color: var(--text); }
input:focus, select:focus, textarea:focus { outline: 3px solid #9bd3ae; border-color: var(--green); }
input[type=radio], input[type=checkbox] { width: auto; min-height: 0; }
.big { font-size: 1.5rem; font-weight: 700; text-align: center; }

button, .btn { display: inline-block; font: inherit; font-weight: 700; background: var(--green); color: #fff; border: 0; border-radius: 12px;
  padding: 12px 20px; min-height: 52px; cursor: pointer; text-decoration: none; text-align: center; }
button:hover, .btn:hover { background: var(--green-d); }
button.full, .btn.full { width: 100%; margin-top: 12px; font-size: 1.2rem; min-height: 54px; }
button.sec, .btn.sec { background: #fff; color: var(--green); border: 2px solid var(--green); }
button.danger { background: var(--red); }
button.small, .btn.small { min-height: 38px; padding: 4px 12px; font-size: .9rem; }

.choices { display: flex; gap: 8px; }
.choices label { flex: 1; margin: 0; }
.choices input { position: absolute; opacity: 0; }
.choices span { display: block; text-align: center; border: 2px solid var(--line); border-radius: 12px; padding: 11px 6px; background: #fff; font-weight: 700; }
.choices input[type=checkbox]:checked + span::before { content: "✔ "; }
.choices input:checked + span { background: var(--green); color: #fff; border-color: var(--green); }
.choices input:focus-visible + span { outline: 3px solid #9bd3ae; }

.tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.tile { background: #fff; border: 2px solid var(--line); border-radius: 16px; text-align: center; padding: 18px 8px; text-decoration: none; color: var(--text); font-weight: 700; }
.tile .ico { font-size: 2.4rem; display: block; }
.tile:hover { border-color: var(--green); background: var(--green-l); }

.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.stat { background: #fff; border: 1px solid var(--line); border-radius: var(--r); padding: 10px 12px; }
.stat b { display: block; font-size: 1.35rem; }
.stat.good b { color: var(--green); } .stat.bad b { color: var(--red); }

.secret-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin: 8px 0; }
.secret { letter-spacing: .15em; user-select: none; }
.secret.on { letter-spacing: normal; user-select: auto; }
.label-row { display: flex; justify-content: space-between; align-items: flex-end; gap: 8px; }
.label-row label { margin-bottom: 4px; }
.peek { min-width: 64px; letter-spacing: .1em; margin-bottom: 2px; }
.combo { position: relative; }
.combo-input { padding-right: 52px; }
.combo-caret { position: absolute; right: 4px; top: 4px; width: 44px; height: 44px; min-height: 0; padding: 0; background: transparent; color: var(--green); border: 0; font-size: 1.3rem; }
.combo-caret:hover { background: transparent; }
.combo-list { position: absolute; left: 0; right: 0; top: 100%; z-index: 30; margin: 4px 0 0; padding: 4px; list-style: none; background: #fff; border: 2px solid var(--green);
  border-radius: 12px; max-height: 280px; overflow-y: auto; box-shadow: 0 8px 24px rgba(0, 0, 0, .18); }
.combo-list li { padding: 12px; min-height: 48px; display: flex; align-items: center; border-radius: 8px; cursor: pointer; }
.combo-list li.active, .combo-list li:hover { background: var(--green-l); }
.combo-list li.sel { font-weight: 700; }
.combo-list li.muted { color: var(--muted); }
.qcards { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 12px; }
.qcard { border: 1px dashed #888; border-radius: 10px; padding: 10px; text-align: center; background: #fff; break-inside: avoid; page-break-inside: avoid; }
.qcard-head { font-weight: 700; color: var(--green-d); }
.qcard-qr svg { width: 150px; height: 150px; }
.qcard-name { font-weight: 700; font-size: 1.1rem; margin: 4px 0; }
.qcard-small { font-size: .8rem; color: var(--muted); }
.scanner { position: fixed; inset: 0; background: rgba(0,0,0,.92); z-index: 100; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 16px; color: #fff; }
.scanner video { width: min(92vw, 420px); border-radius: 14px; background: #000; }
.scan-btn { margin: 4px 0 2px; }
.own-rate{color:#1a8a3a;font-size:1.4em;margin-left:.3em}
.est-note{color:#1a8a3a;font-size:.9em;margin-top:.2em}
.sumline { padding: 3px 0; border-bottom: 1px dashed var(--line); }
.sumline .secret { letter-spacing: normal; user-select: auto; }
.est { background: var(--green-l); border-radius: 12px; padding: 8px 14px; margin-top: 8px; display: flex; justify-content: space-between; align-items: center; font-size: 1.1rem; }
.est b { font-size: 1.5rem; color: var(--green-d); }

table { width: 100%; border-collapse: collapse; background: #fff; border-radius: 10px; overflow: hidden; }
th, td { padding: 8px 10px; text-align: left; border-bottom: 1px solid var(--line); font-size: .95rem; vertical-align: top; }
th { background: #eef2ef; font-size: .85rem; }
td.n, th.n { text-align: right; white-space: nowrap; }
.scroll { overflow-x: auto; }
tr.void td { color: #999; text-decoration: line-through; }
.neg { color: var(--red); } .pos { color: var(--green-d); }

.row { display: flex; gap: 10px; flex-wrap: wrap; align-items: flex-end; } .row > * { flex: 1 1 140px; min-width: 0; }
.local { list-style: none; padding: 0; margin: 0; }
.local li { background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 8px 12px; margin: 6px 0; display: flex; justify-content: space-between; gap: 8px; align-items: center; }
.local li.failed { border-color: var(--red); background: var(--red-l); }
.local li.pending { border-color: var(--amber); background: var(--amber-l); }

.bars { display: flex; align-items: flex-end; gap: 3px; height: 120px; overflow-x: auto; padding-bottom: 2px; }
.bar { flex: 0 0 14px; background: var(--green); border-radius: 3px 3px 0 0; min-height: 2px; }
.bar.s { background: #1a5fb4; }
.bsp { display: flex; gap: 6px; } .bsp select { padding: 8px; min-height: 48px; }

.toast { position: fixed; left: 50%; transform: translateX(-50%); bottom: 100px; background: #222; color: #fff; padding: 12px 20px; border-radius: 12px; z-index: 50; max-width: 90%; font-weight: 600; }
.toast.good { background: var(--green-d); } .toast.warn { background: var(--amber); color: #fff; }

@media (max-width: 600px) { html { font-size: 17px; } }
@media print {
  .no-print, .bottom, .syncbar { display: none !important; }
  body { background: #fff; padding: 0; } .card { border: 0; padding: 0; }
  th, td { font-size: 11pt; }
}

.cond-group{border:1px dashed #cfd8dc;border-radius:10px;padding:.5rem;margin:.4rem 0}
.cond-row{display:flex;gap:.5rem;align-items:end;flex-wrap:wrap;margin:.3rem 0}
.cond-row>div{flex:1 1 9rem}
.cond-or{font-weight:700;color:#607d8b;margin-bottom:.2rem}
.cond-group [hidden],.cond-row[hidden],.cond-or[hidden]{display:none!important}
.cond-fat{align-self:center;min-width:2.2rem}

.sheet{background:#fff;border:1px solid #cfd8dc;border-radius:10px;padding:12px;margin:12px 0;overflow-x:auto}
.sheet-title{margin:.2rem 0;font-size:1.1rem}
.sheet-date{margin:.2rem 0 .6rem}
.sheet-line{display:inline-block;width:12rem;border-bottom:1px solid #000}
.sheet-table{width:100%;border-collapse:collapse;min-width:520px}
.sheet-table th,.sheet-table td{border:1px solid #000;padding:2px 4px;height:34px}
.sheet-table th{background:#e8f5e9;text-align:center;font-weight:700}
.sheet-table td.no{text-align:center;width:2.2rem}
.sheet-table th.calc{width:26%}
@media print{
  .sheet{border:0;border-radius:0;padding:0;margin:0;overflow:visible;break-after:page;page-break-after:always;break-inside:avoid}
  .sheet:last-of-type{break-after:auto;page-break-after:auto}
  .sheet-table{min-width:0}
  .sheet-table th,.sheet-table td{height:10mm;font-size:11pt;padding:0 2mm}
  .wrap{max-width:none;padding:0;margin:0}
}

.bell{position:relative}
.bell-count{display:inline-block;min-width:1.2em;margin-left:2px;padding:0 5px;border-radius:999px;background:#c62828;color:#fff;font-size:.75rem;font-weight:700;line-height:1.3}

.sale-line{border:1px dashed #cfd8dc;border-radius:10px;padding:.4rem;margin:.4rem 0}
.line-row{display:flex;gap:.4rem;align-items:center;flex-wrap:wrap}
.line-row select{flex:1 1 100%}
.line-row input{flex:1 1 4rem;min-width:0}
.line-row .line-del{flex:0 0 auto}
.line-info{font-size:.9rem;margin-top:.2rem}
.line-info.neg{color:#c62828;font-weight:600}

.alert-new{background:var(--amber-l)}
.new-tag{display:inline-block;margin-right:6px;padding:0 6px;border-radius:999px;background:#c62828;color:#fff;font-size:.75rem;font-weight:700}

.combo-open .wrap{padding-bottom:60vh}
.combo-list{max-height:min(280px,38vh)}
.combo-input:disabled{background:#f1f3f2}
.sale-line .combo, .cond-row .combo{flex:1 1 100%}

.reco{background:var(--green-l);color:var(--green-d);border-radius:10px;padding:8px 12px;margin-top:8px;font-weight:600}
.reco.warn{background:var(--amber-l);color:var(--amber)}
.reco .reco-other{display:block;font-weight:400;font-size:.9rem;margin-top:2px}
