/* =============================================================================
   THE SIGNED-IN CUSTOMER PORTAL  (/my and /my/order/:id)
   -----------------------------------------------------------------------------
   Written in the tracking page's language, because that page is the one customers
   actually like: the garland (बेल), the marigold riding the progress bar, sage
   ticks, the warm blush ground. Signing in used to show LESS than the public
   tracking link — order number, a status word, a payments table. This makes the
   signed-in view the richer one, which is the only way round that makes sense.

   Loaded only by the portal views, so it can never disturb the storefront.
   Palette is deliberately local (matching track.ejs) rather than site-tokens:
   these two pages are the warm, personal corner of the site.
   ============================================================================= */

.pt{
  --pt-cream:#FBF4F6;
  --pt-card:#FFFFFF;
  --pt-ink:#2E2740;
  --pt-ink2:#4b433c;
  --pt-sec:#7A4E58;
  --pt-muted:#8a7f74;
  --pt-muted2:#b3a89d;
  --pt-sage:#7C8B6E;
  --pt-sage-lt:#9FB487;
  --pt-rose:#C58A7A;
  --pt-rose-lt:#D7A093;
  --pt-rose-deep:#8A5B72;
  --pt-peach:#FBEDE6;
  --pt-peach-line:#F3DED5;
  --pt-line:#EFE2DC;
  --pt-shadow:rgba(61,54,48,0.08);
  --pt-r:20px;

  background:var(--pt-cream);
  color:var(--pt-ink2);
  font-size:16px;
  line-height:1.68;
  letter-spacing:.004em;
  position:relative;
  /* Every ornament sits at a negative offset so it appears to grow from behind the card.
     Without this, those overhangs widen the document and the whole page scrolls sideways
     on a phone — which is where nearly all of these customers read it. */
  overflow-x:hidden;
}

/* ---------- motion vocabulary (matches track.ejs so the two pages move alike) ---------- */
@keyframes pt-sway { 0%,100%{ transform:rotate(-2.4deg); } 50%{ transform:rotate(2.4deg); } }
@keyframes pt-curl { 0%,100%{ transform:rotate(-3deg) scale(1); } 50%{ transform:rotate(3deg) scale(1.045); } }
@keyframes pt-rise { from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
@keyframes pt-pulse{ 0%{ transform:scale(1); opacity:.55; } 70%{ transform:scale(2.1); opacity:0; } 100%{ opacity:0; } }
@keyframes pt-grow { from{ stroke-dashoffset:220; } to{ stroke-dashoffset:0; } }
@media (prefers-reduced-motion: reduce){
  .pt *, .pt *::before, .pt *::after{ animation:none !important; transition:none !important; }
}

/* ---------- the ground: a faint tiling बेल so the page is never bare ---------- */
.pt::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.30;
  background-size:132px 132px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='132' height='132' viewBox='0 0 132 132'%3E%3Cg fill='none' stroke='%23C58A7A' stroke-width='1.05' opacity='.5'%3E%3Cpath d='M12 22c10-8 22-6 28 4'/%3E%3Cpath d='M104 96c10-8 22-6 28 4'/%3E%3Cpath d='M66 60c-8 6-9 18-2 26'/%3E%3C/g%3E%3Cg fill='%23C58A7A' opacity='.42'%3E%3Cellipse cx='40' cy='26' rx='3.1' ry='5.4'/%3E%3Cellipse cx='46.4' cy='30.2' rx='5.4' ry='3.1'/%3E%3Cellipse cx='33.6' cy='30.2' rx='5.4' ry='3.1'/%3E%3Cellipse cx='40' cy='34.4' rx='3.1' ry='5.4'/%3E%3Ccircle cx='40' cy='30.2' r='1.7'/%3E%3C/g%3E%3Cg fill='%23DD9C46' opacity='.38'%3E%3Cellipse cx='98' cy='72' rx='2.5' ry='4.4'/%3E%3Cellipse cx='103.2' cy='75.4' rx='4.4' ry='2.5'/%3E%3Cellipse cx='92.8' cy='75.4' rx='4.4' ry='2.5'/%3E%3Cellipse cx='98' cy='78.8' rx='2.5' ry='4.4'/%3E%3Ccircle cx='98' cy='75.4' r='1.4'/%3E%3C/g%3E%3Cg fill='%239FB487' opacity='.45'%3E%3Cpath d='M18 92c5-4 6-12 0-16-6 4-5 12 0 16Z'/%3E%3Cpath d='M118 34c5-4 6-12 0-16-6 4-5 12 0 16Z'/%3E%3Cpath d='M64 112c4-3 5-10 0-13-5 3-4 10 0 13Z'/%3E%3C/g%3E%3C/svg%3E");
}
.pt > *{ position:relative; z-index:1; }

