/* inside message iframe: see-through, no solid block, no photo re-render */
html.iframe,html.iframe body{background:transparent!important}
html.iframe body::before,html.iframe body::after{content:none!important}
html.iframe body{text-shadow:0 1px 3px rgba(0,0,0,.9)}

/* main doc: sharp photo, clearly visible */
html:not(.iframe){background:#0b0f16!important}
html:not(.iframe) body{background:transparent!important}
html:not(.iframe) body::before{content:"";position:fixed;inset:0;z-index:-1;
background:linear-gradient(rgba(0,0,0,.15),rgba(0,0,0,.28)),
url(/static.php/skins/elastic/assets/bg.jpg) center/contain no-repeat}

/* light glass panels - image shows through clearly (blur is gentle) */
body:not(.task-login) #layout{background:transparent!important}
body:not(.task-login) #layout-menu{background-color:rgba(16,21,30,.52)!important}
body:not(.task-login) #layout-sidebar,
body:not(.task-login) #layout-list{
background-color:rgba(18,24,34,.40)!important;
}

/* READING PANE + email: fully see-through, photo behind */
body:not(.task-login) #layout-content{background-color:rgba(18,24,34,.40)!important;}
body:not(.task-login) #layout-content .header{background-color:rgba(18,24,34,.40)!important}

/* inner layers transparent so email area is see-through */
html.dark-mode #layout-sidebar .scroller,
html.dark-mode #layout-sidebar .header,
html.dark-mode #layout-sidebar ul.listing,
html.dark-mode #folderlist,
html.dark-mode #layout-menu .popover-header,
body:not(.task-login) #layout-list .scroller,
body:not(.task-login) #layout-content .scroller,
body:not(.task-login) .iframe-wrapper,
#messagecontframe{background:transparent!important;background-color:transparent!important;backdrop-filter:none!important}

/* login: frosted glass card */
body.task-login #layout,body.task-login #layout-content{background:transparent!important}
body.task-login #login-form{background:rgba(15,20,28,.55)!important;backdrop-filter:blur(20px);
-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.14);border-radius:16px;
box-shadow:0 16px 50px rgba(0,0,0,.55);padding:28px!important}
body.task-login #logo{border-radius:12px}

/* ==== EMAIL BODY: no white band, frosted-friendly, readable ==== */
html.dark-mode .message-htmlpart,
html.iframe .message-htmlpart,
html.iframe .message-part,
html.iframe #messagebody,
html.iframe pre{background-color:transparent!important;color:#e7e9ec!important;box-shadow:none!important}
html.iframe a{color:#8fbaff!important}

/* reader identical whether empty or a message is open */
body:not(.task-login) #messagecontent,
body:not(.task-login) #layout-content .content,
body:not(.task-login) #messagepreview{background:transparent!important;background-color:transparent!important}

/* ==== quoted text in emails: transparent, readable, subtle quote bar ==== */
html.iframe .message-part blockquote,
html.iframe .message-htmlpart blockquote,
html.dark-mode .message-part blockquote{
background:transparent!important;background-color:transparent!important;
color:#d6dde4!important;border-left:3px solid rgba(255,255,255,.28)!important;
border-right:0!important;padding:.1em .6em!important}
html.iframe blockquote .blockquote-link,
html.iframe .blockquote-link{background:transparent!important;color:#9fb0c0!important;border-color:rgba(255,255,255,.25)!important}

/* ==== FROSTED SHEEN (no blur): milky light film over the sharp image ==== */
body:not(.task-login) #layout-menu,
body:not(.task-login) #layout-sidebar,
body:not(.task-login) #layout-list,
body:not(.task-login) #layout-content{
background-image:linear-gradient(rgba(255,255,255,.06),rgba(255,255,255,.025))!important;
box-shadow:inset 0 1px 0 rgba(255,255,255,.10)!important}