:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#14231f;background:#f4f6f4;font-synthesis:none;text-rendering:optimizeLegibility;--green-950:#0f3028;--green-800:#173f35;--green-700:#1d5949;--green-100:#dcebe5;--sand:#f1e5c9;--red:#b6423d;--line:#dce2df;--muted:#66736e;--shadow:0 18px 50px rgba(21,48,40,.12)}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at top right,#e2eee8,transparent 34rem),#f4f6f4}button,input,select{font:inherit}button{cursor:pointer}.app-shell{max-width:1180px;min-height:100vh;margin:0 auto;padding-bottom:92px}.topbar{display:flex;align-items:center;justify-content:space-between;padding:20px 18px 8px}.topbar p{margin:5px 0 0;color:var(--muted);font-size:.85rem;text-transform:capitalize}.brand-row{display:flex;gap:10px;align-items:center;font-size:1.05rem}.brand-mark{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:var(--green-800);color:#fff;font-weight:800;letter-spacing:-.05em}.content{padding:16px 18px 30px}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(1.65rem,4vw,2.3rem);margin-bottom:5px;letter-spacing:-.04em}h2{letter-spacing:-.03em}h3{margin:24px 0 12px;font-size:1rem}.section-head{display:flex;gap:16px;justify-content:space-between;align-items:flex-end;margin:26px 0 16px}.section-head p{color:var(--muted);margin:0}.primary,.secondary{min-height:44px;border-radius:13px;padding:0 17px;font-weight:750;border:1px solid transparent}.primary{background:var(--green-800);color:#fff;box-shadow:0 8px 18px rgba(23,63,53,.18)}.primary:hover{background:var(--green-700)}.secondary{background:#fff;color:var(--green-800);border-color:var(--line)}.full{width:100%}.icon-button{width:42px;height:42px;border:1px solid var(--line);background:rgba(255,255,255,.82);border-radius:13px;font-size:1.35rem;color:var(--green-950)}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.metric-card{background:#fff;border:1px solid rgba(220,226,223,.9);border-radius:18px;padding:16px;box-shadow:0 6px 20px rgba(21,48,40,.05)}.metric-card span,.metric-card small{display:block;color:var(--muted)}.metric-card strong{display:block;margin:6px 0 2px;font-size:clamp(1.25rem,3vw,1.8rem);letter-spacing:-.04em}.metric-card small{font-size:.76rem}.segmented{display:flex;padding:4px;gap:4px;background:#e8ecea;border-radius:14px;margin:14px 0}.segmented button{flex:1;min-height:38px;border:0;border-radius:10px;background:transparent;color:var(--muted);font-weight:700}.segmented button.active{background:#fff;color:var(--green-950);box-shadow:0 4px 12px rgba(21,48,40,.08)}.command-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.command-card{text-align:left;border:1px solid var(--line);border-radius:18px;padding:17px;background:#fff;color:inherit;box-shadow:0 7px 22px rgba(21,48,40,.05)}.command-card:hover{transform:translateY(-1px);border-color:#bdcbc5}.command-card-top,.command-card-bottom{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.command-card-top>div{display:flex;flex-direction:column;gap:4px}.command-card-top>div>strong{font-size:1.12rem}.command-card-top>div>span,.command-card-bottom>span{color:var(--muted);font-size:.82rem}.command-card-bottom{margin-top:22px;align-items:flex-end}.command-card-bottom>div{text-align:right}.command-card-bottom small,.command-card-bottom strong{display:block}.command-card-bottom small{color:var(--muted)}.command-card-bottom strong{margin-top:2px;font-size:1.2rem}.status{display:inline-flex;border-radius:999px;padding:5px 9px;font-size:.72rem;font-weight:800}.status.open{background:var(--sand);color:#725720}.status.partial{background:#ffe1ce;color:#95451b}.status.paid{background:var(--green-100);color:var(--green-700)}.status.cancelled{background:#f6dedd;color:var(--red)}.empty-state,.empty-mini{text-align:center;color:var(--muted);border:1px dashed #c8d0cc;border-radius:18px;padding:34px 15px}.empty-state strong{display:block;color:var(--green-950);margin-bottom:5px}.empty-state p{margin:0}.empty-mini{padding:18px;background:#f8faf9}.bottom-nav{position:fixed;z-index:20;bottom:12px;left:50%;transform:translateX(-50%);width:min(calc(100% - 24px),520px);height:68px;display:grid;grid-template-columns:repeat(3,1fr);padding:5px;border-radius:21px;background:rgba(15,48,40,.96);box-shadow:0 16px 40px rgba(15,48,40,.3);backdrop-filter:blur(10px)}.bottom-nav button{border:0;border-radius:16px;background:transparent;color:#a9bdb5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}.bottom-nav button span{font-size:1.2rem}.bottom-nav button small{font-weight:700}.bottom-nav button.active{background:#fff;color:var(--green-950)}.modal-backdrop,.drawer-backdrop{position:fixed;z-index:40;inset:0;background:rgba(9,26,22,.52);backdrop-filter:blur(5px)}.modal-backdrop{display:grid;place-items:center;padding:18px}.modal{width:min(100%,450px);background:#fff;border-radius:22px;padding:20px;box-shadow:var(--shadow)}.modal-head,.drawer-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.modal-head p,.drawer-head p{color:var(--muted);margin:3px 0 0}label{display:block;margin:14px 0;font-size:.84rem;font-weight:750;color:#40504a}input,select{display:block;width:100%;min-height:46px;margin-top:6px;padding:0 13px;border-radius:12px;border:1px solid #cad3cf;background:#fff;color:#14231f;outline:none}input:focus,select:focus{border-color:var(--green-700);box-shadow:0 0 0 3px rgba(29,89,73,.12)}.drawer-backdrop{display:flex;justify-content:flex-end}.drawer{width:min(100%,580px);height:100%;overflow-y:auto;background:#f5f7f5;box-shadow:var(--shadow)}.drawer-head{position:sticky;top:0;z-index:2;justify-content:flex-start;padding:16px 18px;background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}.drawer-head h2{margin:0}.total-panel{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin:16px 18px;overflow:hidden;border:1px solid var(--line);border-radius:16px;background:var(--line)}.total-panel>div{padding:14px 12px;background:#fff}.total-panel span,.total-panel strong{display:block}.total-panel span{color:var(--muted);font-size:.78rem}.total-panel strong{margin-top:4px}.total-panel .remaining{background:var(--green-950);color:#fff}.total-panel .remaining span{color:#b7cbc3}.drawer-tabs{margin:0 18px}.drawer-content{padding:0 18px 26px}.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-bottom:12px}.product-grid button{min-height:74px;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;text-align:left;padding:12px;border-radius:14px;border:1px solid var(--line);background:#fff;color:inherit}.product-grid button:hover{border-color:var(--green-700)}.product-grid span{color:var(--green-700);font-size:.83rem;font-weight:700}.inline-form,.payment-form{margin-top:12px;padding:16px;border-radius:16px;background:#fff;border:1px solid var(--line)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.form-row label{margin-top:0}.item-list,.payment-list{overflow:hidden;border:1px solid var(--line);border-radius:16px;background:#fff}.item-row{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:12px;padding:13px;border-bottom:1px solid var(--line)}.item-row:last-child,.payment-list>div:last-child{border-bottom:0}.item-row>div:first-child{display:flex;flex-direction:column}.item-row span{color:var(--muted);font-size:.75rem}.quantity{display:flex;align-items:center;gap:7px}.quantity button{width:30px;height:30px;border:1px solid var(--line);border-radius:9px;background:#f5f7f5}.payment-list>div{display:flex;justify-content:space-between;align-items:center;padding:13px;border-bottom:1px solid var(--line)}.payment-list>div>div{display:flex;flex-direction:column}.payment-list span{color:var(--muted);font-size:.75rem}.drawer-footer{padding:18px;text-align:center}.danger-text{border:0;background:transparent;color:var(--red);font-weight:750}.panel{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;margin:14px 0}.product-form{max-width:680px}.product-table{padding:0;overflow:hidden}.product-table>div{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:16px;padding:14px 16px;border-bottom:1px solid var(--line)}.product-table>div:last-child{border-bottom:0}.product-table>div>div{display:flex;flex-direction:column}.product-table span{color:var(--muted);font-size:.8rem}.product-table .inactive{opacity:.55}.switch-button{min-width:72px;padding:7px 10px;border-radius:999px;border:0;background:var(--green-100);color:var(--green-700);font-size:.75rem;font-weight:800}.inactive .switch-button{background:#e6e9e7;color:#68736e}.period-select{max-width:300px}.report-metrics{margin:10px 0 18px}.summary-list>div{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line)}.summary-list>div:last-child{border-bottom:0}.summary-list span{display:flex;flex-direction:column}.summary-list small{color:var(--muted);margin-top:2px}.legal-note{color:var(--muted);font-size:.78rem;text-align:center}.toast{position:fixed;z-index:80;left:50%;bottom:92px;transform:translateX(-50%);background:#14231f;color:#fff;border-radius:12px;padding:12px 16px;box-shadow:var(--shadow);font-weight:700;animation:toast-in .2s ease}@keyframes toast-in{from{transform:translate(-50%,8px);opacity:0}}@media(max-width:700px){.metric-grid{grid-template-columns:1fr 1fr}.metric-card:first-child{grid-column:span 2}.command-list{grid-template-columns:1fr}.section-head{align-items:center}.section-head .primary{min-width:fit-content}.product-grid{grid-template-columns:repeat(2,1fr)}.product-table>div{grid-template-columns:1fr auto}.product-table .switch-button{grid-column:span 2;width:100%}}@media(max-width:430px){.content,.topbar{padding-left:13px;padding-right:13px}.section-head{align-items:flex-end}.section-head p{font-size:.83rem}.primary{padding-left:13px;padding-right:13px}.total-panel,.drawer-tabs{margin-left:13px;margin-right:13px}.drawer-content{padding-left:13px;padding-right:13px}.total-panel strong{font-size:.88rem}.form-row{grid-template-columns:1fr;gap:0}}

