.toast-viewport{left:50%;top:calc(var(--safe-top) + var(--space-4));gap:var(--space-2);z-index:var(--z-toast);flex-direction:column;display:flex;position:fixed;transform:translate(-50%)}.toast{max-width:min(420px, calc(100vw - var(--space-4) * 2));padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);font-size:var(--font-sm);font-weight:var(--weight-bold);box-shadow:var(--shadow-md)}.toast-error{background:var(--danger);color:var(--text-invert)}.toast-success{background:var(--text);color:var(--text-invert)}.toast-update{align-items:center;gap:var(--space-3);background:var(--surface);color:var(--text);border:1px solid var(--border);display:flex}.toast-action{min-height:32px;padding:0 var(--space-3);border-radius:var(--radius-full);background:var(--accent);color:var(--text-invert);font:inherit;font-weight:var(--weight-bold);cursor:pointer;border:none;flex:none}@media (hover:hover) and (pointer:fine){.toast-action:hover{filter:brightness(1.06)}}.tip-positioner{z-index:var(--z-menu)}.tip{background:var(--surface-inverse);color:var(--text-invert);font-size:var(--font-xs);font-weight:var(--weight-semibold);line-height:var(--leading-heading);border-radius:var(--radius-sm);white-space:nowrap;pointer-events:none;animation:tip-fade-in var(--motion-fast) ease-out;padding:5px 10px}@keyframes tip-fade-in{0%{opacity:0}to{opacity:1}}.overlay{background:var(--surface-veil);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:var(--z-canvas-overlay);font-size:var(--font-md);font-weight:var(--weight-semibold);color:var(--text-dim);animation:overlay-fade var(--motion-base) ease;place-items:center;display:grid;position:absolute;inset:0}.overlay-fixed{z-index:var(--z-blocking);position:fixed}.overlay-box{align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-6);background:var(--surface);border-radius:var(--radius-full);box-shadow:var(--shadow-md);display:flex}.spinner{border:2.5px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:18px;height:18px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@keyframes overlay-fade{0%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion:reduce){.overlay{animation:none}}.btn{justify-content:center;align-items:center;gap:var(--space-2);min-height:var(--control-touch);padding:0 var(--space-4);border-radius:var(--radius-full);font-size:var(--font-md);font-weight:var(--weight-bold);white-space:nowrap;cursor:pointer;transition:background var(--motion-fast), transform var(--motion-fast), box-shadow var(--motion-fast), opacity var(--motion-fast), filter var(--motion-fast);border:none;display:inline-flex}.btn:disabled{opacity:.4;cursor:default}.btn:active:not(:disabled){transform:scale(.96)}.btn-primary{background:var(--accent-gradient);color:var(--text-invert);box-shadow:var(--shadow-accent)}@media (hover:hover) and (pointer:fine){.btn-primary:hover:not(:disabled){filter:brightness(1.06)}}.btn-secondary{background:var(--surface);color:var(--text);border:1px solid var(--border);box-shadow:var(--shadow-sm)}@media (hover:hover) and (pointer:fine){.btn-secondary:hover:not(:disabled){background:var(--surface-hover)}}.btn-ghost{color:var(--text);background:0 0}@media (hover:hover) and (pointer:fine){.btn-ghost:hover:not(:disabled){background:var(--surface-hover)}}.btn-link{min-height:var(--control-touch);padding:0 var(--space-2);color:var(--text-dim);font-size:var(--font-sm);font-weight:var(--weight-semibold);border-radius:var(--radius-sm);background:0 0}@media (hover:hover) and (pointer:fine){.btn-link:hover:not(:disabled){color:var(--text)}}.btn-danger{background:var(--danger);color:var(--text-invert);box-shadow:var(--shadow-sm)}@media (hover:hover) and (pointer:fine){.btn-danger:hover:not(:disabled){filter:brightness(1.06)}}.btn-block{width:100%}.btn-spinner{opacity:.9;border:2.5px solid;border-top-color:#0000;border-radius:50%;width:16px;height:16px;animation:.8s linear infinite btn-spin}@keyframes btn-spin{to{transform:rotate(360deg)}}@media (width<=900px){.btn.btn-icon-only-mobile{width:var(--control-touch);min-width:var(--control-touch);padding:0}.btn.btn-icon-only-mobile .btn-label{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}}.ui-empty{place-items:center;gap:var(--space-3);padding:64px var(--space-4);color:var(--text-dim);font-size:var(--font-md);font-weight:var(--weight-semibold);text-align:center;display:grid}.ui-empty-compact{padding:var(--space-6) var(--space-4);font-size:var(--font-sm);font-weight:400}.ui-empty-msg{margin:0}.ui-empty-art{background:var(--surface);border:1px solid var(--border);width:88px;height:88px;box-shadow:var(--shadow-sm);color:var(--accent);border-radius:50%;place-items:center;display:grid}.ui-badge{align-items:center;gap:var(--space-1);padding:2px var(--space-3);border-radius:var(--radius-full);font-size:var(--font-xs);font-weight:var(--weight-bold);display:inline-flex}.ui-badge svg{flex:none}.ui-badge-accent{background:var(--accent-gradient);color:var(--text-invert)}.ui-badge-neutral{background:var(--surface-hover);color:var(--text-dim)}.ui-badge-success{background:var(--success);color:var(--text-invert);box-shadow:var(--shadow-sm)}.ui-badge-danger{background:var(--danger);color:var(--text-invert)}.ui-badge-caps{text-transform:uppercase;letter-spacing:.04em}.ui-badge-lg{gap:var(--space-2);padding:var(--space-3) var(--space-6);font-size:var(--font-lg);font-weight:var(--weight-heavy);box-shadow:var(--shadow-md)}@media (prefers-reduced-motion:no-preference){.ui-badge-pop{animation:ui-badge-pop .45s var(--ease-spring)}}@keyframes ui-badge-pop{0%{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}.ui-tabbar{z-index:var(--z-bar);justify-content:space-around;gap:var(--space-1);padding:var(--space-1) calc(var(--space-2) + var(--safe-right)) calc(var(--space-1) + var(--safe-bottom)) calc(var(--space-2) + var(--safe-left));border-top:1px solid var(--border);background:var(--surface);display:flex;position:fixed;bottom:0;left:0;right:0}.ui-tabbar-tab{min-height:var(--control-touch);padding:var(--space-1) 0;border-radius:var(--radius-sm);color:var(--text-dim);font-size:var(--font-xs);font-weight:var(--weight-bold);cursor:pointer;white-space:nowrap;background:0 0;border:none;flex-direction:column;flex:1;align-items:center;gap:2px;display:flex;position:relative}.ui-tabbar-tab:before{content:"";position:absolute;inset:-4px 0}@media (hover:hover) and (pointer:fine){.ui-tabbar-tab:hover:not(.selected){color:var(--text)}}.ui-tabbar-tab.selected{color:var(--accent-strong)}.ui-tabbar-tab svg{width:22px;height:22px}.ui-tabbar.reserve-bottom{bottom:var(--banner-height)}.ui-tabbar.reserve-bottom:after{content:"";height:var(--banner-height);background:var(--surface);z-index:-1;position:fixed;bottom:0;left:0;right:0}.dlg-backdrop,.confirm-backdrop{background:var(--scrim);z-index:var(--z-blocking);animation:dlg-fade-in var(--motion-fast) ease-out;position:fixed;inset:0}@keyframes dlg-fade-in{0%{opacity:0}to{opacity:1}}.dlg-backdrop-heavy{background:var(--scrim-heavy)}.dlg-viewport,.confirm-viewport{z-index:var(--z-blocking);padding:var(--space-4);pointer-events:none;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.dlg-viewport>*,.confirm-viewport>*{pointer-events:auto}.dlg-popup,.confirm-popup{background:var(--surface);border-radius:var(--radius-lg);width:100%;max-width:360px;box-shadow:var(--shadow-md);padding:var(--space-6) var(--space-4) var(--space-4);animation:confirm-pop-in var(--motion-fast) ease-out}@keyframes confirm-pop-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}.dlg-title,.confirm-title{font-size:var(--font-lg);font-weight:var(--weight-bold);color:var(--text);margin:0}.dlg-popup-lg{gap:var(--space-4);max-width:440px;max-height:100%;padding:var(--space-5);border-radius:var(--radius-xl);flex-direction:column;display:flex;overflow-y:auto}.dlg-popup-lg .dlg-title{font-size:var(--font-xl);font-weight:var(--weight-heavy);text-align:center}.dlg-actions{gap:var(--space-3);flex-wrap:wrap;justify-content:center;display:flex}.dlg-actions>*{flex:auto;min-width:0}@media (width<=640px){.dlg-actions-stack{flex-direction:column}}.confirm-desc{margin:var(--space-2) 0 0;font-size:var(--font-md);color:var(--text-dim);line-height:1.5}.confirm-actions{gap:var(--space-2);margin-top:var(--space-6);display:flex}.confirm-actions>*{flex:1}.ui-title,.ui-text{font-family:var(--font-family)}.ui-title{color:var(--text);font-weight:var(--weight-bold);line-height:var(--leading-heading);margin:0}.ui-title-sm{font-size:var(--font-md);letter-spacing:0}.ui-title-md{font-size:var(--font-lg);letter-spacing:-.01em}.ui-title-lg{font-size:var(--font-xl);font-weight:var(--weight-heavy);letter-spacing:-.02em}.ui-title-xl{font-size:var(--font-3xl);font-weight:var(--weight-heavy);letter-spacing:-.02em}.ui-text{font-weight:var(--weight-regular);line-height:var(--leading-body);letter-spacing:0;color:var(--text);margin:0}.ui-text-xs{font-size:var(--font-xs)}.ui-text-sm{font-size:var(--font-sm)}.ui-text-md{font-size:var(--font-md)}.ui-text-lg{font-size:var(--font-lg)}.ui-text-dim{color:var(--text-dim)}.ui-text-center{text-align:center}.drawer-backdrop{background:var(--scrim);z-index:var(--z-drawer);opacity:1;transition:opacity var(--motion-slow) var(--ease-sheet);position:fixed;inset:0}.drawer-backdrop[data-starting-style],.drawer-backdrop[data-ending-style]{opacity:0}.drawer-backdrop[data-ending-style]{transition:opacity var(--motion-slow) var(--ease-sheet-out)}.drawer-viewport{z-index:var(--z-drawer);pointer-events:none;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.drawer-viewport>*{pointer-events:auto}.drawer-sheet{background:var(--surface);border-radius:var(--radius-lg) var(--radius-lg) 0 0;width:100%;max-width:480px;max-height:min(72vh,560px);box-shadow:var(--shadow-md);padding:var(--space-2) 0 0;transition:transform var(--motion-slow) var(--ease-sheet);touch-action:none;flex-direction:column;display:flex;transform:translateY(0)}.drawer-sheet[data-starting-style],.drawer-sheet[data-ending-style]{transform:translateY(100%)}.drawer-sheet[data-ending-style]{transition:transform var(--motion-slow) var(--ease-sheet-out)}.drawer-sheet-tall{max-height:min(90vh,720px)}@media (width>=768px){.drawer-sheet-tall{max-width:680px}}.drawer-sheet[data-swiping]{transform:translateY(var(--drawer-swipe-movement-y,0px));transition:none}.drawer-grabber{padding:var(--space-2) var(--space-6);cursor:grab;touch-action:none;align-self:center}.drawer-grabber:active{cursor:grabbing}.drawer-grabber-bar{border-radius:var(--radius-full);background:var(--border);width:36px;height:4px;display:block}.drawer-title{margin:0 0 var(--space-2);font-size:var(--font-md);font-weight:var(--weight-bold);color:var(--text);text-align:center}.drawer-body{padding:var(--space-4) var(--space-3) calc(var(--space-4) + var(--safe-bottom));overscroll-behavior:contain;touch-action:pan-y;scrollbar-width:none;-ms-overflow-style:none;flex-direction:column;flex:1;display:flex;overflow-y:auto}.drawer-body::-webkit-scrollbar{display:none}*{box-sizing:border-box;margin:0;padding:0}@font-face{font-family:Nunito;font-style:normal;font-weight:200 1000;font-display:swap;src:url(/fonts/nunito-latin.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Nunito;font-style:normal;font-weight:200 1000;font-display:swap;src:url(/fonts/nunito-vietnamese.woff2)format("woff2");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}:root{--bg:#f4f4f5;--surface:#fff;--surface-glass:#ffffffe0;--surface-hover:#ececee;--text:#1f1f23;--text-dim:#696973;--text-invert:#fff;--border:#e4e4e7;--accent:#27272a;--accent-strong:#09090b;--accent-gradient:linear-gradient(135deg, #3f3f46, var(--accent-strong));--success:#10b981;--danger:#ef4444;--paper:#fff;--paper-dim:#fafafa;--gradient-mint:linear-gradient(135deg, #ddf1e0, #c4e7cc);--gradient-peach:linear-gradient(135deg, #fcead3, #f9d8b4);--gradient-sky:linear-gradient(135deg, #dde9f7, #c3d9f0);--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--radius-sm:10px;--radius-md:14px;--radius-lg:20px;--radius-xl:28px;--radius-full:999px;--font-family:"Nunito", ui-rounded, "SF Pro Rounded", "Segoe UI", system-ui, -apple-system, sans-serif;--font-xs:12px;--font-sm:13px;--font-md:14px;--font-lg:16px;--font-xl:20px;--font-3xl:28px;--leading-body:1.45;--leading-heading:1.2;--weight-regular:400;--weight-semibold:600;--weight-bold:700;--weight-heavy:800;--motion-fast:.15s;--motion-base:.2s;--motion-slow:.25s;--ease-spring:cubic-bezier(.34, 1.56, .64, 1);--ease-sheet:cubic-bezier(.32, .72, 0, 1);--ease-sheet-out:cubic-bezier(.4, 0, .9, .45);--shadow-sm:0 1px 3px #00000012;--shadow-md:0 8px 28px #0000001f;--shadow-accent:0 4px 12px #00000047;--ink-rgb:15, 23, 42;--scrim:rgba(var(--ink-rgb), .32);--scrim-heavy:#18181bb8;--ring-inset-strong:rgba(var(--ink-rgb), .2);--ring-inset:rgba(var(--ink-rgb), .15);--ring-inset-soft:rgba(var(--ink-rgb), .12);--surface-inverse:#1e293beb;--surface-veil:#ffffffa6;--sheen-highlight:#ffffff8c;--glow-photo:#58b26a47;--glow-text:#eb983d47;--glow-upload:#4c89c847;--ring-select:0 0 0 2px var(--surface), 0 0 0 4.5px var(--accent);--control-md:38px;--control-touch:44px;--header-height:56px;--bottom-bar-height:72px;--banner-height:50px;--z-canvas-overlay:5;--z-dock:10;--z-bar:20;--z-hint:25;--z-drawer:30;--z-popover-backdrop:39;--z-popover:40;--z-menu:50;--z-celebration:60;--z-blocking:70;--z-toast:80;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--safe-right:env(safe-area-inset-right,0px)}button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}html,body,#root{overscroll-behavior:none;height:100%;font-family:var(--font-family);line-height:var(--leading-body);background:var(--bg);color:var(--text);-webkit-tap-highlight-color:transparent;overflow:hidden}button,input,select,textarea,optgroup{font:inherit;letter-spacing:inherit}button{appearance:none}button,img,h1,h2,h3,h4,[role=button],[role=tab],[role=radio]{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}input,textarea,[contenteditable=true]{-webkit-user-select:text;user-select:text}.app{flex-direction:column;height:100%;display:flex}.offline-banner{top:calc(var(--safe-top) + var(--space-3));z-index:var(--z-celebration);align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);background:var(--accent-strong);color:var(--text-invert);font-size:var(--font-sm);font-weight:var(--weight-semibold);border-radius:var(--radius-full);box-shadow:var(--shadow-md);pointer-events:none;animation:offline-banner-in var(--motion-slow) ease-out;display:flex;position:fixed;left:50%;transform:translate(-50%)}.offline-banner-ok{background:var(--accent)}@keyframes offline-banner-in{0%{opacity:0;transform:translate(-50%)translateY(-8px)}to{opacity:1;transform:translate(-50%)translateY(0)}}@media (prefers-reduced-motion:reduce){.offline-banner{animation:none}}.editor-wrap{flex:1;min-height:0;position:relative;overflow:hidden}.stage-container{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;background:radial-gradient(ellipse at 50% 0%, var(--paper-dim) 0%, var(--bg) 70%);position:absolute;inset:0;overflow:hidden}.stage-container .konvajs-content{animation:stage-fade var(--motion-base) ease}@keyframes stage-fade{0%{opacity:0}to{opacity:1}}.stage-container.tool-fill{cursor:pointer}.stage-container.tool-picker{cursor:copy}.stage-container.tool-brush,.stage-container.tool-eraser{cursor:crosshair}.hint-pill{background:var(--accent-gradient);box-shadow:var(--shadow-accent);color:var(--text-invert);font-size:var(--font-sm);font-weight:var(--weight-semibold);border-radius:var(--radius-full);z-index:var(--z-hint);pointer-events:none;animation:hint-in var(--motion-slow) ease;white-space:nowrap;max-width:calc(100vw - 24px);padding:8px 18px;position:absolute;top:14px;left:50%;transform:translate(-50%)}@keyframes hint-in{0%{opacity:0;transform:translate(-50%,-6px)}to{opacity:1;transform:translate(-50%)}}.tool-options{flex-wrap:wrap;align-items:center;gap:14px;min-width:0;max-width:100%;padding:6px 12px 2px;display:flex}.tool-options>*{flex:none}.size-dots{align-items:center;gap:var(--space-3);flex:none;display:flex}.size-dot{background:var(--surface-hover);cursor:pointer;width:44px;height:44px;transition:outline-color var(--motion-fast), background var(--motion-fast);outline-offset:-6px;border:none;border-radius:50%;outline:2px solid #0000;place-items:center;display:grid;position:relative}.size-dot-fill{background:var(--text-dim);transition:background var(--motion-fast);border-radius:50%}.size-dot.on{outline-color:var(--accent)}.size-dot.on .size-dot-fill{background:var(--accent)}.brush-categories{--brush-disc-size:56px;--brush-tile-min:76px;gap:var(--space-4);width:100%;padding:var(--space-1) 0;flex-direction:column;display:flex}.brush-category{gap:var(--space-2);flex-direction:column;display:flex}.tool-field{align-items:flex-start;gap:var(--space-3);width:100%;padding:var(--space-2) 0;flex-direction:column;display:flex}.tool-field .tool-options.options-row{justify-content:flex-start;width:100%}.tool-field-label{font-size:var(--font-sm);font-weight:var(--weight-bold);color:var(--text-dim)}.brush-category-row{grid-template-columns:repeat(auto-fill, minmax(var(--brush-tile-min), 1fr));align-items:stretch;gap:var(--space-2);display:grid}.tool-icon{object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;display:block}.brush-tile{border-radius:var(--radius-md);width:100%;color:var(--text-dim);cursor:pointer;transition:transform var(--motion-fast), background var(--motion-fast);background:0 0;border:none;flex-direction:column;align-items:center;gap:1px;padding:2px;display:flex;position:relative}.brush-tile-disc{width:var(--brush-disc-size);height:var(--brush-disc-size);border-radius:var(--radius-full);background:var(--surface-hover);transition:background var(--motion-fast), box-shadow var(--motion-fast);place-items:center;display:grid;box-shadow:inset 0 0 #0000}.brush-tile .tool-icon{width:calc(var(--brush-disc-size) * .82);height:calc(var(--brush-disc-size) * .82);flex:none}.brush-tile-label{-webkit-hyphens:auto;hyphens:auto;overflow-wrap:break-word;justify-content:center;align-items:flex-start;max-width:100%;min-height:1lh;line-height:1.25;display:flex}@media (hover:hover) and (pointer:fine){.brush-tile:hover .brush-tile-disc{background:var(--border)}}.brush-tile:active{transform:scale(.94)}.brush-tile.on .brush-tile-disc{box-shadow:inset 0 0 0 2.5px var(--accent);background:var(--surface)}.brush-tile.on{color:var(--text)}.style-chip{cursor:pointer;width:44px;height:44px;box-shadow:inset 0 0 0 1.5px var(--ring-inset);transition:transform var(--motion-fast);border:none;border-radius:50%;position:relative}@media (hover:hover) and (pointer:fine){.style-chip:hover{transform:scale(1.06)}}.style-chip.active{box-shadow:inset 0 0 0 2.5px var(--accent), inset 0 0 0 4.5px var(--paper);outline-offset:3px;outline:2px solid #0000}.corner-anchor{top:calc(var(--space-3) + var(--safe-top));z-index:var(--z-dock);position:absolute}.corner-anchor-left{left:calc(var(--space-3) + var(--safe-left))}.corner-anchor-right{right:calc(var(--space-3) + var(--safe-right))}.corner-anchor-top{gap:var(--space-2);display:flex;left:50%;transform:translate(-50%)}.floating-toolbar{--floating-btn-size:56px;left:50%;bottom:calc(var(--space-4) + var(--safe-bottom));align-items:center;gap:var(--space-3);z-index:var(--z-dock);display:flex;position:absolute;transform:translate(-50%)}.floating-toolbar-btn{width:var(--floating-btn-size);height:var(--floating-btn-size);border-radius:var(--radius-full);background:var(--surface);color:var(--text);cursor:pointer;box-shadow:inset 0 0 0 1.5px var(--ring-inset);transition:transform var(--motion-fast);border:none;place-items:center;display:grid}.floating-toolbar-btn:active{transform:scale(.92)}.floating-toolbar-pick.active{background:var(--accent);color:var(--text-invert);box-shadow:none}.floating-toolbar-icon{width:calc(var(--floating-btn-size) * .74);height:calc(var(--floating-btn-size) * .74);object-fit:contain;pointer-events:none}.floating-toolbar-swatch{width:calc(var(--floating-btn-size) * .7);height:calc(var(--floating-btn-size) * .7);box-shadow:inset 0 0 0 1.5px var(--ring-inset);pointer-events:none;border-radius:50%}.palette-bar{gap:var(--space-2);flex-direction:column;min-height:0;max-height:100%;display:flex}.drawer-body:has(>.palette-bar){overflow:hidden}.palette-bar>.shade-slider,.palette-bar>.swatch-scroll,.palette-bar>.recent-colors,.palette-bar>.palette-utils,.palette-bar>.palette-cats,.palette-bar>.picker-actions{flex:none}.palette-cats{gap:var(--space-2);overscroll-behavior-x:contain;scrollbar-width:none;margin-block:-7px;padding-block:7px;display:flex;overflow:auto hidden}.palette-cats::-webkit-scrollbar{display:none}.palette-cat{height:34px;padding:0 var(--space-3);white-space:nowrap;border:1px solid var(--border);border-radius:var(--radius-full);background:var(--surface);color:var(--text-dim);font-size:var(--font-sm);font-weight:var(--weight-bold);cursor:pointer;transition:background var(--motion-fast), border-color var(--motion-fast), color var(--motion-fast);flex:none;position:relative}.palette-cat:before{content:"";position:absolute;inset:-5px 0}@media (hover:hover) and (pointer:fine){.palette-cat:hover{border-color:var(--accent)}}.palette-cat.active{border-color:var(--accent);background:var(--accent);color:var(--text-invert)}.options-row{justify-content:center;align-items:center;gap:var(--space-3);padding:var(--space-2) 0;display:flex}.shade-slider{--shade-thumb-size:30px;border-radius:var(--radius-full);cursor:pointer;width:100%;max-width:640px;height:36px;box-shadow:inset 0 0 0 1px var(--ring-inset-soft);touch-action:none;margin:0 auto;position:relative}.shade-slider:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.shade-thumb{width:var(--shade-thumb-size);height:var(--shade-thumb-size);box-shadow:0 0 0 3px var(--paper), var(--shadow-accent);pointer-events:none;transition:box-shadow var(--motion-fast), scale var(--motion-fast);will-change:left;border-radius:50%;position:absolute;top:50%;transform:translate(-50%,-50%)}.shade-slider:active .shade-thumb,.shade-slider:focus-visible .shade-thumb{box-shadow:0 0 0 3px var(--paper), 0 0 0 5px var(--ring-inset-strong), var(--shadow-accent);scale:1.12}.palette-tabs{gap:var(--space-2);grid-template-columns:repeat(3,1fr);display:grid}.palette-tabs-modal{overscroll-behavior:contain;flex:auto;align-content:start;min-height:0;margin-inline:-3px;padding-inline:3px;overflow-y:auto}.palette-card{border:1px solid var(--border);border-radius:var(--radius-lg);cursor:pointer;transition:background var(--motion-fast), border-color var(--motion-fast), box-shadow var(--motion-fast);background:0 0;flex-direction:column;gap:6px;padding:10px;display:flex}.palette-card.active{background:var(--surface-hover);box-shadow:inset 0 0 0 2px var(--accent), inset 0 0 0 4px var(--paper);border-color:#0000}@media (hover:hover) and (pointer:fine){.palette-card:not(.active):hover{border-color:var(--accent);background:var(--surface-hover)}}.palette-card.active .palette-card-name{color:var(--accent)}.palette-card-swatches{grid-template-columns:repeat(6,1fr);align-self:stretch;gap:2px;width:100%;display:grid}.palette-card-swatches span{aspect-ratio:1;box-shadow:inset 0 0 0 1px var(--ring-inset-soft);border-radius:50%;display:block}.palette-card-name{font-size:var(--font-xs);line-height:1.2;font-weight:var(--weight-bold);color:var(--text);text-align:left;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.palette-tab-dots{gap:2px;display:inline-flex}.palette-tab-dots span{width:7px;height:7px;box-shadow:inset 0 0 0 .5px var(--ring-inset-strong);border-radius:50%}.palette-utils{align-items:center;gap:var(--space-2);padding:4px 0;display:flex}.palette-utils .palette-switch-chip{flex:1}.swatch-scroll{grid-template-columns:repeat(auto-fit, minmax(var(--control-touch), 1fr));align-items:center;gap:10px;padding:6px 0;display:grid}.recent-colors{gap:var(--space-2);padding-bottom:var(--space-3);border-bottom:1px solid var(--border);flex-direction:column;display:flex}.recent-colors-label{font-size:var(--font-xs);font-weight:var(--weight-semibold);color:var(--text-dim)}.recent-swatch-scroll{padding:0}.palette-switch-chip{justify-content:center;align-items:center;gap:var(--space-2);min-height:var(--control-touch);padding:0 var(--space-3);border:1px solid var(--border);border-radius:var(--radius-full);background:var(--surface);color:var(--text);font-size:var(--font-sm);font-weight:var(--weight-bold);cursor:pointer;transition:background var(--motion-fast), border-color var(--motion-fast);display:flex}@media (hover:hover) and (pointer:fine){.palette-switch-chip:hover{border-color:var(--accent);background:var(--surface-hover)}}.palette-switch-chip:active{background:var(--surface-hover);scale:.98}.palette-switch-chip:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.palette-switch-chevron{color:var(--text-dim);flex:none;width:16px;height:16px}.swatch{cursor:pointer;width:30px;height:30px;box-shadow:inset 0 0 0 1.5px var(--ring-inset), var(--shadow-sm);transition:transform var(--motion-fast);border:none;border-radius:50%;flex:none;position:relative}.swatch-scroll .swatch{aspect-ratio:1;width:100%;height:auto;min-width:var(--control-touch);justify-self:center;max-width:48px}.swatch:after{content:"";border-radius:50%;position:absolute;inset:-7px}@media (hover:hover) and (pointer:fine){.swatch:hover{transform:scale(1.06)}}.swatch:active{transform:scale(.92)}.swatch.active{box-shadow:inset 0 0 0 3px var(--text)}.recent-swatch-scroll .swatch.active{box-shadow:inset 0 0 0 2px var(--paper), inset 0 0 0 4px var(--accent), var(--shadow-sm)}.swatch.tool-swatch{width:var(--control-touch);height:var(--control-touch);background:var(--surface-hover);color:var(--text-dim);place-items:center;display:grid}.swatch.tool-swatch.active{background:var(--accent);color:var(--text-invert)}.swatch.custom.active{box-shadow:inset 0 0 0 1.5px var(--ring-inset)}.swatch.custom{width:var(--control-touch);height:var(--control-touch);background:radial-gradient(circle, var(--paper) 0 28%, transparent 30%), conic-gradient(#ef4444, #facc15, #22c55e, #0ea5e9, #8b5cf6, #ec4899, #ef4444);place-items:center;display:grid}.custom-dot{width:16px;height:16px;box-shadow:inset 0 0 0 1px var(--ring-inset-strong);border-radius:50%}.picker-value{align-items:center;gap:var(--space-3);margin-top:var(--space-3);font-size:var(--font-lg);font-weight:var(--weight-bold);color:var(--text);font-variant-numeric:tabular-nums;display:flex}.picker-chip{width:44px;height:44px;box-shadow:inset 0 0 0 1.5px var(--ring-inset), var(--shadow-sm);border-radius:50%;flex-shrink:0}.picker-hex{width:10ch}.picker-actions{gap:var(--space-3);margin-top:var(--space-4);display:flex}.picker-actions>*{flex:1}.gallery{flex-direction:column;height:100%;display:flex;position:relative}.gallery-body{padding:var(--space-4) calc(var(--space-3) + var(--safe-right)) calc(var(--space-6) + var(--safe-bottom)) calc(var(--space-3) + var(--safe-left));scrollbar-width:none;flex:1;overflow:hidden auto}.gallery-body::-webkit-scrollbar{display:none}.page-col{width:min(960px,100%);margin-inline:auto}.tab-panel{gap:var(--space-4);width:100%;margin:0 0 var(--space-6);flex-direction:column;display:flex}.tab-panel,.page-head,.gallery-grid{animation:stage-fade var(--motion-base) ease}.page-head{justify-content:space-between;align-items:center;gap:var(--space-3);margin:var(--space-2) 0 var(--space-3);display:flex}.page-head-actions{gap:var(--space-1);display:flex}.page-head-sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:0;padding:0;position:absolute;overflow:hidden}.project-loading-card{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);overflow:hidden}.project-loading-caption{padding:var(--space-3)}.gallery-grid{gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}.project-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);cursor:pointer;transition:box-shadow var(--motion-fast);text-align:left;flex-direction:column;padding:0;display:flex;position:relative;overflow:visible}@media (hover:hover) and (pointer:fine){.project-card:hover{box-shadow:var(--shadow-md)}}.project-thumb{aspect-ratio:1;object-fit:contain;background:var(--paper);border-bottom:1px solid var(--border);border-radius:calc(var(--radius-lg) - 1px) calc(var(--radius-lg) - 1px) 0 0;opacity:0;width:100%;transition:opacity var(--motion-slow) ease;display:block}.project-thumb.loaded{opacity:1}img.thumb-broken{opacity:1;background:var(--surface-hover)}.project-card-footer{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);display:flex}.project-meta{flex:1;min-width:0}.project-progress{border-radius:var(--radius-full);background:var(--border);height:6px;margin-bottom:var(--space-1);overflow:hidden}.project-progress-fill{border-radius:var(--radius-full);background:var(--accent-gradient);height:100%;transition:width var(--motion-base) ease}.project-done-slot{top:var(--space-2);left:var(--space-2);display:flex;position:absolute}.new-project-tile{justify-content:center;align-items:center;gap:var(--space-2);border:2px dashed var(--accent);border-radius:var(--radius-lg);min-height:160px;color:var(--accent);font-size:var(--font-md);font-weight:var(--weight-bold);cursor:pointer;transition:background var(--motion-fast);background:0 0;flex-direction:column;display:flex}@media (hover:hover) and (pointer:fine){.new-project-tile:hover{background:var(--surface-hover)}}.gallery-body{padding-bottom:calc(var(--bottom-bar-height) + var(--safe-bottom))}.gallery[data-banner] .gallery-body{padding-bottom:calc(var(--bottom-bar-height) + var(--safe-bottom) + var(--banner-height))}.credit-pill{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border:1px solid var(--border);border-radius:var(--radius-full);background:var(--surface);color:var(--text);font-size:var(--font-md);font-weight:var(--weight-bold);line-height:1;display:inline-flex}.credit-pill[data-low]{border-color:var(--danger);color:var(--danger)}.credit-pill-value{font-variant-numeric:tabular-nums}.credit-pill-action{cursor:pointer;transition:background var(--motion-fast), opacity var(--motion-fast);position:relative}.credit-pill-action:disabled{cursor:default}.credit-pill-action:disabled .credit-pill-plus{opacity:.4}.credit-pill-action:before{content:"";height:44px;position:absolute;inset:50% 0 auto;transform:translateY(-50%)}.credit-pill-plus{border-radius:var(--radius-full);background:var(--accent);width:18px;height:18px;color:var(--text-invert);place-items:center;display:grid}@media (hover:hover) and (pointer:fine){.credit-pill-action:hover{background:var(--surface-hover)}}.credit-granted{align-items:center;gap:var(--space-2);text-align:center;flex-direction:column;display:flex}.credit-granted-icon{border-radius:var(--radius-full);background:var(--accent-gradient);width:64px;height:64px;color:var(--text-invert);place-items:center;display:grid}.credit-granted-amount{font-size:var(--font-3xl);font-weight:var(--weight-heavy);color:var(--text);line-height:1.1}.tab-icon-wrap{display:inline-flex;position:relative}.tab-icon-corner{font-variant-numeric:tabular-nums;position:absolute;top:-6px;left:60%}.earn-credits-card{align-items:center;gap:var(--space-3);margin-bottom:var(--space-3);display:flex}.earn-credits-icon{border-radius:var(--radius-full);background:var(--accent-gradient);width:44px;height:44px;color:var(--text-invert);flex:none;place-items:center;display:grid}.earn-credits-body{min-width:0}@media (width>=1025px){.app[data-screen=editor] .shade-slider{height:32px}}@media (prefers-reduced-motion:reduce){.stage-container .konvajs-content,.tab-panel,.page-head,.gallery-grid,.app[data-screen],.gallery-grid>*,.hint-pill{animation:none}.brush-tile{transition:none}.project-thumb{opacity:1;transition:none}}@media (width>=768px){.swatch{width:48px;height:48px}.swatch-scroll{gap:12px}}@media (orientation:portrait){.swatch-scroll{grid-template-columns:repeat(6,1fr)}}.tool-options{justify-content:center;padding:4px 8px 2px}@media (width>=768px){.swatch-scroll,.palette-utils{width:100%;max-width:720px;margin-inline:auto}}@media (orientation:landscape) and (width>=900px){.swatch-scroll{grid-template-columns:repeat(12,1fr);gap:10px}}@media (orientation:landscape){.corner-anchor-top{left:calc(var(--space-3) + var(--safe-left));right:auto;top:calc(var(--space-3) + var(--safe-top) + var(--control-touch) + var(--space-2));gap:var(--space-1);flex-direction:column;transform:none}.floating-toolbar{left:auto;right:calc(var(--space-3) + var(--safe-right));top:auto;bottom:calc(var(--space-4) + var(--safe-bottom));--floating-btn-size:52px;gap:var(--space-3);flex-direction:column;transform:none}}@media (orientation:landscape) and (height<=400px){.floating-toolbar{--floating-btn-size:44px;gap:var(--space-2)}}@media (height<=500px){:root{--header-height:48px}.shade-slider{--shade-thumb-size:24px;height:28px}.brush-categories{--brush-disc-size:44px;--brush-tile-min:60px;gap:var(--space-2)}.brush-category{gap:var(--space-1)}.palette-bar{height:100%}.palette-bar>.swatch-scroll{min-height:0;overflow-y:auto}.palette-tabs{grid-template-columns:repeat(2,1fr)}.palette-cats{overscroll-behavior-x:contain;flex-wrap:nowrap;padding-bottom:2px;overflow-x:auto}.palette-cat{flex:none}.palette-switch-chip{white-space:nowrap;min-width:0}.palette-switch-name{text-overflow:ellipsis;overflow:hidden}.tool-options{padding:2px 8px}}@media (width<=640px){:root{--header-height:48px}.shade-slider{--shade-thumb-size:26px;height:32px}.swatch{width:var(--control-touch);height:var(--control-touch)}}@media (width<=360px){.floating-toolbar{--floating-btn-size:48px;gap:var(--space-2)}}@media (width>=900px){.gen-menu{flex-direction:row}.gen-menu .gen-feature{flex:1}}.gen-guest-prompt{text-align:center;align-items:center}.gen-hero{align-items:center;gap:var(--space-3);display:flex}.gen-hero-icon{border-radius:var(--radius-md);background:var(--accent-gradient);width:52px;height:52px;color:var(--text-invert);box-shadow:var(--shadow-accent);flex:none;place-items:center;display:grid}.gen-hero-sub{margin-top:2px}.gen-menu{gap:var(--space-4)}.gen-feature{align-items:flex-start;gap:var(--space-1);text-align:left;padding:var(--space-6);border-radius:var(--radius-xl);font:inherit;cursor:pointer;box-shadow:var(--shadow-sm);transition:transform var(--motion-fast), box-shadow var(--motion-fast);border:none;flex-direction:column;flex:none;display:flex;position:relative;overflow:hidden}@media (hover:hover) and (pointer:fine){.gen-feature:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}}.gen-feature:active{transform:none}.gen-feature-photo{background:var(--gradient-mint)}.gen-feature-text{background:var(--gradient-peach)}.gen-feature-upload{background:var(--gradient-sky)}.gen-feature:before{content:"";pointer-events:none;border-radius:50%;width:220px;height:180px;position:absolute;top:-70px;right:-40px;transform:rotate(-18deg)}.gen-feature-photo:before{background:radial-gradient(closest-side, var(--glow-photo), transparent)}.gen-feature-text:before{background:radial-gradient(closest-side, var(--glow-text), transparent)}.gen-feature-upload:before{background:radial-gradient(closest-side, var(--glow-upload), transparent)}.gen-feature-body{align-items:flex-start;gap:var(--space-1);flex-direction:column;min-width:0;padding-right:56px;display:flex}.gen-feature-icon{border-radius:var(--radius-full);background:var(--surface);width:48px;height:48px;color:var(--text);box-shadow:var(--shadow-sm);place-items:center;display:grid}.gen-feature-go{right:var(--space-4);bottom:var(--space-4);border-radius:var(--radius-full);background:var(--surface);width:48px;height:48px;color:var(--text);box-shadow:var(--shadow-sm);place-items:center;display:grid;position:absolute}.gen-fullscreen{scrollbar-width:none;min-height:0;padding:calc(var(--safe-top) + var(--space-3)) calc(var(--space-4) + var(--safe-right)) calc(var(--space-6) + var(--safe-bottom)) calc(var(--space-4) + var(--safe-left));flex:1;overflow-y:auto}.gen-fullscreen::-webkit-scrollbar{display:none}.gen-screen{gap:var(--space-3)}.gen-screen-head{justify-content:space-between;align-items:center;gap:var(--space-3);display:flex}.gen-screen-title{max-width:32ch}.gen-composer{align-items:flex-end;gap:var(--space-2);padding:var(--space-2) var(--space-2) var(--space-2) var(--space-4);border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow-sm);transition:border-color var(--motion-fast), box-shadow var(--motion-fast);border-radius:28px;scroll-margin-block:80px;display:flex}.gen-composer:focus-within{border-color:var(--accent);box-shadow:var(--shadow-md)}.gen-composer[data-busy]{opacity:.6}.gen-ratio-scroll{gap:var(--space-2);grid-template-columns:repeat(auto-fit,minmax(78px,1fr));min-width:0;margin:-2px;padding:2px;display:grid}.gen-ratio-frame{border:1.5px solid;border-radius:2px;flex:none;display:inline-block}.gen-ideas{gap:var(--space-2)}.gen-style-scroll{min-width:0}.gen-upload-drop{text-align:center;align-items:center;gap:var(--space-4);padding:calc(var(--space-6) + var(--space-4)) var(--space-6);border-radius:var(--radius-xl);background:var(--surface);box-shadow:var(--shadow-sm);font:inherit;cursor:pointer;transition:box-shadow var(--motion-fast);border:none;flex-direction:column;display:flex}@media (hover:hover) and (pointer:fine){.gen-upload-drop:hover:not(:disabled){box-shadow:var(--shadow-md)}}.gen-upload-icon{border-radius:var(--radius-full);background:var(--bg);width:64px;height:64px;color:var(--text-dim);flex:none;place-items:center;display:grid}.gen-upload-text{max-width:28ch}.gen-upload-cta{height:var(--control-touch);padding:0 var(--space-6);border-radius:var(--radius-full);background:var(--accent);color:var(--text-invert);font-size:var(--font-md);font-weight:var(--weight-bold);justify-content:center;align-items:center;display:inline-flex}.gen-upload-preview{gap:var(--space-3);padding:var(--space-3);border:1px solid var(--border);border-radius:var(--radius-xl);background:var(--surface);box-shadow:var(--shadow-sm);flex-direction:column;display:flex}.gen-upload-preview[data-busy]{opacity:.6}.gen-upload-thumb{align-items:center;gap:var(--space-2);font:inherit;cursor:pointer;background:0 0;border:none;flex-direction:column;padding:0;display:flex}.gen-upload-thumb img{border-radius:var(--radius-md);object-fit:contain;max-width:100%;max-height:240px}.gen-upload-swap{min-height:32px;font-size:var(--font-xs);font-weight:var(--weight-bold);color:var(--text-dim);align-items:center;display:inline-flex}@media (hover:hover) and (pointer:fine){.gen-upload-thumb:hover:not(:disabled) .gen-upload-swap{color:var(--text)}}.gen-error{font-size:var(--font-sm);color:var(--danger)}.gen-progress{gap:var(--space-3);font-size:var(--font-sm);color:var(--text-dim);text-align:center;flex-direction:column;display:flex;container-type:inline-size}.gen-placeholder{width:100%;max-height:56.25cqw;color:var(--text-dim);background:var(--surface-hover);border:1px solid var(--border);border-radius:var(--radius-lg);justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.gen-placeholder-photo{object-fit:cover;opacity:.5;filter:grayscale(.6);width:100%;height:100%}.gen-placeholder-icon{border-radius:var(--radius-full);width:64px;height:64px;color:var(--accent);background:var(--surface);box-shadow:var(--shadow-sm);place-items:center;animation:2s ease-in-out infinite alternate gen-icon-breathe;display:grid;position:relative}.gen-placeholder-sheen{background:linear-gradient(100deg, transparent 30%, var(--sheen-highlight) 50%, transparent 70%);background-size:220% 100%;animation:1.5s linear infinite gen-sheen;position:absolute;inset:0}@keyframes gen-sheen{0%{background-position:160% 0}to{background-position:-60% 0}}@keyframes gen-icon-breathe{0%{transform:scale(1)}to{transform:scale(1.08)}}.gen-stage-msg{justify-content:center;align-items:center;gap:var(--space-2);font-size:var(--font-md);font-weight:var(--weight-bold);color:var(--text);display:flex}.gen-stage-dots{gap:3px;display:inline-flex}.gen-stage-dots i{border-radius:var(--radius-full);background:var(--accent);width:5px;height:5px;animation:1.1s ease-in-out infinite gen-dot}.gen-stage-dots i:nth-child(2){animation-delay:.15s}.gen-stage-dots i:nth-child(3){animation-delay:.3s}@keyframes gen-dot{0%,60%,to{opacity:.25;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}.gen-progress-note{max-width:34ch;margin-inline:auto;line-height:1.5}@media (prefers-reduced-motion:reduce){.gen-placeholder-sheen,.gen-placeholder-icon,.gen-stage-dots i{animation:none}}.home-panel{margin-top:var(--space-2);gap:var(--space-3)}.home-sub{margin-top:calc(-1 * var(--space-2))}.resume-tile{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);cursor:pointer;flex:none;width:120px;height:120px;padding:0;position:relative;overflow:hidden}.resume-tile img{object-fit:cover;width:100%;height:100%}.resume-tile-pct{left:var(--space-1);bottom:var(--space-1);padding:1px var(--space-2);border-radius:var(--radius-full);background:var(--surface-glass);font-size:var(--font-xs);font-weight:var(--weight-bold);color:var(--text);position:absolute}.hero-card{align-items:stretch;gap:var(--space-3);border:1px solid var(--border);border-radius:var(--radius-xl,var(--radius-lg));background:var(--surface);width:min(300px,78%);padding:var(--space-3);cursor:pointer;box-shadow:var(--shadow-sm);text-align:left;flex:none;display:flex}@media (hover:hover) and (pointer:fine){.hero-card:hover{background:var(--surface-hover)}}.hero-info{justify-content:center;gap:var(--space-2);flex-direction:column;flex:1;min-width:0;display:flex}.hero-badge-slot{align-self:flex-start;display:flex}.hero-date{color:var(--text-dim);font-size:var(--font-sm);font-weight:var(--weight-bold)}.hero-title{text-overflow:ellipsis;overflow:hidden}.hero-card img{aspect-ratio:1;object-fit:cover;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--paper);flex:none;width:96px}.template-card{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);cursor:pointer;width:140px;box-shadow:var(--shadow-sm);flex-direction:column;flex:none;padding:0;display:flex}@media (hover:hover) and (pointer:fine){.template-card:hover{background:var(--surface-hover)}}.template-card img{aspect-ratio:1;object-fit:cover;border-radius:inherit;background:var(--paper);width:100%}.home-ai-actions{gap:var(--space-3);margin:var(--space-3) 0 var(--space-4);flex-direction:column;display:flex}.library{gap:var(--space-3);margin-top:var(--space-3);flex-direction:column;display:flex}.library-chips{gap:var(--space-2);margin-block:calc(-1 * var(--space-2)) -6px}.library-grid{margin-top:var(--space-2)}.library-grid .template-card{width:auto}.library-loading{padding:var(--space-6) 0}.library-sentinel{height:1px}.library-more{justify-content:center;display:flex}.profile-avatar{border-radius:var(--radius-full);background:var(--accent-gradient);width:56px;height:56px;color:var(--text-invert);font-size:var(--font-xl);font-weight:var(--weight-bold);flex:none;place-items:center;display:grid;overflow:hidden}.profile-avatar img{object-fit:cover;width:100%;height:100%}.profile-info{flex:1;min-width:0}.profile-name{font-weight:var(--weight-bold);font-size:var(--font-lg);color:var(--text)}.profile-email{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.profile-credit{gap:var(--space-2);flex-direction:column;min-width:0;display:flex}.profile-credit-row{align-items:baseline;gap:var(--space-2);display:flex}.profile-credit-amount{font-size:var(--font-3xl);font-weight:var(--weight-heavy);color:var(--text);line-height:1.1}.profile-credit-unit{font-size:var(--font-md);font-weight:var(--weight-semibold);color:var(--text-dim)}.profile-credit-reset{align-items:center;gap:var(--space-2);color:var(--text-dim);display:flex}.profile-credit-earn{margin:var(--space-2) calc(-1 * var(--space-4)) calc(-1 * var(--space-4));padding:var(--space-2) var(--space-4) var(--space-2);border-top:1px solid var(--border)}.profile-avatar-empty{background:var(--surface-hover);color:var(--text-dim)}.profile-version{text-align:center;margin-top:var(--space-2);font-size:var(--font-xs);color:var(--text-dim)}.profile-setting-list{margin-top:var(--space-4);border-radius:var(--radius-md);border:1px solid var(--border);overflow:hidden}.profile-setting-item{justify-content:space-between;align-items:center;gap:var(--space-3);width:100%;min-height:44px;padding:var(--space-2) var(--space-3);border:none;border-top:1px solid var(--border);background:var(--surface);color:var(--text);font:inherit;text-align:left;appearance:none;transition:background-color var(--motion-fast) ease;text-decoration:none;display:flex}.profile-setting-item:first-child{border-top:none}a.profile-setting-item,button.profile-setting-item{cursor:pointer}a.profile-setting-item:active,button.profile-setting-item:active{background-color:var(--surface-hover)}@media (hover:hover) and (pointer:fine){a.profile-setting-item:hover,button.profile-setting-item:hover{background-color:var(--surface-hover)}}.profile-setting-label{font-size:var(--font-sm);color:var(--text)}.profile-setting-trailing{align-items:center;gap:var(--space-1);min-width:0;display:flex}.profile-setting-value{font-size:var(--font-sm);color:var(--text-dim);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.profile-setting-chevron{width:18px;height:18px;color:var(--text-dim);flex:none}.gallery-body{padding-top:calc(var(--safe-top) + var(--space-3))}.app[data-screen]{animation:page-fade-in var(--motion-slow) ease both}@keyframes page-fade-in{0%{opacity:0}to{opacity:1}}.gallery-grid>*{animation:card-in var(--motion-slow) ease both}.gallery-grid>:first-child{animation-delay:0s}.gallery-grid>:nth-child(2){animation-delay:30ms}.gallery-grid>:nth-child(3){animation-delay:60ms}.gallery-grid>:nth-child(4){animation-delay:90ms}.gallery-grid>:nth-child(5){animation-delay:.12s}.gallery-grid>:nth-child(6){animation-delay:.15s}.gallery-grid>:nth-child(7){animation-delay:.18s}.gallery-grid>:nth-child(8){animation-delay:.21s}.gallery-grid>:nth-child(n+9){animation-delay:.24s}@keyframes card-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.ui-scroll-row{gap:var(--space-3);-webkit-overflow-scrolling:touch;scrollbar-width:none;margin-inline:calc(-1 * var(--space-3));padding:6px var(--space-3);scroll-padding-inline:var(--space-3);display:flex;overflow-x:auto}.ui-scroll-row::-webkit-scrollbar{display:none}.ui-col-sm,.ui-col-md,.ui-col-lg{margin-inline:auto}.ui-col-sm{width:min(440px,100%)}.ui-col-md{width:min(560px,100%)}.ui-col-lg{width:min(720px,100%)}@media (width<=1024px){.ui-col-sm,.ui-col-md{width:100%}}.ui-card-grid{gap:var(--space-3);grid-template-columns:repeat(auto-fill,minmax(150px,1fr));width:100%;display:grid}
