/* LifeSpace · original artwork from the Lifecare and Monti Figma files. */
@font-face{font-family:"Golos Text";src:url("/static/fonts/GolosText-Variable.ttf") format("truetype");font-weight:400 900;font-style:normal;font-display:swap}
:root{--brand:#205eff;--brand-soft:#e9efff;--accent:#ff9820;--ink:#17213c;--muted:#63708a;--line:#dfe6f5;--green:var(--brand);font-family:"Golos Text","Segoe UI",sans-serif;color:var(--ink);background:#f7f9ff}
body{min-width:320px}
button,a,input,select{transition:background-color .18s,border-color .18s,box-shadow .18s}
button:hover:not(:disabled){filter:brightness(.96)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--brand);outline-offset:4px}
input,select{accent-color:var(--brand)}
header{max-width:none;height:90px;background:#fff;padding:0 max(32px,calc((100vw - 1320px)/2));gap:28px;border-bottom:1px solid var(--line)}
.brand,.logo{color:var(--ink);font-size:28px;letter-spacing:-1.2px;white-space:nowrap}
.brand{gap:0;align-items:start;flex-direction:column}
.brand span{letter-spacing:-1.2px}
.brand .brand-dot,.logo .brand-dot{color:var(--brand);font-size:inherit;font-weight:700}
.brand small{margin:5px 0 0;font-size:10px;color:var(--muted);letter-spacing:.4px}
.clock strong{color:var(--ink);font-variant-numeric:tabular-nums}
.quiet{color:#52617b}
.company-logo{display:block;position:relative;width:126px;height:36px;flex:0 0 126px}
.company-logo img{position:absolute;top:0;left:0;transform:scale(.36);transform-origin:top left}
.brand-pattern{position:absolute;right:0;top:0;width:220px;height:216px;pointer-events:none;overflow:hidden}
.brand-pattern img{position:absolute;transform:scale(.6);transform-origin:top left}
.brand-pattern img:first-child{left:112px;top:108px}
.brand-pattern img:last-child{left:4px;top:0}
.monti{display:block;filter:drop-shadow(0 15px 13px #205eff20)}
.personal-page main{max-width:1320px;grid-template-columns:minmax(350px,.88fr) minmax(0,1.12fr);padding:32px 24px;gap:32px}
.companion{position:relative;isolation:isolate;overflow:hidden;border-radius:28px;background:#e9efff;padding:32px 30px 24px;text-align:center;border:1px solid #dce6ff}
.companion .brand-pattern{z-index:-1;opacity:.75;top:310px;right:-25px}
.eyebrow{font-size:10px;letter-spacing:1.25px;color:#52617b;line-height:1.7}
.companion .eyebrow{position:relative;width:max-content;max-width:100%;background:#e9efff;padding:0 4px}
.dot{background:var(--brand);width:7px;height:7px}
h1{font-size:48px;line-height:1.08;letter-spacing:-2px;font-weight:700;margin:24px 0 15px}
h1 em{color:var(--brand)}
.intro{font-size:14px;line-height:1.7;color:#52617b}
.device{margin:8px auto 12px;width:auto;height:auto;max-width:310px;padding:0;background:none;border:0;border-radius:0;box-shadow:none;transform:none}
.monti-stage{height:320px;display:flex;align-items:center;justify-content:center}
.device .monti{animation:monti-float 5s ease-in-out infinite}
.device-bottom{justify-content:center;gap:8px;background:#fff;border:1px solid #d2dfff;width:max-content;max-width:100%;margin:0 auto;padding:8px 14px;border-radius:40px;font-size:11px;color:#36517d;letter-spacing:0;min-height:34px}
.status-dot{width:6px;height:6px;border-radius:50%;background:var(--brand)}
.wave{margin-left:6px}.wave i{background:var(--brand)}
.device[data-state=thinking] .status-dot{background:var(--accent);animation:status-pulse .8s ease-in-out infinite alternate}
.device[data-state=listening] .device-bottom{box-shadow:0 0 0 5px #205eff12}
.device[data-state=speaking] .monti{animation:monti-float 1.5s ease-in-out infinite}
.voice{width:min(100%,280px);padding:16px 20px;border-radius:14px;background:var(--brand);box-shadow:0 7px 18px #205eff24;font-weight:600}
.voice.active{background:#1749c9}
#connection{font-size:11px;min-height:18px;color:#52617b}
.privacy{margin-top:17px;color:#63708a}
.workspace{border:0;padding:12px 0 0;min-width:0}
.section-top h2{font-size:29px;font-weight:700;margin:12px 0 24px}
.add{width:42px;height:42px;background:var(--brand);color:#fff;border:0;border-radius:13px;font-size:26px}
h2 span{background:var(--brand-soft);color:var(--brand)}
.tabs{height:42px;gap:25px}.tabs button{font-size:13px}.tabs a{font-size:12px}
.task-list{height:270px;padding-top:8px}
.task{padding:17px 4px;border-color:var(--line)}
.task strong{font-size:14px}.task small{font-size:11px}.task .move{font-size:12px;color:#52617b}
.check{width:23px;height:23px;border-radius:8px;border-color:#a6bfff}
.task.done .check{background:var(--brand-soft)}
.empty{padding:64px 16px;font-size:14px;color:#63708a}.empty b{font-size:26px;color:var(--brand)}
.conversation{background:white;margin-top:12px;padding:22px;border-radius:20px;border:1px solid var(--line);box-shadow:0 8px 30px #19386804}
.chat-heading{font-size:10px;font-weight:600;color:#52617b}.chat-heading span:last-child{color:#63708a;font-weight:400}
#messages{height:126px}.message{font-size:13px}.message.assistant{color:#394965}.message small{font-size:11px;color:#63708a}
.message.user{background:var(--brand-soft);color:var(--ink)}
#chat{margin-top:16px;padding:6px;border-color:#d2dfff;background:#f7f9ff}
#chat:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px #205eff12}
#chat input{font-size:13px;padding:10px;min-width:0}#chat input:focus-visible{outline:0}
#chat button{background:var(--brand);color:#fff;width:38px;flex-shrink:0;border-radius:9px}
.suggestions{gap:10px;flex-wrap:wrap}.suggestions button{font-size:11px;padding:6px 10px;border-radius:7px;background:#e9efff;color:#1749c9}
footer{align-items:center;gap:20px;margin-top:22px;font-size:10px;color:#63708a}
dialog{color:var(--ink);background:#fff;box-shadow:0 25px 90px #17213c22}dialog h2{font-weight:700}
.primary{background:var(--brand)}.secondary{background:var(--brand-soft);color:#1749c9}
.reminder{background:#fff5e9;border:1px solid #ffcc8f;color:#704207}.reminder button{color:#704207}
.team-page .logo span{color:#63708a}.team-page .logo .brand-dot{color:var(--brand)}
.login{max-width:1060px;margin:48px auto;display:grid;grid-template-columns:1.1fr 1fr;padding:0 24px;gap:48px}
.login-story{position:relative;isolation:isolate;overflow:hidden;background:var(--brand-soft);border:1px solid #dce6ff;border-radius:26px;padding:34px}
.login-story .brand-pattern{z-index:-1;opacity:.3;top:350px;right:-85px}
.login .overline{color:#52617b;line-height:1.7;max-width:240px}
.login h1{font-size:48px;font-weight:700;margin:25px 0 18px}
.login-story>p{color:#52617b}
.login-mascot{display:flex;gap:22px;align-items:center;margin:14px 0 24px}
.login-mascot>span{font-size:20px;font-weight:700;color:var(--brand)}
.login-mascot small{font-size:11px;font-weight:400;margin-top:8px;max-width:90px}
.login-panel{align-self:center;min-width:0}
.login form{margin:0 0 22px;padding:30px;border-radius:22px;background:#fff}
.login form h2{font-size:24px;font-weight:700}.login form label{font-size:13px;margin:20px 0}
.login form .primary{width:100%;padding:14px;margin-top:5px}
.login-panel>small{color:#63708a}.login-panel .note{margin-bottom:22px}
.team-page main{max-width:1440px}.team-page aside{background:#fff}
.team-page .card{background:#fff;border-color:var(--line)}
.team-page .overline{color:#52617b}.team-page .project-heading h1{font-weight:700}
.project-button.active{background:var(--brand-soft);color:var(--brand)}
.welcome{padding:55px 0}.welcome-mascot{display:flex;justify-content:center;margin-bottom:25px}
.team-page .welcome h1{font-size:30px}.team-page .note{background:var(--brand-soft)}
@keyframes monti-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes status-pulse{to{opacity:.35}}
@media(min-width:1500px){.personal-page main{padding-top:44px}}
@media(max-width:1000px){header{padding:0 24px;gap:18px}.brand small{display:none}.personal-page main{gap:24px;padding:24px;grid-template-columns:minmax(300px,.9fr) minmax(0,1fr)}.companion{padding:26px 18px}h1{font-size:42px}.conversation{padding:17px}.login{gap:25px}.login-story{padding:25px}}
@media(max-width:760px){header{height:auto;min-height:82px;flex-wrap:wrap;padding:18px 20px;gap:16px}.brand,.logo{font-size:25px}.clock{margin-left:auto}.clock span{display:none}.personal-page header>.quiet{font-size:12px;padding:5px}.personal-page main{grid-template-columns:1fr;padding:20px;gap:28px}.companion{padding:25px 20px}.companion .eyebrow{margin:auto}.workspace{padding:0;border:0}.monti-stage{height:320px}.task-list{height:250px}h1{font-size:43px}.login{grid-template-columns:1fr;max-width:540px;margin:24px auto;gap:24px}.login-story{padding:28px}.login h1{font-size:43px}.login-mascot{justify-content:center}.login-panel{padding-bottom:24px}.team-page nav{flex-wrap:wrap;gap:14px}.team-page .welcome{padding:30px 0}.team-page .welcome h1{font-size:26px}footer span{display:block}footer .company-logo{display:block}.personal-page footer>span:last-child{max-width:150px;text-align:right;line-height:1.6}}
@media(max-width:400px){.personal-page header{gap:12px}.brand{font-size:23px}.clock{display:none}.personal-page header>.quiet:first-of-type{margin-left:auto}.tabs{gap:18px}.tabs a{font-size:10px}.chat-heading{font-size:9px}.login-mascot{gap:12px}.login-story{padding:22px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* Quiet, readable Cyrillic typography across the personal and team screens. */
body{font-size:15px;line-height:1.5}
.brand,.logo{font-weight:600;letter-spacing:-.9px;font-size:27px}
.brand span{font-weight:600;letter-spacing:-.9px}
.brand-dot{display:none}
.brand-name,.logo{display:inline-flex;align-items:center;gap:10px}
.brand-icon{display:block;width:32px;height:32px;flex-shrink:0}
.brand small{padding-left:42px}
.brand small{font-size:11px;letter-spacing:0;line-height:1.4}
.eyebrow,.overline,.team-page .overline,.chat-heading{font-size:12px;letter-spacing:0;font-weight:400;text-transform:none}
h1,.login h1{font-size:44px;font-weight:500;letter-spacing:-1.3px;line-height:1.16}
.section-top h2{font-size:28px;font-weight:500;letter-spacing:-.7px}
.team-page .project-heading h1{font-weight:500;font-size:36px;letter-spacing:-1px}
h2,.login form h2,dialog h2{font-weight:500;letter-spacing:-.4px}
.intro,.login-story>p{font-size:15px;line-height:1.65}
.message{font-size:14px;line-height:1.65}
.message small,.caption,#connection,.privacy{font-size:12px;line-height:1.6}
.task strong,.task-title{font-weight:500;font-size:15px}
.task small,.task-meta,.task .move,.chat-heading span:last-child{font-size:12px}
.voice{font-weight:500;font-size:15px}
.tabs button,.tabs a,.quiet,.team-page nav{font-size:13px}
#chat input{font-size:14px}.suggestions button{font-size:12px}
.login-mascot>span{font-weight:500;letter-spacing:-.4px}
.login-mascot small{letter-spacing:0;font-size:12px;max-width:105px}
.team-page label{font-size:12px}.team-page p{font-size:14px}
.team-page small,.team-page .hint,.note p{font-size:12px}
footer{font-size:11px}.clock strong{font-size:18px;font-weight:400}
@media(max-width:760px){h1,.login h1{font-size:38px;letter-spacing:-1px}.brand,.logo{font-size:25px}.eyebrow,.overline,.team-page .overline{font-size:11px}.intro{font-size:14px}.chat-heading{font-size:11px}.chat-heading span:last-child{font-size:11px}}
@media(max-width:400px){h1,.login h1{font-size:34px;letter-spacing:-.9px}.brand{font-size:23px}.personal-page header>.quiet{font-size:11px}.tabs a{font-size:11px}.suggestions button{font-size:11px}}
