/* Shared chrome — buttons, fields, lang switch. One edit, every area. */

*{box-sizing:border-box}
html,body{margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
a{color:inherit}
img{max-width:100%;display:block}
.u-vh{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

.lang-switch{display:flex;gap:6px;align-items:center;font-size:13px;font-family:var(--lat);letter-spacing:.04em;line-height:1}
.lang-switch a{color:var(--gold-2);text-decoration:none;padding:4px 7px;border-radius:6px;font-weight:600}
.lang-switch a[lang="ur"]{font-family:var(--ur);font-size:16px;font-weight:400;letter-spacing:0;line-height:1.8}
.lang-switch.floating{
  position:fixed;inset-block-start:10px;inset-inline-end:14px;z-index:30;
  background:rgba(4,22,15,.85);backdrop-filter:blur(6px);
  padding:5px 9px;border-radius:999px;border:1px solid var(--gold-dim);
}

.pattern{
  position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.05;
  background-image:
    repeating-linear-gradient(45deg, var(--gold) 0 1px, transparent 1px 26px),
    repeating-linear-gradient(-45deg, var(--gold) 0 1px, transparent 1px 26px);
}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--ur);font-size:17px;line-height:2.4;
  min-height:52px;padding:2px 28px;border-radius:999px;
  border:1px solid var(--gold-dim);background:rgba(255,255,255,.04);color:var(--ink);
  text-decoration:none;cursor:pointer;transition:transform .15s,background .15s,border-color .15s;
  -webkit-tap-highlight-color:transparent;
}
.btn:hover{background:rgba(255,255,255,.09);transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn.primary{
  background:var(--gold);
  border-color:var(--gold-2);color:#1e1608;font-weight:700;
}
.btn.primary:hover{filter:brightness(1.06)}
.btn.ghost{background:transparent;color:var(--ink-soft)}
.btn.wide{width:100%}
.btn[disabled],.btn.is-busy{opacity:.6;pointer-events:none}

.field{margin-bottom:18px}
.field label{display:block;font-size:15px;color:var(--gold-2);margin-bottom:2px}
.field .en{font-family:var(--lat);color:var(--muted);font-size:12px;letter-spacing:1px}
.field input,.field select,.field textarea{
  width:100%;font-family:var(--ur);font-size:17px;line-height:2.2;
  min-height:54px;padding:4px 16px;border-radius:12px;color:var(--ink);
  background:rgba(0,0,0,.28);border:1px solid rgba(200,162,83,.28);
  transition:border-color .15s, box-shadow .15s;
}
.field textarea{min-height:140px;resize:vertical;padding-block:12px}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(200,162,83,.18);
}
.field input.ltr{direction:ltr;text-align:left;font-family:var(--lat);letter-spacing:1px}
[dir=rtl] .field input.ltr{text-align:right}
.field .err{color:var(--danger);font-size:14px;margin-top:2px}

.alert{
  border-radius:12px;padding:12px 16px;font-size:15px;margin-bottom:18px;
  border:1px solid rgba(224,85,63,.4);background:rgba(224,85,63,.12);color:#ffd9d2;
}
.alert.ok{border-color:rgba(79,191,122,.4);background:rgba(79,191,122,.12);color:#d4f7e0}
.alert a{color:var(--gold-2)}
.hint{color:var(--muted);font-size:13px;text-align:center;margin:0}

.i-fwd::after{content:"←"}
.i-back::after{content:"→"}
[dir=ltr] .i-fwd::after{content:"→"}
[dir=ltr] .i-back::after{content:"←"}

.lang-en .btn{font-family:var(--lat);font-size:16px;line-height:1.2;min-height:46px;padding:12px 26px}

.u-chip{
  display:inline-flex;align-items:center;gap:8px;text-decoration:none;color:inherit;
  min-width:0;border-radius:999px;padding:2px;
}
.u-chip:hover{opacity:.92}
.u-chip-meta{min-width:0;display:flex;flex-direction:column;line-height:1.2}
.u-chip-meta b{
  font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:140px;
}
.u-av{
  position:relative;width:36px;height:36px;flex:none;
  display:flex;align-items:center;justify-content:center;
  border-radius:50%;background:var(--burgundy);color:var(--cream-2);
  font-weight:700;font-size:14px;line-height:1;overflow:visible;
}
.u-av img{width:36px;height:36px;border-radius:50%;object-fit:cover;display:block}
.u-av > span{display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.u-plan{
  position:absolute;left:50%;bottom:-7px;transform:translateX(-50%);
  font-size:9px;font-weight:700;line-height:1;letter-spacing:.02em;
  padding:2px 5px;border-radius:999px;white-space:nowrap;
  background:var(--gold,#C8A253);color:#3F1520;font-family:var(--font-ui);
  box-shadow:0 0 0 2px #fff;
}
.u-av.is-lg{width:72px;height:72px;font-size:28px}
.u-av.is-lg img{width:72px;height:72px}
.u-av.is-lg .u-plan{font-size:11px;padding:3px 7px;bottom:-8px}
.u-chip.is-bar .u-chip-meta{display:none}

@media (prefers-reduced-motion: reduce){
  *{animation:none!important;transition:none!important}
}