:root{--bg:#14141a;--panel:#1d1d26;--panel-2:#262631;--border:#33333f;--text:#e6e6ee;--text-dim:#9a9aad;--accent:#6ea8fe;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;font-size:14px}.app{flex-direction:column;height:100%;display:flex}.topbar{background:var(--panel);border-bottom:1px solid var(--border);flex-shrink:0;align-items:center;gap:20px;padding:10px 16px;display:flex}.brand{white-space:nowrap;margin:0;font-size:15px}.breadcrumbs{color:var(--text-dim);flex-wrap:wrap;align-items:center;gap:2px;display:flex}.crumb{align-items:center;gap:2px;display:inline-flex}.crumb-sep{color:var(--border);margin:0 4px}.crumb-link{color:var(--accent);cursor:pointer;font:inherit;background:0 0;border:none;border-radius:4px;padding:2px 4px}.crumb-link:hover{background:var(--panel-2)}.crumb-current{color:var(--text);font-weight:600}.logout-btn{background:var(--panel-2);border:1px solid var(--border);color:var(--text-dim);cursor:pointer;font:inherit;white-space:nowrap;border-radius:6px;margin-left:auto;padding:6px 12px}.logout-btn:hover{border-color:var(--accent);color:var(--text)}.auth-screen{justify-content:center;align-items:center;height:100%;padding:20px;display:flex}.auth-card{background:var(--panel);border:1px solid var(--border);border-radius:12px;flex-direction:column;gap:12px;width:100%;max-width:320px;padding:28px 24px;display:flex}.auth-title{text-align:center;margin:0;font-size:18px}.auth-sub{color:var(--text-dim);text-align:center;margin:0 0 4px;font-size:13px}.auth-input{background:var(--bg);border:1px solid var(--border);color:var(--text);font:inherit;border-radius:8px;padding:10px 12px}.auth-input:focus{border-color:var(--accent);outline:none}.auth-error{color:#ff8a8a;text-align:center;font-size:13px}.auth-btn{background:var(--accent);color:#0d0d12;font:inherit;cursor:pointer;border:none;border-radius:8px;padding:10px 12px;font-weight:600}.auth-btn:disabled{opacity:.5;cursor:default}.content{flex:1;padding:20px;overflow:auto}.status{color:var(--text-dim);text-align:center;padding:40px}.status.error{color:#ff8a8a}.status .hint{color:var(--text-dim);max-width:520px;margin:8px auto 0;font-size:12px}.section{margin-bottom:28px}.section-title{text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim);margin:0 0 12px;font-size:12px}.count{color:var(--border)}.section-head{justify-content:space-between;align-items:center;gap:16px;margin-bottom:12px;display:flex}.section-head .section-title{margin:0}.zoom-control{align-items:center;gap:8px;display:flex}.zoom-btn{background:var(--panel-2);border:1px solid var(--border);color:var(--text);cursor:pointer;width:26px;height:26px;line-height:1;font:inherit;border-radius:6px}.zoom-btn:hover{border-color:var(--accent)}.zoom-slider{width:120px;accent-color:var(--accent);cursor:pointer}.folder-list{flex-wrap:wrap;gap:10px;display:flex}.folder-chip{background:var(--panel);border:1px solid var(--border);color:var(--text);cursor:pointer;font:inherit;border-radius:8px;align-items:center;gap:8px;max-width:240px;padding:10px 14px;display:inline-flex}.folder-chip:hover{background:var(--panel-2);border-color:var(--accent)}.folder-name{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.thumb-grid{--thumb-size:140px;grid-template-columns:repeat(auto-fill, minmax(var(--thumb-size), 1fr));gap:14px;display:grid}.thumb{background:var(--panel);border:1px solid var(--border);cursor:pointer;font:inherit;color:var(--text);text-align:left;border-radius:10px;flex-direction:column;gap:6px;padding:8px;display:flex}.thumb:hover{border-color:var(--accent)}.thumb-frame{aspect-ratio:1;background-color:#2b2b33;background-image:linear-gradient(45deg,#3a3a44 25%,#0000 25%),linear-gradient(-45deg,#3a3a44 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#3a3a44 75%),linear-gradient(-45deg,#0000 75%,#3a3a44 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px;border-radius:6px;justify-content:center;align-items:center;display:flex;overflow:hidden}.thumb-img{object-fit:contain;width:100%;height:100%;image-rendering:pixelated;image-rendering:crisp-edges}.thumb-caption{flex-direction:column;min-width:0;display:flex}.thumb-name{text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.thumb-dims{color:var(--text-dim);font-size:11px}.viewer-overlay{z-index:100;background:#0d0d12;flex-direction:column;display:flex;position:fixed;top:0;bottom:0;left:0;right:0}.viewer-toolbar{background:var(--panel);border-bottom:1px solid var(--border);flex-wrap:wrap;flex-shrink:0;align-items:center;gap:20px;padding:8px 14px;display:flex}.tb-group{align-items:center;gap:6px;display:flex}.tb-btn{background:var(--panel-2);border:1px solid var(--border);color:var(--text);cursor:pointer;font:inherit;border-radius:6px;min-width:30px;padding:5px 10px;line-height:1}.tb-btn:hover:not(:disabled){border-color:var(--accent)}.tb-btn:disabled{opacity:.4;cursor:default}.tb-filename{text-overflow:ellipsis;white-space:nowrap;max-width:260px;font-weight:600;overflow:hidden}.tb-dims,.tb-counter,.tb-zoom{color:var(--text-dim);font-variant-numeric:tabular-nums}.tb-zoom{text-align:center;min-width:52px}.tb-toggle{color:var(--text-dim);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:5px;display:inline-flex}.tb-toggle:has(input:disabled){opacity:.4;cursor:default}.tb-border{font-variant-numeric:tabular-nums;border:1px solid var(--border);white-space:nowrap;border-radius:6px;padding:3px 8px}.tb-border.border{color:var(--accent);border-color:color-mix(in srgb, var(--accent) 45%, var(--border))}.tb-border.clean{color:var(--text-dim)}.viewer-stage{flex:1;min-height:0;position:relative}.viewer-canvas{cursor:grab;touch-action:none;width:100%;height:100%;display:block}.viewer-canvas.grabbing{cursor:grabbing}.viewer-status{color:var(--text-dim);pointer-events:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.viewer-status.error{color:#ff8a8a}
