#bottles { line-height:1.6; }
#bottles .subcopy { color:#526273; }
.bottle-toolbar { padding:16px 18px; margin-bottom:16px; box-shadow:none; }
.bottle-controls { display:flex; flex-wrap:wrap; gap:14px; }
.bottle-controls label { display:grid; gap:5px; color:#405268; font-size:12px; min-width:0; }
.bottle-controls label:first-child { flex:1 1 240px; }
.bottle-controls label:last-child { flex:0 1 160px; }
.bottle-controls input,.bottle-controls select { width:100%; min-height:40px; padding:8px 10px; border:1px solid var(--line); border-radius:8px; background:var(--white); color:var(--ink); }
.bottle-toolbar-meta { display:flex; flex-wrap:wrap; gap:6px 20px; margin-top:12px; color:#526273; font-size:12px; }
.bottle-toolbar-meta p { margin:0; }
#bottleCount { font-weight:700; color:var(--navy); }
.bottle-message { color:#225b48; margin:0 0 12px; font-size:13px; }
.bottle-message:empty { display:none; }
.bottle-message.error { color:#943e26; }
.bottle-list { display:grid; gap:12px; }
.bottle-record { padding:18px 20px; }
.bottle-record-head { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-start; gap:10px 16px; }
.bottle-record h2 { font-family:inherit; font-size:17px; line-height:1.5; font-weight:700; margin:0; overflow-wrap:anywhere; flex:1 1 260px; min-width:0; }
.bottle-state { color:#5e4b27; background:#f4ead8; border-radius:999px; padding:4px 10px; font-size:12px; }
.bottle-state.closed { color:#265943; background:#e7f1eb; }
.bottle-details { display:grid; grid-template-columns:1fr 1.25fr 1fr .8fr; gap:14px 20px; margin:16px 0 0; }
.bottle-details > div { min-width:0; }
.bottle-details dt { font-size:12px; color:#526273; margin-bottom:4px; }
.bottle-details dd { margin:0; color:var(--ink); overflow-wrap:anywhere; }
.bottle-days { font-weight:700; color:var(--navy); }
.bottle-record-foot { display:flex; align-items:flex-start; gap:12px; justify-content:space-between; border-top:1px solid #e9e3d8; margin-top:15px; padding-top:12px; }
.bottle-result { margin:0; flex:1; min-width:0; overflow-wrap:anywhere; font-size:13px; }
.bottle-result span { display:block; white-space:pre-wrap; }
.bottle-result small { color:#526273; font-size:12px; }
.bottle-record-foot button { flex:0 0 auto; }
.bottle-storage-note { color:#526273; font-size:12px; margin:18px 0 0; max-width:72ch; }
.bottle-empty { padding:30px 20px; text-align:center; color:#526273; }
.bottle-empty h2 { font-family:inherit; font-size:17px; line-height:1.6; font-weight:700; margin-bottom:8px; }
.bottle-empty p { font-size:13px; margin:0; }
.bottle-dialog { width:min(660px,calc(100% - 24px)); max-height:calc(100dvh - 24px); border:1px solid var(--line); border-radius:16px; padding:24px; color:var(--ink); background:var(--white); box-shadow:var(--shadow); }
.bottle-dialog::backdrop { background:rgba(9,25,43,.42); }
.bottle-dialog h2 { font-family:inherit; font-size:23px; line-height:1.4; }
.bottle-dialog .form-row { gap:14px; }
.bottle-dialog .form-field { margin:12px 0; min-width:0; }
.bottle-dialog label { color:#405268; }
.bottle-dialog input,.bottle-dialog textarea,.bottle-dialog select { min-height:42px; min-width:0; }
.bottle-dialog .form-help { color:#526273; font-size:12px; line-height:1.6; }
.bottle-dialog output { display:block; padding:10px 12px; border-radius:8px; background:#e9f0f5; color:var(--navy); font-size:13px; }
.bottle-dialog .bottle-delete { margin-right:auto; color:#943e26; }
.bottle-dialog [hidden] { display:none!important; }
.bottle-dialog :focus-visible,#bottles :focus-visible { outline:2px solid #895e1e; outline-offset:3px; }
@media(max-width:780px) { .bottle-details { grid-template-columns:1fr 1fr; } }
@media(max-width:480px) {
  .bottle-record { padding:16px; }
  .bottle-details { grid-template-columns:1fr; gap:12px; }
  .bottle-record h2 { flex-basis:100%; }
  .bottle-dialog { padding:18px; }
  .bottle-dialog .form-row { grid-template-columns:1fr; gap:0; }
  .bottle-dialog .modal-foot { gap:10px; }
  .bottle-toolbar { padding:14px; }
}