/* Create 2.0: content-driven layout.
   Reference: 1672 x 941, main 1071 / rail 331, 14px panel rhythm.
   Heights are minimums: file previews, translated text and job errors may grow.
   This file owns Create home sizing; config/results keep their existing styles. */
body.clipsyra-web2-reference-layout #create{
  --c2-bg:#030716;
  --c2-panel:#07112f;
  --c2-panel-2:#0a153b;
  --c2-line:rgba(67,105,230,.48);
  --c2-line-hot:rgba(132,70,255,.72);
  --c2-violet:#8b3dff;
  --c2-magenta:#d746ff;
  --c2-cyan:#15cfff;
  --c2-text:#f7f9ff;
  --c2-muted:#98a7cc;
  --c2-radius:18px;
  max-width:none!important;
  margin:0 auto!important;
  padding:4px 0 31px!important;
  overflow:visible!important;
  background:transparent!important;
}
#create .cf-shell{width:100%!important;max-width:none!important;padding:0!important}
#create .create2-stage{width:100%;min-width:0;container-type:inline-size;container-name:create-home;}
#create .create2-topbar{display:grid;align-items:center;;grid-template-columns:minmax(0,489px) minmax(0,1fr);gap:14px;min-height:58px;margin:0 0 7px;}
#create .create2-search{display:flex;align-items:center;gap:10px;min-width:0;padding:0 14px;
  border:1px solid var(--c2-line);border-radius:12px;background:rgba(9,20,60,.84);color:#8291bb;;width:100%;height:40px;}
#create .create2-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:#f2f5ff;font:inherit;font-size:clamp(12px,.72vw,13.5px)}
#create .create2-search input::placeholder{color:#7f8db5}
#create .create2-top-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;min-width:max-content}
#create .create2-top-actions button{
  height:43px;border:1px solid rgba(88,104,207,.5);border-radius:12px;background:#091333;color:#fff;
  font:inherit;font-size:clamp(11px,.66vw,12.5px);font-weight:850;cursor:pointer;
}
#create .create2-icon-btn{width:42px;padding:0}
#create .create2-upgrade-btn{padding:0 14px!important;background:linear-gradient(135deg,#5425c9,#7b2de1)!important;border-color:#8445f4!important;box-shadow:0 0 22px rgba(124,52,255,.22)}
#create .create2-avatar-btn{width:38px!important;border-radius:50%!important;background:linear-gradient(135deg,#2565ff,#643be8)!important}

#create .create2-layout{display:grid;
  
  
  
  min-width:0;;grid-template-columns:minmax(0,3.24fr) minmax(300px,1fr);gap:14px;align-items:stretch;}
#create .create2-main-column{display:grid;min-width:0;row-gap:14px;grid-template-rows:auto auto minmax(344px,1fr) auto;}
#create .create2-right-rail{display:grid;row-gap:0;min-width:0;;gap:14px;grid-template-rows:auto minmax(0,1fr) auto;align-content:stretch;}
#create .create2-right-rail>section{min-width:0}
#create .create2-core-card{;height:auto;margin:0;}
#create .create2-job-card{;height:auto;margin:0;}
#create .create2-stats-card{;height:auto;margin:0;}

#create .create2-hero{display:grid;
  border:1px solid rgba(62,103,232,.50);border-radius:18px;overflow:hidden;
  background:
    radial-gradient(circle at 68% 35%,rgba(119,42,255,.25),transparent 34%),
    radial-gradient(circle at 88% 72%,rgba(0,183,255,.14),transparent 28%),
    linear-gradient(115deg,#071642 0%,#101650 55%,#14104a 100%);
  box-shadow:inset 0 1px rgba(255,255,255,.04),0 10px 28px rgba(0,0,0,.16),0 0 20px rgba(66,91,219,.06);;min-height:250px;height:auto;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:auto;}
