.gdoc-wrap{max-width: 100%; overflow-x:auto;}

/* Mobile: keep white sheet background continuous while scrolling / panning */
.gdoc-wrap{ background:#ffffff; -webkit-overflow-scrolling: touch; }
.gdoc-sheet{ display:inline-block; min-width: max-content; background:#ffffff; }
.gdoc-sheet table{ background:#ffffff; }

.gdoc-sheet{background:#ffffff; color:#000000; margin: 0 auto;}
/* Keep the Google-docs exported page padding/width if you want exact match */
.gdoc-sheet{max-width:468pt; padding:72pt;}
/* Ensure the table doesn't inherit site table styling */
.gdoc-sheet table{border-collapse:collapse;}

  

  /* === Interactive layer (scoped to the Google Docs sheet) === */
  .gdoc-sheet .gdoc-group{ white-space:nowrap; }

  .gdoc-sheet button.gdoc-dot-btn,
  .gdoc-sheet button.gdoc-box-btn{
    appearance:none;
    -webkit-appearance:none;
    border:0;
    background:transparent;
    padding:0;
    margin:0;
    font: inherit;
    line-height:1;
    cursor:pointer;
    vertical-align:baseline;
  }

  .gdoc-sheet button.gdoc-dot-btn{ letter-spacing:0; }

  .gdoc-sheet button.gdoc-dot-btn:focus-visible,
  .gdoc-sheet button.gdoc-box-btn:focus-visible,
  .gdoc-sheet .gdoc-edit:focus-visible{
    outline:2px solid rgba(159,122,234,0.65);
    outline-offset:2px;
  }

  /* Box highlight without changing glyphs */
  .gdoc-sheet button.gdoc-box-btn{
    display:inline-block;
    width: 0.95em;
    height: 1.05em;
    border-radius:2px;
  }
  .gdoc-sheet button.gdoc-box-btn.on{
    background: rgba(159,122,234,0.20);
    box-shadow: inset 0 0 0 1px rgba(159,122,234,0.45);
  }

  /* Make blank fields editable but visually invisible (looks like Docs blanks) */
  .gdoc-sheet .gdoc-edit{
    min-height: 1em;
    height: auto !important;
    line-height: 1.15 !important;
    white-space: pre-wrap;
    word-break: break-word;
    padding: 0 !important;
  }

  /* Trim excess whitespace inside editable table cells */
  .gdoc-sheet td.gdoc-edit-td,
  .gdoc-sheet th.gdoc-edit-td{
    padding: 2pt !important;
  }

  /* Some exported paragraph classes force a fixed 11pt height */
  .gdoc-sheet td.gdoc-edit-td p{
    height: auto !important;
    min-height: 11pt;
  }

  /* Toolbar buttons should look like your site buttons, but keep size reasonable */
  .sheet-controls{ display:flex; gap:.5rem; flex-wrap:wrap; align-items:center; }
  .sheet-controls .hint{ color: var(--muted); font-size: .95rem; }

/* Notes section borders */
tr.notes-row td{ border: 1px solid rgba(0,0,0,0.35); }


/* --- Minor layout tweaks --- */

/* Center the OFFENSE column header labels (Weapon ... Tags) */
tr.offense-cols td, tr.offense-cols th{
  text-align:center !important;
}

/* Right-align the B / L / A labels in the SOAKS mini-row */
tr.soak-bla-row td, tr.soak-bla-row th{
  text-align:right !important;
  padding-right:6px !important;
}

/* Notes | Contacts | Gear section borders to match table grid */
tr.notes-hdr td, tr.notes-hdr th,
tr.notes-row td, tr.notes-row th{
  border: 1px solid #000 !important;
}

/* Tame the browser “pink haze” focus/checked visuals on checkboxes */
.gdoc-sheet input[type="checkbox"]{
  accent-color: rgba(159,122,234,0.9);
}
.gdoc-sheet input[type="checkbox"]:focus,
.gdoc-sheet input[type="checkbox"]:focus-visible{
  outline: 2px solid rgba(255,255,255,0.55) !important;
  outline-offset: 2px;
  box-shadow: none !important;
}


/* --- Override browser checkbox focus/checked glow ("pink haze") --- */
.gdoc-sheet input[type="checkbox"]{
  accent-color: rgba(159,122,234,0.9);
  box-shadow: none !important;
  filter: none !important;
}

.gdoc-sheet input[type="checkbox"]:focus,
.gdoc-sheet input[type="checkbox"]:focus-visible,
.gdoc-sheet input[type="checkbox"]:checked:focus,
.gdoc-sheet input[type="checkbox"]:checked:focus-visible{
  outline: 2px solid rgba(255,255,255,0.55) !important;
  outline-offset: 2px;
  box-shadow: none !important;
  filter: none !important;
}

/* WebKit specific glow removal */
.gdoc-sheet input[type="checkbox"]::-webkit-focus-inner{
  border: 0;
}

/* Remove any focus ring applied by buttons next to boxes */
.gdoc-sheet button.gdoc-box-btn:focus-visible,
.gdoc-sheet button.gdoc-dot-btn:focus-visible{
  outline: 2px solid rgba(255,255,255,0.55) !important;
  box-shadow: none !important;
}


/* --- Solar gold focus/active glow for square box buttons --- */
.gdoc-sheet button.gdoc-box-btn:focus,
.gdoc-sheet button.gdoc-box-btn:focus-visible,
.gdoc-sheet button.gdoc-box-btn.active{
  outline: 2px solid rgba(255, 204, 77, 0.9) !important;
  outline-offset: 2px;
  box-shadow:
    0 0 6px rgba(255, 204, 77, 0.9),
    0 0 12px rgba(255, 183, 0, 0.75),
    inset 0 0 2px rgba(255, 255, 200, 0.9) !important;
  background: rgba(255, 215, 100, 0.15);
}

/* Hover glow for Solar feel */
.gdoc-sheet button.gdoc-box-btn:hover{
  box-shadow:
    0 0 4px rgba(255, 204, 77, 0.7),
    0 0 8px rgba(255, 183, 0, 0.6);
}


/* --- Persistent Solar gold glow for marked boxes (checked state) --- */
.gdoc-sheet button.gdoc-box-btn.on{
  outline: 0 !important;
  box-shadow:
    0 0 5px rgba(255, 204, 77, 0.85),
    0 0 10px rgba(255, 183, 0, 0.70),
    inset 0 0 2px rgba(255, 255, 200, 0.85) !important;
  background: rgba(255, 215, 100, 0.12);
}

/* Focus ring stays Solar gold (no purple) */
.gdoc-sheet button.gdoc-box-btn:focus,
.gdoc-sheet button.gdoc-box-btn:focus-visible{
  outline: 2px solid rgba(255, 204, 77, 0.9) !important;
  outline-offset: 2px;
  box-shadow:
    0 0 6px rgba(255, 204, 77, 0.65),
    inset 0 0 2px rgba(255, 255, 200, 0.75) !important;
}

/* Dots can keep a light Solar focus ring too */
.gdoc-sheet button.gdoc-dot-btn:focus,
.gdoc-sheet button.gdoc-dot-btn:focus-visible{
  outline: 2px solid rgba(255, 204, 77, 0.9) !important;
  outline-offset: 2px;
  box-shadow: 0 0 6px rgba(255, 204, 77, 0.55) !important;
}


/* --- Circular Solar halo for marked boxes --- */
.gdoc-sheet button.gdoc-box-btn.on{
  position: relative;
  outline: none !important;
  box-shadow: none !important;
  background: transparent;
}

.gdoc-sheet button.gdoc-box-btn.on::after{
  content: '';
  position: absolute;
  inset: -6px;
  border-radius: 50%;
  box-shadow:
    0 0 10px rgba(255, 204, 77, 0.9),
    0 0 20px rgba(255, 183, 0, 0.65);
  pointer-events: none;
}

/* Keep gold focus ring */
.gdoc-sheet button.gdoc-box-btn:focus,
.gdoc-sheet button.gdoc-box-btn:focus-visible{
  outline: 2px solid rgba(255, 204, 77, 0.9) !important;
  outline-offset: 2px;
}


/* --- Mobile: make cards edge-to-edge (full-width) --- */
@media (max-width: 700px){
  body{ margin:0; }
  main{ padding-left:0 !important; padding-right:0 !important; }
  main > .card{
    width:100% !important;
    max-width:none !important;
    margin-left:0 !important;
    margin-right:0 !important;
    border-radius:0 !important;
    border-left:0 !important;
    border-right:0 !important;
  }
}




/* --- Trim outer white margin around the sheet --- */
.gdoc-wrap{
  padding: 10px !important; /* reduced */
}
.gdoc-sheet{
  padding: 0 !important;
}