/* Web edition: the original Clipjoin palette and editor, with account and credit flows. */
:root{--border:#e2e4db;--muted:#6a7165;--green:#314b2e;color-scheme:light}html{scroll-behavior:smooth;scroll-padding-top:24px}body{background:#f7f6f2}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #8da47e;outline-offset:4px}.shell{max-width:1240px}.masthead{height:94px;gap:26px}.brand{font-size:26px;letter-spacing:-1.25px;flex-shrink:0}.brand-dot{margin-left:-9px}.main-nav{display:flex;gap:27px;margin-right:auto;margin-left:36px;font-size:12px;color:#697260}.main-nav button{border:0;background:none;color:inherit;padding:0;font-size:inherit}.main-nav a:hover,.main-nav button:hover{color:#253b24}.account-nav{display:flex;align-items:center;gap:14px}.nav-signin{font-size:12px;background:none;border:0;color:#344a2e;padding:10px 0 10px 12px;white-space:nowrap}.nav-signin span{margin-left:12px}.credit-balance{display:flex;align-items:center;gap:8px;padding:9px 11px;border:1px solid #d4ddcc;background:#eef2e8;color:#344d2e;border-radius:4px;font-size:11px;white-space:nowrap;font-variant-numeric:tabular-nums}.credit-symbol{font-size:16px}.balance-plus{border-left:1px solid #cbd5c1;padding-left:10px;margin-left:4px;font-size:16px}.avatar{width:33px;height:33px;display:grid;place-items:center;border:1px solid #cdd4c5;color:#46543c;background:transparent;border-radius:50%;font-size:12px;font-weight:600}.intro{padding-top:55px;padding-bottom:42px}h1{font-size:clamp(38px,4.4vw,56px);letter-spacing:-2.4px;line-height:1.1;text-wrap:balance}.intro-copy{font-size:15px;line-height:1.6}.intro-note{font-size:11px;line-height:1.9}.workspace{gap:42px}.section-heading h2{font-size:14px}.drop-zone{min-height:239px;border-radius:5px;background:#edf0e6}.drop-zone small{font-size:10px;line-height:1.6}.drop-zone strong{font-size:15px}.drop-zone .add-mark{font-size:34px;margin-bottom:9px}.preview-stage{min-height:239px;max-height:480px;aspect-ratio:16/9!important;background:#273025}.preview-stage.portrait{aspect-ratio:16/9!important}.preview-empty p{font-size:23px}.preview-empty span{font-size:11px}.clip-row{border-color:#e2e4dc}.clip-title{font-size:12px}.clip-details{font-size:10px}.clip-list{max-height:540px;overflow:auto;scrollbar-width:thin}.finish-panel{padding:25px 28px 28px;margin-top:34px;background:#fdfdf9;border-color:#e1e4d9}.export-settings{gap:55px}.format-options{display:flex;align-items:start;gap:32px}.auto-ratio .filename-label{margin-bottom:8px}.auto-ratio strong{font-size:14px;font-weight:550}.ratio-value{font-size:10px;color:#747e6c;margin-left:8px}.quality-option{margin-left:auto}.quality-option select{appearance:none;-webkit-appearance:none;background-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2343533a' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:16px;border:1px solid #dce0d6;border-radius:3px;padding:8px 34px 8px 11px;min-height:36px;line-height:18px;font-size:11px;color:#43533a;max-width:150px;cursor:pointer}.quality-option select:disabled{cursor:default;opacity:.5}@media(forced-colors:active){.quality-option select{appearance:auto;background-image:none}}.options{gap:21px}.option small{font-size:11px;max-width:350px}.option strong{font-size:12px}.filename-field{height:39px}.filename-field input{font-size:12px}.export-price{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#687460;margin:17px 0 12px;min-height:18px}.export-price strong{font-size:13px;font-weight:600;color:#344a2e;font-variant-numeric:tabular-nums}.primary-button{font-size:12px;min-height:43px}.primary-button>span:first-child{font-size:inherit}.credit-promise{color:#5d7550!important;margin-top:4px!important}.small-note{font-size:11px}.privacy-note{display:flex;justify-content:center;align-items:center;gap:8px;color:#7e8576;font-size:10px;line-height:1.7;margin:18px 0 0}.privacy-note svg{flex-shrink:0}.upload-status{margin-top:16px;font-size:11px;color:#5c6e50}.upload-status>div{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}.upload-status #import-label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.upload-status progress{height:4px;width:100%;accent-color:#667f53}progress{accent-color:#536e44}.job-panel{border-top:1px solid #e1e5d8;margin-top:24px}.history-section{margin-top:42px}.history-row{display:flex;gap:16px;align-items:center;padding:16px 0;border-top:1px solid #e0e3d8}.history-icon{display:grid;place-items:center;width:35px;height:40px;background:#e9eee0;color:#5b704e;border-radius:3px;font-size:15px;flex-shrink:0}.history-info{min-width:0;flex:1}.history-info strong{font-size:12px;font-weight:550;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.history-info p{font-size:10px;color:#7c8473;margin:6px 0 0;line-height:1.5}.history-actions{display:flex;gap:16px;align-items:center}.history-actions a,.history-actions button{font-size:11px}.history-actions .icon-button{font-size:18px}.how-section{display:grid;grid-template-columns:1.1fr 1fr;gap:72px;border-top:1px solid #dfe3d6;padding:55px 0 42px;margin-top:64px}.how-intro h2{font:400 clamp(27px,3vw,35px)/1.2 Georgia,serif;letter-spacing:-1px;display:block}.how-intro>p:last-child{font-size:12px;line-height:1.8;color:#77816c;max-width:280px;margin-top:18px}.how-steps{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:24px}.how-steps li{display:flex;gap:19px}.how-steps li>span{font:10px var(--mono);color:#87967a;padding-top:3px}.how-steps h3{font-size:13px;font-weight:550;margin:0 0 6px}.how-steps p{font-size:11px;color:#78836d;margin:0;line-height:1.8;max-width:350px}footer{display:flex;align-items:center;gap:22px;border-top:1px solid #dfe3d6;padding-top:24px;margin-top:0}footer .footer-brand{font-size:16px;letter-spacing:-.6px;font-weight:650;color:#506245}footer p{font-size:10px;margin-right:auto}footer nav{display:flex;gap:18px;align-items:center}footer nav a,footer nav button{font-size:10px;color:#717b65}.preview-banner{display:flex;justify-content:center;gap:16px;align-items:center;padding:8px 20px;background:#e8eddc;border-bottom:1px solid #dae2cc;font-size:10px;letter-spacing:.2px;color:#526447}.preview-banner span{color:#7b866e}.skip-link{position:fixed;top:-100px;left:20px;z-index:5;padding:12px 20px;background:#263925;color:#fff}.skip-link:focus{top:12px}.dialog{width:calc(100% - 32px);max-width:460px;border:1px solid #d7dfcc;background:#f9faf5;color:#2c3527;padding:37px 34px 32px;border-radius:9px;box-shadow:0 20px 100px #202b2430;max-height:calc(100dvh - 40px);overflow:auto}.dialog::backdrop{background:#19281960;backdrop-filter:blur(4px)}.dialog h2{font:400 32px/1.12 Georgia,serif;letter-spacing:-1px;display:block;margin:0 0 14px}.dialog .eyebrow{font-size:9px;margin-right:20px;line-height:1.6}.dialog-close{position:absolute;top:12px;right:15px;width:30px;height:30px;border:0;background:transparent;font-size:25px;font-weight:300;color:#7d8b6f}.dialog-intro{font-size:12px;line-height:1.8;color:#738266;margin:0 0 24px}.dialog form label{display:flex;flex-direction:column;gap:8px;font-size:11px;margin-top:17px;color:#4e5c43}.dialog input{width:100%;min-width:0;border:1px solid #d7dfcc;background:#fff;border-radius:4px;height:42px;padding:10px 12px;font-size:13px;color:#283b21}.dialog form>.primary-button{width:100%;margin-top:22px}.auth-switch{font-size:11px;color:#7b866e;margin:19px 0 12px}.auth-switch button{background:none;border:0;color:#3c5a2e;font-size:11px;padding:0 0 0 5px;text-decoration:underline;text-underline-offset:3px}.dialog .small-note a{text-decoration:underline;text-underline-offset:2px}.form-error{font-size:12px;line-height:1.6;color:#9b4036;background:#f7eae3;border:1px solid #e9cfc0;padding:10px 12px;border-radius:4px;margin:15px 0}.credits-dialog{max-width:600px;padding:38px}.credit-packs{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:27px 0 15px}.credit-pack{border:1px solid #dce4d1;background:#f0f4e8;border-radius:5px;padding:22px 20px;display:flex;flex-direction:column}.credit-pack>span{font:10px var(--mono);color:#7b8a6d;margin-bottom:16px}.credit-pack h3{font:400 37px Georgia,serif;letter-spacing:-1.5px;margin:0 0 3px}.credit-pack h3 small{font:12px -apple-system,BlinkMacSystemFont,sans-serif;letter-spacing:0}.credit-pack p{font-size:11px;color:#75826a;margin:9px 0 22px}.credit-pack .primary-button{margin-top:auto;font-size:11px;min-height:39px;padding:10px 12px;gap:8px}.credit-pack .primary-button>span{font-size:14px}.payment-note{font-size:11px;line-height:1.7;color:#7b846f}.credit-explainer{border-top:1px solid #dce4d1;margin-top:23px;padding-top:22px}.credit-explainer strong{font-size:12px;font-weight:550}.credit-explainer p{font-size:11px;color:#77856a;line-height:1.8;margin:8px 0 0}.account-credit-summary{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #dce4d1;border-bottom:1px solid #dce4d1;padding:20px 0;font-size:12px}.account-credit-summary strong{font:28px Georgia,serif}.account-actions{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:24px}.credit-activity{border-top:1px solid #dce4d1;padding-top:20px;margin-top:25px;font-size:11px;color:#687c5b}.credit-activity summary{cursor:pointer}.activity-row{display:flex;justify-content:space-between;gap:15px;border-bottom:1px solid #e3e8db;padding:12px 0;line-height:1.7}.activity-row span{font-variant-numeric:tabular-nums}.activity-row small{display:block;font-size:10px;color:#87907d}#recovery-code{width:100%;padding:14px;border:1px solid #d7dfcc;border-radius:4px;background:#eef2e6;font:12px/1.7 var(--mono);resize:none;color:#405536;overflow-wrap:anywhere}#copy-recovery{margin:12px 0 23px}#recovery-done{width:100%;font-size:11px}.confirm-actions{display:flex;gap:12px;justify-content:flex-end}.secondary-button{border:1px solid #ccd6c0;background:transparent;border-radius:4px;color:#536649;padding:12px 17px;font-size:12px}.legal-page{max-width:720px;margin:65px auto 90px;padding:0 26px}.legal-page .brand{margin-bottom:55px}.legal-page h1{font-size:42px}.legal-page h2{display:block;font-size:17px;margin:30px 0 10px}.legal-page p,.legal-page li{font-size:14px;line-height:1.85;color:#66735c}.legal-page a{text-decoration:underline;text-underline-offset:3px}.legal-page .legal-note{padding:14px 17px;background:#eef1e7;border:1px solid #dce3d0;border-radius:4px;font-size:12px}.result-panel{background:#edf3e5}.result-panel p{overflow-wrap:anywhere}.history-row:has(.text-button:focus-visible){outline-offset:2px}@media(max-width:850px){.shell{padding:0 30px}.main-nav{margin-left:10px;gap:18px}.workspace{gap:27px}.export-settings{gap:30px}.format-options{gap:15px;flex-wrap:wrap}.quality-option{margin-left:0}.preview-stage,.drop-zone{min-height:215px}.how-section{gap:40px}.privacy-note{justify-content:flex-start}.ratio-value{display:block;margin:5px 0 0}}@media(max-width:640px){.shell{padding:0 20px}.masthead{height:82px;gap:12px}.brand{font-size:23px;gap:7px}.brand svg{width:25px}.main-nav{display:none}.account-nav{margin-left:auto;gap:10px}.credit-balance{font-size:10px;padding:7px 8px;gap:5px}.balance-plus{padding-left:7px;margin-left:1px}.intro{padding-top:35px;padding-bottom:30px;display:block}.intro h1{font-size:42px;letter-spacing:-1.9px}.intro-note{display:none}.intro-copy{font-size:13px}.workspace{grid-template-columns:1fr;gap:29px}.drop-zone{min-height:190px}.drop-zone.compact{min-height:93px}.preview-stage{min-height:190px}.preview-panel .section-heading{margin-bottom:15px}.export-settings{grid-template-columns:1fr;gap:26px}.finish-panel{padding:22px 20px;margin-top:29px}.options{gap:19px}.format-options{gap:35px}.ratio-value{display:inline;margin-left:8px}.export-action{border-top:1px solid #e0e5d8;padding-top:23px}.privacy-note{align-items:flex-start;font-size:10px;margin-top:15px}.privacy-note svg{margin-top:3px}.how-section{grid-template-columns:1fr;gap:30px;padding-top:35px;margin-top:43px}.how-intro h2{font-size:31px}.how-intro>p:last-child{max-width:340px}.how-steps{gap:21px}.history-actions{gap:12px}.history-info p{font-size:9px}.history-icon{display:none}footer{flex-wrap:wrap;gap:12px;padding-bottom:25px}footer>p{font-size:9px}footer>nav{flex-basis:100%;gap:20px;margin-top:5px}.preview-banner{font-size:9px;padding:7px 12px;gap:10px}.credits-dialog,.dialog{padding:32px 23px 26px}.dialog h2{font-size:30px}.credit-packs{gap:10px}.credit-pack{padding:18px 13px}.credit-pack h3{font-size:32px}.credit-pack .primary-button{font-size:10px}.credit-pack>span{font-size:9px}}@media(max-width:380px){.brand{font-size:21px}.brand svg{display:none}.account-nav{gap:7px}.avatar{width:28px;height:28px}.credit-symbol{display:none}.intro h1{font-size:36px}.credit-packs{grid-template-columns:1fr}.credit-pack{padding:20px}.format-options{gap:20px}.history-actions{gap:8px}.preview-banner{flex-wrap:wrap;gap:3px 10px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

/* AI-scene workflow and the one-export trial. */
.intro>div{min-width:0}.intro-copy{max-width:42rem;text-wrap:pretty}.intro-trial{margin-top:24px;display:flex;flex-direction:column;align-items:flex-start;gap:9px}.intro-trial .primary-button{gap:34px}.intro-trial p{margin:0;font-size:10px;line-height:1.6;color:#6a7761}.intro-note{max-width:210px;align-self:center}.trial-export-note{color:#435b35;line-height:1.7;margin-top:12px!important}.trial-summary{padding:12px 14px;background:#edf2e5;border:1px solid #d9e2ce;border-radius:4px;font-size:11px;line-height:1.7;color:#4d6340}.intro h1{max-width:760px}@media(max-width:600px){.intro-trial .primary-button{min-width:230px}.intro-trial p{max-width:280px}.intro-copy br{display:none}}

.policy-check{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;font-size:.85rem;line-height:1.5;margin:1rem 0}.policy-check input{width:1rem;height:1rem;flex:none}.policy-check[hidden]{display:none}#report-form{display:grid;gap:1.2rem}#report-form label{display:grid;gap:.5rem}#report-form input,#report-form textarea,#report-form select{width:100%;padding:.8rem;border:1px solid #bcc2b6;border-radius:4px;font:inherit;background:#fff;color:inherit}#report-form select{appearance:none;padding-right:2.6rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='m4 6 4 4 4-4' stroke='%23313b2c' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .9rem center}#report-form textarea{resize:vertical}
