/* ── UTILITY CLASSES ── */
.hidden          { display: none !important; }
.no-deco         { text-decoration: none; }
.cursor-pointer  { cursor: pointer; }
.w-full          { width: 100%; }
.resize-v        { resize: vertical; }
.nowrap          { white-space: nowrap; }
.overflow-x-auto { overflow-x: auto; }

/* ── Flex ── */
.flex-col     { display: flex; flex-direction: column; }
.flex-center  { display: flex; align-items: center; }
.flex-between { display: flex; justify-content: space-between; align-items: center; }
.flex-end     { display: flex; justify-content: flex-end; }
.flex-wrap    { flex-wrap: wrap; }
.flex-1       { flex: 1; }

/* ── Gap ── */
.gap-2  { gap: .2rem; }
.gap-3  { gap: .3rem; }
.gap-4  { gap: .4rem; }
.gap-5  { gap: .5rem; }
.gap-6  { gap: .6rem; }
.gap-65 { gap: .65rem; }
.gap-75 { gap: .75rem; }
.gap-10 { gap: 1rem; }

/* ── Margin ── */
.mb-0  { margin-bottom: 0; }
.mb-25 { margin-bottom: .25rem; }
.mb-5  { margin-bottom: .5rem; }
.mb-6  { margin-bottom: .6rem; }
.mb-75 { margin-bottom: .75rem; }
.mb-8  { margin-bottom: .8rem; }
.mb-85 { margin-bottom: .85rem; }
.mb-10  { margin-bottom: 1rem; }
.mb-125 { margin-bottom: 1.25rem; }
.mb-15  { margin-bottom: 1.5rem; }
.mb-175 { margin-bottom: 1.75rem; }
.mt-5  { margin-top: .5rem; }
.mt-75 { margin-top: .75rem; }
.mt-10 { margin-top: 1rem; }

/* ── Text ── */
.text-right  { text-align: right; }
.text-center { text-align: center; }
.bold        { font-weight: 600; }

/* ── Font sizes ── */
.fs-62 { font-size: .62rem; }
.fs-65 { font-size: .65rem; }
.fs-68 { font-size: .68rem; }
.fs-7  { font-size: .7rem; }
.fs-72 { font-size: .72rem; }
.fs-75 { font-size: .75rem; }
.fs-78 { font-size: .78rem; }
.fs-8  { font-size: .8rem; }

/* ── Colors ── */
.clr-muted   { color: var(--muted); }

/* ── Margin-left negative ── */
.ml-neg3 { margin-left: -.3rem; }
.ml-neg4 { margin-left: -.4rem; }

/* ── Cookie link ── */
.cookie-link { color: var(--accent); text-decoration: underline; }

/* ── Modal base (shared by dashboard, register, index) ── */
.modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,.4); backdrop-filter:blur(4px); z-index:500; display:flex; align-items:center; justify-content:center; padding:1.5rem; opacity:0; pointer-events:none; transition:opacity .22s }
.modal-overlay.open { opacity:1; pointer-events:all }
.modal-box { background:var(--card); border:1px solid var(--border2,var(--border)); border-radius:6px; box-shadow:0 8px 48px rgba(0,0,0,.18); width:100%; max-width:44rem; max-height:90vh; overflow-y:auto; padding:1.75rem 2rem; position:relative; transform:translateY(12px); transition:transform .22s }
.modal-overlay.open .modal-box { transform:translateY(0) }
.modal-close { position:absolute; top:1rem; right:1.25rem; background:none; border:none; font-size:1.4rem; cursor:pointer; color:var(--muted); line-height:1 }
.modal-close:hover { color:var(--text,var(--ink)) }
.modal-title { font-family:var(--serif); font-size:1.4rem; color:var(--text,var(--ink)); margin-bottom:.4rem }