/* ---------- brandbar + garland ---------- */
.pt-brand{ display:flex; flex-direction:column; align-items:center; text-align:center; padding:20px 0 16px; }
.pt-garland{ display:block; margin-bottom:6px; overflow:visible;
             transform-origin:center bottom; animation:pt-sway 6s ease-in-out infinite; }
.pt-bname{ font-family:'Playfair Display',Georgia,serif; font-weight:600; font-size:18px;
           letter-spacing:.2em; color:var(--pt-ink); }
.pt-btag{ font-family:'Playfair Display',Georgia,serif; font-style:italic; font-size:12px;
          color:var(--pt-rose-deep); margin-top:3px; letter-spacing:.05em; }

/* ---------- greeting ---------- */
.pt-greet{ text-align:center; padding:.4rem 1.1rem 0; animation:pt-rise .5s ease both; }
.pt-greet h1{ font-family:'Playfair Display',Georgia,serif; font-weight:600; color:var(--pt-ink);
              font-size:clamp(25px,5vw,31px); line-height:1.18; letter-spacing:-.01em;
              margin:0; text-wrap:balance; }
.pt-greet p{ margin:10px auto 0; max-width:38ch; font-size:15.5px; line-height:1.66; color:var(--pt-sec); }
.pt-code{ margin-top:12px; font-size:11px; letter-spacing:.14em; text-transform:uppercase;
          color:var(--pt-muted2); font-weight:700; }

/* ---------- layout ---------- */
.pt-stack{ max-width:640px; margin:0 auto; padding:1.1rem 1.1rem 2.6rem;
           display:flex; flex-direction:column; gap:1rem; }

.pt-c{ background:var(--pt-card); border-radius:var(--pt-r); padding:1.15rem;
       box-shadow:0 2px 10px -4px var(--pt-shadow); position:relative; overflow:hidden; }
.pt-c > *:not(.pt-curl){ position:relative; z-index:1; }
.pt-c h2{ font-family:'Playfair Display',Georgia,serif; font-weight:600; color:var(--pt-ink);
          margin:.25rem 0 0; font-size:1.28rem; letter-spacing:-.008em; }
.pt-c h3{ font-family:'Playfair Display',Georgia,serif; font-weight:600; color:var(--pt-ink);
          margin:0 0 .85rem; font-size:1.08rem; letter-spacing:-.006em; }
.pt-c p{ font-size:15px; line-height:1.66; margin:0 0 .55rem; }
.pt-c p:last-child{ margin-bottom:0; }
.pt-kicker{ font-size:11px; letter-spacing:.11em; text-transform:uppercase;
            color:var(--pt-muted2); font-weight:700; }

/* the बेल curling out of a card corner */
.pt-curl{ position:absolute; pointer-events:none; opacity:.42; z-index:0;
          animation:pt-curl 9s ease-in-out infinite; }
