:root{--wax: #191512;--wax-deep: #120f0d;--sleeve: #26201a;--sleeve-edge: #382f26;--paper: #f3e9d7;--groove: #9a8b78;--impulse: #f26419;--impulse-deep: #c94e0e;--bluenote: #5aa9e6;--danger: #d64545;--radius: 10px;--font-display: "Big Shoulders Display", "Arial Narrow", sans-serif;--font-body: "Archivo", system-ui, sans-serif}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--wax);color:var(--paper);font-family:var(--font-body);font-size:16px;line-height:1.4}button,input,select,textarea{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--bluenote);outline-offset:2px}.app{max-width:640px;margin:0 auto;padding:16px 16px 110px}.header{display:flex;align-items:baseline;justify-content:space-between;padding:8px 2px 14px}.wordmark{font-family:var(--font-display);font-weight:700;font-size:34px;letter-spacing:.06em;text-transform:uppercase;margin:0}.wordmark:first-letter{color:var(--impulse)}.header__count{color:var(--groove);font-size:14px;margin-left:auto}.header__signout{margin-left:14px;padding:0;background:none;border:none;color:var(--groove);font-size:14px;text-decoration:underline;cursor:pointer}.header__signout:hover{color:var(--paper)}.login{max-width:360px;margin:0 auto;padding:18vh 20px 40px}.login .wordmark{text-align:center;margin-bottom:24px}.tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;background:var(--wax-deep);border-radius:var(--radius);padding:5px}.tabs__tab{font-family:var(--font-display);font-weight:600;font-size:19px;letter-spacing:.08em;text-transform:uppercase;padding:10px 8px;background:transparent;color:var(--groove);border:none;border-radius:7px;cursor:pointer}.tabs__tab.is-active{background:var(--sleeve-edge);color:var(--bluenote)}.tabs__tab--wanted.is-active{color:var(--impulse)}.search{margin:12px 0 10px}.search input{width:100%;padding:12px 14px;background:var(--sleeve);border:1px solid var(--sleeve-edge);border-radius:var(--radius);color:var(--paper)}.search input::placeholder{color:var(--groove)}.sort{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 2px 16px}.sort__label{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--groove);margin-right:4px}.sort__option,.view__option{padding:6px 14px;font-size:13px;font-weight:600;background:transparent;color:var(--groove);border:1px solid var(--sleeve-edge);border-radius:999px;cursor:pointer}.sort__option.is-active,.view__option.is-active{background:var(--sleeve-edge);color:var(--paper)}.view{display:flex;gap:6px;margin-left:auto}.record-group+.record-group{margin-top:14px}.record-group__title{position:sticky;top:0;z-index:1;display:flex;align-items:center;gap:10px;margin:0;padding:10px 2px 8px;background:var(--wax);font-family:var(--font-display);font-weight:700;font-size:18px;letter-spacing:.07em;text-transform:uppercase}.record-group__title:after{content:"";flex:1;height:1px;background:var(--sleeve-edge)}.record-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}.card{position:relative;overflow:hidden;background:var(--sleeve);border:1px solid var(--sleeve-edge);border-radius:var(--radius)}.card__body{display:flex;align-items:center;gap:12px;width:100%;padding:12px 72px 12px 12px;background:none;border:none;text-align:left;cursor:pointer}.card__text{display:flex;flex-direction:column;gap:2px;min-width:0}.card__cover{flex-shrink:0;width:56px;height:56px;border-radius:6px;object-fit:cover;background:var(--wax-deep);border:1px solid var(--sleeve-edge)}.card__cover--empty{position:relative}.card__cover--empty:after{content:"";position:absolute;top:50%;left:50%;width:6px;height:6px;transform:translate(-50%,-50%);border-radius:50%;background:var(--sleeve-edge)}.card__title{font-family:var(--font-display);font-weight:700;font-size:20px;letter-spacing:.05em;text-transform:uppercase;line-height:1.1}.card__artist{font-size:15px}.card__year{color:var(--groove);font-family:var(--font-body);font-weight:400;font-size:14px;letter-spacing:normal;text-transform:none}.card__meta{color:var(--groove);font-size:13px;letter-spacing:.02em}.card__notes{color:var(--groove);font-size:13px;font-style:italic;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.card__found{position:relative;z-index:1;margin:0 16px 14px;padding:8px 14px;align-self:flex-start;display:inline-block;font-weight:600;font-size:14px;background:var(--impulse);color:var(--wax-deep);border:none;border-radius:999px;cursor:pointer}.card__found:hover{background:var(--impulse-deep)}.record-list--grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px 10px}.record-list--grid .card__body{flex-direction:column;align-items:stretch;gap:8px;padding:8px 8px 10px}.record-list--grid .card__cover{display:block;width:100%;height:auto;aspect-ratio:1}.record-list--grid .card__title{font-size:15px}.record-list--grid .card__artist{font-size:13px}.record-list--grid .card__meta{font-size:11px}.record-list--grid .card__notes{display:none}.record-list--grid .card__found{margin:0 8px 10px;padding:5px 10px;font-size:12px}.empty{text-align:center;color:var(--groove);padding:56px 16px}.empty__title{font-family:var(--font-display);font-weight:600;font-size:24px;letter-spacing:.06em;text-transform:uppercase;color:var(--paper);margin:0 0 6px}.empty p{margin:0}.fab{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));padding:14px 22px;font-family:var(--font-display);font-weight:700;font-size:18px;letter-spacing:.08em;text-transform:uppercase;background:var(--paper);color:var(--wax-deep);border:none;border-radius:999px;box-shadow:0 4px 18px #00000080;cursor:pointer}.fab:hover{background:#fff8ea}.sheet-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0a0806b3;display:flex;align-items:flex-end;justify-content:center;z-index:10;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.sheet{width:100%;max-width:640px;max-height:92dvh;overflow-y:auto;background:var(--sleeve);border:1px solid var(--sleeve-edge);border-bottom:none;border-radius:16px 16px 0 0;padding:10px 20px calc(20px + env(safe-area-inset-bottom));animation:sheet-up .22s ease}@keyframes sheet-up{0%{transform:translateY(24px);opacity:0}}.sheet__handle{width:42px;height:4px;border-radius:2px;background:var(--sleeve-edge);margin:0 auto 10px}.sheet__title{font-family:var(--font-display);font-weight:700;font-size:24px;letter-spacing:.06em;text-transform:uppercase;margin:0 0 14px}.form{display:flex;flex-direction:column;gap:14px}.form__status{display:grid;grid-template-columns:1fr 1fr;gap:6px;background:var(--wax-deep);border-radius:var(--radius);padding:5px}.form__status-option{padding:10px 8px;font-weight:600;font-size:14px;background:transparent;color:var(--groove);border:none;border-radius:7px;cursor:pointer}.form__status-option--owned.is-active{background:var(--sleeve-edge);color:var(--bluenote)}.form__status-option--wanted.is-active{background:var(--sleeve-edge);color:var(--impulse)}.field{display:flex;flex-direction:column;gap:5px;flex:1}.field__label{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--groove)}.field input,.field select,.field textarea{width:100%;padding:11px 12px;background:var(--wax-deep);border:1px solid var(--sleeve-edge);border-radius:8px;color:var(--paper)}.field textarea{resize:vertical}.field-row{display:flex;gap:12px}.suggest{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}.suggest__option{padding:7px 13px;font-size:13px;background:var(--wax-deep);color:var(--paper);border:1px solid var(--sleeve-edge);border-radius:999px;cursor:pointer}.suggest__option:hover{border-color:var(--groove)}.cover-edit{display:flex;gap:12px;align-items:flex-start}.cover-edit__preview{flex-shrink:0;width:84px;height:84px;border-radius:8px;object-fit:cover;background:var(--wax-deep);border:1px solid var(--sleeve-edge)}.cover-edit__preview--empty{display:block}.cover-edit__controls{display:flex;flex-wrap:wrap;gap:8px;align-items:center;flex:1;min-width:0}.cover-edit__url{width:100%;padding:9px 12px;background:var(--wax-deep);border:1px solid var(--sleeve-edge);border-radius:8px;color:var(--paper);font-size:14px}.cover-edit__url::placeholder{color:var(--groove)}.btn--small{padding:9px 14px;font-size:14px;cursor:pointer}.form__error{margin:0;color:var(--danger);font-size:14px}.form__actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}.btn{padding:12px 18px;font-weight:600;background:var(--wax-deep);color:var(--paper);border:1px solid var(--sleeve-edge);border-radius:999px;cursor:pointer}.btn--primary{background:var(--paper);color:var(--wax-deep);border-color:var(--paper);flex:1}.btn--primary:disabled{opacity:.6;cursor:default}.btn--danger-ghost{color:var(--danger);border-color:var(--danger);background:transparent}.btn--danger{background:var(--danger);border-color:var(--danger);color:#fff}.toast{position:fixed;left:50%;bottom:max(88px,calc(env(safe-area-inset-bottom) + 72px));transform:translate(-50%);background:var(--paper);color:var(--wax-deep);font-weight:500;font-size:14px;padding:10px 18px;border-radius:999px;box-shadow:0 4px 18px #00000080;z-index:20;max-width:calc(100vw - 32px)}@media(min-width:700px){.app{padding-top:32px}.sheet-overlay{align-items:center;padding:24px}.sheet{border-radius:16px;border-bottom:1px solid var(--sleeve-edge);max-width:480px}}@media(prefers-reduced-motion:reduce){.sheet{animation:none}}