:root{--bg:#f5f5f7;--panel:rgba(250,250,252,.78);--sidebar:rgba(246,246,248,.78);--text:#1d1d1f;--secondary:#6e6e73;--tertiary:#86868b;--line:rgba(0,0,0,.08);--line-strong:rgba(0,0,0,.13);--blue:#0071e3;--blue-hover:#0077ed;--danger:#ff3b30;--white:#fff;--radius:18px;--font:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Helvetica Neue","PingFang SC",Arial,sans-serif}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:var(--font);color:var(--text);background:var(--bg)}button,input{font:inherit}button{border:0}svg{display:block}::selection{background:rgba(0,113,227,.18)}.app{min-height:100vh;display:grid;grid-template-columns:236px minmax(0,1fr)}.sidebar{position:sticky;top:0;height:100vh;padding:18px 14px 16px;border-right:1px solid var(--line);background:var(--sidebar);backdrop-filter:saturate(180%) blur(28px);-webkit-backdrop-filter:saturate(180%) blur(28px);display:flex;flex-direction:column;z-index:10}.brand{height:50px;display:flex;align-items:center;gap:10px;padding:0 10px;font-size:17px;font-weight:650;letter-spacing:-.02em}.brand-mark{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;color:white;background:linear-gradient(145deg,#0a84ff,#5ac8fa);box-shadow:inset 0 0 0 1px rgba(255,255,255,.28),0 3px 9px rgba(0,113,227,.18)}.nav{margin-top:16px;display:grid;gap:4px}.nav-btn{width:100%;height:36px;display:flex;align-items:center;gap:10px;padding:0 10px;border-radius:9px;background:transparent;color:var(--text);cursor:pointer;text-align:left;font-size:14px;font-weight:510}.nav-btn svg{width:17px;height:17px;color:#59595e}.nav-btn:hover{background:rgba(0,0,0,.045)}.nav-btn.active{background:rgba(0,0,0,.065);font-weight:590}.nav-btn.active svg{color:var(--blue)}.nav-label{margin:23px 10px 7px;color:var(--tertiary);font-size:11px;font-weight:650;letter-spacing:.02em;text-transform:uppercase}.sidebar-meta{margin-top:auto;padding:14px 10px 6px;color:var(--tertiary);font-size:11px;line-height:1.55}.storage{height:4px;border-radius:999px;background:rgba(0,0,0,.08);overflow:hidden;margin:8px 0 7px}.storage i{display:block;width:18%;height:100%;background:#8e8e93;border-radius:inherit}.main{min-width:0;background:#fff}.toolbar{position:sticky;top:0;z-index:8;height:66px;display:flex;align-items:center;padding:0 30px;border-bottom:1px solid transparent;background:rgba(255,255,255,.78);backdrop-filter:saturate(180%) blur(24px);-webkit-backdrop-filter:saturate(180%) blur(24px);transition:border-color .2s ease,background .2s ease}.toolbar.scrolled{border-bottom-color:var(--line)}.toolbar-left{display:flex;align-items:center;gap:10px;min-width:0}.mobile-sidebar{display:none}.crumb{color:var(--secondary);font-size:13px;white-space:nowrap}.toolbar-spacer{flex:1}.tool-btn,.circle-btn{height:32px;display:inline-flex;align-items:center;justify-content:center;gap:7px;border-radius:999px;cursor:pointer;transition:background .16s ease,transform .16s ease}.tool-btn{padding:0 13px;color:white;background:var(--blue);font-size:13px;font-weight:590}.tool-btn:hover{background:var(--blue-hover)}.circle-btn{width:32px;background:rgba(0,0,0,.055);color:#333336}.circle-btn:hover{background:rgba(0,0,0,.09)}.tool-btn:active,.circle-btn:active{transform:scale(.97)}.tool-btn svg,.circle-btn svg{width:15px;height:15px}.content{width:min(100%,1500px);margin:0 auto;padding:52px 44px 80px}.hero{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:end;margin-bottom:42px}.eyebrow{color:var(--blue);font-size:13px;font-weight:650;margin-bottom:10px}h1{margin:0;font-size:46px;line-height:1.03;letter-spacing:-.045em;font-weight:700}.hero p{margin:12px 0 0;color:var(--secondary);font-size:15px;line-height:1.5}.hero-side{display:flex;align-items:center;gap:8px;padding-bottom:3px}.search{width:220px;height:34px;border:0;outline:0;border-radius:10px;padding:0 12px 0 32px;background:rgba(118,118,128,.12);color:var(--text);font-size:13px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2386868b' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:10px center}.search::placeholder{color:#8e8e93}.upload-shelf{position:relative;min-height:178px;margin-bottom:42px;border-radius:24px;overflow:hidden;display:flex;align-items:center;padding:36px 38px;background:radial-gradient(90% 170% at 92% -5%,rgba(78,189,255,.36),transparent 54%),radial-gradient(80% 160% at 65% 120%,rgba(156,210,255,.42),transparent 46%),linear-gradient(135deg,#eef6ff 0%,#f5f8ff 47%,#eef9fb 100%);box-shadow:inset 0 0 0 1px rgba(0,113,227,.055);cursor:pointer;isolation:isolate}.upload-shelf:before{content:"";position:absolute;inset:-80px auto auto 54%;width:340px;height:340px;border-radius:50%;border:1px solid rgba(255,255,255,.7);box-shadow:0 0 0 35px rgba(255,255,255,.16),0 0 0 70px rgba(255,255,255,.10),0 0 0 105px rgba(255,255,255,.06);z-index:-1}.upload-shelf.drag{box-shadow:inset 0 0 0 2px rgba(0,113,227,.42)}.upload-icon{flex:0 0 auto;width:58px;height:58px;border-radius:17px;display:grid;place-items:center;margin-right:20px;color:var(--blue);background:rgba(255,255,255,.76);box-shadow:0 8px 30px rgba(0,64,130,.08),inset 0 0 0 1px rgba(255,255,255,.72);backdrop-filter:blur(12px)}.upload-icon svg{width:27px;height:27px}.upload-copy{min-width:0}.upload-title{font-size:20px;font-weight:650;letter-spacing:-.02em}.upload-sub{margin-top:6px;color:#5f6872;font-size:13px;line-height:1.5}.upload-shortcuts{margin-left:auto;padding-left:24px;display:flex;align-items:center;gap:7px;color:#6b7480;font-size:12px;white-space:nowrap}.kbd{min-width:25px;height:24px;display:grid;place-items:center;padding:0 7px;border-radius:6px;background:rgba(255,255,255,.62);border:1px solid rgba(0,0,0,.07);box-shadow:0 1px 0 rgba(0,0,0,.04);color:#50545a;font-weight:590}.section-head{display:flex;align-items:end;gap:18px;margin-bottom:18px}.section-title{font-size:22px;letter-spacing:-.025em;font-weight:650}.count{color:var(--tertiary);font-size:13px;padding-bottom:2px}.section-actions{margin-left:auto;display:flex;align-items:center;gap:6px}.text-btn{height:30px;padding:0 8px;background:transparent;color:var(--blue);border-radius:7px;cursor:pointer;font-size:13px}.text-btn:hover{background:rgba(0,113,227,.07)}.text-btn.danger{color:var(--danger)}.text-btn[hidden]{display:none}.gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px 16px}.asset{min-width:0;position:relative;cursor:default}.thumb{position:relative;aspect-ratio:1.18/1;border-radius:14px;overflow:hidden;background:#ececef;box-shadow:inset 0 0 0 1px rgba(0,0,0,.035);transform:translateZ(0)}.thumb .art{position:absolute;inset:0;transition:transform .35s cubic-bezier(.2,.75,.3,1)}.asset:hover .art{transform:scale(1.018)}.select-dot{position:absolute;top:10px;left:10px;width:21px;height:21px;border-radius:50%;border:1px solid rgba(255,255,255,.92);background:rgba(30,30,30,.25);box-shadow:0 1px 5px rgba(0,0,0,.14);backdrop-filter:blur(6px);display:grid;place-items:center;opacity:0;transform:scale(.94);transition:.15s ease;z-index:2}.asset:hover .select-dot,.asset.selected .select-dot{opacity:1;transform:scale(1)}.asset.selected .select-dot{background:var(--blue);border-color:var(--blue)}.select-dot svg{width:13px;height:13px;color:#fff;opacity:0}.asset.selected .select-dot svg{opacity:1}.thumb-actions{position:absolute;right:9px;bottom:9px;display:flex;gap:6px;opacity:0;transform:translateY(3px);transition:.16s ease;z-index:2}.asset:hover .thumb-actions{opacity:1;transform:translateY(0)}.mini-action{width:29px;height:29px;display:grid;place-items:center;border-radius:999px;color:#fff;background:rgba(20,20,22,.58);backdrop-filter:blur(8px);cursor:pointer;box-shadow:0 1px 5px rgba(0,0,0,.13)}.mini-action:hover{background:rgba(10,10,12,.72)}.mini-action svg{width:14px;height:14px}.meta{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:9px 2px 0}.name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:560;letter-spacing:-.005em}.date{color:var(--tertiary);font-size:11px;white-space:nowrap;padding-top:2px}.progress-wrap{position:fixed;left:50%;bottom:24px;transform:translate(-50%,18px);min-width:290px;padding:12px 14px 13px;border-radius:16px;color:#fff;background:rgba(28,28,30,.82);backdrop-filter:blur(20px) saturate(160%);box-shadow:0 12px 40px rgba(0,0,0,.22);opacity:0;pointer-events:none;transition:.22s ease;z-index:40}.progress-wrap.show{opacity:1;transform:translate(-50%,0)}.progress-top{display:flex;justify-content:space-between;gap:20px;font-size:12px;margin-bottom:8px}.progress-track{height:4px;background:rgba(255,255,255,.2);border-radius:99px;overflow:hidden}.progress-fill{height:100%;width:0;background:#fff;border-radius:inherit;transition:width .18s ease}.toast{position:fixed;top:18px;left:50%;transform:translate(-50%,-12px);padding:9px 13px;border-radius:999px;background:rgba(28,28,30,.86);color:#fff;font-size:12px;backdrop-filter:blur(16px);box-shadow:0 8px 24px rgba(0,0,0,.16);opacity:0;pointer-events:none;transition:.18s ease;z-index:50}.toast.show{opacity:1;transform:translate(-50%,0)}.context-panel{position:fixed;inset:auto 24px 24px auto;width:320px;border-radius:20px;padding:18px;background:rgba(248,248,250,.86);backdrop-filter:blur(30px) saturate(180%);border:1px solid rgba(255,255,255,.68);box-shadow:0 18px 60px rgba(0,0,0,.16);opacity:0;transform:translateY(10px) scale(.98);pointer-events:none;transition:.18s ease;z-index:30}.context-panel.show{opacity:1;transform:none;pointer-events:auto}.context-panel h3{margin:0 0 4px;font-size:15px}.context-panel p{margin:0 0 14px;color:var(--secondary);font-size:12px}.url-line{display:flex;gap:8px}.url-line input{min-width:0;flex:1;height:32px;border:0;border-radius:8px;background:rgba(118,118,128,.11);padding:0 9px;color:#4a4a4e;font-size:11px;outline:0}.url-line button{height:32px;padding:0 10px;border-radius:8px;background:var(--blue);color:white;cursor:pointer;font-size:12px}.thumb img.art{width:100%;height:100%;object-fit:cover;display:block}.empty-state{padding:64px 20px;text-align:center;color:var(--tertiary);font-size:14px}.asset.selected .thumb{box-shadow:inset 0 0 0 2px var(--blue)}@media(max-width:1180px){.gallery{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:900px){.app{display:block}.sidebar{display:none}.mobile-sidebar{display:inline-flex}.toolbar{padding:0 18px;height:58px}.content{padding:38px 22px 70px}.hero{grid-template-columns:1fr;align-items:start}.hero-side{width:100%}.search{width:100%}h1{font-size:39px}.gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.upload-shortcuts{display:none}}@media(max-width:560px){.content{padding:28px 16px 56px}h1{font-size:34px}.hero{margin-bottom:30px}.upload-shelf{min-height:150px;margin-bottom:34px;padding:28px 24px;border-radius:20px}.upload-icon{width:50px;height:50px;border-radius:15px;margin-right:15px}.upload-title{font-size:17px}.upload-sub{font-size:12px}.gallery{gap:16px 10px}.thumb{border-radius:11px}.date{display:none}.section-title{font-size:20px}.crumb{display:none}.context-panel{left:12px;right:12px;bottom:12px;width:auto}}