/* ROOM360 Client Portal: the same Illustrated Luxury system as room360.studio (tokens.css), applied to working screens. */
* { box-sizing: border-box; }
html, body { margin: 0; }
body { min-height: 100vh; display: flex; flex-direction: column; color: var(--r360-ink); font-family: var(--r360-sans); -webkit-font-smoothing: antialiased;
  background: var(--r360-paper) url('/brand/paper-grain.svg') 0 0 / 240px 240px; background-blend-mode: soft-light; }
a { color: var(--r360-atlantic); }
button, input, select, textarea { font: inherit; }

.pt-top { position: sticky; top: 0; z-index: 10; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 12px max(16px, 3vw);
  background: linear-gradient(180deg, rgba(21, 50, 74, 0.96), rgba(21, 50, 74, 0.9)); color: var(--r360-chalk); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.pt-logo { display: inline-flex; align-items: center; gap: 14px; text-decoration: none; color: inherit; }
.pt-wm { display: block; width: 110px; height: 29px; background: var(--r360-chalk); -webkit-mask: url('/brand/logo/wordmark-white.png') no-repeat center / contain; mask: url('/brand/logo/wordmark-white.png') no-repeat center / contain; }
.pt-tag { font-size: 10px; font-weight: 600; letter-spacing: 3px; color: rgba(241, 237, 229, 0.7); }
.pt-nav { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.pt-nav a, .pt-nav button { color: var(--r360-chalk); text-decoration: none; font-size: 11px; font-weight: 600; letter-spacing: 2px; padding: 9px 14px; border-radius: 999px;
  border: 1px solid rgba(241, 237, 229, 0.3); background: transparent; cursor: pointer; }
.pt-nav a:hover, .pt-nav button:hover, .pt-nav a[aria-current="page"] { background: rgba(241, 237, 229, 0.12); border-color: rgba(241, 237, 229, 0.7); }
.pt-main { flex: 1; width: min(1180px, 92vw); margin: 0 auto; padding: 44px 0 70px; }
.pt-foot { text-align: center; padding: 22px; font-size: 10.5px; letter-spacing: 2px; color: #5c6d78; }

h1, h2, h3 { font-family: var(--r360-serif); font-weight: 400; margin: 0; }
h1 { font-size: clamp(2.2rem, 4.6vw, 3.6rem); line-height: 1; }
h1 em, h2 em { color: var(--r360-orange); }
h2 { font-size: 1.7rem; }
.pt-kicker { font-size: 11px; font-weight: 600; letter-spacing: 3px; color: var(--r360-orange-lo); margin-bottom: 12px; }
.pt-lede { color: #3B5060; line-height: 1.7; max-width: 620px; margin: 14px 0 0; }
.pt-row { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.pt-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap; margin-bottom: 30px; }

/* paper cards with an inked frame */
.pt-card { position: relative; background: var(--r360-vanilla-hi); border-radius: 10px; padding: 24px; box-shadow: 0 18px 34px -24px rgba(38, 87, 124, 0.55), inset 0 0 0 1px rgba(38, 87, 124, 0.14); }
.pt-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 18px; }
.pt-proj { display: flex; flex-direction: column; gap: 12px; text-decoration: none; color: inherit; transition: transform .4s var(--r360-ease), box-shadow .4s; }
.pt-proj:hover { transform: translateY(-3px); box-shadow: 0 26px 40px -24px rgba(38, 87, 124, 0.7), inset 0 0 0 1px rgba(229, 86, 4, 0.5); }
.pt-proj h2 { font-size: 1.6rem; }
.pt-meta { font-size: 11px; letter-spacing: 2px; color: #5c6d78; }
.pt-status { align-self: flex-start; font-size: 10px; font-weight: 600; letter-spacing: 2px; padding: 5px 10px; border-radius: 999px; background: rgba(38, 87, 124, 0.1); color: var(--r360-atlantic); text-transform: uppercase; }
.pt-bar { height: 6px; border-radius: 999px; background: rgba(38, 87, 124, 0.12); overflow: hidden; }
.pt-bar i { display: block; height: 100%; background: linear-gradient(90deg, var(--r360-atlantic), var(--r360-orange)); border-radius: inherit; }

/* timeline */
.pt-timeline { list-style: none; margin: 0; padding: 0; position: relative; }
.pt-timeline::before { content: ''; position: absolute; left: 13px; top: 8px; bottom: 8px; width: 1.5px; background: rgba(38, 87, 124, 0.25); }
.pt-step { position: relative; display: grid; grid-template-columns: 28px 1fr auto; gap: 16px; align-items: center; padding: 12px 0; }
.pt-dot { width: 28px; height: 28px; border-radius: 50%; border: 1.5px solid rgba(38, 87, 124, 0.45); background: var(--r360-vanilla-hi); z-index: 1; display: grid; place-items: center; font-size: 13px; color: #fff; }
.pt-step.done .pt-dot { background: var(--r360-atlantic); border-color: var(--r360-atlantic); }
.pt-step.next .pt-dot { border-color: var(--r360-orange); box-shadow: 0 0 0 4px rgba(229, 86, 4, 0.15); }
.pt-step-title { font-family: var(--r360-serif); font-size: 1.3rem; }
.pt-step-date { font-size: 11px; letter-spacing: 1.8px; color: #5c6d78; }

/* forms and buttons */
.pt-field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
.pt-field span { font-size: 10.5px; font-weight: 600; letter-spacing: 2px; color: #485B68; }
.pt-field input, .pt-field select, .pt-field textarea { border: 1px solid rgba(38, 87, 124, 0.3); border-radius: 10px; background: #fffdf8; padding: 12px 14px; color: var(--r360-ink); min-height: 46px; }
.pt-field input:focus, .pt-field select:focus, .pt-field textarea:focus { outline: 2px solid rgba(229, 86, 4, 0.5); outline-offset: 1px; }
.pt-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 46px; padding: 0 22px; border-radius: 999px; border: 0; cursor: pointer; text-decoration: none;
  font-size: 11.5px; font-weight: 600; letter-spacing: 2.4px; color: #fff; background: var(--r360-hot); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 10px 22px -12px rgba(255, 80, 20, 0.7); }
.pt-btn.ghost { background: transparent; color: var(--r360-atlantic); border: 1px solid rgba(38, 87, 124, 0.45); box-shadow: none; }
.pt-btn.small { min-height: 34px; padding: 0 14px; font-size: 10px; }
.pt-btn:disabled { opacity: .5; cursor: wait; }
.pt-note { font-size: 13px; color: #485B68; line-height: 1.6; }
.pt-error { color: #b23a06; font-size: 13px; margin-top: 8px; }
.pt-ok { color: #1f6b3a; font-size: 13px; margin-top: 8px; }

/* login */
.pt-login { max-width: 460px; margin: 4vh auto 0; }
.pt-tabs { display: flex; gap: 6px; margin: 22px 0 18px; }
.pt-tabs button { flex: 1; min-height: 42px; border-radius: 999px; border: 1px solid rgba(38, 87, 124, 0.3); background: transparent; color: var(--r360-atlantic); font-size: 11px; font-weight: 600; letter-spacing: 2px; cursor: pointer; }
.pt-tabs button[aria-selected="true"] { background: var(--r360-atlantic); color: var(--r360-chalk); border-color: var(--r360-atlantic); }
.pt-qr-wrap { display: flex; justify-content: center; margin: 22px 0 6px; }
.pt-qr { display: block; width: 300px; height: 300px; image-rendering: pixelated; max-width: 100%; background: #fff; border-radius: 14px; padding: 12px; box-shadow: 0 0 0 1px rgba(38, 87, 124, 0.18), 0 14px 26px -18px rgba(38, 87, 124, 0.6); }
.pt-qr-form { margin-top: 14px; }
.pt-qr-form .pt-field input { text-align: center; font-size: 1.4rem; letter-spacing: .4em; }

/* tables (studio) */
.pt-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.pt-table th { text-align: left; font-size: 10px; letter-spacing: 2px; color: #5c6d78; font-weight: 600; padding: 10px 8px; border-bottom: 1px solid rgba(38, 87, 124, 0.2); }
.pt-table td { padding: 12px 8px; border-bottom: 1px solid rgba(38, 87, 124, 0.1); vertical-align: middle; }
.pt-table a { text-decoration: none; font-family: var(--r360-serif); font-size: 1.15rem; }
.pt-cols { display: grid; grid-template-columns: 1.4fr 1fr; gap: 18px; align-items: start; }
.pt-mile { display: grid; grid-template-columns: auto 1fr 150px auto auto; gap: 10px; align-items: center; padding: 8px 0; border-bottom: 1px solid rgba(38, 87, 124, 0.1); }
.pt-mile input[type="text"], .pt-mile input[type="date"] { border: 1px solid rgba(38, 87, 124, 0.25); border-radius: 8px; padding: 8px 10px; background: #fffdf8; min-width: 0; }
.pt-cols > * { min-width: 0; }   /* let grid columns shrink instead of pushing past the screen */
.pt-log { font-size: 13px; margin: 0; padding: 0; }
.pt-log li { padding: 8px 0; border-bottom: 1px solid rgba(38, 87, 124, 0.1); list-style: none; }
.pt-empty { padding: 34px; text-align: center; color: #5c6d78; }
@media (max-width: 820px) { .pt-cols { grid-template-columns: 1fr; } .pt-tag { display: none; }
  /* milestone row on two lines: [tick][title] / [date][save][x] */
  .pt-mile { grid-template-columns: auto 1fr auto auto; }
  .pt-mile input[type="text"] { grid-column: 2 / -1; }
  .pt-mile input[type="date"] { grid-column: 1 / 3; }
  /* wide tables scroll inside their card instead of being cut off */
  .pt-table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .pt-table td, .pt-table th { white-space: nowrap; } }
@media (max-width: 560px) {
  .pt-top { flex-wrap: wrap; row-gap: 10px; padding: 10px 16px; }
  .pt-nav { width: 100%; flex-wrap: nowrap; gap: 6px; }
  .pt-nav a, .pt-nav button { flex: 1; text-align: center; padding: 8px 6px; font-size: 10px; letter-spacing: 1.4px; }
  .pt-main { width: auto; margin: 0 16px; padding-top: 30px; } }
@media (prefers-reduced-motion: reduce) { .pt-proj { transition: none; } }

.pt-center { text-align: center; }
.pt-key { margin: 10px auto 0; text-align: center; font-family: ui-monospace, 'SF Mono', Menlo, monospace; font-size: 15px; letter-spacing: .08em; word-break: break-all;
  padding: 12px 14px; border-radius: 10px; background: #fff; border: 1px dashed rgba(38, 87, 124, 0.4); color: var(--r360-ink); max-width: 360px; }

/* ---------- Phase 2: galleries ---------- */
.pt-stack { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.pt-input { border: 1px solid rgba(38, 87, 124, 0.3); border-radius: 10px; background: #fffdf8; padding: 10px 12px; color: var(--r360-ink); min-height: 40px; }
.pt-input.small { min-height: 32px; padding: 4px 8px; font-size: 12px; }
.pt-details { margin-top: 16px; }
.pt-details summary { cursor: pointer; font-size: 10.5px; font-weight: 600; letter-spacing: 2px; color: var(--r360-atlantic); }
.pt-pkg { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 12px; margin-top: 12px; align-items: end; }
.pt-pkg .pt-btn { grid-column: 1 / -1; justify-self: start; }

/* client gallery: calm header, masonry of photographs, quiet controls */
.pt-gal-head { text-align: center; margin: 0 auto 34px; max-width: 760px; }
.pt-gal-head h1 { font-size: clamp(2.4rem, 5.4vw, 4.2rem); }
.pt-gal-head .pt-lede { margin-left: auto; margin-right: auto; }
.pt-gal-tools { justify-content: center; margin-top: 22px; }
.pt-tabs-inline { margin: 0; }
.pt-tabs-inline button { flex: 0 0 auto; padding: 0 16px; min-height: 36px; font-size: 10px; }
.pt-masonry { columns: 3 300px; column-gap: 10px; padding-bottom: 130px; }
.pt-tile { position: relative; margin: 0 0 10px; break-inside: avoid; border-radius: 4px; overflow: hidden; background: rgba(38, 87, 124, 0.08); cursor: zoom-in; }
.pt-tile img { display: block; width: 100%; height: auto; -webkit-user-select: none; user-select: none; transition: transform .8s var(--r360-ease), opacity .4s; }
.pt-tile:hover img { transform: scale(1.015); }
.pt-tile.is-sel { box-shadow: 0 0 0 3px var(--r360-orange); }
.pt-tile-ui { position: absolute; inset: auto 8px 8px auto; display: flex; gap: 6px; opacity: 0; transition: opacity .3s; }
.pt-tile:hover .pt-tile-ui, .pt-tile.is-sel .pt-tile-ui, .pt-tile:focus-within .pt-tile-ui { opacity: 1; }
@media (hover: none) { .pt-tile-ui { opacity: 1; } }
.pt-ico { display: inline-flex; align-items: center; gap: 3px; min-width: 38px; height: 38px; padding: 0 10px; justify-content: center; border-radius: 999px; border: 0; cursor: pointer;
  background: rgba(21, 50, 74, 0.62); color: #fff; font-size: 15px; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.pt-ico small { font-size: 10px; }
.pt-ico.fav.on { color: #ff7a6b; }
.pt-ico.sel.on { background: var(--r360-orange); }
.pt-ico:disabled { opacity: .45; cursor: default; }
.pt-selbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 20; padding: 0 16px 16px; pointer-events: none; }
.pt-selbar-in { pointer-events: auto; max-width: 980px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 14px 20px;
  border-radius: 14px; background: rgba(250, 246, 238, 0.94); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 18px 40px -18px rgba(21, 50, 74, 0.55), inset 0 0 0 1px rgba(38, 87, 124, 0.16); }
.pt-selbar-in > div:first-child { flex: 1; min-width: 0; }
.pt-selbar-in .pt-bar { margin-top: 8px; max-width: 360px; }
.pt-selcount { font-family: var(--r360-serif); font-size: 1.35rem; }
.pt-over { font-family: var(--r360-sans); font-size: 12px; font-weight: 600; color: var(--r360-orange-lo); margin-left: 6px; }

/* full-screen viewer */
.pt-noscroll { overflow: hidden; }
.pt-lb { position: fixed; inset: 0; z-index: 50; background: rgba(12, 18, 24, 0.97); display: grid; place-items: center; }
.pt-lb img { max-width: 92vw; max-height: 82vh; object-fit: contain; -webkit-user-select: none; user-select: none; box-shadow: 0 30px 80px rgba(0, 0, 0, 0.5); }
.pt-lb-x { position: absolute; top: 14px; right: 16px; background: none; border: 0; color: #fff; font-size: 22px; cursor: pointer; padding: 10px; }
.pt-lb-nav { position: absolute; top: 50%; transform: translateY(-50%); background: none; border: 0; color: rgba(255, 255, 255, 0.85); font-size: 54px; line-height: 1; cursor: pointer; padding: 18px; }
.pt-lb-nav.prev { left: 4px; } .pt-lb-nav.next { right: 4px; }
.pt-lb-bar { position: absolute; left: 0; right: 0; bottom: 0; display: flex; justify-content: space-between; align-items: center; padding: 14px 20px; color: rgba(255, 255, 255, 0.75); }
.pt-lb-meta { font-size: 10.5px; letter-spacing: 2px; }

/* dialogs and notices */
.pt-modal-back { position: fixed; inset: 0; z-index: 60; background: rgba(12, 18, 24, 0.5); display: grid; place-items: center; padding: 16px; }
.pt-modal { max-width: 480px; width: 100%; }
.pt-toast { position: fixed; left: 50%; top: 18px; transform: translate(-50%, -30px); opacity: 0; z-index: 70; padding: 12px 18px; border-radius: 10px; font-size: 13px;
  background: var(--r360-atlantic); color: #fff; transition: all .35s var(--r360-ease); pointer-events: none; max-width: 92vw; }
.pt-toast.on { opacity: 1; transform: translate(-50%, 0); }
.pt-toast.bad { background: #b23a06; }

/* team gallery manager */
.pt-drop { display: flex; flex-direction: column; gap: 6px; align-items: center; text-align: center; padding: 28px 18px; border: 1.5px dashed rgba(38, 87, 124, 0.4); border-radius: 12px; cursor: pointer; margin: 14px 0; }
.pt-drop.over { border-color: var(--r360-orange); background: rgba(229, 86, 4, 0.06); }
.pt-uplist { list-style: none; margin: 0 0 12px; padding: 0; font-size: 12.5px; }
.pt-uplist li { display: flex; justify-content: space-between; gap: 10px; padding: 5px 0; border-bottom: 1px solid rgba(38, 87, 124, 0.08); }
.pt-uplist li span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pt-tgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.pt-ttile { position: relative; margin: 0; border-radius: 6px; overflow: hidden; background: rgba(38, 87, 124, 0.08); }
.pt-ttile img, .pt-ttile-ph { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.pt-ttile-ph { display: grid; place-items: center; font-size: 10px; letter-spacing: 2px; color: #5c6d78; }
.pt-ttile figcaption { display: flex; justify-content: space-between; gap: 6px; padding: 6px 8px; font-size: 11px; }
.pt-ttile figcaption span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pt-ttile.is-hidden img { opacity: .35; }
.pt-ttile.is-sel { box-shadow: 0 0 0 2px var(--r360-orange); }
.pt-ttile-ui { position: absolute; top: 6px; right: 6px; display: flex; gap: 4px; opacity: 0; transition: opacity .2s; }
.pt-ttile:hover .pt-ttile-ui, .pt-ttile:focus-within .pt-ttile-ui { opacity: 1; }
.pt-ttile-ui .pt-btn { background: rgba(250, 246, 238, 0.92); }
@media (hover: none) { .pt-ttile-ui { opacity: 1; } }
@media (max-width: 560px) {
  .pt-masonry { columns: 2 140px; column-gap: 6px; }
  .pt-tile { margin-bottom: 6px; }
  .pt-selbar-in { flex-direction: column; align-items: stretch; gap: 10px; }
  .pt-pkg { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pt-lb-nav { font-size: 40px; padding: 10px; }
}
@media (prefers-reduced-motion: reduce) { .pt-tile img, .pt-toast { transition: none; } }

/* ---------- Phase 3: review, carousels, extras, delivery ---------- */
.pt-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 18px; align-items: start; }
.pt-h3 { font-family: var(--r360-serif); font-weight: 400; font-size: 1.2rem; margin: 18px 0 4px; }
.pt-sums td, .pt-sums th { padding: 8px 6px; }
.pt-sums td:first-child { font-family: var(--r360-serif); font-size: 1.05rem; }
.pt-files { list-style: none; margin: 8px 0 0; padding: 0; }
.pt-files li { display: flex; align-items: center; gap: 10px; justify-content: space-between; padding: 6px 0; border-bottom: 1px solid rgba(38, 87, 124, 0.08); font-size: 13px; }
.pt-files li span:first-child { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pt-up { font-size: 12px; color: #485B68; min-height: 1em; margin-top: 6px; }
.pt-log li .pt-status { margin-left: 4px; }

/* review page: player left, comments right */
.pt-review { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 18px; align-items: start; }
.pt-player { position: relative; border-radius: 8px; overflow: hidden; background: #0c1218; aspect-ratio: 16 / 9; display: grid; place-items: center; }
.pt-player video { width: 100%; height: 100%; display: block; background: #0c1218; }
.pt-player .pt-empty { color: rgba(241, 237, 229, 0.7); }
.pt-vwm { position: absolute; inset: 0; pointer-events: none; background: url('/brand/logo/symbol-vanilla-canvas.png') center / 22% auto no-repeat; opacity: .45; filter: drop-shadow(0 0 10px rgba(0, 0, 0, .55)); }
.pt-decide { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.pt-clist { list-style: none; margin: 10px 0 14px; padding: 0; max-height: 52vh; overflow: auto; }
.pt-clist li { display: grid; grid-template-columns: auto 1fr; gap: 12px; padding: 10px 0; border-bottom: 1px solid rgba(38, 87, 124, 0.1); }
.pt-clist li p { margin: 4px 0 6px; font-size: 14px; line-height: 1.5; white-space: pre-wrap; }
.pt-clist li.is-done { opacity: .55; }
.pt-clist li.is-team .pt-meta { color: var(--r360-orange-lo); }
.pt-tc { font: 600 11px/1 ui-monospace, 'SF Mono', Menlo, monospace; letter-spacing: .5px; padding: 6px 8px; border-radius: 6px; border: 0; cursor: pointer;
  background: var(--r360-atlantic); color: #fff; align-self: start; }

/* Instagram-style phone preview */
.pt-ig-wrap { display: flex; justify-content: center; }
.pt-ig { width: min(420px, 100%); background: #fff; border-radius: 22px; overflow: hidden; box-shadow: 0 30px 60px -30px rgba(21, 50, 74, .6), inset 0 0 0 1px rgba(38, 87, 124, .12); }
.pt-ig header { display: flex; align-items: center; gap: 10px; padding: 12px 14px; font-size: 13px; }
.pt-ig header .pt-meta { margin-left: auto; }
.pt-ig-av { width: 30px; height: 30px; border-radius: 50%; background: var(--r360-atlantic) url('/brand/logo/symbol-vanilla-canvas.png') center / 64% auto no-repeat; }
.pt-ig-stage { position: relative; aspect-ratio: 4 / 5; background: #f2efe8; }
.pt-ig-stage img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; -webkit-user-select: none; user-select: none; }
.pt-ig-stage .pt-empty { position: absolute; inset: 0; display: grid; place-items: center; }
.pt-ig-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 30px; height: 30px; border-radius: 50%; border: 0; cursor: pointer; background: rgba(255, 255, 255, .85); font-size: 20px; line-height: 1; color: #222; }
.pt-ig-nav.prev { left: 10px; } .pt-ig-nav.next { right: 10px; }
.pt-ig-count { position: absolute; top: 12px; right: 12px; font-size: 11px; color: #fff; background: rgba(0, 0, 0, .55); padding: 4px 8px; border-radius: 999px; }
.pt-ig-dots { display: flex; justify-content: center; gap: 4px; padding: 10px 0 2px; min-height: 16px; }
.pt-ig-dots i { width: 6px; height: 6px; border-radius: 50%; background: #c9cdd1; }
.pt-ig-dots i.on { background: #0095f6; }
.pt-ig-cap { margin: 0; padding: 6px 14px 16px; font-size: 13.5px; line-height: 1.5; color: #222; white-space: pre-wrap; }
@media (max-width: 820px) { .pt-grid2, .pt-review { grid-template-columns: 1fr; } }

/* ---------- Illustrated Luxury polish (motion, depth, cinematic media) ---------- */
/* each screen arrives with a quiet rise, never a flashy transition */
.pt-main.pt-in > * { animation: pt-rise var(--r360-mid) var(--r360-ease) both; }
.pt-main.pt-in > *:nth-child(2) { animation-delay: .06s; }
.pt-main.pt-in > *:nth-child(3) { animation-delay: .12s; }
.pt-main.pt-in > *:nth-child(4) { animation-delay: .18s; }
@keyframes pt-rise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* the approved hills band (from room360.studio) as a soft illustrated horizon behind page titles */
.pt-main { position: relative; }
.pt-main::before { content: ''; position: absolute; left: 50%; top: 0; width: 100vw; height: 230px; transform: translateX(-50%); z-index: -1; pointer-events: none;
  background: url('/stone/hills-lines.png') center top / 1500px auto repeat-x; opacity: .12;
  -webkit-mask: linear-gradient(180deg, #000 0%, transparent 100%); mask: linear-gradient(180deg, #000 0%, transparent 100%); }
body[data-mood="auth"] .pt-main::before { height: 100%; top: auto; bottom: -70px; opacity: .55; background: url('/stone/hills-blue.jpg') center bottom / cover no-repeat;
  -webkit-mask: linear-gradient(0deg, #000 40%, transparent 100%); mask: linear-gradient(0deg, #000 40%, transparent 100%); }
body[data-mood="auth"] .pt-main { display: grid; align-content: center; min-height: calc(100vh - 140px); }
body[data-mood="auth"] .pt-login { margin-top: 0; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); background: rgba(243, 238, 225, 0.92); }
.pt-login h1 { font-size: clamp(2.4rem, 5vw, 3.4rem); }

/* cards: softer depth, a calm lift where they lead somewhere */
.pt-card { border-radius: 14px; transition: box-shadow .5s var(--r360-ease), transform .5s var(--r360-ease); }
a.pt-card:hover, .pt-proj:hover { transform: translateY(-3px); }
.pt-card h2 { letter-spacing: -.01em; }
.pt-btn { transition: transform .25s var(--r360-ease), box-shadow .35s var(--r360-ease), background-color .35s, color .35s; }
.pt-btn:not(:disabled):hover { transform: translateY(-1px); }
.pt-btn:not(:disabled):active { transform: translateY(0) scale(.98); }
.pt-btn.ghost:not(:disabled):hover { background: rgba(38, 87, 124, 0.08); }
.pt-btn:focus-visible, .pt-ico:focus-visible, .pt-tc:focus-visible, .pt-nav a:focus-visible, .pt-nav button:focus-visible, a:focus-visible { outline: 2px solid var(--r360-orange); outline-offset: 3px; }
.pt-log li a, .pt-table a { text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .45s var(--r360-ease); }
.pt-log li a:hover, .pt-table a:hover { background-size: 100% 1px; }
.pt-status { white-space: nowrap; }

/* gallery: a cinematic cover, photographs that develop in as they load */
.pt-gal-cover { position: relative; width: 100vw; margin-left: calc(50% - 50vw); margin-top: -44px; height: min(62vh, 620px); overflow: hidden; background: #0c1218; }
.pt-gal-cover img { width: 100%; height: 100%; object-fit: cover; display: block; animation: pt-slowzoom 18s var(--r360-ease) both; -webkit-user-select: none; user-select: none; }
.pt-gal-cover-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(12, 18, 24, .15) 0%, rgba(12, 18, 24, .05) 45%, rgba(12, 18, 24, .62) 100%); }
@keyframes pt-slowzoom { from { transform: scale(1.06); } to { transform: scale(1); } }
.pt-gal-head.on-cover { position: relative; margin-top: -210px; color: var(--r360-chalk); z-index: 1; }
.pt-gal-head.on-cover .pt-kicker { color: rgba(241, 237, 229, .85); }
.pt-gal-head.on-cover h1 { color: #fff; text-shadow: 0 2px 30px rgba(0, 0, 0, .35); }
.pt-gal-head.on-cover .pt-lede { color: rgba(241, 237, 229, .9); }
.pt-gal-head.on-cover .pt-lede strong { color: #fff; }
.pt-gal-head.on-cover .pt-gal-tools { margin-top: 26px; }
.pt-gal-head.on-cover .pt-tabs button { background: rgba(250, 246, 238, .9); }
.pt-gal-head.on-cover .pt-tabs button[aria-selected="true"] { background: var(--r360-atlantic); }
.pt-gal-head.on-cover .pt-btn.ghost { background: rgba(250, 246, 238, .9); }
.pt-gal-head.on-cover + .pt-masonry { margin-top: 70px; }
.pt-tile img { opacity: 0; transition: opacity .9s var(--r360-ease), transform .8s var(--r360-ease); }
.pt-tile img.ok { opacity: 1; }
.pt-lb img { opacity: 0; transition: opacity .45s var(--r360-ease); }
.pt-lb img.ok { opacity: 1; }
.pt-lb { animation: pt-fade .35s var(--r360-ease) both; }
@keyframes pt-fade { from { opacity: 0; } to { opacity: 1; } }
.pt-modal { animation: pt-rise .35s var(--r360-ease) both; }
.pt-selbar-in { animation: pt-rise .6s .2s var(--r360-ease) both; }
.pt-ig { transition: transform .6s var(--r360-ease); }
.pt-ig-stage img { transition: opacity .35s var(--r360-ease); }
@media (max-width: 560px) {
  .pt-gal-cover { margin-top: -30px; height: 46vh; }
  .pt-gal-head.on-cover { margin-top: -170px; }
  .pt-gal-head h1 { font-size: 2.3rem; }
}
@media (prefers-reduced-motion: reduce) {
  .pt-main.pt-in > *, .pt-gal-cover img, .pt-lb, .pt-modal, .pt-selbar-in { animation: none; }
  .pt-tile img, .pt-lb img { transition: none; opacity: 1; }
}
html, body { overflow-x: clip; }   /* full-bleed covers and bands never cause sideways scrolling */
.pt-table.pt-sums { display: table; width: 100%; } .pt-table.pt-sums td, .pt-table.pt-sums th { white-space: normal; }
.pt-check { display: flex; gap: 8px; align-items: flex-start; font-size: 13px; color: #485B68; margin: 4px 0 14px; cursor: pointer; }
.pt-linkbox { margin-top: 14px; padding: 14px; border-radius: 12px; background: rgba(229, 86, 4, 0.06); box-shadow: inset 0 0 0 1px rgba(229, 86, 4, 0.25); }
.pt-linkbox .pt-input { font-size: 12px; min-width: 0; }
/* selection limits (set before client access) */
.pt-limits { margin-top: 10px; padding: 14px; border-radius: 12px; background: rgba(38, 87, 124, 0.05); box-shadow: inset 0 0 0 1px rgba(38, 87, 124, 0.12); }
.pt-limits-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; font-size: 13px; }
.pt-limits-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 10px; }
.pt-limits-grid .pt-field { margin-bottom: 10px; }
.pt-limits-grid .pt-field span { font-size: 9.5px; letter-spacing: 1.6px; }
.pt-limits-grid input { min-height: 40px; padding: 8px 10px; }
.pt-ok-pill, .pt-warn-pill { font-size: 9.5px; font-weight: 600; letter-spacing: 1.6px; padding: 4px 9px; border-radius: 999px; white-space: nowrap; }
.pt-ok-pill { background: rgba(31, 107, 58, 0.12); color: #1f6b3a; }
.pt-warn-pill { background: rgba(229, 86, 4, 0.12); color: var(--r360-orange-lo); }
.pt-warn { color: var(--r360-orange-lo); font-size: 13px; line-height: 1.5; margin: 10px 0 0; }
.pt-proj-limits { padding: 12px 0 16px; border-bottom: 1px solid rgba(38, 87, 124, 0.1); }
.pt-proj-limits .pt-row { gap: 10px; }
form.is-blocked { opacity: .5; }
@media (max-width: 560px) { .pt-limits-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }