/* CloudCode extras (features.js) */
.xdlg{z-index:40}
.xdlg.top{align-items:flex-start;padding-top:12vh}
.card.wide{max-width:680px}
.xbody{display:flex;flex-direction:column;gap:12px}
.xbody input,.xbody select,.xbody textarea{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:12px;font-size:16px;color:var(--text);font-family:inherit;width:100%}
.xbody textarea{font:13px/1.4 var(--mono);resize:vertical}
.xbody input:focus,.xbody textarea:focus{border-color:var(--accent);outline:0}
.xbody label{display:flex;flex-direction:column;gap:6px;color:var(--muted);font-size:13px}
.xbody .chk,.chk{flex-direction:row!important;align-items:center;gap:8px;color:var(--text)}
.xbody .chk input,.chk input{width:auto}
.xbody p{margin:0}
.row.wrap{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-start!important}
.col{display:flex;flex-direction:column;gap:10px}
.xbody a{color:var(--text);word-break:break-all;font-weight:600;text-decoration:underline}
button.sm{min-height:34px;padding:0 10px;font-size:13px;border-radius:10px}
button.sm.on,.seg2 button.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:700}
button.danger.sm{color:var(--err)}
button.big{width:100%;min-height:52px;font-size:16px}
.seg2{display:flex;gap:6px;flex-wrap:wrap}.seg2 button{min-height:38px;flex:1}
.cb{display:block;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px;word-break:break-all;font:12px var(--mono);user-select:all}

/* folders + binary */
#fileList li.dir{color:var(--text);font-weight:600}
#editorPane{position:relative}
#binView{position:absolute;inset:0;z-index:5;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:20px;overflow:auto}
#binView img{max-width:100%;max-height:70%;object-fit:contain;border:1px solid var(--line);border-radius:12px;background:repeating-conic-gradient(#8883 0 25%,transparent 0 50%) 0 0/16px 16px}
.tplgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
button.tpl{flex-direction:column;align-items:flex-start;gap:4px;padding:14px;min-height:110px;text-align:left;border-radius:16px}
button.tpl .big{font-size:28px}

/* preview */
#pv{position:fixed;inset:0;z-index:35;background:var(--bg);display:flex;flex-direction:column;padding-top:env(safe-area-inset-top)}
#pv[hidden]{display:none}
.pvbar{display:flex;align-items:center;gap:6px;padding:8px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.pvwrap{flex:1;min-height:0;display:flex;justify-content:center;background:#8881;overflow:auto}
#pvFrame{width:100%;height:100%;border:0;background:#fff;max-width:100%}
.pvcon{height:34%;min-height:130px;display:flex;flex-direction:column;border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
.pvhead{display:flex;align-items:center;justify-content:space-between;padding:4px 10px;color:var(--muted);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}
#pvLog{flex:1;overflow:auto;font:12.5px/1.45 var(--mono);padding:0 10px}
.pl{white-space:pre-wrap;word-break:break-word;border-bottom:1px solid var(--line);padding:3px 0}
.pl.warn{color:var(--warn)}.pl.error{color:var(--err)}.pl.cmd{color:var(--muted)}.pl.result{color:var(--ok)}
.pvin{display:flex;padding:6px}
.pvin input{flex:1;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px;color:var(--text);font:14px var(--mono)}

/* search, palette, snippets */
.sres{display:flex;flex-direction:column;gap:4px;max-height:42vh;overflow:auto}
button.srow{flex-direction:column;align-items:flex-start;gap:2px;min-height:44px;padding:6px 10px;text-align:left;font-size:13px}
button.srow span{color:var(--muted);font-family:var(--mono);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.card.pal{padding:12px;gap:8px}
.pall{display:flex;flex-direction:column;gap:2px;max-height:55vh;overflow:auto}
.pall button{justify-content:flex-start;border:0;background:none;min-height:42px;border-radius:10px;text-align:left}
.pall button.on,.pall button:hover{background:var(--panel2)}
.snrow{display:flex;flex-direction:column;gap:6px;border:1px solid var(--line);border-radius:12px;padding:10px}

/* history */
.hwrap{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:640px){.hwrap{grid-template-columns:220px 1fr}}
.hlist{display:flex;flex-direction:column;gap:6px;max-height:40vh;overflow:auto}
button.hrow{flex-direction:column;align-items:flex-start;gap:2px;min-height:48px;padding:6px 10px;text-align:left}
button.hrow.on{border-color:var(--accent)}
.hdetail{display:flex;flex-direction:column;gap:8px;min-width:0}
.dfile{border:1px solid var(--line);border-radius:10px;overflow:hidden}
button.dhead{width:100%;justify-content:space-between;border:0;border-radius:0;min-height:38px}
.diff{font:12px/1.4 var(--mono);overflow:auto;max-height:260px;background:var(--bg)}
.dl{white-space:pre;padding:0 8px}.dl.add{background:#2ea04326;color:var(--ok)}.dl.del{background:#f8514926;color:var(--err)}.dl.gap{color:var(--muted)}

/* github */
.gsec{display:flex;flex-direction:column;gap:10px;border-top:1px solid var(--line);padding-top:12px}
.gsec:first-of-type{border-top:0;padding-top:0}
.gres a{display:inline}
.rlist{display:flex;flex-direction:column;gap:6px;max-height:34vh;overflow:auto}
button.rrow{flex-direction:column;align-items:flex-start;gap:2px;min-height:48px;padding:6px 10px;text-align:left}
.gpages{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.bd.gp-live{color:var(--ok)}.bd.gp-building{color:var(--warn)}.bd.gp-failed{color:var(--err)}
.ghlogin{display:flex;align-items:center;justify-content:center;min-height:48px;border:1px solid var(--line);border-radius:12px;text-decoration:none;color:var(--text);font-weight:600}
.ghlogin:hover{border-color:var(--accent)}

/* packages */
.pkpane,.adpane{display:flex;flex-direction:column;gap:10px}
.pkrow{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:12px;padding:8px 10px}
.pkrow small{font-size:12px}

/* admin */
.adgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}
.adstat{display:flex;flex-direction:column;gap:4px;border:1px solid var(--line);border-radius:14px;padding:14px}
.adstat b{font-size:24px}
.aduser{display:flex;flex-direction:column;gap:6px;border:1px solid var(--line);border-radius:14px;padding:12px}
.warnline{color:var(--warn)}
.annbar{background:var(--accent);color:var(--accent-ink);padding:8px 14px;text-align:center;font-weight:600;font-size:14px}