﻿/* Hylab Networks — account drawer: full-height sheet docked to the right edge,
   with the identity header, grouped lists and a footer pinned to the bottom. */
.drawer{position:fixed;inset:0 0 0 auto;width:min(412px,92vw);height:100dvh;max-height:100dvh;margin:0;padding:0;border-radius:0;border:0;border-left:1px solid var(--border);overflow:auto}
/* display is set only while open: a class-level display rule would beat the UA
   "dialog:not([open]) { display: none }" rule and leave the sheet on screen. */
.drawer[open]{display:flex;flex-direction:column}
.drawer::backdrop{background:rgba(0,0,0,.7);backdrop-filter:blur(6px)}
.drawer-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:22px 24px;border-bottom:1px solid var(--border)}
.drawer-identity{display:flex;align-items:center;gap:14px;min-width:0}
.drawer-avatar{width:46px;height:46px;flex:none;display:grid;place-items:center;border-radius:50%;background:linear-gradient(140deg,#a8c7ff,var(--accent));color:#0b1b33;font-family:'Space Grotesk',Inter,sans-serif;font-size:18px;font-weight:700;letter-spacing:-.02em}
.drawer-names{min-width:0}
.drawer-names h2{margin:0;font-size:20px;font-weight:600;letter-spacing:-.02em;line-height:1.2}
.drawer-user{margin:3px 0 0;font-size:13px;color:var(--text);overflow-wrap:anywhere}
.drawer-realm{margin:2px 0 0;font-size:11.5px;color:var(--muted)}
.drawer-section{margin:20px 24px 8px;font-size:11px;letter-spacing:.1em;color:var(--muted)}
.drawer-list{display:grid;gap:6px;padding:0 14px}
.drawer-item{display:flex;align-items:center;gap:12px;width:100%;min-height:46px;padding:10px 12px;border:0;border-radius:10px;background:transparent;color:var(--text);font-size:14px;font-weight:500;text-align:left;text-decoration:none;transition:background .2s var(--ease),color .2s var(--ease)}
.drawer-item:hover{background:rgba(255,255,255,.05);color:#f2f5f9}
.drawer-item svg{width:19px;height:19px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;opacity:.85}
.drawer-item.is-danger{color:#ffb4ab}
.drawer-item.is-danger:hover{background:rgba(242,139,130,.13)}
.drawer-item.is-static{cursor:default}
.drawer-item.is-static:hover{background:transparent;color:var(--text)}
.drawer-item.is-static b{margin-left:auto;font-weight:600;font-variant-numeric:tabular-nums;color:#f3f6fa}
.drawer-item-arrow{margin-left:auto;color:var(--muted);font-size:15px}
.drawer-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:16px 24px 20px;border-top:1px solid var(--border);font-size:11px;color:#6f7885}
@media(max-width:480px){.drawer{width:100vw}.drawer-head{padding:18px 18px}.drawer-section{margin:18px 18px 8px}.drawer-list{padding:0 10px}.drawer-foot{padding:14px 18px 18px}}