.pt-curl.tl{ left:-12px; top:-12px; transform-origin:top left; }
.pt-curl.tr{ right:-12px; top:-12px; transform-origin:top right; animation-duration:7.5s; animation-delay:-1.5s; }
.pt-curl.bl{ left:-14px; bottom:-14px; transform-origin:bottom left; animation-duration:10.5s; animation-delay:-3s; }
.pt-curl.br{ right:-14px; bottom:-16px; transform-origin:bottom right; animation-duration:8.5s; animation-delay:-4.5s; }
.pt-curl path{ stroke-dasharray:220; animation:pt-grow 2.4s ease-out both; }

/* ---------- progress bar + marigold ---------- */
.pt-bar{ position:relative; margin:.85rem 0 .8rem; }
.pt-bar-t{ height:8px; border-radius:99px; background:var(--pt-peach-line); overflow:hidden; }
.pt-bar-f{ height:100%; border-radius:99px; background:linear-gradient(90deg,var(--pt-rose-lt),var(--pt-rose)); }
.pt-bloom{ position:absolute; top:50%; transform:translate(-50%,-50%); }
.pt-bloom svg{ display:block; overflow:visible; transform-origin:center; animation:pt-sway 4.5s ease-in-out infinite; }

.pt-about{ background:var(--pt-peach); border:1px solid var(--pt-peach-line); border-radius:14px;
           padding:.85rem .95rem; margin-top:.85rem; }
.pt-about b{ display:block; color:var(--pt-sec); font-size:14.5px; margin-bottom:.25rem; font-weight:600; }
.pt-about p{ margin:0; font-size:14.5px; line-height:1.64; }

/* ---------- journey ---------- */
.pt-step{ display:flex; gap:14px; position:relative; padding-bottom:18px; }
.pt-step:last-child{ padding-bottom:0; }
.pt-rail{ position:relative; width:24px; flex:none; display:flex; justify-content:center; }
.pt-rail .ln{ position:absolute; top:24px; bottom:-18px; width:2px; background:var(--pt-line); }
.pt-step:last-child .pt-rail .ln{ display:none; }
.pt-halo{ position:absolute; top:0; width:24px; height:24px; border-radius:50%;
          background:var(--pt-rose); animation:pt-pulse 2.4s ease-out infinite; }
.pt-dot{ position:relative; width:24px; height:24px; border-radius:50%; display:flex;
         align-items:center; justify-content:center; font-size:11px; font-weight:700;
         z-index:1; background:var(--pt-card); }
