.group-landing{max-width:640px;margin:auto;padding:22px;font-family:Arial,sans-serif;color:#204b40;text-align:center}body:has(.group-landing){margin:0;background:#faf8f3}.group-landing header{font-weight:900;font-size:30px;letter-spacing:3px}.group-landing p{line-height:1.6}.group-landing #group-result{max-width:100%;border-radius:18px}.group-primary,.group-landing button,.group-clock-tools button{display:block;box-sizing:border-box;width:100%;padding:15px;border-radius:12px;border:1px solid #cbd5cd;margin:10px 0;background:#204b40;color:white;font:700 17px Arial;text-decoration:none;cursor:pointer}.group-note{font-size:13px;color:#61756a}.group-members,#group-members{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin:12px 0}.group-members img,#group-members img{width:68px;height:68px;object-fit:cover;border-radius:10px}.group-clock-tools{border:1px solid #d5d9d1;border-radius:14px;padding:14px;margin:12px 0}.group-clock-tools h3{margin:0}.group-clock-tools .group-share{background:#f3f5f0;color:#204b40}.group-clock-tools img.group-latest{width:100%;max-height:320px;object-fit:contain;border-radius:12px}.group-clock-tools button:disabled{opacity:.5}

.group-landing [hidden],.group-clock-tools [hidden]{display:none!important}

/* Shared landing: the same paper, ink, type and blue as the live ARTME storefront. */
body:has(.group-landing){margin:0;background:#faf9f6;color:#171a20;font-family:Heebo,Arial,sans-serif}
.group-brand-header{height:76px;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100vw - 1140px)/2));border-bottom:1px solid #dedfdf;background:#fff;font-family:Heebo,Arial,sans-serif}
.group-brand-header a{color:#171a20;text-decoration:none}.group-logo{font-size:23px;font-weight:800;letter-spacing:-.6px}.group-back{font-size:14px;display:flex;gap:14px;align-items:center}
.group-landing{max-width:1140px;margin:0 auto;padding:44px 24px 20px;box-sizing:border-box;text-align:right;color:#171a20;font-family:Heebo,Arial,sans-serif}
.group-intro{text-align:center;margin-bottom:34px}.group-eyebrow{font-size:12px;color:#656974;letter-spacing:.05em}.group-intro h1{font-size:40px;line-height:1.2;letter-spacing:-1px;font-weight:800;margin:12px 0 14px}.group-intro p{color:#656974;font-size:16px;margin:0}
.group-workspace{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);gap:48px;align-items:start;direction:ltr}.group-workspace>*{direction:rtl}
.group-preview{background:#efede7;border:1px solid #e7e5df;min-width:0;overflow:hidden;border-radius:3px}.group-landing #group-result{display:block;width:100%;max-width:100%;height:auto;border-radius:0}.group-empty{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:28px;box-sizing:border-box}.group-empty>span{font-size:54px;color:#164bde}.group-empty h2{font-size:23px;margin:18px 0 0}.group-empty p{color:#656974}.group-preview:has(#group-result:not([hidden])) .group-empty{display:none}
.group-panel{padding:10px 0;min-width:0}.group-panel h2{font-size:28px;font-weight:750;letter-spacing:-.5px;margin:8px 0 12px}.group-panel #group-count{font-size:14px;color:#656974;line-height:1.6;margin:0 0 12px}.group-landing #group-members{justify-content:flex-start;margin:0 0 24px;gap:9px}.group-landing #group-members img{width:62px;height:62px;object-fit:cover;border-radius:3px;border:1px solid #dedfdf}
.group-landing button,.group-landing .group-add{box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:50px;padding:13px 17px;margin:10px 0;border-radius:3px;border:1px solid #171a20;background:transparent;color:#171a20;font:600 15px Heebo,Arial,sans-serif;line-height:1.5;cursor:pointer;text-decoration:none;transition:background .15s,border-color .15s}
.group-landing .group-primary{background:#164bde;color:#fff;border-color:#164bde}.group-landing .group-primary:hover{background:#103ab1;border-color:#103ab1}.group-landing .group-add:hover{background:#efede7}.group-landing button:disabled,.group-landing label:has(input:disabled){opacity:.45;cursor:not-allowed}.group-landing .group-note{color:#656974;font-size:12px;line-height:1.6;margin:8px 0}.group-upload-note{text-align:center}.group-edit{display:block;color:#171a20;font-size:14px;font-weight:500;text-align:center;text-underline-offset:4px;margin:16px 0 25px}.group-share-area{border-top:1px solid #dedfdf;padding-top:17px}.group-landing #group-share{color:#164bde;border-color:#164bde}.group-landing #group-share:hover{background:#edf2ff}.group-landing #group-share svg{width:21px;height:21px;flex-shrink:0}.group-share-area .group-note{text-align:center}.group-landing .group-retention{border-top:1px solid #dedfdf;margin-top:18px;padding-top:15px}.group-landing #group-status{font-size:13px;color:#164bde;line-height:1.6}
.group-footer{border-top:1px solid #dedfdf;margin-top:42px;padding:24px 0;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:13px}.group-footer strong{font-weight:600}.group-footer a{color:#656974;text-decoration:none}.group-landing a:focus-visible,.group-landing button:focus-visible,.group-brand-header a:focus-visible,.group-add:focus-within{outline:3px solid #164bde;outline-offset:4px}
@media(max-width:700px){.group-brand-header{height:62px;padding:0 20px}.group-logo{font-size:21px}.group-back{font-size:12px}.group-landing{padding:27px 20px 12px}.group-intro{margin-bottom:23px}.group-intro h1{font-size:30px}.group-intro p{font-size:14px;max-width:310px;margin:auto}.group-workspace{display:flex;flex-direction:column;gap:25px}.group-preview,.group-panel{width:100%;box-sizing:border-box}.group-panel{padding:0}.group-panel h2{font-size:25px}.group-footer{display:block;text-align:center;margin-top:28px;padding:22px 0}.group-footer a{display:block;margin-top:10px}.group-landing #group-members{margin-bottom:20px}}

/* Experimental upload mode, only mounted for friends-photo-clock. */
.product-wizard .group-clock-modes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:14px 0 22px}
.product-wizard .group-clock-modes button{border-radius:3px;background:#fff;color:#171a20;border:1px solid #c9cbd1;padding:13px 10px;font:600 15px Heebo,Arial,sans-serif}
.product-wizard .group-clock-modes button[aria-pressed=true]{background:#fff;color:#171a20;border:2px solid #171a20}
.product-wizard .group-clock-modes .group-mode{grid-column:1/-1;color:#164bde;border:1px solid #164bde;position:relative}
.product-wizard .group-clock-modes .group-mode[aria-pressed=true]{background:#edf2ff;color:#164bde;border:2px solid #164bde}
.product-wizard .group-clock-modes .group-mode[aria-pressed=true]:after{content:'✓';position:absolute;right:15px;font-size:19px}
.product-wizard .group-collection{padding:0;margin:0;border:0;border-radius:0;color:#171a20;font-family:Heebo,Arial,sans-serif}
.product-wizard .group-collection h3{font-size:21px;font-weight:750;margin:0 0 4px}.product-wizard .group-collection .group-count{color:#656974;font-size:14px;margin:0 0 12px;text-align:right}
.product-wizard .group-collection .group-members{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:460px;margin:0 auto 16px}.group-photo-slot{position:relative;min-width:0}.product-wizard .group-collection .group-members img{width:100%;height:165px;object-fit:cover;display:block;border-radius:3px;border:1px solid #dedfdf;box-sizing:border-box}
.product-wizard .group-collection .group-remove{position:absolute;top:7px;right:7px;display:flex;align-items:center;justify-content:center;margin:0;padding:0;width:28px;height:28px;min-height:0;border:0;border-radius:50%;background:#fff;color:#171a20;font:400 25px Arial;box-shadow:0 1px 5px #171a2022}
.product-wizard .group-collection .group-add-photos,.product-wizard .group-collection .group-camera{display:flex;align-items:center;justify-content:center;padding:12px;border:1px solid #164bde;border-radius:3px;color:#164bde;background:#fff;font-size:15px;font-weight:600;cursor:pointer;margin:10px 0;min-height:44px;box-sizing:border-box}
.product-wizard .group-collection .group-camera{border-color:#dedfdf;color:#171a20;font-size:13px;min-height:38px;padding:8px}.product-wizard .group-collection label:has(input:disabled){opacity:.5;cursor:not-allowed}
.product-wizard .group-collection .group-note{color:#656974;font-size:12px;line-height:1.7;text-align:center;margin:12px 0}.product-wizard .group-collection .group-share{display:flex;gap:10px;align-items:center;justify-content:center;border:1px solid #164bde;border-radius:3px;background:#164bde;color:#fff;font:700 16px Heebo,Arial,sans-serif;padding:15px 10px;min-height:52px;margin-top:20px;width:100%}.product-wizard .group-collection .group-share svg{flex:none}.product-wizard .group-collection .group-retention-note{margin-bottom:8px}.product-wizard .group-continue{border:1px solid #164bde!important;border-radius:3px!important;background:#fff!important;color:#164bde!important;margin-top:14px!important;font-family:Heebo,Arial,sans-serif!important}.product-wizard .group-clock-modes button:focus-visible,.product-wizard .group-collection button:focus-visible,.group-collection label:focus-within{outline:3px solid #164bde;outline-offset:3px}
@media(max-width:420px){.product-wizard .group-clock-modes button{font-size:13px;padding:12px 6px}.product-wizard .group-collection .group-share{font-size:14px}.product-wizard .group-collection .group-members img{height:145px}}

.product-wizard .group-retention-note{font:400 12px/1.7 Heebo,Arial,sans-serif;color:#656974;text-align:center;margin:14px 0 0}

.group-landing .group-edit{display:flex;align-items:center;justify-content:center;gap:10px;box-sizing:border-box;width:100%;min-height:52px;padding:14px 18px;margin:18px 0 24px;background:#164bde;border:1px solid #164bde;border-radius:3px;color:#fff;font:700 16px/1.5 Heebo,Arial,sans-serif;text-decoration:none}.group-landing .group-edit:hover{background:#103ab1}.group-landing .group-edit[aria-disabled="true"]{opacity:.5;cursor:wait}

/* Shared compact upload screen: the camera remains available after each capture. */
.product-wizard .unified-upload .people-modes{display:none!important}
.product-wizard .unified-collection .upload-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:12px 0}
.product-wizard .unified-collection .upload-tile{position:relative;aspect-ratio:1;min-height:0;min-width:0;width:100%;padding:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border:1px dashed #bbc3d2;border-radius:12px;background:#fff;color:#526078;font:400 12px Heebo,Arial,sans-serif;overflow:hidden;cursor:pointer}
.product-wizard .unified-collection .upload-tile>span{font:400 27px Arial;color:#164bde}.product-wizard .unified-collection .upload-tile strong{font-weight:500}.product-wizard .unified-collection .upload-tile small{font-size:10px}
.product-wizard .unified-collection .selfie-tile{background:#f0f5ff;border-color:#164bde;color:#164bde}
.product-wizard .unified-collection .filled{padding:0;border-style:solid}.product-wizard .unified-collection .filled img{width:100%;height:100%;object-fit:cover}
.product-wizard .unified-collection .upload-expand{display:block;margin:12px auto;padding:8px 15px;min-height:36px;border:1px solid #d7ddea;border-radius:9px;background:#fff;color:#164bde;font:500 14px Heebo,Arial,sans-serif}
.product-wizard .unified-collection .group-share{margin-top:14px;border-radius:10px}.product-wizard .unified-collection .group-note{margin:5px 0 8px}.product-wizard .unified-upload{min-height:0;height:auto}.product-wizard .unified-upload~.wizard-next{margin-top:12px!important;border-radius:10px!important}
@media(max-width:520px){.product-wizard .unified-collection .upload-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.product-wizard .unified-collection .upload-tile{font-size:12px}}
/* Equal geometry for empty buttons and populated div tiles. */
.product-wizard .unified-collection .upload-grid{align-items:start;grid-auto-rows:auto}
.product-wizard .unified-collection .upload-tile{margin:0;align-self:start;box-sizing:border-box}
.product-wizard .unified-collection .filled img{position:absolute;inset:0;display:block;border:0;border-radius:0;margin:0;max-width:none;max-height:none}
.product-wizard .unified-collection .selfie-tile{line-height:1.3;gap:4px;padding:6px;white-space:normal;text-align:center}
.product-wizard .unified-collection .selfie-tile strong,.product-wizard .unified-collection .selfie-tile small{display:block;white-space:normal;overflow:visible;text-overflow:clip;max-width:100%;margin:0;flex-shrink:0}
.product-wizard .unified-collection .selfie-tile small{font-size:10px;line-height:1.35}
.product-wizard .unified-collection .selfie-tile>span{line-height:1;flex-shrink:0;font-size:23px}
.product-wizard .unified-collection .upload-grid{grid-template-columns:repeat(6,minmax(0,1fr))}@media(max-width:520px){.product-wizard .unified-collection .upload-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}

.product-wizard .unified-collection .upload-grid.expanded{grid-template-columns:repeat(7,minmax(0,1fr))}@media(max-width:760px){.product-wizard .unified-collection .upload-grid.expanded{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:521px) and (max-width:760px){.product-wizard .unified-collection .upload-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.product-wizard .unified-collection .upload-grid.expanded{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Expansion only reveals slots; tile geometry stays identical in both states. */
.product-wizard .unified-collection .upload-grid,.product-wizard .unified-collection .upload-grid.expanded{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.product-wizard .unified-collection .upload-grid .upload-tile{flex:0 0 calc((100% - 50px)/6);width:calc((100% - 50px)/6)}
@media(max-width:760px){.product-wizard .unified-collection .upload-grid,.product-wizard .unified-collection .upload-grid.expanded{gap:8px}.product-wizard .unified-collection .upload-grid .upload-tile{flex-basis:calc((100% - 16px)/3);width:calc((100% - 16px)/3)}}
