/* barbed-wire rule — used sparingly (login pass, error page) */
.barbed {
  height: 12px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='12'%3E%3Cpath d='M0 6.5C8 4.5 15 8.5 23 6.5S38 4.5 46 6.5' fill='none' stroke='%23383838' stroke-width='1.1'/%3E%3Cpath d='M0 5.5C8 7.5 15 3.5 23 5.5S38 7.5 46 5.5' fill='none' stroke='%232a2a2a' stroke-width='1.1'/%3E%3Cg stroke='%23555' stroke-width='1.2' stroke-linecap='round'%3E%3Cpath d='M19 2.5l8 7M27 2.5l-8 7'/%3E%3C/g%3E%3C/svg%3E") repeat-x center;
}

.htmx-indicator { opacity: 0; transition: opacity .15s; }
.htmx-request .htmx-indicator, .htmx-request.htmx-indicator { opacity: 1; }
tr[data-href] { cursor: pointer; }
.mail-body { white-space: pre-wrap; word-break: break-word; }
.tabular { font-variant-numeric: tabular-nums; }
::selection { background: rgba(212,161,63,.35); color: #fff; }
* { scrollbar-width: thin; scrollbar-color: #303030 transparent; }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: #262626; }
select option { background: #131313; color: #ece8df; }
input[type="datetime-local"]::-webkit-calendar-picker-indicator { filter: invert(.7); cursor: pointer; }
details > summary { list-style: none; }
details > summary::-webkit-details-marker { display: none; }

/* numbers */
.num { font-family: "IBM Plex Mono", ui-monospace, monospace; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }

/* toast */
.toast {
  position: fixed; right: 20px; bottom: 20px; z-index: 70; max-width: 380px;
  background: #ece8df; color: #0b0b0b; font: 500 13px/1.4 "IBM Plex Mono", monospace; padding: 10px 14px; border-radius: 2px;
}
.toast-err { background: #e5484d; color: #fff; }
.toast.hidden { display: none; }

/* chart — series colour #bf8a2a validated against the #0f0f0f surface */
.viz-root { --grid: #212121; --axis: #3a3a3a; --text-primary: #ece8df; --text-muted: #78746b; --series-1: #bf8a2a; --series-1-hover: #d4a13f; }
.viz-bar { fill: var(--series-1); }
.viz-col:hover .viz-bar { fill: var(--series-1-hover); }
.viz-tip { position: absolute; pointer-events: none; background: #ece8df; color: #0b0b0b; font: 500 12px "IBM Plex Mono", monospace; padding: 4px 7px; border-radius: 2px; white-space: nowrap; transform: translate(-50%, -100%); margin-top: -8px; opacity: 0; }

/* board */
.sortable-ghost { opacity: .35; }
.playing-card { position: relative; }
.playing-card .suit { position: absolute; right: 9px; top: 7px; font-family: Georgia, serif; font-size: 15px; line-height: 1; }

/* login "pass": perforated tear-off edge */
.perforation { height: 0; border-top: 2px dashed #303030; position: relative; }
.perforation::before, .perforation::after { content: ""; position: absolute; top: -9px; width: 16px; height: 16px; border-radius: 50%; background: #0f0f0f; }
.perforation::before { left: -9px; } .perforation::after { right: -9px; }