/* Small finishing touches for every page */

/* soft fade-in when a page opens (opacity only, so nothing else moves) */
@keyframes lsPageIn { from { opacity:0; } to { opacity:1; } }
body { animation:lsPageIn .35s ease-out; }

/* drop-down lists: rounded panel under the box, padded options, gold highlight (modern browsers; others keep the plain list) */
:root { --dd-bg:#ffffff; --dd-text:#0d1620; --dd-line:#e3e1da; --dd-hover:rgba(184,144,46,.14); }
html[data-theme="dark"] { --dd-bg:#0b1019; --dd-text:#e6eef0; --dd-line:#262f3d; --dd-hover:rgba(224,182,83,.16); }
@media (prefers-color-scheme: dark) { html[data-theme="auto"] { --dd-bg:#0b1019; --dd-text:#e6eef0; --dd-line:#262f3d; --dd-hover:rgba(224,182,83,.16); } }
@supports (appearance: base-select) {
  select.form-select:not([multiple]):not([size]), .mt-page select:not([multiple]):not([size]), .set-panel select:not([multiple]):not([size]),
  select.form-select:not([multiple]):not([size])::picker(select), .mt-page select:not([multiple]):not([size])::picker(select), .set-panel select:not([multiple]):not([size])::picker(select) { appearance:base-select; }
  select.form-select::picker-icon, .mt-page select::picker-icon, .set-panel select::picker-icon { display:none; }
  select.form-select::picker(select), .mt-page select::picker(select), .set-panel select::picker(select) {
    top:calc(anchor(bottom) + 6px); left:anchor(left); right:auto; bottom:auto; min-width:anchor-size(width); box-sizing:border-box;
    padding:6px; background:var(--dd-bg); color:var(--dd-text); border:1px solid var(--dd-line); border-radius:12px; box-shadow:0 14px 34px rgba(0,0,0,.28); max-height:300px; overflow:auto;
    opacity:0; transform:translateY(-6px); transition:opacity .25s ease, transform .3s cubic-bezier(.45,.05,.25,1), display .3s allow-discrete, overlay .3s allow-discrete;
  }
  select.form-select::picker(select):popover-open, .mt-page select::picker(select):popover-open, .set-panel select::picker(select):popover-open { opacity:1; transform:none; }
  @starting-style { select.form-select::picker(select):popover-open, .mt-page select::picker(select):popover-open, .set-panel select::picker(select):popover-open { opacity:0; transform:translateY(-6px); } }
  select.form-select option, .mt-page select option, .set-panel select option { display:flex; align-items:center; justify-content:flex-start; text-align:left; padding:9px 12px; margin:2px 0; border-radius:8px; background:transparent; color:var(--dd-text); font-weight:600; cursor:pointer; }
  select.form-select option:hover, .mt-page select option:hover, .set-panel select option:hover, select.form-select option:focus-visible, .mt-page select option:focus-visible, .set-panel select option:focus-visible { background:var(--dd-hover); }
  select.form-select option:checked, .mt-page select option:checked, .set-panel select option:checked { background:#b86a0f; color:#0d1620; }
  select.form-select option::checkmark, .mt-page select option::checkmark, .set-panel select option::checkmark { display:none; }
}

/* shortcut help */
.ks { position:fixed; inset:0; z-index:2200; display:grid; place-items:center; background:rgba(6,9,14,.55); }
.ks[hidden] { display:none; }
.ks-box { width:min(420px, calc(100vw - 32px)); padding:20px 22px; border-radius:14px; background:var(--dd-bg); color:var(--dd-text); border:1px solid var(--dd-line); box-shadow:0 20px 50px rgba(0,0,0,.4); }
.ks-box h3 { font-size:17px; margin:0 0 12px; color:inherit; }
.ks-box dl { display:grid; grid-template-columns:auto 1fr; gap:8px 16px; margin:0 0 12px; }
.ks-box dt { white-space:nowrap; } .ks-box dd { margin:0; opacity:.85; }
.ks-box kbd { display:inline-block; min-width:22px; padding:2px 7px; border:1px solid var(--dd-line); border-bottom-width:2px; border-radius:6px; background:transparent; color:inherit; font:600 12.5px/1.4 system-ui,sans-serif; text-align:center; }
.ks-box small { opacity:.7; }
@media (prefers-reduced-motion: reduce) { body { animation:none; } }

/* printing: only the page itself, no menus, chat or buttons */
@media print {
  .ls-navbar-wrapper, .ms-side, .ms-burger, .ms-overlay, .cw, .sd, .ks, .ls-backbar, .ib-bulk { display:none !important; }
  body, body.has-mside { padding-left:0 !important; background:#fff !important; color:#0d1620 !important; animation:none; }
}