#create .create2-hero-copy{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;min-width:0;z-index:1;;grid-area:1 / 1 / 2 / 8;padding:22px 0 18px 30px;}
#create .create2-kicker{
  display:inline-flex;align-items:center;justify-content:center;width:clamp(114px,6.82vw,130px);height:clamp(27px,1.62vw,31px);padding:0 10px;border-radius:999px;background:linear-gradient(90deg,#6e2cf1,#9a3eff);
  color:#fff;font-size:clamp(10px,.60vw,11.5px);font-weight:900;letter-spacing:.06em;
}
#create .create2-hero h1{margin:10px 0 7px;line-height:1.02;letter-spacing:-.052em;font-weight:950;;font-size:clamp(32px,3.5cqw,58px);white-space:normal;width:max-content;max-width:min(650px,160%);}
#create .create2-brand{color:#fff}
#create .create2-gradient{background:linear-gradient(90deg,#c653ff,#8e4dff 48%,#10c8ff);-webkit-background-clip:text;background-clip:text;color:transparent}
#create .create2-lead{margin:0;color:#f0f3ff;line-height:1.30;max-width:560px;font-size:clamp(15px,1.28cqw,20px);width:min(620px,145%);}
#create .create2-sublead{margin:6px 0 0;color:#a1aed0;;font-size:clamp(12px,.95cqw,15px);}
#create .create2-benefits{display:grid;margin-top:15px;max-width:100%;grid-template-columns:repeat(3,minmax(0,1fr));width:min(506px,100%);gap:12px;}
#create .create2-benefits>div{padding:clamp(8px,.48vw,9px) clamp(10px,.60vw,11px);border:1px solid rgba(61,100,217,.52);border-radius:10px;background:rgba(10,22,67,.72);box-sizing:border-box;height:auto;min-height:50px;}
#create .create2-benefits b,#create .create2-benefits small{display:block}
#create .create2-benefits b{font-size:clamp(11px,.66vw,12.5px);color:#fff}
#create .create2-benefits small{margin-top:2px;font-size:clamp(9px,.54vw,10.3px);color:#8595bd}

#create .create2-syra-art{display:grid;grid-template-columns:1fr;grid-template-rows:1fr;min-width:0;
  background:
    radial-gradient(circle at 48% 50%,rgba(139,48,255,.30),transparent 48%),
    linear-gradient(90deg,rgba(13,21,73,0) 0%,rgba(13,21,73,.18) 16%,rgba(16,16,70,.10) 100%);
  overflow:hidden;;grid-area:1 / 7 / 2 / -1;height:100%;min-height:250px;}
#create .create2-syra-art img{grid-area:1/1;justify-self:center;align-self:end;
  object-fit:contain;object-position:center bottom;
  filter:drop-shadow(0 0 42px rgba(88,66,255,.50)) saturate(1.06) contrast(1.02);
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.34) 8%,#000 24%,#000 88%,rgba(0,0,0,.66) 95%,transparent 100%),linear-gradient(180deg,#000 0%,#000 80%,rgba(0,0,0,.68) 90%,transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.34) 8%,#000 24%,#000 88%,rgba(0,0,0,.66) 95%,transparent 100%),linear-gradient(180deg,#000 0%,#000 80%,rgba(0,0,0,.68) 90%,transparent 100%);
  mask-composite:intersect;;width:100%;height:100%;min-height:0;max-height:310px;}
#create .create2-syra-note{
  grid-area:1/1;align-self:start;justify-self:end;width:clamp(118px,7.06vw,135px);margin:clamp(42px,2.51vw,48px) clamp(14px,.84vw,16px) 0 0;padding:clamp(6px,.36vw,7px) clamp(8px,.48vw,9px);
  border:1px solid rgba(119,81,255,.20);border-radius:10px;background:rgba(8,17,53,.40);backdrop-filter:blur(7px);
  transform:rotate(-4deg);color:#dfe6ff;font-size:clamp(8px,.48vw,9px);line-height:1.25;
}
#create .create2-syra-note b,#create .create2-syra-note span{display:block}

