/* Green Player UI contract v1. Geometry stays in the established fluid shell.
   This layer owns control hierarchy, readability, and below-tool content only. */
.controlModeTabs,.liveControlStatus{display:none!important}
.controlsScroll{overscroll-behavior-y:contain;scrollbar-gutter:stable}
body.editing .controlsScroll>.adv{display:block!important;margin:0 0 8px!important;border:1px solid #303a42!important;border-radius:9px!important;background:#141a1f!important;overflow:hidden}
body.editing .adv>summary{padding:13px 11px!important;color:#c9d3d9!important;font-size:12px!important;line-height:1.4;cursor:pointer}
body.editing .adv[open]>summary{border-bottom:1px solid #303a42;color:#8de4b6!important}
body.editing .controlsHead h2{font-size:20px!important}
body.editing .controlsScroll .groupTitle h3{font-size:12px!important}
body.editing .quickCore .heroRow label{font-size:12px!important}
body.editing .quickCore .heroRow output{font-size:11px!important;font-variant-numeric:tabular-nums}
body.editing .row input[type=range]{accent-color:#35b878;min-width:0}
body.editing .engineModeBtn span{font-size:12px!important}
body.editing .engineModeBtn small{font-size:10px!important}
body.editing .eyeHeroCopy b{font-size:11px!important}
body.editing .quickAuto,body.editing #resetBtn{font-size:11px!important}
body.editing .quickActions{grid-template-columns:1fr 1fr!important;grid-template-rows:auto auto!important;gap:7px!important}
body.editing .quickActions .eyeHero{grid-column:1/-1!important;min-height:46px!important}
body.editing .quickActions #sampleBtn{grid-column:1!important;grid-row:2!important}
body.editing .quickActions #resetBtn{grid-column:2!important;grid-row:2!important}
body.editing .eyeHeroCopy{min-width:0}
body.editing .eyeHeroCopy b{white-space:nowrap;font-size:12px!important}
body.editing .eyeHeroCopy small{display:block!important;font-size:10px!important}
body.editing .seg{font-size:11px!important}
body.editing .saveFooterButtons .saveBtn{font-size:13px!important;border:1px solid #3ea872!important;background:#1e5139!important;color:#edfff5!important}
body.editing .saveFooterButtons #mp4Btn{background:#202c35!important;border-color:#536775!important}
.saveFooterLabel b{font-size:11px!important;color:#bdc9d0!important}
.gpHint{font-size:11px;line-height:1.6;color:#96a5af;margin:7px 0 9px}
.gpBackgroundHint{padding:0 10px}
.gpMobileBatchHint{display:none}
body.editing.is-image .previewActions .timelineEditWrap,
body.editing.is-image #playBtn,body.editing.is-image #restartBtn,body.editing.is-image #muteBtn{display:none!important}
body.editing.is-image .previewActions:after{content:'PNG · 투명 배경으로 저장';font-size:11px;color:#82949f;justify-self:end}
html[lang=en] body.editing.is-image .previewActions:after{content:'PNG · Save with transparency'}
body.editing.is-image .rotateDockBtn,body.editing.is-image .flipDockBtn{display:grid!important}
body.editing.is-image #editCanvas{display:block;pointer-events:auto;cursor:grab;touch-action:none}
body.editing.is-image #glCanvas{opacity:0}
body.editing.is-image .previewFrame.eye-mode #editCanvas{display:none!important}
body.editing.is-image .previewFrame.eye-mode #glCanvas{opacity:1!important}
body.editing.is-image #editCanvas.is-dragging{cursor:grabbing}
body.editing.is-image .veActionRow{display:none!important}
body.editing.is-video #videoEditGroup .rightTrimFold{display:none!important}
.bottomTrimTimes{font-size:10px!important;color:#a7b5bf!important}
.bottomTrimTimes b{font-size:11px!important}
.transportCluster button{flex-shrink:0}
.gpWorkflow{width:min(1460px,calc(100% - 40px));margin:24px auto 0;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:stretch}
.gpWorkflowCopy{padding:24px;border:1px solid #303a42;border-radius:14px;background:#151b20;min-width:0;display:flex;flex-direction:column;justify-content:center}
.gpSectionHeading>span{font-size:10px;font-weight:800;letter-spacing:.15em;color:#75d8a7}
.gpSectionHeading h2{margin:8px 0 22px;font-size:23px;letter-spacing:-.03em;color:#eef3f5}
.gpSteps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.gpSteps article{display:flex;gap:12px;min-width:0}
.gpSteps article>span{flex:0 0 28px;height:28px;display:grid;place-items:center;font-size:11px;font-weight:800;color:#86dfb2;border:1px solid #365b49;border-radius:8px;background:#172a20}
.gpSteps h3{margin:2px 0 7px;font-size:15px;line-height:1.4;color:#e9f0f3}
.gpSteps p{margin:0;color:#98a7b1;font-size:12px;line-height:1.7;word-break:keep-all}
.gpAdCard{position:relative;width:300px;min-height:250px;background:#12181d;outline:1px solid #29333c;border-radius:12px;isolation:isolate}
.gpAdCaption{position:absolute;top:7px;left:10px;font-size:8px;letter-spacing:.12em;color:#6e7f8b;z-index:-1}
.gpAdDesktop{display:inline-block!important}.gpAdMobile{display:none!important}
.toolContentLayer{margin-top:24px!important}
.freePill{font-size:11px!important;padding:7px 12px!important}
body.editing .editorGuideFree strong{font-size:13px!important;padding:8px 13px!important}
.rightsConfirmCard p{font-size:14px!important;line-height:1.8!important;color:#b5c1c9!important}
.rightsConfirmCard h2{font-size:21px!important}
.toolRailPanel a,.toolRailPanel button{min-height:40px}
@media(min-width:901px){
  body.editing.is-video .previewActions{grid-template-columns:1fr!important;grid-template-rows:36px 44px!important;padding:7px 28px!important;gap:4px!important}
  body.editing.is-video .transportCluster{justify-self:center}
  body.editing.is-video .timelineEditWrap{height:44px!important}
}
@media(max-width:1100px) and (min-width:901px){
  /* Keep the 340px side rails; compact the two-row central controls only. */
  body.editing.is-video .previewActions{padding:7px 10px!important}
  body.editing.is-video .transportCluster{gap:3px!important}
  body.editing .transportBtn{width:28px!important;min-width:28px!important;height:32px!important}
}
@media(max-width:900px){
  .mobileToolsBtn{white-space:nowrap!important;min-width:42px!important}
  body.editing .editorTop{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:8px!important;padding:10px 12px!important}
  body.editing .editorTop .sourceInfo{display:flex!important;min-width:0!important;width:100%!important;height:auto!important;gap:9px!important}
  body.editing .sourceTag{flex:0 0 auto!important}
  body.editing .sourceCopy{display:block!important;min-width:0!important;flex:1!important}
  body.editing .sourceCopy b{display:none!important}
  body.editing .sourceCopy span{display:block!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;font-size:11px!important}
  body.editing .editorTopActions{display:flex!important;flex-direction:row!important;align-items:center!important;width:100%!important;height:auto!important;gap:6px!important}
  body.editing .historyActions{display:flex!important;gap:5px!important}
  body.editing .editorTopActions .historyBtn{width:32px!important;height:30px!important}
  body.editing .editorTopActions>.resetFile{width:auto!important;height:30px!important;min-height:30px!important;padding:0 10px!important;writing-mode:horizontal-tb!important}
  body.editing .editorTopActions label.resetFile{margin-left:auto!important}
  body.editing .editorTopActions label.resetFile>span{writing-mode:horizontal-tb!important;font-size:11px!important}
  .gpMobileBatchHint{display:block;font-size:11px!important;color:#96a5af!important;line-height:1.6!important;padding:0 14px}
  body.editing .editorGuide{display:none!important}
  body.editing .previewFrame{order:1!important;height:auto!important;aspect-ratio:16/10;min-height:210px!important;max-height:56dvh!important;margin:8px 10px!important;width:calc(100% - 20px)!important}
  body.editing .previewActions{order:2!important;display:grid!important;grid-template-columns:1fr!important;grid-template-rows:auto auto!important;height:auto!important;min-height:104px!important;padding:10px!important;gap:8px!important}
  body.editing .transportCluster{justify-content:center!important;gap:5px!important;width:100%!important}
  body.editing .transportBtn{width:36px!important;min-width:36px!important;height:38px!important}
  body.editing .timelineEditWrap{height:48px!important}
  body.editing .controls{order:3!important;height:auto!important;overflow:visible!important}
  body.editing .controlsScroll{overflow:visible!important;max-height:none!important;padding:0 12px 12px!important}
  body.editing .controlSaveFooter{order:4!important;min-height:92px!important;padding:12px!important}
  body.editing .saveFooterButtons .saveBtn{height:46px!important}
  body.editing.is-image .previewActions{min-height:74px!important;grid-template-rows:auto auto!important}
  body.editing.is-image .previewActions:after{justify-self:center}
  .gpWorkflow{width:calc(100% - 24px);margin-top:18px;grid-template-columns:minmax(0,1fr);gap:18px}
  .gpWorkflowCopy{padding:20px 16px}
  .gpSectionHeading h2{font-size:20px;margin-bottom:20px}
  .gpSteps{grid-template-columns:1fr;gap:20px}
  .gpSteps h3{font-size:15px}
  .gpSteps p{font-size:12px}
  .gpAdCard{width:320px;min-height:100px;justify-self:center;border-radius:8px;max-width:100%}
  .gpAdDesktop{display:none!important}.gpAdMobile{display:inline-block!important}
  .toolContentLayer{padding-top:26px!important}
  .row input[type=range]{min-height:34px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* v2: one automatic action, clear section rhythm and stable direct manipulation. */
body.editing .controlsHead{border-bottom:1px solid #34404a!important;background:#151b20!important;padding:18px 16px 16px!important}
body.editing .controlsHead .kicker{font-size:9px!important;letter-spacing:.14em;color:#75d8a7!important}
body.editing .controlsScroll{padding:14px 12px!important;background:#151b20!important}
body.editing .controlsScroll>.group,
body.editing .controlsScroll>.adv,
body.editing #videoEditGroup>.veFold:not(.rightTrimFold){
  margin:0 0 12px!important;padding:14px 12px!important;
  border:1px solid #35424c!important;border-radius:10px!important;
  background:#1a2229!important;box-shadow:none!important;
}
body.editing .controlsScroll>.adv,
body.editing #videoEditGroup>.veFold:not(.rightTrimFold){padding:0!important}
body.editing .controlsScroll>.group .groupTitle{margin:0 0 12px!important;padding:0!important;border:0!important}
body.editing .controlsScroll .groupTitle h3{font-size:13px!important;color:#edf3f6!important;letter-spacing:-.01em}
body.editing .controlsScroll .groupTitle>span{display:none!important}
body.editing .controlsScroll>.adv>summary,
body.editing #videoEditGroup>.veFold>summary{min-height:46px!important;padding:14px 12px!important;font-size:12px!important;font-weight:750!important;color:#cfdae2!important;border:0!important;background:transparent!important;line-height:1.4}
body.editing .controlsScroll>.adv[open]>summary,
body.editing #videoEditGroup>.veFold[open]>summary{border-bottom:1px solid #35424c!important;color:#83e1b1!important}
body.editing .adv .row{padding:5px 10px!important;margin:4px 0!important}
body.editing .row{min-height:36px;grid-template-columns:100px minmax(0,1fr) 43px!important;gap:8px!important}
body.editing .row label{font-size:11px!important;color:#c0ced8!important}
body.editing .row output{font-size:11px!important;font-variant-numeric:tabular-nums}
body.editing .fineMore{margin:8px 10px!important;border-top:1px solid #35424c!important;padding:6px 0!important;background:transparent!important}
body.editing .fineMore>summary{padding:9px 0!important;font-size:11px!important;color:#a9bdca!important;cursor:pointer}
body.editing .fineMore .row{padding:4px 0!important;grid-template-columns:110px minmax(0,1fr) 37px!important}
body.editing #videoEditGroup{display:contents!important}
body.editing #videoEditGroup>.groupTitle,
body.editing .controlsScroll .keyStateLine[hidden],
body.editing .veActionRow,
body.editing .statusNote,
body.editing .controlsHead p{display:none!important}
body.editing .engineMode{grid-template-columns:1fr 1fr!important;gap:7px!important}
body.editing .engineModeBtn{height:44px!important;min-height:44px!important;border-radius:7px!important;padding:5px 8px!important}
body.editing .quickActions{margin:12px 0!important;grid-template-rows:44px 38px!important}
body.editing .quickActions .eyeHero{height:44px!important;min-height:44px!important;padding:0 10px!important;border-radius:7px!important;justify-content:flex-start!important}
body.editing .quickActionsSide .btn{height:38px!important;min-height:38px!important;border-radius:7px!important}
body.editing .eyeHeroCopy small{display:none!important}
body.editing .quickKeyLine{display:grid!important;grid-template-columns:32px minmax(70px,1fr) minmax(90px,1.2fr)!important;gap:7px!important;margin:14px 0 12px!important}
body.editing .quickKeyLabel{grid-column:1/-1!important;font-size:11px!important;color:#bacbd6!important;margin-bottom:2px}
body.editing #keyColor{width:32px!important;height:34px!important;padding:3px!important;border-radius:6px!important}
body.editing .keyHex,body.editing .addKeyBtn{height:34px!important;min-height:34px!important;white-space:nowrap!important;border-radius:6px!important;font-size:10px!important}
body.editing .keyDots:not(:has(.keyDot:not(.main))){display:none!important}
body.editing .aiRefineLine{margin:12px 0 8px!important;min-height:42px!important;border:0!important;border-top:1px solid #35424c!important;border-bottom:1px solid #35424c!important;border-radius:0!important;padding:8px 0!important;background:transparent!important}
body.editing .aiRefineCopy b{font-size:11px!important}
body.editing .aiRefineBtn{height:32px!important;min-width:78px!important;padding:0 10px!important;font-size:11px!important;border-radius:6px!important}
body.editing.is-image .aiRefineLine,body.editing.is-image .aiStrengthRow{display:none!important}
body.editing .heroRow{margin:8px 0!important;padding:0!important}
body.editing .segment{padding:3px!important;border:1px solid #35424c!important;border-radius:8px!important;background:#111920!important;gap:4px!important}
body.editing .segment .seg{min-width:0!important;height:34px!important;min-height:34px!important;border-radius:5px!important;padding:0 4px!important;font-size:11px!important;white-space:nowrap!important}
body.editing .veFoldBody{padding:12px!important}
body.editing .veLabel>span{display:none!important}
body.editing .veAspect button{height:32px!important;font-size:10px!important}
body.editing .veTwo{gap:8px!important;margin-top:10px!important}
body.editing .veTwo label{font-size:11px!important;color:#b0c2ce!important}
body.editing .veTwo select{height:32px!important;font-size:11px!important}
body.editing .veTransformHead{margin-top:12px!important}
body.editing .veTransformHead b{font-size:11px!important;color:#b0c2ce!important}
body.editing .veTransformHead button{height:28px!important;font-size:10px!important}
body.editing.is-video .previewFrame.eye-mode #editCanvas,
body.editing.is-image .previewFrame.eye-mode #editCanvas{display:block!important;pointer-events:auto!important;cursor:crosshair!important}
body.editing.is-video .previewFrame.eye-mode #glCanvas,
body.editing.is-image .previewFrame.eye-mode #glCanvas{opacity:0!important;pointer-events:none!important}
body.editing .editorGuideFree strong{height:auto!important;min-height:50px!important;font-size:24px!important;line-height:1.15!important;padding:12px 18px!important;border:1px solid #53b984!important;border-radius:11px!important;background:#173d2b!important;color:#b0f2ce!important;box-shadow:0 0 0 4px rgba(73,180,125,.07)!important}
body:not(.editing) .introCopyText{min-width:0;width:100%}
body:not(.editing) .introCopyText h1{font-size:clamp(28px,1.8vw,36px)!important;line-height:1.22!important;letter-spacing:-.04em!important;word-break:keep-all!important;text-wrap:balance}
body:not(.editing) .introCopyText p{font-size:13px!important;line-height:1.8!important;color:#a8bac7!important}
body:not(.editing) .freePromise{justify-content:flex-start!important;margin:18px 0!important}
body:not(.editing) .freePromise strong{height:auto!important;min-width:0!important;padding:12px 19px!important;border:1px solid #53b984!important;border-radius:11px!important;font-size:clamp(22px,1.5vw,29px)!important;font-weight:900!important;line-height:1.15!important;background:#173d2b!important;color:#b0f2ce!important;box-shadow:0 0 0 4px rgba(73,180,125,.07)!important}
.gpWorkflowCopy{border-color:#35424c!important;background:#172028!important}
body:not(.editing) .gpWorkflow{grid-template-columns:minmax(0,1fr)}
.toolContentLayer{background:#10171d!important;border-top:1px solid #35424c!important;padding-top:36px!important}
.toolOverviewLead h2{color:#f0f5f8!important;font-size:clamp(24px,2vw,32px)!important;line-height:1.25!important}
.toolOverviewLead p{color:#acbdc9!important;font-size:14px!important;line-height:1.8!important;max-width:760px}
.capabilityGrid{gap:14px!important}
.capabilityCard{background:#19232b!important;border:1px solid #35424c!important;border-radius:12px!important;padding:22px!important}
.capabilityCard strong{font-size:17px!important;color:#edf4f8!important}
.capabilityCard p{font-size:13px!important;line-height:1.8!important;color:#a5b9c7!important}
.faqSection{margin-top:42px!important}
.faqGrid{display:grid!important;grid-template-columns:1fr 1fr!important;gap:12px!important;align-items:start!important}
.faqGrid .faqItem{margin:0!important;padding:17px 18px!important;border:1px solid #35424c!important;border-radius:10px!important;background:#19232b!important;box-shadow:none!important}
.faqGrid .faqItem summary{font-size:14px!important;font-weight:700!important;color:#dfeaf0!important;line-height:1.5!important}
.faqGrid .faqItem p{font-size:13px!important;color:#acbdc9!important;line-height:1.85!important;margin:14px 0 0!important}
.relatedHeader{margin-top:42px!important;border-top:1px solid #35424c!important}
.relatedTools .toolCard{border-color:#35424c!important;background:#19232b!important}
.relatedTools .toolCard p{color:#a5b9c7!important;font-size:12px!important}
@media(min-width:901px){
  body:not(.editing) .introCopy{display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:space-between!important;padding:26px 20px 18px!important;gap:24px!important;overflow-y:auto!important;text-align:left!important}
  body:not(.editing) .introCopyText{margin-block:auto!important}
  body:not(.editing) .introCopy h1,body:not(.editing) .introCopy p,body:not(.editing) .brandLine{text-align:left!important}
  body:not(.editing) .introCopy>.gpAdCard{flex:0 0 250px!important;align-self:center!important;margin:0!important;min-height:250px!important;width:300px!important;border-radius:8px!important;outline:1px solid #35424c!important}
  body.editing .gpWorkflow>.gpAdCard{border-radius:8px!important;outline:1px solid #35424c!important}
  .toolShell{border-bottom:1px solid #35424c!important}
  .toolRail{border-right:1px solid #35424c!important}
  body.editing .editorGuide{border-right:1px solid #35424c!important}
  body.editing .controls,body.editing .controlSaveFooter{border-left:1px solid #35424c!important}
  body.editing .editorTop,body.editing .previewActions,body.editing .controlSaveFooter{border-top:1px solid #35424c!important;background:#171e24!important}
}
@media(max-width:900px){
  body:not(.editing) .freePromise{justify-content:center!important}
  body.editing .controlsScroll{padding:12px!important}
  body.editing .row{grid-template-columns:100px minmax(0,1fr) 43px!important}
  .faqGrid{grid-template-columns:1fr!important}
  .capabilityCard{padding:18px!important}
  .faqGrid .faqItem{padding:16px!important}
  .toolOverviewLead p{font-size:13px!important}
}

body.editing.is-video .bottomTrimTimes.videoEditOnly{display:flex!important;align-items:center!important;justify-content:space-between!important;bottom:0!important;height:18px!important}
body.editing.is-video .bottomTrimTimes .bottomTrimDuration{position:absolute!important;left:50%!important;transform:translateX(-50%)!important}
@media(min-width:901px){
  body.editing .editorGuide{grid-row:1!important}
  body.editing .editorTop{grid-column:1!important;grid-row:2!important;height:100%!important;min-height:114px!important;border-left:0!important;border-right:1px solid #35424c!important;padding:12px!important}
  body.editing .editorTopActions{height:86px!important;display:grid!important;grid-template-columns:1fr 1fr!important;grid-template-rows:40px 40px!important;gap:6px!important}
  body.editing .editorTopActions .historyBtn,body.editing .editorTopActions>.resetFile{height:40px!important;min-height:40px!important;font-size:11px!important}
  body.editing .historyBtn b{font-size:11px!important}
  body.editing .previewActions,body.editing .controlSaveFooter{height:100%!important;min-height:114px!important}
}
/* Explicit grid slots prevent the legacy mobile 3/5 span creating an extra column. */
body.editing .quickKeyLine .quickKeyLabel{grid-column:1/-1!important;grid-row:1!important}
body.editing .quickKeyLine #keyColor{grid-column:1!important;grid-row:2!important}
body.editing .quickKeyLine #keyHex{grid-column:2!important;grid-row:2!important}
body.editing .quickKeyLine #eyeAddBtn{grid-column:3!important;grid-row:2!important}
body.editing .segment.four{grid-template-columns:repeat(4,minmax(0,1fr))!important}
/* The checker belongs to the image bounds, not the surrounding thumbnail card. */
.batchCompare.result{background:#20252a!important;background-image:none!important}
.batchCompare img{width:auto!important;height:auto!important;max-width:100%!important;max-height:154px!important;object-fit:contain!important}
.batchCompare.result img{background-color:#31383e;background-image:repeating-conic-gradient(#31383e 0 25%,#46515a 0 50%);background-size:16px 16px;background-position:0 0}
.batchResultState.needs-review{color:#ffdc91!important;background:#382d18!important;border-color:#826a35!important}
.gpExportChoices{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:18px 0 0}
.gpExportChoices article{padding:22px;border:1px solid #385348;border-radius:12px;background:#15251f}
.gpExportChoices article+article{border-color:#3c5264;background:#18232d}
.gpExportChoices span{font-size:10px;letter-spacing:.13em;font-weight:800;color:#8cddb4}
.gpExportChoices article+article span{color:#9cc9ed}
.gpExportChoices h3{font-size:19px;margin:10px 0;color:#edf5f8}
.gpExportChoices p{font-size:13px;line-height:1.8;color:#acc0cd;margin:0}
@media(max-width:900px){.gpExportChoices{grid-template-columns:1fr}.gpExportChoices article{padding:18px}}

/* Clear AI states and equal transport control geometry. */
body.editing #aiRefineBtn{background:#20272e!important;border-color:#53616c!important;color:#b8c3cc!important}
body.editing #aiRefineBtn.active{background:#35d58a!important;border-color:#35d58a!important;color:#062317!important}
body.editing #aiRefineBtn:disabled{background:#20272e!important;border-color:#46525d!important;color:#84929e!important;opacity:.65!important}
body.editing .transportCluster{gap:5px!important}
body.editing .transportCluster .transportBtn{box-sizing:border-box!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;width:36px!important;min-width:36px!important;height:36px!important;min-height:36px!important;padding:0!important;line-height:1!important;font-size:18px!important}
body.editing .transportCluster #playBtn{font-size:11px!important}
body.editing .transportIcon{display:block;width:20px!important;height:20px!important;flex:none;pointer-events:none}

/* Minimal tool navigation: persistent rail and reversible bottom toggle. */
.toolRailBrand{display:flex!important;align-items:center;justify-content:center;text-decoration:none}
.toolRailMore{position:absolute!important;left:7px!important;bottom:10px!important;width:40px!important;height:38px!important;margin:0!important;z-index:3}
.toolRail.open .toolRailMore{margin:0!important}
.toolRailPanelHead{margin-bottom:14px!important}
.toolRailSection{gap:8px!important}
.toolRailSection>a{display:flex!important;align-items:center;justify-content:space-between;min-height:48px!important;padding:12px!important;border:1px solid #35424c!important;border-radius:8px;font-size:13px!important}
.toolRailSection>a.active{color:#89e8b7!important;background:#192c24!important;border-color:#3f765b!important}
.toolRailSection em{font-size:10px!important;color:#89e8b7!important}
@media(min-width:901px){
 .toolRail,.toolRail.open{width:56px!important;overflow:visible!important;box-shadow:none!important;transition:none!important}
 .toolRailPanel{position:absolute!important;left:56px!important;top:56px!important;bottom:var(--rail-footer-height,114px)!important;width:var(--hm-side)!important;box-sizing:border-box!important;display:none!important;padding:20px 16px!important;background:#151d23!important;border-right:1px solid #35424c!important;border-bottom:1px solid #35424c!important;overflow:auto!important}
 .toolRail.open .toolRailPanel{display:block!important}
 body.tool-nav-open .studioHeader,body.tool-nav-open:not(.editing) .introGrid,body.tool-nav-open.editing .editorArea{left:56px!important}
 body.tool-nav-open:not(.editing) .introCopy,body.tool-nav-open.editing .editorGuide{visibility:hidden!important}
}
@media(max-width:900px){
 .toolRailPanel{padding:20px 14px 68px!important}
 .toolRailMore{width:40px!important}
}

@media(min-width:901px){.toolRail::after{content:"";position:absolute;left:0;right:0;bottom:var(--rail-footer-height,114px);border-top:1px solid #35424c;pointer-events:none}}

/* Push the left context only; the rail, ad and workspace retain their positions. */
@media(min-width:901px){
 body:not(.editing) .introCopy,body.editing .editorGuide{position:relative!important;overflow:hidden!important;visibility:visible!important;isolation:isolate}
 body.editing .editorGuide{padding-bottom:286px!important}
 body.editing .editorGuideInner{height:100%!important;min-height:0!important;box-sizing:border-box!important;overflow-y:auto!important}
 body.editing .editorGuide>.gpAdCard{position:absolute!important;left:50%!important;bottom:18px!important;transform:translateX(-50%)!important;width:300px!important;height:250px!important;min-height:250px!important;margin:0!important;z-index:4;outline:1px solid #35424c!important;border-radius:8px!important}
 .introCopyText,.editorGuideInner{transition:transform .24s ease!important}
 body.tool-nav-open .introCopyText,body.tool-nav-open .editorGuideInner{transform:translateX(calc(var(--hm-side) + 40px))!important;pointer-events:none}
 .toolRailPanel{display:block!important;bottom:calc(var(--rail-footer-height,114px) + 286px)!important;transform:translateX(calc(-100% - 56px));visibility:hidden;pointer-events:none;transition:transform .24s ease,visibility 0s .24s!important;border-bottom:0!important}
 .toolRail.open .toolRailPanel{display:block!important;transform:translateX(0);visibility:visible;pointer-events:auto;transition:transform .24s ease,visibility 0s!important}
 .toolRailBrand,.toolRailMore{z-index:5}
 .toolRail::before{content:"";position:absolute;inset:0;background:#13171a;z-index:2;pointer-events:none}
}
@media(prefers-reduced-motion:reduce){.introCopyText,.editorGuideInner,.toolRailPanel{transition:none!important}}

@media(min-width:901px){body.tool-nav-open.editing .editorGuide,body.tool-nav-open:not(.editing) .introCopy{visibility:visible!important}}

/* Fluorescent coral-red accent belongs only to transparent WebM export. */
body.editing.is-video .saveFooterButtons #snapBtn{background:#ff4d5e!important;border-color:#ff7b87!important;color:#26090e!important;box-shadow:0 0 14px #ff4d5e38;font-weight:900!important}
body.editing.is-video .saveFooterButtons #snapBtn:hover{background:#ff6978!important;border-color:#ff99a3!important}
body.editing.is-video .saveFooterButtons #snapBtn:focus-visible{outline:2px solid #ffc3ca!important;outline-offset:3px}
.layerFeature{display:flex;align-items:flex-start;gap:8px;margin:10px 0 0;padding:9px 0 0;border-top:1px solid #35424c}
.layerFeatureBadge{flex:none;color:#ffac91;font-size:8px;font-weight:900;letter-spacing:.06em;border:1px solid #84503d;border-radius:4px;padding:4px;background:#33221d}
.layerFeature p{margin:0;color:#b5c3cc;font-size:10px;line-height:1.65;word-break:keep-all}
.toolMenuName{min-width:0;flex:1}
.toolMenuThumb:not([hidden]){display:block;flex:0 0 72px;aspect-ratio:16/9;overflow:hidden;border-radius:5px;background:#26333c}
.toolMenuThumb img{width:100%;height:100%;display:block;object-fit:cover}
.toolRailSection>a{gap:10px}

.railQuickTools{position:relative;z-index:5;display:grid;gap:8px;padding:14px 5px}
.railQuickTool{width:44px;min-height:66px;border:1px solid #35424c;border-radius:7px;background:#182128;color:#b9c9d5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;cursor:pointer}
.railQuickTool svg{width:20px;height:20px}
.railQuickTool span{font:700 9px/1.3 Pretendard,sans-serif;word-break:keep-all}
.railQuickTool:hover,.railQuickTool[aria-expanded=true]{background:#23372e;border-color:#4e9b74;color:#9bf1c3}
.railQuickTool:focus-visible{outline:2px solid #9bf1c3;outline-offset:2px}
.toolRailSection>a.menu-focus{outline:2px solid #6ce3a3;outline-offset:2px}
@media(min-width:901px){body.editing .editorGuide{padding-bottom:0!important}body.editing .toolRailPanel{bottom:var(--rail-footer-height,114px)!important}}
@media(max-width:900px){.railQuickTools{display:flex;padding:12px}.railQuickTool{width:76px}}

/* One geometry for rail, selection and native range thumbs, at every viewport. */
body.editing.is-video .timelineEditWrap{height:44px!important}
body.editing.is-video .timelineEditWrap .timeline{left:8px!important;right:8px!important;top:7px!important;height:20px!important;box-sizing:border-box!important;border:1px solid #43535e!important;border-radius:4px!important;background:#233039!important}
body.editing.is-video .timelineEditWrap .timelineFill{background:transparent!important;opacity:1!important;overflow:visible}
body.editing.is-video .timelineFill::after{content:'';position:absolute;right:0;top:0;bottom:0;width:2px;background:#e3f6ed;pointer-events:none}
body.editing.is-video .bottomTrimSelected{top:7px!important;height:20px!important;box-sizing:border-box!important;border:1px solid #35d58b;border-radius:4px;background:#35d58b20;box-shadow:none}
body.editing.is-video .timelineEditWrap::after{content:'';position:absolute;left:12px;right:12px;top:10px;height:14px;z-index:2;pointer-events:none;background:repeating-linear-gradient(90deg,#0d151b99 0 4px,transparent 4px 14px) left top/14px 2px repeat-x,repeating-linear-gradient(90deg,#0d151b99 0 4px,transparent 4px 14px) left bottom/14px 2px repeat-x}
body.editing.is-video .bottomTrimHandle{height:34px!important}
body.editing.is-video .bottomTrimHandle::-webkit-slider-runnable-track{height:20px}
body.editing.is-video .bottomTrimHandle::-webkit-slider-thumb{box-sizing:border-box;width:16px;height:20px;margin-top:0;border:1px solid #5de5a2;border-radius:4px;background:linear-gradient(90deg,transparent 6px,#83eab7 6px 8px,transparent 8px),#173e2b;box-shadow:none}
body.editing.is-video .bottomTrimHandle::-moz-range-track{height:20px}
body.editing.is-video .bottomTrimHandle::-moz-range-thumb{box-sizing:border-box;width:16px;height:20px;border:1px solid #5de5a2;border-radius:4px;background:linear-gradient(90deg,transparent 6px,#83eab7 6px 8px,transparent 8px),#173e2b}
body.editing.is-video .bottomTrimTimes.videoEditOnly{height:16px!important}
.backgroundSizeControl[hidden]{display:none!important}
.backgroundSizeControl{margin-top:12px;padding-top:12px;border-top:1px solid #35424c}
.backgroundSizeHead{display:flex;align-items:center;gap:10px;font-size:11px;color:#c3d0da}
.backgroundSizeHead label{flex:1;font-weight:700}
.backgroundSizeHead output{color:#7ce4ac;font-variant-numeric:tabular-nums;min-width:36px;text-align:right}
.backgroundSizeHead button{height:28px;padding:0 10px;border:1px solid #42515c;border-radius:5px;background:#202b32;color:#d6e1e8;font:inherit;cursor:pointer}
.backgroundSizeHead button:focus-visible{outline:2px solid #7ce4ac;outline-offset:2px}
.backgroundSizeControl input[type=range]{display:block;width:100%;height:26px;margin:7px 0 0;accent-color:#35d58b;cursor:ew-resize}

.layerMoveTabs{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-top:8px}
.layerMoveTabs button{height:32px;border:1px solid #3b4a55;border-radius:5px;background:#172027;color:#aebfcd;font:700 11px Pretendard,sans-serif;cursor:pointer}
.layerMoveTabs button[aria-pressed=true]{border-color:#45bb83;background:#183c2c;color:#8af0bc}
.layerMoveTabs button:focus-visible{outline:2px solid #8af0bc;outline-offset:2px}