/* Plugd editor. Sits on dash.css (same dark app); this adds the form, the phone and the mobile Preview tab. */
.ed{display:grid;grid-template-columns:minmax(0,1fr) 352px;gap:28px;align-items:start;padding-top:18px;padding-bottom:100px}
.ed-main{min-width:0}
.ed .tabs{top:60px}
.pane{display:grid;gap:12px}
.pane[hidden]{display:none}
.card h2{display:block}
.hint-in{display:block;font-weight:400;color:var(--text3);font-size:13.5px;margin-top:3px}
.field{display:grid;gap:7px;margin-top:14px;min-width:0}
.card h2+.field{margin-top:0}
.field label,.lbl{font-size:13.5px;font-weight:600;color:var(--text2)}
.sub-lbl{font-size:13px;color:var(--text3);margin-top:4px}
.hint{color:var(--text3);font-size:13px}
.ed input,.ed select{width:100%;height:46px;border:0;border-radius:11px;background:var(--panel2);color:var(--text);padding:0 13px;font:16px var(--font);letter-spacing:-.01em;min-width:0;-webkit-appearance:none;appearance:none}
.ed select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%23aaa' stroke-width='1.8'%3E%3Cpath d='m1 1.5 5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:32px}
.ed textarea{min-height:72px}
.ed input:focus,.ed select:focus,.ed textarea:focus{outline:2px solid var(--text);outline-offset:0}
.ed input[type=color]{width:38px;height:38px;padding:0;border-radius:10px;background:none;cursor:pointer}
.ed input[type=datetime-local]{color-scheme:dark}
.btn.small{height:36px;font-size:14px;padding:0 12px;margin-top:12px}
.photo-acts .btn.small{margin-top:0}
.pair-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:end}
.pair-row:has(.row-tools){grid-template-columns:1fr 1fr auto}
.link-row{display:grid;grid-template-columns:130px minmax(0,1fr) 110px auto;gap:8px;margin-top:10px}
.card h2+.link-row{margin-top:0}
.item{padding:14px 0;border-top:1px solid var(--line);margin-top:14px;position:relative}
.item .row-tools{justify-content:flex-end;margin-top:10px}
.row-tools{display:flex;gap:4px;align-items:center}
.ic{width:36px;height:46px;border:0;border-radius:10px;background:var(--panel2);color:var(--text2);font-size:17px;cursor:pointer}
.item .ic,.order .ic{height:36px}
.ic:disabled{opacity:.3;cursor:default}
.ic:not(:disabled):hover{color:var(--text)}
.seg.mini{max-width:420px}
.photo{display:flex;align-items:center;gap:14px}
.photo img,.empty-ph{width:88px;height:66px;border-radius:10px;object-fit:cover;flex:none;background:var(--panel2)}
.empty-ph{display:grid;place-items:center;color:var(--text3);font-size:12.5px}
.photo-acts{display:flex;gap:8px;flex-wrap:wrap}
.photo-acts label{cursor:pointer}
.photo-acts label:focus-within{outline:2px solid var(--text);outline-offset:2px}
.order{list-style:none;display:grid;gap:6px}
.order li{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--panel2);border-radius:12px;padding:5px 5px 5px 12px;min-height:46px}
.order li.off{opacity:.55}
.order .ic{background:var(--panel)}
.tog{display:flex;align-items:center;gap:10px;font-weight:600;font-size:15px;cursor:pointer;flex:1;min-width:0}
.ed .tog input{width:20px;height:20px;accent-color:var(--text);-webkit-appearance:auto;appearance:auto;background:none;flex:none}
.themes{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}
.theme{display:grid;gap:8px;padding:10px;border:0;border-radius:12px;background:var(--panel2);color:var(--text2);font-weight:600;font-size:14px;text-align:left;cursor:pointer}
.theme .sw{display:flex;height:42px;border-radius:8px;overflow:hidden;background:var(--tb);padding:8px;gap:6px;align-items:flex-end}
.theme .sw i{display:block;flex:1;border-radius:4px;background:var(--tg);height:60%}
.theme .sw i:last-child{background:var(--ta);height:100%}
.theme .sw i:first-child{background:var(--tt);height:30%;opacity:.8}
.theme[aria-pressed=true]{color:var(--text);box-shadow:0 0 0 2px var(--text)}
.swatches{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.swatches button{width:38px;height:38px;border-radius:10px;border:0;cursor:pointer;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.swatches button[aria-pressed=true]{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--text)}
.msg a,.demo-note a{text-decoration:underline;text-underline-offset:2px}
.ed-foot{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.demo-note{color:var(--text2);font-size:14.5px;padding-top:14px}

/* the phone: the real page at phone size, scaled */
.ed-phone{position:sticky;top:76px;display:grid;justify-items:center;gap:10px}
.ed-phone .phone{--s:.8;width:calc(390px * var(--s) + 20px);max-width:none;height:calc(844px * var(--s) + 20px);border-radius:calc(54px * var(--s) + 10px);padding:10px;margin:0}
.ed-phone .screen{width:100%;height:100%;border-radius:calc(54px * var(--s));overflow:hidden}
.ed-phone iframe{position:absolute;inset:0;width:390px;height:844px;border:0;transform:scale(var(--s));transform-origin:0 0;background:#000}
@media (max-height:820px) and (min-width:861px){.ed-phone .phone{--s:.7}}
.only-s{display:none !important}

@media (max-width:860px){
  .ed{grid-template-columns:1fr}
  .only-s{display:inline-flex !important}
  .ed-phone{display:none;position:static}
  .previewing .ed-phone{display:grid}
  .previewing .ed-main .msg,.previewing .ed-foot{display:none}
  .hide-s{display:none}
  .ed-phone .phone{--s:.82}
}
@media (max-width:600px){
  .link-row{grid-template-columns:1fr auto;}
  .link-row select{grid-column:1/-1}
  .link-row input[type=text]{grid-column:1}
  .link-row input[type=url]{grid-column:1/-1}
  .pair-row,.pair-row:has(.row-tools){grid-template-columns:1fr}
  .pair-row .row-tools{justify-content:flex-end}
  .tabs .seg button{font-size:13.5px}
}
@media (max-width:400px){.ed-phone .phone{--s:.76}}
.photo-acts label.btn{color:#0b0b0c;font-size:14px;font-weight:600}
.qr{display:grid;justify-items:start;gap:10px}
.qr:not(:empty){margin-top:12px}
.qr-img{width:180px;height:180px;border-radius:12px;image-rendering:pixelated}
.qr-wait{color:var(--text3);font-size:14px}
.qr .btn.small{margin-top:0}
#share .linkbox{margin-bottom:2px}
.sched{margin-top:12px}
.sched summary{cursor:pointer;color:var(--text2);font-size:14px;font-weight:600;list-style:none}
.sched summary::-webkit-details-marker{display:none}
.sched summary::before{content:"+ ";color:var(--text3)}
.sched[open] summary::before{content:"− "}
.sched .hint{margin-top:6px}
.demo-note p+p{margin-top:8px}
.starts{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center}
.starts a{color:var(--text2);text-decoration:underline;text-underline-offset:3px}
.starts a[aria-current]{color:var(--text);font-weight:600;text-decoration:none}