#create .create2-shortcuts{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));min-width:0;;height:auto;margin:0;gap:12px;}
#create .create2-shortcuts button{display:grid;align-items:center;min-width:0;
  border:1px solid rgba(62,103,232,.46);border-radius:15px;background:linear-gradient(160deg,#0d1b4d,#08112f);
  color:#fff;text-align:left;cursor:pointer;;height:auto;min-height:94px;padding:10px;grid-template-columns:24px minmax(0,1fr) auto;gap:7px;}
#create .create2-shortcuts button.active{border-color:rgba(142,81,255,.82);box-shadow:0 8px 24px rgba(0,0,0,.14),0 0 18px rgba(130,68,255,.20)}
#create .create2-shortcuts button>span{font-size:clamp(23px,1.68vw,28px)}
#create .create2-shortcuts button div{min-width:0}
#create .create2-shortcuts b,#create .create2-shortcuts small{display:block;font-size:11px;}
#create .create2-shortcuts b{;font-size:13px;}
#create .create2-shortcuts small{margin-top:4px;color:#9dadd2;font-size:clamp(11px,.66vw,12.5px);line-height:1.28}
#create .create2-shortcuts i{font-style:normal;color:#aab8da}

#create .create2-upload-panel{border:1px solid rgba(0,196,255,.62);border-radius:18px;box-sizing:border-box;
  background:radial-gradient(circle at 50% 50%,rgba(17,99,218,.10),transparent 38%),linear-gradient(145deg,#06102d,#03091f);
  box-shadow:inset 0 1px rgba(255,255,255,.04),0 10px 28px rgba(0,0,0,.16),0 0 20px rgba(66,91,219,.06);outline:none;min-width:0;;display:flex;flex-direction:column;height:auto;min-height:344px;padding:12px;margin:0;gap:10px;}
#create .create2-upload-panel.drag-active{border-color:#d751ff;box-shadow:0 0 30px rgba(200,70,255,.2),inset 0 0 30px rgba(83,48,255,.08)}
#create .create2-upload-toolbar{grid-template-columns:1fr auto;align-items:center;margin-bottom:0;display:flex;justify-content:flex-end;height:auto;min-height:40px;}
#create .create2-imports{display:flex;align-items:center;justify-content:center;gap:clamp(8px,.48vw,9px);width:clamp(226px,13.52vw,258px);height:clamp(38px,2.27vw,43px);padding:0 11px;border:1px solid rgba(106,119,236,.62);border-radius:12px;background:linear-gradient(135deg,#14215e,#0e1848);color:#eef2ff;font-size:clamp(10.5px,.63vw,12px);font-weight:800;box-shadow:0 8px 20px rgba(0,0,0,.14),0 0 18px rgba(89,87,255,.08);box-sizing:border-box}
#create .create2-imports span{display:grid;place-items:center;width:clamp(24px,1.44vw,27px);height:clamp(24px,1.44vw,27px);border-radius:6px;background:#17245f;color:#e7ecff}
#create .create2-upload-body{display:grid;align-items:center;;grid-template-columns:minmax(100px,1fr) minmax(0,2.2fr) minmax(100px,1fr);height:auto;min-height:220px;flex:1;gap:16px;}
#create .create2-format-stack{display:flex;align-items:center;gap:0;min-width:0;padding-right:0;;justify-content:center;transform:none;}
#create .create2-format-stack span{aspect-ratio:auto;border:1px solid rgba(80,103,255,.6);border-radius:9px;
  display:grid;place-items:end center;padding-bottom:10px;color:#bfc8e6;font-weight:800;;width:70px;height:110px;flex:0 1 70px;font-size:10px;background:linear-gradient(145deg,#14235c,#070c2a);box-shadow:0 0 18px #5735ee66;}
#create .create2-format-stack span:nth-child(1){transform:rotate(-10deg) translateX(14px)}
#create .create2-format-stack span:nth-child(2){z-index:2;transform:translateY(-7px)}
#create .create2-format-stack span:nth-child(3){transform:rotate(10deg) translateX(-14px)}
#create .create2-upload-center{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-width:0;justify-self:stretch;align-self:center}
#create .create2-upload-icon{font-size:clamp(48px,2.87vw,55px);line-height:1;text-shadow:0 0 20px #7b61ff,0 0 30px #00cfff}
#create .create2-upload-center h2{margin:8px 0 4px;;font-size:clamp(18px,1.45cqw,24px);}
#create .create2-upload-center p{margin:0 0 12px;color:#aeb9d7;font-size:clamp(12px,.72vw,13.5px)}
#create .create2-select-btn{padding:0 18px!important;border-radius:13px!important;background:linear-gradient(90deg,#7f2cff,#17bfff)!important;width:min(100%,260px)!important;min-width:0!important;height:50px!important;}
#create .create2-upload-center>small{margin-top:8px;color:#9eabc9;font-size:clamp(12px,.72vw,13.5px)}
#create .create2-link-btn{min-width:0;max-width:100%;margin-top:11px!important;padding:0 12px!important;border:1px solid rgba(98,75,218,.58)!important;border-radius:9px!important;background:#0b1339!important;color:#9faed1!important;width:100%;height:auto;min-height:42px;display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left;font-size:11px;}
#create .create2-link-btn b{color:#fff;background:linear-gradient(135deg,#6729f6,#4922da);border-radius:7px;padding:9px 16px;flex-shrink:0;}
#create .create2-magic-stack{display:flex;align-items:center;padding-left:0;;justify-content:center;transform:none;min-width:0;}
#create .create2-magic-card{aspect-ratio:auto;
  display:grid;place-items:end center;
  border-radius:12px;
  
  color:#f7ddff;font-size:clamp(10px,.60vw,11.5px);font-weight:900;letter-spacing:.04em;
  box-shadow:0 12px 34px rgba(75,53,180,.38);;grid-template:1fr auto / 1fr;padding:0;background:none;border:0;width:min(148px,80%);height:174px;transform:rotate(8deg);}
