/* Layout only; colors, typography and form controls inherit dialog-theme.css. */
body dialog:is(#angel-moment,#jewelry-shop){scrollbar-width:thin}
body dialog:is(#angel-moment,#jewelry-shop) h2{line-height:1.45;margin:0 0 8px}
body dialog:is(#angel-moment,#jewelry-shop) button{cursor:pointer}
body dialog:is(#angel-moment,#jewelry-shop) .moment-scenes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:22px 0}
body dialog:is(#angel-moment,#jewelry-shop) .moment-scene{padding:0 0 12px;border:1px solid #cdb795;border-radius:18px;overflow:hidden;background:#fffdf8;color:#382919;text-align:left;font:inherit;min-width:0}
body dialog:is(#angel-moment,#jewelry-shop) .moment-scene img{display:block;width:100%;aspect-ratio:1;object-fit:cover}
body dialog:is(#angel-moment,#jewelry-shop) .moment-scene strong{display:block;font-size:18px;line-height:28px;margin:10px 12px 4px}
body dialog:is(#angel-moment,#jewelry-shop) .moment-scene span{display:block;font-size:13px;line-height:22px;color:#715d45;margin:0 12px}
body dialog:is(#angel-moment,#jewelry-shop) .moment-scene:hover{border-color:#a66821;background:#f5eddf}
body dialog:is(#angel-moment,#jewelry-shop) .moment-secondary{display:block;margin:16px auto 0;padding:6px 8px;border:0;background:transparent;color:#975717;font:inherit;font-size:17px}
body dialog:is(#angel-moment,#jewelry-shop) .wish-primary{width:100%;background:#efcc7d;border-color:#c38a2c;font-weight:700}
body dialog:is(#angel-moment,#jewelry-shop) .wish-primary:disabled{background:#ded8ca;border-color:#cfbda0;color:#8e8068;cursor:default;font-weight:400}
body dialog:is(#angel-moment,#jewelry-shop) form>label{display:block;margin:20px 0 16px;font-size:18px;font-weight:700}
body dialog:is(#angel-moment,#jewelry-shop) :is(input[type=email],textarea){display:block;width:100%;margin-top:8px;resize:vertical}
body dialog:is(#angel-moment,#jewelry-shop) .moment-upload{display:block;padding:20px;border:1px dashed #cdb795;border-radius:18px;background:#fffdf8;font-weight:700}
body dialog:is(#angel-moment,#jewelry-shop) input[type=file]{display:block;max-width:100%;margin-top:12px;font-size:14px;color:#715d45}
body dialog:is(#angel-moment,#jewelry-shop) .moment-preview{display:block;width:100%;max-height:260px;object-fit:contain;border-radius:18px;background:#eee5d5;margin:20px 0}
body dialog:is(#angel-moment,#jewelry-shop) .moment-note{font-size:13px;line-height:24px;margin:12px 0 20px}
body dialog:is(#angel-moment,#jewelry-shop) .moment-count{display:block;text-align:right;margin:-12px 0 16px;color:#715d45}
body dialog:is(#angel-moment,#jewelry-shop) .moment-error{color:#a13f2f;font-size:16px;line-height:28px;overflow-wrap:anywhere}
body dialog:is(#angel-moment,#jewelry-shop) .moment-error:empty{display:none}
body dialog:is(#angel-moment,#jewelry-shop) .moment-summary{background:#eff2e1;border:1px solid #cdb795;border-radius:14px;padding:15px 20px;margin:20px 0;overflow-wrap:anywhere}
body dialog:is(#angel-moment,#jewelry-shop) .moment-summary p{margin:8px 0;font-size:16px}
@media(max-width:360px){body dialog:is(#angel-moment,#jewelry-shop) .moment-scenes{gap:10px}body dialog:is(#angel-moment,#jewelry-shop) .moment-scene strong{font-size:16px}}
body dialog#jewelry-shop .shop-image{width:100%;max-height:290px;object-fit:contain;background:#eee5d5;border-radius:18px}
body dialog#jewelry-shop .shop-price{font-weight:700;color:#8f561d}
body dialog#jewelry-shop form>label{display:block;margin:18px 0;font-size:18px;font-weight:700}
body dialog#jewelry-shop form :is(input,select){display:block;width:100%;margin-top:8px;min-width:0}
body dialog#jewelry-shop .moment-error{overflow-wrap:anywhere}
/* Compact product checkout: grouped fields rather than a single long column. */
body dialog#jewelry-shop .shop-image{max-height:180px;margin-top:12px}
body dialog#jewelry-shop fieldset{min-width:0;border:0;border-top:1px solid #ded0b9;margin:18px 0 0;padding:12px 0 0}
body dialog#jewelry-shop fieldset legend{font-size:15px;line-height:24px;margin:0;padding:0 10px 0 0;color:#715d45}
body dialog#jewelry-shop .shop-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
body dialog#jewelry-shop .shop-variants .shop-fields{grid-template-columns:repeat(3,minmax(0,1fr))}
body dialog#jewelry-shop .shop-fields label{display:block;min-width:0;margin:0;font-size:14px;font-weight:600;line-height:22px}
body dialog#jewelry-shop form .shop-fields label :is(input,select)[name][name]{box-sizing:border-box;width:100%;min-width:0;margin-top:5px;padding:9px 10px;border-radius:10px;font-size:16px;line-height:24px;height:44px;font-weight:400}
body dialog#jewelry-shop .shop-fields [data-field=email],
body dialog#jewelry-shop .shop-fields [data-field=address],
body dialog#jewelry-shop .shop-fields [data-field=apartment],
body dialog#jewelry-shop .shop-fields [data-field=phone]{grid-column:1/-1}
body dialog#jewelry-shop form>.shop-price{margin:16px 0 8px;font-size:18px}
body dialog#jewelry-shop form>.moment-note{margin:8px 0 14px}
body dialog#jewelry-shop form>.wish-primary{min-height:54px;padding:10px 14px;font-size:18px}