/* Projects home (/) and New project (/new). Tokens come from room.css. */
body.homepage{font:13px/1.45 Inter,system-ui,sans-serif}
.hp{min-height:100vh;display:grid;grid-template-rows:44px minmax(0,1fr)}
.hp .top{display:flex;align-items:center;gap:14px;padding:0 14px;border-bottom:1px solid var(--line)}
.hp .mark{font:500 11px 'JetBrains Mono',monospace;letter-spacing:.18em;color:var(--mut);display:flex;gap:14px;align-items:center;white-space:nowrap}
.hp .mark a{color:inherit;text-decoration:none}.hp .mark a:hover{color:var(--ink)}
.hp .mark b{color:var(--ink)}
.hp .mark .ws{font:500 12.5px Inter,system-ui,sans-serif;letter-spacing:0;color:var(--soft)}
.hp .mark .sl{color:var(--dim);letter-spacing:0}
.hp .grow{flex:1}
.hp .av{width:26px;height:26px;border-radius:50%;background:var(--panel);border:1px solid var(--line);display:grid;place-items:center;color:var(--soft);text-decoration:none;font-size:12px}
.hp .body{display:grid;grid-template-columns:320px minmax(0,1fr);min-height:0}
.rail{border-right:1px solid var(--line);padding:22px 16px;overflow:auto}
.rail h3{font:11px 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--mut);font-weight:400;margin:0 8px 12px;display:flex;justify-content:space-between}
.rail .gap{height:26px}
.wsb,.tm{display:block;padding:10px 12px;border-radius:8px;color:var(--ink);text-decoration:none;font-size:15px}
.wsb.on{background:#1a1a1a}.wsb:hover{background:#161616}
.wsb small,.tm small,.later small{display:block;font:11.5px 'JetBrains Mono',monospace;color:var(--mut)}
.later,.invite{display:block;padding:10px 12px;color:var(--soft);font-size:15px;text-decoration:none}
.invite{font-size:14px;margin-top:8px}.invite:hover{color:var(--ink)}
.main{padding:34px 40px;min-width:0}
.mhead{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px}
.mhead h1{font:400 40px/1 'Instrument Serif',Georgia,serif;letter-spacing:-.01em;margin:0}
.btn{display:inline-block;font:500 14px Inter,system-ui,sans-serif;border-radius:8px;padding:10px 16px;text-decoration:none;border:1px solid var(--line);background:var(--panel);color:var(--ink);cursor:pointer}
.btn:hover{border-color:var(--dim)}
.btn.primary{background:var(--volt);border-color:var(--volt);color:#0b0b0b}
.btn[disabled]{opacity:.4;cursor:default}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,380px));gap:24px}
.card{display:block;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#0f0f0f;color:var(--ink);text-decoration:none;min-height:300px;position:relative}
.card:hover{border-color:var(--dim)}
.thumb{height:166px;background:#141414 center/cover no-repeat;position:relative;border-bottom:1px solid var(--line)}
.thumb.none{background:linear-gradient(135deg,#171717,#0e0e0e)}
.tag{position:absolute;left:12px;top:12px;font:500 11px 'JetBrains Mono',monospace;letter-spacing:.16em;background:rgba(11,11,11,.85);color:var(--soft);padding:5px 9px;border-radius:6px}
.cb{padding:16px 18px}
.cb h2{font:500 19px Inter,system-ui,sans-serif;letter-spacing:0;text-transform:none;color:var(--ink);margin:0 0 6px}
.cb .meta{font:12px 'JetBrains Mono',monospace;color:var(--mut)}
.dots{display:flex;gap:6px;margin:10px 0 8px}
.dots i{width:7px;height:7px;border-radius:50%;background:var(--dim)}
.dots i.d{background:var(--soft)}.dots i.n{background:var(--volt)}
.cb p{margin:0;color:var(--soft);font-size:14px}
.card.new{border-style:dashed;display:grid;place-items:center;text-align:center;background:transparent}
.card.new .pl{font-size:28px;color:var(--soft);line-height:1}
.card.new b{display:block;font:500 19px Inter,system-ui,sans-serif;margin:12px 0 4px}
.card.new span{font:12px 'JetBrains Mono',monospace;color:var(--mut)}
/* New project */
.nw{max-width:880px;margin:0 auto;padding:110px 24px 60px}
.nw h1{font:400 56px/1.05 'Instrument Serif',Georgia,serif;margin:0 0 30px}
.box{display:block;width:100%;border:1px solid var(--volt);border-radius:12px;background:#10110a;padding:22px 24px;font:20px Inter,system-ui,sans-serif;color:var(--ink)}
.box::placeholder{color:var(--mut)}.box:focus{outline:none;box-shadow:0 0 0 3px rgba(212,255,61,.12)}
.found{border:1px solid var(--line);border-radius:12px;margin-top:22px;padding:6px 22px 14px;background:#0d0d0d}
.found h3{font:11px 'JetBrains Mono',monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--mut);font-weight:400;margin:16px 0 8px}
.fr{display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid var(--line);font-size:17px}
.fr span{color:var(--mut);font-size:15px;text-align:right}
.chg{display:block;padding:14px 0 0;color:var(--soft);font-size:15px;background:none;border:0;cursor:pointer}.chg:hover{color:var(--ink)}
.edit{padding-top:12px;display:grid;grid-template-columns:140px 1fr;gap:10px 14px;align-items:center}
.edit label{color:var(--mut);font-size:13px}
.edit input{width:100%}
.act{display:flex;align-items:center;gap:10px;margin-top:20px}
.act .nm{flex:1;display:flex;align-items:center;gap:8px;color:var(--mut);font-size:15px}
.act .nm input{flex:1;background:none;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:6px 2px;color:var(--ink);font-size:15px}
.hint{margin-top:22px;color:var(--soft);font-size:15px}.hint span{color:var(--mut)}
.err{color:var(--warn);margin-top:10px;font-size:14px;min-height:20px}
@media (max-width:760px){.hp .body{grid-template-columns:1fr}.rail{border-right:0;border-bottom:1px solid var(--line)}.main{padding:24px 16px}}
.fr.steps{font-size:15px;color:var(--soft)}