#create .create2-magic-card::before,
#create .create2-magic-card::after{content:"";width:90%;height:90%;align-self:center;justify-self:center;border:1px solid rgba(117,93,255,.46);border-radius:11px;
  background:linear-gradient(145deg,rgba(42,36,115,.96),rgba(18,25,70,.92));;grid-area:1/1/3/2;z-index:0;}
#create .create2-magic-card::before{transform:translate(-20px,10px) rotate(-7deg);opacity:.74}
#create .create2-magic-card::after{transform:translate(20px,12px) rotate(7deg);opacity:.60}
#create .cf-file-pill{display:none;justify-self:center;margin:6px auto;padding:7px 12px;border:1px solid rgba(168,85,247,.38);background:rgba(18,13,43,.72);border-radius:999px;color:#ddd8f2;font-size:10px;max-width:92%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#create .cf-video-ready{width:min(680px,100%);display:grid;grid-template-columns:150px minmax(0,1fr) 34px;gap:12px;align-items:center;padding:10px;border:1px solid rgba(0,221,255,.43);border-radius:12px;background:rgba(5,10,31,.92);grid-area:auto;margin:0 auto;min-width:0;}
#create .cf-video-ready[hidden],#create .cf-ready-actions[hidden]{display:none!important}
#create .cf-video-ready video{width:150px;height:86px;object-fit:cover;border-radius:9px;background:#000}
#create .cf-ready-actions{display:flex;flex-direction:column;gap:4px;margin-top:8px;grid-area:auto;align-items:center;margin:0;}
#create .cf-core-state{display:block;width:max-content;max-width:100%;color:#6df3c1;border:1px solid rgba(42,225,174,.25);background:#071d22;border-radius:999px;font-size:8px;font-weight:900;grid-area:auto;margin:0 auto;padding:4px 10px;}

#create .create2-ai-tools{border:1px solid rgba(62,103,232,.50);border-radius:18px;background:linear-gradient(160deg,#091439,#070f2d);min-width:0;box-sizing:border-box;
  box-shadow:inset 0 1px rgba(255,255,255,.04),0 10px 28px rgba(0,0,0,.16),0 0 20px rgba(66,91,219,.06);;height:auto;padding:12px;margin:0;}
#create .create2-tools-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:8px;flex-wrap:wrap;}
#create .create2-tools-head b,#create .create2-tools-head small{display:block}
#create .create2-tools-head b{font-size:clamp(16px,.96vw,18px)}
#create .create2-tools-head small{margin-top:2px;color:#9ca9c8;font-size:clamp(11px,.66vw,12.5px)}
#create .create2-tools-head button{border:0;background:transparent;color:#d24dff;font-size:8px;font-weight:800;cursor:pointer}
#create .create2-tools-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));;gap:8px;}
#create .create2-tools-grid button{display:grid;align-items:center;min-width:0;
  border:1px solid rgba(62,103,232,.44);border-radius:12px;background:#0b1644;color:#fff;text-align:left;cursor:pointer;;height:auto;min-height:72px;padding:10px 8px;grid-template-columns:28px minmax(0,1fr) auto;gap:7px;}
