/* BRZ component classes — square corners, hairline borders, flat surfaces.
   Consumed by the React primitives in /components; every value comes from tokens. */

/* ---------- Button ---------- */
.brz-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:var(--control-height);padding:0 28px;border:var(--border-width-strong) solid transparent;border-radius:var(--radius-none);background:none;font-family:var(--font-display);font-weight:var(--weight-bold);font-size:var(--text-label);letter-spacing:var(--tracking-label);text-transform:uppercase;text-decoration:none;white-space:nowrap;cursor:pointer;transition:var(--transition-control),transform var(--dur-fast) var(--ease-brz)}
.brz-btn--sm{height:var(--control-height-sm);padding:0 18px;font-size:var(--text-micro)}
.brz-btn--lg{height:60px;padding:0 36px;font-size:var(--text-caption)}
.brz-btn--block{width:100%}
.brz-btn--primary{background:var(--color-primary);border-color:var(--color-primary);color:var(--brz-sand-50)}
.brz-btn--primary:hover{background:var(--brz-ink-800);border-color:var(--brz-ink-800)}
.brz-btn--accent{background:var(--color-accent);border-color:var(--color-accent);color:var(--brz-sand-50)}
.brz-btn--accent:hover{background:var(--color-accent-hover);border-color:var(--color-accent-hover)}
.brz-btn--outline{border-color:var(--color-primary);color:var(--color-text-primary)}
.brz-btn--outline:hover{background:var(--color-primary);color:var(--brz-sand-50)}
.brz-btn--inverse{background:var(--brz-sand-50);border-color:var(--brz-sand-50);color:var(--brz-black)}
.brz-btn--inverse:hover{background:var(--color-accent);border-color:var(--color-accent);color:var(--brz-sand-50)}
.brz-btn--ghost{height:auto;padding:4px 0;border-color:transparent;border-bottom:var(--border-width-strong) solid var(--color-accent);color:var(--color-text-primary)}
.brz-btn--ghost:hover{color:var(--color-accent-hover)}
.brz-btn:active:not(:disabled){transform:translate(2px,2px)}
.brz-btn:disabled{opacity:.38;cursor:not-allowed;transform:none}

/* ---------- IconButton ---------- */
.brz-iconbtn{display:inline-flex;align-items:center;justify-content:center;width:var(--field-height);height:var(--field-height);padding:0;border:var(--border-width) solid var(--color-border);background:var(--color-surface);color:var(--color-text-primary);cursor:pointer;transition:var(--transition-control),transform var(--dur-fast) var(--ease-brz)}
.brz-iconbtn--sm{width:36px;height:36px}
.brz-iconbtn--solid{background:var(--color-primary);border-color:var(--color-primary);color:var(--brz-sand-50)}
.brz-iconbtn--bare{background:none;border-color:transparent}
.brz-iconbtn:hover{border-color:var(--color-primary)}
.brz-iconbtn--solid:hover{background:var(--color-accent);border-color:var(--color-accent)}
.brz-iconbtn--bare:hover{color:var(--color-accent)}
.brz-iconbtn:active:not(:disabled){transform:translate(1px,1px)}
.brz-iconbtn:disabled{opacity:.38;cursor:not-allowed}
.brz-iconbtn svg{width:18px;height:18px;stroke-width:1.75}

/* ---------- Badge ---------- */
.brz-badge{display:inline-flex;align-items:center;gap:6px;min-height:26px;padding:4px 10px;white-space:nowrap;border:var(--border-width) solid var(--color-border);font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--color-text-secondary)}
.brz-badge--solid{background:var(--color-primary);border-color:var(--color-primary);color:var(--brz-sand-50)}
.brz-badge--accent{background:var(--color-accent);border-color:var(--color-accent);color:var(--brz-sand-50)}
.brz-badge--tint{background:var(--color-accent-tint);border-color:var(--color-accent-tint);color:var(--color-accent-hover)}
.brz-badge--outline{border-color:var(--color-primary);color:var(--color-text-primary)}

