:root{
--bg:#f6f5f0;
--ink:#293d34;
--muted:#7b8178;
--line:#e4e5dc;
--green:#304b40;
--lime:#deecb2;
--radius:24px;
font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
color:var(--ink);
background:var(--bg);
font-synthesis:none}
*{
box-sizing:border-box}
body{
margin:0}
button,input,textarea,select{
font:inherit}
button,a,input,textarea,select{
-webkit-tap-highlight-color:transparent}
button{
cursor:pointer}
button:disabled{
opacity:.55;
cursor:wait}
button{
color:inherit}
a{
color:inherit}
button:focus-visible,a:focus-visible{
outline:3px solid #aa93d4;
outline-offset:4px}
input:focus,textarea:focus,select:focus{
outline:2px solid #aa93d4;
outline-offset:2px}
.icon{
width:21px;
height:21px;
flex:none;
vertical-align:middle}
.shell{
display:flex;
min-height:100dvh}
.sidebar{
width:248px;
flex:none;
position:fixed;
inset:0 auto 0 0;
display:flex;
flex-direction:column;
padding:36px 22px 20px;
border-right:1px solid var(--line);
background:#f0f1e9;
overflow-y:auto}
.brand{
text-decoration:none;
font-size:25px;
font-weight:750;
letter-spacing:-1px;
display:flex;
align-items:center;
gap:9px}
.brand .icon{
width:30px;
height:30px}
.brand-dot{
width:7px;
height:7px;
border-radius:50%;
background:#b5a2d6;
align-self:flex-start;
margin-top:8px;
margin-left:-6px}
.space-label{
font-size:10px;
letter-spacing:1.7px;
color:var(--muted);
margin:42px 10px 16px;
font-weight:650}
.sidebar nav{
display:grid;
gap:7px}
.nav-item{
display:flex;
align-items:center;
gap:12px;
border:0;
background:none;
padding:14px 15px;
border-radius:13px;
text-align:left;
font-size:14px;
color:#6b746b;
font-weight:550}
.nav-item.active{
background:var(--green);
color:white}
.nav-item:hover:not(.active){
background:#e4e7db}
.nav-count{
margin-left:auto;
font-size:10px;
border-radius:6px;
background:#dde3d3;
padding:2px 6px;
color:var(--ink)}
.section-label{
font-size:10px;
letter-spacing:1.4px;
color:var(--muted);
display:flex;
align-items:center;
justify-content:space-between;
margin:28px 10px 8px}
.icon-button{
display:inline-flex;
align-items:center;
justify-content:center;
background:none;
border:0;
border-radius:10px;
min-width:38px;
min-height:38px}
.icon-button:hover{
background:#e3e7db}
.group-link{
border:0;
background:none;
display:flex;
align-items:center;
gap:10px;
width:100%;
text-align:left;
padding:10px 16px;
font-size:13px;
color:#737b71;
border-radius:10px}
.group-link.selected{
background:#e2e5d8;
color:var(--ink)}
.color-dot{
width:8px;
height:8px;
border-radius:50%;
flex:none}
.color-dot.color-0{
background:#b3a3d5}
.color-dot.color-1{
background:#b0c587}
.color-dot.color-2{
background:#d6b591}
.color-dot.color-3{
background:#91b9bc}
.color-dot.color-4{
background:#d4a7b8}
.sidebar-bottom{
margin-top:auto;
padding-top:35px}
.budget-card{
background:#e7eada;
padding:17px;
border-radius:17px}
.budget-card>span{
font-size:11px;
display:flex;
align-items:center;
gap:6px}
.budget-card .icon{
width:15px;
height:15px}
.budget-card strong{
display:block;
font-size:20px;
margin-top:12px;
font-weight:600;
letter-spacing:-.6px}
.budget-card strong small{
font-size:12px;
color:var(--muted);
font-weight:400}
.budget-card p{
font-size:10px;
line-height:1.5;
color:#747d68;
margin-bottom:0}
.budget-track{
height:4px;
background:#d4d9c4;
border-radius:4px;
overflow:hidden;
margin-top:10px}
.budget-track span{
display:block;
height:100%;
background:#7d9660}
.profile{
display:flex;
align-items:center;
width:100%;
border:0;
background:none;
gap:10px;
padding:20px 4px 0;
text-align:left}
.profile>span:nth-child(2){
font-size:12px;
font-weight:650;
flex:1}
.profile small{
display:block;
font-size:10px;
color:var(--muted);
margin-top:3px;
font-weight:400}
.profile>.icon{
width:17px;
color:var(--muted)}
.avatar{
width:34px;
height:34px;
border-radius:50%;
display:inline-flex;
justify-content:center;
align-items:center;
font-size:12px;
font-weight:700;
background:#dde4cf;
border:3px solid var(--bg);
flex:none}
.shade-1{
background:#d7cce9}
.main{
margin-left:248px;
width:calc(100% - 248px);
padding:0 52px;
max-width:1640px}
.topbar{
height:93px;
border-bottom:1px solid var(--line);
display:flex;
align-items:center;
justify-content:space-between}
.breadcrumb{
font-size:12px;
color:var(--muted)}
.together{
display:flex;
align-items:center;
gap:10px}
.together>span{
font-size:11px;
color:var(--muted)}
.avatars{
display:flex}
.avatars .avatar+.avatar{
margin-left:-9px}
.intro{
padding:46px 0 30px;
display:flex;
align-items:center;
justify-content:space-between}
.eyebrow{
font-size:10px;
font-weight:650;
letter-spacing:1.6px;
color:#7b8473}
.intro h1{
font-size:clamp(34px,3.8vw,53px);
letter-spacing:-2.6px;
font-weight:580;
line-height:1.12;
margin:14px 0}
.intro h1 span{
color:#a58dc7}
.intro p{
font-size:14px;
color:var(--muted);
margin:0;
line-height:1.6}
.intro-art{
position:relative;
width:190px;
height:112px;
flex:none}
.art-bubble{
position:absolute;
border-radius:32px;
display:flex;
align-items:center;
gap:8px;
font-size:13px;
letter-spacing:-.3px}
.art-one{
background:#e1eabf;
padding:20px 26px;
left:0;
top:13px;
transform:rotate(-9deg);
z-index:1}
.art-two{
background:#ded4eb;
padding:14px 24px;
right:0;
bottom:5px;
transform:rotate(9deg)}
.art-star{
position:absolute;
right:10px;
top:-3px;
font-size:44px;
color:#a49b7e}
.capture-box{
background:#fff;
border:1px solid #e7e8de;
border-radius:22px;
padding:24px 26px;
box-shadow:0 6px 22px #34473205}
.capture-caption{
font-size:12px;
color:#69795f;
display:flex;
align-items:center;
gap:8px}
.capture-caption .icon{
width:16px;
height:16px;
color:#9cac79}
#capture{
border:0;
resize:vertical;
display:block;
width:100%;
min-height:76px;
max-height:250px;
padding:18px 0 10px;
font-size:18px;
letter-spacing:-.3px;
line-height:1.5;
color:var(--ink);
background:none}
#capture:focus{
outline:none}
#capture::placeholder{
color:#b2b7a9}
.capture-bottom{
display:flex;
align-items:center;
justify-content:space-between;
gap:12px}
.capture-bottom>span{
font-size:11px;
color:#929788}
.primary{
display:inline-flex;
gap:12px;
align-items:center;
justify-content:center;
background:var(--green);
color:#fff;
border:0;
border-radius:12px;
padding:13px 20px;
min-height:46px;
font-size:13px;
font-weight:550;
text-decoration:none}
.primary:hover{
background:#233d32}
.primary .icon{
width:18px;
height:18px}
.secondary{
display:inline-flex;
align-items:center;
justify-content:center;
gap:7px;
padding:11px 14px;
min-height:44px;
border:1px solid #dfe2d4;
border-radius:11px;
background:transparent;
font-size:12px;
text-decoration:none}
.secondary:hover{
background:#e9ecdf}
.workspace{
margin-top:38px}
.workspace-heading{
display:flex;
justify-content:space-between;
align-items:center}
.workspace-heading>div:first-child{
display:flex;
align-items:center;
gap:15px}
.workspace h2{
font-size:19px;
letter-spacing:-.6px;
font-weight:600;
margin:0}
.workspace-heading #result-count{
font-size:11px;
color:var(--muted)}
.layout-switch{
display:flex;
border:1px solid var(--line);
padding:4px;
border-radius:11px;
gap:3px}
.layout-switch button{
border:0;
background:none;
display:grid;
place-items:center;
width:32px;
height:30px;
border-radius:7px;
color:var(--muted)}
.layout-switch button.active{
background:white;
color:var(--green);
box-shadow:0 1px 4px #3331}
.layout-switch .icon{
width:16px;
height:16px}
.filters{
display:flex;
align-items:center;
gap:12px;
margin:20px 0 24px}
.search{
display:flex;
gap:8px;
align-items:center;
max-width:310px;
flex:1;
min-width:0;
padding:0 13px;
border:1px solid var(--line);
border-radius:11px;
background:#fafaf6}
.search .icon{
width:16px;
height:16px;
color:#929788}
.search input{
width:100%;
border:0;
background:transparent;
height:43px;
font-size:12px;
min-width:0;
color:var(--ink)}
.search input:focus{
outline:none}
.filters select{
border:1px solid var(--line);
border-radius:11px;
padding:0 30px 0 12px;
height:44px;
color:#6e7868;
background:#fafaf6;
font-size:12px;
max-width:190px}
.new-group{
margin-left:auto;
white-space:nowrap}
.new-group .icon{
width:16px;
height:16px}
.board.bubbles{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:18px;
align-items:start}
.island{
border-radius:25px;
padding:19px 15px 15px;
border:1px solid #ffffff60}
.island.color-0{
background:#eae5f1}
.island.color-1{
background:#e6ecdb}
.island.color-2{
background:#f0e8dd}
.island.color-3{
background:#e0ece9}
.island.color-4{
background:#eee1e6}
.island.color-5{
background:#e9eae3}
.island-heading{
display:flex;
align-items:center;
gap:9px;
margin:0 4px 17px}
.island-heading h3{
font-size:14px;
font-weight:600;
letter-spacing:-.3px;
margin:0;
overflow-wrap:anywhere}
.group-symbol{
width:30px;
height:30px;
display:grid;
place-items:center;
border-radius:10px;
background:#ffffff65;
flex:none}
.group-symbol .icon{
width:17px;
height:17px}
.group-count{
margin-left:auto;
color:#7b8072;
font-size:10px;
background:#ffffff65;
border-radius:50%;
width:21px;
height:21px;
display:grid;
place-items:center;
flex:none}
.group-description{
font-size:11px;
line-height:1.5;
color:#6f7869;
padding:0 5px;
margin:-7px 0 15px;
overflow-wrap:anywhere}
.island-tasks{
display:grid;
gap:10px}
.task-card{
border-radius:19px;
background:#ffffffd9;
padding:17px 14px 14px;
transition:transform .18s,box-shadow .18s;
border:1px solid #ffffffb0;
overflow:hidden}
.task-card:hover{
transform:translateY(-2px);
box-shadow:0 5px 12px #304b4008}
.task-top{
display:flex;
align-items:flex-start;
gap:9px}
.check-button{
margin-top:3px;
width:19px;
height:19px;
min-width:19px;
padding:0;
border:1.5px solid #c3ccba;
border-radius:50%;
background:transparent;
display:grid;
place-items:center}
.check-button:hover{
background:#deecb2;
border-color:#8b9b74}
.check-button.checked{
background:var(--green);
border-color:var(--green);
color:white}
.check-button .icon{
width:12px;
height:12px}
.task-title{
background:none;
border:0;
padding:0;
text-align:left;
font-size:13px;
line-height:1.55;
font-weight:550;
flex:1;
overflow-wrap:anywhere}
.task-meta{
padding:12px 0 0 28px;
display:flex;
gap:6px;
align-items:center;
flex-wrap:wrap;
border:0;
background:none;
width:100%;
text-align:left;
min-height:28px}
.task-meta:empty{
min-height:0;
padding:0}
.pill{
display:inline-flex;
gap:4px;
align-items:center;
padding:4px 7px;
background:#f0f1eb;
border-radius:6px;
font-size:9px;
color:#77806d;
line-height:1.4}
.pill .icon{
width:11px;
height:11px}
.pill.urgent{
background:#f4e7d6;
color:#9e7845}
.pill.overdue{
background:#f6e0df;
color:#a35750}
.pill.pending{
animation:pulse 2s infinite}
.suggested{
font-size:9px;
color:#919783}
.mini-avatar{
margin-left:auto;
width:22px;
height:22px;
border-radius:50%;
display:grid;
place-items:center;
background:#e1e6d6;
font-size:9px}
.tags{
display:flex;
flex-wrap:wrap;
gap:6px;
padding:8px 0 0 28px;
color:#929a87;
font-size:9px;
overflow-wrap:anywhere}
.is-done .task-title{
text-decoration:line-through;
color:#929988}
.board.list{
display:grid;
gap:10px}
.board.list .task-card{
display:flex;
align-items:center;
padding:17px 20px;
background:#fff;
gap:10px}
.board.list .task-top{
flex:1}
.board.list .task-meta{
width:auto;
max-width:45%;
padding:0}
.board.list .tags{
display:none}
.empty{
grid-column:1/-1;
text-align:center;
padding:45px 20px 55px;
border:1px dashed #d9dfcd;
border-radius:24px;
background:#eff2e780}
.empty>.icon{
width:40px;
height:40px;
color:#8b9b74;
margin:0 0 8px}
.empty h3{
font-size:19px;
font-weight:550;
margin:9px 0}
.empty p{
font-size:13px;
color:var(--muted);
line-height:1.6;
max-width:400px;
margin:10px auto 20px}
.footer{
display:flex;
justify-content:space-between;
margin:42px 0 27px;
font-size:10px;
color:#969e8a;
gap:15px}
.footer a{
text-decoration:none}
.footer a:hover{
text-decoration:underline}
.filter-chip{
display:flex;
align-items:center;
gap:10px;
background:#e7e2ee;
border:0;
border-radius:20px;
padding:8px 12px;
margin:-7px 0 18px;
font-size:11px}
.filter-chip .icon{
width:13px;
height:13px}
.mobile-nav,.mobile-brand,.mobile-account{
display:none}
.loading{
text-align:center;
margin-top:30vh;
color:var(--muted)}
.sr-only{
position:absolute;
clip:rect(0,0,0,0);
width:1px;
height:1px;
overflow:hidden}
.auth{
min-height:100dvh;
display:grid;
grid-template-columns:1fr 1fr;
max-width:1100px;
margin:auto;
align-items:center;
padding:50px;
gap:70px}
.auth-decoration{
display:flex;
flex-direction:column;
align-items:center;
gap:20px}
.auth-bubble{
font-size:32px;
letter-spacing:-1px;
padding:60px 35px;
background:#e2eabf;
border-radius:100px;
transform:rotate(-9deg);
white-space:nowrap}
.auth-bubble.small{
font-size:24px;
background:#ddd1ed;
transform:rotate(8deg);
padding:35px 50px;
margin-left:60px}
.auth-card .eyebrow{
margin-top:35px}
.auth h1{
font-weight:550;
font-size:42px;
letter-spacing:-1.9px;
line-height:1.1;
margin:15px 0}
.auth-card>p{
font-size:13px;
color:var(--muted);
line-height:1.7}
.auth form{
margin-top:23px}
label{
display:block;
font-size:12px;
font-weight:550;
margin-bottom:14px}
label input,label select,label textarea{
display:block;
margin-top:7px;
width:100%;
border:1px solid #dce1d1;
border-radius:10px;
background:#fff;
padding:12px;
color:var(--ink);
min-height:44px}
label textarea{
resize:vertical}
label input::placeholder,label textarea::placeholder{
color:#a0a695}
label .muted{
font-weight:400;
font-size:10px;
color:var(--muted)}
.form-divider{
margin:18px 0 14px;
font-size:11px;
color:var(--muted)}
.wide{
width:100%}
.fine-print{
font-size:10px!important;
text-align:center;
margin-top:20px}
.form-error{
font-size:12px;
color:#ab594e;
line-height:1.6;
margin:10px 0}
.form-error:empty{
display:none}
.auth .primary{
margin-top:6px}
dialog{
border:1px solid #e4e7db;
border-radius:26px;
padding:28px;
max-width:530px;
width:calc(100% - 30px);
max-height:90dvh;
color:var(--ink);
background:var(--bg);
box-shadow:0 30px 80px #1d33252a;
overflow:auto}
dialog::backdrop{
background:#21362c70;
backdrop-filter:blur(5px)}
.dialog-head{
display:flex;
justify-content:space-between;
align-items:center;
gap:10px;
margin-bottom:22px}
.dialog-head h2{
margin:0;
font-size:22px;
letter-spacing:-.6px;
font-weight:550}
.form-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:0 14px}
.original{
background:#e9ecdf;
padding:16px;
border-radius:12px;
margin:19px 0 12px}
.original .eyebrow{
font-size:9px}
.original p{
font-size:12px;
line-height:1.6;
margin:8px 0 0;
white-space:pre-wrap;
overflow-wrap:anywhere}
.classification-note{
display:flex;
align-items:flex-start;
gap:8px;
font-size:11px;
color:#7b8472;
line-height:1.7}
.classification-note .icon{
width:15px;
height:15px;
margin-top:2px}
.duplicate-note{
font-size:12px;
background:#f1e6d6;
padding:12px;
border-radius:10px;
line-height:1.6}
.dialog-actions{
display:flex;
align-items:center;
justify-content:space-between;
margin-top:24px}
.danger-text{
border:0;
background:none;
color:#aa675e;
padding:12px;
font-size:12px}
.retry{
border:0;
background:none;
width:100%;
margin-top:18px;
font-size:11px;
color:var(--muted);
text-decoration:underline;
padding:8px}
.dialog-intro{
font-size:13px;
color:var(--muted);
line-height:1.7;
margin-bottom:25px}
.account-summary{
display:flex;
align-items:center;
gap:10px}
.account-summary h3{
margin:0;
font-size:18px;
font-weight:550}
.account-summary+p{
font-size:13px;
color:var(--muted)}
.account-budget{
padding:18px;
background:#e8ecdf;
border-radius:15px;
margin:20px 0}
.account-budget h3{
font-size:14px;
margin:0}
.account-budget p,.account-budget small{
font-size:12px;
line-height:1.7;
color:#77816b}
.account-budget small{
font-size:10px}
.dictation-note{
font-size:12px;
line-height:1.7;
color:var(--muted)}
dialog .wide{
margin-top:12px}
#toast{
position:fixed;
bottom:25px;
left:50%;
transform:translate(-50%,20px);
background:var(--green);
color:#fff;
padding:15px 22px;
border-radius:15px;
font-size:12px;
max-width:calc(100vw - 28px);
width:max-content;
opacity:0;
pointer-events:none;
transition:.2s;
z-index:10;
box-shadow:0 8px 35px #233b3520}
#toast.visible{
opacity:1;
transform:translate(-50%,0)}
@keyframes pulse{
50%{
opacity:.5}
}
@media(min-width:1500px){
.main{
padding:0 70px}
.board.bubbles{
grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:1200px){
.main{
padding:0 30px}
.sidebar{
width:218px;
padding:30px 16px 20px}
.main{
margin-left:218px;
width:calc(100% - 218px)}
.board.bubbles{
grid-template-columns:repeat(2,minmax(0,1fr))}
.intro-art{
width:150px}
.art-one{
padding:17px 19px}
.art-two{
padding:12px 18px}
}
@media(max-width:800px){
.sidebar{
display:none}
.main{
margin-left:0;
width:100%;
padding:0 22px}
.topbar{
height:76px}
.breadcrumb{
display:none}
.mobile-brand{
display:flex;
align-items:center;
gap:7px;
font-size:20px;
font-weight:700;
letter-spacing:-.7px}
.mobile-brand .icon{
width:25px;
height:25px}
.mobile-account{
display:flex}
.together>span{
display:none}
.together{
gap:3px}
.intro{
padding:30px 0 24px}
.intro h1{
font-size:40px;
letter-spacing:-1.8px}
.intro .eyebrow{
font-size:8px;
letter-spacing:1.1px}
.intro-art{
width:128px;
height:100px}
.art-bubble{
font-size:11px}
.art-star{
font-size:33px;
right:0}
.art-one{
top:17px;
left:0;
padding:17px 13px}
.art-two{
padding:13px 18px;
bottom:5px}
.intro p{
font-size:12px;
max-width:240px}
.capture-box{
padding:20px;
border-radius:21px}
#capture{
font-size:17px;
min-height:85px}
.capture-bottom>span{
font-size:10px;
max-width:160px;
line-height:1.6}
.capture-bottom .primary{
padding:12px 16px}
.workspace{
margin-top:30px}
.workspace-heading>div:first-child{
display:block}
.workspace h2{
font-size:18px;
margin-bottom:5px}
.workspace-heading #result-count{
font-size:10px}
.filters{
gap:8px;
flex-wrap:wrap;
margin:17px 0 20px}
.search{
max-width:none}
.filters select{
font-size:11px;
max-width:135px;
padding-left:9px;
padding-right:20px}
.new-group{
margin-left:0;
padding:8px 12px;
min-height:36px;
font-size:11px}
.board.bubbles{
gap:12px}
.island{
padding:16px 11px 11px;
border-radius:23px}
.island-heading{
gap:7px;
margin:0 3px 14px}
.island-heading h3{
font-size:13px}
.group-symbol{
width:27px;
height:27px}
.task-card{
padding:16px 12px 13px}
.task-title{
font-size:13px}
.footer{
margin-bottom:110px;
line-height:1.6;
max-width:100%}
.mobile-nav{
display:flex;
position:fixed;
bottom:0;
left:0;
right:0;
background:#f6f5f0f5;
backdrop-filter:blur(16px);
border-top:1px solid #e3e5d8;
padding:9px 12px calc(9px + env(safe-area-inset-bottom));
gap:3px;
z-index:5;
justify-content:space-between}
.mobile-nav .nav-item{
display:flex;
flex-direction:column;
gap:5px;
padding:7px 5px;
font-size:9px;
flex:1;
min-width:0;
border-radius:12px}
.mobile-nav .nav-item .icon{
width:21px;
height:21px}
.mobile-nav .nav-item.active{
background:#e4e9d9;
color:var(--green)}
.mobile-add{
border:0;
background:var(--green);
color:white;
width:47px;
height:47px;
border-radius:15px;
display:grid;
place-items:center;
align-self:center;
margin-left:5px;
flex:none}
.mobile-add .icon{
width:24px;
height:24px}
#toast{
bottom:98px}
.auth{
grid-template-columns:1fr;
padding:30px 25px;
max-width:450px;
gap:0}
.auth-decoration{
display:none}
.auth h1{
font-size:40px}
.auth-card .eyebrow{
margin-top:30px}
.board.list .task-card{
display:block}
.board.list .task-meta{
padding:10px 0 0 28px;
max-width:100%}
dialog{
padding:23px;
border-radius:22px}
.dialog-head h2{
font-size:21px}
}
@media(max-width:470px){
.main{
padding:0 18px}
.intro-art{
width:94px}
.art-one{
font-size:10px;
padding:14px 11px}
.art-one .icon{
width:14px;
height:14px}
.art-two{
font-size:10px;
padding:11px 15px}
.intro h1{
font-size:36px}
.intro p{
max-width:215px;
font-size:12px}
.board.bubbles{
grid-template-columns:1fr}
.island{
padding:18px 14px 14px}
.island-tasks{
grid-template-columns:1fr}
.island-heading h3{
font-size:15px}
.task-card{
padding:18px 15px 15px}
.task-title{
font-size:14px}
.pill{
font-size:10px}
.tags{
font-size:10px}
.suggested{
font-size:10px}
.capture-caption{
font-size:11px}
.capture-bottom>span{
max-width:155px}
.workspace h2{
font-size:17px}
.form-grid{
gap:0 10px}
.footer{
font-size:9px}
.filters select{
max-width:125px}
.mobile-nav{
padding-left:8px;
padding-right:8px}
}
@media(prefers-reduced-motion:reduce){
*{
animation:none!important;
transition:none!important;
scroll-behavior:auto!important}
}
/* Sur téléphone, les filtres gardent une vraie largeur et la coche une cible au pouce. */
@media(max-width:800px){
.filters{
display:grid;
grid-template-columns:minmax(0,1fr) 135px}
.filters .search{
width:100%;
max-width:none}
.filters select{
width:100%;
max-width:none}
.filters .new-group{
grid-column:1/-1;
justify-self:start;
margin-left:0}
.task-top{
gap:3px}
.check-button{
width:44px;
height:44px;
min-width:44px;
margin:-10px 0 -10px -10px;
position:relative;
border:0;
background:none!important}
.check-button::before{
content:"";
position:absolute;
width:20px;
height:20px;
left:12px;
top:12px;
border:1.5px solid #c3ccba;
border-radius:50%;
background:transparent}
.check-button:hover::before{
background:#deecb2;
border-color:#8b9b74}
.check-button.checked::before{
background:var(--green);
border-color:var(--green)}
.check-button .icon{
position:relative;
z-index:1;
width:13px;
height:13px}
.task-meta{
padding-left:37px}
.tags{
padding-left:37px}
.intro-art{
width:98px}
.art-one{
padding:14px 12px}
.art-two{
padding:11px 15px}
}
/* Pensées liées et carte interactive */
.layout-switch.with-labels button{width:auto;min-width:38px;padding:0 9px;display:flex;align-items:center;gap:6px}
.layout-switch.with-labels button span{font-size:11px}
.task-relations{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:12px 0 0 28px;color:#929a87;font-size:10px}
.task-relations>span{width:100%;line-height:1.5}
.task-relations button{background:none;border:0;text-align:left;font-size:10px;padding:3px 0;color:#7b876d;overflow-wrap:anywhere}
.task-relations .parent-link{width:100%;color:#8a789f}
.child-link{display:flex;align-items:center;gap:3px}
.child-link .icon{width:12px;height:12px}
.capture-parent{display:flex;align-items:center;gap:6px;flex-wrap:wrap;background:#eee8f5;color:#77608e;font-size:11px;border-radius:11px;padding:10px 12px;margin-top:13px}
.capture-parent strong{font-weight:550;max-width:80%;overflow-wrap:anywhere}
.capture-parent button{border:0;background:none;margin-left:auto;min-width:30px;min-height:30px}
.capture-parent .icon{width:15px;height:15px}
.field-help{font-size:11px;line-height:1.6;color:var(--muted)}
label select[multiple]{min-height:100px;font-size:12px}
.board.tree{display:block;background:#f9faf5;border:1px solid #e1e5d9;border-radius:24px;overflow:hidden}
.tree-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:18px 20px 8px}
.tree-toolbar select{min-width:0;max-width:60%;padding:11px 30px 11px 12px;border-radius:11px;border:1px solid #dce2d1;background:#fff;color:var(--ink);font-size:12px;min-height:44px}
.tree-controls{display:flex;align-items:center;gap:4px}
.tree-controls button{width:38px;height:38px;background:#edf0e5;border:0;border-radius:10px;font-size:20px}
.tree-controls button:last-child{font-size:18px}
.zoom-value{font-size:10px;color:var(--muted);min-width:38px;text-align:center}
.tree-hint{padding:0 20px;margin:8px 0 15px;font-size:11px;line-height:1.6;color:#909887}
.tree-viewport{position:relative;overflow:hidden;height:560px;touch-action:none;cursor:grab;background-image:radial-gradient(#cdd7be 1px,transparent 1px);background-size:22px 22px;border-top:1px solid #edf0e6;border-bottom:1px solid #edf0e6}
.tree-viewport:active{cursor:grabbing}
.tree-stage{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform}
.tree-lines{position:absolute;left:0;top:0;pointer-events:none;overflow:visible}
.branch-edge{stroke:#b7c7a5;stroke-width:2.5;fill:none}
.dependency-edge{stroke:#b88a5c;stroke-width:2;stroke-dasharray:7 6;fill:none;opacity:.7}
.tree-node{position:absolute;width:150px;height:155px;text-align:center}
.pearl{width:120px;height:120px;border-radius:50%;border:3px solid #e0e7d6;background:#fff;box-shadow:0 6px 20px #3447320a;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:10px 12px;color:var(--ink);margin:15px;cursor:pointer;transition:box-shadow .15s,border-color .15s}
.pearl:hover{border-color:#a2b18b;box-shadow:0 9px 25px #34473218}
.pearl-symbol{font-size:22px;line-height:1;color:#8d9f75}
.pearl-title{font-size:11px;line-height:1.45;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden;font-weight:550;overflow-wrap:anywhere}
.type-world .pearl{border-width:0;background:#e6e1ee}
.type-world.color-1 .pearl{background:#e2eacd}.type-world.color-2 .pearl{background:#eee2cf}.type-world.color-3 .pearl{background:#dbece6}.type-world.color-4 .pearl{background:#eedce5}.type-world.color-5 .pearl{background:#e5e8dc}
.type-world .pearl-title{font-size:13px;font-weight:650}
.type-hub .pearl{background:var(--green);border-color:var(--green);color:white}
.type-hub .pearl-symbol{font-size:30px;color:var(--lime)}
.type-hub .pearl-title{font-size:13px}
.tree-node.is-idea .pearl{border-color:#d7c8e8;background:#fbf8ff}.tree-node.is-idea .pearl-symbol{color:#ae91c5}
.tree-node.is-done .pearl{background:#eef4e7}.tree-node.is-done .pearl-title{color:#7e8a70;text-decoration:line-through}
.tree-node.is-context{opacity:.6}
.pearl-caption{position:absolute;left:-18px;right:-18px;top:140px;display:flex;justify-content:center;flex-wrap:wrap;gap:4px;font-size:10px;color:#8a927e;line-height:1.5;pointer-events:none}
.pearl-caption span{background:#f4f6ef;border-radius:5px;padding:2px 5px;border:1px solid #e5e9dd}.pearl-caption .pearl-priority,.pearl-caption .pearl-blocked{background:#f2e4d5;color:#9b7449}
.pearl-add,.pearl-check,.pearl-collapse{position:absolute;border-radius:50%;background:#f9faf5;border:1px solid #d6dfc9;display:flex;align-items:center;justify-content:center;width:34px;height:34px;font-size:17px;color:#667953}
.pearl-add{right:5px;top:84px}.pearl-check{left:5px;top:84px}.pearl-check.checked{background:var(--green);color:white;border-color:var(--green)}
.pearl-collapse{right:0;top:16px;border-radius:12px;width:auto;min-width:34px;padding:0 6px;font-size:11px}
.tree-legend{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:15px 20px;color:#8a927e;font-size:10px}
.tree-legend span{display:flex;align-items:center;gap:6px}.legend-line{width:20px;border-top:2px solid #b7c7a5}.legend-line.dashed{border-top:2px dashed #b88a5c}
@media(max-width:800px){.workspace-heading{align-items:flex-start;gap:8px}.workspace-heading>div:first-child{max-width:52%}.workspace h2{line-height:1.4}.layout-switch.with-labels{padding:3px;gap:1px;flex:none}.layout-switch.with-labels button{height:40px;padding:0 7px;flex-direction:column;gap:3px;min-width:38px}.layout-switch.with-labels button span{font-size:9px}.task-relations{padding-left:37px}.child-link{min-height:32px}.tree-toolbar{padding:13px 12px 5px;gap:5px}.tree-toolbar select{max-width:51%;font-size:11px;padding-left:8px;padding-right:16px}.tree-controls{gap:3px}.tree-controls button{width:32px;height:40px}.zoom-value{min-width:32px;font-size:9px}.tree-hint{padding:0 13px;font-size:10px}.tree-viewport{height:480px}.tree-legend{padding:13px;gap:10px}.board.tree{border-radius:20px}.capture-parent strong{max-width:73%}}
/* Accueil personnel : peu d'informations, une lecture progressive. */
.sidebar .budget-card{display:none}
.calm-mode .sidebar-groups,.calm-mode .intro-art,.calm-mode .filters,.calm-mode .layout-switch,.calm-mode #result-count{display:none}
.calm-mode .main{max-width:1300px}
.calm-mode .intro{padding-top:38px;padding-bottom:25px}
.calm-mode .intro h1{font-size:46px}
.calm-mode .workspace{margin-top:30px}
.calm-mode .workspace-heading{margin-bottom:20px}
.calm-board{display:block!important}
.calm-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px}
.calm-heading .eyebrow{font-size:9px;letter-spacing:1.2px}
.calm-heading p{color:#697461;font-size:13px;line-height:1.7;max-width:470px;margin:9px 0 0}
.calm-density{display:flex;align-items:center;gap:4px;padding:4px;border:1px solid #dfe4d7;border-radius:12px;flex:none}
.calm-density button{min-height:38px;background:none;border:0;border-radius:8px;padding:8px 12px;font-size:11px;color:#677361}
.calm-density button.active{background:#e5edd8;color:#344b36}
.calm-thoughts{display:grid;gap:16px}
.calm-thought{padding:23px 25px;border:1px solid #e1e6d7;border-radius:24px;background:#fff;box-shadow:0 5px 20px #32442b03}
.calm-thought-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;color:#70805e;font-size:12px}
.calm-thought h3{font-size:21px;line-height:1.55;letter-spacing:-.5px;font-weight:550;margin:0;overflow-wrap:anywhere}
.calm-date,.calm-context{font-size:12px;line-height:1.7;color:#6a7564;margin:12px 0 0;display:flex;gap:7px;align-items:center}
.calm-date .icon{width:15px;height:15px}
.calm-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:24px}
.quiet-link{background:none;border:0;color:#617254;font-size:12px;min-height:44px;padding:9px 6px;text-align:left;display:inline-flex;align-items:center;justify-content:center;gap:7px;text-decoration:underline;text-decoration-color:#cbd4c0;text-underline-offset:4px}
.quiet-link:hover{color:#324b33;text-decoration-color:#7b9568}
.quiet-link .icon{width:16px;height:16px}
.calm-bottom{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:20px 0 0}
.calm-bottom .secondary{background:#eef2e5}
.world-overview{display:block!important}
.world-intro{font-size:13px;color:#697461;margin:0 0 20px;line-height:1.6}
.world-doors{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.world-door{position:relative;display:flex;align-items:flex-start;flex-direction:column;padding:24px;gap:12px;border:1px solid #ffffff70;border-radius:25px;background:#e9e4f0;text-align:left;min-height:170px;color:var(--ink)}
.world-door.color-1{background:#e7eddb}.world-door.color-2{background:#f0e9dc}.world-door.color-3{background:#e2eee8}.world-door.color-4{background:#efe3e9}.world-door.color-5{background:#e9ece1}
.world-door-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:13px;background:#ffffff80}
.world-door strong{font-size:16px;font-weight:550;overflow-wrap:anywhere}
.world-door>span:last-of-type{color:#67745d;font-size:12px;line-height:1.6;padding-right:15px;overflow-wrap:anywhere}
.world-door>.icon{position:absolute;right:20px;top:32px;width:18px;height:18px;color:#7a886e}
.world-overview>#show-done{margin-top:14px}
.gentle-pages{display:flex;align-items:center;justify-content:space-between;gap:12px;grid-column:1/-1;margin:18px 0 0}
.gentle-pages span{font-size:11px;color:#6d7963;line-height:1.6}
.board.tree>.gentle-pages{padding:0 16px 16px}
.thought-choice{display:flex;align-items:flex-start;position:relative;flex-direction:column;gap:8px;text-align:left;width:100%;padding:18px 42px 18px 18px;background:white;border:1px solid #e0e6d5;border-radius:18px;margin-bottom:12px;color:var(--ink);min-height:90px}
.thought-choice span,.thought-choice small{font-size:11px;color:#6d7b60;line-height:1.5}
.thought-choice strong{font-size:14px;font-weight:550;line-height:1.6;overflow-wrap:anywhere}
.thought-choice .icon{position:absolute;right:16px;top:20px;width:17px;height:17px}
.personal-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:21px}
.thought-options{border:1px solid #dee4d4;border-radius:13px;padding:0 13px;margin:16px 0}
.thought-options summary{cursor:pointer;min-height:48px;display:list-item;padding:15px 0;font-size:12px;color:#5e7050;font-weight:550}
.thought-options[open] summary{margin-bottom:7px}
.thought-options .original{margin:0 0 14px}
.current-choices{padding:10px 14px;background:#edf2e2;border-radius:16px;margin-bottom:20px}
.current-choices>div{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;line-height:1.6}
.current-choices span{overflow-wrap:anywhere}
.pill.overdue{background:#eeece5;color:#626b59}
.pill.pending{animation:none}
@media(max-width:1100px){.world-doors{grid-template-columns:repeat(2,minmax(0,1fr))}.calm-heading{flex-direction:column;gap:14px}}
@media(max-width:800px){.calm-mode .intro{padding-top:26px;padding-bottom:23px}.calm-mode .intro h1{font-size:36px;letter-spacing:-1.5px}.calm-mode .intro p{max-width:none;font-size:13px}.calm-heading p{font-size:12px;line-height:1.7}.calm-mode .workspace-heading>div:first-child{max-width:none}.calm-thought{padding:19px 20px;border-radius:22px}.calm-thought h3{font-size:18px;letter-spacing:-.3px}.calm-thought-top{font-size:11px;margin-bottom:9px}.calm-actions{gap:9px;margin-top:18px}.calm-actions .quiet-link{padding-left:0;font-size:11px}.calm-actions .primary,.calm-actions .secondary{font-size:12px}.calm-date{font-size:12px}.calm-bottom{gap:5px 12px}.calm-bottom>.secondary{width:100%;margin-bottom:5px}.calm-bottom .quiet-link{font-size:11px}.calm-density button{min-height:44px;font-size:11px}.world-doors{grid-template-columns:1fr 1fr;gap:12px}.world-door{padding:18px;min-height:160px;border-radius:22px}.world-door strong{font-size:14px}.world-door>span:last-of-type{font-size:11px;padding-right:0}.world-door>.icon{right:15px;top:27px;width:16px;height:16px}.world-door-icon{width:33px;height:33px}.world-intro{font-size:12px}.gentle-pages{gap:7px;flex-wrap:wrap}.gentle-pages span{font-size:10px}.personal-actions{gap:6px}.personal-actions .secondary{font-size:11px}.personal-actions .quiet-link{font-size:11px}.calm-mode .footer{margin-top:28px}.calm-mode .workspace{margin-top:27px}.calm-mode .footer>span{display:none}}
.calm-mode #capture{min-height:56px;resize:none}
.calm-mode #capture:focus{min-height:90px}
.calm-mode .capture-box{padding-top:20px;padding-bottom:20px}
.calm-mode .topbar{height:76px}
.calm-mode .intro{padding-top:26px;padding-bottom:21px}
.calm-mode .calm-heading{margin-bottom:15px}
.sidebar-groups{display:none}
.calm-mode .icon-button{min-width:44px;min-height:44px}

.voice-button{min-height:44px;flex-shrink:0;gap:6px}
.voice-button{touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.voice-button.is-recording{background:#dce7ce;border-color:#71885d;color:#29402c}
.voice-feedback p:empty{visibility:hidden}
.voice-feedback p{font-size:13px;margin:10px 0 0}
.voice-feedback button{margin-top:8px}
[hidden]{display:none!important}
.capture-bottom{flex-wrap:wrap;gap:10px}
#voice-status{color:var(--green);min-height:28px}
.capture-bottom{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center}
.capture-bottom>button{margin:0;min-height:48px;box-sizing:border-box}
.voice-feedback #voice-status{height:2.8em;min-height:2.8em;line-height:1.4;overflow:hidden}
@media(max-width:600px){
  .capture-bottom{grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:10px}
  .capture-bottom>span{grid-column:1/-1;max-width:none}
  .capture-bottom>button{width:100%;height:60px;min-width:0;padding:10px 8px}
  .voice-button{margin-left:0;font-size:12px;gap:6px}
  .voice-button>span{white-space:normal;line-height:1.25}
  .capture-bottom #drop{grid-column:2}
}

.assist-banner{margin:18px 0;padding:18px 22px;background:#f2f3eb;border:1px solid #e2e5d7;border-radius:20px}.assist-banner p{margin:8px 0;color:var(--green);font-size:16px}.assist-banner small{display:block;margin-bottom:12px;color:#737c6c}.assist-banner>div{display:flex;gap:12px;flex-wrap:wrap}.proposal-members{max-height:260px;overflow:auto;padding-left:22px}.proposal-members li{margin:8px 0}.clarification-history{margin:16px 0;font-size:14px}.suggestion-list{max-height:350px;overflow:auto}
.dependency-row{display:flex;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid var(--line)}
.dependency-row>span{flex:1;min-width:0;overflow-wrap:anywhere;font-size:14px;line-height:1.5}
.dependency-row .icon-button{flex-shrink:0;min-width:44px;min-height:44px}
.dependency-result{display:block;width:100%;text-align:left;margin:8px 0;white-space:normal;overflow-wrap:anywhere}
#dependency-search-area{margin:12px 0}