#create .create2-tools-grid button>span{font-size:clamp(20px,1.20vw,23px);color:#d04eff}
#create .create2-tools-grid div{min-width:0}
#create .create2-tools-grid b,#create .create2-tools-grid small{display:block;font-size:10px;}
#create .create2-tools-grid b{;font-size:11px;}
#create .create2-tools-grid small{margin-top:2px;color:#95a4c8;font-size:clamp(10px,.60vw,11.5px);line-height:1.22}
#create .create2-tools-grid i{font-style:normal;color:#9fb0d6}

#create .create2-core-card,#create .create2-job-card,#create .create2-stats-card{border:1px solid rgba(62,103,232,.50);border-radius:18px;background:linear-gradient(160deg,#091439,#06102f);min-width:0;box-sizing:border-box;
  box-shadow:inset 0 1px rgba(255,255,255,.04),0 10px 28px rgba(0,0,0,.16),0 0 20px rgba(66,91,219,.06);;padding:14px;}
#create .create2-core-head{display:grid;align-items:center;grid-template-columns:minmax(0,1fr) 80px;gap:6px;}
#create .create2-core-head h2{margin:0;;font-size:21px;}#create .create2-core-head h2 span{color:#d748ff}
#create .create2-core-head p{margin:4px 0 0;color:#a9b5d3;font-size:clamp(12px,.72vw,13.5px)}
#create .create2-core-avatar{overflow:hidden;height:76px;}
#create .create2-core-avatar img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 0 14px rgba(91,69,255,.4));-webkit-mask-image:linear-gradient(to top,transparent,#000 30%);mask-image:linear-gradient(to top,transparent,#000 30%)}
#create .create2-core-message{border:1px solid rgba(66,103,215,.40);border-radius:12px;background:#0c1743;margin-top:8px;padding:12px;}
#create .create2-core-message>div{display:flex;align-items:center;justify-content:space-between;gap:clamp(8px,.48vw,9px);flex-wrap:wrap;}
#create .create2-core-message b{font-size:clamp(12px,.72vw,13.5px)}
#create .create2-core-message span{color:#63e8c1;font-size:clamp(10px,.60vw,11.5px);white-space:nowrap}
#create .create2-core-message p{margin:8px 0 0;color:#b3bdd8;font-size:clamp(11px,.66vw,12.5px);line-height:1.42}
#create .create2-card-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:clamp(12px,.72vw,14px)}
#create .create2-card-head>b{font-size:clamp(15px,.90vw,17px)}
#create .create2-card-head button{border:0;background:transparent;color:#c94dff;font-size:clamp(10px,.60vw,11.5px);cursor:pointer}
#create .create2-card-head>span{font-size:7px;color:#8f9bbc}
#create .create2-job-card #cfHomeMonitorHost{min-width:0}
#create .create2-job-card .cf-core-monitor{margin:0!important;border-radius:12px!important;min-width:0!important;min-height:0!important;display:grid!important;gap:10px;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;}
#create .create2-job-card .cf-monitor-title{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
#create .create2-job-card .cf-monitor-title strong{font-size:clamp(12px,.72vw,13.5px);color:#fff}
#create .create2-job-card .cf-monitor-title span{font-size:clamp(9px,.54vw,10px);color:#93a3c7;text-align:right;max-width:150px}
#create .create2-job-card .cf-monitor-grid{display:grid!important;align-items:center!important;;grid-template-columns:1fr!important;gap:12px!important;margin:0!important;}
#create .create2-job-card .clipsyra-ring{;width:100%!important;height:9px!important;padding:0!important;border-radius:999px;aspect-ratio:auto;filter:none;transform:none;background:linear-gradient(90deg,#a72bff,#08c7ef) 0/ calc(var(--p)*1%) 100% no-repeat,#172559;}
#create .create2-job-card .cf-ring-inner b{font-size:clamp(16px,.96vw,18px)!important}
#create .create2-job-card .cf-ring-inner small{font-size:5px!important}
#create .create2-job-card .cf-stage-list{display:grid!important;min-width:0;gap:10px!important;}
#create .create2-job-card .clipsyra-step{min-width:0;font-size:12px!important;line-height:1.5!important;gap:10px;}
#create .create2-job-card .cf-monitor-status{font-size:clamp(10.5px,.63vw,12px)!important;margin:8px 0 3px!important}
#create .create2-job-card .cf-core-monitor>p{font-size:clamp(10px,.60vw,11.5px)!important;margin:4px 0 clamp(8px,.48vw,9px)!important}
#create .create2-job-card .cf-monitor-stats{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important}
#create .create2-job-card .cf-monitor-stats>div{padding:6px 2px!important;min-width:0}
#create .create2-job-card .cf-monitor-stats b{font-size:clamp(11px,.66vw,12.5px)!important}
#create .create2-job-card .cf-monitor-stats small{font-size:clamp(8px,.48vw,9px)!important;line-height:1.2!important}
#create .create2-tip{display:grid;grid-template-columns:34px 1fr;gap:clamp(9px,.54vw,10px);align-items:center;border:1px solid rgba(43,115,255,.42);border-radius:11px;background:#0d2457;margin-top:auto;padding:10px;}
#create .create2-tip>span{width:clamp(34px,2.03vw,39px);height:clamp(34px,2.03vw,39px);display:grid;place-items:center;border-radius:9px;background:#5825b9;color:#e1b8ff}
#create .create2-tip b,#create .create2-tip small{display:block}
#create .create2-tip b{font-size:clamp(10px,.60vw,11.5px);color:#d54cff}#create .create2-tip small{font-size:clamp(9px,.54vw,10px);color:#aab5d1;line-height:1.28}
#create .create2-stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(8px,.48vw,9px)}
#create .create2-stats-grid>div{text-align:center;min-width:0;padding:8px 4px;background:transparent;border:0;border-radius:0;}
#create .create2-stats-grid span,#create .create2-stats-grid b,#create .create2-stats-grid small{display:block}
#create .create2-stats-grid span{font-size:clamp(17px,1.02vw,19px);color:#16d7ff}#create .create2-stats-grid b{margin-top:5px;font-size:clamp(17px,1.02vw,19px)}#create .create2-stats-grid small{margin-top:4px;color:#a5b2cf;font-size:clamp(8.5px,.51vw,9.5px)}

