/* ============================================================
   CREATE A TRIP — organizer portal (design_handoff_create_trip)
   Shared styles for: start chooser · setup wizard (1c) · builder
   (3a/1d) · payment plan (1e) · publish moment (5a) · sidebar
   draft cards (2a). Tokens are the handoff's: primary #8833FF
   (hover #7A22F0), tint #F3EBFF, shell #171030, text #212735/
   #565656/#7A7E84/#9BA0A6, borders #D1D1D1/#F0F0F2, success
   #17AE25, warning #C48A0A, error #B00B20, radii 9–18px.
   Additive file — never loaded by the existing portal screens.
   ============================================================ */

/* ---- scrollbars (Ouj 2026-07-22: "scroll seems so old school") ----
   Thin rounded brand pill riding a transparent track; a hair wider + brighter
   on hover. The dark sidebar gets a quieter white-ghost thumb. Firefox via
   scrollbar-width/color; WebKit via ::-webkit-scrollbar. Loaded on every
   portal + create page (this file ships with both layouts). */
html{scrollbar-width:thin;scrollbar-color:rgba(136,51,255,.45) transparent}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(136,51,255,.40);border-radius:999px;border:3px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background:rgba(136,51,255,.70);border:2px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-corner{background:transparent}
.op-side{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.22) transparent}
.op-side::-webkit-scrollbar{width:8px}
.op-side::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:999px;border:2px solid transparent;background-clip:padding-box}
.op-side:hover::-webkit-scrollbar-thumb{background:rgba(255,255,255,.34)}
.opc-body{scrollbar-width:thin;scrollbar-color:rgba(136,51,255,.35) transparent}
.opc-body::-webkit-scrollbar{width:8px}
.opc-body::-webkit-scrollbar-thumb{background:rgba(136,51,255,.30);border-radius:999px;border:2px solid transparent;background-clip:padding-box}

/* ---------- sidebar additions (loaded via organizer-portal pages) ----------
   ALIGNMENT FACTS (organizer-portal.css, measured 2026-07-22): .op-side is a
   240px column padded 20px; trip rows span its FULL width (no side margin)
   with 12px internal inset, 38px r9 thumbs, gap 11, 13px/600 names, 11px
   caps. Everything we add must share those exact edges — no extra margins. */
/* 2a mock button — applied WITH Ouj's explicit choice (2026-07-22 ask):
   full column width, 40px, r10, 18px above, 13px/600. */
