.admin-body { min-height: 100vh; background-image: linear-gradient(var(--line) 1px, transparent 1px); background-size: 100% 32px; }
.login { min-height: calc(100vh - 68px); display: grid; grid-template-columns: 7fr 5fr; align-items: center; gap: clamp(60px, 12vw, 180px); padding-block: 70px; }
.login h1, .editor h1 { margin: 0 0 25px; font: 650 clamp(3.5rem, 7vw, 7rem)/.86 var(--display); letter-spacing: -.07em; text-transform: uppercase; }
.login > div > p:last-child { max-width: 600px; color: var(--ink-soft); }
.pin-form { padding: 32px 0; border-block: 1px solid var(--ink); }
label { display: grid; gap: 8px; font: 600 .68rem/1.4 var(--mono); letter-spacing: .04em; text-transform: uppercase; }
input, textarea { width: 100%; border: 0; border-bottom: 1px solid var(--ink); border-radius: 0; background: color-mix(in srgb, var(--white) 60%, transparent); color: var(--ink); padding: 12px 10px; font: 500 1rem/1.5 var(--body); text-transform: none; }
textarea { resize: vertical; }
input:focus, textarea:focus { outline: 0; border-bottom-color: var(--stamp); box-shadow: 0 2px 0 var(--stamp); }
.pin-form input { margin-bottom: 20px; padding: 14px 4px; background: transparent; font: 600 1.5rem/1 var(--mono); letter-spacing: .25em; }
.ink-button, .paper-button, .line-button, .text-button { min-height: 44px; border: 0; cursor: pointer; }
.ink-button { padding: 12px 20px; background: var(--ink); color: var(--paper); font-weight: 700; }
.paper-button { padding: 11px 18px; border: 1px solid var(--ink); background: var(--paper); color: var(--ink); font-weight: 700; }
.line-button, .text-button { background: transparent; color: var(--ink); text-decoration: underline; text-underline-offset: 4px; }
.form-status { min-height: 1.5em; margin: 14px 0 0; color: var(--ink-soft); font-size: .85rem; }
.form-status.error { color: var(--stamp); font-weight: 600; }

.editor { padding-block: 80px 140px; }
.editor-head { display: grid; grid-template-columns: 8fr 4fr; align-items: end; gap: 50px; padding-bottom: 50px; border-bottom: 2px solid var(--ink); }
.record-meta { display: grid; justify-items: end; gap: 8px; font-family: var(--mono); text-transform: uppercase; }
.record-meta span { font-size: .62rem; }
.record-meta strong { font-size: 1.25rem; }
.editor form { max-width: 940px; margin-left: auto; }
fieldset { margin: 0; padding: 70px 0; border: 0; border-bottom: 1px solid var(--ink); }
legend { width: 100%; margin-bottom: 35px; padding: 0; font: 600 .76rem/1 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; margin-bottom: 28px; }
fieldset > label { margin-top: 28px; }
.repeat-list, .simple-list { border-top: 1px solid var(--line); }
.repeat-row { display: grid; grid-template-columns: 42px 1fr 190px 44px; gap: 16px; align-items: end; padding: 22px 0; border-bottom: 1px solid var(--line); }
.repeat-row > span, .simple-row > span { align-self: center; font: 500 .7rem/1 var(--mono); }
.repeat-copy { display: grid; gap: 12px; }
.simple-row { display: grid; grid-template-columns: 42px 1fr 44px; gap: 16px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--line); }
.remove-button { width: 44px; height: 44px; border: 0; background: transparent; color: var(--stamp); cursor: pointer; font-size: 1.2rem; }
.line-button { margin-top: 16px; }
.field-help { color: var(--ink-soft); }
.closing-field { margin-top: 50px; }
.action-bar { position: sticky; bottom: 0; z-index: 3; display: flex; justify-content: space-between; align-items: center; gap: 25px; padding: 16px 0; background: color-mix(in srgb, var(--paper) 94%, transparent); border-top: 1px solid var(--ink); backdrop-filter: blur(8px); }
.action-bar .form-status { margin: 0; }
.action-bar > div { display: flex; gap: 10px; flex-shrink: 0; }
button:disabled { opacity: .5; cursor: wait; }

dialog { width: min(1200px, calc(100% - 30px)); height: min(850px, calc(100% - 30px)); padding: 0; border: 1px solid var(--ink); background: var(--paper); }
dialog::backdrop { background: color-mix(in srgb, var(--ink) 70%, transparent); }
.preview-head { height: 56px; display: flex; justify-content: space-between; align-items: center; padding: 0 18px; border-bottom: 1px solid var(--ink); font: 500 .68rem/1 var(--mono); text-transform: uppercase; }
#preview-frame { width: 100%; height: calc(100% - 56px); border: 0; background: var(--paper); }

@media (max-width: 760px) {
  .login { grid-template-columns: 1fr; align-content: center; gap: 40px; }
  .editor-head { grid-template-columns: 1fr; }
  .record-meta { justify-items: start; }
  .field-grid { grid-template-columns: 1fr; }
  .repeat-row { grid-template-columns: 34px 1fr 44px; }
  .repeat-row > label { grid-column: 2; }
  .repeat-row > .remove-button { grid-column: 3; grid-row: 1; }
  .action-bar { position: static; display: block; }
  .action-bar > div { display: grid; margin-top: 15px; }
}
.finance-fields { margin-top: 36px; padding-top: 28px; border-top: 1px solid var(--line); }
.transaction-row { display: grid; grid-template-columns: 38px minmax(180px, 1.5fr) minmax(130px, .7fr) minmax(130px, .8fr) minmax(130px, .8fr) 44px; gap: 12px; align-items: center; padding: 15px 0; border-bottom: 1px solid var(--line); }
.transaction-row > span { font: 500 .68rem/1 var(--mono); }
.transaction-row input { min-width: 0; }
@media (max-width: 900px) {
  .transaction-row { grid-template-columns: 34px 1fr 44px; }
  .transaction-row > input { grid-column: 2; }
  .transaction-row > .remove-button { grid-column: 3; grid-row: 1; }
}