/* Chrome that travels with the global header.
   ════════════════════════════════════════════════════════════════════════

   The account drawer and the search dialog used to live in css/styles.css,
   which ten public pages never loaded — society, the four archives pages,
   galveston, voyage, voyages, dolly-parton and stede-bonnet. The shared
   header puts a search button and an account button on every one of those
   pages, and a button that opens an unstyled panel is worse than no button.

   So these rules moved here, once, and the header brings them along. They
   were CUT from styles.css, not copied: there is still exactly one copy.

   The fallbacks below matter for the same reason — those ten pages do not
   define the Dark Tides custom properties either. A page that does define
   them overrides these, because its own :root wins on specificity order. */

:root{
  --gold:      #C89B3C;
  --gold-soft: #D8B368;
  --cream:     #F2E7CF;
  --cream-dim: #D9CDB4;
  --muted:     #94908A;
  --hair:      rgba(255,255,255,.09);
  --rail:      0px;
  --display:   'Cinzel', Georgia, 'Times New Roman', serif;
}

.account-panel[hidden]{ display:none!important; }
.account-panel{
  position:fixed; z-index:90; top:calc(var(--bar) - 1px); right:clamp(12px,3vw,40px);
  width:min(390px,calc(100vw - var(--rail) - 24px)); max-height:calc(100vh - var(--bar) - 16px);
  overflow:auto; border:1px solid rgba(201,169,97,.28);
  background:linear-gradient(145deg,rgba(20,18,14,.98),rgba(7,7,8,.99));
  color:var(--cream); box-shadow:0 28px 90px rgba(0,0,0,.72); backdrop-filter:blur(18px);
}
.account-panel__loading{ padding:32px; color:var(--muted); font-size:11px; letter-spacing:.14em; text-transform:uppercase; }
.account-panel__head{ display:flex; align-items:center; justify-content:space-between; gap:20px; padding:22px 24px 18px; border-bottom:1px solid var(--hair); }
.account-panel__head p,.account-panel__head h2{ margin:0; }
.account-panel__head p{ color:var(--gold); font-size:8px; letter-spacing:.22em; text-transform:uppercase; }
.account-panel__head h2{ margin-top:5px; font:400 22px var(--display); letter-spacing:.04em; }
.account-panel__close{ color:var(--muted); font-size:24px; line-height:1; }
.account-panel__close:hover{ color:var(--cream); }
.account-panel__body{ padding:22px 24px 25px; }
.account-panel__body>p{ margin:0 0 20px; color:var(--muted); font-size:12px; line-height:1.65; }
.account-panel__signin{ display:grid; gap:9px; }
.account-panel__signin label{ color:var(--gold); font-size:8px; letter-spacing:.18em; text-transform:uppercase; }
.account-panel__signin input{ min-height:44px; padding:0 12px; border:1px solid var(--hair); background:#070708; color:var(--cream); outline:none; }
.account-panel__signin input:focus{ border-color:var(--gold); }
.account-panel__signin button,.account-panel__signout,.account-panel__password button{ min-height:43px; border:1px solid var(--gold); background:var(--gold); color:#08080a; font-size:9px; letter-spacing:.15em; text-transform:uppercase; }
.account-panel__signin button:disabled{ opacity:.55; }
.account-panel__signin .account-panel__secondary{ background:transparent; color:var(--gold); }
.account-panel__hint{ color:var(--muted); font-size:9px; line-height:1.55; }
.account-panel__status{ min-height:18px; margin:0; color:var(--gold); font-size:10px; line-height:1.5; }
.account-panel__body nav{ margin-top:15px; border-top:1px solid var(--hair); }
.account-panel__body nav a{ display:flex; justify-content:space-between; padding:13px 0; border-bottom:1px solid var(--hair); color:var(--cream-dim); font-size:10px; letter-spacing:.08em; }
.account-panel__body nav a:hover{ color:var(--gold); }
.account-panel__identity{ display:flex; align-items:center; gap:14px; padding:20px 24px; border-bottom:1px solid var(--hair); }
.account-panel__identity img{ width:48px; height:48px; object-fit:cover; border:1px solid var(--gold); border-radius:50%; }
.account-panel__identity strong,.account-panel__identity span{ display:block; }
.account-panel__identity strong{ font:400 17px var(--display); }
.account-panel__identity span{ margin-top:5px; color:var(--muted); font-size:10px; }
.account-panel__identity small{ display:block; margin-top:5px; color:var(--gold); font-size:8px; letter-spacing:.12em; text-transform:uppercase; }
.account-panel__links{ padding:7px 24px; }
.account-panel__links a{ display:flex; align-items:center; justify-content:space-between; gap:15px; padding:14px 0; border-bottom:1px solid var(--hair); color:var(--cream); }
.account-panel__links b,.account-panel__links small{ display:block; }
.account-panel__links b{ font-size:11px; letter-spacing:.06em; }
.account-panel__links small{ margin-top:4px; color:var(--muted); font-size:9px; line-height:1.4; }
.account-panel__links i{ color:var(--gold); font-style:normal; }
.account-panel__links a:hover b{ color:var(--gold); }
.account-panel__signout{ width:calc(100% - 48px); margin:10px 24px 24px; background:transparent; color:var(--gold); }
.account-panel__signout:hover{ background:rgba(201,169,97,.08); }
.account-panel__password{ margin:3px 24px 0; border-bottom:1px solid var(--hair); }
.account-panel__password summary{ padding:13px 0; color:var(--gold); cursor:pointer; font-size:9px; letter-spacing:.12em; text-transform:uppercase; }
.account-panel__password form{ display:grid; gap:8px; padding:0 0 16px; }
.account-panel__password label{ color:var(--muted); font-size:8px; letter-spacing:.14em; text-transform:uppercase; }
.account-panel__password input{ min-height:42px; padding:0 12px; border:1px solid var(--hair); background:#070708; color:var(--cream); }
.site-search[hidden]{ display:none!important; }
.site-search{ position:fixed; z-index:95; inset:0 0 0 var(--rail); color:var(--cream); }
.site-search__scrim{ position:absolute; inset:0; width:100%; height:100%; background:rgba(2,3,5,.8); backdrop-filter:blur(10px); }
.site-search__dialog{
  position:relative; width:min(780px,calc(100vw - var(--rail) - 40px)); max-height:calc(100vh - 64px);
  margin:clamp(20px,8vh,86px) auto 0; overflow:auto; border:1px solid rgba(201,169,97,.32);
  background:linear-gradient(150deg,rgba(22,19,14,.99),rgba(5,6,8,.99)); box-shadow:0 35px 120px rgba(0,0,0,.8);
}
.site-search__dialog>header{ display:flex; align-items:center; justify-content:space-between; gap:20px; padding:24px 28px 20px; border-bottom:1px solid var(--hair); }
.site-search__dialog header p,.site-search__dialog header h2{ margin:0; }
.site-search__dialog header p{ color:var(--gold); font-size:8px; letter-spacing:.24em; text-transform:uppercase; }
.site-search__dialog header h2{ margin-top:5px; font:400 clamp(23px,3vw,31px) var(--display); letter-spacing:.04em; }
.site-search__close{ color:var(--muted); font-size:27px; line-height:1; }
.site-search__close:hover{ color:var(--cream); }
.site-search__field{ display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:13px; margin:24px 28px 0; padding:0 15px; border:1px solid var(--hair); background:#070708; }
.site-search__field:focus-within{ border-color:var(--gold); box-shadow:0 0 0 1px rgba(201,169,97,.12); }
.site-search__field svg{ width:18px; color:var(--gold); }
.site-search__field input{ min-width:0; height:52px; border:0; outline:0; background:transparent; color:var(--cream); font:400 14px var(--sans); }
.site-search__field input::placeholder{ color:var(--muted); }
.site-search__field kbd{ padding:4px 6px; border:1px solid var(--hair); color:var(--muted); font:8px var(--sans); letter-spacing:.12em; }
.site-search__summary{ min-height:17px; margin:14px 28px 4px; color:var(--muted); font-size:9px; letter-spacing:.14em; text-transform:uppercase; }
.site-search__results{ padding:0 28px 27px; }
.site-search__results a{ display:grid; grid-template-columns:105px minmax(0,1fr) auto; align-items:center; gap:18px; padding:16px 2px; border-bottom:1px solid var(--hair); color:var(--cream); }
.site-search__results a:hover,.site-search__results a:focus-visible{ color:var(--gold); }
.site-search__results small{ color:var(--gold); font-size:8px; letter-spacing:.16em; text-transform:uppercase; }
.site-search__results span{ min-width:0; }
.site-search__results b,.site-search__results em{ display:block; }
.site-search__results b{ font:400 15px var(--display); letter-spacing:.03em; }
.site-search__results em{ margin-top:4px; overflow:hidden; color:var(--muted); font-size:10px; font-style:normal; line-height:1.45; text-overflow:ellipsis; white-space:nowrap; }
.site-search__results i{ color:var(--gold); font-style:normal; }
.site-search__empty{ padding:35px 0 18px; color:var(--muted); font:400 17px var(--display); text-align:center; }
  .site-search{ left:0; }
  .site-search__dialog{ width:calc(100vw - 24px); margin-top:12px; max-height:calc(100vh - 24px); }
  .site-search__dialog>header,.site-search__results{ padding-left:18px; padding-right:18px; }
  .site-search__field{ margin-left:18px; margin-right:18px; }
  .site-search__summary{ margin-left:18px; margin-right:18px; }
  .site-search__results a{ grid-template-columns:1fr auto; gap:10px; }
  .site-search__results small{ grid-column:1/-1; }
