| 1 |
- :root{font-family:Space Grotesk,Segoe UI,sans-serif;color:#f7f9f8;background:#0d1113}*{box-sizing:border-box}html,body,#root{margin:0;width:100%;min-height:100%;background:radial-gradient(circle at 20% 20%,#20303a,transparent 40%),radial-gradient(circle at 80% 10%,#394a2c,transparent 35%),#090b0c}.wall-page{min-height:100vh}.wall-grid{column-gap:0;min-height:100vh}.tile{display:block;width:100%;margin:0;padding:0;border:0;background:transparent;break-inside:avoid;cursor:pointer}.tile img{width:100%;display:block;object-fit:cover;transition:transform .18s ease}.tile:hover img{transform:scale(1.01)}.sentinel{height:1px}.bottom-bar{position:fixed;left:50%;transform:translate(-50%);bottom:calc(12px + env(safe-area-inset-bottom));border-radius:999px;padding:10px;display:flex;gap:12px;align-items:center;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#08090bad;border:1px solid rgba(255,255,255,.15)}.columns{display:flex;gap:8px}.columns button,.upload{border:0;border-radius:999px;min-width:32px;min-height:32px;background:#ffffff24;color:#f7f9f8;font-weight:600;cursor:pointer}.columns button.active{background:#dce5d6;color:#081019}.upload{font-size:20px;line-height:1}.status{position:fixed;top:16px;left:50%;transform:translate(-50%);background:#000000a6;border-radius:999px;padding:8px 14px}.status.error{color:#ffd5d5}.viewer{position:fixed;inset:0;background:#000;display:flex;align-items:center;justify-content:center;overflow:hidden}.viewer-image{width:100vw;height:100vh;object-fit:cover;-webkit-user-select:none;user-select:none}.viewer-overlay{position:absolute;left:16px;right:16px;display:flex;justify-content:space-between;align-items:center;z-index:20}.viewer-overlay.top{top:max(16px,env(safe-area-inset-top))}.viewer-overlay.bottom{bottom:max(16px,env(safe-area-inset-bottom))}.viewer-overlay button{border:0;border-radius:999px;padding:8px 12px;background:#0000008c;color:#fff}.progress{width:100%;height:4px;background:#fff3;border-radius:999px}.progress-bar{height:100%;border-radius:999px;background:#dce5d6}.viewer-loading,.viewer-error{min-height:100vh;display:grid;place-items:center;background:#090b0c;color:#fff}@media(max-width:640px){.bottom-bar{width:calc(100vw - 20px);justify-content:space-between}}
|
