/* sheet.css — bottom sheet under 768px, centred modal above. */
.sheet-backdrop { position: fixed; inset: 0; z-index: 60; display: flex; align-items: flex-end; justify-content: center; background: rgba(20, 30, 32, .55); opacity: 0; transition: opacity var(--t-fast) var(--ease); }
.sheet-backdrop.open { opacity: 1; }
.sheet { width: 100%; max-width: 600px; max-height: 88vh; display: flex; flex-direction: column; background: var(--bg); border: 1px solid var(--line); border-bottom: 0; border-radius: var(--radius) var(--radius) 0 0; box-shadow: var(--shadow); padding: 8px 20px calc(18px + env(safe-area-inset-bottom, 0px)); transform: translateY(24px); transition: transform var(--t-fast) var(--ease); overflow: hidden; }
.sheet-backdrop.open .sheet { transform: none; }
.sheet-grab { width: 44px; height: 5px; margin: 4px auto 10px; border-radius: 3px; background: var(--line-hover); }
.sheet-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 10px; }
.sheet-head h2 { font-size: var(--fs-2); }
.sheet-x { width: 44px; height: 44px; flex: none; display: grid; place-items: center; border-radius: 50%; color: var(--ink-dim); background: var(--card); border: 1px solid var(--line); font-size: 18px; }
.sheet-body { overflow-y: auto; min-height: 0; padding-right: 2px; }
.sheet-confirm { font-size: var(--fs-3); }
.sheet-error { margin: 10px 0 0; padding: 10px 12px; border-radius: var(--radius-s); background: var(--bad-dim); color: var(--bad); font-weight: 600; font-size: var(--fs-small); }
.sheet-actions { display: flex; gap: 10px; justify-content: flex-end; padding-top: 16px; flex-wrap: wrap; }
.sheet-actions .btn { flex: 1 1 120px; }
@media (min-width: 768px) {
  .sheet-backdrop { align-items: center; padding: 24px; }
  .sheet { border-radius: var(--radius); border-bottom: 1px solid var(--line); padding-bottom: 20px; transform: translateY(10px) scale(.985); }
  .sheet-backdrop.open .sheet { transform: none; }
  .sheet-grab { display: none; }
  .sheet-actions .btn { flex: none; }
}

/* Forms */
.form { display: grid; grid-template-columns: 1fr; gap: 12px; }
@media (min-width: 560px) { .form { grid-template-columns: 1fr 1fr; } .field-wide { grid-column: 1 / -1; } }
.form-intro { grid-column: 1 / -1; color: var(--ink-dim); font-size: var(--fs-small); }
.field { display: block; font-size: var(--fs-small); }
.field-label { display: block; margin-bottom: 6px; font-weight: 700; color: var(--ink); }
.field-label i { color: var(--bad); font-style: normal; }
.field-hint { display: block; margin-top: 5px; color: var(--ink-dim); }
.field :is(input, select, textarea) { display: block; width: 100%; min-height: var(--tap); padding: 10px 12px; border: 1px solid var(--line-hover); border-radius: var(--radius-s); background: var(--card); color: var(--ink); font: inherit; font-size: var(--fs-body); }
.field textarea { line-height: 1.5; resize: vertical; }