.mode-switch-bar{max-width:1440px;margin:18px auto 0;padding:0 clamp(22px,5vw,76px);display:flex;gap:8px}.mode-tab{border:1px solid var(--line);border-radius:4px;background:#fbf9f4;color:var(--muted);padding:10px 18px;font-size:12px;font-weight:700;cursor:pointer}.mode-tab.active{background:var(--ink);border-color:var(--ink);color:#fff}.mode-tab:focus-visible,.gif-upload:focus-visible{outline:2px solid var(--orange);outline-offset:3px}.gif-workspace{max-width:1440px;margin:0 auto;padding:38px clamp(22px,5vw,76px) 70px}.gif-workspace[hidden]{display:none}.gif-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:28px}.gif-heading h1{margin:12px 0 8px}.gif-heading p{margin:0;color:#77736b;font-size:14px}.gif-counter{font:11px var(--mono);color:var(--muted);padding-bottom:5px}.gif-layout{display:grid;grid-template-columns:minmax(300px,.82fr) minmax(0,1.3fr);gap:20px;align-items:start}.gif-panel,.gif-preview-panel{background:#fbf9f4;border:1px solid var(--line);border-radius:5px;overflow:hidden}.gif-panel{padding:22px}.gif-upload{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:12px 0 14px;padding:14px;border:1px dashed #c9c0b2;border-radius:4px;background:#f5f0e7;cursor:pointer}.gif-upload strong{font-size:12px}.gif-upload span{font-size:10px;color:var(--muted);text-align:right}.gif-frame-list{display:grid;gap:8px;max-height:390px;overflow:auto}.gif-empty{padding:22px 8px;text-align:center;font-size:12px;color:var(--muted)}.gif-frame{display:grid;grid-template-columns:50px minmax(0,1fr) auto;gap:10px;align-items:center;padding:7px;border:1px solid var(--line);border-radius:4px;background:#fff}.gif-frame img{width:50px;height:50px;object-fit:cover;border-radius:2px;background:#eee}.gif-frame-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}.gif-frame-order{font:9px var(--mono);color:var(--muted)}.gif-frame-actions{display:flex;gap:3px}.gif-frame-actions button{width:28px;height:28px;border:1px solid var(--line);border-radius:3px;background:#f8f5ef;color:var(--ink);cursor:pointer}.gif-frame-actions button:disabled{opacity:.4;cursor:default}.gif-frame-actions .gif-remove{color:#b54832}.gif-setting{display:grid;gap:6px;margin-top:20px;font-size:12px}.gif-setting>span{display:flex;justify-content:space-between}.gif-setting b{font-weight:500;color:var(--muted)}.gif-setting input,.gif-setting select{width:100%;height:34px;accent-color:var(--orange)}.gif-setting select{border:1px solid var(--line);background:white;padding:0 8px;color:var(--ink)}.gif-download{width:100%;margin-top:20px}.gif-download:disabled{opacity:.45;cursor:not-allowed}.gif-privacy{font-size:10px;color:var(--muted);text-align:center;margin:12px 0 0}.gif-preview-panel{min-height:450px}.gif-preview-panel .preview-head{border-bottom:1px solid var(--line)}.gif-preview-stage{min-height:390px;display:grid;place-items:center;padding:24px;background:radial-gradient(ellipse at center,#fffdf8,#ece6dc)}.gif-preview-stage img{display:block;max-width:100%;max-height:540px;object-fit:contain;box-shadow:0 12px 34px #24211b2b;background:#fff}.gif-preview-empty{max-width:270px;text-align:center;color:var(--muted);font-size:13px}.gif-status{min-height:26px;margin:0;padding:6px 15px;font-size:11px;color:var(--muted)}
@media(max-width:760px){.mode-switch-bar{margin-top:10px;padding:0 14px}.mode-tab{flex:1;padding:10px 8px}.gif-workspace{padding:26px 14px 40px}.gif-heading{align-items:start}.gif-heading h1{font-size:32px}.gif-heading p{font-size:12px}.gif-layout{grid-template-columns:1fr}.gif-preview-panel{grid-row:1;min-height:300px}.gif-preview-stage{min-height:260px}.gif-preview-panel .gif-preview-stage img{max-height:330px}.gif-panel{padding:16px}.gif-frame-list{max-height:260px}}