.userwm { display: grid; gap: .85rem; }
.userwm-intro { max-width: 50rem; margin: -.35rem 0 .25rem; color: var(--userpage-text-muted); font-size: .78rem; line-height: 1.5; }
.userwm-add-disclosure { border: 1px solid #cfe5de; border-radius: .9rem; background: #fbfefd; }
.userwm-add-disclosure[open] { border-color: #91d4c1; box-shadow: 0 8px 24px rgba(15, 118, 110, .08); }
.userwm-add-button { min-height: 3rem; display: grid; grid-template-columns: 1.5rem minmax(0, 1fr) 1.5rem; align-items: center; gap: .45rem; padding: .65rem .85rem; border-radius: .9rem; color: var(--userpage-accent-strong); cursor: pointer; list-style: none; font: 780 .76rem/1 inherit; }
.userwm-add-button::-webkit-details-marker { display: none; }
.userwm-add-button:hover { background: #eef9f5; }
.userwm-add-button .material-symbols-outlined { font-size: 1.05rem; }
.userwm-add-button__chevron { justify-self: end; color: var(--userpage-text-muted); transition: transform .18s ease; }
.userwm-add-disclosure[open] .userwm-add-button__chevron { transform: rotate(180deg); }
.userwm-add { overflow: hidden; border-top: 1px solid #dcece7; background: linear-gradient(180deg, #f8fcfb, #fff); }
.userwm-add > header { display: grid; grid-template-columns: 2.2rem minmax(0, 1fr); align-items: center; gap: .65rem; padding: .85rem .95rem .55rem; }
.userwm-add__icon { width: 2.2rem; height: 2.2rem; display: grid; place-items: center; border-radius: .7rem; background: #e1f5ee; color: #0f766e; }
.userwm-add__icon .material-symbols-outlined { font-size: 1.1rem; }
.userwm-add h3 { margin: 0; color: var(--userpage-text); font-size: .9rem; }
.userwm-add > p { margin: 0; padding: 0 .95rem .7rem; color: var(--userpage-text-muted); font-size: .7rem; }
.userwm-add-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; padding: .85rem .95rem .95rem; border-top: 1px solid #edf4f1; }
.userwm-add-form label { display: grid; gap: .3rem; color: var(--userpage-text-mid); font-size: .7rem; font-weight: 700; }
.userwm-add-form label span { display: flex; align-items: baseline; justify-content: space-between; gap: .5rem; }
.userwm-add-form label small { color: var(--userpage-text-muted); font-size: .6rem; font-weight: 600; }
.userwm-add-form input { width: 100%; min-height: 2.4rem; padding: .55rem .7rem; border: 1px solid var(--userpage-border); border-radius: .7rem; background: #fff; color: var(--userpage-text); font: .78rem inherit; }
.userwm-add-form input:focus { outline: 0; border-color: var(--userpage-accent); box-shadow: 0 0 0 3px rgba(16,185,129,.12); }
.userwm-add-form footer { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding-top: .25rem; }
.userwm-add-form footer p { display: flex; align-items: center; gap: .3rem; margin: 0; color: var(--userpage-text-muted); font-size: .65rem; }
.userwm-add-form footer p .material-symbols-outlined { color: #0f766e; font-size: .9rem; }
.userwm-list { display: grid; gap: .7rem; }
.userwm-account { padding: .85rem; border: 1px solid var(--userpage-border); border-radius: .9rem; background: linear-gradient(180deg, #fff, #fbfcfe); }
.userwm-account__header { display: grid; grid-template-columns: 2rem minmax(0,1fr) auto; align-items: center; gap: .65rem; }
.userwm-account__icon { width: 2rem; height: 2rem; display: grid; place-items: center; border-radius: .65rem; background: var(--userpage-accent-soft); color: var(--userpage-accent-strong); }
.userwm-account__icon .material-symbols-outlined { font-size: 1.05rem; }
.userwm-account__copy { min-width: 0; display: grid; gap: .1rem; }
.userwm-account__copy strong, .userwm-account__copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.userwm-account__copy strong { color: var(--userpage-text); font-size: .82rem; }
.userwm-account__copy small { color: var(--userpage-text-muted); font-size: .69rem; }
.userwm-status { padding: .25rem .5rem; border-radius: 999px; font-size: .62rem; font-weight: 800; text-transform: uppercase; }
.userwm-status--ready { background: #ecfdf5; color: #047857; }
.userwm-status--missing { background: #fff7ed; color: #b45309; }
.userwm-status--error { background: #fef2f2; color: #b91c1c; }
.userwm-form { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr) auto; align-items: end; gap: .65rem; margin-top: .8rem; padding-top: .8rem; border-top: 1px solid var(--userpage-border-soft); }
.userwm-form label { display: grid; gap: .3rem; color: var(--userpage-text-mid); font-size: .7rem; font-weight: 700; }
.userwm-form input { width: 100%; min-height: 2.4rem; padding: .55rem .7rem; border: 1px solid var(--userpage-border); border-radius: .7rem; background: #f8fafc; color: var(--userpage-text); font: .78rem inherit; }
.userwm-form input:focus { outline: 0; border-color: var(--userpage-accent); box-shadow: 0 0 0 3px rgba(16,185,129,.12); background: #fff; }
.userwm-form .userpage-submit-btn { min-height: 2.4rem; padding: .55rem .8rem; }
.userwm-form .material-symbols-outlined { font-size: .95rem; }
.userwm-error { margin: .65rem 0 0; padding: .55rem .65rem; border-radius: .65rem; background: #fef2f2; color: #b91c1c; font-size: .7rem; }
.userwm-meta, .userwm-readonly { margin: .55rem 0 0; color: var(--userpage-text-muted); font-size: .69rem; }
.userwm-remove { display: flex; justify-content: flex-end; margin-top: .45rem; }
.userwm-remove button { padding: 0; border: 0; background: none; color: #b91c1c; cursor: pointer; font: 700 .68rem inherit; }
.userwm-auto { margin-top: .75rem; border-top: 1px solid var(--userpage-border-soft); }
.userwm-auto__summary { min-height: 2.8rem; display: grid; grid-template-columns: 1.35rem auto minmax(0, 1fr) 1.35rem; align-items: center; gap: .45rem; padding-top: .75rem; color: var(--userpage-text); cursor: pointer; list-style: none; font: 800 .75rem/1.2 inherit; }
.userwm-auto__summary::-webkit-details-marker { display: none; }
.userwm-auto__summary .material-symbols-outlined { color: var(--userpage-accent-strong); font-size: 1rem; }
.userwm-auto__summary small { justify-self: start; min-width: 0; overflow: hidden; color: var(--userpage-text-muted); font-size: .66rem; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.userwm-auto__chevron { justify-self: end; transition: transform .18s ease; }
.userwm-auto[open] .userwm-auto__chevron { transform: rotate(180deg); }
.userwm-auto__body { display: grid; gap: .55rem; padding: .15rem 0 .1rem; }
.userwm-auto__empty { margin: 0; color: var(--userpage-text-muted); font-size: .7rem; }
.userwm-auto-form { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr) auto; align-items: end; gap: .65rem; }
.userwm-auto-form label { display: grid; gap: .3rem; color: var(--userpage-text-mid); font-size: .7rem; font-weight: 700; }
.userwm-auto-form input, .userwm-auto-form select { width: 100%; min-height: 2.4rem; padding: .55rem .7rem; border: 1px solid var(--userpage-border); border-radius: .7rem; background: #f8fafc; color: var(--userpage-text); font: .78rem inherit; }
.userwm-auto-form input:focus, .userwm-auto-form select:focus { outline: 0; border-color: var(--userpage-accent); box-shadow: 0 0 0 3px rgba(16,185,129,.12); background: #fff; }
.userwm-auto-form .userpage-submit-btn { min-height: 2.4rem; padding: .55rem .8rem; }
.userwm-auto-form .material-symbols-outlined { font-size: .95rem; }
.userwm-auto__preview { grid-column: 1 / -1; display: grid; gap: .25rem; margin: 0; padding: .6rem .7rem; border: 1px solid #e2e8f0; border-radius: .7rem; background: #fff; color: var(--userpage-text-muted); font-size: .7rem; line-height: 1.45; }
.userwm-auto__preview strong { color: var(--userpage-text); font-size: .72rem; }
.userwm-auto-current { display: grid; grid-template-columns: 2.15rem minmax(0, 1fr) auto; align-items: start; gap: .7rem; padding: .72rem; border: 1px solid #dbeafe; border-radius: .78rem; background: #f8fbff; }
.userwm-auto-current__icon { width: 2.15rem; height: 2.15rem; display: grid; place-items: center; border-radius: .65rem; background: #dbeafe; color: #1d4ed8; }
.userwm-auto-current__icon .material-symbols-outlined { font-size: 1.05rem; }
.userwm-auto-current__copy { min-width: 0; display: grid; gap: .42rem; }
.userwm-auto-current__kicker { margin: 0; color: #2563eb; font-size: .62rem; font-weight: 850; line-height: 1; text-transform: uppercase; }
.userwm-auto-current h4 { margin: 0; color: var(--userpage-text); font-size: .82rem; line-height: 1.2; }
.userwm-auto-current dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .45rem; margin: 0; }
.userwm-auto-current dl div { min-width: 0; display: grid; gap: .12rem; padding: .46rem .52rem; border: 1px solid #e5edf8; border-radius: .6rem; background: #fff; }
.userwm-auto-current dt { color: var(--userpage-text-muted); font-size: .58rem; font-weight: 800; line-height: 1; text-transform: uppercase; }
.userwm-auto-current dd { min-width: 0; margin: 0; overflow: hidden; color: var(--userpage-text); font-size: .68rem; font-weight: 760; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.userwm-auto-current__actions { display: grid; justify-items: end; gap: .42rem; min-width: 8.5rem; }
.userwm-auto-edit { position: relative; width: 100%; }
.userwm-auto-edit > summary { min-height: 2.15rem; display: inline-flex; align-items: center; justify-content: center; gap: .35rem; width: 100%; padding: .45rem .65rem; border: 1px solid #bfdbfe; border-radius: .58rem; background: #eff6ff; color: #1d4ed8; cursor: pointer; list-style: none; font: 850 .68rem/1 inherit; }
.userwm-auto-edit > summary::-webkit-details-marker { display: none; }
.userwm-auto-edit > summary .material-symbols-outlined { font-size: .9rem; }
.userwm-auto-edit[open] > summary { background: #dbeafe; }
.userwm-auto-form--edit { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); width: min(44rem, calc(100vw - 3rem)); margin-top: .55rem; padding: .65rem; border: 1px solid #dbeafe; border-radius: .72rem; background: #fff; box-shadow: 0 14px 35px rgba(15, 23, 42, .12); }
.userwm-auto-form--edit .userpage-submit-btn { justify-self: end; }
.userwm-auto-cancel { width: 100%; }
.userwm-auto-cancel button { min-height: 2.15rem; display: inline-flex; align-items: center; justify-content: center; gap: .35rem; width: 100%; padding: .45rem .65rem; border: 1px solid #fecaca; border-radius: .58rem; background: #fef2f2; color: #b91c1c; cursor: pointer; font: 850 .68rem/1 inherit; }
.userwm-auto-cancel button:hover { background: #fee2e2; border-color: #fca5a5; }
.userwm-auto-cancel .material-symbols-outlined { font-size: .9rem; }
.userwm-empty { min-height: 10rem; display: grid; place-items: center; align-content: center; gap: .4rem; border: 1px dashed var(--userpage-border); border-radius: .9rem; color: var(--userpage-text-muted); text-align: center; }
.userwm-empty .material-symbols-outlined { font-size: 1.8rem; color: #cbd5e1; }
.userwm-empty p { margin: 0; font-size: .76rem; }
@media (max-width: 1100px) { .userwm-auto-form { grid-template-columns: repeat(2, minmax(0,1fr)); }.userwm-auto-form .userpage-submit-btn { width: 100%; } }
@media (max-width: 820px) { .userwm-form, .userwm-add-form, .userwm-auto-form, .userwm-auto-current, .userwm-auto-current dl { grid-template-columns: 1fr; }.userwm-form .userpage-submit-btn, .userwm-auto-form .userpage-submit-btn { width: 100%; }.userwm-add-form footer { grid-column: 1; }.userwm-auto__summary { grid-template-columns: 1.35rem minmax(0, 1fr) 1.35rem; }.userwm-auto__summary small { grid-column: 2; }.userwm-auto-current__actions { justify-items: stretch; min-width: 0; }.userwm-auto-form--edit { width: 100%; box-shadow: none; } }