.pt-dot.done{ background:var(--pt-sage); color:#fff; border:2px solid var(--pt-sage); }
.pt-dot.current{ border:2px solid var(--pt-rose); color:var(--pt-rose); }
.pt-dot.upcoming{ border:2px solid var(--pt-line); color:transparent; }
.pt-step .tx{ flex:1; min-width:0; }
.pt-step .tx b{ font-size:15px; font-weight:600; color:var(--pt-ink); letter-spacing:-.003em; }
.pt-step .tx small{ display:block; color:var(--pt-muted); font-size:14px; line-height:1.58;
                    letter-spacing:.008em; margin-top:.1rem; }
.pt-step .wn{ font-size:13.5px; color:var(--pt-muted2); white-space:nowrap; }
.pt-step.up .tx b, .pt-step.up .tx small{ color:var(--pt-muted2); }

/* ---------- photos ---------- */
.pt-photo{ position:relative; border-radius:var(--pt-r); overflow:hidden; height:220px;
           background:linear-gradient(135deg,#F3DED5,#EAD0C6); box-shadow:0 2px 10px -4px var(--pt-shadow); }
.pt-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.pt-photo::after{ content:""; position:absolute; inset:9px; border:1px solid rgba(255,255,255,.5);
                  border-radius:13px; pointer-events:none; }
.pt-photo .cap{ position:absolute; left:0; right:0; bottom:0; padding:.9rem 1rem .8rem; color:#fff;
                font-size:13.5px; background:linear-gradient(180deg,rgba(46,39,64,0),rgba(46,39,64,.62)); }

/* ---------- notes ---------- */
.pt-note{ padding-left:.8rem; border-left:2px solid var(--pt-sage-lt); margin-bottom:.85rem; }
.pt-note:last-child{ margin-bottom:0; }
.pt-note.them{ border-left-color:var(--pt-rose-lt); }
.pt-note .w{ font-size:12.5px; color:var(--pt-muted2); }
.pt-note p{ margin:.12rem 0 0; font-size:14.5px; line-height:1.62; }

/* ---------- money ---------- */
.pt-row{ display:flex; justify-content:space-between; gap:.7rem; font-size:15px; padding:.3rem 0; }
.pt-row.tint{ background:var(--pt-peach); margin:.45rem -1.15rem 0; padding:.65rem 1.15rem;
              font-weight:700; color:var(--pt-sec); }
.pt-num{ font-variant-numeric:tabular-nums; letter-spacing:.005em; }
.pt-row.tint .pt-num{ font-size:1.05rem; letter-spacing:-.01em; }

/* ---------- controls ---------- */
.pt-btn{ display:inline-block; text-decoration:none; text-align:center; border-radius:99px;
         padding:.68rem 1.3rem; font-size:14.5px; font-weight:700; border:1px solid transparent;
         cursor:pointer; font-family:inherit; transition:transform .25s ease; }
.pt-btn:active{ transform:scale(.97); }
.pt-btn.p{ background:var(--pt-rose-deep); color:#fff; }
.pt-btn.g{ background:transparent; color:var(--pt-rose-deep); border-color:var(--pt-rose-lt); }
.pt-btn.full{ display:block; width:100%; }
.pt-btn:focus-visible{ outline:2px solid #DD9C46; outline-offset:2px; }

.pt-ask{ display:flex; gap:.45rem; }
.pt-ask input{ flex:1; min-width:0; border:1px solid var(--pt-line); border-radius:99px;
               padding:.58rem .9rem; font:inherit; font-size:14.5px;
               background:var(--pt-cream); color:var(--pt-ink2); }

/* ---------- keepsake list (account home) ---------- */
/* Was flex + align-items:center. Once the card carried a spec line, an item count and a balance,
   the status pill fought the text for width and "₹4,360 still to pay" wrapped inside its own chip.
   A grid pins the thumbnail and the pill to the top and gives the text the whole middle column. */
.pt-keep{ display:grid; grid-template-columns:56px 1fr auto; gap:.2rem .85rem; align-items:start;
          background:var(--pt-card);
          border-radius:var(--pt-r); padding:.8rem; text-decoration:none; color:inherit;
          box-shadow:0 2px 10px -4px var(--pt-shadow); transition:transform .25s ease, box-shadow .25s ease; }
.pt-keep .th{ grid-column:1; grid-row:1; }
.pt-keep .mt{ grid-column:2; grid-row:1; }
.pt-keep .pt-pill{ grid-column:3; grid-row:1; align-self:start; margin-top:.15rem; }
@media (max-width:430px){
  /* the pill needs a whole line of its own before it starts hyphenating the product name */
  .pt-keep{ grid-template-columns:56px 1fr; }
  .pt-keep .pt-pill{ grid-column:2; grid-row:2; justify-self:start; margin-top:.4rem; }
}
.pt-keep:hover{ transform:translateY(-2px); box-shadow:0 8px 22px -8px var(--pt-shadow); }
.pt-keep .th{ width:56px; height:56px; border-radius:12px; flex:none; object-fit:cover;
              background:linear-gradient(135deg,#F3DED5,#EAD0C6); }
.pt-keep .mt{ flex:1; min-width:0; }
.pt-keep .mt b{ display:block; font-size:15px; font-weight:600; color:var(--pt-ink); }
.pt-keep .mt small{ color:var(--pt-muted); font-size:13.5px; letter-spacing:.01em; }
.pt-mini{ display:flex; align-items:center; gap:.45rem; margin-top:.3rem; }
.pt-mini .tk{ flex:1; height:4px; border-radius:99px; background:var(--pt-peach-line); overflow:hidden; }
.pt-mini .fl{ height:100%; border-radius:99px; background:linear-gradient(90deg,var(--pt-rose-lt),var(--pt-rose)); }
.pt-mini .n{ font-size:12px; color:var(--pt-muted2); white-space:nowrap; font-variant-numeric:tabular-nums; }

/* ---------- order page: the three things people open it to do ---------- */
.pt-acts{ display:grid; grid-template-columns:repeat(3,1fr); gap:.55rem; }
@media (max-width:430px){ .pt-acts{ grid-template-columns:1fr 1fr; } .pt-acts .pt-act:last-child{ grid-column:1/-1; } }
.pt-act{ background:var(--pt-card); border-radius:16px; padding:.75rem .8rem; text-decoration:none;
         color:inherit; box-shadow:0 2px 10px -4px var(--pt-shadow); transition:transform .25s ease;
         display:block; text-align:left; }
.pt-act:hover{ transform:translateY(-2px); }
.pt-act::before{ content:""; display:block; width:18px; height:1px; background:var(--pt-sage-lt); margin-bottom:.45rem; }
.pt-act b{ display:block; font-family:'Playfair Display',Georgia,serif; font-weight:600; font-size:14.5px;
           color:var(--pt-ink); line-height:1.25; }
.pt-act small{ display:block; color:var(--pt-muted2); font-size:12px; margin-top:.12rem; line-height:1.35; }

/* the size/spec, kept off the headline */
.pt-spec{ color:var(--pt-muted2); font-size:13.5px; margin-top:-.15rem; }

/* The ladder repeats what the status card just said, so it opens while a piece is being made
   and folds itself away once making is complete. */
.pt-journey > summary{ list-style:none; cursor:pointer; display:flex; align-items:center;
                       justify-content:space-between; gap:.6rem; }
.pt-journey > summary::-webkit-details-marker{ display:none; }
.pt-journey > summary h3{ margin:0; }
.pt-journey > summary .chev{ font-size:20px; color:var(--pt-muted2); line-height:1; transition:transform .25s ease; }
.pt-journey[open] > summary .chev{ transform:rotate(90deg); }
.pt-journey[open] > summary{ margin-bottom:.7rem; }

/* The catalogue name is the full spec and it wrapped to five lines, crushing the card on a phone.
   The name gets two lines at most; the size sits under it in small type so nothing is lost. */
.pt-keep .mt b{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
                overflow:hidden; line-height:1.3; }
.pt-keep .mt .spec{ display:block; font-style:normal; font-size:12.5px; color:var(--pt-muted2);
                    line-height:1.35; margin-top:.08rem; }
.pt-keep .mt .owe{ display:inline-block; margin-top:.32rem; font-size:12px; font-weight:800;
                   letter-spacing:.02em; color:#A33B28; background:#FBEDEA; border-radius:99px;
                   padding:.14rem .5rem; white-space:nowrap; }
.pt-keep.done{ opacity:.82; }
.pt-keep.done .th{ filter:saturate(.72); }

/* A heading only appears once there is more than one group to tell apart. */
.pt-sec{ font-family:'Playfair Display',Georgia,serif; font-weight:600; font-size:17px;
         color:var(--pt-ink); margin:.35rem 0 -.1rem; }

/* Delivered orders: reachable, never in the way. */
.pt-past{ background:var(--pt-card); border-radius:var(--pt-r); box-shadow:0 2px 10px -4px var(--pt-shadow); }
.pt-past > summary{ list-style:none; cursor:pointer; display:flex; align-items:center;
                    justify-content:space-between; padding:.9rem 1rem; font-size:14.5px;
                    font-weight:700; color:var(--pt-ink); }
.pt-past > summary::-webkit-details-marker{ display:none; }
.pt-past > summary b{ color:var(--pt-muted); font-weight:700; }
.pt-past > summary .chev{ font-size:20px; color:var(--pt-muted2); line-height:1;
                          transition:transform .25s ease; }
.pt-past[open] > summary{ border-bottom:1px solid var(--pt-peach-line); }
.pt-past[open] > summary .chev{ transform:rotate(90deg); }
.pt-paststack{ display:flex; flex-direction:column; gap:.55rem; padding:.7rem; }
.pt-paststack .pt-keep{ box-shadow:none; background:transparent; padding:.45rem .3rem; }
.pt-paststack .pt-keep:hover{ transform:none; }

.pt-pill{ font-size:10.5px; letter-spacing:.09em; text-transform:uppercase; font-weight:700;
          padding:.24rem .6rem; border-radius:99px; white-space:nowrap; }
.pt-pill.done{ background:#EEF3EC; color:#4a7a52; }
.pt-pill.wip{ background:var(--pt-peach); color:var(--pt-sec); }

/* ---------- quiet typographic tiles ---------- */
.pt-quad{ display:grid; grid-template-columns:1fr 1fr; gap:.6rem; }
.pt-q{ background:var(--pt-card); border-radius:16px; padding:.9rem; text-decoration:none;
       color:inherit; box-shadow:0 2px 10px -4px var(--pt-shadow); transition:transform .25s ease; }
.pt-q:hover{ transform:translateY(-2px); }
.pt-q::before{ content:""; display:block; width:20px; height:1px; background:var(--pt-sage-lt); margin-bottom:.5rem; }
.pt-q b{ display:block; font-family:'Playfair Display',Georgia,serif; font-weight:600;
         font-size:15px; color:var(--pt-ink); }
.pt-q small{ display:block; color:var(--pt-muted); font-size:13.5px; letter-spacing:.008em; margin-top:.08rem; }

/* ---------- courier ---------- */
.pt-ship{ background:var(--pt-cream); border:1px solid var(--pt-line); border-radius:14px; padding:.8rem .9rem; }
.pt-ship .co{ font-size:15px; font-weight:600; color:var(--pt-ink); }
.pt-ship .awb{ font-size:14px; color:var(--pt-sec); margin-top:.2rem; letter-spacing:.01em; }
.pt-ship a{ display:inline-block; margin-top:.5rem; color:var(--pt-rose-deep);
            font-size:14.5px; font-weight:600; text-decoration:none; }

/* ---------- FAQ ---------- */
.pt-faq{ border-top:1px solid var(--pt-line); }
.pt-faq:first-of-type{ border-top:none; }
.pt-faq summary{ cursor:pointer; padding:.7rem 0; font-size:15px; font-weight:600; color:var(--pt-ink);
                 list-style:none; display:flex; justify-content:space-between; align-items:center; gap:.6rem; }
.pt-faq summary::-webkit-details-marker{ display:none; }
.pt-faq summary::after{ content:"+"; color:var(--pt-rose-deep); font-weight:400; font-size:1.15rem; }
.pt-faq[open] summary::after{ content:"\2013"; }
.pt-faq p{ margin:0 0 .8rem; font-size:14.5px; line-height:1.64; color:var(--pt-muted); }

/* ---------- a word from Aastha ---------- */
.pt-aastha{ display:flex; gap:.85rem; align-items:flex-start; }
.pt-aastha .av{ width:44px; height:44px; border-radius:50%; flex:none; object-fit:cover;
                background:linear-gradient(140deg,#E0968A,#C58A7A); }
.pt-aastha .sig{ font-family:'Playfair Display',Georgia,serif; font-style:italic;
                 color:var(--pt-rose-deep); font-size:15px; margin-top:.45rem; }

/* ---------- preview banner (team only) ---------- */
.pt-preview{ background:#2E2740; color:#fff; padding:.7rem 1rem; text-align:center;
             font-size:13.5px; line-height:1.5; }

/* ---------- empty state ---------- */
.pt-empty{ text-align:center; padding:2rem 1rem; }
.pt-empty p{ color:var(--pt-muted); margin:.6rem 0 1.1rem; }

@media (max-width:420px){
  .pt-quad{ grid-template-columns:1fr; }
  .pt-step .wn{ display:none; }
}

/* Photo not taken yet — most orders. Showing nothing leaves the page opening on a blank,
   which reads as broken; this says plainly that a photo is coming. */
.pt-photo-empty{ background:linear-gradient(135deg,#FBEDE6,#F3DED5); display:flex;
                 align-items:center; justify-content:center; height:150px; }
.pt-photo-empty .ph{ display:flex; flex-direction:column; align-items:center; gap:.5rem;
                     color:var(--pt-rose-deep); opacity:.7; text-align:center; padding:0 1.4rem; }
.pt-photo-empty .ph span{ font-size:13.5px; max-width:30ch; line-height:1.5; }

/* ---------- what the customer sends us for their frame ---------- */
/* Deliberately roomy: this is filled in on a phone, one-handed, often while looking at the
   wedding photos they are choosing from. Small targets and dense rows lose people here. */
.pt-frame{ display:flex; flex-direction:column; }
.pt-lbl{ font-size:.92rem; font-weight:700; color:var(--pt-ink); margin-bottom:.4rem; }
.pt-lbl em{ font-style:normal; font-weight:400; color:var(--pt-soft,#8a7f74); font-size:.85rem; }
.pt-hint{ font-size:.82rem; color:var(--pt-soft,#8a7f74); margin:.4rem 0 0; }

.pt-file{ font-size:.9rem; padding:.7rem; border:1.5px dashed var(--pt-line); border-radius:12px;
          background:#fff; width:100%; }
.pt-haspic{ display:flex; gap:.8rem; align-items:center; margin-bottom:.6rem;
            background:var(--pt-cream,#FBF6F1); border-radius:12px; padding:.6rem .7rem; }
.pt-haspic img{ width:56px; height:56px; object-fit:cover; border-radius:9px; flex:none; }
.pt-haspic span{ font-size:.82rem; color:var(--pt-soft,#8a7f74); line-height:1.45; }

.pt-names{ display:grid; grid-template-columns:1fr auto 1fr; gap:.5rem; align-items:center; }
.pt-names input, .pt-names select, .pt-in{
  font-size:16px; padding:.75rem .8rem; border:1.5px solid var(--pt-line); border-radius:12px;
  background:#fff; color:var(--pt-ink); font-family:inherit; width:100%; min-width:0; }
.pt-names select{ padding-left:.5rem; padding-right:.5rem; }
.pt-names input:focus, .pt-in:focus, .pt-names select:focus{ outline:none; border-color:var(--pt-rose-deep); }
@media (max-width:430px){ .pt-names{ grid-template-columns:1fr; } }

.pt-fee{ margin-top:1rem; background:#FCF6EC; border:1px solid #E8D3A8; border-radius:12px;
         padding:.85rem .9rem; font-size:.86rem; color:#7A5B25; line-height:1.5; }
.pt-fee b{ display:block; color:#6B4A16; margin-bottom:.2rem; }
.pt-feeamt{ margin-top:.5rem; font-size:.95rem; color:#6B4A16; }
.pt-agree{ display:flex; gap:.5rem; align-items:center; margin-top:.6rem; font-weight:600; }

.pt-btn{ margin-top:1.2rem; width:100%; min-height:50px; border:none; border-radius:99px;
         background:var(--pt-rose-deep); color:#fff; font-family:inherit; font-size:1rem;
         font-weight:700; cursor:pointer; }
.pt-btn:hover{ filter:brightness(1.06); }
.pt-skipform{ margin-top:.6rem; text-align:center; }
.pt-skip{ background:none; border:none; color:var(--pt-soft,#8a7f74); font-family:inherit;
          font-size:.85rem; text-decoration:underline; cursor:pointer; padding:.5rem; }
.pt-ok{ background:#EEF3EC; border:1px solid #CADBC0; color:#4a7a52; border-radius:12px;
        padding:.7rem .85rem; font-size:.88rem; margin-bottom:.9rem; }