:root{
  /* Sidebloom 2027 brand palette */
  --page:#eef2f7; --slide:#ffffff; --frame:#e9eef4; --fb:#cfd8e2;
  --ink:#16243c; --soft:#8b93a2; --hair:#e2e7ee;
  --blue:#0e72b9; --blued:#0d5c9a; --blue-bright:#1494e6; --navy:#0f2440; --navy-soft:#1f3a5f;
  --green:#2f9e63; --greenbg:#e6f4ec; --amber:#c98a2b; --amberbg:#f8eeda;
  --grad:linear-gradient(135deg,#1494e6 0%,#0e72b9 48%,#0f2440 120%);
  --grad-navy:linear-gradient(135deg,#0f2440 0%,#1f3a5f 100%);
}
*{box-sizing:border-box}
.sb-body{margin:0;background:var(--page);font-family:'Montserrat',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:var(--ink)}
.sb-loading{min-height:100vh;display:flex;align-items:center;justify-content:center;color:var(--soft)}
textarea,input,button,select{font-family:inherit}
::placeholder{color:var(--soft);opacity:.75}
.sb-logo{display:block;width:auto}

/* gate */
.sb-gate{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--grad);padding:20px}
.sb-gate-card{text-align:center;padding:46px 44px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.20);border-radius:22px;backdrop-filter:blur(8px);box-shadow:0 20px 60px rgba(6,20,40,.30)}
.sb-gate-logo{display:flex;justify-content:center;margin-bottom:8px}
.sb-gate-card h1{font-weight:700;color:#fff;margin:20px 0 4px;font-size:24px;letter-spacing:.2px}
.sb-gate-card p{color:rgba(255,255,255,.85);margin:0 0 24px;font-size:14px}
.sb-gate-btn{display:inline-block;background:#fff;color:var(--blue);text-decoration:none;padding:12px 30px;border-radius:99px;font-weight:700;box-shadow:0 6px 18px rgba(6,20,40,.25)}

/* top bar */
.sb-top{position:sticky;top:0;z-index:20;background:var(--grad);box-shadow:0 4px 22px rgba(15,36,64,.20);
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:13px 24px}
.sb-brand{display:flex;align-items:center;gap:10px}
.sb-titles{display:flex;flex-direction:column;min-width:170px}
.sb-titles input{border:none;background:transparent;outline:none}
.sb-titles .c{font-size:16px;font-weight:700;color:#fff}
.sb-titles .m{font-size:13px;color:rgba(255,255,255,.82)}
.sb-titles input::placeholder{color:rgba(255,255,255,.6)}
.sb-spacer{flex:1}
.sb-prog{font-size:13px;color:rgba(255,255,255,.85)} .sb-prog b{color:#fff}
.sb-seg{display:inline-flex;background:rgba(255,255,255,.16);border-radius:99px;padding:3px}
.sb-seg button{border:none;background:transparent;cursor:pointer;font-size:13px;padding:7px 14px;border-radius:99px;color:rgba(255,255,255,.9);display:inline-flex;gap:6px;align-items:center;font-weight:500}
.sb-seg button.on{background:#fff;color:var(--blue);box-shadow:0 1px 5px rgba(6,20,40,.22)}
.sb-select{font-size:13px;padding:8px 12px;border-radius:99px;border:1px solid rgba(255,255,255,.4);background:rgba(255,255,255,.14);color:#fff;cursor:pointer;font-weight:500}
.sb-select option{color:var(--ink)}
.sb-link{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:600;padding:9px 16px;border-radius:99px;border:none;background:#fff;color:var(--navy);cursor:pointer;box-shadow:0 4px 14px rgba(6,20,40,.18)}
.sb-obtn{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:500;padding:9px 14px;border-radius:99px;border:1px solid rgba(255,255,255,.42);background:rgba(255,255,255,.12);color:#fff;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.sb-obtn:hover:not(:disabled){background:#fff;color:var(--blue);border-color:#fff}
.sb-obtn:disabled{opacity:.45;cursor:default}
.sb-busy{opacity:.5;pointer-events:none}

.sb-wrap{max-width:1180px;margin:0 auto;padding:22px 20px 90px}
.sb-hint{font-size:12.5px;color:var(--blued);background:#eaf3fb;border:1px solid #cfe6f7;border-radius:10px;padding:9px 14px;display:inline-flex;gap:8px;margin-bottom:18px}
.sb-banner{font-size:12.5px;color:#8a5a12;background:var(--amberbg);border:1px solid #ecd8a6;border-radius:10px;padding:8px 14px;margin-bottom:14px}

/* card */
.sb-card{background:var(--slide);border-radius:16px;box-shadow:0 8px 26px rgba(15,36,64,.10);border:1px solid #eef1f6;padding:28px 32px 24px;margin-bottom:24px;position:relative}
.sb-del{position:absolute;top:14px;right:14px;border:none;background:transparent;color:var(--soft);cursor:pointer;padding:6px;border-radius:8px}
.sb-chead{display:flex;align-items:center;gap:16px}
.sb-pill{color:#fff;font-weight:700;font-size:12px;letter-spacing:.5px;padding:7px 20px;border-radius:99px;background:linear-gradient(135deg,var(--blue-bright),var(--blue))}
.sb-pill.approved{background:var(--green)} .sb-pill.changes{background:var(--amber)}
.sb-date{border:none;background:transparent;font-size:15px;color:var(--ink);outline:none}
.sb-rule{flex:1;height:1px;background:var(--hair)}
.sb-cols{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:34px;margin-top:16px}
@media(max-width:760px){.sb-cols{grid-template-columns:1fr}}
.sb-socials{display:flex;gap:14px;margin-bottom:16px}
.sb-socials button{border:none;background:transparent;padding:0;cursor:pointer;line-height:0}
.sb-lbl{font-size:12px;font-weight:700;color:var(--ink);margin-bottom:2px}
.sb-lbl.dim{color:var(--soft);font-weight:400}
.sb-tx{width:100%;border:none;outline:none;background:transparent;resize:none;overflow:hidden;color:var(--ink);line-height:1.5;font-size:14px;padding:0}
.sb-right-lbl{text-align:right;font-size:15px;font-weight:500;color:var(--ink);margin-bottom:10px}

/* media */
.sb-drop{cursor:pointer;border:2px dashed var(--fb);background:var(--frame);border-radius:10px;padding:34px 18px;text-align:center;color:var(--soft);display:flex;flex-direction:column;align-items:center;gap:8px}
.sb-drop.over{border-color:var(--blue);background:#eaf3fb}
.sb-drop .t{font-size:13px;color:var(--ink);font-weight:500}
.sb-brief{border-top:1px solid var(--hair);padding-top:12px;margin-top:14px}
.sb-brief .k{font-size:11px;letter-spacing:1px;font-weight:700;margin:0 0 4px}
.sb-brief .k.blue{color:var(--blue)} .sb-brief .k.soft{color:var(--soft);margin-top:12px}
.sb-frame{position:relative;background:var(--frame);border:1px solid var(--fb);border-radius:6px;overflow:hidden;flex:0 0 auto}
.sb-frame img,.sb-frame video{width:100%;height:100%;object-fit:cover;display:block}
.sb-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}
.sb-play span{width:40px;height:40px;border-radius:99px;background:rgba(255,255,255,.85);display:flex;align-items:center;justify-content:center}
.sb-x{position:absolute;top:6px;right:6px;width:24px;height:24px;border-radius:99px;border:none;background:rgba(255,255,255,.92);cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:.12s}
.sb-grip{position:absolute;top:6px;left:6px;width:22px;height:22px;border-radius:5px;background:rgba(255,255,255,.9);display:flex;align-items:center;justify-content:center;cursor:grab;opacity:0;transition:.12s}
.sb-frame:hover .sb-x,.sb-frame:hover .sb-grip{opacity:1}
.sb-row{display:flex;gap:10px;overflow-x:auto;padding-bottom:6px}
.sb-add{flex:0 0 auto;border:2px dashed var(--fb);background:var(--frame);color:var(--soft);border-radius:6px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}
.sb-ghost{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:500;color:var(--blued);background:transparent;border:1px solid var(--hair);border-radius:99px;padding:6px 12px;cursor:pointer}
.sb-center{display:flex;flex-direction:column;align-items:center;gap:10px}
.sb-ph{height:100%;min-height:260px;border-radius:8px;border:1px dashed var(--fb);background:var(--frame);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--soft);text-align:center;padding:20px;font-size:13px}

/* review */
.sb-foot{margin-top:22px;padding-top:18px;border-top:1px solid var(--hair)}
.sb-foot .rl{font-size:11px;letter-spacing:1px;color:var(--soft);font-weight:700;margin-bottom:10px}
.sb-segbtn{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;padding:8px 14px;border-radius:99px;cursor:pointer;border:1.5px solid var(--hair);background:#fff;color:var(--soft)}
.sb-segbtn.ok{border-color:var(--green);background:var(--green);color:#fff}
.sb-segbtn.ch{border-color:var(--amber);background:var(--amber);color:#fff}
.sb-note{width:100%;min-height:60px;border-radius:10px;border:1px solid var(--hair);padding:10px;font-size:13px;color:var(--ink);outline:none;background:#fff;resize:vertical;margin-top:10px}
.sb-chips{display:flex;gap:24px;flex-wrap:wrap;font-size:12.5px}
.sb-chip .st{padding:2px 10px;border-radius:99px;font-weight:600}
.sb-chip .none{color:var(--soft);background:#eef1f5}
.sb-chip .approved{color:var(--green);background:var(--greenbg)}
.sb-chip .changes{color:var(--amber);background:var(--amberbg)}
.sb-chip .nt{margin-top:4px;color:var(--ink);max-width:340px}

.sb-addcard{display:block;margin:0 auto;font-size:14px;font-weight:600;padding:12px 24px;border-radius:99px;border:1.5px dashed var(--blue);background:#fff;color:var(--blued);cursor:pointer}

/* grid ig */
.sb-gridwrap{background:var(--slide);border-radius:16px;box-shadow:0 8px 26px rgba(15,36,64,.10);border:1px solid #eef1f6;padding:34px 30px;display:flex;gap:40px;flex-wrap:wrap;justify-content:center}
.sb-grid{width:420px;max-width:100%;display:grid;grid-template-columns:repeat(3,1fr);gap:5px}
.sb-cell{aspect-ratio:1/1;background:var(--frame);border-radius:4px;overflow:hidden;position:relative;display:flex;align-items:center;justify-content:center;font-size:10px;color:var(--soft);text-align:center;padding:5px}
.sb-cell img,.sb-cell video{width:100%;height:100%;object-fit:cover}
.sb-phone{width:250px;border:10px solid #16243c;border-radius:34px;overflow:hidden;background:#fff;height:520px;box-shadow:0 14px 34px rgba(15,36,64,.22)}
.sb-phone .bar{padding:10px 12px;display:flex;justify-content:space-between;font-size:11px;color:var(--ink)}
.sb-phone .g{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;padding:0 2px}

/* footer */
.sb-footer{background:var(--grad-navy);padding:16px 26px;display:flex;align-items:center;justify-content:space-between}
.sb-footer .r{font-size:13px;color:rgba(255,255,255,.72)} .sb-footer .r b{color:#fff}

/* modal */
.sb-modal{position:fixed;inset:0;background:rgba(15,36,64,.55);z-index:50;display:flex;align-items:center;justify-content:center;padding:20px}
.sb-modal-box{background:#fff;border-radius:18px;padding:26px;width:460px;max-width:100%;box-shadow:0 24px 70px rgba(6,20,40,.35)}
.sb-modal-box h3{margin:0 0 6px;font-size:17px;font-weight:700;display:flex;align-items:center;gap:8px}
.sb-modal-box p{font-size:13px;color:var(--soft);margin-top:0}
.sb-field{background:var(--surface-2,#f4f6f9);border-radius:12px;padding:12px 14px;margin-bottom:12px}
.sb-field .k{font-size:11px;color:var(--soft);letter-spacing:1px}
.sb-field .v{font-size:14px;color:var(--blued);word-break:break-all}
.sb-modal-btn{margin-top:8px;width:100%;padding:12px;border-radius:12px;border:none;background:var(--blue);color:#fff;font-size:14px;font-weight:600;cursor:pointer}