/* =====================================================================
   AstraNet — stili per thread, reazioni, sondaggi, attività, calendario, note e chiamate
   ===================================================================== */
.main{position:relative}
.mh-tools{display:flex;align-items:center;gap:2px}
.mh-tools .icon-btn{width:36px;height:36px;color:var(--ink-2);position:relative}
.mh-tools .icon-btn:hover{color:var(--navy);background:var(--brand-soft)}
.mh-tools .call-v{background:var(--green);color:var(--navy)}
.mh-tools .call-v:hover{background:var(--green-2)}
.pin-btn .cnt{position:absolute;top:2px;right:2px;min-width:15px;height:15px;border-radius:8px;background:var(--navy);color:var(--green);font-size:9px;font-weight:800;display:grid;place-items:center;padding:0 3px}
@media (prefers-color-scheme:dark){.mh-tools .icon-btn:hover{color:var(--green)}.pin-btn .cnt{background:var(--green);color:var(--navy)}}

/* --- messaggi: azioni, reazioni, thread, fissati --- */
.acts{gap:0}
.acts button{width:32px;height:30px}
.reacts{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.react{display:inline-flex;align-items:center;gap:4px;height:24px;padding:0 8px;border-radius:999px;border:1px solid var(--line);background:var(--panel);font-size:13px}
.react span{font-size:11px;font-weight:700;color:var(--ink-2)}
.react:hover{border-color:var(--green)}
.react.me{background:rgba(134,207,61,.16);border-color:var(--green)}
.msg.mine .react{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2);color:#fff}
.msg.mine .react span{color:rgba(255,255,255,.8)}
.msg.mine .react.me{background:rgba(134,207,61,.3);border-color:var(--green)}
.emoji-row{display:flex;gap:2px;padding:2px}
.menu .emoji-row .emo{width:38px;height:38px;font-size:20px;justify-content:center;padding:0;border-radius:10px}
.menu .emoji-row .emo:hover{background:var(--hover);transform:scale(1.15)}
.thread-link{display:flex;align-items:center;gap:6px;margin-top:8px;padding:4px 8px 4px 4px;border-radius:10px;font-size:12px;color:var(--accent-ink)}
.thread-link:hover{background:var(--brand-soft)}
.thread-link span:last-child{color:var(--ink-3)}
.msg.mine .thread-link{color:var(--green-2)} .msg.mine .thread-link span:last-child{color:rgba(255,255,255,.6)} .msg.mine .thread-link:hover{background:rgba(255,255,255,.08)}
.tl-av{display:flex}.tl-av .ini{border:2px solid var(--panel);margin-right:-6px}.tl-av{margin-right:6px}
.pin-tag{display:inline-flex;align-items:center;gap:3px;font-weight:700;color:var(--accent-ink);font-size:11px}
.msg.mine .pin-tag{color:var(--green-2)}
.msg.is-pinned .bubble{box-shadow:0 0 0 1.5px rgba(134,207,61,.55),0 4px 14px rgba(20,33,55,.06)}
.menu-h{font-family:"Sora",sans-serif;font-weight:700;padding:8px 10px 6px}
.menu .pin-item{align-items:flex-start;max-width:360px}
.pin-txt{font-size:13px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.menu{max-height:70vh;overflow:auto}

/* --- chiamate e riunioni nei messaggi --- */
.msg.special .bubble{background:var(--panel);border:1px solid var(--line)}
.call-card{display:flex;align-items:center;gap:12px;min-width:260px;padding:4px 0}
.cc-ic{width:40px;height:40px;border-radius:12px;background:var(--navy);color:var(--green);display:grid;place-items:center;flex:none}
.call-card.live .cc-ic{background:var(--green);color:var(--navy);animation:pulse 1.6s infinite}
.call-card .grow{min-width:0}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(134,207,61,.6)}70%{box-shadow:0 0 0 10px rgba(134,207,61,0)}100%{box-shadow:0 0 0 0 rgba(134,207,61,0)}}
.call-banner{display:flex;align-items:center;gap:10px;margin:10px 18px 0;padding:10px 14px;border-radius:14px;background:linear-gradient(135deg,var(--navy),var(--navy-3));color:#fff;font-size:13px}
.call-banner span{color:rgba(255,255,255,.75)}
.live-dot{width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 0 0 rgba(134,207,61,.7);animation:pulse 1.6s infinite;flex:none}
.btn.sm{height:30px;padding:0 14px;font-size:12.5px}
.lnk{color:var(--accent-ink);font-weight:700;font-size:13px;display:inline-flex;align-items:center;gap:4px}
.lnk:hover{text-decoration:underline}

/* --- sondaggi --- */
.poll{min-width:min(340px,70vw);display:flex;flex-direction:column;gap:6px}
.poll-q{display:flex;gap:8px;align-items:flex-start;font-size:15px}
.poll-q svg{color:var(--green);margin-top:2px;flex:none}
.poll-opt{position:relative;display:flex;align-items:center;gap:8px;width:100%;min-height:40px;padding:8px 12px;border-radius:12px;border:1px solid var(--line);background:var(--bg);text-align:left;overflow:hidden}
.poll-opt i{position:absolute;inset:0 auto 0 0;background:rgba(134,207,61,.22);transition:width .4s}
.poll-opt > span{position:relative}
.poll-opt .po-t{flex:1;font-weight:600}
.poll-opt .po-n{font-size:12px;color:var(--ink-2);font-weight:700}
.poll-opt .po-c{width:18px;height:18px;border-radius:50%;border:2px solid var(--line);display:grid;place-items:center;flex:none;color:var(--navy)}
.poll-opt.on{border-color:var(--green)}
.poll-opt.on .po-c{background:var(--green);border-color:var(--green)}
.poll-opt:not(:disabled):hover{border-color:var(--green)}
.poll-f{display:flex;justify-content:space-between;align-items:center;margin-top:2px}
.msg.mine .poll-opt{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18);color:#fff}
.msg.mine .poll-opt .po-n,.msg.mine .poll .hint{color:rgba(255,255,255,.7)}
.msg.mine .poll-opt .po-c{border-color:rgba(255,255,255,.4)}
.poll-edit{display:flex;flex-direction:column;gap:6px;margin-bottom:8px}
.po-row{display:flex;gap:6px;align-items:center}
.po-row input{flex:1;border:1px solid var(--line);border-radius:12px;padding:9px 12px;background:var(--bg);outline:none}
.po-row input:focus{border-color:var(--green)}

/* --- thread --- */
.thread-panel{position:absolute;top:0;right:0;bottom:0;width:min(440px,100%);background:var(--bg);border-left:1px solid var(--line);display:flex;flex-direction:column;z-index:6;box-shadow:-12px 0 30px rgba(20,33,55,.12);animation:slidein .18s ease}
@keyframes slidein{from{transform:translateX(24px)}}
.th-h{display:flex;align-items:center;gap:8px;padding:0 12px 0 18px;min-height:64px;background:var(--panel);border-bottom:1px solid var(--line)}
.th-h b{font-family:"Sora",sans-serif;font-size:16px}
.th-list{flex:1;overflow:auto;padding:14px 16px}
.thread-panel .comp-wrap{padding:0 14px 14px}

/* --- pagine Attività e Calendario --- */
.page{display:flex;flex-direction:column;height:100%;min-height:0}
.page-h{display:flex;align-items:center;gap:12px;padding:16px 22px;background:var(--panel);border-bottom:1px solid var(--line)}
.page-h h2{font-family:"Sora",sans-serif;font-size:19px;margin:0}
.page-h .btn{display:inline-flex;align-items:center;gap:6px}
.side-list .group:not(:first-child){margin-top:10px}
.item .badge{margin-left:auto}
select{font:inherit;color:inherit}
.fld select{width:100%;border:1px solid var(--line);border-radius:12px;padding:9px 10px;background:var(--bg);outline:none}
.fld select:focus{border-color:var(--green)}
.fld-row{display:flex;gap:10px}.fld-row > *{flex:1;min-width:0}

.board{flex:1;display:grid;grid-template-columns:repeat(3,minmax(240px,1fr));gap:14px;padding:16px 18px;overflow:auto;align-items:start}
.col{background:var(--panel);border-radius:16px;border:1px solid var(--line);display:flex;flex-direction:column;max-height:100%;min-height:120px;transition:border-color .15s,box-shadow .15s}
.col.over{border-color:var(--green);box-shadow:0 0 0 3px rgba(134,207,61,.2)}
.col-h{display:flex;align-items:center;gap:8px;padding:12px 12px 8px 14px;font-family:"Sora",sans-serif}
.col-h .cnt{font-size:12px;color:var(--ink-3);font-weight:700;margin-right:auto}
.col-h .dot{width:9px;height:9px;border-radius:50%;background:var(--ink-3)}
.col-doing .dot{background:#E0A100}.col-done .dot{background:var(--green)}
.col-list{padding:4px 10px 12px;display:flex;flex-direction:column;gap:8px;overflow:auto}
.col-empty{font-size:12px;color:var(--ink-3);text-align:center;padding:18px 8px;border:1.5px dashed var(--line);border-radius:12px}
.tcard{display:flex;gap:10px;align-items:flex-start;padding:11px 12px;border-radius:14px;background:var(--bg);border:1px solid var(--line);cursor:pointer;transition:transform .12s,box-shadow .12s}
.tcard:hover{box-shadow:0 6px 18px rgba(20,33,55,.1);transform:translateY(-1px)}
.tcard.dragging{opacity:.45}
.tcard.done .ttitle{text-decoration:line-through;color:var(--ink-3)}
.tchk{width:20px;height:20px;border-radius:7px;border:2px solid var(--line);flex:none;display:grid;place-items:center;margin-top:1px;color:var(--navy)}
.tchk:hover{border-color:var(--green)}
.tchk.on{background:var(--green);border-color:var(--green)}
.tbody{flex:1;min-width:0}
.ttitle{font-weight:600;line-height:1.35;word-wrap:break-word}
.tmeta{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px;align-items:center}
.due{display:inline-flex;align-items:center;gap:3px;font-size:11.5px;font-weight:700;color:var(--ink-2);background:var(--hover);padding:2px 7px;border-radius:999px}
.due.today{background:#FFF1CC;color:#8A5A00}.due.over{background:#FDE2E6;color:#B4213C}
@media (prefers-color-scheme:dark){.due.today{background:#3D3215;color:#F3C45C}.due.over{background:#45202A;color:#FF8FA3}}
.tconv{font-size:11.5px;color:var(--accent-ink);font-weight:700}
.tnote{color:var(--ink-3);display:inline-flex}

.mcal{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;padding:0 6px 6px}
.mc-h{text-align:center;font-size:11px;font-weight:700;color:var(--ink-3);padding:4px 0}
.mc-d{aspect-ratio:1;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:13px;font-weight:600;position:relative}
.mc-d:hover{background:var(--hover)}
.mc-d.out{color:var(--ink-3);opacity:.6}
.mc-d.today span{color:var(--accent-ink);font-weight:800}
.mc-d.sel{background:var(--navy);color:#fff}.mc-d.sel.today span{color:var(--green)}
@media (prefers-color-scheme:dark){.mc-d.sel{background:var(--green);color:var(--navy)}.mc-d.sel.today span{color:var(--navy)}}
.mc-d i{position:absolute;bottom:5px;width:5px;height:5px;border-radius:50%;background:var(--green)}
.mc-nav{display:flex;align-items:center;justify-content:space-between;padding:0 6px 8px}
.mc-nav b{font-family:"Sora",sans-serif}
.ev-mini{min-height:50px}
.ev-mini.live .ev-date{background:var(--green);color:var(--navy)}
.ev-date{width:38px;height:40px;border-radius:10px;background:var(--hover);display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;flex:none}
.ev-date b{font-size:15px}.ev-date span{font-size:10px;text-transform:uppercase;color:var(--ink-3);margin-top:2px}
.item.on .ev-date{background:rgba(134,207,61,.18);color:#fff}
.agenda{flex:1;overflow:auto;padding:8px 22px 24px}
.ag-day{position:sticky;top:0;z-index:1;background:var(--bg);padding:14px 0 8px;font-family:"Sora",sans-serif;font-size:14px}
.ag-day.today b{color:var(--accent-ink)}
.ev-card{display:flex;gap:16px;padding:16px 18px;border-radius:18px;background:var(--panel);border:1px solid var(--line);margin-bottom:10px}
.ev-card.live{border-color:var(--green);box-shadow:0 0 0 3px rgba(134,207,61,.18)}
.ev-card.past{opacity:.6}
.ev-card.flash{animation:flash 1.8s ease}
.ev-time{display:flex;flex-direction:column;align-items:flex-end;min-width:48px;font-variant-numeric:tabular-nums}
.ev-time b{font-family:"Sora",sans-serif;font-size:15px}.ev-time span{font-size:12px;color:var(--ink-3)}
.ev-body{flex:1;min-width:0;border-left:3px solid var(--green);padding-left:14px}
.ev-title{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ev-title b{font-size:15.5px;font-family:"Sora",sans-serif}
.live-tag{font-size:11px;font-weight:800;background:var(--green);color:var(--navy);padding:2px 8px;border-radius:999px}
.ev-descr{margin:8px 0 2px;white-space:pre-wrap;color:var(--ink-2);font-size:13.5px}
.ev-att{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}
.att{position:relative}
.att i{position:absolute;right:-3px;bottom:-3px;width:14px;height:14px;border-radius:50%;font-size:9px;font-style:normal;font-weight:800;display:grid;place-items:center;border:2px solid var(--panel);background:var(--ink-3);color:#fff}
.att.r-yes i{background:var(--green);color:var(--navy)}.att.r-no i{background:var(--busy)}.att.r-maybe i{background:#E0A100}
.ev-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ev-actions .btn{display:inline-flex;align-items:center;gap:6px}
.ev-actions a.icon-btn{display:grid;place-items:center;color:var(--ink-2)}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden}
.seg button{padding:6px 12px;font-size:12.5px;font-weight:700;color:var(--ink-2)}
.seg button + button{border-left:1px solid var(--line)}
.seg button.on{background:var(--navy);color:var(--green)}
@media (prefers-color-scheme:dark){.seg button.on{background:var(--green);color:var(--navy)}}

/* --- note --- */
.notes{padding:18px 22px}
.notes-h{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.notes-h .btn{display:inline-flex;align-items:center;gap:6px}
.note-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.note-card{text-align:left;padding:16px;border-radius:16px;background:var(--panel);border:1px solid var(--line);display:flex;flex-direction:column;gap:6px;min-height:150px;transition:transform .12s,box-shadow .12s}
.note-card:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(20,33,55,.1);border-color:var(--green)}
.note-card b{font-family:"Sora",sans-serif;font-size:15px}
.note-card p{margin:0;color:var(--ink-2);font-size:13px;flex:1;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.nc-ic{width:34px;height:34px;border-radius:10px;background:var(--brand-soft);color:var(--accent-ink);display:grid;place-items:center}
.note-ed{max-width:860px;margin:0 auto;padding:12px 22px 30px;display:flex;flex-direction:column;gap:10px;min-height:100%}
.note-bar{display:flex;align-items:center;gap:8px;position:sticky;top:0;background:var(--bg);padding:6px 0;z-index:2}
.note-title{font-family:"Sora",sans-serif;font-size:24px;font-weight:700;border:0;background:transparent;outline:none;padding:4px 0}
.note-tb{display:flex;gap:4px;flex-wrap:wrap}
.tb-b{min-width:34px;height:32px;border-radius:10px;border:1px solid var(--line);background:var(--panel);font-weight:800;font-size:13px}
.tb-b:hover{border-color:var(--green)}
.note-body{flex:1;min-height:360px;border:1px solid var(--line);border-radius:16px;padding:16px 18px;background:var(--panel);outline:none;resize:vertical;font-size:15px;line-height:1.6}
.note-body:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(134,207,61,.18)}
.note-preview{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:18px 22px;min-height:200px}
.note-conflict{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 12px;border-radius:12px;background:#FFF1CC;color:#5C4A00;font-size:13px}
@media (prefers-color-scheme:dark){.note-conflict{background:#3D3215;color:#F3C45C}}
.md{font-size:15px;line-height:1.6;overflow-wrap:anywhere}
.md h2,.md h3,.md h4{font-family:"Sora",sans-serif;margin:.6em 0 .3em}
.md h2{font-size:21px}.md h3{font-size:17px}.md h4{font-size:15px}
.md p{margin:.25em 0}.md ul,.md ol{margin:.3em 0;padding-left:1.4em}
.md ul.checks{list-style:none;padding-left:.2em}
.md ul.checks li{display:flex;gap:8px;align-items:flex-start}
.md ul.checks li.done span{text-decoration:line-through;color:var(--ink-3)}
.md ul.checks input{margin-top:5px;accent-color:#86CF3D;width:16px;height:16px}
.md a{color:var(--accent-ink)}
.md code{background:var(--hover);padding:1px 5px;border-radius:5px;font-size:13px}
.md-gap{height:.6em}
.md hr{border:0;border-top:1px solid var(--line);margin:1em 0}

/* --- toast con azione --- */
.toast{display:flex;align-items:center;gap:14px}
.toast-act{color:var(--green);font-weight:800;white-space:nowrap}

/* --- chiamata --- */
.call{position:fixed;inset:0;z-index:80;display:flex;flex-direction:column;background:var(--sky);background-color:#0E1828;color:#fff}
.call.hidden{display:none}
.call-top{display:flex;align-items:center;gap:12px;padding:14px 18px}
.call-title{font-family:"Sora",sans-serif;font-size:17px;margin-right:10px}
.call-timer{font-variant-numeric:tabular-nums;color:var(--green);font-weight:700}
.call-grid{flex:1;display:grid;gap:10px;padding:0 16px;min-height:0;grid-template-columns:1fr;grid-auto-rows:1fr;position:relative}
.call-grid[data-n="2"]{grid-template-columns:1fr 1fr}
.call-grid[data-n="3"],.call-grid[data-n="4"]{grid-template-columns:1fr 1fr}
.call-grid[data-n="5"],.call-grid[data-n="6"]{grid-template-columns:1fr 1fr 1fr}
.call-grid.has-screen .tile.screen{grid-column:1/-1;grid-row:span 2}
.tile{position:relative;border-radius:18px;overflow:hidden;background:#1B2C48;min-height:0;box-shadow:0 0 0 2px transparent;transition:box-shadow .2s}
.tile.speaking{box-shadow:0 0 0 3px var(--green)}
.tile video{width:100%;height:100%;object-fit:cover;display:block;background:#0B1322}
.tile.screen video{object-fit:contain}
.tile.mirror video{transform:scaleX(-1)}
.tile-av{position:absolute;inset:0;display:none;place-items:center;background:radial-gradient(circle at 50% 40%,#263B5E,#142137)}
.tile.novideo .tile-av{display:grid}
.tile.novideo video{opacity:0}
.tile-av .ini{box-shadow:0 0 0 4px rgba(134,207,61,.35)}
.tile-name{position:absolute;left:10px;bottom:10px;display:flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:rgba(10,16,28,.65);backdrop-filter:blur(4px);font-size:12.5px;font-weight:700}
.tmic{display:inline-flex;color:#FF8FA3}
.tile.connecting::after{content:attr(data-conn);position:absolute;top:10px;left:10px;font-size:11px;font-weight:700;background:rgba(10,16,28,.65);padding:3px 9px;border-radius:999px}
.waiting{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);background:rgba(10,16,28,.7);padding:8px 16px;border-radius:999px;font-size:13px}
.call-grid[data-n="1"] .tile.self{max-width:900px;justify-self:center;width:100%}
.call-ctrl{display:flex;justify-content:center;gap:14px;padding:16px 16px calc(18px + env(safe-area-inset-bottom))}
.cbtn{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.12);color:#fff;transition:background .15s,transform .1s}
.cbtn:hover{background:rgba(255,255,255,.2)}
.cbtn:active{transform:scale(.95)}
.cbtn.off{background:#fff;color:#142137}
.cbtn.active{background:var(--green);color:#142137}
.cbtn.end{background:#E5484D}.cbtn.end:hover{background:#F2555A}
.cbtn.ok{background:var(--green);color:#142137}
.cbtn.ghost{width:40px;height:40px;background:transparent}
.cbtn.sm{width:36px;height:36px}
.call-pill{position:fixed;right:16px;bottom:16px;z-index:79;display:flex;align-items:center;gap:8px;padding:8px 8px 8px 14px;border-radius:999px;background:#142137;color:#fff;box-shadow:0 14px 34px rgba(0,0,0,.35);border:1px solid rgba(134,207,61,.4)}
.pill-main{display:flex;flex-direction:column;align-items:flex-start;line-height:1.2;color:#fff;padding-right:6px;text-align:left}
.pill-main b{font-size:13px;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pill-main span{font-size:11px;color:rgba(255,255,255,.7)}
.pill-main .pt{color:var(--green);font-weight:700}
.ring{position:fixed;right:20px;top:70px;z-index:85;width:290px;padding:22px;border-radius:22px;background:#142137;color:#fff;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;box-shadow:0 24px 60px rgba(0,0,0,.45);border:1px solid rgba(134,207,61,.45);animation:slidein .2s ease}
.ring b{font-family:"Sora",sans-serif;font-size:18px;margin-top:6px}
.ring > span{color:rgba(255,255,255,.7);font-size:13px}
.ring .ini{box-shadow:0 0 0 0 rgba(134,207,61,.6);animation:pulse 1.4s infinite}
.ring-btns{display:flex;gap:14px;margin-top:12px}

@media (max-width:760px){
  .thread-panel{width:100%;border-left:0}
  .board{grid-template-columns:1fr;padding:12px}
  .page-h{padding:12px 14px}
  .page-h .btn{padding:0 12px;font-size:0;gap:0}.page-h .btn svg{margin:0}
  .agenda{padding:4px 12px 18px}
  .ev-card{padding:14px;gap:10px}
  .mh-tools .pin-btn{display:none}
  .tabs button{padding:0 10px}
  .call-grid[data-n="2"]{grid-template-columns:1fr;grid-template-rows:1fr 1fr}
  .call-grid[data-n="3"],.call-grid[data-n="4"],.call-grid[data-n="5"],.call-grid[data-n="6"]{grid-template-columns:1fr 1fr}
  .cbtn{width:52px;height:52px}
  .ring{left:12px;right:12px;width:auto;top:12px}
  .notes,.note-ed{padding:12px}
  .fld-row{flex-direction:column;gap:0}
  .rail{gap:2px}.rail button{width:auto;flex:1;min-width:0;font-size:9.5px}
}