/* Five distinct SaaS layouts share the same working inbox controls. */
.saas-app{--primary:#2f6c4f;--accent:#2f6c4f;--ink:#202c25;--muted:#7a857f;--line:#e2e8e2;--surface:#fff;--canvas:#f5f7f3;--head-font:"Manrope",sans-serif;--body-font:"Manrope",sans-serif;background:var(--canvas);color:var(--ink);font:14px/1.6 "Manrope",system-ui,sans-serif}.saas-app button,.saas-app input,.saas-app select,.saas-app h1,.saas-app h2{font-family:inherit}.saas-app svg{width:20px;height:20px;flex-shrink:0}.saas-app a,.saas-app button{-webkit-tap-highlight-color:transparent}.saas-app button{cursor:pointer}.saas-app [hidden]{display:none!important}.saas-shell{display:flex;min-height:100dvh}.saas-brand{display:flex;align-items:center;gap:11px;font-size:20px;font-weight:800;letter-spacing:-.7px;white-space:nowrap}.saas-mark{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:36px;height:36px;border-radius:10px;background:var(--accent);color:var(--surface)}.saas-mark svg{width:22px;height:22px}.saas-sidebar{width:234px;flex-shrink:0;border-right:1px solid var(--line);padding:32px 24px;display:flex;flex-direction:column;background:var(--surface)}.saas-side-nav{display:flex;flex-direction:column;gap:8px;margin-top:50px}.saas-side-nav a,.saas-side-nav button{display:flex;align-items:center;gap:12px;text-align:left;padding:11px 12px;font-size:13px;font-weight:600;border-radius:8px;color:var(--muted)}.saas-side-nav .is-active{background:color-mix(in srgb,var(--accent) 9%,transparent);color:var(--accent)}.saas-side-nav button:hover,.saas-side-nav a:hover{color:var(--accent);background:color-mix(in srgb,var(--accent) 7%,transparent)}.saas-sidebar-bottom{margin-top:auto;padding-top:80px}.saas-sidebar-bottom p{color:var(--muted);font-size:11px;line-height:1.8;margin-top:20px}.saas-workspace{flex:1;min-width:0}.saas-topbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 40px;min-height:88px;border-bottom:1px solid var(--line)}.saas-breadcrumb{color:var(--muted);font-size:12px}.saas-breadcrumb b{font-weight:600;color:var(--ink)}.saas-admin-link{color:var(--muted);font-size:12px;white-space:nowrap}.saas-admin-link:hover{color:var(--accent)}.saas-content{max-width:1140px;margin:auto;padding:44px 40px 60px;min-width:0}.saas-title{margin-bottom:32px}.saas-eyebrow{display:block;font-size:10px;font-weight:800;letter-spacing:1.5px;color:var(--accent);margin-bottom:12px}.saas-title h1{font-size:clamp(30px,3.6vw,43px);letter-spacing:-1.8px;font-weight:800;line-height:1.2;margin:0 0 14px}.saas-title h1>span{display:block;color:#97a299;font-weight:500}.saas-title h2{font-size:26px;letter-spacing:-1px;font-weight:700}.saas-title p{color:var(--muted);font-size:13px;margin:12px 0 0}.saas-address{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:22px 24px;position:relative;min-width:0}.address-label{display:flex;justify-content:space-between;align-items:center;gap:16px;color:var(--muted);font-size:11px;font-weight:600}.live-indicator{display:flex;align-items:center;gap:6px;color:var(--accent);font-size:10px}.live-indicator i{width:5px;height:5px;border-radius:50%;background:var(--accent)}.saas-app .address-wrap{position:relative;min-width:0;margin:12px 0 20px}.saas-app #historyToggle{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;text-align:left;font-weight:700;font-size:clamp(16px,2vw,24px);letter-spacing:-.65px;color:var(--ink);padding:0;background:transparent}.saas-app #historyToggle>svg{width:16px;height:16px;color:var(--muted)}.saas-app #email{overflow-wrap:anywhere;min-width:0}.saas-toolbar{display:flex;flex-wrap:wrap;gap:8px;border-top:1px solid var(--line);padding-top:16px}.saas-toolbar button{display:flex;align-items:center;justify-content:center;gap:7px;padding:9px 14px;border-radius:7px;background:var(--canvas);border:1px solid var(--line);color:var(--ink);font-size:11px;font-weight:600;transition:background .15s}.saas-toolbar button:hover{background:color-mix(in srgb,var(--accent) 9%,var(--surface));border-color:var(--accent)}.saas-toolbar #new{background:var(--accent);border-color:var(--accent);color:var(--surface)}.saas-toolbar .danger-action{margin-left:auto;color:var(--muted)}.saas-toolbar .danger-action:hover{color:#b64949;border-color:#b64949;background:#b6494909}.saas-toolbar svg{width:15px;height:15px}.saas-metadata{display:flex;justify-content:space-between;gap:10px;padding:12px 2px 22px;color:var(--muted);font-size:10px}.saas-inbox{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;min-width:0}.saas-inbox-heading{padding:22px 24px;display:flex;justify-content:space-between;align-items:center;gap:15px;border-bottom:1px solid var(--line)}.saas-inbox-heading h2{font-size:15px;font-weight:800;display:flex;align-items:center;gap:8px}.saas-inbox-heading p{font-size:11px;color:var(--muted);margin-top:4px}.saas-count{font-size:10px;color:var(--muted);border:1px solid var(--line);border-radius:6px;min-width:20px;padding:1px 5px;text-align:center}.saas-private{font-size:10px;color:var(--muted);border:1px solid var(--line);border-radius:20px;padding:4px 9px;white-space:nowrap}.saas-app .saas-columns{display:grid;grid-template-columns:25% 1fr 15%;gap:12px;padding:12px 24px;font-size:10px;font-weight:700;color:var(--muted);background:var(--canvas)}.saas-columns span:last-child{text-align:right}.saas-app .table-mailbox .empty{min-height:320px;flex-direction:column;gap:15px;font-size:14px;color:var(--muted)}.saas-app .empty::before{content:"";width:48px;height:48px;border:1px solid var(--line);border-radius:14px;background:var(--canvas) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23838a94' stroke-width='1.4'%3E%3Crect x='3' y='5' width='18' height='14' rx='3'/%3E%3Cpath d='m3 7 9 6 9-6'/%3E%3C/svg%3E") no-repeat center}.saas-app .empty::after{content:"Send an email to your address to get started.";font-size:11px;color:var(--muted);opacity:.7;text-align:center;max-width:240px}.saas-app .table-mailbox .message-row{background:var(--surface);border-color:var(--line);color:var(--ink);font-size:12px;padding:17px 24px}.saas-app .table-mailbox .message-row:hover{background:var(--canvas)}.saas-app .row-time{color:var(--muted)}.saas-theme-switch{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:11px}.saas-theme-switch select{font-size:11px;border:1px solid var(--line);border-radius:7px;background-color:var(--surface);color:var(--ink);padding:7px 30px 7px 10px}.saas-sidebar-bottom .saas-theme-switch{align-items:flex-start;flex-direction:column;gap:8px}.saas-sidebar-bottom select{width:100%}.saas-menu-btn{display:none;padding:8px;border:1px solid var(--line);border-radius:8px;color:var(--ink)}.saas-header-right{display:flex;align-items:center;gap:24px}.saas-app .history-dropdown{color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:10px}.history-heading{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line);font-size:12px}.history-heading button{font-size:20px}.saas-app .historyrow{border-color:var(--line);font-size:11px}.saas-app .historyrow button{color:var(--accent)}.saas-app .delivery-notice{position:relative;inset:auto;margin:16px;font-size:12px}.saas-app #reader{color:var(--ink);background:var(--surface)}.saas-app .reader-head{background:var(--canvas);color:var(--ink);font-size:11px;border-bottom:1px solid var(--line);padding:16px 24px}.saas-app #reader h2{font-size:15px;font-weight:700;border-color:var(--line)}.saas-app #mailDate{color:var(--muted)}.saas-app #textView{color:var(--ink);font-size:13px}.saas-app .tabs button{border-color:var(--line);color:var(--muted)}.saas-app .tabs button.active{background:var(--accent);color:var(--surface);border-color:var(--accent)}.saas-app #htmlView{border-radius:8px}.saas-create{padding:2px 0}.saas-form{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:center}.saas-input{width:100%;min-width:0;background-color:var(--canvas);border:1px solid var(--line);color:var(--ink);padding:12px;border-radius:7px;font-size:13px}.saas-primary,.saas-secondary{padding:12px 16px;border-radius:7px;font-size:11px;font-weight:600}.saas-primary{background:var(--accent);color:var(--surface)}.saas-secondary{border:1px solid var(--line);background:var(--canvas);color:var(--ink)}.saas-app .random-row{justify-content:flex-start;margin:16px 0 0;gap:10px}.saas-app #createError{grid-column:1/-1;font-size:12px;color:#c56161}.saas-app .mobile-menu{color:var(--ink);background:var(--surface)}.saas-app .mobile-menu::backdrop{background:var(--surface)}.saas-app .mobile-menu select{color:var(--ink);background-color:var(--canvas);border-color:var(--line)}.saas-app #toast{background:var(--surface);border-color:var(--accent);color:var(--ink)}.saas-app .otp-code{background:var(--canvas);color:var(--muted)}.saas-app .otp-code button{color:var(--accent)}
/* Atlas — quiet white sidebar and a green workspace. */
.atlas-shell .saas-address{box-shadow:0 4px 16px #233d2803}.atlas-shell .saas-topbar{background:var(--surface)}
/* Orbit — narrow navigation rail and a dark command workspace. */
body[data-theme=orbit]{--primary:#bba5ff;--accent:#bba5ff;--ink:#edeef6;--muted:#85899d;--line:#2c3042;--surface:#1b1e2b;--canvas:#10121b}.orbit-rail{width:90px;flex-shrink:0;padding:30px 14px;border-right:1px solid var(--line);display:flex;flex-direction:column;align-items:center;background:#151722}.orbit-rail .saas-brand>span:last-child{display:none}.orbit-rail .saas-mark{background:#292639;color:#c5b3ff}.orbit-rail .saas-side-nav{gap:20px;margin-top:45px}.orbit-rail .saas-side-nav span{display:none}.orbit-rail .saas-side-nav a,.orbit-rail .saas-side-nav button{padding:14px}.rail-caption{writing-mode:vertical-rl;letter-spacing:2px;font-size:9px;color:var(--muted);margin-top:auto;padding-top:40px}.orbit-shell .saas-topbar{min-height:76px;border-bottom:0}.orbit-shell .saas-content{padding-top:24px;max-width:1120px}.orbit-shell .saas-title{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:38px}.orbit-shell .saas-title h1{font-size:38px;font-weight:600;letter-spacing:-1.5px}.orbit-orb{position:relative;width:68px;height:68px;border:1px solid #bba5ff30;border-radius:50%;flex-shrink:0;box-shadow:0 0 0 14px #bba5ff05}.orbit-orb::before{position:absolute;inset:15px;content:"";border-radius:50%;background:radial-gradient(circle at 35% 30%,#d9cbff,#8061d9 60%,#332754);box-shadow:0 0 25px #bba5ff18}.orbit-shell .saas-address{border-left:3px solid var(--accent);border-radius:8px}.orbit-shell .saas-inbox{border-radius:8px}.orbit-shell .saas-private{color:#bba5ff;background:#bba5ff0b}.orbit-shell .saas-theme-switch select{background-image:none;padding-right:12px}.orbit-shell .saas-toolbar #new{color:#1b1e2b}
/* Paper — editorial typography and a wide, open composition. */
body[data-theme=paper]{--primary:#202220;--accent:#202220;--ink:#202220;--muted:#8b8b81;--line:#e5e4db;--surface:#fff;--canvas:#faf9f6}.paper-shell{max-width:1240px;margin:auto}.paper-shell .saas-topbar{padding:28px 48px;background:transparent}.paper-shell .saas-brand{font-size:18px;letter-spacing:-.8px}.paper-shell .saas-mark{background:transparent;color:var(--ink);width:28px;height:28px}.paper-shell .saas-mark svg{width:28px;height:28px}.paper-shell .saas-content{max-width:none;padding:50px 48px 24px}.paper-shell .saas-title{margin-bottom:40px}.paper-shell .saas-title h1{font-family:Georgia,"Times New Roman",serif;font-size:70px;line-height:1.02;font-weight:400;letter-spacing:-3px}.paper-shell .saas-title p{margin-top:20px}.paper-address-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:40px;align-items:center}.paper-shell .saas-address{border-radius:0;background:transparent;border-width:1px 0;padding:24px 0}.paper-shell .saas-toolbar{border-top:0;padding-top:4px;gap:16px}.paper-shell .saas-toolbar button{background:transparent;border:0;padding:7px 0;border-radius:0}.paper-shell .saas-toolbar #new{background:var(--accent);color:white;padding:8px 14px}.paper-note{border-left:1px solid var(--line);padding-left:32px}.paper-note>span{font-size:9px;color:var(--muted);letter-spacing:1px}.paper-note h2{font-family:Georgia,serif;font-size:27px;line-height:1.3;margin:12px 0;font-weight:400}.paper-note p{font-size:11px;color:var(--muted);max-width:210px}.paper-shell .saas-inbox{border-radius:0;background:transparent;border-width:1px 0}.paper-shell .saas-inbox-heading{padding:22px 0}.paper-shell .saas-private{border:0;padding:0}.paper-footer{display:flex;justify-content:space-between;gap:15px;font-size:10px;color:var(--muted);padding:40px 0 15px}
/* Aurora — split welcome panel and a compact floating mail workspace. */
body[data-theme=aurora]{--primary:#7558d8;--accent:#7558d8;--ink:#343047;--muted:#9590a8;--line:#e9e5f2;--surface:#fff;--canvas:#f8f6ff}.aurora-shell>.saas-topbar{background:var(--surface);padding:24px 48px;min-height:88px}.aurora-body{max-width:1400px;margin:auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.7fr)}.aurora-welcome{padding:62px 44px;position:relative;overflow:hidden;min-width:0}.aurora-welcome h1{font-size:clamp(35px,4vw,52px);font-weight:800;line-height:1.13;letter-spacing:-2px;margin:24px 0}.aurora-welcome p{font-size:13px;color:var(--muted);max-width:275px;line-height:1.9}.aurora-art{margin:44px 0;display:flex;align-items:center;justify-content:center;width:175px;height:150px;border-radius:28px;transform:rotate(-8deg);background:linear-gradient(145deg,#eae3ff,#d7caff);box-shadow:18px 22px 0 #ebe5fc}.aurora-art svg{width:75px;height:75px;color:#957bdd;transform:rotate(8deg);stroke-width:1}.aurora-small{font-size:10px;color:var(--muted)}.aurora-body>.saas-content{width:100%;padding:54px 40px 54px 12px;margin:0}.aurora-body .saas-title{margin-bottom:20px}.aurora-body .saas-address{border-radius:16px;box-shadow:0 12px 32px #7558d809}.aurora-body .saas-inbox{border-radius:16px}.aurora-body .saas-toolbar #new{background:linear-gradient(135deg,#8664e8,#7050cf)}.aurora-body #historyToggle{font-size:20px}
/* Bento — a grid of functional cards with a dedicated address column. */
body[data-theme=bento]{--primary:#3564d8;--accent:#3564d8;--ink:#24334c;--muted:#8791a2;--line:#e5e9ef;--surface:#fff;--canvas:#f1f3f6}.bento-shell .saas-topbar{background:var(--surface);padding:24px 48px}.bento-shell .saas-content{max-width:1300px;padding-top:40px}.bento-shell .saas-title h1{font-size:36px;letter-spacing:-1.5px}.bento-grid{display:grid;grid-template-columns:minmax(0,350px) minmax(0,1fr);gap:22px;align-items:start}.bento-tools{display:flex;flex-direction:column;gap:18px;min-width:0}.bento-shell .saas-address{padding:24px;border-radius:18px;border:0}.bento-shell #historyToggle{font-size:18px;line-height:1.6}.bento-shell .saas-toolbar{display:grid;grid-template-columns:1fr 1fr}.bento-shell .saas-toolbar .danger-action{margin-left:0}.bento-shell .saas-toolbar button{padding:12px 5px}.bento-shell .saas-inbox{border:0;border-radius:18px;min-height:580px}.bento-shell .empty{min-height:460px!important}.bento-status-card{padding:22px 24px;border-radius:18px;background:var(--surface)}.bento-status-card .saas-metadata{flex-direction:column;gap:8px;padding:0}.bento-status-card .saas-eyebrow{margin-bottom:15px}.bento-note{border-radius:18px;background:#e3ebff;padding:24px}.bento-note .saas-mark{background:#d3dfff;color:var(--accent)}.bento-note h2{font-size:19px;line-height:1.4;font-weight:700;letter-spacing:-.5px;margin:20px 0 12px}.bento-note p{font-size:11px;color:#6e80a8}.bento-shell .saas-form{grid-template-columns:1fr}.bento-shell .saas-form #createError{grid-column:auto}.bento-shell .random-row{flex-direction:column;gap:8px}.bento-shell .saas-private{background:var(--canvas);border:0}
@media(max-width:1050px){.saas-sidebar{width:200px;padding:28px 18px}.saas-topbar{padding:22px 28px}.saas-content{padding:36px 28px 44px}.aurora-body{grid-template-columns:1fr 1.5fr}.aurora-welcome{padding:50px 28px}.aurora-body>.saas-content{padding:44px 28px 44px 0}.aurora-welcome h1{font-size:40px}.aurora-body #historyToggle{font-size:17px}.bento-grid{grid-template-columns:minmax(0,300px) minmax(0,1fr)}.saas-form{grid-template-columns:1fr 1fr}.saas-form .saas-primary{grid-column:1/-1}}
@media(max-width:800px){.saas-sidebar,.orbit-rail{display:none}.saas-topbar,.paper-shell .saas-topbar,.aurora-shell>.saas-topbar,.bento-shell .saas-topbar{padding:20px 22px;min-height:78px}.saas-menu-btn{display:block}.saas-topbar>.saas-admin-link,.saas-header-right>.saas-admin-link,.saas-topbar .saas-theme-switch{display:none}.saas-content,.paper-shell .saas-content{padding:30px 22px 40px}.saas-title h1{font-size:34px}.saas-title h1>span{font-size:30px}.saas-title{margin-bottom:24px}.saas-header-right{gap:0}.saas-address{padding:20px}.saas-app #historyToggle{font-size:19px}.saas-app .saas-inbox-heading{padding:20px}.saas-app .saas-private{font-size:9px}.saas-app .saas-inbox-heading p{font-size:10px}.saas-app .saas-columns{grid-template-columns:1fr 1fr;padding:10px 20px}.saas-columns span:last-child{display:none}.saas-app .table-mailbox .message-row{padding:16px 20px}.saas-app .reader-head{padding:15px 20px;font-size:10px}.saas-app #reader>div.py-4,.saas-app #subject{padding-left:20px;padding-right:20px}.saas-app .table-mailbox .empty{min-height:300px}.paper-shell .saas-title h1{font-size:56px}.paper-address-layout{grid-template-columns:1fr;gap:20px}.paper-note{display:none}.paper-shell .saas-address{padding:20px 0}.paper-shell .saas-inbox-heading{padding:20px 0}.paper-shell .saas-toolbar{gap:12px}.paper-footer{font-size:9px}.orbit-shell .saas-title h1{font-size:30px}.orbit-orb{width:48px;height:48px;box-shadow:0 0 0 10px #bba5ff05}.orbit-orb::before{inset:10px}.aurora-body{display:block}.aurora-welcome{padding:30px 22px 10px}.aurora-welcome h1{font-size:35px;margin:14px 0}.aurora-welcome h1 br{display:none}.aurora-welcome p{max-width:440px}.aurora-art,.aurora-small{display:none}.aurora-body>.saas-content{padding:24px 22px 40px}.aurora-body .saas-title{display:none}.bento-grid{grid-template-columns:1fr}.bento-tools{gap:0}.bento-status-card{padding:0;background:none}.bento-status-card .saas-eyebrow{display:none}.bento-status-card .saas-metadata{flex-direction:row;padding:12px 0 0}.bento-note{display:none}.bento-shell .saas-toolbar{display:flex}.bento-shell .saas-toolbar button{padding:9px 12px}.bento-shell .saas-toolbar .danger-action{margin-left:auto}.bento-shell .saas-inbox{min-height:auto}.bento-shell .empty{min-height:300px!important}}
@media(max-width:420px){.saas-content,.paper-shell .saas-content{padding-left:16px;padding-right:16px}.saas-topbar,.paper-shell .saas-topbar,.aurora-shell>.saas-topbar,.bento-shell .saas-topbar{padding:16px}.saas-toolbar{gap:6px}.saas-toolbar button{padding:8px 10px;font-size:10px}.saas-toolbar #new span{font-size:10px}.saas-toolbar .danger-action{margin-left:0}.saas-app #historyToggle{font-size:17px}.saas-address{padding:18px}.saas-app .saas-inbox-heading{padding:18px}.saas-private{display:none}.saas-form{grid-template-columns:1fr}.saas-app #reader .reader-head>div{gap:8px}.saas-app .reader-head svg{width:16px;height:16px}.saas-app .reader-head>button span{margin-left:4px}.bento-shell .saas-toolbar button{padding:8px 10px}.bento-shell .saas-toolbar .danger-action{margin-left:0}}
@media(prefers-reduced-motion:reduce){.saas-app *, .saas-app *::before{scroll-behavior:auto!important;transition:none!important;animation:none!important}}