.roto-page { max-width: 1440px; margin: 0 auto; }
.roto-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:20px; }
.roto-heading h2 { margin:4px 0 8px; font-size:30px; letter-spacing:-.7px; }
.roto-heading p { margin:4px 0; }
.roto-eyebrow { font-size:11px; font-weight:700; letter-spacing:1.8px; color:#23715b; }
.roto-actions { display:flex; flex-wrap:wrap; gap:8px; }
.roto-page button { min-height:42px; }
.roto-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.roto-page .roto-stat { padding:20px; border:1px solid var(--border); background:var(--panel); border-radius:14px; text-align:left; color:var(--text); }
.roto-stat span { display:block; font-size:13px; color:var(--muted); }
.roto-stat strong { display:block; font-size:32px; margin-top:8px; }
.roto-message { padding:14px 16px; border-radius:10px; background:#eff6f3; color:#31574a; font-size:13px; line-height:1.6; }
.roto-filters { display:flex; gap:12px; margin-top:22px; }
.roto-filters input { flex:1; min-width:0; }
.roto-filters select { width:220px; }
.roto-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.roto-product { padding:18px; background:var(--panel); border:1px solid var(--border); border-radius:14px; }
.roto-product-top { display:flex; align-items:center; gap:14px; }
.roto-product h3 { margin:0 0 6px; font-size:15px; overflow-wrap:anywhere; }
.roto-thumb { width:80px; height:90px; flex-shrink:0; background:#fff; display:grid; place-items:center; border-radius:8px; overflow:hidden; font-size:11px; text-align:center; color:#64748b; }
.roto-thumb img { width:100%; height:100%; object-fit:contain; }
.roto-sku { font-size:11px; color:var(--muted); overflow-wrap:anywhere; }
.roto-status { display:inline-block; margin-top:8px; font-size:11px; padding:4px 8px; border-radius:20px; font-weight:600; }
.roto-status.uncounted { background:#edf0f4; color:#586578; }
.roto-status.low { background:#fff0df; color:#9a4e09; }
.roto-status.ok { background:#e6f4ec; color:#256447; }
.roto-balance { margin-top:16px; }
.roto-balance strong { font-size:30px; }
.roto-balance span { color:var(--muted); font-size:12px; }
.roto-product .roto-actions { margin-top:16px; }
.roto-product .roto-actions button { font-size:12px; padding:8px 10px; }
.roto-count-card { width:100%; max-width:540px; margin:16px auto; padding:24px; box-sizing:border-box; border-radius:18px; border:1px solid var(--border); background:var(--panel); }
.roto-count-card h3 { font-size:22px; margin:16px 0 6px; text-align:center; overflow-wrap:anywhere; }
.roto-count-card > .roto-sku { text-align:center; }
.roto-count-progress { display:flex; justify-content:space-between; gap:10px; font-size:12px; }
.roto-count-progress span { color:var(--muted); }
.roto-count-card progress { width:100%; height:6px; accent-color:#278567; margin:12px 0; }
.roto-photo { width:100%; height:260px; display:grid; place-items:center; background:#fff; border-radius:12px; color:#64748b; }
.roto-photo img { width:100%; height:100%; max-height:260px; object-fit:contain; }
.roto-count-card label { display:block; font-weight:600; font-size:14px; margin:14px 0 8px; }
.roto-count-card input { width:100%; box-sizing:border-box; }
#roto-count-quantity { font-size:24px; height:58px; }
.roto-error { color:#b42318; font-size:13px; margin:12px 0; line-height:1.5; }
.roto-count-buttons { display:flex; flex-direction:column; gap:9px; }
.roto-count-buttons button { width:100%; min-height:48px; }
.roto-count-buttons button[hidden] { display:none; }
.roto-movement { display:grid; gap:14px; }
.roto-master-modal { width:min(760px,95vw); max-height:90vh; overflow:auto; }
.roto-master-page .scroll-x { max-height:65vh; overflow:auto; }
.roto-master-page table { min-width:1000px; }
.roto-master-page th { position:sticky; top:0; background:var(--panel); z-index:1; }
.roto-master-fields { display:grid; gap:14px; }
.roto-master-field { display:grid; gap:7px; font-size:13px; }
.roto-master-field[hidden] { display:none; }
.roto-master-field input:not([type=checkbox]),.roto-master-field select { width:100%; min-width:0; }
.roto-master-field input[type=checkbox] { width:20px; height:20px; }
.roto-component-list { display:grid; gap:12px; }
.roto-component-row { display:grid; grid-template-columns:minmax(0,1fr) 110px auto; gap:8px; align-items:end; padding:12px; border:1px solid var(--border); border-radius:10px; }
.roto-history { max-width:850px; margin:20px auto; }
.roto-history-row { display:flex; flex-direction:column; gap:8px; padding:20px; margin-bottom:12px; border:1px solid var(--border); background:var(--panel); border-radius:12px; overflow-wrap:anywhere; }
.roto-history-row p { margin:0; }
@media(max-width:1100px) { .roto-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) {
  .roto-component-row { grid-template-columns:minmax(0,1fr); }
  .roto-heading h2 { font-size:25px; }
  .roto-stats { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .roto-page .roto-stat { padding:14px; }
  .roto-grid { grid-template-columns:1fr; }
  .roto-filters { flex-direction:column; }
  .roto-filters select { width:100%; }
  .roto-count-card { padding:16px; margin:8px auto; }
  .roto-photo,.roto-photo img { height:220px; max-height:220px; }
  .roto-count-card h3 { font-size:19px; }
}
.operations-shell { min-height:100vh; background:#f4f7f9; color:#172b35; }
.operations-header { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 24px; background:#123d3a; color:white; }
.operations-brand { color:white; font-size:22px; font-weight:750; text-decoration:none; }
.operations-account { display:flex; align-items:center; gap:12px; }
.operations-account button { color:white; border:1px solid #96b8af; background:transparent; }
.operations-nav { display:flex; gap:8px; padding:12px 24px; background:white; border-bottom:1px solid #d7e3df; position:sticky; top:0; z-index:20; }
.operations-nav a { padding:12px 24px; border-radius:10px; color:#224640; font-weight:700; text-decoration:none; text-align:center; }
.operations-nav a.active { background:#123d3a; color:white; }
.operations-body { max-width:1400px; margin:0 auto; padding:24px; }
.roto-product-search { position:relative; max-width:760px; margin:20px 0; }
.roto-product-search label { font-weight:700; display:block; }
.roto-product-search input { display:block; width:100%; margin-top:8px; min-height:54px; font-size:16px; background:white; }
.roto-search-results { position:absolute; left:0; right:0; top:85px; max-height:320px; overflow:auto; z-index:25; background:white; border:1px solid #acc7bf; border-radius:12px; box-shadow:0 10px 28px #153e3825; }
.roto-search-results button { width:100%; display:flex; flex-direction:column; gap:4px; align-items:flex-start; padding:14px; border:0; border-bottom:1px solid #e3eae7; border-radius:0; background:white; color:#172b35; text-align:left; overflow-wrap:anywhere; }
.roto-search-results button:hover,.roto-search-results button[aria-selected=true] { background:#e6f5ed; }
.roto-search-results button span { font-size:12px; color:#526c65; }
.roto-inward-product { display:flex; align-items:center; gap:24px; max-width:760px; margin:20px 0; padding:20px; border-radius:16px; border:1px solid #dbe6e1; background:white; }
.roto-inward-photo { width:210px; height:210px; flex-shrink:0; display:grid; place-items:center; background:#fafbf9; border-radius:12px; overflow:hidden; }
.roto-inward-photo img { width:100%; height:100%; object-fit:contain; }
.roto-inward-form { max-width:760px; display:grid; gap:16px; }
.roto-received-field { padding:24px; background:#e2f6e9; border:2px solid #278b59; border-radius:16px; }
.roto-received-field label { display:block; font-size:20px; font-weight:800; letter-spacing:.04em; color:#164f35; margin-bottom:14px; }
.roto-received-field input { width:100%; min-height:80px; font-size:38px; font-weight:750; background:white; color:#123b26; border:2px solid #258856; }
.roto-received-field p { margin-bottom:0; color:#28583d; }
.roto-inward-balance { font-weight:700; font-size:18px; }
.roto-inward-save { min-height:58px; font-size:19px; }
.roto-inward-error { color:#a12727; max-width:760px; }
.roto-inward-success { padding:20px; background:#dff3e4; border:1px solid #2d8653; border-radius:12px; max-width:760px; font-weight:650; }
.roto-page [hidden] { display:none !important; }
@media(max-width:600px) {
 .operations-header { padding:14px 16px; align-items:flex-start; }
 .operations-brand { font-size:18px; }
 .operations-account { flex-direction:column; align-items:flex-end; gap:4px; font-size:12px; }
 .operations-nav { padding:8px; gap:4px; }
 .operations-nav a { flex:1; padding:12px 6px; font-size:14px; }
 .operations-body { padding:16px; }
 .roto-inward-product { flex-direction:column; align-items:stretch; padding:16px; gap:12px; }
 .roto-inward-photo { width:100%; height:230px; }
 .roto-inward-product h2 { margin-top:0; font-size:21px; overflow-wrap:anywhere; }
 .roto-received-field { padding:18px; }
}
.operations-app { background:#f4f7f9; }
.operations-install-banner { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px max(16px,env(safe-area-inset-right)) 12px max(16px,env(safe-area-inset-left)); background:#e1eee8; color:#123d3a; }
.operations-install-banner[hidden] { display:none; }
.operations-install-banner strong,.operations-install-banner span { display:block; }
.operations-install-banner span { font-size:12px; margin-top:3px; }
.operations-install-button { background:#123d3a; color:white; border:0; min-height:46px; flex-shrink:0; font-size:15px; padding:10px 16px; border-radius:10px; }
.operations-install-dialog { max-width:520px; width:calc(100% - 32px); max-height:85dvh; overflow:auto; border:0; border-radius:18px; padding:24px; background:white; color:#172b35; box-sizing:border-box; }
.operations-install-dialog::backdrop { background:#102d3877; }
.operations-install-dialog ol { padding-left:22px; line-height:1.6; }
.operations-install-dialog li { margin-bottom:8px; }
.operations-install-dialog button { width:100%; min-height:48px; }
.operations-install-dialog h2 { margin-top:0; }
.roto-master-cards { display:grid; gap:14px; margin:12px 0; }
.roto-master-card { padding:18px; background:white; border:1px solid #dbe6e1; border-radius:14px; min-width:0; }
.roto-master-card h3 { font-size:18px; margin:8px 0 16px; overflow-wrap:anywhere; }
.roto-master-card img { width:100%; height:180px; object-fit:contain; border-radius:8px; }
.roto-master-card dl { margin:0; }
.roto-master-detail { padding:8px 0; border-top:1px solid #edf1ee; }
.roto-master-detail dt { font-size:12px; color:#536c63; margin-bottom:4px; }
.roto-master-detail dd { margin:0; font-size:15px; line-height:1.4; overflow-wrap:anywhere; }
.roto-master-card .roto-actions { margin-top:12px; }
@media(max-width:700px) {
 .operations-app input:not([type=checkbox]),.operations-app select,.operations-app textarea { font-size:16px; min-height:48px; }
 .operations-app button,.operations-nav a { touch-action:manipulation; }
 .operations-header { padding:12px 16px; padding-top:max(12px,env(safe-area-inset-top)); gap:10px; }
 .operations-brand { font-size:18px; min-width:0; }
 .operations-account { min-width:0; max-width:45%; }
 .operations-account span { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
 .operations-account button { min-height:44px; }
 .operations-nav { position:fixed; top:auto; bottom:0; left:0; right:0; border-top:1px solid #cadbd3; border-bottom:0; padding:8px max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left)); box-shadow:0 -3px 14px #123d3a12; z-index:40; }
 .operations-nav a { flex:1; min-width:0; min-height:48px; display:grid; place-items:center; padding:8px 6px; font-size:14px; }
 .operations-body { padding:16px 12px calc(94px + env(safe-area-inset-bottom)); min-width:0; }
 .operations-shell { min-height:100dvh; }
 .operations-install-banner strong { font-size:14px; }
 .operations-install-banner span { max-width:210px; font-size:11px; }
 .operations-app .roto-page button { min-height:48px; }
 .operations-app .roto-product .roto-actions button { flex:1; font-size:14px; }
 .operations-app .roto-heading h2 { font-size:24px; }
 .operations-app .roto-heading .roto-actions { width:100%; }
 .operations-app .roto-heading .roto-actions button { flex:1; }
 .operations-app .roto-filters { flex-direction:column; }
 .operations-app .roto-filters select { width:100%; }
 .operations-app .roto-master-card .roto-actions button { flex:1; }
 .operations-app .roto-master-modal { width:calc(100vw - 20px); max-height:calc(100dvh - 32px); padding:18px; box-sizing:border-box; }
 .operations-app .roto-master-modal .actions { display:flex; gap:10px; }
 .operations-app .roto-master-modal .actions button { flex:1; min-height:48px; }
 .operations-app .roto-component-row { grid-template-columns:minmax(0,1fr); }
 .operations-app #roto-count-quantity { font-size:28px; min-height:64px; }
 .operations-app #pots-received { font-size:36px; min-height:80px; }
 .operations-app .roto-inward-product { min-width:0; }
 .operations-app .roto-inward-product > div { min-width:0; }
 .operations-app .roto-inward-success { overflow-wrap:anywhere; }
}
