/* Account drawer — a compact editorial space for navigation and settings. */
.side-menu-bd { background:rgba(17,21,18,0); backdrop-filter:blur(0);transition:background .45s,backdrop-filter .45s; }
.side-menu-bd.on { background:rgba(18,21,18,.54);backdrop-filter:blur(7px); }
.side-menu { width:min(420px,92vw);background:#f3f0e8;box-shadow:-25px 0 70px rgba(13,18,13,.24);transition:transform .56s cubic-bezier(.22,1,.36,1);overflow:hidden; }
.side-menu:before { content:'';position:absolute;top:0;right:0;width:4px;height:100%;background:#e65a3b;z-index:2;pointer-events:none; }
.side-menu-top { height:72px;flex:none;justify-content:space-between;align-items:center;padding:14px 28px 8px;position:relative;z-index:1; }
.side-menu-brand { display:flex;align-items:center;gap:9px;font:22px/1 'Bebas Neue',sans-serif;letter-spacing:.055em;color:#292e27; }
.side-menu-brand > span:last-child > span { color:#e65838; }
.side-menu-brand-mark { width:29px;height:29px;background:#e65838;color:#fff;border-radius:8px;display:grid;place-items:center;font-size:21px;letter-spacing:0; }
.side-menu-x { width:38px;height:38px;background:#e7e1d6;border:1px solid #dcd5c8;color:#33382f;transition:transform .3s,background .3s; }
.side-menu-x:hover { background:#dcd5c8;transform:rotate(90deg); }
.side-menu-x svg { width:18px;height:18px; }
.side-menu-scroll { overflow-y:auto;overscroll-behavior:contain;flex:1;min-height:0;padding:0 24px 20px;scrollbar-width:none; }
.side-menu-scroll::-webkit-scrollbar { display:none; }
.side-menu-intro { position:relative;overflow:hidden;padding:23px 4px 23px; }
.side-menu-intro:after { content:'';position:absolute;width:170px;height:170px;border:1px solid #e3ddd1;border-radius:50%;top:2px;right:-56px;box-shadow:0 0 0 22px rgba(227,221,209,.36),0 0 0 48px rgba(227,221,209,.17);pointer-events:none; }
.side-menu-intro > span,.side-menu-section-label,.side-profile-overline,.side-menu-footer-rule { font:700 10px 'DM Sans',sans-serif;letter-spacing:.17em; }
.side-menu-intro > span { color:#ab5e49; }
.side-menu-intro h2 { position:relative;z-index:1;font:400 clamp(58px,16vw,78px)/.79 'Bebas Neue',sans-serif;letter-spacing:-.012em;color:#252b24;margin:22px 0 13px; }
.side-menu-intro h2 em { color:#df5b3e;font-style:normal; }
.side-menu-intro p { position:relative;z-index:1;color:#787c70;font-size:12px;line-height:1.5;max-width:220px; }
.side-menu-profile { width:100%;min-height:113px;padding:15px;gap:13px;background:#222920;color:#fffaf0;border:1px solid #222920;border-radius:20px;text-align:left;box-shadow:0 15px 27px rgba(31,40,29,.12);transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s; }
.side-menu-profile:hover { transform:translateY(-3px);box-shadow:0 20px 30px rgba(31,40,29,.17); }
.side-menu-profile:active { background:#2e372c;transform:scale(.985); }
.side-profile-av-wrap { position:relative;flex:none; }
.side-profile-av { width:62px;height:62px;border-radius:17px;background:#e65838;box-shadow:none;font-size:25px; }
.side-profile-av-edit { position:absolute;right:-5px;bottom:-5px;border:2px solid #222920;background:#f8efe0;color:#253029;border-radius:50%;width:23px;height:23px;display:grid;place-items:center; }
.side-profile-av-edit svg { width:12px;height:12px; }
.side-profile-info { display:flex;flex-direction:column;gap:3px; }
.side-profile-overline { color:#e8a38c;font-size:9px; }
.side-profile-name { font-size:28px;color:#fffaf0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:170px; }
.side-profile-edit-hint { color:#c9d2c4;font-size:11px; }
.side-menu-profile .side-menu-chevron { color:#fffaf0;display:grid;place-items:center;width:30px;height:30px;flex:none;transition:transform .25s; }
.side-menu-chevron svg { width:19px;height:19px; }
.side-menu-profile:hover .side-menu-chevron { transform:translateX(4px); }
.side-menu-sync { width:max-content;max-width:100%;margin:12px 0 28px;padding:7px 10px;border-radius:100px;border:1px solid #ded9ce;background:#fbf8f0; }
.side-menu-sync .sync-dot { width:7px;height:7px; }
.side-menu-sync #sync-label { color:#676f63;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.side-menu-section-label { display:flex;justify-content:space-between;color:#797f72;margin:0 4px 10px; }
.side-menu-section-label span:last-child { color:#b6b5a9; }
.side-menu-social { display:flex;gap:12px;padding:12px;background:#fffdf7;border:1px solid #ded9cd;border-radius:19px;margin-bottom:28px;box-shadow:0 6px 16px rgba(37,42,32,.035);transition:transform .3s,box-shadow .3s,border-color .3s; }
.side-menu-social:hover { background:#fffdf7;transform:translateY(-3px);box-shadow:0 13px 25px rgba(37,42,32,.1);border-color:#c9b9a8; }
.side-menu-social:active { transform:scale(.985);background:#f5eee4; }
.side-menu-social .side-menu-item-icon,.side-menu-unit-icon { width:45px;height:45px;border-radius:13px;background:#f8e7dd;color:#c9583e;display:grid;place-items:center;flex:none; }
.side-menu-social .side-menu-item-icon svg,.side-menu-unit-icon svg { width:21px;height:21px;color:inherit; }
.side-menu-item-copy { flex:1;min-width:0;display:flex;flex-direction:column;gap:3px; }
.side-menu-item-copy strong { color:#242b23;font:400 22px/1 'Bebas Neue';letter-spacing:.03em; }
.side-menu-item-copy small { color:#808577;font:500 11px/1.25 'DM Sans'; }
.side-menu-social .side-menu-item-arrow,.side-menu-logout .side-menu-item-arrow { width:19px;height:19px;color:#7e8378;transition:transform .3s; }
.side-menu-social:hover .side-menu-item-arrow,.side-menu-logout:hover .side-menu-item-arrow { transform:translateX(4px); }
.side-menu-row { gap:12px;background:#fffdf7;border:1px solid #ded9cd;border-radius:19px;padding:12px; }
.side-menu-row-copy { flex:1;min-width:0;display:flex;flex-direction:column;gap:3px; }
.side-menu-row-lbl { color:#252b24;font-size:14px;font-weight:700; }
.side-menu-row-copy small { color:#83877d;font-size:10px;white-space:nowrap; }
.side-menu-unit-icon { background:#e9eddf;color:#596b54; }
.side-menu-row .unit-toggle { background:#eeece5;border:1px solid #e5e0d6;padding:3px;border-radius:11px;gap:1px;flex:none; }
.side-menu-row .unit-btn { min-width:41px;padding:8px 7px;border-radius:8px;font-weight:700;color:#818477;transition:background .25s,color .25s,box-shadow .25s,transform .25s; }
.side-menu-row .unit-btn.on { background:#252e24;color:#fff;box-shadow:0 2px 7px rgba(22,27,21,.19); }
.side-menu-row .unit-btn:active { transform:scale(.94); }
.side-menu-footer { flex:none;padding:12px 24px max(18px,env(safe-area-inset-bottom));background:#f3f0e8; }
.side-menu-footer-rule { display:flex;justify-content:space-between;gap:8px;color:#a2a296;border-top:1px solid #ddd7cb;padding:13px 4px 12px;font-size:8px;letter-spacing:.12em; }
.side-menu-logout { margin:0;padding:12px;border-radius:15px;border:1px solid #e6cec6;background:#f7e9e3;color:#a54632;font-weight:700;font-size:13px;gap:10px; }
.side-menu-logout:hover { background:#f1dcd4; }
.side-menu-logout:active { background:#eecfc4; }
.side-menu-logout-icon { width:33px;height:33px;display:grid;place-items:center;border-radius:10px;background:#fff8f3; }
.side-menu-logout-icon svg { width:17px;height:17px;color:#aa4932; }
.side-menu-logout .side-menu-item-arrow { margin-left:auto;color:#aa4932; }
.side-menu.on .side-menu-intro,.side-menu.on .side-menu-profile,.side-menu.on .side-menu-sync,.side-menu.on .side-menu-section-label,.side-menu.on .side-menu-social,.side-menu.on .side-menu-row,.side-menu.on .side-menu-footer { animation:menu-reveal .58s cubic-bezier(.22,1,.36,1) both; }
.side-menu.on .side-menu-profile { animation-delay:.05s; }.side-menu.on .side-menu-sync { animation-delay:.1s; }.side-menu.on .side-menu-section-label { animation-delay:.13s; }.side-menu.on .side-menu-social { animation-delay:.17s; }.side-menu.on .side-menu-row { animation-delay:.22s; }.side-menu.on .side-menu-footer { animation-delay:.24s; }
@keyframes menu-reveal { from { opacity:0;transform:translateY(17px); } to { opacity:1;transform:translateY(0); } }
.side-menu :is(button):focus-visible { outline:3px solid #ed7352;outline-offset:3px; }
@media (max-height:690px) { .side-menu-intro { padding:12px 4px 14px; }.side-menu-intro h2 { font-size:52px;margin:12px 0 8px; }.side-menu-sync { margin-bottom:15px; }.side-menu-social { margin-bottom:15px; } }
@media (max-width:355px) { .side-menu-scroll,.side-menu-footer { padding-left:18px;padding-right:18px; }.side-menu-row { gap:7px; }.side-menu-row-copy small { display:none; }.side-menu-intro h2 { font-size:60px; } }
@media (prefers-reduced-motion:reduce) { .side-menu,.side-menu-bd,.side-menu.on .side-menu-intro,.side-menu.on .side-menu-profile,.side-menu.on .side-menu-sync,.side-menu.on .side-menu-section-label,.side-menu.on .side-menu-social,.side-menu.on .side-menu-row,.side-menu.on .side-menu-footer { transition:none;animation:none; } }