/* Existing Create config/results remain untouched. */
#create .cf-config-stage{margin-top:4px}


/* Shared home box model and content flow. */
#create .create2-stage *,#create .create2-stage *::before,#create .create2-stage *::after{box-sizing:border-box}
#create .create2-stage button{font-family:inherit;cursor:pointer}
#create .create2-stage button:focus-visible,#create .create2-stage input:focus-visible,#create #drop:focus-visible{outline:2px solid #30d5ff;outline-offset:3px}
#create .create2-stage[hidden]{display:none!important}
#create .create2-job-card{display:flex;flex-direction:column;gap:12px}
#create .create2-card-head{margin-bottom:0}
#create .create2-stats-card{display:grid;gap:12px;align-content:start}
#create .create2-format-stack span::before{content:"▶";align-self:center;color:#c69fff;font-size:27px;text-shadow:0 0 16px #933cff}
#create .create2-magic-image{grid-area:1/1/3/2;width:100%;height:100%;object-fit:cover;border:2px solid #b28aff;border-radius:12px;z-index:1;background:#0c1637}
#create .create2-magic-label{grid-area:2/1;z-index:2;justify-self:center;margin:0 -12px -8px 0;padding:12px;border:1px solid #9f60ff;border-radius:10px;background:linear-gradient(135deg,#6228bd,#11184a);box-shadow:0 0 15px #613fff99;white-space:nowrap}
#create .create2-upload-panel:has(.cf-video-ready:not([hidden])) .create2-upload-body{display:none}
#create .create2-upload-panel:has(.cf-video-ready:not([hidden])) .cf-video-ready{margin:auto}
#create .cf-video-ready>div{min-width:0}
#create .cf-video-ready strong,#create .cf-video-ready small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
#create .create2-job-card .cf-ring-inner{display:none}
#create .create2-job-card .clipsyra-step{font-size:0!important}
#create .create2-job-card .clipsyra-step>span{font-size:12px}
#create .create2-job-card .clipsyra-step::before{content:"";width:23px;height:23px;flex:0 0 23px;border:1px solid #748ed1;border-radius:50%}
#create .create2-job-card .clipsyra-step.done::before{content:"✓";display:grid;place-items:center;font-size:14px;background:#00c995;border-color:#1fffc2;color:#fff}
#create .create2-job-card .clipsyra-step.active::before{content:"✦";display:grid;place-items:center;font-size:14px;background:#7935ed;border-color:#c691ff;color:#fff}
#create .create2-job-card .cf-monitor-title{flex-wrap:wrap}
#create .create2-job-card .cf-monitor-title span{max-width:100%;text-align:left;overflow-wrap:anywhere}
#create .create2-job-card .cf-monitor-status,#create .create2-job-card .cf-core-monitor>p{margin:0!important;overflow-wrap:anywhere}
#create .create2-job-card .cf-core-monitor.is-error{border:1px solid #ff5775!important;padding:10px!important}
#create .create2-stats-grid>div+div{border-left:1px solid #233259}

