:root{--bg:#f8f3ef;--panel:#fffaf7;--sidebar:#f1e5de;--line:#e8d9d0;--text:#3f3940;--muted:#82777f;--accent:#8b5e83;--accent-dark:#70486a;--peach:#e8c9aa;--danger:#a34747;--shadow:0 8px 24px #56384212;font-family:'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:var(--text);background:var(--bg)}*{box-sizing:border-box}body{margin:0;min-height:100vh}button,input,textarea,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #bb90b4;outline-offset:2px}.hidden{display:none!important}.topbar{height:76px;background:#fffaf7ed;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 max(24px,calc((100vw - 1500px)/2));gap:12px;position:sticky;top:0;z-index:5;backdrop-filter:blur(12px)}.brand-mark{height:42px;width:42px;border-radius:14px;background:var(--accent);color:#fffaf7;display:grid;place-items:center;font-size:23px}.brand-copy{display:flex;flex-direction:column;line-height:1.15}.brand-copy strong{font-size:16px}.brand-copy span{font-size:11px;color:var(--muted);margin-top:4px}.top-actions{margin-left:auto;display:flex;gap:9px;align-items:center;position:relative}.button,.icon-button{border:0;border-radius:12px;min-height:42px;padding:0 15px;font-weight:600;transition:background .16s,transform .16s}.button:hover,.icon-button:hover{transform:translateY(-1px)}.button.primary{background:var(--accent);color:#fff}.button.primary:hover{background:var(--accent-dark)}.button.quiet{background:#f1e7e1;color:var(--text)}.button.quiet:hover,.icon-button:hover{background:#e8d9d0}.icon-button{width:42px;padding:0;background:transparent;color:var(--text);font-size:23px}.icon-button.small{height:32px;min-height:32px;width:32px;border-radius:9px;font-size:20px}.menu{position:absolute;right:0;top:50px;width:225px;background:white;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:6px;z-index:20}.menu button{display:block;width:100%;text-align:left;border:0;background:transparent;padding:12px;border-radius:9px;color:var(--text)}.menu button:hover{background:var(--bg)}.mobile-label,.mobile-only{display:none}.app-shell{max-width:1500px;margin:auto;padding:28px 24px;display:grid;grid-template-columns:260px minmax(0,1fr);gap:28px}.sidebar{background:var(--sidebar);border-radius:20px;padding:18px 14px;height:max-content;min-height:440px;position:sticky;top:96px}.sidebar-heading{display:flex;align-items:center;justify-content:space-between;padding:0 5px 12px;font-weight:700;font-size:14px}.group-tree{display:flex;flex-direction:column;gap:3px}.tree-node{min-width:0}.tree-row{display:flex;align-items:center;gap:4px;min-height:37px}.tree-expander{width:25px;height:29px;display:grid;place-items:center;border:0;background:transparent;color:var(--muted);font-size:13px;border-radius:7px}.tree-expander:hover{background:#ffffff80}.tree-select{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;border:0;background:transparent;padding:8px 9px;border-radius:8px;color:var(--text);font-size:13px}.tree-select:hover,.tree-select.active{background:#fffaf7;color:var(--accent-dark);font-weight:700}.tree-children{margin-left:12px;border-left:1px solid #d5c2b8;padding-left:4px}.sidebar-actions{display:grid;gap:5px;margin-top:14px;padding-top:12px;border-top:1px solid #ddcbc2}.button.full{width:100%;text-align:left;font-size:12px;min-height:36px;padding:0 10px;background:transparent}.button.full:hover{background:#fffaf7}.side-note{font-size:11px;line-height:1.5;color:var(--muted);padding:15px 6px 2px}.danger-text{color:var(--danger)!important}.main-content{min-width:0}.welcome-row{display:flex;align-items:end;gap:14px;margin:9px 0 19px}.eyebrow{margin:0 0 5px;color:var(--accent);letter-spacing:.12em;font-weight:700;font-size:10px}.welcome-row h1,.dialog-heading h2{font-family:'Playfair Display',Georgia,serif;font-size:32px;line-height:1.1;margin:0;font-weight:600}.subheading{color:var(--muted);font-size:13px;margin:8px 0 0}.all-groups{margin-left:auto;white-space:nowrap}.toolbar{display:flex;gap:10px;margin:0 0 14px}.search-box{height:48px;border:1px solid var(--line);border-radius:14px;background:var(--panel);display:flex;align-items:center;gap:11px;padding:0 13px;flex:1;color:var(--muted)}.search-box>span{font-size:24px}.search-box input{background:transparent;border:0;outline:0;flex:1;min-width:0;font-size:14px;color:var(--text)}kbd{font:11px 'DM Sans',sans-serif;background:#f1e7e1;padding:4px 6px;border-radius:6px}.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(205px,1fr));gap:16px}.card{background:var(--panel);border:1px solid var(--line);border-radius:17px;padding:11px;box-shadow:0 3px 12px #56384208;min-width:0;transition:transform .16s,box-shadow .16s}.card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}.card-photo{aspect-ratio:1.58;background:#f1e5de;border-radius:11px;display:grid;place-items:center;overflow:hidden;color:var(--muted);font-size:13px;margin-bottom:11px}.card-photo img{width:100%;height:100%;object-fit:cover}.card h2{margin:0 2px 5px;font-size:15px;line-height:1.25}.card-group{margin:0 2px;color:var(--accent);font-size:11px;font-weight:600;line-height:1.35}.card-description{margin:8px 2px 2px;color:var(--muted);font-size:12px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;min-height:0}.card-path{margin:8px 2px 0;color:var(--muted);font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card-actions{display:flex;gap:7px;padding-top:11px}.card-actions .button{min-height:35px;padding:0 11px;font-size:12px}.card-actions .button.open{flex:1;text-align:center}.empty-state{border:1px dashed #d7c4bb;border-radius:19px;text-align:center;padding:52px 20px;background:#fffaf783}.empty-state h2{font-family:'Playfair Display',Georgia,serif;margin:10px 0 6px;font-size:23px}.empty-state p{color:var(--muted);margin:0 0 18px;font-size:13px}.empty-illustration{font-size:36px}.edit-dialog{border:0;border-radius:22px;width:min(560px,calc(100vw - 28px));max-height:min(90dvh,850px);padding:23px;background:var(--panel);color:var(--text);box-shadow:0 25px 80px #25172a40}.edit-dialog::backdrop{background:#25172a66;backdrop-filter:blur(3px)}.dialog-heading{display:flex;justify-content:space-between;align-items:start;margin-bottom:21px}.dialog-heading h2{font-size:26px}.field{display:block;font-size:12px;font-weight:700;margin:13px 0;color:var(--text)}.field input,.field select,.field textarea{width:100%;margin-top:7px;border:1px solid var(--line);border-radius:11px;background:white;padding:11px 12px;color:var(--text);font-size:14px;font-weight:400}.field textarea{resize:vertical}.field small{display:block;color:var(--muted);font-size:11px;font-weight:400;line-height:1.4;margin-top:6px}.required{color:var(--danger)}.photo-row{display:flex;align-items:center;gap:12px;margin-top:7px}.photo-preview{height:82px;width:116px;background:#f1e5de;border-radius:11px;overflow:hidden;display:grid;place-items:center;font-size:23px;color:var(--muted);flex:none}.photo-preview img{height:100%;width:100%;object-fit:cover}.photo-controls{min-width:0}.photo-controls input{padding:7px;font-size:11px}.dialog-footer{display:flex;align-items:center;gap:8px;padding-top:15px;margin-top:16px;border-top:1px solid var(--line)}.spacer{flex:1}.toast{position:fixed;z-index:30;bottom:22px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#3f3940;color:white;padding:12px 17px;border-radius:12px;box-shadow:var(--shadow);font-size:13px;max-width:min(92vw,520px);transition:.2s}.toast.show{transform:translate(-50%,0);opacity:1}.overlay{position:fixed;inset:0;background:#25172a66;z-index:8}.desktop-label{display:inline}.mobile-label{display:none}
@media(max-width:900px){.app-shell{grid-template-columns:220px minmax(0,1fr);gap:18px;padding:22px 18px}.cards{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}}
@media(max-width:650px){.topbar{height:62px;padding:0 12px;gap:8px}.mobile-only{display:block}.brand-mark{height:36px;width:36px;border-radius:12px;font-size:20px}.brand-copy strong{font-size:14px}.brand-copy span{font-size:10px}.top-actions{gap:5px}.top-actions .button{min-height:38px;padding:0 11px;font-size:12px}.desktop-label{display:none}.mobile-label{display:inline}.top-actions .icon-button{height:38px;min-height:38px;width:34px}.app-shell{display:block;padding:19px 14px 35px}.sidebar{position:fixed;z-index:10;top:62px;left:0;bottom:0;width:min(84vw,310px);border-radius:0 18px 18px 0;overflow-y:auto;transform:translateX(-105%);transition:transform .22s;box-shadow:var(--shadow)}body.groups-open .sidebar{transform:translateX(0)}body.groups-open .overlay{display:block!important}.welcome-row{align-items:center;margin:3px 0 15px}.welcome-row h1{font-size:26px}.subheading{font-size:12px}.all-groups{padding:0 10px;min-height:36px;font-size:11px}.toolbar{margin-bottom:12px}.search-box{height:44px}.search-box kbd{display:none}.cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.card{padding:8px;border-radius:14px}.card-photo{border-radius:9px;margin-bottom:9px}.card h2{font-size:13px}.card-group{font-size:10px}.card-description{font-size:11px;-webkit-line-clamp:2}.card-path{font-size:9px}.card-actions{gap:5px;padding-top:9px}.card-actions .button{padding:0 8px;min-height:33px;font-size:11px}.edit-dialog{padding:19px 16px;border-radius:19px}.dialog-heading h2{font-size:23px}.field{margin:11px 0}.dialog-footer{gap:5px}.dialog-footer .button{padding:0 11px;font-size:12px}.toast{bottom:calc(18px + env(safe-area-inset-bottom))}}
@media(max-width:370px){.cards{grid-template-columns:1fr}.card{display:grid;grid-template-columns:100px 1fr;column-gap:10px}.card-photo{grid-row:span 4;aspect-ratio:1;margin:0}.card h2,.card-group,.card-description,.card-path{grid-column:2}.card-actions{grid-column:1 / -1}}
/* Login and quick views */
.login-wrap{min-height:100svh;display:grid;place-items:center;padding:24px;background:linear-gradient(145deg,#f5eff4,#f8f6f2)}
.login-card{width:min(100%,460px);background:#fff;border:1px solid #eee7ed;border-radius:24px;padding:30px;box-shadow:0 18px 60px #432b4014}
.login-card h1{margin:4px 0 8px;font-size:clamp(1.7rem,6vw,2.2rem)}.login-mark{margin-bottom:18px}.login-submit{width:100%;min-height:50px;margin-top:10px}
.remember-line{display:flex;align-items:center;gap:10px;padding:12px 0;font-weight:600}.remember-line input{width:20px;height:20px;accent-color:#8b5e83}
.login-error{color:#a33232;min-height:1.3em;margin:8px 0}.login-footnote{font-size:.82rem;color:#777;line-height:1.45;margin:14px 0 0}
.quick-views{display:flex;gap:8px;margin:12px 0 18px;flex-wrap:wrap}.quick-views button.active{background:#8b5e83;color:#fff}
.favorite-toggle{min-width:42px;font-size:1.25rem}.card-actions{gap:8px}