/* ---------- Card ---------- */
.brz-card{position:relative;display:flex;flex-direction:column;gap:var(--space-4);background:var(--color-surface);border:var(--border-hairline);padding:var(--panel-pad);transition:border-color var(--dur-base) var(--ease-brz),transform var(--dur-base) var(--ease-brz)}
.brz-card--lg{padding:var(--panel-pad-lg)}
.brz-card--flush{padding:0}
.brz-card--sunken{background:var(--color-surface-sunken)}
.brz-card--dark{background:var(--color-surface-dark);border-color:var(--color-border-dark);color:var(--color-text-inverse)}
.brz-card--rule::before{content:"";position:absolute;inset:0 0 auto 0;height:var(--border-width-block);background:var(--color-accent)}
.brz-card--interactive{cursor:pointer}
.brz-card--interactive:hover{border-color:var(--color-primary);transform:translate(-2px,-2px)}
.brz-card--dark.brz-card--interactive:hover{border-color:var(--color-accent)}
.brz-card__title{font:var(--type-h3);letter-spacing:var(--tracking-heading)}
.brz-card__body{font:var(--type-body-sm);color:var(--color-text-secondary)}

/* ---------- SpecPanel (the brand-sheet framed panel) ---------- */
.brz-spec{position:relative;background:var(--color-surface-sunken);border:var(--border-hairline)}
.brz-spec--surface{background:var(--color-surface)}
.brz-spec--dark{background:var(--brz-ink-900);border-color:var(--color-border-dark);color:var(--color-text-inverse)}
.brz-spec__body{display:grid;place-items:center;padding:var(--space-8)}
.brz-spec__caption{display:flex;align-items:center;justify-content:space-between;gap:var(--space-5);border-top:var(--border-hairline);padding:11px var(--space-5);font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--color-text-secondary)}
.brz-spec--dark .brz-spec__caption{border-top-color:var(--color-border-dark);color:var(--color-text-inverse-muted)}
.brz-spec__mark{position:absolute;font:var(--weight-regular) 13px/1 var(--font-body);color:var(--color-border);pointer-events:none}
.brz-spec__mark--tl{top:-7px;left:-7px}
.brz-spec__mark--tr{top:-7px;right:-7px}
.brz-spec__mark--bl{bottom:-7px;left:-7px}
.brz-spec__mark--br{bottom:-7px;right:-7px}

/* ---------- Stat ---------- */
.brz-stat{display:flex;flex-direction:column;gap:var(--space-3)}
.brz-stat--rule{border-top:var(--border-width-block) solid var(--color-primary);padding-top:var(--space-4)}
.brz-stat__value{font-family:var(--font-display);font-weight:var(--weight-black);font-size:var(--text-4xl);line-height:.88;letter-spacing:var(--tracking-display);color:var(--color-accent)}
.brz-stat--ink .brz-stat__value{color:var(--color-text-primary)}
.brz-stat--sm .brz-stat__value{font-size:var(--text-2xl)}
.brz-stat__label{font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--color-text-secondary)}
.brz-stat__note{font:var(--type-body-sm);color:var(--color-text-secondary)}

/* ---------- SectionLabel ---------- */
.brz-seclabel{display:flex;align-items:center;gap:var(--space-4);font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--color-text-secondary)}
.brz-seclabel__index{font-weight:var(--weight-bold);color:var(--color-accent)}
.brz-seclabel__rule{flex:1;height:var(--border-width);background:var(--color-border)}

