/* The Dive Log sign-up, styled to sit under the message bottle. Uses the page's colour variables. */
.dive-log{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:2.5rem;align-items:start;margin:4rem 0 2rem;
  padding:2rem;border:1px solid var(--line,rgba(116,247,188,.15));background:rgba(5,20,28,.72)}
.dive-log h2{margin:.3rem 0 .6rem;font-size:clamp(1.8rem,3.4vw,2.6rem);line-height:1.05;letter-spacing:-.03em}
.dive-log-form{display:grid;gap:.9rem}
.dl-row{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}
.dive-log-form label{display:grid;gap:.35rem;font:11px var(--mono,ui-monospace,monospace);letter-spacing:.1em;text-transform:uppercase;color:var(--dim,#90a39d)}
.dive-log-form label small{letter-spacing:.04em;text-transform:none;opacity:.7}
.dive-log-form input,.dive-log-form select{width:100%;min-height:44px;padding:0 .75rem;border:1px solid rgba(116,247,188,.25);border-radius:0;
  background:rgba(2,7,11,.6);color:var(--ink,#d9e7e2);font:15px var(--sans,system-ui,sans-serif);text-transform:none;letter-spacing:0}
.dive-log-form input:focus-visible,.dive-log-form select:focus-visible{outline:2px solid var(--green,#74f7bc);outline-offset:1px}
.dive-log-form button{justify-self:start;cursor:pointer}
.dive-log-form button[disabled]{opacity:.6;cursor:progress}
.dl-fine{margin:0;color:var(--faint,#61736e);font-size:12px;max-width:52ch}
.dl-status{margin:0;min-height:1.2em;font:13px var(--mono,ui-monospace,monospace);color:var(--green,#74f7bc)}
.dl-status.error{color:#ff9d8a}
@media (max-width:760px){.dive-log{grid-template-columns:1fr;padding:1.4rem;gap:1.4rem}.dl-row{grid-template-columns:1fr}}