:root{--scratch-blue: #4c97ff;--scratch-blue-dark: #3373cc;--scratch-blue-soft: rgb(76 151 255 / 15%);--scratch-blue-ring: rgb(76 151 255 / 35%);font-family:Inter,PingFang SC,Microsoft YaHei,sans-serif;color:#17223b;background:#eef4ff}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0}button{font:inherit}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.app-shell{display:grid;grid-template-rows:auto minmax(0,1fr);width:100%;height:100%}.editor-shell{grid-template-rows:minmax(0,1fr)}.platform-bar{position:relative;z-index:20;display:flex;gap:20px;align-items:center;min-height:62px;padding:8px 18px;color:#fff;background:linear-gradient(105deg,var(--scratch-blue-dark),var(--scratch-blue) 55%,#3f86e6);box-shadow:0 2px 12px #2465b84d}.brand{display:flex;flex:0 0 auto;align-items:center;gap:10px;color:inherit;text-decoration:none}.brand>span:last-child{display:grid;gap:2px}.brand strong{font-size:16px;white-space:nowrap}.brand small{color:#e5f0ff;font-size:11px}.brand-mark{display:grid;width:38px;height:38px;place-items:center;border:2px solid rgb(255 255 255 / 75%);border-radius:12px;font-size:22px;font-weight:800;background:#ffffff24}.account-area{display:flex;align-items:center;gap:10px;margin-left:auto}.page-actions{display:flex;min-width:0;align-items:center;gap:8px}.auth-note{color:#eaf3ff;font-size:13px}.platform-bar button{padding:7px 14px;border-radius:8px;cursor:pointer}.primary-button{border:1px solid white;color:var(--scratch-blue-dark);background:#fff;font-weight:700}.secondary-button{border:1px solid rgb(255 255 255 / 65%);color:#fff;background:transparent}.platform-bar button:focus-visible{outline:3px solid #ffd166;outline-offset:2px}.avatar{display:grid;width:36px;height:36px;place-items:center;border-radius:50%;color:var(--scratch-blue-dark);background:#fff;font-weight:800}.user-summary{display:grid;line-height:1.2}.user-summary strong{font-size:13px}.account-menu{position:relative}.account-menu-trigger{display:flex;align-items:center;gap:8px;padding:4px 8px 4px 4px;border:1px solid transparent;border-radius:999px;color:inherit;background:transparent;cursor:pointer}.account-menu-trigger:hover,.account-menu-trigger[aria-expanded=true]{background:#ffffff2e}.account-menu-caret{width:14px;height:14px;opacity:.85}.account-menu-dropdown{position:absolute;z-index:30;top:calc(100% + 6px);right:0;min-width:176px;padding:6px;border:1px solid rgb(23 34 59 / 12%);border-radius:10px;background:#fff;box-shadow:0 12px 32px #17223b2e}.account-menu-info{display:block;padding:6px 10px;color:#8c95a9;font-size:11px}.account-menu-item{display:block;width:100%;padding:8px 10px;border:0;border-radius:7px;color:#2f3a52;background:transparent;cursor:pointer;font-size:13px;text-align:left}.account-menu-item:hover{background:var(--scratch-blue-soft);color:var(--scratch-blue-dark)}.auth-message{position:absolute;top:calc(100% + 8px);right:16px;max-width:min(420px,calc(100vw - 32px));margin:0;padding:8px 12px;border-radius:8px;color:#8a2d2d;background:#fff0f0;box-shadow:0 4px 16px #17223b2e;font-size:13px}.editor-workspace{display:grid;min-height:0;grid-template-rows:minmax(0,1fr)}.editor-frame{position:relative;min-height:0;overflow:hidden}.editor-frame>div{height:100%}.scratch-editor-host>div{height:100%}.scratch-platform-brand-target{display:flex;height:48px;align-items:center}.scratch-menu-brand{display:flex;align-items:center;gap:7px;color:#fff}.scratch-menu-brand-mark{display:grid;width:30px;height:30px;place-items:center;border:2px solid rgb(255 255 255 / 78%);border-radius:9px;background:#ffffff21;font-size:17px;font-weight:900}.scratch-menu-brand-copy{display:grid;gap:1px;text-align:left}.scratch-menu-brand-copy strong{font-size:14px;line-height:1.05}.scratch-menu-brand-copy .save-status{font-size:9px;line-height:1.05}.scratch-platform-menu-actions{display:flex;min-width:0;height:48px;align-items:center;gap:8px;margin-left:4px}.scratch-platform-menu-actions .header-link-button,.scratch-platform-menu-actions .header-save-button{padding:5px 10px;border-radius:7px}.scratch-platform-menu-actions .project-name-field input{width:min(180px,17vw);padding-block:5px}.scratch-platform-menu-actions .project-name-message{max-width:130px}.projects-menu-button{display:inline-flex;align-items:center;gap:6px}.projects-menu-button svg{width:17px;height:17px;fill:currentColor}.scratch-editor-host [class*=gui_menu-bar-position_][class*=menu-bar_menu-bar_],.scratch-editor-host [class*=menu_menu_]{background-color:var(--scratch-blue)}.scratch-editor-host [class*=menu_menu_]{scrollbar-color:rgb(0 0 0 / 15%) var(--scratch-blue)}.scratch-editor-host [class*=menu_active_],.scratch-editor-host [class*=menu_menu-item_][class*=menu_expanded_],.scratch-editor-host [class*=menu_menu-item_]:hover{background-color:var(--scratch-blue-dark)}.scratch-editor-host button[class*=action-menu_button_]{background:var(--scratch-blue)}.scratch-editor-host button[class*=action-menu_main-button_]{box-shadow:0 0 0 4px var(--scratch-blue-ring)}.scratch-editor-host button[class*=action-menu_main-button_]:hover{box-shadow:0 0 0 6px var(--scratch-blue-ring)}.scratch-editor-host [class*=action-menu_more-buttons-outer_],.scratch-editor-host button[class*=action-menu_more-button_]{background:var(--scratch-blue-dark)}.scratch-editor-host [class*=sprite-selector-item_sprite-selector-item_][class*=sprite-selector-item_is-selected_]{border-color:var(--scratch-blue);box-shadow:0 0 0 4px var(--scratch-blue-ring)}.scratch-editor-host [class*=sprite-selector-item_sprite-selector-item_]:hover{border-color:var(--scratch-blue)}.scratch-editor-host [class*=sprite-selector-item_is-selected_] [class*=sprite-selector-item_sprite-info_]{background:var(--scratch-blue)}.scratch-editor-host [class*=stage-selector_stage-selector_][class*=stage-selector_is-selected_]{border-color:var(--scratch-blue);box-shadow:0 0 0 4px var(--scratch-blue-ring)}.scratch-editor-host [class*=stage-selector_stage-selector_]:hover{border-color:var(--scratch-blue)}.scratch-editor-host [class*=stage-selector_is-selected_] [class*=stage-selector_header_]{background-color:var(--scratch-blue)}.scratch-editor-host button[class*=toggle-buttons_button_][aria-pressed=true]{background-color:var(--scratch-blue-soft)}.scratch-editor-host button[class*=toggle-buttons_button_][aria-pressed=true]>img,.scratch-editor-host [class*=gui_tab_][class*=gui_is-selected_] img{filter:hue-rotate(-45deg) saturate(1.45)}.scratch-editor-host button[class*=toggle-buttons_button_]:focus:before{border-color:var(--scratch-blue)}.scratch-editor-host [class*=icon-button_container_]{color:var(--scratch-blue)}.scratch-editor-host [class*=gui_tab_][class*=gui_is-selected_]{color:var(--scratch-blue-dark)}.scratch-editor-host [class*=extension-button_extension-button-container_]{border-color:var(--scratch-blue);background:var(--scratch-blue)}.scratch-editor-host [class*=delete-button_delete-button-visible_],.scratch-editor-host [class*=close-button_close-button_][class*=close-button_small_]{background-color:var(--scratch-blue);box-shadow:0 0 0 2px var(--scratch-blue-ring)}.scratch-editor-host [class*=stage-header_stage-button_]:active{background-color:var(--scratch-blue-soft)}.scratch-editor-host [class*=tool-select-base_mod-tool-select_][class*=tool-select-base_is-selected_],.scratch-editor-host [class*=paint-editor_bitmap-button_],.scratch-editor-host [class*=font-dropdown_font-dropdown_]{background-color:var(--scratch-blue)}.scratch-editor-host [class*=button_button_]:active,.scratch-editor-host [class*=button_button_][class*=button_highlighted_],.scratch-editor-host [class*=fixed-tools_mod-menu-item_]:hover{background-color:var(--scratch-blue-soft)}.scratch-editor-host [class*=fixed-tools_button-group-button-icon_],.scratch-editor-host [class*=fixed-tools_menu-item-icon_],.scratch-editor-host [class*=mode-tools_mode-tools-icon_],.scratch-editor-host [class*=paint-editor_button-group-button-icon_],.scratch-editor-host [class*=paint-editor_bitmap-button-icon_],.scratch-editor-host [class*=labeled-icon-button_edit-field-icon_],.scratch-editor-host [class*=color-button_color-button-arrow_],.scratch-editor-host [class*=color-picker_swap-button_] img,.scratch-editor-host [class*=sound-editor_undo-icon_],.scratch-editor-host [class*=sound-editor_redo-icon_],.scratch-editor-host [class*=sound-editor_trim-button_]>img,.scratch-editor-host [class*=sound-editor_tool-button_] img{filter:hue-rotate(-45deg) saturate(1.45) brightness(1.05)!important}.scratch-editor-host [class*=sound-editor_button_]:active{background-color:var(--scratch-blue-soft)}.scratch-editor-host [class*=sound-editor_button_]:focus:before{border-color:var(--scratch-blue)}.scratch-editor-host [class*=sound-editor_round-button_],.scratch-editor-host [class*=play-button_play-button_],.scratch-editor-modal [class*=modal_header_]{background-color:var(--scratch-blue)}.scratch-editor-modal [class*=library_filter-bar_]{background-color:var(--scratch-blue-ring)}.scratch-editor-modal [class*=library-item_library-item_]:focus,.scratch-editor-modal [class*=library-item_library-item_]:hover{border-color:var(--scratch-blue)}.scratch-editor-host input[class*=input_input-form_]:hover,.scratch-editor-host input[class*=input_input-form_]:focus{border-color:var(--scratch-blue)}.scratch-editor-host input[class*=input_input-form_]:focus{box-shadow:0 0 0 .25rem var(--scratch-blue-ring)}.Popover-body [class*=dial_gauge-path_]{fill:var(--scratch-blue-ring);stroke:var(--scratch-blue)}.Popover-body [class*=dial_dial-face_],.Popover-body [class*=dial_dial-handle_],.Popover-body button[class*=toggle-buttons_button_][aria-pressed=true]>img{filter:hue-rotate(-45deg) saturate(1.45)}.Popover-body button[class*=toggle-buttons_button_][aria-pressed=true]{background-color:var(--scratch-blue-soft)}.Popover-body button[class*=toggle-buttons_button_]:focus:before{border-color:var(--scratch-blue)}.Popover-body button[class*=toggle-buttons_button_]:active{background-color:var(--scratch-blue-ring)}.editor-frame .tutorials-button,.editor-frame .tutorials-button+button{display:none!important}.editor-account-controls{position:absolute;z-index:492;top:0;right:8px;display:flex;height:48px;align-items:center;gap:8px;margin-left:0;color:#fff;pointer-events:auto}.editor-account-controls .avatar{width:30px;height:30px;font-size:14px}.editor-account-controls .user-summary strong{font-size:12px}.editor-account-controls .secondary-button,.editor-account-controls .primary-button{padding:5px 10px;border-radius:7px;cursor:pointer}.editor-account-controls button:focus-visible{outline:3px solid #ffd166;outline-offset:2px}.save-status{font-weight:700}.save-status-dirty,.save-status-saving{color:#fff1b8}.save-status-failed,.save-status-conflict,.save-status-unauthorized{color:#ffd1d8}.save-status-saved_with_cover_warning{color:#ffe5ad}.projects-shell{min-height:100%;height:auto}.projects-page{width:min(1180px,calc(100% - 40px));margin:0 auto;padding:28px 0 70px}.back-to-editor-button{display:inline-flex;align-items:center;gap:6px;margin-bottom:18px;padding:8px 14px 8px 10px;border:1px solid #d8dfec;border-radius:999px;color:var(--scratch-blue-dark);background:#fff;box-shadow:0 4px 14px #35426514;cursor:pointer;font-weight:700}.back-to-editor-button:hover{border-color:var(--scratch-blue);background:var(--scratch-blue-soft)}.back-to-editor-button svg{width:18px;height:18px}.projects-heading{display:flex;align-items:center;justify-content:space-between;gap:24px}.projects-heading h1{margin:0 0 4px;font-size:clamp(24px,2.6vw,32px);letter-spacing:-.03em}.projects-heading p{margin:0;color:#65708a;font-size:14px}.create-project-button{padding:12px 20px;border:0;border-radius:12px;color:#fff;background:var(--scratch-blue);box-shadow:0 8px 20px #4c97ff3d;cursor:pointer;font-weight:800}.project-tabs{display:flex;gap:6px;margin:22px 0;border-bottom:1px solid #dce4f1}.project-tabs button{padding:10px 18px;border:0;border-bottom:3px solid transparent;color:#667087;background:transparent;cursor:pointer}.project-tabs button.active{border-bottom-color:var(--scratch-blue);color:var(--scratch-blue-dark);font-weight:800}.project-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:22px}.project-card{overflow:hidden;border:1px solid #dce4f1;border-radius:16px;background:#fff;box-shadow:0 10px 30px #35426514;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.project-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px #3542652e}.project-cover{position:relative;display:grid;aspect-ratio:4 / 3;margin:12px 12px 0;overflow:hidden;border-radius:12px;place-items:center;color:#fff;background:linear-gradient(135deg,#75b4ff,var(--scratch-blue-dark))}.project-cover-button{width:calc(100% - 24px);padding:0;border:0;font:inherit;cursor:pointer}.project-cover-button:focus-visible{outline:3px solid var(--scratch-blue);outline-offset:2px}.project-cover img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}.project-cover span{display:grid;width:64px;height:64px;place-items:center;border:3px solid rgb(255 255 255 / 80%);border-radius:20px;font-size:36px;font-weight:900}.project-card-body{padding:16px}.project-card h2{overflow:hidden;margin:0 0 7px;font-size:18px;text-overflow:ellipsis;white-space:nowrap}.project-card p{overflow:hidden;min-height:40px;margin:0 0 10px;color:#667087;font-size:13px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.project-card small{color:#8c95a9;font-size:11px}.project-card-actions{display:flex;gap:8px;margin-top:15px}.project-card-actions button,.load-more-button{padding:7px 13px;border:1px solid #d8dfec;border-radius:8px;color:#566077;background:#fff;cursor:pointer}.project-card-actions .card-primary{border-color:var(--scratch-blue);color:#fff;background:var(--scratch-blue)}.project-card-actions .card-danger{border-color:#c74b5d;color:#a92f42;background:#fff4f5}.project-card-actions button:disabled{cursor:wait;opacity:.55}.empty-state{display:grid;min-height:330px;place-items:center;align-content:center;padding:42px;border:1px dashed #cbd5e6;border-radius:18px;text-align:center;background:#ffffffa6}.empty-state h2{margin:16px 0 7px}.empty-state p{max-width:520px;margin:0 0 20px;color:#6f7890}.empty-illustration{display:grid;width:78px;height:78px;place-items:center;border-radius:24px;color:#fff;background:linear-gradient(135deg,#69adff,var(--scratch-blue-dark));font-size:38px;font-weight:900}.page-error{padding:11px 14px;border-radius:10px;color:#932f3c;background:#ffecef}.loading-note{padding:35px;color:#6f7890;text-align:center}.load-more-button{display:block;margin:26px auto 0}.header-link-button,.header-save-button{padding:7px 11px;border:1px solid rgb(255 255 255 / 55%);border-radius:8px;color:#fff;background:transparent;cursor:pointer;white-space:nowrap}.header-save-button{border-color:#fff;color:var(--scratch-blue-dark);background:#fff;font-weight:800}.header-save-button:disabled{cursor:wait;opacity:.65}.header-link-button:disabled{cursor:wait;opacity:.55}.project-name-field input{width:min(190px,18vw);padding:7px 10px;border:1px solid rgb(255 255 255 / 38%);border-radius:8px;outline:none;color:#fff;background:#ffffff1f}.project-name-field input:focus{border-color:#fff;background:#fff3}.project-name-field input[aria-invalid=true]{border-color:#ffd1d8}.project-name-field input:disabled{cursor:wait;opacity:.7}.project-name-message{max-width:170px;color:#fff1b8;font-size:11px;line-height:1.25}.editor-login-gate{display:grid;place-items:center;align-content:center;text-align:center}.editor-login-gate p{color:#667087}.dialog-backdrop{position:fixed;z-index:600;display:grid;inset:0;place-items:center;padding:20px;background:#1217278f}.dialog-backdrop-top{align-content:start;padding-top:84px;background:#12172747}.saving-dialog{display:flex;align-items:center;gap:12px;padding:14px 22px;border:1px solid rgb(23 34 59 / 8%);border-radius:999px;color:#17223b;background:#fff;box-shadow:0 16px 44px #0f152642;animation:dialog-pop .16s ease-out}.saving-dialog-text{font-size:14px;font-weight:700}.saving-spinner{width:20px;height:20px;border:3px solid var(--scratch-blue-soft);border-top-color:var(--scratch-blue);border-radius:50%;animation:saving-spin .7s linear infinite}@keyframes saving-spin{to{transform:rotate(360deg)}}.unsaved-dialog{width:min(440px,100%);padding:28px 28px 24px;border:1px solid rgb(23 34 59 / 8%);border-radius:18px;background:#fff;box-shadow:0 24px 70px #0f152652;animation:dialog-pop .16s ease-out}@keyframes dialog-pop{0%{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}.dialog-header{display:flex;align-items:center;gap:12px;margin-bottom:10px}.dialog-icon{display:grid;flex:0 0 auto;width:40px;height:40px;place-items:center;border-radius:12px;color:var(--scratch-blue-dark);background:var(--scratch-blue-soft)}.dialog-icon svg{width:22px;height:22px}.dialog-icon-danger{color:#c0324a;background:#fdecef}.unsaved-dialog h2{margin:0;color:#17223b;font-size:20px;letter-spacing:-.01em}.unsaved-dialog p{margin:0;color:#667087;font-size:14px;line-height:1.6}.dialog-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;margin-top:26px}.dialog-actions button{padding:9px 16px;border-radius:10px;cursor:pointer;font-weight:700;transition:background .15s ease,border-color .15s ease,color .15s ease}.dialog-actions button:focus-visible{outline:3px solid var(--scratch-blue-ring);outline-offset:2px}.dialog-secondary{border:1px solid #d6ddea;color:#556077;background:#fff}.dialog-secondary:hover:not(:disabled){border-color:#c2ccdd;background:#f5f8fd}.dialog-discard:hover:not(:disabled){border-color:#e6a3ad;color:#a92f42;background:#fff0f2}.dialog-primary{border:1px solid var(--scratch-blue);color:#fff;background:var(--scratch-blue);box-shadow:0 6px 16px #4c97ff47}.dialog-primary:hover:not(:disabled){background:var(--scratch-blue-dark);border-color:var(--scratch-blue-dark)}.dialog-actions button:disabled{cursor:wait;opacity:.6;box-shadow:none}.dialog-danger{border:1px solid #bd3e52;color:#fff;background:#bd3e52;box-shadow:0 6px 16px #bd3e5242}.dialog-danger:hover:not(:disabled){background:#a92f42;border-color:#a92f42}@media(max-width:680px){.platform-bar{gap:10px;padding-inline:10px}.brand small,.auth-note,.user-summary small{display:none}.account-area{gap:7px}.projects-page{width:min(100% - 24px,1180px);padding-top:26px}.projects-heading{align-items:start;flex-direction:column}.page-actions{order:3;width:100%}.platform-bar{flex-wrap:wrap}.editor-account-controls .user-summary{display:none}}
