:root{--color-ohmg-black: #1b1b1b;--color-ohmg-blue: #94dbff;--color-ohmg-red: #cc4722;--color-ohmg-yellow: #ffbf35;--color-ohmg-lilac: #b0afed;--color-ohmg-pink: #ff94c2;--text-color: var(--color-ohmg-black);--text-color-secondary: #666;--accent-color: var(--color-ohmg-lilac);--border-color-light: rgba(0, 0, 0, .1);--border-color-medium: rgba(0, 0, 0, .2);--background-overlay: rgba(255, 255, 255, .9);--background-white: #fff;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 12px;--spacing-lg: 20px;--spacing-xl: 40px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--font-size-xs: .8125rem;--font-size-sm: .875rem;--font-size-md: 1.25rem;--font-size-lg: 2rem;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--letter-spacing-tight: -.01em;--line-height-normal: 1.4;--transition-fast: .2s ease;--transition-medium: .3s ease;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .1);--shadow-md: 0 4px 20px rgba(0, 0, 0, .1);--blur-md: blur(10px);--z-nav: 10;--z-overlay: 1000;--nav-max-width: 300px;--thumbnail-size: 40px}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow-x:hidden;background-image:radial-gradient(circle,#ccc 1px,transparent 1px);background-size:20px 20px}#root{width:100%;min-height:100vh;position:relative}.nav{position:fixed;bottom:var(--spacing-lg);left:var(--spacing-lg);z-index:var(--z-nav);background:var(--background-overlay);-webkit-backdrop-filter:var(--blur-md);backdrop-filter:var(--blur-md);border-radius:var(--radius-lg);padding:var(--spacing-md) var(--spacing-lg);box-shadow:var(--shadow-md);border:1px solid rgba(255,255,255,.2);max-width:var(--nav-max-width)}@media (max-width: 768px){.nav{left:var(--spacing-lg);bottom:var(--spacing-lg)}}.nav__container{display:flex;flex-direction:column;gap:var(--spacing-md)}.nav__controls{display:flex;align-items:center;gap:var(--spacing-md)}.nav__thumbnails{display:flex;flex-direction:column;gap:var(--spacing-sm);align-items:center;overflow-x:hidden;overflow-y:auto;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;position:relative;flex:1}.nav__thumbnails::-webkit-scrollbar{display:none}.nav__thumbnail{width:var(--thumbnail-size);height:var(--thumbnail-size);object-fit:cover;border-radius:var(--radius-sm);border:2px solid rgba(255,148,194,.3);transition:all var(--transition-fast);cursor:pointer;flex-shrink:0}.nav__thumbnail:hover{border-color:var(--accent-color)}.nav__thumbnail--active{border-color:var(--accent-color);opacity:1}.nav__thumbnail--inactive{opacity:.3;border-color:var(--border-color-medium)}.nav__thumbnail--upload{border:2px dashed var(--accent-color);background:transparent;display:flex;align-items:center;justify-content:center;color:var(--accent-color);transition:opacity var(--transition-fast)}.nav__thumbnail--upload:hover{opacity:.7}.nav__caption{border-top:1px solid var(--border-color-light);padding-top:var(--spacing-md)}.nav__caption-title{font-size:var(--font-size-md);font-weight:var(--font-weight-bold);color:var(--accent-color);margin:0 0 var(--spacing-xs) 0;letter-spacing:var(--letter-spacing-tight)}.nav__caption-text{font-size:var(--font-size-xs);color:var(--text-color-secondary);margin:0;line-height:var(--line-height-normal)}.nav__caption-text a{color:var(--accent-color);transition:opacity var(--transition-fast)}.nav__caption-text a:hover{opacity:.7}.canvas-grid{display:flex;flex-wrap:wrap;gap:var(--spacing-xl);padding:var(--spacing-lg);margin:0 auto;justify-content:center}.canvas-grid__item{background:#f8f9fa;border-radius:var(--radius-md);overflow:hidden;box-shadow:var(--shadow-sm);display:flex;align-items:center;justify-content:center;max-width:300px;flex:0 1 auto;min-height:200px;position:relative}.canvas{display:block;max-width:100%;max-height:100%;width:auto;height:auto;cursor:pointer;object-fit:contain}.canvas-loading{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#999;font-size:12px;font-weight:500;text-align:center;pointer-events:none}.canvas-loading:after{content:"";animation:ellipsis 1.5s infinite}@keyframes ellipsis{0%,20%{content:""}40%{content:"."}60%{content:".."}80%,to{content:"..."}}.dropzone-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#ff94c233;z-index:var(--z-overlay);display:flex;align-items:center;justify-content:center;pointer-events:none;padding:var(--spacing-lg);box-sizing:border-box}.dropzone-overlay__border{width:100%;height:100%;border:1px dashed rgba(255,148,194,.8);display:flex;align-items:center;justify-content:center}.dropzone-overlay__content{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--background-white);text-align:center}*,*:before,*:after{box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}ul[role=list],ol[role=list]{list-style:none}body{line-height:1.5}h1,h2,h3,h4,button,input,label{line-height:1.1}h1,h2,h3,h4{text-wrap:balance}img,picture{max-width:100%;display:block}input,button,textarea,select{font:inherit}textarea:not([rows]){min-height:10em}:target{scroll-margin-block:5ex}