/* ---------- Fields ---------- */
.brz-field{display:flex;flex-direction:column;gap:var(--space-3)}
.brz-field__label{font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--color-text-secondary)}
.brz-field__req{color:var(--color-accent)}
.brz-field__hint{font-size:var(--text-caption);line-height:1.4;color:var(--color-text-secondary)}
.brz-field__error{font:var(--type-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--color-accent-hover)}
.brz-input{height:var(--field-height);width:100%;padding:0 14px;border:var(--border-width) solid var(--color-border);border-radius:var(--radius-none);background:var(--color-surface);color:var(--color-text-primary);font-size:var(--text-sm);transition:var(--transition-control)}
.brz-input::placeholder{color:var(--color-text-secondary);opacity:.8}
.brz-input:hover{border-color:var(--brz-sand-500)}
.brz-input:focus{outline:none;border-color:var(--color-primary);box-shadow:inset 0 -2px 0 0 var(--color-accent)}
.brz-input:disabled{background:var(--color-surface-sunken);color:var(--color-text-secondary);cursor:not-allowed}
.brz-input--invalid{border-color:var(--color-accent-hover)}
.brz-input--textarea{height:auto;min-height:132px;padding:12px 14px;line-height:var(--leading-body);resize:vertical}
.brz-select{position:relative;display:block}
.brz-select select{appearance:none;padding-right:42px;cursor:pointer}
.brz-select__chev{position:absolute;top:50%;right:14px;width:9px;height:9px;margin-top:-6px;border-right:var(--border-width-strong) solid var(--color-text-primary);border-bottom:var(--border-width-strong) solid var(--color-text-primary);transform:rotate(45deg);pointer-events:none}
.brz-check{display:inline-flex;align-items:flex-start;gap:var(--space-4);cursor:pointer;font-size:var(--text-sm);line-height:1.45}
.brz-check input{position:absolute;opacity:0;width:0;height:0}
.brz-check__box{flex:none;display:grid;place-items:center;width:22px;height:22px;margin-top:1px;border:var(--border-width-strong) solid var(--color-primary);background:var(--color-surface);transition:var(--transition-control)}
.brz-check__box::after{content:"";width:10px;height:5px;border-left:var(--border-width-strong) solid var(--brz-sand-50);border-bottom:var(--border-width-strong) solid var(--brz-sand-50);transform:rotate(-45deg) translate(1px,-1px) scale(.4);opacity:0;transition:opacity var(--dur-fast) var(--ease-brz),transform var(--dur-fast) var(--ease-brz)}
.brz-check input:checked+.brz-check__box{background:var(--color-primary)}
.brz-check input:checked+.brz-check__box::after{opacity:1;transform:rotate(-45deg) translate(1px,-1px) scale(1)}
.brz-check input:focus-visible+.brz-check__box{outline:var(--focus-ring);outline-offset:var(--focus-offset)}
.brz-check input:disabled~*{opacity:.4}

/* ---------- Tabs ---------- */
.brz-tabs{display:flex;gap:var(--space-7);border-bottom:var(--border-hairline)}
.brz-tab{position:relative;padding:0 0 12px;border:0;background:none;font-family:var(--font-display);font-weight:var(--weight-semibold);font-size:var(--text-label);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--color-text-secondary);cursor:pointer;transition:var(--transition-control)}
.brz-tab:hover{color:var(--color-text-primary)}
.brz-tab--active{color:var(--color-text-primary)}
.brz-tab--active::after{content:"";position:absolute;inset:auto 0 -1px 0;height:var(--border-width-block);background:var(--color-accent)}

/* ---------- Accordion ---------- */
.brz-acc{border-top:var(--border-hairline)}
.brz-acc__item{border-bottom:var(--border-hairline)}
.brz-acc__trigger{display:flex;align-items:center;justify-content:space-between;gap:var(--space-5);width:100%;padding:var(--space-5) 0;border:0;background:none;text-align:left;font-family:var(--font-display);font-weight:var(--weight-bold);font-size:var(--text-lg);letter-spacing:var(--tracking-heading);color:var(--color-text-primary);cursor:pointer}
.brz-acc__trigger:hover{color:var(--color-accent-hover)}
.brz-acc__sign{flex:none;font-weight:var(--weight-regular);font-size:var(--text-xl);line-height:1;color:var(--color-accent)}
.brz-acc__panel{padding:0 var(--space-9) var(--space-5) 0;font:var(--type-body-sm);color:var(--color-text-secondary)}

/* ---------- Logo ---------- */
.brz-logo{display:inline-flex;flex-direction:column;gap:6px;color:var(--color-text-primary)}
.brz-logo__word{font-family:var(--font-display);font-weight:var(--weight-black);line-height:var(--leading-solid);letter-spacing:var(--tracking-logo);text-transform:uppercase}
.brz-logo__over,.brz-logo__under{font:var(--type-label);font-weight:var(--weight-medium);letter-spacing:var(--tracking-label-wide);text-transform:uppercase;color:inherit}
.brz-logo__rule{height:var(--border-width);background:currentColor;opacity:.9}
.brz-logo--avatar{display:grid;place-items:center;border-radius:var(--radius-circle);background:var(--color-primary);color:var(--brz-sand-50)}
.brz-logo--slice{position:relative;display:inline-block}
.brz-logo--slice .brz-logo__word{position:relative;z-index:1}
.brz-logo__sliceband{position:absolute;left:-4%;right:-4%;top:46%;height:18%;background:var(--color-accent);z-index:2;mix-blend-mode:normal}
