/* User-selectable decorative snow. Canvas remains behind all interactive content. */
.fear-snow-canvas{position:fixed;inset:0;z-index:0;pointer-events:none;user-select:none;contain:strict;opacity:.97}
.fm-auth .auth-shell,.fm-app-body .mail-shell{position:relative;z-index:1}
/* Settings overlay */
.appearance-backdrop{position:fixed;z-index:78;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(7px);animation:appearance-fade .28s ease both}
.appearance-dialog{position:fixed;z-index:79;top:50%;left:50%;transform:translate(-50%,-50%);width:min(530px,calc(100vw - 28px));max-height:min(790px,calc(100dvh - 24px));overflow:auto;padding:25px;background:linear-gradient(155deg,rgba(19,20,24,.99),rgba(5,6,9,.99));border:1px solid rgba(250,250,255,.25);border-radius:27px;box-shadow:0 35px 140px #000f,0 0 90px rgba(233,238,255,.065),inset 0 1px #ffffff18;animation:appearance-pop .32s cubic-bezier(.17,.78,.27,1) both}
.settings-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:2px 0 28px}
.settings-eyebrow{font-size:10px!important;letter-spacing:.17em;color:#8d93a3;margin:0 0 11px}
.settings-heading h2{font-size:27px;letter-spacing:-.05em;line-height:1.2;color:#fff;margin:0 0 10px}
.settings-heading p:not(.settings-eyebrow){font-size:12px;line-height:1.55;color:#a0a2ae;margin:0;max-width:320px}
.settings-close{height:39px;width:39px;flex:none;display:grid;place-items:center;background:#1c1e23;border:1px solid #ffffff24;border-radius:12px;color:#ced1db;transition:transform .22s,background .22s,border-color .22s}
.settings-close:hover{transform:rotate(90deg);border-color:#fff;background:#292c33}
.settings-close .ico{width:19px;height:19px}
.settings-section-title{display:flex;justify-content:space-between;align-items:center;margin:1px 0 12px;padding:0 2px;color:#e1e2e6;font-weight:680;font-size:10px;letter-spacing:.13em}
.settings-section-note{font-size:10px;font-weight:500;text-transform:none;letter-spacing:0;color:#858993}
.snow-options{display:grid;gap:11px}
.snow-option{width:100%;display:flex;align-items:center;gap:14px;min-height:85px;padding:12px;background:#101116;border:1px solid #ffffff18;border-radius:17px;text-align:left;color:#e8e9ed;transition:border-color .22s,box-shadow .22s,background .22s,transform .22s}
.snow-option:hover{transform:translateY(-2px);background:#191b22;border-color:#ffffff65;box-shadow:0 7px 27px #0008,0 0 26px #ffffff08}
.snow-option.selected{border-color:#e9efff;background:linear-gradient(115deg,#252830,#14161b);box-shadow:0 0 0 3px #ffffff09,0 0 30px #ffffff0e,inset 0 1px #ffffff1e}
.snow-option-preview{position:relative;display:block;width:105px;height:59px;flex:none;overflow:hidden;border:1px solid #ffffff24;border-radius:12px;background:radial-gradient(circle at 80% 14%,#4b536e30,transparent 55%),#05060a;box-shadow:inset 0 0 16px #000a}
.snow-option-copy{display:flex;flex:1;flex-direction:column;gap:6px;min-width:0}
.snow-option-copy strong{font-weight:680;font-size:13px;letter-spacing:-.01em}
.snow-option-copy small{font-weight:400;font-size:11px;color:#a4a5b0;line-height:1.4}
.snow-option-check{height:18px;width:18px;border:1px solid #7a7d86;border-radius:50%;flex:none;position:relative;transition:background .2s,border-color .2s}
.snow-option.selected .snow-option-check{background:#e8ecf5;border-color:#fff;box-shadow:0 0 15px #ffffff3d}
.snow-option.selected .snow-option-check::after{content:'';position:absolute;inset:5px;background:#24262c;border-radius:50%}
.snow-preview-center{position:absolute;inset:0;display:grid;place-items:center;color:#606577;font-size:24px}
.preview-flake{position:absolute;display:block;color:#e1efff;line-height:1;filter:drop-shadow(0 0 5px #cadbff);animation:preview-fall 5s ease-in-out infinite alternate}
.preview-subtle .preview-flake:nth-child(1){font-size:12px;left:17px;top:10px;opacity:.55}
.preview-subtle .preview-flake:nth-child(2){font-size:14px;left:56px;top:27px;opacity:.65;animation-delay:1.8s}
.preview-subtle .preview-flake:nth-child(3){font-size:9px;left:80px;top:6px;opacity:.5;animation-delay:.8s}
.preview-neon{background:radial-gradient(circle at 60% 80%,#a3b6eb29,transparent 65%),#080b12}
.preview-neon .preview-flake{opacity:.95;filter:drop-shadow(0 0 8px #e0ecff)}
.preview-neon .preview-flake:nth-child(1){font-size:24px;left:16px;top:8px}
.preview-neon .preview-flake:nth-child(2){font-size:17px;left:58px;top:10px;animation-delay:.6s}
.preview-neon .preview-flake:nth-child(3){font-size:18px;left:71px;top:31px;animation-delay:1.2s}
.preview-neon .preview-flake:nth-child(4){font-size:11px;left:45px;top:35px;animation-delay:1.8s}
.settings-footnote{color:#8f919a;font-size:11px;line-height:1.55;margin:17px 2px 21px}
.settings-done{width:100%;height:46px;background:linear-gradient(130deg,#e5e7ed,#afb4c2);color:#090a0e;border:1px solid #fff;border-radius:13px;font-weight:700;transition:box-shadow .2s,transform .2s}
.settings-done:hover{transform:translateY(-2px);box-shadow:0 0 25px #ffffff33}
.settings-done span{padding-left:4px}
@keyframes appearance-fade{from{opacity:0}to{opacity:1}}
@keyframes appearance-pop{from{opacity:0;transform:translate(-50%,-47%) scale(.95)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes preview-fall{from{transform:translateY(-4px) rotate(-7deg)}to{transform:translateY(6px) rotate(13deg)}}
@media (max-width:480px){.appearance-dialog{padding:18px;border-radius:21px}.settings-heading{padding-bottom:20px}.snow-option{gap:10px;padding:9px;min-height:80px}.snow-option-preview{width:76px}.snow-option-copy small{font-size:10px}}
@media (prefers-reduced-motion:reduce){.appearance-dialog,.appearance-backdrop,.preview-flake{animation:none!important}.snow-option,.settings-done,.settings-close{transition:none!important}}
/* Make the user's preferred winter-neon mode clearly visible across dark panels.
   Tiny sparkles float as a noninteractive atmospheric overlay. */
html[data-snow="neon"] .fear-snow-canvas{z-index:2;opacity:.57}
html[data-snow="subtle"] .fear-snow-canvas{z-index:0;opacity:.95}

/* Fear Mail v7 — Security sessions, fully client-visible only after 2FA. */
.security-panel{margin:22px 0 3px;padding:20px;border:1px solid #ffffff23;background:linear-gradient(160deg,#131418,#090a0d);border-radius:15px}
.security-topline{display:flex;align-items:start;justify-content:space-between;gap:12px}
.security-topline .settings-eyebrow{margin-bottom:8px}
.security-topline h3{font-size:19px;color:#f2f3f6;margin:0 0 7px;font-weight:700;letter-spacing:-.03em}
.security-topline p,.security-notice{color:#a4a7b2;line-height:1.5;font-size:11px;margin:0}
.security-count{border:1px solid #ffffff27;border-radius:9px;min-width:27px;padding:5px 7px;text-align:center;color:#f5f6fc;font-weight:700}
.security-panel>.security-notice{margin:13px 0}
.security-sessions{display:grid;gap:9px;margin:13px 0}
.security-session{display:flex;gap:12px;justify-content:space-between;align-items:center;border:1px solid #ffffff16;background:#050609;padding:12px;border-radius:11px}
.security-session-info{display:flex;flex-direction:column;gap:4px;min-width:0;overflow-wrap:anywhere}
.security-session-info strong{font-size:12px;color:#f1f2f5}
.security-device{font-size:11px;color:#bfc3d0}
.security-session-info small{font-size:10px;color:#9297a5;line-height:1.5}
.security-placeholder{font-size:12px;color:#acb1bd;margin:0;padding:12px;border:1px dashed #ffffff22;border-radius:10px}
.security-revoke,.security-action{flex:none;color:#e4e5eb;font-size:11px;padding:10px 12px;border:1px solid #ffffff35;border-radius:10px;background:#16181d;transition:transform .18s,border-color .18s,background .18s;cursor:pointer}
.security-revoke:hover,.security-action:hover{background:#24262c;border-color:#e0e2ed;transform:translateY(-1px)}
.security-actions{display:flex;flex-wrap:wrap;gap:9px}
.security-danger{border-color:#96535788;color:#ffbabe}
.security-danger:hover{border-color:#e5979b;background:#2d1418}
.security-action:disabled,.security-revoke:disabled{opacity:.45;cursor:not-allowed;transform:none}
.security-alert-row{display:flex;align-items:center;gap:10px;border-top:1px solid #ffffff1b;margin-top:19px;padding-top:17px}
.security-alert-dot{width:10px;height:10px;flex:none;border-radius:50%;background:#757b83;box-shadow:0 0 12px #ffffff29}
.alerts-enabled .security-alert-dot{background:#b6e8cd;box-shadow:0 0 13px #92dfbc8f}
.security-alert-row div{display:flex;flex-direction:column;gap:3px}
.security-alert-row strong{font-size:12px;color:#f5f5f8}
.security-alert-row small{font-size:11px;color:#9296a1}
.security-panel code{font-size:10px;color:#f3f4f6}
.appearance-dialog{width:min(610px,calc(100vw - 28px));border-radius:17px}
@media(max-width:480px){.security-panel{padding:14px}.security-session{align-items:flex-start;flex-direction:column}.security-revoke{width:100%}}
@media(prefers-reduced-motion:reduce){.security-revoke,.security-action{transition:none!important}}
