:root{--canvas: #1e1e1e;--panel: #262626;--raised: #303030;--line: #3a3a3a;--text: #e8e8e8;--muted: #9a9a9a;--faint: #6b6b6b;--sheen-a: #2aa198;--sheen-b: #3f6fd8;--sheen-c: #8257d0;--sheen: linear-gradient(120deg, var(--sheen-a), var(--sheen-b) 55%, var(--sheen-c));--focus: #5d8ee8;--danger: #e07a6b;--ui: "Instrument Sans", system-ui, sans-serif;--mark: "Bricolage Grotesque", var(--ui);color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--canvas);color:var(--text);font:14px/1.45 var(--ui);-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--focus);outline-offset:2px}button{background:var(--text);color:var(--canvas);border:0;border-radius:6px;padding:7px 14px;font-weight:600;cursor:pointer;white-space:nowrap}button:disabled{opacity:.45;cursor:default}button.quiet,a.button.quiet{background:transparent;color:var(--muted);border:1px solid var(--line);font-weight:500}button.quiet:hover,a.button.quiet:hover{color:var(--text);border-color:var(--faint)}a.button{display:inline-block;text-decoration:none;border-radius:6px;padding:7px 14px}button.link{background:none;color:var(--muted);padding:0;font-weight:500;text-decoration:underline}input,select,textarea{background:var(--canvas);border:1px solid var(--line);border-radius:6px;padding:7px 10px;min-width:0}textarea{width:100%;resize:vertical}.muted{color:var(--muted)}.error{color:var(--danger)}.wordmark{font-family:var(--mark);font-weight:700;font-size:22px;letter-spacing:-.02em;background:var(--sheen);-webkit-background-clip:text;background-clip:text;color:transparent}.wordmark.big{font-size:64px;line-height:1}.signin{max-width:400px;margin:20vh auto 0;padding:0 16px}.signin .lede{color:var(--muted);margin:12px 0 28px}.signin form{display:flex;gap:8px}.signin input{flex:1;padding:10px 12px}.signin button{padding:10px 18px}.app{display:grid;grid-template-columns:250px minmax(0,1fr);height:100%}.app.with-detail{grid-template-columns:250px minmax(0,1fr) 320px}.sidebar{background:var(--panel);border-right:1px solid var(--line);overflow-y:auto;padding:16px 8px 40px}.sidebar .wordmark{padding:0 10px 14px}.sidebar ul{list-style:none;margin:0;padding:0}.sidebar section{margin-top:22px}.sidebar h2{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:600;color:var(--muted);margin:0 0 4px;padding:4px 10px;border-radius:6px}.sidebar h2.drop{background:var(--raised)}.sidebar h2 .add{background:none;color:var(--muted);padding:0 4px;font-size:16px;line-height:1}.sidebar h2 .add:hover{color:var(--text)}.row{position:relative;display:flex;align-items:center;gap:4px;padding:4px 10px;border-radius:6px;cursor:pointer;-webkit-user-select:none;user-select:none;min-height:28px}.row:hover,.row.active{background:var(--raised)}.row.active:before{content:"";position:absolute;left:0;top:5px;bottom:5px;width:3px;border-radius:2px;background:var(--sheen)}.row.drop{background:var(--raised);box-shadow:inset 0 0 0 1px var(--sheen-b)}.row .label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.row .count{color:var(--faint);font-size:12px;font-variant-numeric:tabular-nums}.row-actions{display:none;gap:2px}.row:hover .row-actions{display:flex}.row:hover .count{display:none}.row-actions button{background:none;color:var(--muted);padding:0 5px;font-size:15px;line-height:1}.row-actions button:hover{color:var(--text)}.twisty{background:none;color:var(--faint);padding:0;width:14px;height:14px;display:grid;place-items:center}.twisty svg{transition:transform .12s}.twisty.open svg{transform:rotate(90deg)}.twisty.hidden{visibility:hidden}.inline-edit{flex:1;padding:2px 6px}.tag-filter{width:calc(100% - 20px);margin:0 10px 6px;padding:5px 8px}.tags .row{padding-left:28px}.group-head{display:flex;align-items:center;gap:6px;width:100%;padding:4px 10px;background:none;color:var(--text);font-weight:500;text-align:left;border-radius:6px}.group-head:hover{background:var(--raised)}.group-head svg{color:var(--faint);transition:transform .12s;flex:none}.group-head.open svg{transform:rotate(90deg)}.group-head .label{flex:1}.group-head .count{color:var(--faint);font-size:12px;font-weight:400}.tag-groups{display:grid;gap:8px;margin-bottom:6px}.tag-groups .group-label{color:var(--faint);font-size:12px;margin-bottom:3px}.tag-groups .chips{display:flex;flex-wrap:wrap;gap:5px}.main{display:flex;flex-direction:column;min-height:0}.toolbar{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line)}.toolbar h1{font-family:var(--mark);font-size:20px;font-weight:600;letter-spacing:-.01em;margin:0 8px 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:40%}.crumb button{background:none;color:var(--muted);padding:0;font:inherit;font-weight:500}.crumb button:hover{color:var(--text)}.crumb .sep{color:var(--faint);margin:0 6px;font-weight:400}.subfolders{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;margin-bottom:18px}.folder-card{display:grid;grid-template-columns:1fr auto;gap:2px 8px;padding:0 0 8px;background:none;color:var(--text);text-align:left;font-weight:500;border-radius:6px}.folder-card .cover{grid-column:1 / -1;aspect-ratio:4 / 3;border-radius:6px;overflow:hidden;background:var(--panel);border:1px solid var(--line);margin-bottom:6px}.folder-card .cover img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .16s}.folder-card:hover .cover img{transform:scale(1.03)}.folder-card:hover .cover{border-color:var(--faint)}.folder-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.folder-count{color:var(--faint);font-size:12px;font-variant-numeric:tabular-nums;align-self:center}.toolbar .search{flex:1;min-width:120px}.toolbar .size{width:110px;accent-color:var(--muted)}.color-filter{position:relative;display:flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid var(--line);border-radius:6px;color:var(--muted);cursor:pointer;white-space:nowrap}.color-filter input{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer;width:100%}.color-filter.on{color:var(--text)}.dot{display:inline-block;width:12px;height:12px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:conic-gradient(#d94b4b,#d9c34b,#4bd96b,#4bb5d9,#6b4bd9,#d94bb5,#d94b4b)}.filters{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:8px 16px 0}.chip{display:inline-flex;align-items:center;gap:6px;background:var(--raised);color:var(--text);border:1px solid var(--line);border-radius:999px;padding:3px 10px;font-size:13px;font-weight:500}.chip button{background:none;color:var(--muted);padding:0;font-size:14px;line-height:1}.chip.static{cursor:default}.grid{flex:1;overflow-y:auto;padding:16px}.grid-row{display:flex;gap:6px;margin-bottom:6px}.tile{position:relative;margin:0;flex:none;background:var(--panel);border-radius:4px;overflow:hidden;cursor:pointer}.tile img,.tile video{width:100%;height:100%;object-fit:cover;display:block}.tile:focus-visible{outline-offset:1px}.tile.selected:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:4px;padding:3px;background:var(--sheen);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}.empty{color:var(--muted);text-align:center;margin-top:18vh}.sentinel{height:40px;color:var(--faint);text-align:center}.detail-wrap{position:relative;background:var(--panel);border-left:1px solid var(--line);min-height:0;display:flex;flex-direction:column}.detail-wrap .close{position:absolute;top:8px;right:8px;z-index:2;width:28px;height:28px;padding:0;display:grid;place-items:center;border-radius:50%;background:#1e1e1ecc;color:var(--muted);border:1px solid var(--line)}.detail-wrap .close:hover{color:var(--text);border-color:var(--faint)}.detail{flex:1;overflow-y:auto;padding:44px 16px 40px}.detail .preview{display:block;width:100%;padding:0;background:var(--canvas);border-radius:6px;overflow:hidden;cursor:zoom-in}.detail .preview img,.detail .preview video{display:block;width:100%;max-height:340px;object-fit:contain}.detail .name{width:100%;margin-top:14px;background:transparent;border-color:transparent;font-family:var(--mark);font-size:17px;font-weight:600;padding:4px 6px;margin-left:-6px}.detail .name:hover,.detail .name:focus{border-color:var(--line);background:var(--canvas)}.detail .facts{color:var(--muted);font-size:12px;margin:2px 0 12px}.detail h3{font-size:12px;font-weight:600;color:var(--muted);margin:18px 0 6px}.detail select,.detail>input{width:100%}.detail .many{font-family:var(--mark);font-size:18px;font-weight:600;margin:0 0 4px}.palette{display:flex;height:22px;border-radius:4px;overflow:hidden}.swatch{flex-basis:0;padding:0;border-radius:0;min-width:8px;cursor:pointer}.swatch:hover{transform:scaleY(1.25)}.tag-editor{display:flex;flex-wrap:wrap;gap:5px;padding:5px;border:1px solid var(--line);border-radius:6px;background:var(--canvas)}.tag-editor input{flex:1;min-width:80px;border:0;padding:3px 4px;background:transparent}.tag-editor input:focus-visible{outline:none}.in-folders{list-style:none;margin:0 0 6px;padding:0}.in-folders li{display:flex;justify-content:space-between;align-items:center;padding:3px 0}.in-folders button{background:none;color:var(--muted);padding:0 4px}.source{color:var(--muted);word-break:break-all;font-size:13px}.source:hover{color:var(--text)}.actions{display:flex;gap:8px;margin-top:24px}.lightbox{position:fixed;top:0;right:0;bottom:0;left:0;background:#0a0a0af0;display:grid;place-items:center;z-index:20;cursor:zoom-out}.lightbox img,.lightbox video{max-width:94vw;max-height:88vh;object-fit:contain;cursor:default}.lightbox-name{position:absolute;bottom:14px;left:0;right:0;text-align:center;color:var(--muted);margin:0}.dropzone{position:fixed;top:12px;right:12px;bottom:12px;left:12px;border-radius:14px;display:grid;place-items:center;font-family:var(--mark);font-size:26px;font-weight:600;background:#141414d9;z-index:30;pointer-events:none}.dropzone:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:14px;padding:2px;background:var(--sheen);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%);background:var(--raised);border:1px solid var(--line);padding:9px 16px;border-radius:8px;z-index:40;max-width:min(560px,calc(100vw - 32px))}@media (max-width: 820px){.app,.app.with-detail{grid-template-columns:1fr;grid-template-rows:auto 1fr auto}.sidebar{max-height:30vh;border-right:0;border-bottom:1px solid var(--line)}.detail-wrap{max-height:45vh;border-left:0;border-top:1px solid var(--line)}.toolbar{flex-wrap:wrap}.toolbar h1{max-width:100%}.toolbar .size{display:none}}@media (prefers-reduced-motion: reduce){*{transition:none!important}}