:root{--bg: #0e0f11;--bg-raised: #1a1c1f;--bg-hover: #24272b;--text: #e8e6e3;--text-dim: #9a978f;--accent: #e8e6e3;--accent-hover: #ffffff;--danger-bg: #3a1f22;--danger-text: #e89a9a;--border: #3a3d42;--outline: #d8d5d0;--radius: 0;--font: "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, Roboto, sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);line-height:1.5}#root{min-height:100vh}.loader{min-height:100vh;display:flex;align-items:center;justify-content:center}.loader__spinner{width:36px;height:36px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:loader-spin .8s linear infinite}@keyframes loader-spin{to{transform:rotate(360deg)}}.shell{min-height:100vh;display:flex;flex-direction:column}.header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.5rem;border-bottom:1px solid #000;background:#fff}.header__brand{display:flex;align-items:center;gap:.6rem;color:#000;text-decoration:none;font-weight:600;font-size:1.1rem;letter-spacing:.02em}.header__logo{width:24px;height:24px}.header__user{display:flex;align-items:center;gap:1rem}.header__email{color:#444;font-size:.85rem}.header__logout{background:#fff;border:1px solid #000;color:#000;padding:.35rem .9rem;border-radius:0;cursor:pointer;font-size:.85rem;letter-spacing:.04em;text-transform:uppercase}.header__logout:hover{background:#eee}.header__link{color:#000;text-decoration:none;font-size:.85rem;letter-spacing:.04em;text-transform:uppercase;border:1px solid #000;padding:.35rem .9rem}.header__link:hover{background:#eee}.users__hint{color:var(--text-dim);font-size:.85rem;max-width:70ch;margin:-.75rem 0 1.5rem}.users__table{width:100%;border-collapse:collapse;font-size:.95rem}.users__table th{text-align:left;color:var(--text-dim);font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;font-weight:500;padding:.4rem .75rem .4rem 0;border-bottom:1px solid var(--border)}.users__table td{padding:.6rem .75rem .6rem 0;border-bottom:1px solid var(--border);vertical-align:middle}.users__key{color:var(--text-dim)}.users__you{margin-left:.5rem;color:var(--text-dim);font-size:.8rem}.users__badge{display:inline-block;padding:.1rem .55rem;font-size:.75rem;letter-spacing:.05em;text-transform:uppercase;border:1px solid var(--outline)}.users__badge--plain{border-color:var(--border);color:var(--text-dim)}.users__actions{display:flex;gap:.5rem;justify-content:flex-end}.users__button{background:var(--bg-raised);border:1px solid var(--border);color:var(--text);padding:.3rem .8rem;cursor:pointer;font-size:.8rem;letter-spacing:.04em;text-transform:uppercase}.users__button:hover{background:var(--bg-hover)}.users__button:disabled{opacity:.45;cursor:default}.users__button--danger{border-color:var(--danger-text);color:var(--danger-text)}.users__button--danger:hover{background:var(--danger-bg)}.login{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:1.5rem}.login__card{width:100%;max-width:360px;background:var(--bg-raised);border:1px solid var(--outline);border-radius:0;padding:2rem;display:flex;flex-direction:column}.login__logo{width:44px;height:44px;margin:0 auto .75rem}.login__title{margin:0;text-align:center;font-size:1.5rem}.login__subtitle{margin:.35rem 0 1.5rem;text-align:center;color:var(--text-dim);font-size:.9rem}.login__error{background:var(--danger-bg);color:var(--danger-text);border:1px solid var(--danger-text);border-radius:0;padding:.6rem .8rem;font-size:.85rem;margin-bottom:1rem}.login__label{font-size:.8rem;color:var(--text-dim);margin-bottom:.25rem}.login__input{background:var(--bg);border:1px solid var(--border);border-radius:0;color:var(--text);padding:.6rem .8rem;font-size:.95rem;margin-bottom:1rem;font-family:inherit}.login__input:focus{outline:none;border-color:var(--outline)}.login__button{background:var(--bg-raised);color:var(--text);border:1px solid var(--outline);border-radius:0;padding:.65rem;font-size:.9rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;margin-top:.25rem}.login__button:hover{background:var(--bg-hover);border-color:var(--accent-hover)}.login__button:disabled{opacity:.6;cursor:default}.login__button--google{background:none;border:1px solid var(--border);color:var(--text);margin-top:.75rem}.login__button--google:hover{background:var(--bg-hover)}.login__switch{margin:1.25rem 0 0;text-align:center;color:var(--text-dim);font-size:.85rem}.login__switch a{color:var(--accent-hover)}.overview{flex:1;padding:2rem 1.5rem 3rem;max-width:1200px;width:100%;margin:0 auto}.overview__title{margin:0 0 1.5rem;font-size:1.6rem}.overview__empty{color:var(--text-dim)}.overview__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.25rem}.card{background:var(--bg-raised);border:1px solid var(--border);border-radius:0;overflow:hidden;text-decoration:none;color:var(--text);transition:transform .15s ease,border-color .15s ease}.card:hover{transform:translateY(-3px);border-color:var(--outline)}.card__cover{aspect-ratio:4 / 3;background:var(--bg)}.card__image{width:100%;height:100%;object-fit:cover;display:block}.card__placeholder{height:100%;display:flex;align-items:center;justify-content:center;color:var(--text-dim);font-size:.9rem}.card__body{padding:.9rem 1rem 1.1rem}.card__title{margin:0 0 .25rem;font-size:1.05rem}.card__description{margin:0 0 .5rem;color:var(--text-dim);font-size:.85rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card__meta{margin:0;color:var(--text-dim);font-size:.78rem;letter-spacing:.03em;text-transform:uppercase}.gallery{flex:1;padding:2rem 1.5rem 3rem;max-width:1400px;width:100%;margin:0 auto}.gallery__breadcrumb{margin-bottom:1.25rem}.gallery__breadcrumb a{color:var(--text-dim);text-decoration:none;font-size:.9rem}.gallery__breadcrumb a:hover{color:var(--accent-hover)}.gallery__header{margin-bottom:1.75rem}.gallery__title{margin:0 0 .35rem;font-size:1.6rem}.gallery__description{margin:0 0 .5rem;color:var(--text-dim);max-width:60ch}.gallery__meta{margin:0;color:var(--text-dim);font-size:.8rem;letter-spacing:.03em;text-transform:uppercase}.gallery__missing{color:var(--text-dim)}.gallery__missing a{color:var(--accent-hover)}.gallery__grid{display:flex;flex-wrap:wrap;gap:4px}.thumb{padding:0;border:none;border-radius:0;position:relative;flex-grow:calc(var(--ratio, 1) * 100);flex-basis:calc(var(--ratio, 1) * var(--row-height, 200px));max-width:calc(var(--ratio, 1) * var(--row-height, 200px) * 1.4);aspect-ratio:var(--ratio, 1);background:var(--bg-raised);cursor:pointer;overflow:hidden;outline:1px solid transparent;outline-offset:-1px;transition:outline-color .15s ease}.thumb:hover{outline-color:var(--outline);z-index:1}.thumb__image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s ease}.thumb:hover .thumb__image{transform:scale(1.03)}.lightbox{position:fixed;inset:0;background:#0a0b0deb;display:flex;align-items:center;justify-content:center;z-index:100;touch-action:pan-y}.lightbox__figure{margin:0;max-width:min(1100px,88vw);max-height:88vh;display:flex;flex-direction:column;align-items:center}.lightbox__image{max-width:100%;max-height:80vh;object-fit:contain;border-radius:0;outline:1px solid var(--border)}.lightbox__caption{margin-top:.75rem;color:var(--text-dim);font-size:.85rem;text-align:center}.lightbox__nav{position:absolute;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--text);font-size:3rem;padding:.5rem 1.25rem;cursor:pointer;opacity:.6}.lightbox__nav:hover{opacity:1}.lightbox__nav--prev{left:.5rem}.lightbox__nav--next{right:.5rem}.lightbox__close{position:absolute;top:1rem;right:1.25rem;background:none;border:none;color:var(--text);font-size:1.4rem;cursor:pointer;opacity:.6}.lightbox__close:hover{opacity:1}@media(max-width:600px){.header__email{display:none}.overview,.gallery{padding:1.25rem 1rem 2rem}.lightbox__nav{font-size:2.2rem;padding:.5rem .75rem}}.gallery__heading{display:flex;align-items:baseline;justify-content:space-between;gap:1rem}.gallery__edit-toggle,.overview__new,.overview__create,.upload__clear{background:var(--bg-raised);border:1px solid var(--border);color:var(--text);padding:.35rem .9rem;cursor:pointer;font-size:.85rem;letter-spacing:.04em;text-transform:uppercase}.gallery__edit-toggle:hover,.overview__new:hover,.overview__create:hover,.upload__clear:hover{background:var(--bg-hover)}.gallery__error{color:var(--danger-text);background:var(--danger-bg);padding:.5rem .75rem;font-size:.9rem}.gallery__empty{color:var(--text-dim)}.thumb--edit{cursor:grab;outline-color:var(--border)}.thumb--dragging{cursor:grabbing;outline-color:var(--outline);opacity:.85}.thumb__delete{position:absolute;top:4px;right:4px;width:26px;height:26px;display:flex;align-items:center;justify-content:center;background:#0a0b0dbf;color:var(--text);border:1px solid var(--border);font-size:.8rem;line-height:1;cursor:pointer;z-index:1}.thumb__delete:hover{background:var(--danger-bg);color:var(--danger-text);border-color:var(--danger-text)}.upload{margin-bottom:1.25rem}.upload__zone{border:2px dashed var(--border);padding:2rem 1.5rem;text-align:center;cursor:pointer;background:var(--bg-raised);transition:border-color .15s ease,background .15s ease}.upload__zone:hover,.upload__zone--active{border-color:var(--outline);background:var(--bg-hover)}.upload__hint{margin:0;font-size:1rem}.upload__subhint{margin:.35rem 0 0;color:var(--text-dim);font-size:.8rem}.upload__list{list-style:none;margin:.75rem 0 0;padding:0;display:flex;flex-direction:column;gap:.4rem}.upload__item{display:flex;align-items:center;gap:.75rem;font-size:.85rem}.upload__name{flex:0 1 40%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text-dim)}.upload__progress{flex:1;height:6px;appearance:none}.upload__progress::-webkit-progress-bar{background:var(--bg-raised)}.upload__progress::-webkit-progress-value{background:var(--accent)}.upload__progress::-moz-progress-bar{background:var(--accent)}.upload__status{flex:0 0 4.5rem;text-align:right;color:var(--text-dim)}.upload__status--error{color:var(--danger-text)}.upload__clear{margin-top:.75rem}.overview__heading{display:flex;align-items:baseline;justify-content:space-between;gap:1rem}.overview__form{display:flex;align-items:center;gap:.75rem;margin-bottom:1.5rem;flex-wrap:wrap}.overview__input{background:var(--bg-raised);border:1px solid var(--border);color:var(--text);padding:.45rem .75rem;font-size:.95rem;min-width:240px}.overview__input:focus{outline:1px solid var(--outline)}.overview__form-error{color:var(--danger-text);font-size:.85rem}.gallery__actions{display:flex;gap:.5rem}.card-wrap{position:relative}.card-wrap .card{display:block;height:100%}.card__settings{position:absolute;top:8px;right:8px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:#0a0b0dbf;color:var(--text);border:1px solid var(--border);font-size:.95rem;cursor:pointer;z-index:1}.card__settings:hover{background:var(--bg-hover);border-color:var(--outline)}.modal{position:fixed;inset:0;background:#0a0b0db3;display:flex;align-items:center;justify-content:center;padding:1.5rem;z-index:200}.modal__card{width:100%;max-width:460px;max-height:90vh;overflow-y:auto;background:var(--bg-raised);border:1px solid var(--border);padding:1.5rem;display:flex;flex-direction:column}.modal__title{margin:0 0 1rem;font-size:1.25rem}.modal__label{margin:.75rem 0 .3rem;font-size:.8rem;letter-spacing:.04em;text-transform:uppercase;color:var(--text-dim)}.modal__input{background:var(--bg);border:1px solid var(--border);color:var(--text);padding:.45rem .75rem;font-size:.95rem;font-family:var(--font);width:100%}.modal__input:focus{outline:1px solid var(--outline)}.modal__textarea{resize:vertical}.modal__hint{margin:.3rem 0 0;color:var(--text-dim);font-size:.78rem}.modal__hint code{color:var(--text)}.modal__fieldset{border:1px solid var(--border);margin:.75rem 0 0;padding:.25rem .9rem .9rem}.modal__check{display:flex;align-items:center;gap:.5rem;margin:.5rem 0;font-size:.95rem;cursor:pointer}.modal__userlist{margin-top:.5rem;max-height:220px;overflow-y:auto;border:1px solid var(--border);background:var(--bg);padding:.25rem .75rem}.modal__userlist .modal__check{margin:.35rem 0}.modal__userkey{margin-left:.5rem;color:var(--text-dim);font-size:.78rem}.modal__error{color:var(--danger-text);background:var(--danger-bg);padding:.5rem .75rem;font-size:.9rem;margin:.75rem 0 0}.modal__actions{display:flex;gap:.75rem;margin-top:1.25rem}.modal__button{background:var(--bg);border:1px solid var(--border);color:var(--text);padding:.45rem 1.1rem;cursor:pointer;font-size:.9rem;letter-spacing:.04em;text-transform:uppercase}.modal__button:hover{background:var(--bg-hover)}.modal__button:disabled{opacity:.5;cursor:default}.modal__danger{margin-top:1.5rem;padding-top:1rem;border-top:1px solid var(--border)}.modal__button--danger{border-color:var(--danger-text);color:var(--danger-text)}.modal__button--danger:hover{background:var(--danger-bg)}
