@font-face{font-family:Manrope;src:url('/static/manrope.woff2') format('woff2');font-style:normal;font-weight:200 800;font-display:swap}
:root{font-family:Manrope,'Segoe UI',sans-serif;--bg:#fff9e9;--panel:#fffdf6;--soft:#fff4cf;--hover:#fff0aa;--line:#c9c2d4;--text:#171323;--muted:#565067;--green:#4357ff;--green-soft:#ffe44d;--green-text:#252048;--danger:#af193b;--shadow:5px 5px 0 #171323;--ink:#171323;--pink:#ff4f91;--yellow:#ffe44d;--mint:#89f0c4}
body{background-image:radial-gradient(#17132316 .8px,transparent .8px);background-size:14px 14px;font-size:14px}
h1,h2,h3{font-weight:800!important;letter-spacing:-.8px}button,input,textarea,select{border-radius:4px}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:3px solid #4357ff;outline-offset:4px}
input:focus,textarea:focus,select:focus{box-shadow:0 0 0 3px #4357ff30;border-color:#4357ff}
input[type=checkbox]{accent-color:#4357ff;width:17px;height:17px}
.primary,.compose-button,.secondary{border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink);font-weight:800;transition:transform .12s,box-shadow .12s;min-height:44px}
.primary{background:var(--yellow);color:#171323}.primary:hover{filter:none;background:#ffed80;transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}
.primary:active,.compose-button:active,.secondary:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
.secondary{background:var(--panel);color:var(--text)}.compose-button{background:var(--pink);color:#171323;border-radius:4px}
.brand{color:var(--text);gap:10px}.brand img{border:2px solid var(--ink);border-radius:10px;background:#22bed3;width:42px;height:42px}
.brand span{font-weight:800;letter-spacing:-.8px}.brand b{font-weight:800;color:var(--text);background:var(--yellow);padding:2px 5px;display:inline-block;letter-spacing:1px;font-size:11px;vertical-align:middle;border:1px solid var(--ink)}
.sidebar .brand b,.boot-sidebar .brand b{display:block;margin-top:3px;font-size:9px;letter-spacing:2px;width:max-content}
.login-shell{min-height:100dvh;grid-template-columns:52% 48%}
.login-story{background-color:#4357ff;background-image:radial-gradient(#fff5 .8px,transparent .8px);background-size:14px 14px;border-right:3px solid #171323;padding:32px 48px 28px;color:#fff;position:relative;overflow:hidden;min-height:100dvh;isolation:isolate}
.login-story:before{content:'';position:absolute;width:520px;height:520px;background:#ff4f91;border:3px solid #171323;border-radius:50%;right:-200px;bottom:-245px;z-index:-1}
.login-story .brand{color:#fff}.login-story .brand b{color:#171323;background:var(--yellow)}
.story-copy{margin:48px 0 0;padding:20px 0 0;position:relative;z-index:1}.story-copy .eyebrow{color:#fff;font-size:10px;letter-spacing:2px;font-weight:800}
.story-copy h1{font-size:clamp(36px,4.2vw,64px);line-height:1.08;letter-spacing:-2px;margin:24px 0}
.story-copy mark{background:var(--yellow);color:#171323;box-decoration-break:clone;-webkit-box-decoration-break:clone;padding:0 7px}
.story-copy p{font-size:14px;line-height:1.8;color:#fff;max-width:400px}.story-labels{margin-top:22px;display:flex;flex-wrap:wrap;gap:10px;color:#171323;font-size:10px;font-weight:800}
.story-labels span{background:#89f0c4;border:2px solid #171323;padding:8px 10px;box-shadow:3px 3px 0 #171323;transform:rotate(-2deg)}
.story-labels span+span{background:#fff9e9;transform:rotate(2deg)}
.mascot-stage{position:relative;flex:1;min-height:220px;max-height:300px;width:100%;margin:20px 0}
.mascot-stage img{position:absolute;object-fit:contain;filter:drop-shadow(4px 5px 0 #17132350)}
.nina-sticker{height:95%;width:58%;left:0;bottom:0;transform:rotate(-6deg)}
.neko-sticker{height:78%;width:43%;right:0;bottom:-2px;transform:rotate(8deg)}
.pop-note{position:absolute;right:2px;top:2px;background:#ffe44d;border:2px solid #171323;color:#171323;padding:9px 12px;box-shadow:3px 3px 0 #171323;font-size:10px;font-weight:800;transform:rotate(6deg);z-index:2}
.login-story>small{color:#fff;font-size:9px;letter-spacing:1px;line-height:1.7;font-weight:700}
.login-main{padding:48px 38px;min-width:0;background:radial-gradient(#1713231a .8px,transparent .8px);background-size:14px 14px;flex-direction:column;gap:28px}
.login-card{width:min(430px,100%);background:var(--panel);border:2px solid var(--ink);box-shadow:7px 7px 0 var(--ink);border-radius:4px;padding:36px 30px;position:relative}
.login-card:before{content:'✦ ON AIR';display:block;width:max-content;background:#ff4f91;color:#171323;border:2px solid #171323;padding:7px 12px;font-size:10px;letter-spacing:1px;font-weight:800;position:absolute;top:-19px;right:20px;transform:rotate(5deg)}
.login-card .eyebrow{font-size:9px;letter-spacing:1.5px;font-weight:800;color:var(--muted)}.login-card h2{font-size:27px;line-height:1.2;margin-top:19px}.login-card>p{color:var(--muted);line-height:1.7}
.login-card label{font-weight:800;font-size:12px}.login-card input{background:var(--bg);border:2px solid var(--ink);height:48px;font-size:13px}.login-card .primary{height:48px;font-size:12px}
.login-note{display:block;margin-top:22px;font-size:11px;line-height:1.7;color:var(--muted)}.login-main>.version{position:static;color:var(--muted);font-size:10px;font-weight:700}
.login-card .error:empty{display:none}.login-card .error:not(:empty){background:#ffe1e8;border-left:3px solid #af193b;padding:10px;line-height:1.6}
.sidebar,.boot-sidebar{background:var(--panel);border-right:2px solid var(--ink)}.sidebar{padding-top:24px}.workspace{padding-left:18px}.folder{color:var(--text);border:1px solid transparent;min-height:40px;font-weight:650}
.folder.active{background:var(--yellow);color:var(--text);border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink)}.folder.active small{color:var(--text)}.folder:hover{background:var(--hover)}
.sidebar-bottom{border-color:var(--line)}.sidebar-section>span,.eyebrow{letter-spacing:1px;font-weight:800}.avatar{background:var(--mint);color:#171323;border:2px solid var(--ink);border-radius:8px}
.topbar .search{background:var(--panel);border:2px solid var(--ink);border-radius:4px}.topbar .search input{background:transparent}.icon-btn{min-width:36px;min-height:36px}.icon-btn:hover{background:var(--hover)}
.mail-panel,.boot-panel{border:2px solid var(--ink);border-radius:4px;box-shadow:4px 4px 0 var(--ink)}.inbox-heading{border-bottom:2px solid var(--ink);background:var(--panel);padding-top:24px;padding-bottom:22px}
.inbox-heading h1{font-size:29px}.inbox-heading p{color:var(--muted)}.count-pill{background:var(--pink);color:#171323;border:1px solid var(--ink);font-weight:800}
.filters{background:var(--soft);border-bottom:1px solid var(--ink)}.filter.active{color:var(--text);border-bottom-color:var(--green)}.message-row{border-bottom-color:var(--line)}.message-row.unread{background:#fff1b6;color:var(--text)}
.message-row:hover{background:var(--hover)}.sender-avatar{background:var(--mint);color:#171323;border:1px solid var(--ink);border-radius:8px}.mail-footer{background:var(--soft);color:var(--muted)}
dialog{border:2px solid var(--ink);border-radius:4px;box-shadow:6px 6px 0 var(--ink)}.dialog-head,.compose-head{background:var(--soft);border-bottom:2px solid var(--ink)}
.settings-nav button.active{border:1px solid var(--ink);color:var(--text)}.toast{background:var(--mint);color:#171323;border:2px solid var(--ink);border-radius:4px;box-shadow:4px 4px 0 var(--ink);font-weight:700}
.chat-top{background:var(--panel);border-bottom:2px solid var(--ink)}.chat-layout,.invite-card{border:2px solid var(--ink);border-radius:4px;box-shadow:4px 4px 0 var(--ink);background:var(--panel)}.chat-conversation{background:var(--panel)}
[data-theme=dark]{--bg:#171323;--panel:#252039;--soft:#302944;--hover:#3a3051;--line:#756885;--text:#fff9e9;--muted:#c9bddb;--green:#b1a8ff;--green-soft:#534171;--green-text:#fff9e9;--danger:#ff9cb5;--ink:#08060e}
[data-theme=dark] .folder{color:var(--text)}[data-theme=dark] .folder.active{background:#ffe44d;color:#171323}[data-theme=dark] .folder.active small{color:#171323}
[data-theme=dark] .primary,[data-theme=dark] .compose-button{color:#171323}[data-theme=dark] .topbar .search{background:var(--panel)}[data-theme=dark] .message-row.unread{background:#3a3051;color:var(--text)}
[data-theme=dark] .avatar{background:#89f0c4;color:#171323}[data-theme=dark] .login-card input{border-color:#a69aba}[data-theme=dark] .brand b{color:#171323}[data-theme=dark] .login-card .error:not(:empty){background:#4a263a}
@media(min-width:1500px){.login-story{padding-left:max(48px,calc((100vw - 1400px)/2))}.mascot-stage{max-width:530px}.story-copy{margin-top:64px}}
@media(max-width:1000px){.login-story{padding:30px 28px}.story-copy h1{font-size:44px}.login-main{padding:36px 24px}.login-card{padding:32px 23px}.story-labels{display:none}}
@media(max-width:800px){.login-shell{grid-template-columns:1fr}.login-story{display:none}.login-main{min-height:100dvh;padding:60px 24px 28px}.login-card{width:min(430px,100%)}.login-card:after{content:'CLTV MAIL / EQUIPE';position:absolute;top:-54px;left:0;font-size:12px;font-weight:800;letter-spacing:2px;color:var(--text)}.workspace{padding-left:12px}.sidebar{background:var(--panel)}.inbox-heading h1{font-size:24px}}
@media(max-width:580px){.workspace{padding-left:6px}.login-main{padding-left:18px;padding-right:24px}.login-card h2{font-size:25px}.mail-panel{border-radius:3px}.inbox-heading h1{font-size:22px}.primary,.secondary{min-height:44px}.chat-top .brand span{font-size:15px}.search input{font-size:12px}.topbar-actions .icon-btn{min-width:29px;min-height:36px}.form-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
