:root{--bg:#080809;--panel:#111114;--panel2:#17171b;--text:#f4f1e8;--muted:#aaa79f;--gold:#c8a45a;--gold2:#e1c47d;--line:#2a2929;--danger:#df6969;--ok:#63b987}
*{box-sizing:border-box}html,body{margin:0;background:linear-gradient(180deg,#070708,#0d0d10 70%);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;min-height:100%}body{padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom)}button,input,select{font:inherit}.app{max-width:1100px;margin:auto;min-height:100vh}
header{position:sticky;top:0;z-index:30;background:rgba(8,8,9,.9);backdrop-filter:blur(18px);border-bottom:1px solid rgba(200,164,90,.15);padding:16px 18px 13px}.brand{display:flex;align-items:center;justify-content:space-between;gap:12px}.brand h1{font-family:Georgia,"Times New Roman",serif;font-size:22px;font-weight:500;margin:0;color:#f6e8c6}.brand small{display:block;color:var(--muted);margin-top:4px;font-size:12px}.badge{border:1px solid rgba(200,164,90,.35);background:rgba(200,164,90,.09);color:var(--gold2);padding:7px 10px;border-radius:999px;font-size:12px;white-space:nowrap}
main{padding:18px 16px 118px}.tabs{display:flex;gap:8px;margin:4px 0 18px;overflow:auto;padding-bottom:2px}.tab,.chip,.category{border:1px solid var(--line);color:var(--muted);background:#101012;border-radius:12px;padding:10px 14px;white-space:nowrap;cursor:pointer}.tab.active,.chip.active,.category.active{color:#17120a;background:linear-gradient(135deg,var(--gold2),var(--gold));border-color:transparent;font-weight:700}
.card{background:linear-gradient(180deg,rgba(20,20,23,.96),rgba(14,14,17,.96));border:1px solid var(--line);border-radius:20px;padding:18px;margin-bottom:14px;box-shadow:0 16px 40px rgba(0,0,0,.22)}.card h2{font-size:17px;margin:0 0 5px}.card p.sub{color:var(--muted);font-size:13px;margin:0 0 17px;line-height:1.55}.grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.span2{grid-column:1/-1}label{display:block;color:#d9d4c9;font-size:12px;margin:0 0 6px}input,select{width:100%;border:1px solid #343338;background:#0d0d10;color:var(--text);padding:13px 12px;border-radius:12px;outline:none;min-height:46px}input:focus,select:focus{border-color:rgba(225,196,125,.75);box-shadow:0 0 0 3px rgba(200,164,90,.08)}
.source-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.source{position:relative;border:1px solid #343338;background:#0d0d10;border-radius:14px;padding:14px;cursor:pointer;min-height:92px}.source.active{border-color:var(--gold);background:rgba(200,164,90,.08)}.source strong{display:block;font-size:14px}.source span{display:block;color:var(--muted);font-size:11px;margin-top:5px;line-height:1.45}.source .tick{position:absolute;left:10px;top:9px;color:var(--gold2);display:none}.source.active .tick{display:block}
.products{display:grid;gap:9px}.product{display:grid;grid-template-columns:auto 1fr 82px;gap:10px;align-items:center;border:1px solid #29292e;background:#0c0c0f;border-radius:14px;padding:10px 11px}.product.off{opacity:.48}.switch{width:42px;height:25px;border-radius:999px;background:#323239;position:relative;cursor:pointer;transition:.2s}.switch:after{content:"";position:absolute;width:19px;height:19px;border-radius:50%;background:#ddd;top:3px;right:3px;transition:.2s}.switch.on{background:var(--gold)}.switch.on:after{right:20px;background:#17120a}.product .name{font-size:14px}.product .hint{display:block;color:var(--muted);font-size:11px;margin-top:3px}.limit input{text-align:center;padding:8px;min-height:38px}.limit label{text-align:center;margin-bottom:3px;font-size:10px}.template-row,.product-tabs,.categories{display:flex;gap:8px;overflow:auto;padding-bottom:3px}.template-row{margin-bottom:12px}.chip{border-radius:999px;padding:8px 12px;font-size:12px}.toggle-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid #252529}.toggle-row:first-of-type{border-top:0}.toggle-row .txt strong{font-size:13px}.toggle-row .txt span{display:block;color:var(--muted);font-size:11px;margin-top:3px}
.preview{border:1px dashed rgba(200,164,90,.4);background:rgba(200,164,90,.04);border-radius:16px;padding:14px}.preview-top{display:flex;justify-content:space-between;align-items:center;gap:12px}.preview .counter{font-size:22px;font-family:Georgia,serif;color:var(--gold2)}.progress{height:6px;background:#26262a;border-radius:20px;overflow:hidden;margin-top:10px}.progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--gold),var(--gold2));transition:.2s}.footerbar{position:fixed;bottom:0;left:0;right:0;z-index:25;background:rgba(8,8,9,.94);backdrop-filter:blur(18px);border-top:1px solid rgba(200,164,90,.15);padding:12px max(16px,calc((100vw - 1100px)/2 + 16px)) calc(12px + env(safe-area-inset-bottom));display:flex;gap:9px}.btn{border:0;border-radius:13px;padding:13px 16px;cursor:pointer}.btn.primary{flex:1;background:linear-gradient(135deg,var(--gold2),var(--gold));color:#17120a;font-weight:800}.btn.secondary{background:#17171b;color:#ddd;border:1px solid #323237}.btn.small{padding:8px 10px;border-radius:10px;font-size:12px}.btn.danger{background:rgba(223,105,105,.1);color:#f0b7b7;border:1px solid rgba(223,105,105,.28)}.notice{font-size:11px;color:var(--muted);line-height:1.5;margin-top:9px}.status{display:none;padding:12px 13px;border-radius:12px;margin-bottom:12px;font-size:13px}.status.ok{display:block;background:rgba(99,185,135,.10);border:1px solid rgba(99,185,135,.35);color:#bce2ca}.status.error{display:block;background:rgba(223,105,105,.10);border:1px solid rgba(223,105,105,.35);color:#f0b7b7}.event-list{display:grid;gap:10px}.event{border:1px solid #29292e;border-radius:15px;padding:13px;background:#0d0d10}.event .top{display:flex;align-items:center;justify-content:space-between;gap:10px}.event strong{font-size:14px}.event span{color:var(--muted);font-size:11px}.event code{direction:ltr;color:var(--gold2);font-size:10px;background:#17171b;padding:4px 7px;border-radius:8px}.event-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}.hidden{display:none!important}
.client-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:14px}.client-title h2{font-family:Georgia,"Times New Roman",serif;font-size:27px;font-weight:500;color:#f6e8c6;margin:0 0 5px}.client-title p{margin:0;color:var(--muted);font-size:12px}.selection-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin:12px 0 16px}.sum{border:1px solid #2b2b30;background:#0d0d10;border-radius:13px;padding:10px}.sum strong{display:block;font-size:12px;margin-bottom:4px}.sum b{font-family:Georgia,serif;color:var(--gold2);font-size:18px}.sum.complete{border-color:rgba(99,185,135,.42);background:rgba(99,185,135,.07)}
.client-toolbar{position:sticky;top:74px;z-index:15;background:rgba(11,11,13,.94);backdrop-filter:blur(16px);padding:10px 0 12px;border-bottom:1px solid rgba(255,255,255,.04);margin-bottom:12px}.toolbar-line{display:flex;gap:8px;align-items:center;justify-content:space-between;margin-top:9px}.only-selected{display:flex;align-items:center;gap:8px;color:#ddd;font-size:12px}.only-selected input{width:18px;height:18px;min-height:auto;accent-color:var(--gold)}
.photo-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.photo{position:relative;aspect-ratio:4/5;border-radius:14px;overflow:hidden;background:#1a1a1e;border:2px solid transparent;cursor:pointer;isolation:isolate}.photo img{width:100%;height:100%;object-fit:cover;display:block;background:linear-gradient(135deg,#25252a,#111)}.photo:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.46));pointer-events:none}.photo.selected{border-color:var(--gold);box-shadow:0 0 0 1px rgba(225,196,125,.25)}.photo .check{position:absolute;z-index:3;right:8px;top:8px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:rgba(8,8,9,.65);border:1px solid rgba(255,255,255,.28);font-size:14px}.photo.selected .check{background:linear-gradient(135deg,var(--gold2),var(--gold));color:#17120a;border-color:transparent;font-weight:900}.photo .num{position:absolute;z-index:3;bottom:8px;right:9px;font-size:10px;color:#fff;text-shadow:0 1px 3px #000}.photo .zoom{position:absolute;z-index:4;left:8px;top:8px;border:0;width:28px;height:28px;border-radius:50%;background:rgba(8,8,9,.65);color:#fff;cursor:pointer}.empty{padding:36px 12px;text-align:center;color:var(--muted);font-size:13px;border:1px dashed #333;border-radius:16px}.client-bottom{position:fixed;left:0;right:0;bottom:0;z-index:24;background:rgba(8,8,9,.95);backdrop-filter:blur(18px);border-top:1px solid rgba(200,164,90,.16);padding:10px max(16px,calc((100vw - 1100px)/2 + 16px)) calc(10px + env(safe-area-inset-bottom));display:flex;gap:9px;align-items:center}.client-bottom .current{min-width:84px}.client-bottom .current small{display:block;color:var(--muted);font-size:10px}.client-bottom .current b{font-family:Georgia,serif;color:var(--gold2);font-size:18px}.locked-note{padding:13px;border-radius:14px;background:rgba(99,185,135,.08);border:1px solid rgba(99,185,135,.34);color:#c7e8d3;margin-bottom:12px;font-size:13px}
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.94);z-index:100;display:grid;place-items:center;padding:20px}.lightbox img{max-width:94vw;max-height:84vh;border-radius:12px}#closeLightbox{flex:0 0 auto;width:42px;height:42px;border-radius:50%;border:1px solid #444;background:#18181b;color:#fff;font-size:22px;line-height:1;cursor:pointer}.toast{position:fixed;z-index:110;left:50%;bottom:95px;transform:translateX(-50%);background:#19191d;color:#fff;border:1px solid #36363b;padding:10px 14px;border-radius:999px;font-size:12px;box-shadow:0 12px 30px rgba(0,0,0,.35)}
@media(max-width:760px){.grid{grid-template-columns:1fr}.span2{grid-column:auto}.source-row{grid-template-columns:1fr}.app{max-width:none}.product{grid-template-columns:auto 1fr 72px}.card{border-radius:17px;padding:15px}.brand h1{font-size:19px}.photo-grid{grid-template-columns:repeat(3,1fr);gap:5px}.photo{border-radius:9px}.client-head{align-items:flex-start;flex-direction:column}.client-toolbar{top:69px}.client-title h2{font-size:24px}}
@media(max-width:420px){.photo-grid{grid-template-columns:repeat(2,1fr)}}
/* Google Drive connection */
.drive-actions{display:flex;gap:10px;flex-wrap:wrap}.drive-actions .btn{min-height:48px}.drive-actions [hidden]{display:none!important}#driveStatus{font-size:14px;line-height:1.7;color:var(--gold2);overflow-wrap:anywhere}.drive-error{color:#f4a9a9!important}.drive-panel .notice{line-height:1.8}.photo-pick{border:0;padding:0;background:transparent;width:100%;height:100%;display:block;cursor:pointer;color:inherit;text-align:inherit}.photo-pick:focus-visible{outline:3px solid var(--gold2);outline-offset:-3px}.photo img{min-height:130px;background:#202023}.photo .num{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.photo .zoom{min-height:38px;min-width:38px}.drive-actions button:disabled{opacity:.55;cursor:wait}

[data-client-mode="true"] #adminTabs,[data-client-mode="true"] #page-create,[data-client-mode="true"] #page-events,[data-client-mode="true"] #adminFooter,[data-client-mode="true"] #backAdminBtn{display:none!important}
dialog{background:#151518;color:#f4f1eb;border:1px solid #8d7445;border-radius:18px;padding:24px;max-width:520px;width:calc(100% - 32px);box-sizing:border-box}dialog::backdrop{background:rgba(0,0,0,.75)}dialog p{font-size:14px;line-height:1.8;color:#c8c5bf}dialog .drive-actions{margin-top:16px}#shareUrl{width:100%;box-sizing:border-box;font-size:13px}#cloudStatus{line-height:1.8;overflow-wrap:anywhere;color:var(--gold2)}#cloudRefresh{margin-bottom:18px}.event-counts{font-size:12px;line-height:1.9;color:#ccc}#selectionStatus{font-size:12px;color:var(--gold2)}#retryCloudSave[hidden]{display:none}.drive-error{color:#f4a9a9!important}.photo-pick:disabled{cursor:default}

/* v3 — client experience */
button,.photo-pick,.ptab,.category{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.source-row{grid-template-columns:1fr}
[data-client-mode="true"] #modeBadge{display:none}
body.no-scroll{overflow:hidden}
.client-head{margin-bottom:6px}.client-meta{margin:0;color:var(--muted);font-size:13px}
.client-intro{color:var(--muted);font-size:13px;line-height:1.65;margin:4px 0 6px}.client-intro b{color:#e8e2d3;font-weight:600}
.save-line{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-height:22px;margin-bottom:4px}#selectionStatus{margin:0}
.notice-card{padding:12px 14px;border-radius:14px;font-size:13px;line-height:1.65;margin:8px 0 10px}.notice-card b{font-weight:700}
.notice-card.ok{background:rgba(99,185,135,.08);border:1px solid rgba(99,185,135,.34);color:#c7e8d3}
.notice-card.warn{background:rgba(223,105,105,.08);border:1px solid rgba(223,105,105,.34);color:#f0c3c3}
.client-toolbar{top:var(--hh,69px);padding:10px 0;margin:0 -16px 10px;padding-inline:16px;background:rgba(9,9,11,.95)}
.product-tabs{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}.product-tabs::-webkit-scrollbar,.categories::-webkit-scrollbar{display:none}
.ptab{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-start;gap:1px;min-width:88px;padding:7px 12px 6px;border-radius:12px;border:1px solid var(--line);background:#111114;color:#d9d4c9;cursor:pointer;text-align:right;font:inherit}
.ptab .pname{font-size:12px;white-space:nowrap}.ptab .pcount{font-family:Georgia,"Times New Roman",serif;font-size:17px;color:var(--gold2);line-height:1.2}
.ptab.complete .pcount:after{content:" ✓";color:var(--ok);font-family:-apple-system,BlinkMacSystemFont,Arial,sans-serif;font-size:13px}
.ptab.active{background:linear-gradient(135deg,var(--gold2),var(--gold));border-color:transparent;color:#17120a;font-weight:700}.ptab.active .pcount,.ptab.active.complete .pcount:after{color:#17120a}
.ptab.complete:not(.active){border-color:rgba(99,185,135,.45)}
.categories{margin-top:8px;scrollbar-width:none}.category{padding:6px 12px;font-size:13px;border-radius:999px}.category.only{margin-inline-start:auto;border-style:dashed}.category.only.active{border-style:solid}
.gallery-count{color:var(--muted);font-size:12px;margin:2px 0 8px}
.photo-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px}
.photo{border-radius:10px;border:2px solid transparent;}
.photo img{min-height:0;opacity:0;transition:opacity .25s;background:#1b1b1f}.photo img.ready{opacity:1}
.photo:after{background:none}
.photo.selected{border-color:var(--gold2);box-shadow:0 0 0 1px rgba(225,196,125,.4)}.photo.selected img.ready{opacity:.8}
.photo .check{right:6px;top:6px;width:26px;height:26px;font-size:14px;background:rgba(8,8,9,.35);border:1.5px solid rgba(255,255,255,.85);box-shadow:0 1px 4px rgba(0,0,0,.4)}
.photo.selected .check{background:linear-gradient(135deg,var(--gold2),var(--gold));border-color:#fff}
.photo .zoom{top:auto;bottom:6px;left:6px;width:32px;height:32px;min-width:32px;min-height:32px;display:grid;place-items:center;background:rgba(8,8,9,.55);border:1px solid rgba(255,255,255,.25);padding:0}
.photo.failed .photo-pick:after{content:"!";position:absolute;inset:0;display:grid;place-items:center;color:#f0b7b7;font-size:20px}
.gallery-more{padding:22px 0;text-align:center;color:var(--muted);font-size:12px}.gallery-more[hidden]{display:none}
.client-bottom .current{min-width:96px}.client-bottom.full .current b{color:var(--ok)}
.client-loading{display:flex;align-items:center;justify-content:center;gap:12px;padding:70px 10px;color:var(--muted);font-size:14px}
.spinner{width:20px;height:20px;border-radius:50%;border:2px solid rgba(225,196,125,.25);border-top-color:var(--gold2);animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.client-error{margin-top:20px}.client-error .btn{width:100%}
.lightbox{padding:0;display:flex;align-items:center;justify-content:center}
.lightbox img{max-width:100vw;max-height:calc(100vh - 150px);max-height:calc(100dvh - 150px);border-radius:4px;object-fit:contain;opacity:0;transition:opacity .2s}.lightbox img[src]{opacity:1}
.lb-top{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;gap:12px;padding:calc(10px + env(safe-area-inset-top)) 14px 10px;background:linear-gradient(rgba(0,0,0,.7),transparent);z-index:2}
#lbCaption{color:#d9d4c9;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:44px;height:64px;border:0;border-radius:12px;background:rgba(24,24,27,.6);color:#fff;font-size:30px;line-height:1;cursor:pointer}.lb-prev{right:6px}.lb-next{left:6px}.lb-nav:disabled{opacity:.2;cursor:default}
.lb-bottom{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:center;padding:12px 16px calc(14px + env(safe-area-inset-bottom));background:linear-gradient(transparent,rgba(0,0,0,.75));z-index:2}
#lbSelect{flex:0 1 440px;min-height:50px;font-weight:700;background:#18181b;color:#f4f1e8;border:1.5px solid var(--gold)}#lbSelect.on{background:linear-gradient(135deg,var(--gold2),var(--gold));color:#17120a;border-color:transparent}#lbSelect[hidden]{display:none}#lbSelect:disabled{opacity:.45}
@media(max-width:760px){.photo-grid{grid-template-columns:repeat(3,1fr);gap:4px}.photo{border-radius:7px}.client-toolbar{top:var(--hh,69px)}.client-title h2{font-size:25px}}
@media(max-width:420px){.photo-grid{grid-template-columns:repeat(3,1fr)}}
.gallery-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:2px 0 8px}.gallery-head .gallery-count{margin:0}
.only-toggle{border:1px dashed #4a463d;background:transparent;color:#ddd;border-radius:999px;padding:6px 12px;font-size:12px;cursor:pointer;white-space:nowrap}.only-toggle.active{border-style:solid;border-color:var(--gold);color:var(--gold2)}