/* flex-shrink:0 (2026-07-27): .op-side is a height-bound flex column — unpinned children squash to min-content when the sidebar overflows (button was 15px tall). */
.op-side-create{display:flex;flex-shrink:0;align-items:center;justify-content:center;gap:7px;margin:18px 0 0;height:40px;background:#8833FF;color:#fff;border-radius:10px;font-size:13px;font-weight:600;text-decoration:none;transition:background .15s}
.op-side-create:hover{background:#7A22F0}
.op-side-draft{margin:6px 14px;background:rgba(136,51,255,.14);border:1px solid rgba(136,51,255,.35);border-radius:12px;padding:10px 12px}
.op-side-draft-name{font-size:12.5px;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.op-side-draft-bar{height:4px;border-radius:999px;background:rgba(255,255,255,.15);margin-top:7px;overflow:hidden}
.op-side-draft-bar span{display:block;height:100%;border-radius:999px;background:#A56BFA;transition:width .3s}
.op-side-draft-cap{font-size:10.5px;color:rgba(255,255,255,.5);margin-top:6px}
.op-side-draft-actions{display:flex;gap:12px;margin-top:7px}
.op-side-draft-actions a{color:#C9A5FF;font-size:12px;font-weight:700;text-decoration:none}
.op-side-draft-actions a:hover{text-decoration:underline}
.op-side-draft-actions button{background:none;border:none;padding:0;color:rgba(255,255,255,.45);font-size:12px;font-weight:600;cursor:pointer}
.op-side-draft-actions button:hover{color:#fff}

/* Sidebar draft card (design_handoff_sidebar_draft_item), aligned to THIS
   portal's row geometry: full column width like every trip row, 12px inner
   inset so the thumbnail sits flush with row thumbnails, 38px thumb / gap 11
   / 13px name / 11px cap — the same scale as the rows around it. The mock's
   #5B3FD4 card, white Resume pill, outlined Discard, #D7CDF3 captions. */
.op-sdraft{background:#5B3FD4;border-radius:12px;padding:9px 12px 10px;margin:4px 0 0}
.op-side-label + .op-sdraft{margin-top:12px}
.op-sdraft-top{display:flex;align-items:center;gap:11px}
.op-sdraft-thumb{width:38px;height:38px;border-radius:9px;background:linear-gradient(135deg,#8833FF,#A56BFA);flex-shrink:0;object-fit:cover;display:block}
.op-sdraft-name{font-size:13px;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.op-sdraft-cap{font-size:11px;color:#D7CDF3;margin-top:1px}
.op-sdraft-actions{display:flex;gap:6px;margin-top:9px}
.op-sdraft-resume{flex:1;background:#fff;color:#5B3FD4;border-radius:8px;height:30px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;text-decoration:none}
.op-sdraft-resume:hover{background:#F3EBFF}
.op-sdraft-discard{border:1px solid rgba(255,255,255,.35);background:transparent;color:#fff;border-radius:8px;height:30px;display:flex;align-items:center;padding:0 11px;font-size:12px;font-weight:600;cursor:pointer;box-sizing:border-box;font-family:inherit}
.op-sdraft-discard:hover{background:rgba(255,255,255,.1)}
.op-sdraft-auto{font-size:10px;color:#D7CDF3;margin-top:7px}

/* P1.1 (chief-designer review 2026-07-22): the draft card renders inside the
   WHITE welcome card on the zero-live-trips screen, but .op-side-draft was
   styled only for the dark sidebar — white-on-white text. Light-context
   variant, scoped so the sidebar keeps its dark styling untouched. */
.op-auth-card .op-side-draft{background:#F3EBFF;border-color:#E4D9F7;text-align:left}
.op-auth-card .op-side-draft-name{color:#212735}
.op-auth-card .op-side-draft-bar{background:#E4D9F7}
.op-auth-card .op-side-draft-bar span{background:#8833FF}
.op-auth-card .op-side-draft-cap{color:#7A7E84}
.op-auth-card .op-side-draft-actions a{color:#8833FF}
.op-auth-card .op-side-draft-actions button{color:#B00B20}
.op-auth-card .op-side-draft-actions button:hover{color:#8E1B29}

/* ------------------------------ page shell ------------------------------ */
.ct-page{min-height:100vh;background:#171030;padding:28px 20px 60px;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;font-family:'SF Pro Text',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
.ct-card{width:100%;max-width:1080px;background:#171030;border-radius:14px;padding:0;box-sizing:border-box}
.ct-card-wide{max-width:1180px}
.ct-head{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}
.ct-kicker{font-size:11px;font-weight:700;color:rgba(255,255,255,.4);text-transform:uppercase;letter-spacing:1.2px}
.ct-title{font-family:'SF Pro Display','SF Pro Text',sans-serif;font-weight:700;font-size:21px;color:#fff;margin-top:4px}
.ct-org{display:flex;align-items:center;gap:9px}
.ct-org-av{width:32px;height:32px;border-radius:50%;background:#F3EBFF;color:#8833FF;font-weight:700;font-size:11.5px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.ct-org-av img{width:100%;height:100%;object-fit:cover}
.ct-org-name{font-size:13px;font-weight:600;color:rgba(255,255,255,.75)}
.ct-saved{font-size:12px;color:rgba(255,255,255,.45)}
.ct-saved.err{color:#FF8FA0}
.ct-exit{border:1px solid rgba(255,255,255,.25);border-radius:8px;height:34px;display:inline-flex;align-items:center;padding:0 14px;font-size:12.5px;font-weight:600;color:#fff;cursor:pointer;background:transparent;text-decoration:none}
.ct-exit:hover{background:rgba(255,255,255,.08)}

/* ------------------------------ step bars ------------------------------ */
.ct-steps{display:flex;gap:8px;margin-top:16px}
.ct-step{flex:1;cursor:pointer;background:none;border:none;padding:0;text-align:left;font-family:inherit}
.ct-step-bar{height:4px;border-radius:999px;background:rgba(255,255,255,.18);transition:background .25s}
.ct-step.done .ct-step-bar,.ct-step.active .ct-step-bar{background:#8833FF}
.ct-step-t{font-size:11.5px;font-weight:600;color:rgba(255,255,255,.4);margin-top:7px}
.ct-step.active .ct-step-t{color:#fff}
.ct-step.done .ct-step-t{color:rgba(255,255,255,.7)}

/* ------------------------------ sheets ------------------------------ */
.ct-sheet{background:#F6F5F9;border-radius:16px;margin-top:16px;padding:20px}
.ct-panel{background:#fff;border-radius:16px;padding:22px 24px;animation:ctIn .25s ease}
.ct-step-kicker{font-size:11px;font-weight:700;color:#7A7E84;text-transform:uppercase;letter-spacing:1px}
.ct-cols{display:flex;gap:24px;margin-top:14px;flex-wrap:wrap}
.ct-col{flex:1;min-width:300px}
.ct-col-lg{flex:1.2;min-width:320px}
.ct-label{font-size:12.5px;font-weight:600;color:#565656}
.ct-label .mut{color:#9BA0A6;font-weight:500}
.ct-in{width:100%;box-sizing:border-box;height:44px;border:1px solid #D1D1D1;border-radius:9px;padding:0 13px;font-size:14px;font-family:inherit;outline-color:#8833FF;margin-top:6px;background:#fff;color:#212735}
.ct-in.err{border-color:#B00B20}
.ct-error{font-size:12px;color:#B00B20;font-weight:600;margin-top:6px;animation:ctIn .18s ease}
.ct-help{font-size:11.5px;color:#7A7E84;line-height:1.5;margin-top:10px}
.ct-note{display:flex;align-items:flex-start;gap:8px;background:#F3EBFF;border-radius:10px;padding:10px 13px;margin-top:10px;font-size:12px;color:#565656;line-height:1.5}
.ct-note b{color:#212735}
.ct-note .ic{color:#8833FF;font-weight:700;font-size:13px}
textarea.ct-in{height:auto;padding:11px 13px;resize:vertical;line-height:1.55}

/* ------------------------------ chips ------------------------------ */
.ct-chipbox{display:flex;flex-wrap:wrap;gap:7px;border:1px solid #D1D1D1;border-radius:9px;padding:8px 10px;margin-top:6px;min-height:44px;box-sizing:border-box;align-items:center;background:#fff}
.ct-chipbox.err{border-color:#B00B20}
.ct-chipbox input{border:none;outline:none;flex:1;min-width:170px;font-size:13.5px;font-family:inherit;height:28px;background:transparent;color:#212735}
.ct-chip{display:flex;align-items:center;gap:7px;background:#F3EBFF;color:#8833FF;border-radius:999px;padding:6px 8px 6px 12px;font-size:12.5px;font-weight:600;animation:ctPop .18s ease}
.ct-chip .x{cursor:pointer;color:#A56BFA;font-size:13px;line-height:1;padding:2px;background:none;border:none}
.ct-chip .x:hover{color:#8833FF}
.ct-sugg-row{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:8px}
.ct-sugg-cap{font-size:11.5px;color:#9BA0A6;font-weight:600}
.ct-sugg{border:1px solid #E4D9F7;background:#FBF9FF;color:#8833FF;border-radius:999px;padding:3px 11px;font-size:11.5px;font-weight:600;cursor:pointer;font-family:inherit}
.ct-sugg:hover{background:#F3EBFF}
.ct-pick{border:1.5px solid #E0E1E3;background:#fff;color:#565656;border-radius:999px;padding:8px 15px;font-size:13px;font-weight:600;cursor:pointer;transition:all .15s;font-family:inherit}
.ct-pick.on{border-color:#8833FF;background:#F3EBFF;color:#8833FF}
.ct-pickrow{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}

/* ------------------------------ live app preview (1c) ------------------------------ */
.ct-live-cap{display:flex;align-items:center;gap:8px;margin-top:18px}
.ct-live-dot{width:7px;height:7px;border-radius:50%;background:#17AE25;animation:ctPulse 1.8s ease infinite}
.ct-live-t{font-size:10.5px;font-weight:700;color:#7A7E84;text-transform:uppercase;letter-spacing:1px}
.ct-appcard{background:#fff;border:1px solid #EDEAF5;border-radius:16px;overflow:hidden;margin-top:8px;box-shadow:0 8px 24px rgba(23,16,48,.10);max-width:300px}
.ct-appcard-hero{position:relative;height:132px;background:linear-gradient(140deg,#FFB25E 0%,#E85D75 46%,#8833FF 100%);background-size:cover;background-position:center}
.ct-appcard-date{position:absolute;top:10px;left:10px;background:rgba(255,255,255,.85);border-radius:999px;padding:3px 10px;font-size:10.5px;font-weight:700;color:#2A1E52}
.ct-appcard-name{position:absolute;left:12px;right:12px;bottom:10px;font-family:'SF Pro Display',sans-serif;font-weight:700;font-size:17px;color:#fff;text-shadow:0 2px 10px rgba(42,18,88,.45);line-height:1.2;overflow-wrap:anywhere}
.ct-appcard-body{padding:10px 13px 12px}
.ct-appcard-dest{font-size:11.5px;font-weight:600;color:#565656}
.ct-appcard-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}
.ct-appcard-tag{background:#F3EBFF;color:#8833FF;border-radius:999px;padding:3px 9px;font-size:10px;font-weight:700;animation:ctPop .2s ease}
.ct-appcard-host{display:flex;align-items:center;gap:6px;margin-top:8px;font-size:10.5px;font-weight:600;color:#7A7E84}

/* ------------------------------ toggles + radio cards (1c step 3) ------------------------------ */
.ct-togglecard{display:flex;justify-content:space-between;align-items:flex-start;border:1px solid #F0F0F2;border-radius:12px;padding:14px 16px}
.ct-togglecard h4{font-size:13.5px;font-weight:600;color:#212735;margin:0}
.ct-togglecard p{font-size:12px;color:#7A7E84;line-height:1.5;margin:3px 14px 0 0}
.ct-tog{width:42px;height:25px;border-radius:999px;background:#D8D9DD;position:relative;cursor:pointer;transition:background .2s;flex-shrink:0;border:none}
.ct-tog.on{background:#8833FF}
.ct-tog i{position:absolute;top:2.5px;left:2.5px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:left .2s}
.ct-tog.on i{left:19.5px}
.ct-radio{display:flex;align-items:flex-start;gap:11px;border:1.5px solid #E0E1E3;background:#fff;border-radius:12px;padding:12px 14px;cursor:pointer;transition:all .15s}
.ct-radio.on{border-color:#8833FF;background:#FBF9FF}
.ct-radio-dot{width:17px;height:17px;border-radius:50%;border:2px solid #C7C9CD;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:1px}
.ct-radio.on .ct-radio-dot{border-color:#8833FF}
.ct-radio-dot i{width:8px;height:8px;border-radius:50%;background:transparent}
.ct-radio.on .ct-radio-dot i{background:#8833FF}
.ct-radio h4{font-size:13.5px;font-weight:600;color:#212735;margin:0}
.ct-radio p{font-size:12px;color:#7A7E84;line-height:1.45;margin:2px 0 0}

/* ------------------------------ nav + buttons ------------------------------ */
.ct-nav{display:flex;justify-content:space-between;align-items:center;margin-top:16px}
.ct-btn{background:#8833FF;color:#fff;border-radius:10px;height:44px;display:inline-flex;align-items:center;padding:0 22px;font-size:14px;font-weight:600;cursor:pointer;border:none;font-family:inherit;text-decoration:none}
.ct-btn:hover{background:#7A22F0}
.ct-btn:disabled{background:#C9B3EC;cursor:not-allowed}
.ct-btn2{border:1px solid #E0E1E3;border-radius:10px;height:44px;display:inline-flex;align-items:center;padding:0 18px;font-size:14px;font-weight:600;color:#212735;cursor:pointer;background:#fff;box-sizing:border-box;font-family:inherit;text-decoration:none}
.ct-btn2:hover{background:#F6F6F7}
.ct-nav-hint{font-size:12px;color:#9BA0A6}

/* ------------------------------ success panel ------------------------------ */
.ct-done{background:#fff;border-radius:16px;padding:44px;display:flex;flex-direction:column;align-items:center;gap:12px;animation:ctPop .3s cubic-bezier(.32,.72,0,1)}
.ct-done-check{width:56px;height:56px;border-radius:50%;background:#EAF8EC;color:#17AE25;font-size:24px;font-weight:700;display:flex;align-items:center;justify-content:center}
.ct-done h2{font-family:'SF Pro Display',sans-serif;font-weight:700;font-size:22px;color:#212735;margin:0}
.ct-done p{font-size:13.5px;color:#565656;text-align:center;line-height:1.55;max-width:480px;margin:0}

/* ------------------------------ image drops (1c step 2) ------------------------------ */
.ct-drop{border:1.5px dashed #C9B3EC;border-radius:12px;background:#FBF9FF;display:flex;align-items:center;justify-content:center;text-align:center;color:#8833FF;font-size:12px;font-weight:600;cursor:pointer;overflow:hidden;position:relative;padding:8px;box-sizing:border-box}
.ct-drop:hover{background:#F3EBFF}
.ct-drop.filled{border-style:solid;border-color:#EDEAF5;padding:0}
.ct-drop img{width:100%;height:100%;object-fit:cover;display:block}
.ct-drop input{position:absolute;inset:0;opacity:0;cursor:pointer}
.ct-drop.busy{opacity:.6;pointer-events:none}

/* ------------------------------ chooser (6a) ------------------------------ */
.ct-choices{display:flex;gap:14px;margin-top:16px;flex-wrap:wrap}
.ct-choice{flex:1;min-width:240px;background:#fff;border:1.5px solid #F0F0F2;border-radius:16px;padding:20px;cursor:pointer;transition:all .15s;text-align:left;font-family:inherit}
.ct-choice:hover{border-color:#8833FF;box-shadow:0 8px 24px rgba(136,51,255,.12)}
.ct-choice .ic{width:40px;height:40px;border-radius:12px;background:#F3EBFF;color:#8833FF;font-size:18px;display:flex;align-items:center;justify-content:center}
.ct-choice h3{font-size:15px;font-weight:700;color:#212735;margin:12px 0 0}
.ct-choice p{font-size:12.5px;color:#7A7E84;line-height:1.5;margin:5px 0 0}
.ct-choice.disabled{opacity:.45;cursor:default}
.ct-choice.disabled:hover{border-color:#F0F0F2;box-shadow:none}
.ct-dup-list{margin-top:10px;display:none;flex-direction:column;gap:8px}
.ct-dup-list.open{display:flex}
.ct-dup{display:flex;align-items:center;gap:10px;border:1px solid #F0F0F2;border-radius:10px;padding:8px 10px;cursor:pointer;background:#fff;font-family:inherit;text-align:left;width:100%}
.ct-dup:hover{border-color:#8833FF}
.ct-dup img{width:38px;height:38px;border-radius:8px;object-fit:cover;background:#F3EBFF}
.ct-dup b{font-size:13px;color:#212735;display:block}
.ct-dup span{font-size:11.5px;color:#9BA0A6}

/* ------------------------------ builder (3a/1d) ------------------------------ */
.ct-grid{display:flex;gap:18px;margin-top:16px;align-items:flex-start;flex-wrap:wrap}
/* P2.2 (chief-designer): the publish checklist LEADS from a fixed 280px
   left rail — it frames everything else as steps toward publish. */
.ct-main{flex:1;min-width:340px;display:flex;flex-direction:column;gap:14px}
.ct-rail{flex:0 0 280px;min-width:280px;display:flex;flex-direction:column;gap:14px}
.ct-bcard{background:#fff;border-radius:16px;padding:18px 20px}
.ct-bcard h3{font-size:14px;font-weight:700;color:#212735;margin:0}
.ct-bcard .sub{font-size:12px;color:#7A7E84;line-height:1.5;margin-top:3px}
.ct-check{display:flex;align-items:center;gap:10px;padding:8px 0}
.ct-check-ring{width:22px;height:22px;border-radius:50%;border:2px solid #E0E1E3;display:flex;align-items:center;justify-content:center;font-size:12px;color:#fff;flex-shrink:0;box-sizing:border-box}
.ct-check.done .ct-check-ring{background:#17AE25;border-color:#17AE25}
.ct-check.blocked .ct-check-ring{border-color:#B00B20}
.ct-check-t{font-size:13px;font-weight:600;color:#212735;flex:1}
.ct-check .opt{font-size:11px;color:#9BA0A6;font-weight:600}
.ct-check a{font-size:12px;font-weight:700;color:#8833FF;text-decoration:none}
.ct-check a:hover{text-decoration:underline}
.ct-blockbanner{background:#FDEEF0;border:1px solid #F5C6CD;border-radius:12px;padding:12px 14px;font-size:12.5px;color:#B00B20;font-weight:600;line-height:1.5;display:none;animation:ctIn .2s ease}
.ct-blockbanner.show{display:block}
.ct-pkg{border:1px solid #F0F0F2;border-radius:12px;padding:12px 14px;display:flex;justify-content:space-between;align-items:center;gap:10px}
.ct-pkg b{font-size:13.5px;color:#212735}
.ct-pkg .amt{font-size:13px;font-weight:700;color:#8833FF}
.ct-pkg .cap{font-size:11.5px;color:#9BA0A6;margin-top:2px}
.ct-empty{border:1.5px dashed #E0E1E3;border-radius:12px;padding:22px;text-align:center;font-size:12.5px;color:#7A7E84;line-height:1.6}
.ct-act{display:flex;gap:10px;align-items:flex-start;padding:9px 0;border-bottom:1px solid #F6F5F9}
.ct-act:last-child{border-bottom:none}
.ct-act .day{background:#F3EBFF;color:#8833FF;border-radius:8px;padding:4px 8px;font-size:11px;font-weight:700;white-space:nowrap}
.ct-act b{font-size:13px;color:#212735;display:block}
.ct-act span{font-size:11.5px;color:#9BA0A6}
.ct-act span.tbd{color:#C48A0A}

/* ------------------------------ payment plan (1e) ------------------------------ */
.ct-seg{display:flex;background:#EFEDF4;border-radius:10px;padding:3px;margin-top:8px}
.ct-seg button{flex:1;border:none;background:transparent;border-radius:8px;height:38px;font-size:13px;font-weight:600;color:#565656;cursor:pointer;font-family:inherit;transition:all .15s}
.ct-seg button.on{background:#fff;color:#8833FF;box-shadow:0 1px 4px rgba(23,16,48,.12)}
.ct-money{position:relative;margin-top:6px}
/* Review 2026-07-22 (Ouj): number sat oddly next to the $ — center the symbol
   on the input's own height and close the gap so it reads "$20", not "$  20". */
.ct-money::before{content:'$';position:absolute;left:13px;top:0;height:44px;display:flex;align-items:center;color:#7A7E84;font-size:14px;pointer-events:none}
.ct-money input{padding-left:25px;margin-top:0}
.ct-quickchips{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.ct-quickchip{border:1px solid #E4D9F7;background:#FBF9FF;color:#8833FF;border-radius:999px;padding:4px 12px;font-size:11.5px;font-weight:700;cursor:pointer;font-family:inherit}
.ct-quickchip:hover{background:#F3EBFF}
.ct-quickchip.on{background:#8833FF;color:#fff;border-color:#8833FF}
.ct-computed{display:flex;align-items:flex-start;gap:8px;background:#F3EBFF;border-radius:10px;padding:10px 13px;margin-top:12px;font-size:12px;color:#565656;line-height:1.5}
.ct-computed b{color:#8833FF}
.ct-sched{background:#fff;border:1px solid #EDEAF5;border-radius:16px;padding:16px 18px;box-shadow:0 8px 24px rgba(23,16,48,.08)}
.ct-sched-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid #F6F5F9}
.ct-sched-row:last-child{border-bottom:none}
.ct-sched-n{width:22px;height:22px;border-radius:50%;background:#F3EBFF;color:#8833FF;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ct-sched-t{flex:1;min-width:0}
.ct-sched-t b{font-size:13px;color:#212735;display:block}
.ct-sched-t span{font-size:11px;color:#9BA0A6}
.ct-sched-t span.warn{color:#C48A0A;font-weight:600}
.ct-sched-amt{font-size:13px;font-weight:700;color:#212735;white-space:nowrap}
.ct-allin{display:flex;justify-content:space-between;align-items:center;margin-top:10px;padding-top:12px;border-top:1px solid #EDEAF5}
.ct-allin b{font-size:14px;color:#212735}
.ct-allin .ok{background:#EAF8EC;color:#17AE25;border-radius:999px;padding:3px 10px;font-size:11px;font-weight:700}
.ct-warn{background:#FFF7E8;border:1px solid #F2DCA9;border-radius:10px;padding:10px 13px;font-size:12px;color:#C48A0A;font-weight:600;line-height:1.5;margin-top:10px;display:none}
.ct-warn.show{display:block}
/* P2.3: the live price guard is an ERROR, not a caution — mock's red. */
.ct-warn.ct-warn-red{background:#FDF1F2;border-color:#F5D5D9;color:#8E1B29;font-weight:500}
.ct-warn.ct-warn-red b{color:#B00B20}
/* P2.5: visible keyboard focus on both shells. */
.ct-page :focus-visible,.op-side :focus-visible,.jr-page :focus-visible{outline:2px solid #A56BFA;outline-offset:2px;border-radius:6px}

/* ------------------------------ publish moment (5a) ------------------------------ */
.ct-pub{background:#0F0A24;border-radius:14px;padding:52px 26px 44px;position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;text-align:center}
.ct-pub-ring{width:84px;height:84px;position:relative}
.ct-pub-ring svg{transform:rotate(-90deg)}
.ct-pub-ring circle{fill:none;stroke-width:5;stroke-linecap:round}
.ct-pub-ring .bg{stroke:rgba(255,255,255,.12)}
.ct-pub-ring .fg{stroke:#8833FF;stroke-dasharray:245;stroke-dashoffset:245;animation:ctRing .9s cubic-bezier(.32,.72,0,1) forwards}
.ct-pub-check{position:absolute;inset:14px;display:flex;align-items:center;justify-content:center;font-size:26px;color:#fff;background:#8833FF;border-radius:50%;opacity:0;transform:scale(.4);animation:ctBloom .35s cubic-bezier(.32,.72,0,1) .85s forwards}
.ct-pub h1{font-family:'SF Pro Display',sans-serif;font-weight:700;font-size:30px;color:#fff;margin:18px 0 0;opacity:0;transform:translateY(14px);animation:ctRise .4s ease 1.1s forwards}
.ct-pub .sub{font-size:13.5px;color:rgba(255,255,255,.55);margin-top:8px;opacity:0;animation:ctFade .4s ease 1.25s forwards}
.ct-pub-link{margin-top:22px;background:#fff;border-radius:14px;padding:14px 18px;display:flex;align-items:center;gap:12px;max-width:520px;width:100%;box-sizing:border-box;opacity:0;transform:translateY(10px);animation:ctRise .45s ease 1.4s forwards;position:relative;overflow:hidden}
.ct-pub-link::after{content:'';position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(136,51,255,.10),transparent);animation:ctSweep 1s ease 1.9s forwards}
.ct-pub-link{flex-direction:column;align-items:stretch;gap:10px}
.ct-pub-link-kicker{font-size:11px;font-weight:700;color:#7A7E84;text-transform:uppercase;letter-spacing:1px;text-align:left}
.ct-pub-link-row{display:flex;align-items:center;gap:10px}
.ct-pub-link-well{flex:1;background:#F6F5F9;border-radius:10px;padding:0 14px;height:46px;display:flex;align-items:center;min-width:0}
.ct-pub-link-well code{font-size:14px;font-weight:600;color:#565656;font-family:inherit;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ct-pub-link-well code b{color:#8833FF;font-weight:800}
.ct-pub-link-help{font-size:12px;color:#7A7E84;line-height:1.5;text-align:left}
.ct-pub-pkgs{display:flex;flex-direction:column;gap:10px;margin-top:18px;width:100%;max-width:520px}
.ct-pub-pkg{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:12px 16px;text-align:left;opacity:0;transform:translateY(10px);animation:ctRise .4s ease forwards}
.ct-pub-pkg-head{display:flex;justify-content:space-between;align-items:baseline;width:100%;background:none;border:none;padding:0;cursor:pointer;font-family:inherit;text-align:left}
.ct-pub-pkg-cap{font-size:11px;color:rgba(255,255,255,.45);font-weight:600;white-space:nowrap}
.ct-pub-pkg-head[aria-expanded="true"] .ct-pub-pkg-cap{color:#A56BFA}
.ct-pub-pkg-sched{margin-top:6px;animation:ctIn .18s ease}
.ct-pub-pkg b{font-size:13.5px;color:#fff}
.ct-pub-pkg .amt{font-size:12px;color:rgba(255,255,255,.45);font-weight:600}
.ct-pub-pkg .row{display:flex;justify-content:space-between;font-size:11.5px;color:rgba(255,255,255,.55);margin-top:4px}
.ct-pub-ctas{display:flex;gap:10px;margin-top:24px;opacity:0;animation:ctFade .4s ease 2s forwards}
.ct-pub-nudge{font-size:12px;color:rgba(255,255,255,.4);margin-top:14px;opacity:0;animation:ctFade .4s ease 2.2s forwards}
.ct-particle{position:absolute;width:7px;height:7px;border-radius:2px;opacity:0;animation:ctDrift 2.4s ease-out 1.2s forwards}
.ct-pub-toggle-row{display:flex;align-items:center;gap:8px}
.ct-pub-toggle-cap{font-size:11px;color:#7A7E84;font-weight:600}

/* --------------- smart date picker (Ouj 2026-07-22) --------------- */
.ct-dateanchor{position:relative}
.ct-dateinput{cursor:pointer;caret-color:transparent}
.ct-dateinput::placeholder{color:#9BA0A6}
.ct-cal{position:absolute;top:calc(100% + 6px);left:0;z-index:60;background:#fff;border:1px solid #EDEAF5;border-radius:14px;box-shadow:0 14px 40px rgba(23,16,48,.18);padding:14px;animation:ctIn .16s ease;min-width:280px}
.ct-cal-months{display:flex;gap:18px}
.ct-cal-month{width:252px}
.ct-cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.ct-cal-title{font-size:13px;font-weight:700;color:#212735;text-align:center;flex:1}
.ct-cal-nav{width:28px;height:28px;border-radius:8px;border:none;background:#F6F5F9;color:#565656;font-size:13px;cursor:pointer;font-family:inherit}
.ct-cal-nav:hover{background:#F3EBFF;color:#8833FF}
.ct-cal-nav[disabled]{opacity:.3;cursor:default}
.ct-cal-dow{display:grid;grid-template-columns:repeat(7,1fr);font-size:10px;font-weight:700;color:#9BA0A6;text-transform:uppercase;text-align:center;margin-bottom:2px}
.ct-cal-grid{display:grid;grid-template-columns:repeat(7,1fr)}
.ct-cal-day{height:34px;border:none;background:none;font-size:12.5px;font-weight:600;color:#212735;cursor:pointer;border-radius:9px;font-family:inherit;position:relative}
.ct-cal-day:hover:not([disabled]){background:#F3EBFF;color:#8833FF}
.ct-cal-day[disabled]{color:#D1D1D5;cursor:default}
.ct-cal-day.today::after{content:'';position:absolute;bottom:4px;left:50%;transform:translateX(-50%);width:4px;height:4px;border-radius:50%;background:#8833FF}
.ct-cal-day.inrange{background:#F3EBFF;border-radius:0;color:#5B3FD4}
.ct-cal-day.edge{background:#8833FF;color:#fff;border-radius:9px}
.ct-cal-day.edge.start{border-top-right-radius:0;border-bottom-right-radius:0}
.ct-cal-day.edge.end{border-top-left-radius:0;border-bottom-left-radius:0}
.ct-cal-day.edge.only{border-radius:9px}
.ct-cal-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;padding-top:10px;border-top:1px solid #F0F0F2}
.ct-cal-sum{font-size:12px;font-weight:600;color:#565656}
.ct-cal-sum b{color:#8833FF}
.ct-cal-done{background:#8833FF;color:#fff;border:none;border-radius:8px;height:32px;padding:0 16px;font-size:12.5px;font-weight:700;cursor:pointer;font-family:inherit}
.ct-cal-done:hover{background:#7A22F0}
.ct-cal-done[disabled]{background:#C9B3EC;cursor:default}
.ct-cal-clear{background:none;border:none;color:#9BA0A6;font-size:12px;font-weight:600;cursor:pointer;font-family:inherit}
.ct-cal-clear:hover{color:#565656}
@media (max-width: 720px){
  .ct-cal{left:50%;transform:translateX(-50%);max-width:calc(100vw - 24px)}
  .ct-cal-months{flex-direction:column;gap:10px}
  .ct-cal-month.second{display:none}
}

/* ------------------------------ toast ------------------------------ */
.ct-toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%) translateY(80px);background:#212735;color:#fff;border-radius:12px;padding:12px 20px;font-size:13px;font-weight:600;transition:transform .3s;z-index:99}
.ct-toast.show{transform:translateX(-50%) translateY(0)}

/* ------------------------------ animation ------------------------------ */
@keyframes ctIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes ctPop{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}
@keyframes ctPulse{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes ctRing{to{stroke-dashoffset:0}}
@keyframes ctBloom{to{opacity:1;transform:scale(1)}}
@keyframes ctRise{to{opacity:1;transform:none}}
@keyframes ctFade{to{opacity:1}}
@keyframes ctSweep{from{left:-60%}to{left:120%}}
@keyframes ctDrift{0%{opacity:0;transform:translateY(0)}15%{opacity:.9}100%{opacity:0;transform:translateY(-120px) rotate(120deg)}}
@media (prefers-reduced-motion: reduce){
  .ct-pub-ring .fg,.ct-pub-check,.ct-pub h1,.ct-pub .sub,.ct-pub-link,.ct-pub-pkg,.ct-pub-ctas,.ct-pub-nudge{animation:none!important;opacity:1!important;transform:none!important;stroke-dashoffset:0!important}
  .ct-particle{display:none}
  *{transition:none!important}
}
@media (max-width: 760px){
  .ct-page{padding:14px 10px 40px}
  .ct-cols,.ct-grid{flex-direction:column}
  /* Review 2026-07-22 (Dani): columns kept desktop min-widths and overflowed
     phones; sub-16px inputs trigger iOS focus-zoom; the save badge scrolled
     out of view exactly when someone is typing. */
  .ct-col,.ct-col-lg{min-width:0}
  .ct-panel{padding:16px}
  .ct-in,.ct-chipbox input{font-size:16px}
  #ct-wizard .ct-saved{position:fixed;left:12px;bottom:12px;z-index:98;background:#171030;border:1px solid rgba(255,255,255,.25);border-radius:999px;padding:7px 14px}
}

/* ============================================================
   JOYRIDE (design handoff 2026-07-23) — the fast create flow.
   Ink shell #171030, one beat card left, live trip card right.
   ============================================================ */
.jr-body{margin:0;background:#171030;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',sans-serif}
.jr-page{min-height:100vh;display:flex;flex-direction:column;box-sizing:border-box}
.jr-top{display:flex;justify-content:space-between;align-items:center;padding:20px 28px 0;flex-shrink:0;gap:14px;flex-wrap:wrap}
.jr-top-left{display:flex;align-items:center;gap:12px}
.jr-kicker{font-size:11px;font-weight:700;color:rgba(255,255,255,.4);text-transform:uppercase;letter-spacing:1.2px}
.jr-dots{display:flex;gap:5px}
.jr-dot{width:14px;height:5px;border-radius:999px;border:none;padding:0;background:rgba(255,255,255,.18);transition:all .3s;cursor:default}
.jr-dot.cur{width:26px;background:#8833FF}
.jr-dot.done{background:#8833FF;opacity:.55;cursor:pointer}
.jr-steplabel{font-size:11.5px;color:rgba(255,255,255,.5);font-weight:600}
.jr-top-right{display:flex;align-items:center;gap:14px}
.jr-orgname{font-size:12.5px;font-weight:600;color:rgba(255,255,255,.75)}
.jr-saved{font-size:11.5px;color:rgba(255,255,255,.45)}
.jr-saved.err{color:#FFB1BC}
.jr-exit{border:1px solid rgba(255,255,255,.25);border-radius:8px;height:32px;display:inline-flex;align-items:center;padding:0 13px;font-size:12px;font-weight:600;color:#fff;cursor:pointer;text-decoration:none}
.jr-exit:hover{background:rgba(255,255,255,.08)}
.jr-cols{flex:1;display:flex;gap:24px;padding:22px 28px 26px;min-height:0;box-sizing:border-box;max-width:1280px;width:100%;margin:0 auto}
.jr-beatcard{flex:1;background:#fff;border-radius:18px;padding:30px 34px;box-sizing:border-box;display:flex;flex-direction:column;min-width:0;position:relative}
.jr-beat{display:flex;flex-direction:column;flex:1;min-height:0;animation:ctIn .35s cubic-bezier(.32,.72,0,1)}
@keyframes ctIn{0%{opacity:0;transform:translateY(14px)}100%{opacity:1;transform:translateY(0)}}
.jr-eyebrow{font-size:12px;font-weight:700;color:#8833FF;text-transform:uppercase;letter-spacing:1px}
.jr-h1{font-weight:700;font-size:30px;color:#212735;line-height:1.35;margin-top:14px}
.jr-h2{font-weight:700;font-size:26px;color:#212735;margin-top:12px}
.jr-h2row{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.jr-destinput{border:none;border-bottom:3px solid #8833FF;outline:none;font:inherit;color:#8833FF;width:340px;max-width:100%;padding:2px 0;background:transparent}
.jr-destinput::placeholder{color:#C4B8DE}
.jr-chiprow{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.jr-chiplabel{font-size:11.5px;color:#9BA0A6;font-weight:600}
.jr-suggchip{border:1px solid #E4D9F7;background:#FBF9FF;color:#8833FF;border-radius:999px;padding:6px 14px;font-size:12.5px;font-weight:600;cursor:pointer;font-family:inherit;transition:all .15s}
.jr-suggchip:hover{background:#F3EBFF}
.jr-suggchip.on{background:#8833FF;border-color:#8833FF;color:#fff}
.jr-suggchip-gray{border-color:#E0E1E3;background:#fff;color:#565656}
.jr-suggchip-gray.on{background:#565656;border-color:#565656;color:#fff}
.jr-typechip{border:1.5px dashed #D9CBF5;border-radius:999px;padding:5px 13px;font-size:12px;font-weight:600;font-family:inherit;color:#8833FF;outline:none;width:150px;background:#fff;box-sizing:border-box;height:28px}
.jr-typechip-gray{border-color:#E0E1E3;color:#565656}
.jr-hintcard{display:flex;align-items:flex-start;gap:10px;background:#FBF9FF;border:1px solid #EADFFB;border-radius:12px;padding:12px 15px;font-size:12.5px;color:#565656;line-height:1.55}
.jr-hintcard-bottom{margin-top:auto}
.jr-beat .jr-hintcard + .jr-hintcard-bottom{margin-top:12px}
.jr-hint-ic{font-size:15px;flex-shrink:0}
.jr-purple{color:#8833FF}
.jr-ink{color:#212735}
.jr-footnote{font-size:12px;color:#9BA0A6;line-height:1.5}
.jr-footnote-bottom{margin-top:auto}
.jr-vibegrid{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.jr-vibechip{border:1.5px solid #E0E1E3;background:#fff;color:#212735;border-radius:14px;padding:14px 20px;font-size:14.5px;font-weight:600;cursor:pointer;font-family:inherit;transition:all .15s}
.jr-vibechip:hover{border-color:#C9B6EE}
.jr-vibechip:active{transform:scale(.96)}
.jr-vibechip.on{border-color:#8833FF;background:#F3EBFF;color:#8833FF}
.jr-daterange{font-size:14px;font-weight:700;color:#8833FF}
.jr-calhost{position:relative;margin-top:14px}
.jr-calopen{width:100%;border:1.5px dashed #D9CBF5;background:#FBF9FF;border-radius:13px;padding:16px;font-size:14px;font-weight:600;color:#8833FF;cursor:pointer;font-family:inherit;text-align:left}
.jr-calopen:hover{background:#F3EBFF}
.jr-label{font-size:12.5px;font-weight:600;color:#565656}
.jr-opt{font-size:10.5px;font-weight:700;color:#9BA0A6;text-transform:uppercase;letter-spacing:.5px}
.jr-input{width:100%;box-sizing:border-box;height:46px;border:1px solid #D1D1D1;border-radius:10px;padding:0 14px;font-size:15px;font-family:inherit;outline-color:#8833FF;margin-top:6px;font-variant-numeric:tabular-nums}
.jr-input-sm{height:42px;font-size:14px}
.jr-pkgrow{display:flex;gap:14px;margin-top:18px}
.jr-err{background:#FDECEF;border:1px solid #F5C6CE;color:#B00B20;border-radius:10px;padding:10px 13px;font-size:12.5px;line-height:1.5;margin-top:12px}
.jr-moneycard{border:1.5px solid #E0E1E3;background:#fff;border-radius:16px;padding:18px 20px;margin-top:14px;cursor:pointer;transition:all .15s}
.jr-moneycard:hover{border-color:#C9B6EE}
.jr-moneycard.sel{border-color:#8833FF;background:#FBF9FF}
.jr-moneycard-slim{display:flex;align-items:center;gap:10px;padding:15px 20px;margin-top:10px}
.jr-moneycard-top{display:flex;align-items:center;gap:10px}
.jr-moneycard-name{font-size:14.5px;font-weight:700;color:#212735}
.jr-moneycard-sub{font-size:12px;color:#7A7E84;margin-top:2px}
.jr-moneycard-vals{display:flex;gap:22px;margin-top:12px;font-size:13px;color:#565656;flex-wrap:wrap}
.jr-moneycard-vals b{color:#212735}
.jr-moneycard-sched{font-size:12px;color:#7A7E84;line-height:1.5;margin-top:9px}
.jr-filledpill{font-size:11px;font-weight:700;color:#17AE25;background:#EAF8EC;border-radius:999px;padding:4px 10px;margin-left:auto}
.jr-radio{width:19px;height:19px;border-radius:50%;border:2px solid #C9CBD1;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;box-sizing:border-box}
.jr-radio i{width:9px;height:9px;border-radius:50%;background:transparent}
.jr-radio.on{border-color:#8833FF}
.jr-radio.on i{background:#8833FF}
.jr-linkbtn{border:none;background:none;font-size:12.5px;font-weight:600;color:#8833FF;cursor:pointer;font-family:inherit;padding:0}
.jr-linkbtn:hover{text-decoration:underline}
.jr-seg{display:flex;background:#F1F1F4;border-radius:11px;padding:3px;margin-top:14px}
.jr-segbtn{flex:1;height:36px;border:none;border-radius:9px;font-size:13px;font-weight:600;cursor:pointer;background:transparent;color:#565656;font-family:inherit;transition:all .2s}
.jr-segbtn.on{background:#fff;color:#212735;box-shadow:0 1px 4px rgba(23,16,48,.12)}
.jr-tunerow{display:flex;gap:12px;margin-top:14px}
.jr-freqrow{display:flex;gap:7px;margin-top:6px;flex-wrap:wrap}
.jr-freqchip{flex:1;min-width:76px;border:1.5px solid #E0E1E3;background:#fff;color:#565656;border-radius:9px;padding:8px 6px;font-size:12px;font-weight:600;cursor:pointer;text-align:center;font-family:inherit;transition:all .15s}
.jr-freqchip.on{border-color:#8833FF;background:#F3EBFF;color:#8833FF}
.jr-slider{width:100%;margin-top:8px;accent-color:#8833FF}
.jr-sliderlabels{display:flex;justify-content:space-between;font-size:10.5px;color:#9BA0A6;margin-top:2px}
.jr-textarea{width:100%;box-sizing:border-box;border:1px solid #D1D1D1;border-radius:12px;padding:14px 16px;font-size:16px;font-family:inherit;outline-color:#8833FF;margin-top:14px;resize:none;line-height:1.6}
.jr-meterrow{display:flex;align-items:center;gap:10px;margin-top:9px}
.jr-meter{flex:1;height:5px;border-radius:999px;background:#F0F0F2;overflow:hidden}
.jr-meter > div{width:0;height:100%;border-radius:999px;background:#E0E1E3;transition:all .25s}
.jr-meterlabel{font-size:11.5px;font-weight:700;white-space:nowrap}
.jr-nav{display:flex;justify-content:space-between;align-items:center;margin-top:22px;flex-shrink:0}
.jr-nav-right{display:flex;align-items:center;gap:12px;margin-left:auto}
.jr-back{border:none;background:none;font-size:13px;font-weight:600;color:#7A7E84;cursor:pointer;font-family:inherit;padding:0}
.jr-back:hover{color:#212735}
.jr-skip{border:none;background:none;font-size:13px;font-weight:600;color:#9BA0A6;cursor:pointer;font-family:inherit;padding:0}
.jr-skip:hover{color:#565656}
.jr-next{height:48px;padding:0 26px;font-size:15px;box-shadow:0 4px 18px rgba(136,51,255,.35)}
/* right rail */
.jr-rail{width:330px;flex-shrink:0;display:flex;flex-direction:column;box-sizing:border-box;min-height:0}
.jr-rail-live{display:flex;align-items:center;gap:8px;font-size:10.5px;font-weight:700;color:rgba(255,255,255,.55);text-transform:uppercase;letter-spacing:1px;white-space:nowrap}
.jr-pulse{width:7px;height:7px;border-radius:50%;background:#17AE25;animation:jrPulse 1.8s ease infinite;flex-shrink:0}
@keyframes jrPulse{0%,100%{opacity:1}50%{opacity:.35}}
.jr-card{background:#fff;border-radius:18px;overflow:hidden;margin-top:10px;box-shadow:0 14px 44px rgba(0,0,0,.35)}
.jr-card-hero{position:relative;height:150px;background:linear-gradient(140deg,#FFB25E 0%,#E85D75 46%,#8833FF 100%);background-size:cover;background-position:center}
.jr-card-drop{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s}
.jr-card-drop.over{background:rgba(136,51,255,.35);outline:2px dashed #fff;outline-offset:-8px}
.jr-card-drophint{font-size:11px;font-weight:700;color:rgba(255,255,255,.9);text-align:center;line-height:1.5;text-shadow:0 1px 8px rgba(42,18,88,.5);pointer-events:none}
.jr-card-hero.has-photo .jr-card-drophint{display:none}
.jr-card-datebadge{position:absolute;top:12px;left:12px;background:rgba(255,255,255,.88);border-radius:999px;padding:4px 11px;font-size:11px;font-weight:700;color:#2A1E52;pointer-events:none}
.jr-card-name{position:absolute;left:14px;right:14px;bottom:12px;font-weight:700;font-size:20px;color:#fff;text-shadow:0 2px 12px rgba(42,18,88,.55);line-height:1.25;overflow-wrap:anywhere;pointer-events:none}
.jr-card-body{padding:13px 15px 15px}
.jr-card-dest{font-size:12px;font-weight:600;color:#565656}
.jr-card-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.jr-card-tags:empty{margin-top:0}
.jr-card-tag{background:#F3EBFF;color:#8833FF;border-radius:999px;padding:3px 10px;font-size:10.5px;font-weight:700;animation:jrPop .2s ease}
@keyframes jrPop{0%{opacity:0;transform:scale(.88)}100%{opacity:1;transform:scale(1)}}
.jr-card-pkg{border-top:1px solid #F0F0F2;margin-top:11px;padding-top:10px;animation:jrPop .25s ease}
.jr-card-pkgrow{display:flex;justify-content:space-between;align-items:baseline;font-size:12.5px;font-weight:700;color:#212735}
.jr-card-pkgrow span:last-child{font-size:13.5px;font-variant-numeric:tabular-nums}
.jr-card-inc{display:flex;gap:6px;font-size:11.5px;color:#565656;margin-top:4px;animation:jrPop .2s ease}
.jr-card-inc .ok{color:#17AE25;font-weight:700}
.jr-card-inc.gray{color:#9BA0A6}
.jr-card-sched{font-size:11px;color:#7A7E84;line-height:1.5;margin-top:7px}
.jr-card-about{font-size:11.5px;color:#565656;line-height:1.5;border-top:1px solid #F0F0F2;margin-top:10px;padding-top:9px;overflow-wrap:anywhere;animation:jrPop .2s ease}
.jr-card-host{display:flex;align-items:center;gap:7px;margin-top:11px;border-top:1px solid #F0F0F2;padding-top:10px;font-size:11.5px;font-weight:600;color:#565656}
.jr-rail-cap{font-size:11px;color:rgba(255,255,255,.45);line-height:1.55;margin-top:12px;flex-shrink:0}
.jr-rail-foot{margin-top:auto;padding-top:12px;flex-shrink:0}
.jr-fullbuilder{display:block;border:1px solid rgba(255,255,255,.18);border-radius:11px;padding:11px 14px;cursor:pointer;text-decoration:none}
.jr-fullbuilder:hover{background:rgba(255,255,255,.06)}
.jr-fullbuilder-t{font-size:12px;font-weight:700;color:#fff}
.jr-fullbuilder-s{font-size:11px;color:rgba(255,255,255,.55);line-height:1.5;margin-top:2px}
.jr-fullbuilder-s b{color:#DCC8FF}
.jr-duplink{display:inline-block;font-size:11px;color:rgba(255,255,255,.45);margin-top:9px;text-decoration:none}
.jr-duplink:hover{color:rgba(255,255,255,.7);text-decoration:underline}
/* celebration */
.jr-done{position:relative}
.jr-done-glow{position:absolute;top:-30px;left:50%;transform:translateX(-50%);width:520px;height:280px;background:radial-gradient(closest-side,rgba(136,51,255,.16),transparent);pointer-events:none}
.jr-particle{position:absolute;width:8px;height:8px;border-radius:50%;opacity:0;animation:jrDrift 2.6s ease both;pointer-events:none}
@keyframes jrDrift{0%{opacity:0;transform:translateY(10px) scale(.6)}25%{opacity:1}100%{opacity:0;transform:translateY(-90px) scale(1)}}
.jr-done-inner{display:flex;flex-direction:column;align-items:center;text-align:center;margin:auto;max-width:520px;width:100%}
.jr-done-ring{position:relative;width:92px;height:92px}
.jr-done-ring svg circle:first-child{stroke:#F0EAFB}
.jr-done-check{position:absolute;inset:11px;border-radius:50%;background:#8833FF;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 0 0 12px rgba(136,51,255,.14),0 0 0 26px rgba(136,51,255,.05);animation:jrBloom .5s cubic-bezier(.32,.72,0,1) .85s both}
@keyframes jrBloom{0%{opacity:0;transform:scale(.55)}55%{opacity:1;transform:scale(1.06)}100%{opacity:1;transform:scale(1)}}
.jr-done-h1{font-weight:700;font-size:34px;color:#212735;margin:22px 0 0;animation:jrRise .6s cubic-bezier(.32,.72,0,1) 1s both}
@keyframes jrRise{0%{opacity:0;transform:translateY(18px)}100%{opacity:1;transform:translateY(0)}}
.jr-done-sub{font-size:13px;color:#7A7E84;margin-top:7px;animation:jrRise .6s ease 1.15s both}
.jr-done-linkcard{width:100%;background:#F6F5F9;border-radius:14px;padding:14px 16px;margin-top:22px;box-sizing:border-box;position:relative;overflow:hidden;animation:jrRise .7s cubic-bezier(.32,.72,0,1) 1.35s both}
.jr-done-sweep{position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,rgba(136,51,255,.14) 50%,transparent 70%);animation:jrSweep 1.1s ease 1.7s both;pointer-events:none}
@keyframes jrSweep{0%{transform:translateX(-130%)}100%{transform:translateX(130%)}}
.jr-done-linkrow{display:flex;gap:9px}
.jr-done-well{flex:1;background:#fff;border:1px solid #E4E1EE;border-radius:10px;height:46px;display:flex;align-items:center;padding:0 14px;min-width:0;box-sizing:border-box}
.jr-done-well code{font-family:inherit;font-size:14.5px;font-weight:700;color:#212735;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jr-done-well code b{color:#8833FF}
.jr-done-copied{font-size:12.5px;font-weight:700;color:#17AE25;margin-top:10px}
.jr-springs{width:100%;display:flex;gap:10px;margin-top:18px;animation:jrRise .6s cubic-bezier(.32,.72,0,1) 1.85s both}
.jr-spring{flex:1;border:1.5px dashed #D9CBF5;border-radius:13px;padding:13px 14px;text-align:left;cursor:pointer;text-decoration:none;transition:all .15s}
.jr-spring:hover{background:#FBF9FF;border-color:#8833FF}
.jr-spring-ic{font-size:16px}
.jr-spring-t{font-size:12.5px;font-weight:700;color:#212735;margin-top:6px}
.jr-spring-s{font-size:11px;color:#7A7E84;line-height:1.45;margin-top:2px}
.jr-done-foot{font-size:12px;color:#9BA0A6;margin-top:14px;animation:jrRise .6s ease 2.1s both}
.jr-done-foot b{color:#565656}
@media (max-width:960px){
  .jr-cols{flex-direction:column;padding:16px}
  .jr-rail{width:100%}
  .jr-beatcard{padding:22px 20px}
  .jr-springs{flex-direction:column}
  .jr-top{padding:16px 16px 0}
  .jr-orgname{display:none}
}
@media (prefers-reduced-motion:reduce){
  .jr-beat,.jr-card-tag,.jr-card-pkg,.jr-card-inc,.jr-card-about,.jr-particle,.jr-done-check,.jr-done-h1,.jr-done-sub,.jr-done-linkcard,.jr-done-sweep,.jr-springs,.jr-done-foot{animation:none!important;opacity:1!important;transform:none!important}
  .jr-pulse{animation:none}
}
/* hidden must always win — .jr-beat's display:flex was overriding it */
#ct-joyride [hidden]{display:none!important}

/* ==== PORT-SPEC batch (Ouj 2026-07-23): coach banner, info bubbles,
   itinerary tap-to-edit + photos ==== */
.ct-coach{display:flex;align-items:center;gap:11px;background:#F3EBFF;border:1px solid #E4D9F7;border-radius:12px;padding:11px 14px;font-size:12.5px;color:#565656;line-height:1.5;margin-bottom:12px}
.ct-coach-ic{font-size:16px;flex-shrink:0}
.ct-coach-close{border:none;background:none;font-size:12px;font-weight:700;color:#8833FF;cursor:pointer;font-family:inherit;flex-shrink:0;padding:2px 4px}
.ct-coach-close:hover{text-decoration:underline}
.ct-info{border:none;background:#F3EBFF;color:#8833FF;width:18px;height:18px;border-radius:50%;font-size:11px;font-weight:700;cursor:pointer;font-family:inherit;padding:0;vertical-align:1px;line-height:18px}
.ct-info:hover{background:#E4D9F7}
.ct-info-pop{display:block;background:#FBF9FF;border:1px solid #EADFFB;border-radius:10px;padding:9px 12px;font-size:12px;color:#565656;line-height:1.5;margin-top:6px}
.ct-act-tap{cursor:pointer;transition:background .12s}
.ct-act-tap:hover{background:#FBF9FF}
.ct-act-tap.editing{background:#F3EBFF}
.ct-act-thumb{width:34px;height:34px;border-radius:8px;object-fit:cover;flex-shrink:0}
.ct-act-cta{font-size:11px;font-weight:600;color:#8833FF;border:1px solid #E4D9F7;background:#FBF9FF;border-radius:8px;padding:5px 9px;flex-shrink:0;white-space:nowrap}
.ct-act-tap:hover .ct-act-cta{background:#F3EBFF}
.ct-act-editor{background:#FBF9FF;border:1px solid #EADFFB;border-radius:12px;padding:12px;margin:6px 0 8px}
.ct-act-editor .row{display:flex;gap:8px;flex-wrap:wrap}
.ct-act-editor .ct-in{box-sizing:border-box}
.ct-act-editor textarea.ct-in{width:100%}
.ct-act-editor .pv{width:34px;height:34px;border-radius:8px;object-fit:cover}
/* hidden must ALWAYS win (Ouj 2026-07-23: "Create draft" still showing on
   the wizard's success panel — .ct-nav's display:flex was overriding the
   hidden attribute, same bug class as the Joyride beats). Scoped to the
   create pages we own. */
.ct-page [hidden]{display:none!important}

/* pre-launch interest list (design_handoff_prelaunch_interest_list) */
.ct-ci-linkrow{display:flex;gap:8px;margin-top:10px}
.ct-ci-link{flex:1;min-width:0;border:1px solid #E0E1E3;border-radius:9px;height:40px;padding:0 12px;font-size:12.5px;color:#565656;background:#F6F6F7;font-family:inherit}
.ct-ci-copy{height:40px;padding:0 14px;font-size:12.5px}
.ct-ci-count{font-size:11px;font-weight:700;color:#8833FF;text-transform:uppercase;letter-spacing:.6px;margin-top:12px}
.ct-ci-row{font-size:12.5px;color:#565656;padding:6px 0;border-bottom:1px solid #F0F0F2}
.ct-ci-row:last-of-type{border-bottom:none}
.ct-ci-row b{color:#212735;font-weight:600}
.ct-golive-backdrop{position:fixed;inset:0;background:rgba(20,10,40,.45);z-index:120;display:flex;align-items:center;justify-content:center;padding:20px}
.ct-golive-backdrop[hidden]{display:none}
.ct-golive{background:#fff;border-radius:16px;max-width:420px;width:100%;padding:26px;position:relative;box-shadow:0 12px 40px rgba(20,10,40,.25)}
.ct-golive h3{font-size:18px;font-weight:700;color:#212735;margin:0 0 6px;font-family:inherit}
.ct-golive p{font-size:13px;color:#565656;line-height:1.55;margin:0 0 16px}
.ct-golive-x{position:absolute;top:14px;right:14px;width:30px;height:30px;border-radius:50%;background:#F2F2F7;border:none;color:#565656;cursor:pointer;font-family:inherit;font-size:13px}
