/* additions for the hosted studio */
#gate{position:fixed;inset:0;z-index:50;background:radial-gradient(1200px 600px at 50% -10%,#2a1435,var(--bg));display:grid;place-items:center;padding:16px}
#gate .box{width:min(420px,100%);background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:24px;display:grid;gap:14px}
#gate h1{font-family:var(--display);font-weight:800;font-size:30px;margin:0;line-height:1.05}
#gate h1 span{color:var(--accent)}
#gate p{margin:0;color:var(--muted)}
#gate form{display:grid;gap:10px}
#gate input{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:10px 12px;width:100%;font-size:16px}
#gate button{padding:10px 12px;font-size:15px}
#gateMsg{min-height:1.4em;font-size:13px;color:var(--fg)}
#userbox{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}
#userbox button{padding:3px 8px;font-size:12px}
.yard{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:16px;align-items:start}
@media (max-width:900px){.yard{grid-template-columns:minmax(0,1fr)}}
.ystat{display:flex;align-items:center;gap:10px;font-size:15px}
.ydot{width:12px;height:12px;border-radius:50%;background:var(--muted);flex:none}
.ydot.on{background:var(--ok);box-shadow:0 0 0 4px #6fd38a22}
.ydot.off{background:var(--bad)}
#yardNow{font-family:var(--display);font-weight:800;font-size:26px;line-height:1.15}
#yardNow .mono{font-family:var(--mono);font-weight:400;font-size:16px;color:var(--muted);margin-left:6px}
.ybig{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.ybig button{padding:14px 8px;font-size:15px;font-weight:600}
.yrow{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.yrow select{width:auto;flex:1;min-width:160px}
.ylog{display:grid;grid-template-columns:auto 1fr auto auto;gap:4px 10px;align-items:baseline;padding:7px 0;border-top:1px solid var(--line);font-size:13px}
.ylog .mono{color:var(--muted);font-size:11px}
.ylog .who{color:var(--muted);font-size:11px}
.ylog .res{grid-column:1/-1;color:var(--muted);font-size:12px;white-space:pre-wrap}
.yst{font-size:10px;letter-spacing:.06em;text-transform:uppercase;padding:1px 6px;border-radius:4px;background:var(--panel2)}
.yst.done{color:var(--ok)} .yst.failed{color:var(--bad)} .yst.working{color:var(--warn)}
.mrow{display:flex;gap:10px;align-items:center;padding:8px 0;border-top:1px solid var(--line)}
.mrow span:first-child{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.mpill{font-size:10px;letter-spacing:.06em;text-transform:uppercase;padding:1px 6px;border-radius:4px;background:var(--panel2);color:var(--muted)}
.mpill.owner{color:var(--accent)}
.mform{display:flex;gap:8px;flex-wrap:wrap}
.mform input{flex:1;min-width:200px}
.mform select{width:auto}