/* Breakpoints use available Create width, including sidebar and gutters. */
@container create-home (max-width:1040px){
  #create .create2-layout{grid-template-columns:minmax(0,1fr) 300px}
  #create .create2-shortcuts{grid-template-columns:repeat(3,minmax(0,1fr))}
  #create .create2-tools-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  #create .create2-hero-copy{grid-column:1/9;padding-left:20px}
  #create .create2-hero h1{width:auto;max-width:100%;font-size:36px}
  #create .create2-lead{width:100%}
  #create .create2-syra-art{grid-column:8/-1}
  #create .create2-syra-note{display:none}
  #create .create2-upload-body{grid-template-columns:minmax(0,1fr)}
  #create .create2-format-stack,#create .create2-magic-stack{display:none}
  #create .create2-upload-center{width:min(100%,480px);justify-self:center}
}
@container create-home (max-width:920px){
  #create .create2-layout{grid-template-columns:minmax(0,1fr)}
  #create .create2-right-rail{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto auto;align-items:start}
  #create .create2-core-card{grid-column:1;grid-row:1}
  #create .create2-job-card{grid-column:2;grid-row:1/3}
  #create .create2-stats-card{grid-column:1;grid-row:2}
  #create .create2-topbar{grid-template-columns:minmax(0,1fr) auto}
  #create .create2-hero h1{font-size:clamp(30px,5cqw,46px)}
}
@container create-home (max-width:600px){
  #create .create2-topbar{grid-template-columns:1fr}
  #create .create2-top-actions{justify-content:flex-end;min-width:0;flex-wrap:wrap}
  #create .create2-hero{grid-template-columns:1fr;grid-template-rows:auto auto}
  #create .create2-hero-copy{grid-area:1/1;padding:20px}
  #create .create2-hero h1{font-size:clamp(27px,7cqw,42px)}
  #create .create2-syra-art{grid-area:2/1;height:180px;min-height:180px}
  #create .create2-syra-art img{max-height:180px}
  #create .create2-benefits{gap:6px}
  #create .create2-benefits>div{padding:8px 6px}
  #create .create2-shortcuts,#create .create2-tools-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  #create .create2-shortcuts button{grid-template-columns:24px minmax(0,1fr);padding:10px;gap:8px}
  #create .create2-shortcuts i,#create .create2-tools-grid i{display:none}
  #create .create2-tools-grid button{grid-template-columns:24px minmax(0,1fr)}
  #create .create2-right-rail{grid-template-columns:1fr;grid-template-rows:auto}
  #create .create2-core-card,#create .create2-job-card,#create .create2-stats-card{grid-area:auto}
  #create .create2-imports{max-width:100%}
  #create .cf-video-ready{grid-template-columns:80px minmax(0,1fr) 28px;gap:8px}
  #create .cf-video-ready video{width:80px;height:70px}
}
