:root{--accent:#d52b1e;--accent-soft:#d52b1e1a;--accent-softer:#d52b1e14;--bg:#f6f6f7;--surface:#fff;--text:#18181b;--text-body:#3f3f46;--text-muted:#52525b;--icon-muted:#71717a;--border:#e4e4e7;--border-strong:#d4d4d8;--placeholder:#a1a1aa;--shadow:0 1px 2px #18181b0f;color:var(--text);background:var(--bg);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:DM Sans,system-ui,sans-serif}*,:before,:after{box-sizing:border-box}body{background:var(--bg);margin:0}h1,h2,p{margin:0}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}:focus-visible{outline:3px solid var(--text);outline-offset:2px}[tabindex="-1"]:focus{outline:none}.visually-hidden{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}.accent{color:var(--accent);flex-shrink:0}.muted{color:var(--text-muted);font-size:16px}.small{font-size:14px}.page{flex-direction:column;min-height:100dvh;display:flex}.site-header{background:var(--surface);border-bottom:1px solid var(--border)}@media (width<=767px){.site-header{z-index:2;position:sticky;top:0}html{scroll-padding-top:72px}}.site-header__inner{justify-content:space-between;align-items:center;padding:20px 20px 12px;display:flex}.site-header__logo{width:auto;height:29px;display:block}.site-header__label{color:var(--text-muted);font-size:13px;font-weight:500}.screen{flex-direction:column;flex:1;width:100%;margin:0 auto;display:flex}.screen--start{gap:20px;padding:16px 20px 20px}.screen--review{gap:16px;padding:12px 20px}.screen--uploading{justify-content:center;gap:28px;padding:20px}.screen--message{text-align:center;justify-content:center;align-items:center;padding:20px 28px}.screen-footer{flex-direction:column;gap:10px;padding:16px 20px 28px;display:flex}.screen-footer--note{text-align:center;color:var(--text-muted);padding:0 20px 24px;font-size:13px}.screen-footer--center{align-items:center}.note{color:var(--text-muted);text-align:center;font-size:14px;line-height:1.5}.note--left{text-align:left}.btn{border:2px solid #0000;border-radius:16px;justify-content:center;align-items:center;gap:10px;min-height:56px;padding:8px 26px;font-size:17px;font-weight:700;display:inline-flex}.btn--primary{background:var(--accent);color:#fff}.btn--primary:hover{background:#b4231a}.btn--secondary{background:var(--surface);border:1.5px solid var(--border-strong);color:var(--text);font-size:16px}.btn--secondary:hover{border-color:var(--placeholder)}.btn--block{width:100%}.icon-btn{border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;display:flex}.link-btn{min-height:44px;color:var(--text-body);align-items:center;padding:0 16px;font-size:15px;font-weight:600;text-decoration:underline;display:flex}.intro{flex-direction:column;gap:8px;display:flex}.intro h1{letter-spacing:-.02em;font-size:30px;font-weight:700;line-height:1.15}.intro p{color:var(--text-muted);font-size:16px;line-height:1.5}.intro--center{text-align:center;gap:6px}.intro--center h1{font-size:28px;line-height:1.2}.choice-list{flex-direction:column;gap:12px;display:flex}.choice{background:var(--surface);border:1.5px solid var(--border);text-align:left;border-radius:18px;align-items:center;gap:16px;padding:18px;display:flex}.choice--primary{background:var(--accent);border-color:var(--accent);color:#fff}.choice__icon{background:var(--accent-soft);width:48px;height:48px;color:var(--accent);border-radius:14px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.choice--primary .choice__icon{color:#fff;background:#ffffff2e}.choice__text{flex-direction:column;gap:2px;display:flex}.choice__title{font-size:17px;font-weight:700}.choice__sub{color:var(--text-muted);font-size:14px}.choice--primary .choice__sub{color:#fff}.tips{background:var(--surface);border-radius:16px;flex-direction:column;gap:12px;padding:16px;display:flex}.tips h2{font-size:15px;font-weight:700}.tips ul{color:var(--text-body);flex-direction:column;gap:10px;margin:0;padding:0;font-size:14px;line-height:1.45;list-style:none;display:flex}.tips li{align-items:flex-start;gap:10px;display:flex}.tips li svg{margin-top:2px}.dropzone{background:var(--surface);border:2px dashed var(--border-strong);text-align:center;border-radius:24px;flex-direction:column;align-items:center;gap:16px;padding:48px 24px;transition:border-color .15s,background-color .15s;display:flex}.dropzone.is-dragover,.review-panel.is-dragover{border-color:var(--accent);background:var(--accent-softer)}.dropzone__text{flex-direction:column;gap:4px;display:flex}.dropzone__title{font-size:20px;font-weight:700}.dropzone .muted{font-size:15px}.dropzone .btn{border-radius:14px;min-height:52px;padding:0 28px;font-size:16px}.icon-badge{background:var(--accent-soft);color:var(--accent);border-radius:14px;justify-content:center;align-items:center;display:flex}.icon-badge--lg{border-radius:20px;width:72px;height:72px}.tip-cards{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none;display:grid}.tip-card{background:var(--surface);color:var(--text-body);border-radius:16px;flex-direction:column;gap:8px;padding:18px;font-size:14px;line-height:1.45;display:flex}.review-bar{align-items:center;gap:8px;padding:16px 12px 8px;display:flex}.review-bar__title{flex-direction:column;display:flex}.review-bar__heading{font-size:18px;font-weight:700;line-height:1.3}.review-bar__sub{color:var(--text-muted);font-size:13px}.media-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0;padding:0;list-style:none;display:grid}.media-tile{aspect-ratio:1;background:var(--border);border-radius:14px;position:relative;overflow:hidden}.media-tile__open{justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.media-tile__open:focus-visible{outline:none}.media-tile:has(.media-tile__open:focus-visible){outline:3px solid var(--text);outline-offset:2px}.media-tile__remove:focus-visible{outline:none}.media-tile__remove:focus-visible>span{outline:3px solid var(--text);outline-offset:2px;box-shadow:0 0 0 2px #fff}.media-thumb{object-fit:cover;width:100%;height:100%;display:block;position:absolute;inset:0}.media-tile__play{width:40px;height:40px;color:var(--text);background:#ffffffeb;border-radius:999px;justify-content:center;align-items:center;display:flex;position:relative}.media-tile__preparing{background:#18181b73;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.media-tile__preparing .spinner{border-width:4px;border-color:#fff #fff6 #fff6;width:32px;height:32px}.media-tile__badges{flex-direction:column;align-items:flex-start;gap:4px;display:flex;position:absolute;bottom:8px;left:8px}.media-tile__badge{color:#fff;white-space:nowrap;background:#18181bbf;border-radius:6px;padding:2px 7px;font-size:12px;font-weight:600}.media-tile__remove{justify-content:center;align-items:center;width:44px;height:44px;display:flex;position:absolute;top:0;right:0}.media-tile__remove>span{color:#fff;background:#18181bb8;border-radius:999px;justify-content:center;align-items:center;width:26px;height:26px;display:flex}.add-tile{aspect-ratio:1;border:2px dashed var(--accent);background:var(--accent-softer);width:100%;color:var(--accent);border-radius:14px;flex-direction:column;justify-content:center;align-items:center;gap:6px;display:flex}.add-tile span{color:var(--text);font-size:13px;font-weight:700}.action-bar{background:var(--surface);border-top:1px solid var(--border);flex-direction:column;gap:12px;padding:16px 20px 28px;display:flex;position:sticky;bottom:0}.limit-alert{border:1.5px solid var(--accent);background:var(--accent-softer);color:var(--text);border-radius:14px;align-items:flex-start;gap:10px;padding:12px 14px;font-size:14px;line-height:1.45;display:flex}.limit-alert svg{color:var(--accent);flex-shrink:0;margin-top:1px}.preparing-note{border:1.5px solid var(--border-strong);background:var(--surface);color:var(--text);border-radius:14px;align-items:flex-start;gap:10px;padding:12px 14px;font-size:14px;line-height:1.45;display:flex}.preparing-note svg{color:var(--icon-muted);flex-shrink:0;margin-top:1px}.btn--primary[aria-disabled=true],.btn--primary[aria-disabled=true]:hover{background:var(--border-strong);color:var(--text-muted);cursor:not-allowed}.review-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;display:flex}.review-head__title{flex-direction:column;gap:4px;display:flex}.review-head__title h1{letter-spacing:-.02em;font-size:32px;font-weight:700}.review-head__actions{flex-wrap:wrap;gap:12px;display:flex}.review-head__actions .btn{border-radius:14px;gap:8px;min-height:52px;padding:0 24px;font-size:16px}.review-panel{background:var(--surface);border:2px solid #0000;border-radius:24px;flex-direction:column;gap:20px;padding:24px;transition:border-color .15s,background-color .15s;display:flex}.drop-hint{border:2px dashed var(--border-strong);color:var(--text-muted);border-radius:16px;justify-content:center;align-items:center;gap:10px;padding:18px;font-size:15px;display:flex}.preview{background:0 0;border:0;max-width:min(960px,100vw - 32px);max-height:calc(100dvh - 32px);padding:0;overflow:visible}.preview::backdrop{background:#18181bd9}.preview__media{border-radius:16px;max-width:100%;max-height:calc(100dvh - 32px);display:block}.preview__close:focus-visible{outline-color:#fff}.preview__close{z-index:1;color:#fff;background:#18181bb8;border-radius:999px;justify-content:center;align-items:center;width:44px;height:44px;display:flex;position:absolute;top:8px;right:8px}.sheet{background:var(--bg);width:100%;max-width:100%;color:var(--text);border:0;border-radius:24px 24px 0 0;margin:auto 0 0;padding:0;animation:.2s ease-out sheet-in}.sheet::backdrop{background:#18181b80}.sheet__body{padding:24px 16px calc(16px + env(safe-area-inset-bottom));flex-direction:column;gap:16px;display:flex}.sheet__title{font-size:20px;font-weight:700}@keyframes sheet-in{0%{transform:translateY(100%)}}.card{background:var(--surface);box-shadow:var(--shadow);border-radius:20px}.progress-card{flex-direction:column;gap:16px;padding:24px 20px;display:flex}.progress-card__head{justify-content:space-between;align-items:baseline;display:flex}.progress-card__label{font-size:15px;font-weight:600}.progress-card__value{letter-spacing:-.02em;font-variant-numeric:tabular-nums;font-size:32px;font-weight:700}.progress{background:var(--border);border-radius:999px;height:12px;overflow:hidden}.progress__fill{background:var(--accent);border-radius:999px;height:100%;transition:width .2s ease-out}.progress-thumbs{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;padding-top:4px;display:grid}.progress-thumbs__item{aspect-ratio:1;background:var(--border);border-radius:10px;position:relative;overflow:hidden}.keep-open{flex-direction:column;align-items:center;gap:8px;display:flex}.keep-open__note{color:var(--text-body);align-items:center;gap:8px;font-size:14px;display:flex}.message{flex-direction:column;align-items:center;gap:24px;display:flex}.message__text{flex-direction:column;gap:10px;display:flex}.message__text h1{letter-spacing:-.02em;font-size:28px;font-weight:700;line-height:1.2}.message__text p{color:var(--text-muted);font-size:16px;line-height:1.5}.success-mark{background:#d52b1e1f;border-radius:999px;justify-content:center;align-items:center;width:112px;height:112px;display:flex}.success-mark>span{background:var(--accent);color:#fff;border-radius:999px;justify-content:center;align-items:center;width:76px;height:76px;display:flex}.spinner{border:5px solid var(--border);border-top-color:var(--accent);border-radius:999px;width:48px;height:48px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.problem-mark{background:var(--surface);width:96px;height:96px;box-shadow:var(--shadow);color:var(--text-body);border-radius:28px;justify-content:center;align-items:center;display:flex}@media (width>=768px){.site-header__inner{max-width:1120px;margin:0 auto;padding:16px 24px}.site-header__logo{height:32px}.site-header__label{font-size:14px}.screen--start{gap:28px;max-width:720px;padding:56px 24px}.screen--start .intro{text-align:center;gap:10px}.screen--start .intro h1{font-size:40px;line-height:1.1}.screen--start .intro p{font-size:17px}.screen--review{gap:24px;max-width:960px;padding:48px 24px}.screen--review .media-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:14px}.screen--review .media-tile{border-radius:16px}.screen--review .media-tile__play{width:48px;height:48px}.screen--review .media-tile__badges{bottom:10px;left:10px}.screen--review .media-tile__badge{padding:3px 8px}.screen--review .media-tile__remove>span{width:28px;height:28px}.screen--uploading{max-width:560px;padding:72px 24px}.screen--uploading .intro--center h1{font-size:32px}.progress-card{border-radius:24px;gap:18px;padding:28px}.progress-card__label{font-size:16px}.progress-card__value{font-size:36px}.progress-thumbs{gap:10px}.progress-thumbs__item{border-radius:12px}.screen--message{flex:none;max-width:560px;padding:96px 24px 24px}.message--card{background:var(--surface);box-shadow:var(--shadow);border-radius:28px;padding:48px 40px}.screen:has(.message--card){padding-bottom:72px}.message__text h1{font-size:32px}.message__text p{font-size:17px}.screen-footer--actions{width:100%;max-width:400px;margin:0 auto;padding-bottom:72px}}@media (forced-colors:active){.progress{border:1px solid canvastext}.progress__fill{background:highlight}.spinner,.media-tile__preparing .spinner{border-color:highlight canvastext canvastext}.media-tile__preparing .spinner{background:canvas}.choice,.add-tile,.media-tile__remove>span,.preview__close{border:2px solid buttontext}.sheet{border-top:2px solid canvastext}.btn--primary[aria-disabled=true]{color:graytext;border-color:graytext}.media-tile__remove:focus-visible>span{outline-color:highlight}.media-tile:has(.media-tile__open:focus-visible){outline-color:highlight}}