/* Comanda Móvel Pro */
body { background: #f2f5f3; }
.app-shell { max-width: 1260px; padding-bottom: 100px; }
.topbar {
  padding: 18px 24px;
  border-bottom: 1px solid var(--line);
  background: #fff;
}
.brand-row { line-height: 1.2; }
.brand-row p { margin-top: 4px; font-size: .78rem; }
.brand-mark { width: 44px; height: 44px; flex: 0 0 44px; }
.topbar-actions { display: flex; align-items: center; gap: 10px; }
.demo-badge {
  padding: 5px 8px;
  border-radius: 6px;
  background: var(--sand);
  color: #604819;
  font-size: .7rem;
  font-weight: 750;
}
.content { padding: 20px 24px 30px; }
.commands-heading { margin: 8px 0 20px; }
.section-head .eyebrow {
  margin-bottom: 6px;
  color: var(--green-700);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.command-metrics { margin-bottom: 20px; }
.command-card { border-radius: 14px; }
.command-card strong, .drawer-head h2, .item-row strong, .product-grid strong {
  overflow-wrap: anywhere;
}
.drawer { overscroll-behavior: contain; }
.drawer-summary {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flow-root;
  padding-bottom: 8px;
  background: #f5f7f5;
  border-bottom: 1px solid var(--line);
}
.drawer-head { position: static; }
.drawer-content .product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.icon-button, .quantity button { width: 44px; height: 44px; flex: 0 0 44px; }
.quantity button:focus-visible, button:focus-visible {
  outline: 3px solid #28836c;
  outline-offset: 2px;
}
.bottom-nav { bottom: max(12px, env(safe-area-inset-bottom)); }
.modal { max-height: 100%; overflow-y: auto; }

@media (min-width: 1000px) {
  .command-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .topbar, .content { padding-left: 14px; padding-right: 14px; }
  .commands-heading { display: grid; grid-template-columns: 1fr; gap: 14px; }
  .commands-heading .primary { width: 100%; }
  .command-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .command-metrics .metric-card { grid-column: auto; padding: 9px 7px; border-radius: 12px; }
  .command-metrics .metric-card span { font-size: .72rem; }
  .command-metrics .metric-card strong { font-size: clamp(.8rem, 3.6vw, 1.3rem); }
  .command-metrics .metric-card small { display: none; }
  .drawer-content .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 390px) {
  .topbar { gap: 8px; }
  .brand-row { gap: 7px; font-size: .9rem; }
  .brand-row p { font-size: .7rem; }
  .topbar-actions { gap: 4px; }
  .demo-badge { padding: 4px; font-size: .63rem; }
  .item-row { gap: 6px; padding: 10px; }
  .quantity { gap: 3px; }
}
@media (max-height: 460px) {
  .drawer-summary { position: static; }
}
 
.bottom-nav { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.game-form, .game-history { max-width: 680px; }
.game-form h2, .game-history h3 { margin: 0 0 8px; }
.game-players { margin: 0; padding: 6px 12px; border: 1px solid var(--line); border-radius: 12px; }
.game-players legend { padding: 0 6px; font-weight: 750; }
.game-players label { display: flex; align-items: center; gap: 10px; min-height: 44px; margin: 0; }
.game-players input { width: 20px; min-height: 20px; margin: 0; accent-color: var(--green-700); }
.game-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.game-form button:disabled { opacity: .55; cursor: default; }
.game-error { color: var(--red); }
.game-history ul { list-style: none; padding: 0; margin: 0; }
.game-history li { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-top: 1px solid var(--line); }

.product-table .product-actions { display: flex; flex-direction: row; align-items: center; gap: 8px; }
.product-actions .secondary { padding: 0 12px; }
.product-actions .switch-button { min-height: 44px; }
.product-error { color: var(--red); }
.product-error:empty { display: none; }
@media (max-width: 700px) {
  .product-table .product-actions { grid-column: 1 / -1; }
  .product-actions button { flex: 1; }
}

.bottom-nav { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.client-layout { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.client-list, .client-history { display: grid; gap: 8px; }
.client-history button { display: grid; gap: 4px; }
.client-history button span { color: var(--muted); font-size: .84rem; }
.client-check { display: flex; align-items: center; gap: 10px; min-height: 44px; }
.client-check input { width: 20px; min-height: 20px; margin: 0; flex: 0 0 20px; accent-color: var(--green-700); }
.client-open-list { margin: 10px 0; }
.client-open-list .client-check { margin: 0; padding: 6px 0; border-bottom: 1px solid var(--line); }
.client-open-list .client-check strong { margin-left: auto; white-space: nowrap; }
.client-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.client-actions button:disabled { opacity: .55; cursor: default; }
.client-error { color: var(--red); }
.client-error:empty { display: none; }
#customer-statement { display: none; }
@media (max-width: 700px) {
  .client-layout { grid-template-columns: 1fr; gap: 0; }
  .client-actions button { flex: 1 1 170px; }
}
@media print {
  @page { size: A4; margin: 16mm; }
  body { background: white; color: #182823; }
  body:has(#customer-statement) #app { display: none; }
  #customer-statement { display: block; font: 10pt system-ui, sans-serif; }
  #customer-statement header, #customer-statement footer { border-block: 1px solid #879a92; padding: 12px 0; }
  #customer-statement section { margin: 16px 0; }
  #customer-statement h1 { font-size: 23pt; }
  #customer-statement h2 { font-size: 13pt; break-after: avoid; margin: 0 0 8px; }
  #customer-statement p { margin: 4px 0; overflow-wrap: anywhere; }
  #customer-statement table { width: 100%; border-collapse: collapse; }
  #customer-statement th, #customer-statement td { text-align: left; padding: 6px; border-bottom: 1px solid #cbd3cf; }
  #customer-statement tr { break-inside: avoid; }
  #customer-statement footer { break-inside: avoid; }
}

.payment-form [data-action="generate-pix"] { margin-bottom: 10px; }
.pix-status:empty, .pix-copy-status:empty { display: none; }
.pix-status { color: var(--red); }
#pix-charge:not(:empty) { padding: 14px; margin-bottom: 12px; border: 1px solid var(--line); border-radius: 12px; }
.pix-amount { text-align: center; font-size: 1.35rem; font-weight: 800; }
.pix-qr { width: min(100%, 250px); margin: 0 auto 12px; background: white; }
.pix-qr svg { display: block; width: 100%; height: auto; }
#pix-charge textarea { width: 100%; display: block; resize: vertical; margin-top: 6px; padding: 8px; border: 1px solid var(--line); border-radius: 8px; font: inherit; }
@media print {
  #customer-statement .pix-qr { width: 42mm; margin: 6px 0; }
}

.client-list-entry { display: grid; gap: 4px; }
.client-list-entry small { overflow-wrap: anywhere; }
.client-suggestions { display: grid; gap: 6px; max-height: 185px; overflow-y: auto; margin: -6px 0 12px; }
.client-suggestions:empty { display: none; }
.client-suggestions button { display: grid; justify-items: start; gap: 3px; padding: 7px 12px; text-align: left; overflow-wrap: anywhere; }

.status { flex-shrink: 0; white-space: nowrap; align-self: flex-start; }
.quantity { gap: 6px; }
.quantity button { width: 32px; height: 34px; flex-basis: 32px; padding: 0; }
.quantity strong { min-width: 2ch; text-align: center; font-variant-numeric: tabular-nums; }
@media (max-width: 430px) {
  .item-row { grid-template-columns: minmax(0, 1fr) auto auto; }
}

.worker-shell .topbar { min-height: 80px; }
.worker-shell .content > section:not([class]) {
  padding: 18px; margin: 14px 0; border: 1px solid var(--line); border-radius: 18px; background: white;
}
.worker-shell .content button:not([class]) {
  min-height: 44px; padding: 0 14px; border: 1px solid transparent; border-radius: 13px;
  background: var(--green-800); color: white; font-weight: 750;
}
.worker-shell .content button:not([class]):hover { background: var(--green-700); }
.worker-shell a { color: var(--green-800); }
.worker-shell a.primary { color: white; }
.worker-shell .bottom-nav a {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  min-width: 0; border-radius: 16px; text-decoration: none; color: #b8ccc4;
}
.worker-shell .bottom-nav a span { font-size: 1.2rem; }
.worker-shell .bottom-nav a small { font-weight: 700; font-size: .75rem; }
.worker-shell .bottom-nav a.active { background: white; color: var(--green-950); }
.worker-shell .bottom-nav[data-staff] { grid-template-columns: repeat(3, minmax(0,1fr)); }
.worker-shell .bottom-nav a:focus-visible, .worker-shell .segmented a:focus-visible {
  outline: 3px solid #28836c; outline-offset: -3px;
}
.worker-shell .account { position: absolute; top: 19px; right: max(24px, calc((100% - 1212px) / 2)); z-index: 25; }
.worker-shell .account summary { list-style: none; cursor: pointer; }
.worker-shell .account summary::-webkit-details-marker { display: none; }
.worker-shell .account summary.secondary { display: grid; place-items: center; max-width: 170px; padding: 0 12px; overflow: hidden; white-space: nowrap; }
.worker-shell .account-menu { position: absolute; right: 0; min-width: 155px; margin-top: 6px; box-shadow: var(--shadow); }
.worker-shell .account-menu a { display: block; margin-bottom: 10px; }
.worker-shell .segmented a { flex: 1; min-height: 38px; display: grid; place-items: center; border-radius: 10px; text-decoration: none; color: var(--muted); font-weight: 700; }
.worker-shell .segmented a.active { background: white; color: var(--green-950); box-shadow: 0 4px 12px rgba(21,48,40,.08); }
.worker-shell .command-card { display: block; color: inherit; text-decoration: none; }
.worker-shell .new-command-dialog { border: 0; color: inherit; margin: auto; max-width: calc(100vw - 28px); }
.worker-shell .new-command-dialog::backdrop { background: rgba(9,26,22,.52); backdrop-filter: blur(5px); }
/* Public sign-in page */
body.login-page {
  min-width: 0; min-height: 100vh; min-height: 100svh; display: grid; place-items: center;
  padding: clamp(16px, 5vw, 48px); background: radial-gradient(ellipse at 20% 0%, #e2eedb, transparent 60%), #f2f5f3;
}
.login-shell { width: min(100%, 780px); }
.login-back {
  display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin-bottom: 10px;
  color: var(--green-800); font-weight: 700; text-underline-offset: 4px;
}
.login-card {
  display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.1fr);
  overflow: hidden; border: 1px solid var(--line); border-radius: 24px; background: #fff; box-shadow: var(--shadow);
}
.login-brand {
  display: grid; align-content: space-between; gap: 24px; padding: clamp(22px, 4vw, 36px);
  color: #fff; background: linear-gradient(145deg, var(--green-800), var(--green-950));
}
.login-brand .brand-mark { background: #e2eedb; color: var(--green-950); }
.login-brand p { margin: 0; font-size: clamp(2rem, 5vw, 3.25rem); line-height: 1.04; letter-spacing: -.055em; font-weight: 750; }
/* The sand plane is skewed while the net and posts stay upright. */
.login-court { position: relative; width: min(100%, 230px); aspect-ratio: 2 / 1; }
.login-court-sand {
  position: absolute; inset: 36% 13% 6%;
  transform: skewX(-32deg);
  border: 2px solid #e4c38e; border-radius: 3px;
  background: linear-gradient(#d6ad6940, #d6ad6975);
}
.login-court-net {
  position: absolute; inset: 18% 12% 35%;
  border-inline: 3px solid #e1eee5;
}
.login-court-net::before {
  content: ""; position: absolute; inset: 5px 0 12px;
  border-block: 2px solid #e1eee5;
  background:
    repeating-linear-gradient(90deg, #dae8de88 0 1px, transparent 1px 8px),
    repeating-linear-gradient(#dae8de88 0 1px, transparent 1px 7px);
}
.login-access { padding: clamp(22px, 5vw, 42px); align-self: center; }
.login-access > p { color: #536660; }
.login-access input { width: 100%; font-size: max(1rem, 16px); }
.login-access button { width: 100%; min-height: 46px; }
.login-access .login-message { padding: 10px 12px; border-radius: 10px; background: #fbeeea; color: #803728; }
.login-shell :focus-visible { outline: 2px solid var(--green-700); outline-offset: 3px; }
@media (max-width: 620px) {
  .login-card { grid-template-columns: minmax(0, 1fr); }
  .login-brand p, .login-court { display: none; }
}
.worker-shell .check { display: flex; align-items: center; gap: 8px; }
.worker-shell .check input { flex: 0 0 20px; width: 20px; min-height: 20px; margin: 0; accent-color: var(--green-700); }
.worker-shell table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.worker-shell td, .worker-shell th { text-align: left; padding: 6px; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; }
.worker-shell .inline { display: flex; flex-wrap: wrap; gap: 8px; align-items: end; }
.worker-shell .inline label { margin: 0; }
.worker-shell details.panel summary { cursor: pointer; font-weight: 750; }
.worker-shell .pix { max-width: 260px; margin: auto; }
.worker-shell .pix svg { display: block; width: 100%; height: auto; }
.worker-shell textarea { width: 100%; resize: vertical; border: 1px solid var(--line); border-radius: 12px; padding: 10px; }
.worker-shell li { margin: 10px 0; overflow-wrap: anywhere; }
.worker-shell .command-detail { max-width: 750px; margin: 0 auto; }
.worker-shell .command-detail .drawer-summary { margin: 0 -2px; border: 1px solid var(--line); border-radius: 16px; overflow: hidden; }
.worker-shell .command-detail .drawer-head { align-items: center; }
.worker-shell .command-detail .drawer-head .icon-button { display: grid; place-items: center; text-decoration: none; }
.worker-shell .command-detail .total-panel { margin-top: 12px; margin-bottom: 3px; }
.worker-shell .command-detail .detail-tab[hidden] { display: none; }
.worker-shell .command-detail .segmented { margin: 10px 13px 0; }
.worker-shell .audit-list { padding-left: 24px; }
.worker-shell .muted { color: var(--muted); }
.worker-shell .client-list button, .worker-shell .client-list a { width: 100%; }
.worker-shell .command-metrics[data-staff] { grid-template-columns: minmax(0, 1fr); }
.worker-shell .payment-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.worker-shell .product-grid form { margin: 0; min-width: 0; }
.worker-shell .product-grid form button { width: 100%; color: var(--green-950); background: white; border: 1px solid var(--line); }
.worker-shell .product-grid form button:hover { color: var(--green-950); background: var(--green-100); }
@media (max-width: 700px) {
  .worker-shell .account { right: 14px; }
  .worker-shell .account summary.secondary { max-width: 105px; }
}
@media print {
  .worker-shell .topbar, .worker-shell .bottom-nav, .worker-shell .account, .worker-shell .no-print { display: none; }
  .worker-shell .content { padding: 0; }
  .worker-shell .pix { max-width: 42mm; margin: 0; }
  .worker-shell tr { break-inside: avoid; }
}
.worker-shell .client-list-entry { margin-top: 8px; }
.worker-shell .client-list-entry[hidden] { display: none; }
.worker-shell .client-list-entry a { display: grid; place-items: center; text-decoration: none; }
@media (max-width: 700px) {
  .worker-shell .command-detail .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 390px) {
  .worker-shell .topbar { padding-right: 90px; }
  .worker-shell .brand-row p { line-height: 1.25; }
  .worker-shell .bottom-nav a small { font-size: .65rem; }
}

.worker-shell .finance-entries { list-style: none; margin: 0; padding: 0; }
.worker-shell .finance-entries li { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.worker-shell .finance-entries li:last-child { border-bottom: 0; }
.worker-shell .finance-entries li > div:last-child { text-align: right; }
.worker-shell .finance-entries li small { display: block; margin: 4px 0; color: var(--muted); }
.worker-shell .finance-tabs a { padding: 5px; text-align: center; }
@media (max-width: 390px) {
  .worker-shell .finance-tabs a { font-size: .82rem; }
}

.worker-shell .dashboard-layout { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.worker-shell .dashboard-layout h3 { margin-top: 0; font-size: 1.1rem; }
.worker-shell .dashboard-peaks { padding-left: 0; list-style: none; }
.worker-shell .dashboard-peaks li { display: flex; justify-content: space-between; gap: 10px; padding: 6px 0; border-bottom: 1px solid var(--line); }
@media (max-width: 700px) {
  .worker-shell .dashboard-layout { grid-template-columns: 1fr; gap: 0; }
}

.worker-shell .command-items-table { overflow-x: auto; }
.worker-shell .command-items-table td:nth-child(n+3) { white-space: nowrap; }
.worker-shell .command-items-table .item-edit { min-height: 38px; padding: 0 9px; font-size: .8rem; }
.worker-shell .item-edit-dialog { margin: auto; border: 0; color: inherit; max-width: calc(100vw - 28px); }
.worker-shell .item-edit-dialog::backdrop { background: rgba(9,26,22,.52); backdrop-filter: blur(5px); }
.worker-shell .item-edit-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.worker-shell .item-edit-actions .danger-text { min-height: 44px; padding: 0 12px; }
.worker-shell .receipt-toolbar { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 12px; margin: 14px 0 20px; }
.worker-shell .receipt { width: min(100%, 92mm); margin: 0 auto; padding: 20px 16px; background: white; border: 1px solid var(--line); color: #18231e; font-size: .82rem; }
.worker-shell .receipt-heading { text-align: center; }
.worker-shell .receipt-heading > strong { text-transform: uppercase; font-size: 1.12rem; letter-spacing: .08em; }
.worker-shell .receipt h1 { margin: 6px 0; font-size: 1.26rem; letter-spacing: 0; }
.worker-shell .receipt h2 { margin: 0 0 4px; font-size: .95rem; letter-spacing: 0; overflow-wrap: anywhere; }
.worker-shell .receipt p { margin: 3px 0; overflow-wrap: anywhere; }
.worker-shell .receipt-command, .worker-shell .receipt-footer { margin-top: 12px; padding-top: 10px; border-top: 1px dashed #68766f; }
.worker-shell .receipt-items { margin: 8px 0; font-size: .72rem; }
.worker-shell .receipt-items th, .worker-shell .receipt-items td { padding: 4px 2px; }
.worker-shell .receipt-items :is(th,td):not(:first-child) { text-align: right; white-space: nowrap; }
.worker-shell .receipt-items .receipt-day th { padding-top: 8px; }
.worker-shell .receipt-totals { margin: 8px 0 0; }
.worker-shell .receipt-totals div, .worker-shell .receipt-grand-total { display: flex; justify-content: space-between; gap: 8px; }
.worker-shell .receipt-totals dd { margin: 0; white-space: nowrap; }
.worker-shell .receipt-grand-total { margin-bottom: 10px; font-size: 1.05rem; }
.worker-shell .receipt-payment, .worker-shell .receipt-note { color: #46574e; font-size: .73rem; }
.worker-shell .receipt .pix { width: 34mm; margin: 5px auto; }
.worker-shell .receipt-payload { font: .65rem ui-monospace, monospace; word-break: break-all; }
.worker-shell .receipt-note { text-align: center; margin-top: 8px; }
@media print {
  .worker-shell:has(.receipt) { padding: 0; min-height: 0; }
  .worker-shell .receipt { border: 0; width: 80mm; padding: 0; }
  .worker-shell .receipt-heading, .worker-shell .receipt-totals, .worker-shell .receipt-footer { break-inside: avoid; }
  .worker-shell .receipt h2, .worker-shell .receipt-day { break-after: avoid; }
}

@media print {
  .worker-shell .receipt-toolbar { display: none; }
}

.worker-shell .client-list .client-card { border: 1px solid var(--line); border-radius: 12px; padding: 12px; gap: 8px; }
.worker-shell .client-list .client-card.has-balance { background: #fffbf4; }
.worker-shell .client-list .client-name { display: inline; font-weight: 800; }
.worker-shell .client-billing-badges { display: flex; gap: 6px; flex-wrap: wrap; }
.worker-shell .billing-badge { display: inline-flex; padding: 4px 8px; border-radius: 99px; background: #e7eeeb; color: #253b33; font-size: .77rem; font-weight: 750; white-space: nowrap; }
.worker-shell .billing-badge.weekly { background: #e3efff; color: #234c80; }
.worker-shell .billing-badge.monthly { background: #f0e6fa; color: #614080; }
.worker-shell .billing-badge.pending { background: #ffead1; color: #7c411d; }
.worker-shell .client-list .client-charge, .worker-shell .client-charge { width: fit-content; display: inline-grid; place-items: center; text-decoration: none; }
.worker-shell .client-back { display: inline-grid; place-items: center; text-decoration: none; margin-bottom: 8px; }
.worker-shell .client-balance { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.worker-shell .client-balance h2 { margin-bottom: 3px; font-size: .95rem; }
.worker-shell .client-balance strong { font-size: 1.4rem; }
.worker-shell #cobranca { scroll-margin-top: 14px; }
.worker-shell .company-logo { display: block; max-width: 130px; max-height: 65px; object-fit: contain; margin: 0 auto 8px; }
.worker-shell .receipt-heading .company-logo { max-width: 39mm; max-height: 19mm; }

.worker-shell .client-period-filter { min-height: 36px; margin: 8px 0 10px; padding: 0 12px; font-size: .84rem; }
.worker-shell .client-command-selection { margin-top: 8px; padding-top: 14px; border-top: 1px solid var(--line); }
.worker-shell .client-select-all { min-height: 38px; padding: 0 12px; font-size: .86rem; }

.worker-shell .client-history-list { list-style: none; margin: 0; padding: 0; }
.worker-shell .client-history-list li { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 8px 16px; margin: 0; padding: 11px 0; border-bottom: 1px solid var(--line); }
.worker-shell .client-history-list li:last-child { border-bottom: 0; }
.worker-shell .client-history-list a { font-weight: 750; }
.worker-shell .client-history-list small { display: block; margin-top: 4px; color: var(--muted); }
.worker-shell .client-history-list .history-status small { color: #7c411d; font-weight: 750; }

.worker-shell .client-history-pagination { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px 12px; margin-top: 12px; }
.worker-shell .client-history-pagination a { display: inline-grid; place-items: center; text-decoration: none; }
.worker-shell .client-history-pagination span { color: var(--muted); font-size: .85rem; }

.worker-shell .company-form-notice { padding: 10px 12px; border-radius: 10px; color: #174b3b; background: #e7f3ec; }
.worker-shell .company-form-notice.error { color: #8a352a; background: #fbeeea; }

.worker-shell .content input[type="date"],
.worker-shell .content input[type="time"] { min-width: 0; max-width: 100%; }
.worker-shell .inline label:has(input[type="date"]),
.worker-shell .inline label:has(input[type="time"]) { flex: 0 1 180px; min-width: 0; max-width: 100%; }
.worker-shell .item-quantity-stepper { display: grid; grid-template-columns: 34px minmax(48px, 64px) 34px; align-items: center; gap: 8px; margin-bottom: 14px; }
.worker-shell .item-quantity-stepper button { min-height: 36px; padding: 0; }
.worker-shell .item-quantity-stepper input { margin: 0; min-height: 36px; padding: 0 5px; text-align: center; appearance: textfield; font-variant-numeric: tabular-nums; }
.worker-shell .item-quantity-stepper input::-webkit-inner-spin-button { appearance: none; }

.worker-shell .list-pagination { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:10px; margin-top:16px; }
.worker-shell .list-pagination a { display:inline-grid; place-items:center; text-decoration:none; }
.worker-shell .list-pagination span { color:var(--muted); font-size:.86rem; }

@media (max-width: 540px) {
  .worker-shell .command-items-table { overflow: visible; }
  .worker-shell .command-items-table table,
  .worker-shell .command-items-table tbody { display: block; }
  .worker-shell .command-items-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .worker-shell .command-items-table tbody tr {
    display: grid;
    grid-template-columns: minmax(32px, .55fr) minmax(0, 1fr) minmax(0, 1.15fr);
    grid-template-areas: "name name action" "date date date" "qty unit subtotal";
    gap: 3px 8px;
    padding: 10px 0;
    border-bottom: 1px solid var(--line);
  }
  .worker-shell .command-items-table td { display: block; min-width: 0; padding: 0; border: 0; white-space: normal; }
  .worker-shell .command-items-table .item-name { grid-area: name; align-self: center; font-weight: 750; overflow-wrap: break-word; }
  .worker-shell .command-items-table .item-date { grid-area: date; color: var(--muted); font-size: .73rem; }
  .worker-shell .command-items-table .item-qty { grid-area: qty; }
  .worker-shell .command-items-table .item-unit { grid-area: unit; }
  .worker-shell .command-items-table .item-subtotal { grid-area: subtotal; text-align: right; font-weight: 750; }
  .worker-shell .command-items-table .item-action { grid-area: action; justify-self: end; }
  .worker-shell .command-items-table td[data-label] { white-space: nowrap; font-size: .79rem; }
  .worker-shell .command-items-table td[data-label]::before { content: attr(data-label); display: block; color: var(--muted); font-size: .68rem; font-weight: 500; }
  .worker-shell .command-items-table .item-edit { min-height: 32px; }
  .worker-shell .product-grid .product-quick-button { min-height: 56px; }
}

.worker-shell select.payment-method {
  appearance: none; -webkit-appearance: none; height: 46px; padding: 0 36px 0 13px;
  background: white url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23173f35' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 12px center;
}
.worker-shell .payment-actions { margin-top: 16px; gap: 10px; }
@media (max-width: 430px) {
  .worker-shell .payment-actions { display: grid; grid-template-columns: minmax(0,1fr); }
}

.worker-shell .finance-period { display: grid; gap: 12px; }
.worker-shell .finance-period-dates { display: grid; grid-template-columns: repeat(2,minmax(0,180px)); gap: 10px; }
.worker-shell .finance-period label { min-width: 0; margin: 0; }
.worker-shell .finance-period-group { width: min(100%,220px); }
.worker-shell .finance-period-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.worker-shell .content input[type="date"] { display: block; box-sizing: border-box; inline-size: 100%; min-inline-size: 0; height: 46px; -webkit-appearance: none; appearance: none; text-align: left; }
.worker-shell .content input[type="date"]::-webkit-date-and-time-value { text-align: left; }
.worker-shell .dashboard-layout { align-items: start; }
.worker-shell .dashboard-layout > .panel { min-width: 0; }
.worker-shell .dashboard-chart-more { margin-top: 10px; }
.worker-shell .dashboard-chart-more summary { cursor: pointer; color: var(--green-800); font-weight: 700; padding: 8px 0; }
@media (max-width: 700px) {
  .worker-shell .finance-period-dates { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .worker-shell .dashboard-layout { gap: 12px; }
  .worker-shell .dashboard-layout > .panel { margin: 0; }
}

.worker-shell .bottom-nav .nav-icon { display: block; flex: none; width: 22px; height: 22px; }
.worker-shell .bottom-nav a { gap: 4px; }
.worker-shell .date-range { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.worker-shell .date-field { display: block; min-width: 0; max-width: 100%; }
.worker-shell .date-range .date-field { margin: 0; }
.worker-shell .date-control { display: grid; grid-template-columns: minmax(0,1fr); min-width: 0; max-width: 100%; }
.worker-shell .date-control input[type="date"] { width: 100%; max-width: 100%; min-width: 0; margin-top: 6px; font-size: 16px; }
.worker-shell .date-control input[type="date"]::-webkit-date-and-time-value { min-width: 0; margin: 0; }
.worker-shell .date-control input[type="date"]::-webkit-datetime-edit { min-width: 0; padding: 0; }
@media (max-width: 430px) {
  .worker-shell .date-range { grid-template-columns: minmax(0,1fr); }
}

.worker-shell .command-search { display: flex; flex-wrap: wrap; align-items: end; gap: 8px 12px; margin: 16px 0; }
.worker-shell .command-search label { flex: 1 1 190px; min-width: 0; margin: 0; }
.worker-shell .command-search > a { align-self: center; }
.worker-shell .command-status-tabs a { text-align: center; padding: 4px; }
.worker-shell .previous-command h2 { font-size: 1.13rem; margin-bottom: 8px; }

.worker-shell [data-private-mask][hidden], .worker-shell [data-private-amount][hidden] { display: none; }
.worker-shell .command-value-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 7px; }
.worker-shell .command-value-toggle svg { width: 19px; height: 19px; flex: none; }
.worker-shell .command-value-toggle[aria-pressed="true"] [data-eye-slash] { display: none; }
.worker-shell .command-card [data-private-mask] { letter-spacing: .14em; }
.worker-shell .metric-card strong :is([data-private-mask],[data-private-amount]) { color: inherit; }

.worker-shell .offline-banner { padding: 10px 12px; color: #6b411c; background: #fff6df; }
.worker-shell [hidden] { display: none; }
.worker-shell #offline-list { display: grid; gap: 7px; }
.worker-shell .offline-item-form { max-width: 440px; }
.worker-shell #offline-queue button { margin: 5px 0 0 8px; min-height: 36px; }

.worker-shell .games-layout { width: min(100%, 680px); margin-inline: auto; }

.worker-shell .sandmenu-mark, .login-brand .sandmenu-mark { background: #f7f2e9; object-fit: contain; }

.page-back {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin-bottom: 12px;
  color: var(--green-800);
  font-weight: 750;
  text-underline-offset: 4px;
}
.page-back:hover { color: var(--green-700); }
.page-back:focus-visible { outline: 2px solid var(--green-700); outline-offset: 3px; }

/* Keep page headings, actions and panels on the same centered column. */
.worker-shell .content {
  width: 100%;
  margin-inline: auto;
}
.worker-shell .content:has(> :is(.product-form, .games-layout, #catalogo, [data-contingency-page])) {
  max-width: 728px;
}
.worker-shell .content:has(> .command-detail) {
  max-width: 798px;
}

.login-password-field { position: relative; margin-bottom: 14px; }
.login-password-field input { min-width: 0; margin: 0; padding-inline-end: 48px; }
.login-password-field input::-ms-reveal { display: none; }
.login-access .login-password-toggle {
  position: absolute;
  inset: 50% 3px auto auto;
  transform: translateY(-50%);
  display: grid;
  place-items: center;
  width: 44px;
  min-height: 44px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--green-800);
}
.login-password-toggle svg { width: 20px; height: 20px; }
.login-password-field input[type="text"] + .login-password-toggle [data-eye-slash],
.login-access .login-password-toggle[hidden] { display: none; }

.login-access .login-privacy { margin: 22px 0 0; }

.worker-shell .catalog-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 12px; align-items: start; }
.worker-shell .catalog-card { margin: 0; }
.worker-shell :is(.catalog-card summary, .product-grid .product-quick-button) {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center; gap: 9px; text-align: left;
}
.worker-shell .catalog-card summary { list-style: none; cursor: pointer; }
.worker-shell .catalog-card summary::-webkit-details-marker { display: none; }
.worker-shell .catalog-card[open] form { margin-top: 12px; }
.worker-shell .catalog-edit { grid-column: 2 / -1; color: var(--green-700); font-size: .8rem; }
.worker-shell .product-category-icon {
  width: 30px; height: 30px; padding: 5px; border-radius: 8px;
  background: var(--green-100); color: var(--green-800);
}
.worker-shell .product-card-info { display: grid; gap: 2px; overflow-wrap: anywhere; color: inherit; }
.worker-shell .product-card-info small { color: var(--muted); font-size: .75rem; }
.worker-shell .product-card-price { color: var(--green-800); white-space: nowrap; font-size: .86rem; }
@media (max-width: 440px) {
  .worker-shell .product-grid .product-quick-button { grid-template-columns: auto minmax(0, 1fr); }
  .worker-shell .product-quick-button .product-card-price { grid-column: 2; }
}

.worker-shell .staff-access-list { list-style: none; padding: 0; margin: 0; }
.worker-shell .staff-access-row {
  display: grid; grid-template-columns: minmax(0, 1fr) auto;
  align-items: center; gap: 10px; padding-block: 8px;
}
.worker-shell .staff-access-row + .staff-access-row { border-top: 1px solid var(--line); }
.worker-shell .staff-access-row span { overflow-wrap: anywhere; }
.worker-shell .staff-access-row form { margin: 0; }

.worker-shell .command-update-status {
  width: min(100%, 750px); margin: 0 auto 8px; color: var(--green-800); font-size: .85rem;
}
.worker-shell .command-update-status:empty { margin-bottom: 0; }
.worker-shell .row-quantity {
  display: inline-grid; grid-template-columns: 34px minmax(22px, auto) 34px;
  align-items: center; gap: 3px; text-align: center; margin: 0;
}
.worker-shell .row-quantity button { min-height: 36px; padding: 0; }
.worker-shell .row-quantity button:disabled { opacity: .55; }
@media (max-width: 540px) {
  .worker-shell .command-items-table tbody tr:has(.row-quantity) {
    grid-template-areas: "name name action" "date date date" "qty qty qty" "unit unit subtotal";
  }
}

.worker-shell .bottom-nav-notice {
  position: fixed; z-index: 55; left: 50%; bottom: 98px; transform: translateX(-50%);
  width: max-content; max-width: calc(100% - 32px); margin: 0;
  padding: 6px 12px; border-radius: 8px; background: #fff;
  color: var(--green-950); box-shadow: var(--shadow); font-size: .85rem;
}

.worker-shell .date-control input[type="date"] { padding-block: 0; line-height: normal; }
.worker-shell .date-control input[type="date"]::-webkit-datetime-edit {
  display: flex; align-items: center; height: 100%;
}
.worker-shell .catalog-heading h1 { margin-bottom: 0; }
.worker-shell #new-product-dialog { width: min(480px, calc(100% - 28px)); }

.worker-shell .finance-filters { padding: 10px 12px; }
.worker-shell .finance-period { display: flex; flex-wrap: wrap; align-items: end; gap: 8px 12px; }
.worker-shell .finance-period-dates { flex: 0 1 320px; grid-template-columns: repeat(2,minmax(0,1fr)); min-width: 0; }
.worker-shell .finance-period-group { width: min(100%, 128px); }
.worker-shell .finance-period :is(input[type="date"],select,button) { min-height: 38px; height: 38px; }
.worker-shell .finance-period-actions { gap: 8px 12px; }
.worker-shell .finance-period-actions a { font-size: .82rem; }

.worker-shell .bi-chart, .worker-shell .bi-legend { padding: 0; list-style: none; }
.worker-shell .bi-legend { display: flex; gap: 6px 14px; flex-wrap: wrap; margin: 10px 0 8px; font-size: .8rem; }
.worker-shell .bi-legend li { display: flex; align-items: center; gap: 6px; }
.worker-shell .bi-swatch { width: 10px; height: 10px; border-radius: 3px; background: var(--bi-color); }
.worker-shell :is(.bi-bar,.bi-swatch) { --bi-color: #287254; }
.worker-shell :is(.bi-bar,.bi-swatch).expense { --bi-color: #a44535; }
.worker-shell :is(.bi-bar,.bi-swatch).sales { --bi-color: #286480; }
.worker-shell :is(.bi-bar,.bi-swatch).net { --bi-color: #745084; }
.worker-shell .bi-bar { fill: var(--bi-color); }
.worker-shell .bi-baseline { stroke: #a5b5ad; stroke-width: 1; }
.worker-shell .bi-plot { background: #f3f7f4; border-radius: 10px; padding: 6px; }
.worker-shell .bi-scroll { overflow-x: auto; }
.worker-shell .bi-chart {
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(44px,1fr);
  margin: 0; padding: 0;
}
.worker-shell button.bi-point {
  display: grid; justify-items: center; gap: 4px; padding: 0 2px 6px; width: 100%;
  border: 0; background: transparent; color: inherit;
  border-radius: 6px; font-size: clamp(.6rem,1vw,.75rem);
}
.worker-shell .bi-point svg { width: 100%; height: 106px; display: block; }
.worker-shell .bi-point:hover, .worker-shell .bi-point:focus-visible { background: #e1eee6; }
.worker-shell .bi-tooltip {
  min-height: 42px; margin-bottom: 4px; padding: 5px 8px; border-radius: 7px;
  color: #fff; background: #123a2f; font-size: .75rem; line-height: 1.3;
}
.worker-shell .bi-tooltip:empty { visibility: hidden; }

.monthly-table { overflow-x: auto; }
@media (prefers-reduced-motion: no-preference) {
  .monthly-report .bi-bar { transform-box: fill-box; transform-origin: center bottom; animation: monthly-grow .55s ease-out; }
  .monthly-report .metric-card strong { animation: monthly-reveal .45s ease-out; }
}
@keyframes monthly-grow { from { transform: scaleY(0); } to { transform: scaleY(1); } }
@keyframes monthly-reveal { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@media print {
  .worker-shell:has(.monthly-report) .offline-banner { display: none; }
  .monthly-report .monthly-table { overflow: visible; }
  .monthly-report tr { break-inside: avoid; }
}
