/* ── Cosmos Crew — pages the Command Center does not have. Loads after style.css. ── */

/* shared bits */
.lede{max-width:70ch;margin:-.5rem 0 1.2rem;line-height:1.5}
.pre{white-space:pre-wrap;overflow-wrap:anywhere}
.back{display:inline-block;margin-bottom:.8rem;color:var(--teal);text-decoration:none;font-weight:700;font-size:.9rem}
.back:hover{text-decoration:underline}
.tag{display:inline-block;font-size:.7rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-soft);border:1.5px solid var(--cream-dk);border-radius:999px;padding:.08rem .5rem;white-space:nowrap}
.who-chip{white-space:nowrap}
.who-chip.none{background:transparent;color:var(--ink-soft);border:1.5px dashed var(--cream-dk)}
button.pill{font:inherit;font-size:.85rem;cursor:pointer;color:var(--ink)}
button.pill:hover{border-color:var(--teal)}
a.btn{text-decoration:none;display:inline-block}
.btn.ghost.danger{color:var(--red)}
.btn.ghost:hover{background:#fff;color:var(--teal)} .btn.ghost.danger:hover{color:var(--red);border-color:var(--red)}
.btn:disabled{opacity:.55;cursor:default}
.modal{max-height:calc(100vh - 2rem);overflow:auto}
.modal.wide{width:min(640px,92vw)}
.modal p{margin:.1rem 0}
.pick{display:flex;align-items:center;gap:.5rem;font-size:.92rem;font-weight:600;color:var(--ink);cursor:pointer}
.pick input{width:auto}
.picklist{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.55rem;margin:.4rem 0}
.framed .fh a.note{text-decoration:none;color:var(--teal);font-weight:700}
/* grid items default to min-width:auto and let one long line stretch the page */
.cols2>*{min-width:0}
main a{color:var(--teal)}

/* login */
.login-card p{margin:0}
.login-step{display:flex;flex-direction:column;gap:.6rem}

/* home */
.homepost{display:block;text-decoration:none;color:var(--ink)}
.homepost h4{font-size:1.25rem;margin:.15rem 0 .3rem}
.homepost p{margin:0;line-height:1.5}
.idea-line .wk-t{font-weight:600}

/* calendar: month grid */
.mhead{display:flex;align-items:center;gap:.6rem;margin-bottom:.7rem}
.mhead h3{font-size:1.4rem;min-width:11.5rem;text-align:center}
.month{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:1px;background:var(--cream-dk);border:1px solid var(--cream-dk);border-radius:14px;overflow:hidden}
.mdow{background:var(--teal-dk);color:#cdbfa4;font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;text-align:center;padding:.4rem 0}
.mcell{background:var(--card);min-height:96px;padding:.3rem;display:flex;flex-direction:column;gap:.2rem;cursor:pointer;min-width:0}
.mcell:hover{background:#fff}
.mcell.out{background:#f6efdc} .mcell.out .mnum{opacity:.4}
.mnum{font-size:.8rem;font-weight:800;color:var(--ink-soft);align-self:flex-end;line-height:1.5;min-width:1.5rem;text-align:center}
.mcell.today .mnum{background:var(--saffron);color:#2a1c06;border-radius:999px}
.mev{font:inherit;font-size:.74rem;font-weight:700;color:#fff;border:none;border-radius:6px;padding:.14rem .35rem;text-align:left;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}
.mev:hover{filter:brightness(1.12)}
.mmore{font-size:.7rem;color:var(--ink-soft);font-weight:700}
.mlegend{display:flex;flex-wrap:wrap;gap:.3rem 1rem;margin:.6rem 0 0;font-size:.78rem;color:var(--ink-soft);font-weight:700}
.mlegend i{display:inline-block;width:.7rem;height:.7rem;border-radius:3px;margin-right:.35rem;vertical-align:-1px}
button.ev{font:inherit;text-align:left;cursor:pointer;width:100%;color:var(--ink)}
button.ev:hover{border-color:var(--teal)}
.evlist.past .ev{opacity:.7}
.kindtag{font-size:.7rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap}
.evwhen{font-family:var(--serif);font-style:italic;font-size:1.1rem;color:var(--terra)}

/* projects */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:1rem}
.pcard{display:flex;flex-direction:column;gap:.5rem;background:var(--card);border-radius:16px;padding:1rem 1.1rem;text-decoration:none;color:var(--ink);
  border:1px solid #e7d3a6;box-shadow:0 0 0 1px #fff inset,0 0 0 4px #c99a3b22,0 6px 16px #0000000f}
.pcard:hover{border-color:var(--teal)}
.ptop{display:flex;justify-content:space-between;align-items:flex-start;gap:.6rem}
.pabout{margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.pcard .pbar{margin:.2rem 0 0}
.pwho{display:flex;flex-wrap:wrap;gap:.3rem;align-items:center;margin-top:auto}
.pwho.big{margin:0 0 1rem;gap:.4rem .5rem}
.note-ro{margin:-.4rem 0 1rem}
.board.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.card.ro{cursor:pointer}

/* idea box */
.icompose{display:flex;flex-direction:column;gap:.6rem;max-width:760px}
.icompose textarea{font-size:1.05rem}
.irow{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}
.icompose p{margin:0}
.idea{display:flex;gap:.9rem;align-items:flex-start;background:var(--card);border:1px solid var(--cream-dk);border-radius:14px;padding:.9rem 1rem;margin-bottom:.7rem;max-width:760px}
.heart{flex:none;display:flex;flex-direction:column;align-items:center;min-width:2.8rem;padding:.35rem .3rem;border:1.5px solid var(--cream-dk);border-radius:12px;background:#fff;
  font:inherit;font-weight:800;font-size:.85rem;color:var(--ink-soft);cursor:pointer;line-height:1.1;min-height:3rem;justify-content:center}
.heart span{font-size:1.25rem}
.heart:hover{border-color:var(--terra);color:var(--terra)}
.heart.on{border-color:var(--terra);color:var(--terra);background:#fbeee6}
.ibody{flex:1;min-width:0}
.ibody>p{margin:0 0 .5rem;font-size:1.02rem;line-height:1.45}
.imeta{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.ireply{margin-top:.6rem;padding:.55rem .75rem;background:#f6efdc;border-left:3px solid var(--saffron);border-radius:0 10px 10px 0;font-size:.92rem;line-height:1.4}
.iactions{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:.5rem}
.iactions:empty{display:none}

/* blog */
.posts{display:flex;flex-direction:column;gap:.8rem;max-width:760px}
.post-row{display:block;background:var(--card);border:1px solid var(--cream-dk);border-radius:14px;padding:1rem 1.2rem;text-decoration:none;color:var(--ink)}
.post-row:hover{border-color:var(--teal)}
.post-row h3{font-size:1.4rem;margin:.15rem 0 .35rem}
.post-row p{margin:0;line-height:1.5}
.post-date{font-family:var(--hand);font-size:1.2rem;font-weight:700;color:var(--terra)}
.post{max-width:68ch;background:var(--card);border:1px solid #e7d3a6;border-radius:16px;padding:1.6rem 1.8rem;margin-bottom:1rem;box-shadow:0 0 0 1px #fff inset,0 0 0 4px #c99a3b22}
.post h1{font-size:2.1rem;font-style:italic;color:var(--teal-dk);line-height:1.15;margin:.2rem 0 1rem}
.prose{font-size:1.06rem;line-height:1.65;overflow-wrap:anywhere}
.prose p{margin:0 0 1rem}
.prose h2{font-size:1.45rem;margin:1.6rem 0 .5rem;color:var(--teal-dk)}
.prose h3{font-size:1.2rem;margin:1.3rem 0 .4rem}
.prose h4{font-size:1.05rem;margin:1.1rem 0 .3rem}
.prose ul,.prose ol{margin:0 0 1rem;padding-left:1.3rem} .prose li{margin:.25rem 0}
.prose blockquote{margin:0 0 1rem;padding:.2rem 0 .2rem 1rem;border-left:3px solid var(--saffron);font-family:var(--serif);font-style:italic;font-size:1.15rem;color:var(--teal-dk)}
.prose hr{border:none;height:8px;border-radius:4px;margin:1.6rem 0;opacity:.8;
  background:repeating-linear-gradient(90deg,#e0991a 0 9px,#0f7d80 9px 15px,#a6482a 15px 21px,#5e3b72 21px 27px,#efab2e 27px 33px)}
.prose u{text-underline-offset:2px}
.prose ul ul,.prose ol ol,.prose ul ol,.prose ol ul{margin-bottom:0}
.prose p:last-child,.prose ul:last-child,.prose ol:last-child,.prose blockquote:last-child{margin-bottom:0}

/* blog editor: a title, a toolbar, and a page to type on */
.editor{max-width:820px}
.rt-title{font-family:var(--serif);font-style:italic;font-weight:600;font-size:1.9rem;color:var(--teal-dk);border:1.5px solid transparent;background:transparent;padding:.2rem .4rem;margin:0 0 .5rem -.4rem;border-radius:9px}
.rt-title:hover{border-color:var(--cream-dk)} .rt-title:focus{background:#fff}
.rt{background:var(--card);border:1px solid #e7d3a6;border-radius:16px;box-shadow:0 0 0 1px #fff inset,0 0 0 4px #c99a3b22}
.rt-bar{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem .2rem;padding:.45rem .6rem;border-bottom:1px solid var(--cream-dk);background:#fbf5e6;border-radius:16px 16px 0 0;position:sticky;top:0;z-index:5}
.rt-g{display:inline-flex;align-items:center;gap:.15rem;padding-right:.45rem;margin-right:.25rem;border-right:1px solid var(--cream-dk)}
.rt-g:last-child{border-right:none;margin-right:0;padding-right:0}
.rt-b{display:inline-grid;place-items:center;min-width:2rem;height:2rem;padding:0 .35rem;border:none;border-radius:7px;background:transparent;color:var(--ink);font:inherit;font-size:1rem;cursor:pointer}
.rt-b:hover{background:var(--cream-dk)}
.rt-b.on{background:var(--teal);color:#fff}
.rt-s{width:auto;padding:.3rem .4rem;font-size:.85rem;border-radius:7px;border-width:1px;background:#fff;max-width:11rem}
.rt-c{width:1.25rem;height:1.25rem;border-radius:999px;border:2px solid #fff;box-shadow:0 0 0 1px var(--cream-dk);cursor:pointer;padding:0;margin:0 .1rem}
.rt-c:hover{box-shadow:0 0 0 2px var(--ink)}
.rt-area{min-height:24rem;padding:1.4rem 1.6rem 2rem;outline:none;border-radius:0 0 16px 16px;position:relative}
.rt-area.empty::before{content:attr(data-placeholder);color:var(--ink-soft);position:absolute;left:1.6rem;top:1.4rem;pointer-events:none}
.rt-area:focus-visible{box-shadow:inset 0 0 0 2px #0f7d8033}
.editor-actions{margin-top:.9rem;justify-content:flex-end} .editor-actions>*{flex:none}
.found{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;background:#fbeee6;border:1px solid var(--terra);border-radius:12px;padding:.6rem .8rem;margin-bottom:.8rem;font-size:.92rem}
.found span{flex:1;min-width:12rem}

/* people */
.people{display:flex;flex-direction:column;gap:.45rem;max-width:680px}
.person{display:flex;align-items:center;gap:.7rem;background:var(--card);border:1px solid var(--cream-dk);border-radius:12px;padding:.55rem .8rem;flex-wrap:wrap}
.person.off{opacity:.6}
.pemail{flex:1;min-width:10rem;color:var(--ink-soft);font-size:.9rem;overflow-wrap:anywhere}
.colorpick{display:flex;gap:.5rem;flex-wrap:wrap}
.cdot{width:2rem;height:2rem;border-radius:999px;border:3px solid #fff;box-shadow:0 0 0 1.5px var(--cream-dk);cursor:pointer;padding:0}
.cdot.on{box-shadow:0 0 0 2.5px var(--ink)}

@media(max-width:760px){
  .mcell{min-height:58px;padding:.2rem .15rem}
  .mev{font-size:0;height:.5rem;padding:0;border-radius:3px}   /* a coloured bar; the list below has the words */
  .mmore{display:none}
  .mhead h3{min-width:0;flex:1;font-size:1.2rem}
  .board.three{grid-template-columns:1fr}
  .kindtag{display:none}
  .post{padding:1.1rem 1.1rem}
  .post h1{font-size:1.7rem}
  .view-head .row{flex-wrap:nowrap}
  .rt-bar{top:5.6rem}   /* below the phone header, which is sticky too */
  .rt-area{padding:1rem 1rem 1.6rem} .rt-area.empty::before{left:1rem;top:1rem}
  .rt-title{font-size:1.5rem}
  .editor-actions{justify-content:stretch} .editor-actions>*{flex:1 1 8rem}
}