@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=DM+Serif+Display:ital@0;1&family=Playfair+Display:wght@400;500;600;700&display=swap") ;
:root {
  --ink: #243047;
  --ink-soft: #5f6779;
  --paper: #fffdfa;
  --cream: #faf7f2;
  --pink: #a55f67;
  --pink-dark: #864a54;
  --line: #e9deda;
  --gold: #c9a572;
  --display: "DM Serif Display",Georgia,serif;
  --serif: "Playfair Display",Georgia,serif;
  --sans: "DM Sans",Arial,sans-serif;
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}
body {
  margin: 0;
  color: var(--ink);
  font: 14px/1.65 var(--sans);
  background: var(--cream);
}
button,input,textarea,select {
  font: inherit;
}
a {
  color: inherit;
  text-decoration: none;
}
img {
  display: block;
  max-width: 100%;
}
button {
  cursor: pointer;
}
button:disabled {
  opacity: .45;
  cursor: not-allowed;
}
textarea {
  resize: vertical;
  min-height: 110px;
}
h1,h2,h3,h4,p {
  margin-top: 0;
}
h1,h2,h3 {
  line-height: 1.25;
}
.shell {
  width: min(1180px,calc(100% - 44px));
  margin-inline: auto;
}
.section {
  padding-block: 74px;
}
.eyebrow {
  font-size: 11px;
  letter-spacing: .19em;
  font-weight: 800;
  color: var(--pink);
  text-transform: uppercase;
}
.center {
  text-align: center;
}
.muted {
  color: var(--ink-soft);
}
.small-copy {
  font-size: 12px;
  color: var(--ink-soft);
}
.pad-top {
  padding-top: 30px;
}
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 45px;
  padding: 11px 21px;
  border: 1px solid transparent;
  border-radius: 10px;
  font-weight: 700;
  font-size: 12px;
  white-space: nowrap;
  transition: transform .2s ease,background .2s ease;
}
.btn:hover {
  transform: translateY(-1px);
}
.btn-primary {
  background: #8c4f58;
  color: #fff;
  box-shadow: 0 8px 23px #99586026;
}
.btn-primary:hover {
  background: #723943;
}
.btn-outline {
  border-color: #dac7c0;
  background: #fffdfa;
  color: #8c5055;
}
.btn-light {
  background: #fff;
  color: #813d49;
}
.btn.small {
  min-height: 36px;
  padding: 7px 12px;
  font-size: 11px;
}
.wide {
  width: 100%;
}
.nav {
  position: sticky;
  top: 0;
  z-index: 30;
  background: #fffdfaee;
  backdrop-filter: blur(16px);
  border-bottom: 1px solid #eee1da;
}
.nav-inner {
  height: 76px;
  display: flex;
  align-items: center;
  gap: 30px;
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font: 29px var(--display);
  letter-spacing: -1px;
  color: #30354b;
  white-space: nowrap;
}
.mark {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 13px 13px 18px 18px;
  background: linear-gradient(155deg,#88515d,#be8f7c);
  color: #fff;
  font: italic 26px Georgia;
}
.nav-links {
  margin: auto;
  display: flex;
  align-items: center;
  gap: 25px;
}
.nav-links a {
  font-size: 12px;
  font-weight: 600;
  color: #64606a;
}
.nav-links a:hover {
  color: var(--pink);
}
.nav-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.menu-toggle {
  display: none;
  background: transparent;
  border: 0;
  font-size: 22px;
}
.footer {
  margin-top: 50px;
  background: #1e293d;
  color: #e6e4e2;
  padding-top: 55px;
}
.footer-grid {
  display: grid;
  grid-template-columns: 2.4fr 1fr 1.2fr 1.45fr;
  gap: 34px;
}
.footer .brand {
  color: #fff;
}
.footer .mark {
  background: linear-gradient(135deg,#bc8a82,#88505d);
}
.footer-brand p {
  line-height: 1.8;
  max-width: 300px;
  color: #b8bec9;
  font-size: 12px;
  margin: 16px 0;
}
.footer h4 {
  font-size: 13px;
  margin: 7px 0 15px;
}
.footer a:not(.brand) {
  display: block;
  color: #bec4ce;
  font-size: 12px;
  margin: 0 0 10px;
}
.footer a:hover {
  color: #fff;
}
.footer p,.footer-by {
  color: #aab3c3;
  font-size: 12px;
  line-height: 1.8;
}
.footer-bottom {
  padding: 23px 0;
  margin-top: 36px;
  border-top: 1px solid #ffffff1e;
  color: #aab3c3;
  font-size: 11px;
  display: flex;
  justify-content: space-between;
  gap: 12px;
}
.hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 46px;
  align-items: center;
  min-height: 630px;
  padding-block: 65px;
}
.hero h1 {
  font: clamp(42px,5.1vw,71px)/1.12 var(--display);
  margin: 24px 0 24px;
  letter-spacing: -1.4px;
}
.hero h1 em {
  color: #a26369;
  font-weight: 400;
}
.hero-copy>p {
  font-size: 15px;
  line-height: 1.9;
  color: #676b75;
  max-width: 505px;
}
.hero-ctas {
  display: flex;
  gap: 11px;
  flex-wrap: wrap;
  margin-top: 28px;
}
.hero-benefits {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  color: #8f7774;
  font-size: 11px;
  margin-top: 38px;
}
.hero-showcase {
  height: 560px;
  display: grid;
  place-items: center;
  position: relative;
}
.hero-showcase:before {
  content: "";
  position: absolute;
  border-radius: 50%;
  height: 440px;
  width: 440px;
  max-width: 100%;
  background: radial-gradient(ellipse,#f3d9d2,transparent 72%);
}
.hero-cover {
  width: 320px;
  height: 480px;
  max-width: 75%;
  z-index: 1;
  border: 9px solid #fff;
  box-shadow: 0 28px 70px #80635b3f;
  transform: rotate(3deg);
  border-radius: 160px 160px 15px 15px;
  overflow: hidden;
}
.hero-cover .w-cover {
  height: 100%;
}
.hero-note {
  z-index: 2;
  position: absolute;
  background: #fffdfaf2;
  border: 1px solid #eeded4;
  border-radius: 12px;
  padding: 12px 16px;
  color: #765a60;
  font-size: 11px;
  box-shadow: 0 14px 30px #77605b22;
}
.note-top {
  top: 98px;
  left: 0;
  transform: rotate(-5deg);
}
.note-bottom {
  bottom: 65px;
  right: 0;
  transform: rotate(3deg);
}
.cream {
  background: #f3ece6;
}
.section-heading {
  text-align: center;
  max-width: 660px;
  margin: 0 auto 42px;
}
.section-heading h2 {
  font: clamp(33px,3.4vw,46px)/1.2 var(--display);
  margin: 15px auto;
}
.section-heading p {
  color: #74717b;
  font-size: 14px;
}
.theme-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 22px;
}
.theme-card {
  min-width: 0;
  border: 1px solid #e8ded6;
  border-radius: 18px;
  background: #fffdfb;
  overflow: hidden;
  box-shadow: 0 10px 36px #6e504409;
  display: flex;
  flex-direction: column;
}
.theme-card-art {
  height: 360px;
  padding: 12px;
  overflow: hidden;
}
.theme-card-art .w-cover {
  height: 100%;
  border-radius: 130px 130px 12px 12px;
}
.theme-card-meta {
  padding: 4px 20px 10px;
  flex: 1;
}
.theme-card h3 {
  font: 25px var(--display);
  margin: 10px 0 7px;
}
.theme-card p {
  font-size: 12px;
  line-height: 1.7;
  color: #77737b;
  margin: 0;
}
.pill {
  font-size: 10px;
  border-radius: 20px;
  background: #f5ece7;
  color: #8e6366;
  padding: 5px 10px;
  font-weight: 700;
}
.theme-card-actions {
  padding: 15px 20px 20px;
  display: flex;
  gap: 8px;
}
.theme-card-actions .btn {
  flex: 1;
}
.features {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 18px;
}
.feature {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 27px 25px;
  min-height: 165px;
}
.feature>span {
  display: grid;
  place-items: center;
  width: 43px;
  height: 43px;
  border-radius: 50%;
  background: #f8ebe9;
  color: #a26168;
  font-size: 21px;
}
.feature h3 {
  margin: 13px 0 6px;
  font-size: 15px;
}
.feature p {
  color: var(--ink-soft);
  font-size: 12px;
}
.cta {
  text-align: center;
  background: linear-gradient(130deg,#aa7378,#7a3e4d);
  padding: 58px 22px;
  border-radius: 24px;
  color: #fff;
  margin-top: 10px;
  margin-bottom: 70px;
}
.cta p {
  font-size: 12px;
  letter-spacing: .1em;
}
.cta h2 {
  font: 42px var(--display);
  margin: 5px 0 23px;
}
.page-intro {
  padding-bottom: 35px;
  max-width: 780px;
}
.page-intro h1,.big-title {
  font: clamp(37px,4vw,56px)/1.2 var(--display);
  margin: 13px 0;
}
.page-intro p {
  color: var(--ink-soft);
}
.filters {
  display: flex;
  gap: 9px;
  margin-bottom: 29px;
  flex-wrap: wrap;
}
.filter {
  border: 1px solid var(--line);
  background: white;
  color: #6d6973;
  border-radius: 23px;
  padding: 9px 18px;
  font-size: 12px;
  font-weight: 700;
}
.filter.active {
  background: #9e626b;
  color: #fff;
  border-color: #9e626b;
}
.auth-section {
  width: min(1040px,calc(100% - 44px));
  display: grid;
  grid-template-columns: .93fr 1.07fr;
  gap: 45px;
  margin: 80px auto;
  align-items: center;
}
.auth-aside {
  min-height: 520px;
  padding: 44px;
  border-radius: 24px;
  background: linear-gradient(140deg,#f2e0d8,#f8eee8);
  position: relative;
  overflow: hidden;
}
.auth-aside h1 {
  font: 43px var(--display);
  max-width: 330px;
}
.auth-aside>.w-cover {
  height: 325px;
  max-width: 265px;
  margin: 20px auto 0;
  transform: rotate(-4deg);
  border: 8px solid #fff;
  border-radius: 140px 140px 8px 8px;
}
.auth-card {
  padding: 45px;
  border: 1px solid var(--line);
  border-radius: 23px;
  background: white;
  box-shadow: 0 22px 60px #6e514510;
}
.auth-card h2 {
  font: 38px var(--display);
  margin: 9px 0;
}
.auth-card>p {
  color: var(--ink-soft);
}
.btn-google {
  width: 100%;
  background: #fff;
  border-color: #d6dade;
  color: #344054;
  font-size: 13px;
  margin: 18px 0 4px;
}
.google-g {
  color: #4285f4;
  font-weight: 800;
  font-size: 20px;
}
.or {
  display: flex;
  align-items: center;
  gap: 14px;
  text-align: center;
  color: #918985;
  font-size: 11px;
  margin: 22px 0;
}
.or:before,.or:after {
  content: "";
  height: 1px;
  flex: 1;
  background: var(--line);
}
.field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 15px;
  min-width: 0;
}
.field>span,.field label {
  font-weight: 700;
  font-size: 12px;
  color: #625c62;
}
.field input,.field textarea,.field select {
  width: 100%;
  border: 1px solid #e2d8d3;
  border-radius: 9px;
  padding: 11px 13px;
  outline: none;
  background: white;
  min-height: 45px;
  color: #263343;
}
.field textarea {
  min-height: 120px;
}
.field input:focus,.field select:focus,.field textarea:focus {
  border-color: #b67984;
  box-shadow: 0 0 0 3px #f5e5e7;
}
.auth-switch,.auth-disclaimer {
  text-align: center;
  font-size: 11px;
  margin-top: 17px;
  color: #817d85;
}
.auth-switch a,.auth-disclaimer a {
  color: var(--pink);
  font-weight: 800;
}
.dash {
  padding-block: 55px;
}
.dash-head,.editor-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 26px;
}
.dash h1,.editor h1 {
  font: 42px var(--display);
  margin: 8px 0;
}
.dash-head p,.editor-top p {
  color: var(--ink-soft);
}
.row-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.stats {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 17px;
  margin-bottom: 26px;
}
.stats>div {
  padding: 21px;
  border-radius: 14px;
  background: white;
  border: 1px solid var(--line);
}
.stats span,.stats small {
  display: block;
  font-size: 11px;
  color: #80818b;
}
.stats b {
  font: 35px var(--display);
  display: block;
  margin: 7px 0;
}
.stats small {
  font-size: 10px;
}
.dash-panel,.new-invite {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 23px;
  margin-top: 20px;
}
.panel-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  margin-bottom: 22px;
}
.panel-head h2 {
  font: 28px var(--display);
  margin: 0 0 5px;
}
.panel-head p {
  margin: 0;
  color: #83818a;
  font-size: 12px;
}
.form-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 0 16px;
}
.form-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: 12px 0 20px;
}
.my-invites {
  display: grid;
  gap: 14px;
}
.my-invite {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 13px;
  display: flex;
  gap: 18px;
  align-items: center;
}
.my-invite-cover {
  width: 115px;
  height: 145px;
  flex: none;
  overflow: hidden;
  border-radius: 9px;
}
.my-invite-cover .w-cover {
  height: 100%;
}
.my-invite-info {
  flex: 1;
}
.my-invite-info h3 {
  font: 24px var(--display);
  margin: 4px 0;
}
.my-invite-info p {
  font-size: 12px;
  color: var(--ink-soft);
}
.my-invite-actions {
  display: flex;
  gap: 9px;
  flex-direction: column;
}
.status,.tag {
  display: inline-block;
  background: #f0ece9;
  color: #777070;
  padding: 4px 10px;
  font-size: 10px;
  font-weight: 800;
  border-radius: 20px;
}
.status.published,.tag.yes {
  background: #e4f2e9;
  color: #33724d;
}
.tag.no {
  background: #ffe9e7;
  color: #a54954;
}
.empty {
  padding: 40px 20px;
  text-align: center;
}
.empty>span {
  font-size: 46px;
  color: var(--pink);
}
.empty h3 {
  font: 30px var(--display);
}
.empty p {
  color: var(--ink-soft);
}
.helper-note,.notice {
  padding: 13px 15px;
  background: #fff5ea;
  border: 1px solid #f0d9c2;
  border-radius: 9px;
  font-size: 12px;
  line-height: 1.8;
  color: #7f6c5e;
}
.editor {
  padding-block: 42px;
}
.editor-grid {
  display: grid;
  grid-template-columns: 215px minmax(0,1fr) 255px;
  gap: 20px;
  align-items: start;
}
.editor-sidebar,.editor-main,.editor-preview {
  border: 1px solid var(--line);
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 11px 30px #634b3507;
}
.editor-sidebar {
  padding: 22px 12px;
  position: sticky;
  top: 96px;
}
.editor-sidebar>.eyebrow,.editor-sidebar>h2,.editor-sidebar>p {
  margin-inline: 11px;
}
.editor-sidebar h2 {
  font: 23px var(--display);
  margin: 10px 11px;
}
.editor-sidebar p {
  font-size: 12px;
  color: #817a7b;
}
.editor-tabs {
  display: grid;
  gap: 4px;
  margin-top: 27px;
}
.editor-tabs button {
  border: 0;
  text-align: left;
  padding: 12px 14px;
  background: white;
  color: #77717a;
  border-radius: 9px;
  font-size: 12px;
  font-weight: 700;
}
.editor-tabs b {
  font-size: 16px;
  display: inline-block;
  width: 24px;
}
.editor-tabs button.active {
  background: #f7e8e9;
  color: #974d5a;
}
.sidebar-back {
  display: block;
  font-size: 11px;
  padding: 12px;
  margin-top: 20px;
  color: #8f5d66;
}
.editor-main {
  padding: 24px;
  min-width: 0;
}
.editor-main h3 {
  font: 21px var(--display);
  margin: 24px 0 13px;
}
.editor-preview {
  padding: 16px;
  position: sticky;
  top: 96px;
}
.preview-top {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  margin: 0 0 14px;
}
.preview-top span {
  color: #978f89;
  font-size: 10px;
}
.preview-phone {
  height: 305px;
  overflow: hidden;
  border: 7px solid #f3e9e2;
  border-radius: 115px 115px 12px 12px;
}
.preview-phone .w-cover {
  height: 100%;
}
.editor-preview>p {
  font-size: 11px;
  line-height: 1.7;
  color: #8c8283;
}
.mini-themes {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 9px;
  margin-bottom: 23px;
}
.mini-theme {
  background: #fff;
  border: 2px solid #ebdfd9;
  border-radius: 9px;
  padding: 5px;
  text-align: center;
  min-width: 0;
}
.mini-theme.selected {
  border-color: #a9626d;
  background: #fff6f6;
}
.mini-theme>div {
  height: 132px;
  overflow: hidden;
  border-radius: 6px;
}
.mini-theme .w-cover {
  height: 100%;
}
.mini-theme b {
  display: block;
  font-size: 10px;
  padding: 6px 0 2px;
}
.upload-panel {
  border-top: 1px solid var(--line);
  margin-top: 25px;
  padding-top: 4px;
}
.upload-panel p {
  font-size: 12px;
  color: var(--ink-soft);
}
.guest-table-scroll {
  overflow: auto;
  margin-top: 23px;
}
.data-table {
  border-collapse: collapse;
  width: 100%;
  min-width: 640px;
}
.data-table th {
  text-align: left;
  color: #9b8880;
  letter-spacing: .04em;
  text-transform: uppercase;
  font-size: 10px;
  background: #faf6f1;
  padding: 12px 9px;
}
.data-table td {
  border-bottom: 1px solid #f1e9e2;
  padding: 14px 9px;
  font-size: 12px;
  vertical-align: middle;
}
.data-table td b,.data-table td small {
  display: block;
}
.data-table td small {
  font-size: 10px;
  color: #8e8581;
  margin-top: 4px;
}
.table-link {
  background: none;
  border: 0;
  color: #985666;
  font-size: 11px;
  padding: 4px;
  font-weight: 700;
}
.table-link.danger {
  color: #b94b59;
}
.upload-link {
  color: #9d5763;
  font-weight: 800;
  cursor: pointer;
}
.gifts-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 13px;
  margin-top: 23px;
}
.gift-card {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 20px;
  background: #faf7f3;
}
.gift-card>span {
  font-size: 10px;
  letter-spacing: .16em;
  color: #b38c77;
  font-weight: 800;
}
.gift-card h3 {
  margin: 8px 0;
}
.gift-card strong {
  font-size: 18px;
  word-break: break-all;
}
.gift-card p {
  color: #77717b;
  font-size: 12px;
}
.toggle {
  display: flex;
  align-items: center;
  gap: 9px;
  font-weight: 700;
  margin: 5px 0 16px;
}
.toggle input {
  accent-color: #985968;
  width: 17px;
  height: 17px;
}
.publish-card {
  display: flex;
  gap: 13px;
  align-items: center;
  justify-content: space-between;
  background: #f6f0ea;
  padding: 18px;
  border-radius: 11px;
  overflow: hidden;
}
.publish-card span {
  display: block;
  font-size: 10px;
  color: #9d8680;
}
.publish-card strong {
  display: block;
  font-size: 13px;
  overflow-wrap: anywhere;
}
.publish-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: 22px 0;
}
.danger-zone {
  border-top: 1px solid var(--line);
  padding-top: 20px;
  margin-top: 38px;
}
.danger-zone h3 {
  color: #a94958;
}
.danger-zone p {
  font-size: 12px;
  color: #746b6a;
}
.legal-page {
  padding-block: 70px;
}
.back-link {
  font-size: 12px;
  color: #985666;
  display: inline-block;
  margin-bottom: 30px;
}
.legal-page h1 {
  font: clamp(42px,5vw,60px) var(--display);
  margin: 15px 0;
}
.legal-sub {
  font-size: 12px;
  color: #898080;
  max-width: 760px;
}
.legal-content {
  max-width: 880px;
  margin: 45px 0;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 34px 40px;
}
.legal-section {
  margin-bottom: 32px;
}
.legal-section:last-child {
  margin-bottom: 0;
}
.legal-section h2 {
  font: 23px var(--display);
  margin: 0 0 10px;
}
.legal-section p {
  font-size: 13px;
  color: #777482;
  line-height: 1.9;
}
.legal-foot {
  font-size: 12px;
  color: #847c79;
}
.legal-foot a,.contact-box a {
  color: #a15b69;
  text-decoration: underline;
}
.toast {
  position: fixed;
  top: 92px;
  right: 22px;
  z-index: 200;
  max-width: min(420px,calc(100vw - 44px));
  padding: 15px 20px;
  box-shadow: 0 17px 40px #31313b33;
  border-radius: 12px;
  font-size: 12px;
  color: white;
}
.toast.good {
  background: #294b42;
}
.toast.bad {
  background: #923e4b;
}
.toast[hidden] {
  display: none;
}
/* TRUE TEMPLATE ENGINE — every preview and published invitation use the exact same layout. */
body.invite-mode {
  background: #ede4da;
}
.w-page {
  --w-bg: #f2d9bc;
  --w-card: #fff5e8;
  --w-ink: #603d27;
  --w-accent: #a46c43;
  --w-outline: #c19b72;
  --w-cover-bg: radial-gradient(ellipse at 50% 26%,#f9e9cf,#c99860 80%);
  min-height: 100vh;
  background: var(--w-bg);
  color: var(--w-ink);
  font-family: var(--serif);
  text-align: center;
  position: relative;
}
.w-cover-wrap {
  height: 100dvh;
  min-height: 650px;
}
.w-cover {
  width: 100%;
  height: 100%;
  background: var(--w-cover-bg);
  position: relative;
  overflow: hidden;
  color: var(--w-ink);
  display: flex;
  align-items: center;
  justify-content: center;
  isolation: isolate;
  container-type: inline-size;
}
.w-cover:before {
  content: "";
  position: absolute;
  inset: 3%;
  border: 2px solid var(--w-outline);
  opacity: .7;
  border-radius: 47% 47% 4px 4px;
  z-index: 1;
  pointer-events: none;
}
.w-cover:after {
  content: "";
  position: absolute;
  inset: 5%;
  border: 1px solid var(--w-outline);
  opacity: .4;
  border-radius: 46% 46% 3px 3px;
  z-index: 1;
  pointer-events: none;
}
.w-cover-center {
  position: relative;
  z-index: 4;
  max-width: 62%;
  margin: auto;
  display: grid;
  justify-items: center;
  gap: 12px;
  text-shadow: 0 2px 9px #f6e5cfdf;
}
.w-pretitle {
  font-size: clamp(9px,1.3vw,13px);
  letter-spacing: .16em;
  font-weight: 700;
}
.w-subtitle,.w-date {
  letter-spacing: .2em;
  font-size: clamp(10px,1.1vw,15px);
}
.w-names {
  font: clamp(64px,8vw,115px)/.94 var(--display);
  letter-spacing: -.05em;
  margin: 11px 0;
  word-break: break-word;
  overflow-wrap: anywhere;
}
.w-names span {
  display: block;
  font: italic .54em var(--serif);
  margin: 7px;
}
.w-guest {
  margin-top: 10px;
  background: color-mix(in srgb,var(--w-card) 90%,transparent);
  border: 1px solid var(--w-outline);
  border-radius: 13px;
  padding: 12px 21px;
  font-family: var(--sans);
}
.w-guest span {
  display: block;
  font-size: 12px;
  letter-spacing: normal;
}
.w-guest strong {
  display: block;
  font-size: 17px;
}
.w-open,.w-button {
  border: 1px solid var(--w-outline);
  background: var(--w-ink);
  color: var(--w-card);
  border-radius: 30px;
  padding: 14px 24px;
  font: 700 13px var(--sans);
  margin-top: 9px;
  box-shadow: 0 10px 25px #42220c24;
}
.w-open {
  animation: floatIn 4s infinite ease-in-out;
}
.cover-bg-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .20;
  z-index: 0;
  pointer-events: none;
}
.couple-art {
  position: absolute;
  bottom: -3%;
  height: 83%;
  width: min(100%,1000px);
  object-fit: contain;
  z-index: 2;
  opacity: .91;
  pointer-events: none;
  animation: coupleEnter 1.5s ease-out both;
}
.ornament {
  position: absolute;
  color: var(--w-outline);
  font-size: 80px;
  opacity: .55;
  z-index: 1;
}
.ornament-a {
  top: 8%;
  left: 8%;
  transform: rotate(-28deg);
}
.ornament-b {
  right: 8%;
  bottom: 8%;
  transform: rotate(23deg);
}
.w-cover.compact .w-cover-center {
  max-width: 66%;
  gap: 3px;
}
.w-cover.compact .w-pretitle {
  font-size: clamp(6px,2.7cqw,13px);
}
.w-cover.compact .w-subtitle,.w-cover.compact .w-date {
  font-size: clamp(6px,2.4cqw,11px);
}
.w-cover.compact .w-names {
  font-size: clamp(17px,9.5cqw,67px);
  margin: 5px auto;
}
.w-cover.compact .couple-art {
  height: 76%;
  opacity: .9;
}
.w-cover.compact .ornament {
  font-size: 20px;
}
.w-cover.compact:before {
  border-width: 1px;
}
.w-cover.compact:after {
  border-width: 1px;
}
.w-page .w-contents {
  background: var(--w-bg);
}
.w-top {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  padding: 20px clamp(16px,5vw,70px);
  align-items: center;
  background: var(--w-ink);
  color: var(--w-card);
  font-size: 11px;
  letter-spacing: .09em;
  font-family: var(--sans);
}
.w-top strong {
  font: 20px var(--display);
  letter-spacing: 0;
}
.w-section {
  padding: 105px max(16px,calc((100% - 980px)/2));
  position: relative;
  overflow: hidden;
}
.w-section:nth-of-type(odd) {
  background: var(--w-card);
}
.w-eyebrow {
  font: 700 11px var(--sans);
  letter-spacing: .27em;
  color: var(--w-accent);
  margin-bottom: 20px;
}
.w-section h1 {
  font: clamp(45px,7vw,87px)/1.1 var(--display);
  margin: 0 0 24px;
  letter-spacing: -.04em;
}
.w-section h1 em {
  color: var(--w-accent);
}
.w-section h2 {
  font: clamp(37px,5vw,61px)/1.15 var(--display);
  margin: 12px 0 31px;
}
.w-section p {
  font: 16px/2 var(--serif);
  max-width: 650px;
  margin: 12px auto 24px;
  white-space: pre-line;
}
.w-intro {
  padding-block: 140px;
}
.w-intro:before,.w-end:before {
  content: "❦";
  color: var(--w-outline);
  position: absolute;
  top: 24px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 43px;
}
.w-orn {
  color: var(--w-accent);
  font-size: 23px;
  letter-spacing: 13px;
  margin-top: 30px;
}
.w-people {
  display: grid;
  grid-template-columns: 1fr 70px 1fr;
  gap: 20px;
  max-width: 760px;
  margin: 30px auto 0;
  align-items: center;
}
.w-people article img,.w-person-placeholder {
  height: 280px;
  width: 230px;
  max-width: 100%;
  object-fit: cover;
  margin: 0 auto 23px;
  border: 8px solid var(--w-card);
  box-shadow: 0 14px 32px #3f24172c;
  border-radius: 110px 110px 9px 9px;
  background: #f1e4cf;
}
.w-person-placeholder {
  display: grid;
  place-items: center;
  font-size: 100px;
  color: var(--w-outline);
}
.w-people h3 {
  font: 36px var(--display);
  margin: 6px 0;
}
.w-people p {
  font-size: 13px;
  color: var(--w-accent);
}
.w-ampersand {
  font: italic 62px var(--serif);
  color: var(--w-accent);
}
.w-couple blockquote {
  font: italic 22px/1.9 var(--serif);
  max-width: 680px;
  margin: 50px auto 0;
}
.count-numbers {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 13px;
  max-width: 570px;
  margin: 30px auto;
}
.count-numbers>div {
  border: 1px solid var(--w-outline);
  border-radius: 15px;
  padding: 19px 8px;
  background: color-mix(in srgb,var(--w-card) 74%,transparent);
}
.count-numbers b,.count-numbers span {
  display: block;
}
.count-numbers b {
  font: 42px var(--display);
}
.count-numbers span {
  font: 11px var(--sans);
  color: var(--w-accent);
}
.w-events-grid,.w-gift-list {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 22px;
  max-width: 780px;
  margin: 0 auto;
}
.w-event {
  background: var(--w-card);
  border: 1px solid var(--w-outline);
  border-radius: 140px 140px 13px 13px;
  padding: 55px 21px 32px;
  min-height: 320px;
}
.event-emblem {
  font-size: 38px;
  color: var(--w-accent);
}
.event-title {
  letter-spacing: .2em;
  font: 700 13px var(--sans);
  margin: 7px;
}
.event-date {
  font: 23px var(--display);
  margin-top: 18px;
}
.event-time {
  font: 17px var(--serif);
  margin-bottom: 20px;
}
.w-event strong {
  display: block;
  font-size: 15px;
}
.w-event p {
  font-size: 12px;
  margin-top: 7px;
}
.w-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 20px;
  border: 1px solid var(--w-outline);
  border-radius: 25px;
  color: var(--w-ink);
  background: transparent;
  font: 600 12px var(--sans);
  margin: 8px auto;
}
.w-story {
  padding-block: 115px;
}
.w-photos {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 12px;
  margin: auto;
  max-width: 860px;
}
.w-photos img {
  aspect-ratio: 3/4;
  object-fit: cover;
  border-radius: 12px;
}
.w-rsvp p {
  max-width: 550px;
}
.rsvp-buttons {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin: 20px auto;
}
.w-gift {
  background: var(--w-card);
  border: 1px solid var(--w-outline);
  border-radius: 18px;
  padding: 28px 19px;
}
.w-gift span {
  letter-spacing: .2em;
  font: 700 10px var(--sans);
  color: var(--w-accent);
}
.w-gift h3 {
  font: 32px var(--display);
  margin: 12px;
}
.w-gift strong {
  font: 25px var(--sans);
  overflow-wrap: anywhere;
}
.w-gift p {
  font-size: 12px;
}
.w-wishes form {
  display: grid;
  gap: 12px;
  max-width: 560px;
  margin: 25px auto;
}
.w-wishes form label {
  font: 600 12px var(--sans);
}
.w-wishes textarea {
  min-height: 125px;
  background: var(--w-card);
  border: 1px solid var(--w-outline);
  border-radius: 12px;
  padding: 16px;
}
.w-wishes .w-button {
  justify-self: center;
}
.w-wishes-list {
  max-width: 650px;
  max-height: 440px;
  overflow-y: auto;
  margin: 25px auto 0;
  text-align: left;
}
.w-wish {
  padding: 17px 20px;
  border-bottom: 1px solid var(--w-outline);
  background: var(--w-card);
  margin-bottom: 8px;
  border-radius: 10px;
}
.w-wish strong {
  font: 700 12px var(--sans);
}
.w-wish p {
  font-size: 12px;
  margin: 6px 0;
}
.w-end {
  padding-block: 130px;
}
.w-end>div:last-child {
  font-size: 52px;
}
.w-footer {
  padding: 22px 15px;
  background: var(--w-ink);
  color: var(--w-card);
  font: 12px var(--sans);
}
.w-footer a {
  text-decoration: underline;
}
.preview-badge {
  position: fixed;
  z-index: 100;
  top: 12px;
  left: 50%;
  transform: translateX(-50%);
  background: #1c3048;
  color: white;
  border-radius: 30px;
  box-shadow: 0 8px 23px #1114;
  padding: 10px 18px;
  font: 700 10px var(--sans);
  display: flex;
  align-items: center;
  gap: 20px;
  white-space: nowrap;
}
.preview-exit {
  border: 0;
  background: #fff2;
  color: #fff;
  padding: 6px 12px;
  border-radius: 20px;
  font: 700 10px var(--sans);
}
.music-fab {
  position: fixed;
  bottom: 25px;
  right: 22px;
  z-index: 15;
  background: var(--w-ink);
  color: var(--w-card);
  border: 1px solid var(--w-outline);
  border-radius: 24px;
  padding: 12px 17px;
  font: 700 12px var(--sans);
  box-shadow: 0 8px 23px #0002;
}
/* Distinct traditions / decorative systems. Each changes cover, ornamentation AND content sections. */
.theme-rama-sinta {
  --w-bg: #e2c18b;
  --w-card: #f7e6c5;
  --w-ink: #523420;
  --w-accent: #92602e;
  --w-outline: #b78140;
  --w-cover-bg: radial-gradient(ellipse at 50% 30%,#f8e4b6 4%,#d9af73 62%,#9b653d 116%);
}
.theme-rama-sinta .w-cover:before {
  border-radius: 49% 49% 0 0;
  border-width: 7px;
  box-shadow: inset 0 0 0 8px #8e642537;
}
.theme-rama-sinta .w-event {
  border-width: 3px;
  border-style: double;
}
.theme-rama-sinta .w-section:before {
  color: #996a3c;
  opacity: .15;
}
.theme-keraton {
  --w-bg: #c3a178;
  --w-card: #f5e6cf;
  --w-ink: #573c2e;
  --w-accent: #8d592c;
  --w-outline: #9e744d;
  --w-cover-bg: linear-gradient(138deg,#ede0c4,#c69b60 65%,#95683e);
}
.theme-keraton .w-cover:before {
  border-width: 9px;
  border-style: double;
  border-radius: 8px 8px 0 0;
  transform: scale(.95);
}
.theme-keraton .w-section:nth-of-type(even) {
  background-image: linear-gradient(45deg,#af824112 25%,transparent 25%,transparent 50%,#af824112 50%,#af824112 75%,transparent 75%);
  background-size: 19px 19px;
}
.theme-minang {
  --w-bg: #801f24;
  --w-card: #f3debd;
  --w-ink: #6a1725;
  --w-accent: #ab7433;
  --w-outline: #c99a55;
  --w-cover-bg: radial-gradient(ellipse at 50% 40%,#b55c42 0%,#8b292c 65%,#50191e);
}
.theme-minang .w-cover {
  color: #f9dfa8;
}
.theme-minang .w-cover:before {
  border-radius: 0;
  clip-path: polygon(0 35%,13% 0,50% 28%,87% 0,100% 35%,100% 100%,0 100%);
  border: 9px double #d4a15d;
}
.theme-minang .w-cover-center {
  color: #f7deb9;
  text-shadow: 0 3px 8px #2d0b0c;
}
.theme-minang .w-event {
  border-radius: 10px 10px 80px 80px;
}
.theme-bali {
  --w-bg: #a97043;
  --w-card: #f3e1c8;
  --w-ink: #69412e;
  --w-accent: #a56c37;
  --w-outline: #a77746;
  --w-cover-bg: linear-gradient(155deg,#efd8ad,#c19c68 55%,#715032);
}
.theme-bali .w-cover:before {
  border-radius: 3px;
  border-width: 11px;
  border-style: double;
}
.theme-bali .w-section:nth-of-type(even) {
  background-image: radial-gradient(circle at 10% 15%,#8663400c,transparent 20%),radial-gradient(circle at 90% 80%,#8663400c,transparent 25%);
}
.theme-floral {
  --w-bg: #f5e2e4;
  --w-card: #fff8f7;
  --w-ink: #824c5b;
  --w-accent: #b47e86;
  --w-outline: #d6b1af;
  --w-cover-bg: radial-gradient(ellipse,#fff4ed,#e4b8c0);
}

.theme-floral .w-cover:before {
  border-radius: 50% 50% 12px 12px;
}
.theme-floral .w-event {
  border-radius: 130px 130px 70px 70px;
}
.theme-floral .w-names {
  font-style: italic;
}
.theme-sage {
  --w-bg: #d6e0d1;
  --w-card: #f7f8ed;
  --w-ink: #46644e;
  --w-accent: #75927c;
  --w-outline: #a6bca9;
  --w-cover-bg: linear-gradient(135deg,#eaf0da,#a6b99d);
}

.theme-sage .w-cover:before {
  border-radius: 120px 120px 120px 120px;
}
.theme-sage .w-event {
  border-radius: 80px 80px 18px 18px;
}
.theme-sakura {
  --w-bg: #f8d8dc;
  --w-card: #fff6f4;
  --w-ink: #86505e;
  --w-accent: #bc7887;
  --w-outline: #dbb2b8;
  --w-cover-bg: radial-gradient(ellipse,#fff8f4,#efbfcf);
}
.theme-sakura .w-cover:before {
  border-radius: 60% 60% 60% 60%;
  transform: rotate(8deg);
}
.theme-sakura .ornament:after {
  content: "❀ ❀";
  position: absolute;
  left: -35px;
  top: 38px;
  letter-spacing: 18px;
}
.theme-sakura .w-names {
  font-style: italic;
}
.theme-navy {
  --w-bg: #142a43;
  --w-card: #f6eedc;
  --w-ink: #1b314e;
  --w-accent: #bd9b60;
  --w-outline: #c6a569;
  --w-cover-bg: radial-gradient(ellipse,#37526a,#0e223a 75%);
}
.theme-navy .w-cover-center {
  color: #ead6aa;
  text-shadow: 0 2px 10px #080c1c;
}
.theme-navy .w-cover:before {
  border-radius: 47% 47% 8px 8px;
  border: 3px double #c9ac79;
  box-shadow: inset 0 0 0 12px #c7b1881c;
}
.theme-navy .w-event {
  border-radius: 90px 90px 12px 12px;
  border: 2px solid var(--w-outline);
}
.theme-minimal {
  --w-bg: #eceae5;
  --w-card: #fffdfa;
  --w-ink: #343d42;
  --w-accent: #8f8380;
  --w-outline: #c4c4be;
  --w-cover-bg: #f9f7f2;
}
.theme-minimal .w-cover:before {
  border-radius: 0;
  inset: 10%;
  border-width: 1px;
}
.theme-minimal .w-cover:after {
  display: none;
}
.theme-minimal .ornament {
  opacity: .24;
}
.theme-minimal .w-names {
  font-family: var(--sans);
  font-weight: 400;
  letter-spacing: -.07em;
}
.theme-minimal .w-event {
  border-radius: 6px;
}
.theme-rustic {
  --w-bg: #553527;
  --w-card: #f9e7cc;
  --w-ink: #5c3927;
  --w-accent: #ae7241;
  --w-outline: #d1a170;
  --w-cover-bg: radial-gradient(ellipse at 50% 32%,#b38d58 0%,#684126 70%,#342317 110%);
}
.theme-rustic .w-cover-center {
  color: #fff2d5;
  text-shadow: 0 4px 14px #28170d;
}
.theme-rustic .w-cover:before {
  border-radius: 8px;
  border: 5px double #b08b52;
}
.theme-rustic .w-cover:after {
  background: radial-gradient(circle at 20% 20%,#fff7ae 0 1px,transparent 3px),radial-gradient(circle at 80% 45%,#fff0a7 0 2px,transparent 4px);
  background-size: 40px 40px,75px 75px;
  opacity: .5;
}
.theme-rustic .w-event {
  border-radius: 10px;
}
@keyframes coupleEnter {
  from {
    transform: translateY(25px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: .91;
  }
}
@keyframes floatIn {
  0%,100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
  }
}
@media(min-width:1024px) {
  .w-page:not(.compact) .w-cover-wrap .w-cover {
    min-height: 740px;
  }
}
@media(max-width:1100px) {
  .editor-grid {
    grid-template-columns: 195px minmax(0,1fr);
  }
  .editor-preview {
    grid-column: 2;
    position: static;
  }
  .editor-preview .preview-phone {
    max-width: 280px;
  }
  .nav-inner {
    gap: 15px;
  }
  .nav-links {
    gap: 14px;
  }
  .nav-links a {
    font-size: 11px;
  }
}
@media(max-width:800px) {
  .nav-links {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    top: 76px;
    background: white;
    padding: 25px;
    box-shadow: 0 19px 27px #3332;
  }
  .nav-links.shown {
    display: grid;
  }
  .menu-toggle {
    display: block;
  }
  .nav-actions>.btn-outline {
    display: none;
  }
  .hero {
    grid-template-columns: 1fr;
    text-align: center;
    min-height: auto;
    padding-block: 54px;
    gap: 15px;
  }
  .hero-copy>p {
    margin-inline: auto;
  }
  .hero-ctas,.hero-benefits {
    justify-content: center;
  }
  .hero-showcase {
    height: 470px;
  }
  .hero-cover {
    height: 420px;
    width: 285px;
  }
  .theme-grid,.features {
    grid-template-columns: repeat(2,1fr);
  }
  .footer-grid {
    grid-template-columns: repeat(2,1fr);
  }
  .stats {
    grid-template-columns: repeat(2,1fr);
  }
  .auth-section {
    grid-template-columns: 1fr;
    max-width: 600px;
    margin-block: 35px;
  }
  .auth-aside {
    display: none;
  }
  .editor-grid {
    grid-template-columns: 1fr;
  }
  .editor-sidebar {
    position: static;
  }
  .editor-tabs {
    display: flex;
    overflow-x: auto;
  }
  .editor-tabs button {
    white-space: nowrap;
  }
  .editor-preview {
    grid-column: auto;
  }
  .editor-preview .preview-phone {
    height: 300px;
  }
  .w-cover-center {
    max-width: 64%;
  }
  .w-names {
    font-size: clamp(46px,10vw,78px);
  }
  .w-people {
    grid-template-columns: 1fr 45px 1fr;
  }
  .w-people h3 {
    font-size: 26px;
  }
  .w-people article img,.w-person-placeholder {
    height: 200px;
    width: 160px;
  }
}
@media(max-width:540px) {
  .shell {
    width: calc(100% - 30px);
  }
  .section {
    padding-block: 48px;
  }
  .nav-inner {
    height: 64px;
  }
  .nav-links {
    top: 64px;
  }
  .brand {
    font-size: 25px;
  }
  .mark {
    width: 33px;
    height: 33px;
    font-size: 22px;
  }
  .nav-actions .btn-primary {
    padding: 9px 12px;
    font-size: 11px;
    min-height: 36px;
  }
  .hero {
    padding-block: 38px;
  }
  .hero h1 {
    font-size: 45px;
  }
  .hero-copy>p {
    font-size: 13px;
  }
  .hero-showcase {
    height: 400px;
  }
  .hero-cover {
    height: 350px;
    width: 240px;
  }
  .hero-note {
    font-size: 10px;
    padding: 8px 11px;
  }
  .note-top {
    top: 30px;
  }
  .note-bottom {
    bottom: 20px;
  }
  .theme-grid,.features {
    grid-template-columns: 1fr;
  }
  .theme-card-art {
    height: 365px;
  }
  .theme-card-art .w-cover {
    max-width: 290px;
    margin: auto;
  }
  .theme-card-actions {
    flex-direction: row;
  }
  .footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 20px;
  }
  .footer-brand {
    grid-column: span 2;
  }
  .footer-bottom {
    flex-direction: column;
    gap: 5px;
  }
  .page-intro h1 {
    font-size: 37px;
  }
  .filters {
    gap: 6px;
  }
  .filter {
    padding: 8px 11px;
    font-size: 11px;
  }
  .auth-card {
    padding: 25px;
  }
  .dash {
    padding-block: 29px;
  }
  .dash-head,.editor-top {
    align-items: flex-start;
    flex-direction: column;
  }
  .dash h1,.editor h1 {
    font-size: 33px;
  }
  .stats {
    gap: 10px;
  }
  .stats>div {
    padding: 15px;
  }
  .stats b {
    font-size: 30px;
  }
  .dash-panel,.new-invite,.editor-main {
    padding: 16px;
  }
  .panel-head {
    align-items: start;
  }
  .my-invite {
    flex-wrap: wrap;
  }
  .my-invite-cover {
    width: 75px;
    height: 105px;
  }
  .my-invite-info {
    min-width: 180px;
  }
  .my-invite-info h3 {
    font-size: 20px;
  }
  .my-invite-actions {
    width: 100%;
    flex-direction: row;
  }
  .form-grid,.gifts-grid {
    grid-template-columns: 1fr;
  }
  .mini-themes {
    grid-template-columns: repeat(3,1fr);
  }
  .mini-theme>div {
    height: 110px;
  }
  .legal-page {
    padding-block: 38px;
  }
  .legal-content {
    padding: 25px 19px;
    margin-top: 25px;
  }
  .w-cover-wrap {
    min-height: 590px;
  }
  .w-cover-center {
    max-width: 60%;
    gap: 10px;
  }
  .w-cover:not(.compact) .w-names {
    font-size: clamp(38px,12.5vw,63px);
  }
  .w-cover:not(.compact) .w-pretitle,.w-cover:not(.compact) .w-subtitle,.w-cover:not(.compact) .w-date {
    font-size: 10px;
  }
  .w-cover:not(.compact) .couple-art {
    width: 145%;
    max-width: none;
    height: 75%;
    bottom: 0;
    left: -22.5%;
    opacity: .78;
  }
  .w-guest {
    padding: 12px;
    font-size: 11px;
  }
  .w-guest strong {
    font-size: 12px;
  }
  .w-guest span {
    font-size: 10px;
  }
  .w-open {
    padding: 12px 16px;
    font-size: 11px;
  }
  .w-section {
    padding: 72px 20px;
  }
  .w-section h1 {
    font-size: 47px;
  }
  .w-section h2 {
    font-size: 37px;
  }
  .w-section p {
    font-size: 13px;
  }
  .w-top {
    padding: 15px;
    gap: 6px;
    flex-wrap: wrap;
    justify-content: center;
  }
  .w-top span {
    font-size: 9px;
  }
  .w-top strong {
    font-size: 16px;
  }
  .w-people {
    gap: 8px;
    grid-template-columns: 1fr 22px 1fr;
  }
  .w-people h3 {
    font-size: 21px;
  }
  .w-ampersand {
    font-size: 35px;
  }
  .w-people article img,.w-person-placeholder {
    height: 170px;
    width: 125px;
  }
  .w-couple blockquote {
    font-size: 15px;
  }
  .w-event {
    padding: 40px 15px 25px;
    min-height: auto;
  }
  .w-events-grid,.w-gift-list {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .w-photos {
    grid-template-columns: repeat(2,1fr);
  }
  .count-numbers {
    gap: 6px;
  }
  .count-numbers>div {
    padding: 11px 4px;
  }
  .count-numbers b {
    font-size: 27px;
  }
  .preview-badge {
    font-size: 9px;
    max-width: calc(100vw - 24px);
  }
  .preview-exit {
    font-size: 9px;
  }
  .w-intro {
    padding-block: 120px;
  }
  .w-cover.compact .w-names {
    font-size: clamp(17px,11cqw,49px);
  }
}
@media(prefers-reduced-motion:reduce) {
  *,*:before,*:after {
    animation-duration: .001ms!important;
    transition-duration: .001ms!important;
    scroll-behavior: auto!important;
  }
}
.w-qris {
  grid-column: 1/-1;
  max-width: 350px;
  width: 100%;
  margin: auto;
}
.w-qris img {
  width: min(230px,100%);
  max-height: 260px;
  object-fit: contain;
  margin: 17px auto;
  background: white;
  padding: 12px;
  border-radius: 8px;
}
/* Kawinku R6 · undangan utuh, khas untuk setiap tradisi, memakai markup live dan preview yang sama */
.w-page {
  overflow-x: hidden;
}
.w-cover {
  transition: filter .7s ease;
  min-height: 100%;
}
.w-cover:not(.compact) .w-cover-center {
  padding: 42px 0;
  animation: coverRevelation 1s ease both;
}
.w-cover-bloom {
  position: absolute;
  inset: 6%;
  z-index: 1;
  pointer-events: none;
  opacity: .75;
  border: 1px solid color-mix(in srgb,var(--w-outline),transparent 40%);
}
.bloom-left {
  clip-path: polygon(0 0,38% 0,0 42%);
}
.bloom-right {
  clip-path: polygon(100% 58%,62% 100%,100% 100%);
}
.w-open {
  transition: transform .22s ease,filter .22s ease;
}
.w-open:hover {
  transform: translateY(-4px);
  filter: brightness(1.13);
}
.w-contents .w-top {
  position: sticky;
  top: 0;
  z-index: 17;
  background: color-mix(in srgb,var(--w-card) 93%,transparent);
  backdrop-filter: blur(12px);
  box-shadow: 0 1px 0 color-mix(in srgb,var(--w-outline) 34%,transparent);
}
.w-scene {
  height: min(100svh,790px);
  min-height: 540px;
  position: relative;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: var(--w-cover-bg);
  isolation: isolate;
  color: var(--w-ink);
}
.w-scene:before,.w-scene:after {
  content: "";
  position: absolute;
  z-index: 2;
  pointer-events: none;
  inset: 24px 4%;
  border: 1px solid var(--w-outline);
  opacity: .62;
}
.w-scene:after {
  inset: 35px 5.4%;
  opacity: .28;
}
.w-scene-kicker {
  position: absolute;
  top: 12%;
  left: 0;
  right: 0;
  z-index: 3;
  text-transform: uppercase;
  font: 700 11px var(--sans);
  letter-spacing: .36em;
  color: var(--w-ink);
}

.w-scene-caption {
  position: relative;
  z-index: 4;
  background: color-mix(in srgb,var(--w-card) 65%,transparent);
  border: 1px solid var(--w-outline);
  backdrop-filter: blur(7px);
  padding: 55px 62px;
  max-width: 88%;
  box-shadow: 0 25px 80px #33221129;
  display: grid;
  gap: 15px;
  min-width: min(550px,84%);
}
.w-scene-caption span {
  font: 700 10px var(--sans);
  letter-spacing: .22em;
}
.w-scene-caption strong {
  font: clamp(45px,5.5vw,78px)/1.13 var(--display);
}
.w-scene-caption i {
  font: .65em var(--serif);
}
.w-scene-caption small {
  font: 12px var(--sans);
  letter-spacing: .1em;
}
.w-page .w-intro {
  position: relative;
}
.w-page .w-intro:after {
  content: "❦";
  display: block;
  font: 38px Georgia;
  line-height: 1.5;
  color: var(--w-accent);
  margin-top: 25px;
}
.w-page .w-section {
  position: relative;
  isolation: isolate;
}
.w-section h2 {
  position: relative;
}
.w-section h2:after {
  content: "✧";
  display: block;
  font-size: 26px;
  color: var(--w-accent);
  margin: 13px 0 2px;
}
.w-page .w-story p {
  max-width: 590px;
  margin: 0 auto;
  line-height: 2.35;
}
.story-ornament {
  font-size: 25px;
  color: var(--w-accent);
  margin: 20px 0;
}
.story-ornament span {
  margin: 0 12px;
}
.w-quick-nav {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: 20px;
  z-index: 19;
  display: flex;
  gap: 17px;
  padding: 8px 18px;
  border-radius: 44px;
  background: color-mix(in srgb,var(--w-card) 94%,transparent);
  border: 1px solid var(--w-outline);
  box-shadow: 0 7px 28px #28201e36;
  backdrop-filter: blur(10px);
}
.w-quick-nav a {
  font: 23px Georgia;
  padding: 0 11px;
  color: var(--w-ink);
  border-radius: 50%;
}
.w-quick-nav a:hover {
  background: var(--w-outline);
}
.demo-information {
  position: absolute;
  top: 88px;
  right: 14px;
  z-index: 50;
  max-width: 310px;
  display: grid;
  gap: 5px;
  padding: 11px 15px;
  border-radius: 11px;
  background: #ffffffe6;
  color: #273044;
  box-shadow: 0 3px 18px #0002;
  text-align: left;
  font: 10px/1.5 var(--sans);
  border: 1px solid #ddd;
}
.demo-information strong {
  font-size: 10px;
  letter-spacing: .12em;
}
.demo-information span {
  color: #5e6675;
}
.theme-rama-sinta .w-scene {
  background: #bd955c;
}

.theme-rama-sinta .w-scene-caption {
  background: #f3e1bdcf;
  border: 5px double #815b2e;
  outline: 2px solid #d4b071;
  outline-offset: 9px;
}
.theme-rama-sinta .w-cover:before {
  background: radial-gradient(circle at 50% -3%,#ffecb633,transparent 45%);
}
.theme-keraton .w-scene {
  background: #a6804f;
}

.theme-keraton .w-scene-caption {
  border-radius: 130px 130px 12px 12px;
  background: #f2dfbbcc;
  border: 4px double #9d723e;
}
.theme-minang .w-scene {
  background: #7c242c;
}

.theme-minang .w-scene-caption {
  background: #3d151ddd;
  color: #f7db9c;
  border: 2px solid #e4b86d;
}
.theme-bali .w-scene {
  background: #84613c;
}

.theme-bali .w-scene-caption {
  background: #f0dcbfbe;
  border: 7px double #815435;
}
.theme-floral .w-scene {
  background: #ead1c9;
}

.theme-floral .w-scene-caption {
  background: #fffaf1b8;
  border-radius: 200px 200px 10px 10px;
  border: 1px solid #d5a6ab;
}
.theme-sage .w-scene {
  background: #c1d0bf;
}

.theme-sage .w-scene-caption {
  background: #fbfbebd6;
  border-radius: 140px 140px 20px 20px;
}
.theme-sakura .w-scene {
  background: #efd3db;
}

.theme-sakura .w-scene-caption {
  background: #fff4f1ce;
  border-radius: 200px;
}
.theme-navy .w-scene {
  background: #0c2037;
  color: #f7e5b9;
}

.theme-navy .w-scene-caption {
  background: #0e2444db;
  color: #f9e4b2;
  border: 4px double #cbb078;
}
.theme-navy .w-scene-kicker {
  color: #f4db9d;
}
.theme-navy .w-scene-caption small {
  color: #f5e6cb;
}
.theme-minimal .w-scene {
  background: #f7f3ec;
}

.theme-minimal .w-scene-caption {
  background: #f8f7f0db;
  border: 1px solid #acaca1;
}
.theme-minimal .w-scene-caption strong {
  font-family: var(--sans);
  font-weight: 400;
  letter-spacing: -.08em;
}
.theme-rustic .w-scene {
  background: #523d2e;
  color: #ffead4;
}

.theme-rustic .w-scene-caption {
  background: #513627dd;
  color: #f8e5c7;
  border: 1px solid #d6aa78;
}
.theme-rustic .w-scene-kicker {
  color: #f5ddb8;
}
@keyframes scenicBreath {
  from {
    transform: scale(1);
  }
  to {
    transform: scale(1.055);
  }
}
@keyframes coverRevelation {
  from {
    opacity: 0;
    transform: translateY(18px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes sceneRise {
  from {
    transform: scale(1) translateY(8px);
  }
  to {
    transform: scale(1.04) translateY(-4px);
  }
}
@media(max-width:540px) {
  .demo-information {
    top: 36px;
    right: 8px;
    max-width: 178px;
    padding: 8px;
    font-size: 9px;
  }
  .w-scene {
    min-height: 570px;
    max-height: 730px;
  }
  .w-scene-caption {
    padding: 40px 17px;
    min-width: 75%;
    max-width: 86%;
  }
  .w-scene-caption strong {
    font-size: clamp(33px,11vw,49px);
  }
  .w-scene-kicker {
    font-size: 9px;
    top: 16%;
  }
  .w-quick-nav {
    bottom: 12px;
    padding: 6px 12px;
    gap: 12px;
  }
  .w-quick-nav a {
    padding: 0 7px;
  }
  .w-section {
    scroll-margin-top: 55px;
  }
}
@media(prefers-reduced-motion:reduce) {
  .w-scene-art,.w-cover-center {
    animation: none!important;
  }
}
/* Kawinku V1 R8 — Editorial wedding editions. 10 real printable-layout inspired designs. */
@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Great+Vibes&family=Cinzel:wght@400;500;600&family=Marcellus&family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap") ;
:root {
  --font-cormorant: "Cormorant Garamond",Georgia,serif;
  --font-script: "Great Vibes",cursive;
  --font-classic: "Cinzel",Georgia,serif;
  --font-marcellus: "Marcellus",serif;
}
body.invite-mode {
  background: #252525;
}
body.invite-mode #app {
  background: radial-gradient(circle at 20% 10%,#514a43,transparent 55%),radial-gradient(circle at 70% 70%,#343039,#191a20);
  min-height: 100vh;
}
body.invite-mode .w-page {
  width: min(100%,590px);
  margin: 0 auto;
  min-height: 100vh;
  overflow: clip;
  box-shadow: 0 0 120px #0008;
  background: var(--w-card);
  color: var(--w-ink);
}
body.invite-mode .w-page:has(.w-cover-wrap) {
  width: min(100%,590px);
}
.w-cover-wrap {
  min-height: 100svh;
  min-height: 100dvh;
}
.w-cover:not(.compact) {
  min-height: 100svh;
  min-height: 100dvh;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  display: grid;
  place-items: center;
  padding: 38px 22px 24px;
  transition: none;
}
.w-cover::before,.w-cover::after {
  pointer-events: none;
}
.w-cover:not(.compact)::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: var(--cover-art,none),var(--w-cover-bg);
  background-size: cover,cover;
  background-position: center;
  transform: scale(1.01);
}
.w-cover:not(.compact)::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg,transparent 3%,color-mix(in srgb,var(--w-cover-bg) 24%,transparent) 38%,color-mix(in srgb,var(--w-cover-bg) 70%,transparent) 74%,var(--w-cover-bg) 100%);
  pointer-events: none;
}
.w-cover:not(.compact) .cover-bg-photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
  opacity: .62;
  filter: saturate(.82);
}
.w-cover:not(.compact) .w-border-arch {
  position: absolute;
  pointer-events: none;
  inset: 23px;
  z-index: 3;
  border: 1px solid var(--w-outline);
  opacity: .8;
}
.w-cover:not(.compact) .w-border-arch::before,.w-cover:not(.compact) .w-border-arch::after {
  content: "❦";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-size: 23px;
  line-height: 1;
  color: var(--w-accent);
  background: var(--w-cover-bg);
  padding: 0 17px;
}
.w-cover:not(.compact) .w-border-arch::before {
  top: -10px;
}
.w-cover:not(.compact) .w-border-arch::after {
  bottom: -10px;
  transform: translateX(-50%) rotate(180deg);
}
.w-cover:not(.compact) .w-cover-center {
  position: relative;
  z-index: 7;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  width: 100%;
  max-width: 430px;
  text-align: center;
  padding: 68px 22px 20px;
  animation: coverRevelation .85s both;
}
.w-cover:not(.compact) .w-pretitle {
  font-family: var(--font-classic);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--w-ink);
  line-height: 1.7;
}
.w-cover:not(.compact) .w-subtitle {
  font: 500 9px "Plus Jakarta Sans",sans-serif;
  letter-spacing: .35em;
  text-transform: uppercase;
  opacity: .85;
}
.w-cover:not(.compact) .w-names {
  font: 500 clamp(53px,10.2vw,83px)/.92 var(--font-cormorant);
  letter-spacing: -.045em;
  color: var(--w-ink);
  text-shadow: 0 3px 25px color-mix(in srgb,var(--w-cover-bg) 76%,transparent);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}
.w-cover:not(.compact) .w-names span {
  display: block;
  font: 400 38px/.9 var(--font-script);
  letter-spacing: 0;
  margin: 5px 0;
  color: var(--w-accent);
}
.w-cover:not(.compact) .w-date {
  font: 500 11px/1.7 "Plus Jakarta Sans",sans-serif;
  letter-spacing: .19em;
  text-transform: uppercase;
  border-block: 1px solid var(--w-outline);
  padding: 9px 12px;
  margin-top: 8px;
}
.w-cover:not(.compact) .w-guest {
  background: color-mix(in srgb,var(--w-card) 65%,transparent);
  border: 1px solid color-mix(in srgb,var(--w-outline) 68%,transparent);
  border-radius: 0;
  box-shadow: none;
  padding: 16px 22px;
  margin-top: 11px;
  width: min(100%,300px);
  color: var(--w-ink);
  backdrop-filter: blur(9px);
}
.w-cover:not(.compact) .w-guest span {
  font-family: "Plus Jakarta Sans",sans-serif;
  letter-spacing: .05em;
  font-size: 10px;
}
.w-cover:not(.compact) .w-guest strong {
  font: 500 21px var(--font-cormorant);
}
.w-cover:not(.compact) .w-open {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin: 7px 0 0;
  border: 1px solid var(--w-accent);
  border-radius: 100px;
  background: var(--w-ink);
  color: var(--w-card);
  padding: 15px 29px;
  font: 600 11px "Plus Jakarta Sans",sans-serif;
  letter-spacing: .08em;
  box-shadow: 0 7px 22px #0002;
}
.w-cover:not(.compact) .w-open:hover {
  transform: translateY(-3px);
}
.w-cover:not(.compact) .w-chapter {
  font: 500 10px "Plus Jakarta Sans",sans-serif;
  letter-spacing: .3em;
  color: var(--w-ink);
  opacity: .8;
  margin-bottom: 4px;
}
.w-cover:not(.compact) .w-watermark {
  position: absolute;
  inset: auto 0 45px;
  text-align: center;
  z-index: 2;
  font: 500 9px "Plus Jakarta Sans",sans-serif;
  letter-spacing: .4em;
  opacity: .6;
  color: var(--w-ink);
}
.w-cover:not(.compact) .w-ornamental {
  position: absolute;
  z-index: 3;
  pointer-events: none;
  inset: 40px;
  opacity: .68;
  border: 1px solid var(--w-outline);
}
.w-cover:not(.compact) .w-ornamental::before,.w-cover:not(.compact) .w-ornamental::after {
  content: "✦";
  position: absolute;
  left: -12px;
  top: 50%;
  color: var(--w-accent);
  font-size: 24px;
}
.w-cover:not(.compact) .w-ornamental::after {
  left: auto;
  right: -12px;
}
.w-cover:not(.compact) .couple-art {
  position: absolute;
  inset: auto 0 8%;
  width: 100%;
  height: 55%;
  object-fit: contain;
  opacity: .30;
  z-index: 1;
  pointer-events: none;
  filter: drop-shadow(0 8px 22px #0002);
}
.w-cover:not(.compact) .w-portrait-duo {
  position: absolute;
  z-index: 3;
  inset: 9% 0 auto;
  height: 32%;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  padding: 0 2%;
  pointer-events: none;
}
.w-cover:not(.compact) .w-portrait-duo img {
  width: 34%;
  height: 100%;
  object-fit: cover;
  mask-image: linear-gradient(to bottom,#000 65%,transparent 99%);
  -webkit-mask-image: linear-gradient(to bottom,#000 65%,transparent 99%);
  filter: grayscale(.18);
}
.w-cover:not(.compact) .w-portrait-duo .portrait-left {
  border-radius: 48% 48% 8% 8%;
  transform: rotate(-6deg);
}
.w-cover:not(.compact) .w-portrait-duo .portrait-right {
  border-radius: 48% 48% 8% 8%;
  transform: rotate(6deg);
}
/* Cards show the same theme composition scaled down to a real invitation poster */
.theme-card-art {
  height: 380px;
  padding: 10px;
  background: #f6f1ec;
}
.theme-card-art .w-cover {
  height: 100%!important;
  min-height: 0!important;
  border-radius: 160px 160px 5px 5px;
  overflow: hidden;
  isolation: isolate;
}
.w-cover.compact {
  background: var(--cover-art,none),var(--w-cover-bg);
  background-size: cover;
  background-position: center;
  position: relative;
}
.w-cover.compact::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,transparent 10%,color-mix(in srgb,var(--w-cover-bg) 34%,transparent) 65%,var(--w-cover-bg));
  pointer-events: none;
  z-index: 1;
}
.w-cover.compact .w-cover-center {
  position: relative;
  z-index: 3;
  padding: 40% 10px 10px;
  max-width: 100%;
}
.w-cover.compact .w-names {
  font: 500 clamp(31px,3vw,49px)/.92 var(--font-cormorant);
  letter-spacing: -.035em;
  display: flex;
  flex-direction: column;
  gap: 1px;
  color: var(--w-ink);
}
.w-cover.compact .w-names span {
  font: 24px var(--font-script);
  color: var(--w-accent);
}
.w-cover.compact .w-pretitle {
  font: 500 9px var(--font-classic);
  letter-spacing: .12em;
}
.w-cover.compact .w-subtitle {
  font: 600 7px "Plus Jakarta Sans",sans-serif;
  letter-spacing: .2em;
}
.w-cover.compact .w-date {
  font: 600 8px "Plus Jakarta Sans",sans-serif;
  letter-spacing: .08em;
}
.w-cover.compact .couple-art {
  z-index: 2;
  opacity: .36;
  position: absolute;
  height: 55%;
  width: 100%;
  object-fit: contain;
  bottom: 0;
}
.w-cover.compact .w-border-arch {
  position: absolute;
  inset: 12px;
  z-index: 2;
  border: 1px solid var(--w-outline);
  opacity: .75;
}
.w-cover.compact .w-watermark {
  position: absolute;
  bottom: 14px;
  left: 0;
  right: 0;
  text-align: center;
  z-index: 2;
  font-size: 8px;
  letter-spacing: .1em;
  opacity: .6;
}
.w-cover.compact .w-ornamental {
  display: none;
}
.w-cover.compact .w-chapter {
  font-size: 8px;
}
.w-cover.compact .w-portrait-duo {
  display: none;
}
/* Invitation is a crafted narrow editorial booklet, not administrative cards */
.w-page .w-contents {
  background: var(--w-card);
}
.w-contents .w-top {
  font-family: "Plus Jakarta Sans",sans-serif;
  justify-content: space-between;
  padding: 13px 20px;
  min-height: 52px;
}
.w-top strong {
  font: 500 20px var(--font-cormorant);
}
.w-scene {
  min-height: 700px;
  height: 90svh;
  max-height: 850px;
  position: relative;
  isolation: isolate;
}
.w-scene::before {
  inset: 19px 24px!important;
  border: 1px solid var(--w-outline)!important;
  opacity: .85!important;
}
.w-scene::after {
  inset: 29px 34px!important;
  opacity: .32!important;
}
.w-scene-art {
  inset: 0;
  background-size: cover!important;
  background-position: center!important;
  opacity: 1!important;
}
.w-scene-caption {
  z-index: 5;
  width: 80%;
  min-width: unset;
  max-width: 440px;
  padding: 50px 24px;
  box-shadow: 0 15px 60px #0002;
  gap: 16px;
}
.w-scene-caption strong {
  font: 500 clamp(47px,9vw,76px)/.9 var(--font-cormorant);
}
.w-scene-caption i {
  font: 50px var(--font-script);
  display: block;
}
.w-scene-caption span {
  font: 600 10px "Plus Jakarta Sans",sans-serif;
  letter-spacing: .22em;
}
.w-page .w-section {
  padding: 105px clamp(27px,7vw,65px);
  margin: 0;
  overflow: hidden;
  text-align: center;
}
.w-page .w-section h1,.w-page .w-section h2 {
  font-family: var(--font-cormorant);
  font-weight: 500;
  line-height: 1.03;
  letter-spacing: -.03em;
}
.w-page .w-section h1 {
  font-size: clamp(59px,9vw,78px);
}
.w-page .w-section h2 {
  font-size: clamp(49px,8vw,66px);
}
.w-section h2::after {
  content: "❦"!important;
  font: 26px var(--font-cormorant)!important;
  display: block;
  margin: 20px auto!important;
  letter-spacing: 0;
  color: var(--w-accent);
}
.w-page .w-section p {
  font-size: 14px;
  line-height: 2.05;
  max-width: 430px;
  margin-left: auto;
  margin-right: auto;
}
.w-page .w-eyebrow {
  font: 600 10px "Plus Jakarta Sans",sans-serif;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--w-accent);
}
.w-page .w-intro {
  padding-block: 128px 130px;
  background: var(--w-card);
  border-top: 1px solid color-mix(in srgb,var(--w-outline) 60%,transparent);
}
.w-intro .w-lettermark {
  font: italic 112px/.7 var(--font-script);
  color: var(--w-accent);
  margin: 0 0 36px;
  opacity: .85;
}
.w-intro .w-section-lead {
  font: italic 22px/1.7 var(--font-cormorant);
  margin-bottom: 25px;
}
.w-page .w-orn {
  margin-top: 32px;
  color: var(--w-accent);
}
.w-page .w-couple {
  background: color-mix(in srgb,var(--w-cover-bg) 62%,var(--w-card));
  padding-block: 98px 116px;
}
.w-page .w-people {
  grid-template-columns: 1fr 21px 1fr;
  gap: 9px;
  align-items: start;
  max-width: 520px;
  margin: 45px auto 25px;
}
.w-page .w-people article {
  min-width: 0;
}
.w-people article img,.w-person-placeholder {
  width: 100%;
  aspect-ratio: 3/4;
  height: auto;
  max-height: 260px;
  object-fit: cover;
  border-radius: 48% 48% 4px 4px;
  border: 4px solid var(--w-card);
  outline: 1px solid var(--w-outline);
  box-shadow: 0 15px 30px #0001;
}
.w-people h3 {
  font: 500 clamp(26px,5vw,37px)/1.1 var(--font-cormorant);
  margin: 20px 0 8px;
}
.w-people article p {
  font-size: 12px!important;
  line-height: 1.6!important;
}
.w-ampersand {
  font: 44px var(--font-script);
  margin-top: 75px;
  color: var(--w-accent);
}
.w-person-placeholder {
  display: grid;
  place-items: center;
  background: linear-gradient(145deg,var(--w-card),var(--w-cover-bg));
  font-size: 70px;
  color: var(--w-accent);
}
.w-page .w-couple blockquote {
  font: italic 24px/1.55 var(--font-cormorant);
  max-width: 420px;
  margin: 46px auto 0;
  border-top: 1px solid var(--w-outline);
  padding-top: 25px;
}
.w-page .w-countdown {
  background: var(--w-ink);
  color: var(--w-card);
  padding-block: 82px 110px;
}
.w-countdown .w-eyebrow {
  color: var(--w-accent);
}
.w-page .count-numbers {
  margin: 43px auto 0;
  max-width: 430px;
  gap: 12px;
}
.w-page .count-numbers>div {
  border-radius: 0;
  border: 1px solid color-mix(in srgb,var(--w-card) 36%,transparent);
  background: transparent;
  padding: 13px 7px;
}
.w-page .count-numbers b {
  font: 500 38px var(--font-cormorant);
}
.w-page .count-numbers span {
  font: 500 9px "Plus Jakarta Sans",sans-serif;
  letter-spacing: .16em;
}
.w-page .w-events {
  background: var(--w-card);
  padding-block: 110px;
}
.w-page .w-events-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin: 40px auto 0;
}
.w-page .w-event {
  border: 1px solid var(--w-outline);
  border-radius: 130px 130px 0 0;
  min-height: 360px;
  padding: 75px 16px 32px;
  box-shadow: none;
  background: color-mix(in srgb,var(--w-cover-bg) 19%,var(--w-card));
}
.w-page .w-event h3 {
  font: 500 33px var(--font-cormorant);
}
.w-page .w-event a {
  font-size: 11px;
}
.w-page .w-story {
  background: color-mix(in srgb,var(--w-cover-bg) 80%,var(--w-card));
  padding-block: 140px;
}
.w-page .w-story p {
  font: italic 23px/1.85 var(--font-cormorant);
  max-width: 370px;
}
.w-page .w-gallery {
  background: var(--w-card);
  padding-block: 100px;
}
.w-page .w-photos {
  grid-template-columns: repeat(2,1fr);
  gap: 10px;
  margin-top: 33px;
}
.w-page .w-photos img {
  aspect-ratio: 4/5;
  object-fit: cover;
  border-radius: 2px;
  width: 100%;
  box-shadow: none;
}
.w-page .w-photos img:first-child {
  grid-column: 1/-1;
  aspect-ratio: 4/3;
}
.w-page .w-rsvp {
  background: color-mix(in srgb,var(--w-cover-bg) 38%,var(--w-card));
  padding-block: 110px;
}
.w-page .w-gifts {
  background: var(--w-card);
  padding-block: 110px;
}
.w-page .w-gift-list {
  display: grid;
  grid-template-columns: 1fr;
  max-width: 420px;
  margin: 36px auto 0;
  gap: 12px;
}
.w-page .w-gift {
  background: color-mix(in srgb,var(--w-cover-bg) 28%,var(--w-card));
  border: 1px solid var(--w-outline);
  box-shadow: none;
  border-radius: 3px;
}
.w-page .w-wishes {
  background: color-mix(in srgb,var(--w-cover-bg) 36%,var(--w-card));
  padding-block: 110px;
}
.w-page .w-end {
  min-height: 550px;
  padding-block: 160px!important;
  background: var(--cover-art,none),var(--w-cover-bg);
  background-size: cover;
  color: var(--w-ink);
}
.w-page .w-end h2 {
  font-family: var(--font-script);
  font-size: 67px;
}
.w-page .w-quick-nav {
  background: color-mix(in srgb,var(--w-card) 96%,transparent);
  padding: 4px 12px;
  bottom: 18px;
  z-index: 25;
  border-radius: 38px;
}
.w-page .w-footer {
  text-align: center;
  padding: 30px 14px 85px;
}
.w-section .w-button,.w-section .w-ghost {
  border-radius: 40px;
  padding: 13px 21px;
}
/* DIFFERENT CREATIVE DIRECTIONS — traditions are designed with local ornaments; modern editions with their own editorial structure */

.theme-rama-sinta .w-cover:not(.compact) .w-border-arch {
  border: 4px double #ad8d54;
  border-radius: 50% 50% 8px 8px;
}
.theme-rama-sinta .w-cover:not(.compact) .w-pretitle {
  font-family: var(--font-classic);
  font-size: 13px;
}
.theme-rama-sinta .w-cover:not(.compact) .w-names {
  font-family: var(--font-cormorant);
  font-size: 64px;
}
.theme-rama-sinta .w-cover:not(.compact) .couple-art {
  opacity: .52;
  height: 58%;
  bottom: 1%;
  filter: sepia(1) drop-shadow(1px 5px 1px #0009);
}
.theme-rama-sinta .w-section:not(.w-countdown):not(.w-end) {
  --w-ink: #5b351c;
}
.theme-rama-sinta .w-scene-caption {
  background: #25180bcf;
  border: 3px double #d2ac66;
  color: #f6dfa9;
}
.theme-rama-sinta .w-scene-caption strong {
  font-family: var(--font-cormorant);
}
.theme-rama-sinta .w-events .w-event {
  border: 3px double #b58e55;
  border-radius: 140px 140px 8px 8px;
}

.theme-keraton .w-cover:not(.compact) .w-border-arch {
  inset: 14px 34px;
  border: 8px double #d5b27d;
  border-radius: 47% 47% 2px 2px;
}
.theme-keraton .w-cover:not(.compact) .couple-art {
  opacity: .39;
  height: 56%;
}
.theme-keraton .w-scene-caption {
  border: 6px double #ae8656;
  background: #f4e5d9c9;
  color: #63412e;
  border-radius: 190px 190px 3px 3px;
}
.theme-keraton .w-section:not(.w-countdown):not(.w-end) {
  --w-ink: #63412e;
}
.theme-keraton .w-story:before {
  content: "ꦗꦮ";
  position: absolute;
  top: 19px;
  left: 0;
  right: 0;
  font-size: 90px;
  opacity: .09;
  color: #784d33;
}

.theme-minang .w-cover:not(.compact) .w-border-arch {
  border: 4px double #d6ac65;
  clip-path: polygon(0 18%,20% 18%,36% 1%,50% 13%,64% 1%,80% 18%,100% 18%,100% 100%,0 100%);
}
.theme-minang .w-cover:not(.compact) .w-names {
  font-family: var(--font-cormorant);
  font-weight: 600;
}
.theme-minang .w-section:not(.w-countdown):not(.w-end) {
  --w-ink: #5a2631;
}
.theme-minang .w-scene-caption {
  background: #4e1425df;
  border: 4px double #d29e5c;
  color: #ffe8ba;
}
.theme-minang .w-event {
  border-color: #d7a970!important;
}

.theme-bali .w-cover:not(.compact) .w-border-arch {
  border: 3px double #bd8e58;
  clip-path: polygon(0 0,48% 0,50% 3%,52% 0,100% 0,100% 100%,0 100%);
}
.theme-bali .w-cover:not(.compact) .couple-art {
  opacity: .38;
}
.theme-bali .w-section:not(.w-countdown):not(.w-end) {
  --w-ink: #65402a;
}
.theme-bali .w-scene-caption {
  background: #3c271cce;
  border: 5px double #c49459;
  color: #f7dcb6;
}

.theme-floral .w-cover:not(.compact) .w-border-arch {
  border: 2px solid #dfb4ad;
  border-radius: 48% 48% 2px 2px;
}
.theme-floral .w-cover:not(.compact) .w-names {
  font: 400 75px/.82 var(--font-script);
  padding: 11px 0;
}
.theme-floral .w-cover:not(.compact) .w-names span {
  font-family: var(--font-cormorant);
  font-size: 35px;
}
.theme-floral .w-cover:not(.compact) .couple-art {
  opacity: .2;
}
.theme-floral .w-scene-caption {
  background: #fffaf2de;
  border: 2px solid #c99a9f;
  border-radius: 230px 230px 2px 2px;
}
.theme-floral .w-scene-caption strong {
  font-family: var(--font-script);
  font-size: 70px;
}
.theme-floral .w-couple {
  background: #f8e9e6;
}

.theme-sage .w-cover:not(.compact) .w-border-arch {
  border: 1px solid #6e8c73;
  border-radius: 200px 200px 0 0;
}
.theme-sage .w-cover:not(.compact) .w-names {
  font-size: 82px;
  font-weight: 400;
}
.theme-sage .w-cover:not(.compact) .couple-art {
  opacity: .15;
}
.theme-sage .w-scene-caption {
  border-radius: 180px 180px 8px 8px;
  background: #fffff1c7;
}
.theme-sage .w-intro,.theme-sage .w-gallery {
  background: linear-gradient(145deg,#fffff7,#ebf1e5);
}

.theme-sakura .w-cover:not(.compact) .w-border-arch {
  border: 1px solid #d895ab;
  border-radius: 50% 50% 50% 50%;
}
.theme-sakura .w-cover:not(.compact) .w-names {
  font: 400 79px/.84 var(--font-script);
}
.theme-sakura .w-cover:not(.compact) .couple-art {
  opacity: .12;
}
.theme-sakura .w-scene-caption {
  border-radius: 50%;
  aspect-ratio: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background: #fff7f8db;
}

.theme-navy .w-cover:not(.compact) .w-border-arch {
  border: 4px double #d0ae78;
  border-radius: 150px 150px 0 0;
}
.theme-navy .w-cover:not(.compact) .w-pretitle,.theme-navy .w-cover:not(.compact) .w-date {
  font-family: var(--font-classic);
}
.theme-navy .w-cover:not(.compact) .couple-art {
  opacity: .25;
}
.theme-navy .w-scene-caption {
  background: #092441ea;
  border: 3px double #dfc18c;
  color: #ffeac3;
}
.theme-navy .w-section:not(.w-countdown):not(.w-end) {
  --w-ink: #243650;
}
.theme-navy .w-events .w-event {
  border: 3px double #cab383;
}

.theme-minimal .w-cover:not(.compact) .w-border-arch {
  border: none;
  border-left: 1px solid #a7a091;
  border-right: 1px solid #a7a091;
  inset: 20px 35px;
}
.theme-minimal .w-cover:not(.compact) .w-names {
  font-family: var(--font-marcellus);
  font-size: 52px;
  line-height: 1.18;
  letter-spacing: -.06em;
  text-transform: uppercase;
}
.theme-minimal .w-cover:not(.compact) .w-names span {
  font: italic 26px var(--font-cormorant);
}
.theme-minimal .w-cover:not(.compact) .w-open {
  border-radius: 0;
}
.theme-minimal .w-cover:not(.compact) .couple-art {
  opacity: .07;
}
.theme-minimal .w-scene-caption {
  background: #fffcf4ed;
  border: 1px solid #b6b0a4;
}
.theme-minimal .w-scene-caption strong {
  font-family: var(--font-marcellus);
  font-size: 48px;
}
.theme-minimal .w-section h1,.theme-minimal .w-section h2 {
  font-family: var(--font-marcellus);
  font-size: 48px;
}
.theme-minimal .w-event {
  border-radius: 0;
}

.theme-rustic .w-cover:not(.compact) .w-border-arch {
  border: 2px solid #bd956d;
  clip-path: polygon(0 0,100% 0,100% 100%,0 100%);
}
.theme-rustic .w-cover:not(.compact) .w-names {
  font: 400 74px/.82 var(--font-script);
}
.theme-rustic .w-scene-caption {
  background: #38271de8;
  border: 1px solid #d2b08c;
  color: #fde3c5;
}
.theme-rustic .w-section:not(.w-countdown):not(.w-end) {
  --w-ink: #58412d;
}
.theme-rustic .w-events .w-event {
  border-radius: 0;
  border: 1px dashed #b18e68;
}
/* Secondary assets for scene continuity and fallback */










@media(max-width:600px) {
  body.invite-mode #app {
    background: var(--w-card);
  }
  .w-cover:not(.compact) {
    padding: 20px 15px 18px;
  }
  .w-cover:not(.compact) .w-border-arch {
    inset: 18px;
  }
  .w-cover:not(.compact) .w-ornamental {
    inset: 27px;
  }
  .w-cover:not(.compact) .w-cover-center {
    max-width: 100%;
    gap: 13px;
    padding: 33px 16px 13px;
  }
  .w-cover:not(.compact) .w-names {
    font-size: clamp(55px,14vw,76px);
  }
  .w-cover:not(.compact) .w-portrait-duo {
    height: 29%;
    top: 9%;
  }
  .w-cover:not(.compact) .w-portrait-duo img {
    width: 35%;
  }
  .w-cover:not(.compact) .couple-art {
    height: 47%;
    opacity: .2;
  }
  .w-cover:not(.compact) .w-watermark {
    bottom: 34px;
  }
  .w-page .w-section {
    padding: 86px 23px;
  }
  .w-page .w-section h1 {
    font-size: 58px;
  }
  .w-page .w-section h2 {
    font-size: 50px;
  }
  .w-page .w-events-grid {
    grid-template-columns: 1fr;
    gap: 15px;
    max-width: 340px;
  }
  .w-page .w-event {
    min-height: 0;
    padding: 65px 20px 35px;
  }
  .w-page .w-people {
    gap: 4px;
  }
  .w-page .w-people h3 {
    font-size: 27px;
  }
  .w-ampersand {
    font-size: 32px;
    margin-top: 70px;
  }
  .w-scene {
    min-height: 600px;
    height: 90svh;
  }
  .w-scene-caption {
    width: 84%;
    padding: 40px 19px;
    gap: 13px;
  }
  .w-scene-caption strong {
    font-size: clamp(44px,10vw,60px);
  }
  .w-cover.compact .w-names {
    font-size: 37px;
  }
  .w-page .count-numbers b {
    font-size: 33px;
  }
}
@media(max-width:390px) {
  .w-cover:not(.compact) .w-cover-center {
    gap: 11px;
  }
  .w-cover:not(.compact) .w-names {
    font-size: 54px;
  }
  .w-cover:not(.compact) .w-guest {
    padding: 9px;
  }
  .w-page .w-people {
    grid-template-columns: 1fr 16px 1fr;
  }
  .w-ampersand {
    font-size: 27px;
  }
  .w-page .w-section {
    padding: 70px 19px;
  }
  .w-page .w-section h2 {
    font-size: 43px;
  }
}
@media(prefers-reduced-motion:reduce) {
  .w-page *,.w-page *::before,.w-page *::after {
    animation: none!important;
    transition: none!important;
    scroll-behavior: auto!important;
  }
}
/* R8 final fixes: names vs ampersand, preview banner */
.w-cover:not(.compact) .w-names>.w-firstname,.w-cover:not(.compact) .w-names>.w-secondname {
  display: block;
  font: inherit;
  letter-spacing: inherit;
  margin: 0;
  color: inherit;
  max-width: 100%;
  overflow-wrap: anywhere;
}
.w-cover:not(.compact) .w-names>span:nth-child(2) {
  font: 400 39px var(--font-script);
  letter-spacing: 0;
  color: var(--w-accent);
  margin: 3px 0;
}
.w-cover.compact .w-names>.w-firstname,.w-cover.compact .w-names>.w-secondname {
  display: block;
  font: inherit;
  letter-spacing: inherit;
  margin: 0;
  color: inherit;
  max-width: 100%;
  overflow-wrap: anywhere;
}
.w-cover.compact .w-names>span:nth-child(2) {
  font: 23px var(--font-script);
  color: var(--w-accent);
}
.w-page .w-contents .w-section:not(.w-countdown):not(.w-end) {
  color: var(--w-ink);
}
.w-page .w-scene-caption strong i {
  font-style: normal;
}
.demo-information {
  position: fixed;
  top: 8px;
  left: 50%;
  right: auto;
  transform: translateX(-50%);
  max-width: min(95%,570px);
  width: max-content;
  z-index: 70;
  background: #fffaf5ee;
  backdrop-filter: blur(10px);
  border-radius: 9px;
  border: 1px solid #e2cebd;
  padding: 8px 12px;
  display: flex;
  align-items: center;
  gap: 10px;
  text-align: center;
  box-shadow: 0 10px 30px #0001;
}
.demo-information strong {
  font: 700 9px "Plus Jakarta Sans",sans-serif;
  white-space: nowrap;
}
.demo-information span {
  font: 400 9px/1.35 "Plus Jakarta Sans",sans-serif;
}
@media(max-width:500px) {
  .demo-information {
    top: 4px;
    width: 95%;
    max-width: none;
    display: block;
    padding: 5px 7px;
  }
  .demo-information strong {
    display: inline;
    font-size: 8px;
  }
  .demo-information span {
    display: none;
  }
}
/* R8 bespoke original vector artwork for every edition. */




















/* Kawinku V1 R11: cover artwork, typography and welcoming guestbook */


/* Discard crude line-drawn cartoon couples; use scene-specific premium decorative backgrounds instead. */
.couple-art {
  display: none!important;
}
.theme-rama-sinta .w-cover:not(.compact) .w-cover-center,
.theme-keraton .w-cover:not(.compact) .w-cover-center {
  padding-top: 31vh;
  justify-content: flex-end;
  gap: 11px;
}
.theme-rama-sinta .w-cover:not(.compact) .w-names,
.theme-keraton .w-cover:not(.compact) .w-names {
  font-size: clamp(47px,8vw,70px);
  text-shadow: 0 4px 18px #140c09,0 1px 5px #140c09;
}
.theme-rama-sinta .w-cover:not(.compact) .w-guest,
.theme-keraton .w-cover:not(.compact) .w-guest {
  background: #29190fc2;
  color: #fff3d2;
  border: 1px solid #e7c69480;
}
.theme-rama-sinta .w-cover.compact .w-cover-center,
.theme-keraton .w-cover.compact .w-cover-center {
  padding-top: 59%;
  text-shadow: 0 3px 8px #160d0c;
}
.theme-rama-sinta .w-cover.compact .w-names,
.theme-keraton .w-cover.compact .w-names {
  color: #fff1c6;
}
.theme-rama-sinta .w-cover.compact,
.theme-keraton .w-cover.compact {
  background-size: cover;
  background-position: center;
}
/* Refined individual theme treatment for non-adat layouts */
.theme-floral .w-cover-center,.theme-sakura .w-cover-center {
  font-family: var(--font-cormorant);
}
.theme-minimal .w-cover .w-border-arch {
  border-radius: 2px;
  border-width: 1px;
}
.theme-navy .w-cover .w-border-arch {
  border: 2px double #e1b66e;
  border-radius: 45% 45% 0 0;
}
.theme-rustic .w-cover .w-border-arch {
  border: 1px solid #d0a674;
  border-radius: 45% 45% 6px 6px;
}
.w-wishes {
  background: radial-gradient(circle at 10% 0%,color-mix(in srgb,var(--w-outline) 12%,transparent),transparent 42%),var(--w-card)!important;
}
.w-wishes .wish-intro {
  max-width: 380px;
  margin: 0 auto 30px;
  font-size: 14px;
  line-height: 1.8;
}
.w-wishes .wish-shell {
  display: grid;
  gap: 22px;
  width: min(100%,660px);
  margin: 0 auto;
  text-align: left;
}
.w-wishes .wish-editor,.w-wishes .wish-feed {
  background: color-mix(in srgb,var(--w-card) 86%,white);
  border: 1px solid var(--w-outline);
  padding: 28px;
  border-radius: 17px;
  box-shadow: 0 14px 38px #28201810;
}
.w-wishes .wish-editor {
  text-align: center;
}
.w-wishes .wish-icon {
  font-size: 27px;
  color: var(--w-accent);
}
.w-wishes .wish-editor h3 {
  font: 35px/1.2 var(--font-cormorant);
  margin: 0 0 10px;
}
.w-wishes #guestbook-form,.w-wishes #wish-form-preview {
  display: grid;
  gap: 14px;
  text-align: left;
  margin: 14px 0 0;
  max-width: none;
}
.w-wishes #guestbook-form label,.w-wishes #wish-form-preview label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font: 600 12px var(--sans);
  color: var(--w-ink);
}
.w-wishes #guestbook-form input,.w-wishes #guestbook-form textarea,.w-wishes #wish-form-preview input,.w-wishes #wish-form-preview textarea {
  width: 100%;
  padding: 15px;
  background: #ffffffd4;
  border: 1px solid var(--w-outline);
  border-radius: 8px;
  color: #28232a;
  outline: none;
  font: 14px/1.6 var(--sans);
}
.w-wishes #guestbook-form input:focus,.w-wishes #guestbook-form textarea:focus {
  outline: 2px solid var(--w-accent);
  outline-offset: 2px;
}
.w-wishes #guestbook-form textarea {
  min-height: 140px;
  resize: vertical;
}
.w-wishes .wish-form-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  margin-top: 3px;
}
.w-wishes .wish-form-bottom small {
  font: 11px var(--sans);
  opacity: .7;
}
.w-wishes .wish-form-bottom .w-button {
  margin: 0;
}
.w-wishes .gb-honeypot {
  position: absolute!important;
  left: -9999px!important;
  top: -9999px!important;
}
.w-wishes .wish-feed-heading {
  display: flex;
  gap: 15px;
  align-items: center;
  margin-bottom: 19px;
}
.w-wishes .wish-feed-heading>span {
  width: 45px;
  height: 45px;
  border-radius: 50%;
  border: 1px solid var(--w-outline);
  display: grid;
  place-items: center;
  font-size: 24px;
}
.w-wishes .wish-feed-heading h3 {
  font: 30px var(--font-cormorant);
  margin: 0;
}
.w-wishes .wish-feed-heading p {
  font: 12px var(--sans);
  margin: 3px 0;
}
.w-wishes .w-wishes-list {
  max-height: 540px;
  overflow-y: auto;
  margin: 0;
}
.w-wishes .guestbook-card {
  border: 1px solid var(--w-outline);
  border-radius: 11px;
  margin: 0 0 11px;
  background: #ffffffa8;
  padding: 17px;
  display: flex;
  gap: 13px;
  align-items: flex-start;
}
.w-wishes .wish-avatar {
  width: 35px;
  height: 35px;
  flex-shrink: 0;
  border-radius: 50%;
  background: var(--w-ink);
  color: var(--w-card);
  display: grid;
  place-items: center;
  font: 20px var(--font-cormorant);
}
.w-wishes .wish-content {
  min-width: 0;
  flex: 1;
}
.w-wishes .wish-author {
  display: flex;
  gap: 10px;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
}
.w-wishes .wish-author strong {
  font: 600 13px var(--sans);
}
.w-wishes .wish-author time {
  font: 10px var(--sans);
  opacity: .65;
}
.w-wishes .wish-content p {
  font: 13px/1.7 var(--sans);
  margin: 8px 0 0;
  overflow-wrap: anywhere;
  white-space: pre-line;
}
.w-wishes .guestbook-empty {
  text-align: center;
  padding: 22px 15px;
  opacity: .72;
}
.w-wishes .guestbook-empty span {
  font-size: 35px;
}
.w-wishes .guestbook-empty p {
  font: 13px/1.7 var(--sans);
  margin: 12px auto;
}
.comment-moderation {
  display: grid;
  gap: 15px;
}
.comment-moderation-card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 20px;
  display: flex;
  justify-content: space-between;
  gap: 20px;
}
.comment-moderation-card strong {
  font-size: 15px;
}
.comment-moderation-card p {
  white-space: pre-line;
  overflow-wrap: anywhere;
}
.comment-moderation-card small {
  opacity: .7;
}
.comment-buttons {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  align-self: center;
}
@media(max-width:600px) {
  .w-wishes .wish-editor,.w-wishes .wish-feed {
    padding: 20px 15px;
  }
  .w-wishes .wish-form-bottom {
    flex-direction: column;
    align-items: stretch;
  }
  .w-wishes .wish-form-bottom .w-button {
    width: 100%;
  }
  .comment-moderation-card {
    flex-direction: column;
  }
  .theme-rama-sinta .w-cover:not(.compact) .w-cover-center,.theme-keraton .w-cover:not(.compact) .w-cover-center {
    padding-top: 25vh;
    padding-bottom: 17px;
  }
  .theme-rama-sinta .w-cover:not(.compact) .w-names,.theme-keraton .w-cover:not(.compact) .w-names {
    font-size: clamp(40px,11vw,57px);
  }
}
/* Public invitation share tool: accessible without authentication. */
.share-public {
  min-height: 65vh;
  display: grid;
  place-items: center;
  padding: 88px 0;
}
.share-panel {
  background: #fffaf6;
  border: 1px solid #e8d7c7;
  box-shadow: 0 28px 70px #42241e17;
  border-radius: 28px;
  padding: clamp(24px,5vw,55px);
  max-width: 740px;
  width: 100%;
  text-align: center;
}
.share-panel h1 {
  font-family: var(--display),Georgia,serif;
  font-weight: 400;
  font-size: clamp(35px,5vw,58px);
  margin: 12px 0;
}
.share-panel>p {
  color: #706575;
  max-width: 540px;
  margin: 0 auto 24px;
}
.share-panel form {
  text-align: left;
  display: grid;
  gap: 16px;
  margin: 28px auto 24px;
}
.share-panel form .btn {
  justify-self: center;
}
.share-output {
  text-align: left;
  border-top: 1px solid #e6d7c9;
  padding-top: 22px;
  display: grid;
  gap: 16px;
}
.share-output[hidden] {
  display: none;
}
.share-output textarea {
  resize: vertical;
  width: 100%;
  background: #fff;
  border: 1px solid #ded0c0;
  padding: 13px;
  border-radius: 12px;
  color: #312b33;
  line-height: 1.7;
  white-space: pre-wrap;
}
.share-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  justify-content: center;
}
.share-panel .share-privacy {
  font-size: 12px;
  margin: 19px auto 0;
  color: #746f6d;
}
@media(max-width:570px) {
  .share-public {
    padding: 44px 0;
  }
  .share-panel {
    border-radius: 20px;
  }
  .share-actions .btn {
    flex: 1 1 100%;
  }
}
/* Studio media manager — upload-first, no external URL field */
.photo-slot {
  border: 1px solid var(--line);
  background: #fffdfb;
  border-radius: 16px;
  padding: 16px;
  margin: 13px 0;
  display: grid;
  gap: 10px;
}
.photo-slot-top {
  display: flex;
  align-items: center;
  gap: 14px;
  justify-content: space-between;
}
.photo-slot-top img {
  width: 88px;
  height: 76px;
  object-fit: cover;
  border-radius: 10px;
  border: 1px solid #ddd;
}
.media-upload {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  align-items: center;
}
.media-upload input[type=file] {
  flex: 1;
  min-width: 180px;
  max-width: 100%;
  border: 1px dashed #d3aaa6;
  padding: 12px;
  border-radius: 10px;
  background: #fff;
}
.photo-remove {
  justify-self: start;
  border: 0;
  background: transparent;
  color: #a04448;
  text-decoration: underline;
  padding: 4px 0;
}
.gallery-manager {
  display: grid;
  grid-template-columns: repeat(auto-fill,minmax(120px,1fr));
  gap: 10px;
  margin-top: 14px;
}
.gallery-item {
  min-width: 0;
  background: #fff;
  border: 1px solid #ecded7;
  border-radius: 12px;
  padding: 6px;
}
.gallery-item img {
  height: 122px;
  width: 100%;
  object-fit: cover;
  border-radius: 8px;
}
.gallery-tools {
  display: flex;
  gap: 3px;
  margin-top: 6px;
}
.gallery-tools button {
  padding: 6px;
  border-radius: 6px;
  border: 1px solid #e4d7ce;
  background: #fff;
  flex: 1;
  font-size: 11px;
}
.gallery-tools button:last-child {
  flex: 2;
  color: #9e3333;
}
.media-help {
  display: block;
  color: var(--ink-soft);
  padding-top: 7px;
}
.gallery-empty {
  color: var(--ink-soft);
  font-size: 13px;
}
.contact-box a {
  font-weight: 600;
  color: var(--pink-dark);
  overflow-wrap: anywhere;
}
@media(max-width:550px) {
  .media-upload {
    flex-direction: column;
    align-items: stretch;
  }
  .media-upload input {
    width: 100%;
  }
}
/* Kawinku — refined public-facing interface */
:root {
  --accent-deep: #854b55;
  --accent-soft: #f7eeeb;
  --shadow-soft: 0 16px 42px rgba(44,34,40,.075);
}
html {
  scroll-padding-top: 94px;
}
body {
  min-width: 320px;
}
:where(a,button,input,select,textarea):focus-visible {
  outline: 3px solid #ba8990;
  outline-offset: 3px;
}
::selection {
  background: #ead0d0;
  color: #5d3540;
}
.nav {
  box-shadow: 0 5px 20px rgba(75,49,54,.035);
}
.nav-inner {
  gap: 24px;
}
.nav-links {
  gap: 21px;
}
.nav-links a {
  position: relative;
  padding: 8px 0;
  transition: color .2s;
}
.nav-links a:after {
  content: "";
  position: absolute;
  bottom: 3px;
  left: 0;
  right: 100%;
  height: 1px;
  background: var(--pink);
  transition: right .2s;
}
.nav-links a:hover:after,.nav-links a:focus-visible:after {
  right: 0;
}
.btn {
  font-size: 12px;
  letter-spacing: .005em;
}
.btn:hover {
  box-shadow: 0 9px 23px rgba(124,67,72,.1);
}
.theme-card,.feature,.auth-card,.dash-panel,.new-invite {
  box-shadow: var(--shadow-soft);
}
.theme-card {
  transition: transform .25s,box-shadow .25s;
}
.theme-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 21px 55px rgba(77,49,53,.12);
}
.theme-card .theme-card-art {
  background: linear-gradient(150deg,#f9f2ec,#efe6df);
}
.hero-copy>p {
  max-width: 515px;
}
.hero-note {
  font-weight: 600;
}
.legal-page .back-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.legal-content {
  max-width: 900px;
}
.legal-content a:not(.contact-item) {
  font-weight: 700;
  color: var(--pink-dark);
  text-decoration: underline;
  text-decoration-color: #c6a6ab;
  text-underline-offset: 3px;
  overflow-wrap: anywhere;
}
.legal-content a:not(.contact-item):hover {
  color: #633943;
}
.footer {
  background: linear-gradient(145deg,#1e293d,#232c40 62%,#302b3c);
  border-top: 1px solid rgba(255,255,255,.07);
}
.footer-grid {
  grid-template-columns: minmax(230px,2fr) minmax(125px,.9fr) minmax(154px,1.05fr) minmax(260px,1.7fr);
  gap: clamp(22px,3vw,46px);
}
.footer .brand {
  width: max-content;
}
.footer-column>a {
  width: max-content;
  max-width: 100%;
  transition: color .18s,transform .18s;
}
.footer-column>a:hover {
  transform: translateX(3px);
}
.footer h4 {
  font-size: 13px;
  color: #f7f0ed;
  letter-spacing: .01em;
}
.footer-contact-intro {
  max-width: 265px;
  margin: -1px 0 13px!important;
  color: #b6bfcd!important;
}
.footer .footer-contact a.contact-item,.contact-item {
  display: flex;
  align-items: center;
  gap: 11px;
  min-height: 40px;
  white-space: normal;
  text-align: left;
}
.footer .footer-contact a.contact-item {
  padding: 6px 0;
  margin: 0 0 5px;
  color: #d5dae2;
  font-size: 12px;
  font-weight: 500;
}
.footer .footer-contact a.contact-item:hover {
  color: white;
}
.contact-icon {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  display: inline-grid;
  place-items: center;
  border-radius: 11px;
  background: #f5e6e5;
  color: #925b63;
  transition: transform .2s,background .2s;
}
.footer .contact-icon {
  background: rgba(255,255,255,.1);
  color: #e9d2d3;
}
.contact-whatsapp .contact-icon {
  background: #e1f5e8;
  color: #147b48;
}
.footer .contact-whatsapp .contact-icon {
  background: rgba(37,211,102,.17);
  color: #6ce09b;
}
.contact-item:hover .contact-icon {
  transform: translateY(-2px);
}
.contact-meta {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: 2px;
  overflow-wrap: anywhere;
}
.contact-meta>span {
  overflow-wrap: anywhere;
}
.contact-meta small {
  font-size: 11px;
  color: #8a7075;
  font-weight: 700;
}
.contact-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 16px;
  margin: 24px 0 35px;
}
.contact-grid .contact-card,.legal-content .contact-card {
  border: 1px solid #ebddd9;
  border-radius: 16px;
  padding: 18px 19px;
  background: #fffdfb;
  box-shadow: 0 9px 30px rgba(69,48,53,.045);
  transition: border-color .18s,box-shadow .18s,transform .18s;
}
.contact-grid .contact-card:hover,.legal-content .contact-card:hover {
  border-color: #c8a4a1;
  box-shadow: 0 14px 35px rgba(69,48,53,.1);
  transform: translateY(-2px);
}
.contact-card .contact-icon {
  width: 48px;
  height: 48px;
  flex-basis: 48px;
  border-radius: 15px;
}
.contact-card .contact-icon svg {
  width: 23px;
  height: 23px;
}
.contact-card .contact-meta {
  flex: 1;
}
.contact-card .contact-meta>span {
  font-size: 14px;
  color: #373545;
  font-weight: 750;
}
.contact-card .contact-direction {
  display: grid;
  place-items: center;
  color: #977b7d;
  flex: 0 0 20px;
}
.contact-card .contact-direction svg {
  width: 17px;
  height: 17px;
}
.contact-intro {
  padding-bottom: 4px;
  max-width: 720px;
}
.contact-intro h2 {
  font: clamp(28px,3.2vw,39px)/1.2 var(--display);
  margin: 10px 0;
}
.contact-intro p,.contact-guidance p {
  color: #6b6572;
  line-height: 1.9;
}
.contact-box .contact-card {
  max-width: 480px;
  margin-top: 14px;
}
.contact-guidance {
  border-top: 1px solid #e9deda;
  margin-top: 24px;
}
.contact-guidance h2 {
  font-size: 19px;
}
.footer-bottom {
  align-items: center;
}
.nav-actions .btn {
  transition: background .2s,box-shadow .2s,transform .2s;
}
@media(max-width:1130px) {
  .footer-grid {
    grid-template-columns: 1.4fr 1fr 1fr;
    row-gap: 32px;
  }
  .footer-contact {
    grid-column: span 3;
  }
  .footer-contact-intro {
    max-width: none;
  }
  .footer-contact {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 5px 26px;
  }
  .footer-contact h4,.footer-contact p {
    grid-column: 1/-1;
  }
}
@media(max-width:980px) {
  .nav-inner {
    gap: 12px;
  }
  .nav-links {
    gap: 10px;
  }
  .nav-links a {
    font-size: 11px;
  }
  .nav-actions .btn {
    padding: 9px 13px;
  }
}
@media(max-width:800px) {
  .nav-links {
    z-index: 31;
    border-bottom: 1px solid #eee4df;
    gap: 12px;
    max-height: min(70vh,450px);
    overflow-y: auto;
  }
  .nav-links a {
    font-size: 14px;
    padding: 9px 7px;
  }
  .nav-links a:after {
    display: none;
  }
  .menu-toggle {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border: 1px solid #e9d9d4;
    border-radius: 10px;
  }
  .nav-actions>.btn-outline {
    display: none;
  }
  .footer-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 30px;
  }
  .footer-brand {
    grid-column: 1/-1;
  }
  .footer-brand p {
    max-width: 500px;
  }
  .footer-contact {
    grid-column: 1/-1;
  }
}
@media(max-width:580px) {
  .footer {
    padding-top: 40px;
  }
  .footer-grid {
    gap: 27px 18px;
  }
  .footer-column {
    min-width: 0;
  }
  .footer-column>a {
    line-height: 1.5;
  }
  .footer-contact {
    grid-template-columns: 1fr;
    gap: 4px;
  }
  .footer-contact h4,.footer-contact p {
    grid-column: 1;
  }
  .footer .footer-contact a.contact-item {
    min-height: 41px;
  }
  .footer-bottom {
    flex-direction: column;
    align-items: flex-start;
    margin-top: 22px;
    gap: 4px;
  }
  .contact-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .contact-card .contact-meta>span {
    font-size: 13px;
  }
  .nav-actions .btn-primary {
    padding: 8px 10px;
  }
  .hero-ctas .btn {
    white-space: normal;
    text-align: center;
  }
  .contact-guidance {
    margin-top: 6px;
  }
}
@media(prefers-reduced-motion:reduce) {
  .theme-card,.contact-item,.contact-icon,.btn,.footer-column>a,.nav-links a {
    transition: none!important;
  }
}
/* R18 — Google sign-in identity + user-friendly direct media upload */
.btn-google {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  min-height: 48px;
  background: #fff;
  border: 1px solid #747775;
  border-radius: 8px;
  color: #1f1f1f;
  font-size: 14px;
  font-family: Arial,Helvetica,sans-serif;
  font-weight: 500;
  box-shadow: none;
  transition: background-color .18s,border-color .18s,box-shadow .18s;
}
.btn-google:hover {
  background: #f7f8f8;
  border-color: #5f6368;
  transform: none;
}
.btn-google:focus-visible {
  outline: 3px solid #a0c4ff;
  outline-offset: 2px;
}
.google-g-logo {
  width: 20px;
  height: 20px;
  min-width: 20px;
  flex: none;
  display: inline-block;
  object-fit: contain;
}
.photo-title {
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
}
.photo-upload-icon {
  width: 36px;
  height: 36px;
  flex: none;
  display: grid;
  place-items: center;
  border-radius: 11px;
  color: #945b68;
  background: #f8e9e8;
}
.photo-slot {
  border-color: #e6d9d2;
  background: linear-gradient(160deg,#fffefa,#fff9f6);
}
.media-upload {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 11px;
}
.upload-file-label {
  display: flex;
  flex-direction: column;
  gap: 7px;
  width: 100%;
  color: #615860;
  font-weight: 600;
  font-size: 12px;
}
.media-upload .upload-file-label input[type=file] {
  display: block;
  width: 100%;
  max-width: none;
  min-width: 0;
  background: #fff;
  border: 1px dashed #bc9c9b;
  padding: 11px;
  border-radius: 10px;
  color: #59515a;
}
.media-upload input[type=file]::file-selector-button {
  padding: 9px 12px;
  border-radius: 7px;
  border: 1px solid #c8a6a0;
  background: #f7eeee;
  color: #824c58;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  margin-right: 12px;
}
.media-upload input[type=file]:focus-visible {
  outline: 3px solid #eac8c8;
  outline-offset: 2px;
}
.upload-selection {
  font-size: 11px;
  color: #72676f;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.upload-selected-preview[hidden] {
  display: none;
}
.upload-selected-preview img {
  display: block;
  width: 125px;
  height: 92px;
  object-fit: cover;
  border-radius: 9px;
  border: 1px solid #e7d9d2;
  box-shadow: 0 6px 16px #20172012;
}
.media-upload .btn {
  align-self: flex-start;
  min-height: 40px;
}
@media(max-width:550px) {
  .media-upload .btn {
    width: 100%;
  }
  .photo-slot-top img {
    width: 76px;
    height: 68px;
  }
}
/* Prevent the theme selector from widening the mobile editor. */
.editor-sidebar,.editor-main,.editor-preview,.mini-themes,.mini-theme {
  min-width: 0;
  max-width: 100%;
}
.mini-theme {
  overflow: hidden;
}
.mini-theme>div,.mini-theme .w-cover {
  min-width: 0;
  max-width: 100%;
  width: 100%;
}
@media(max-width:540px) {
  .mini-themes {
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 9px;
  }
  .mini-theme>div {
    height: 150px;
  }
  .editor-tabs {
    max-width: 100%;
  }
  .editor-main {
    overflow: clip;
  }
}
/* Kawinku Studio: admin-only area, visually independent from the marketing site. */
.admin-layout {
  display: grid;
  grid-template-columns: 245px minmax(0,1fr);
  min-height: 100dvh;
  background: #f7f4f1;
  color: #2d354a;
}
.admin-sidebar {
  position: sticky;
  top: 0;
  height: 100dvh;
  display: flex;
  flex-direction: column;
  padding: 28px 18px 19px;
  background: linear-gradient(178deg,#18273c 0%,#23334d 60%,#19263a 100%);
  color: #edf1f4;
  z-index: 52;
  box-shadow: 9px 0 30px #1b29400d;
}
.admin-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  color: white;
  font: 27px var(--display);
  padding: 2px 9px 30px;
  border-bottom: 1px solid #ffffff1b;
}
.admin-brand .mark {
  background: #a96d77;
}
.admin-brand small {
  font: 600 10px var(--sans);
  display: block;
  letter-spacing: .15em;
  color: #b9c6d9;
  margin-top: -5px;
  text-transform: uppercase;
}
.admin-menu-title {
  font: 700 10px var(--sans);
  letter-spacing: .18em;
  color: #9dacc4;
  margin: 33px 13px 13px;
}
.admin-menu {
  display: grid;
  gap: 5px;
}
.admin-menu a {
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 13px 14px;
  border-radius: 10px;
  color: #d3d9e3;
  font-weight: 600;
  font-size: 12px;
}
.admin-menu a span {
  font-size: 20px;
  line-height: 1;
}
.admin-menu a:hover,.admin-menu a.current {
  color: #fff;
  background: #ffffff20;
}
.admin-menu a.current {
  border-left: 3px solid #e9c4aa;
}
.admin-sidebar-bottom {
  margin-top: auto;
  padding: 20px 13px 4px;
  border-top: 1px solid #ffffff20;
}
.admin-sidebar-bottom span {
  display: block;
  font-size: 10px;
  color: #b1bdd1;
}
.admin-sidebar-bottom strong {
  display: block;
  font-size: 12px;
  margin: 7px 0 14px;
  overflow-wrap: anywhere;
}
.admin-sidebar-bottom button {
  background: transparent;
  border: 1px solid #ffffff43;
  border-radius: 9px;
  color: white;
  width: 100%;
  padding: 9px;
  font-size: 12px;
  text-align: center;
}
.admin-workspace {
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.admin-header {
  min-height: 78px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  background: white;
  border-bottom: 1px solid #e8e3e0;
  padding: 12px 36px;
}
.admin-header-title {
  font-weight: 800;
  font-size: 16px;
}
.admin-header-user {
  font-size: 12px;
  color: #686e77;
  text-align: right;
}
.admin-hamburger {
  display: none;
  border: 1px solid #e6d8d0;
  border-radius: 9px;
  background: #fff;
  padding: 7px 11px;
  font-size: 22px;
  color: #374052;
}
.admin-bottom-note {
  padding: 20px 25px;
  text-align: center;
  color: #95939a;
  font-size: 10px;
  margin-top: auto;
}
.admin-workspace .dash,.admin-workspace .editor {
  width: min(1180px,calc(100% - 60px));
  margin-inline: auto;
}
.admin-workspace .dash {
  padding-block: 35px;
}
.admin-workspace .dash-head {
  gap: 12px;
}
.admin-workspace .editor {
  padding-block: 28px;
}
.admin-layout .dash-panel,.admin-layout .editor-main,.admin-layout .new-invite,.admin-layout .stats>div {
  box-shadow: 0 12px 40px #23364b09;
}
.admin-backdrop {
  display: none;
}
@media(max-width:1050px) {
  .admin-layout {
    grid-template-columns: 215px minmax(0,1fr);
  }
  .admin-header {
    padding-inline: 22px;
  }
  .admin-workspace .editor,.admin-workspace .dash {
    width: calc(100% - 38px);
  }
}
@media(max-width:820px) {
  .admin-layout {
    display: block;
  }
  .admin-sidebar {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    width: min(280px,86vw);
    height: 100dvh;
    transform: translateX(-105%);
    transition: transform .24s ease;
    z-index: 80;
  }
  .admin-nav-open .admin-sidebar {
    transform: translateX(0);
  }
  .admin-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: #111928a8;
    z-index: 70;
  }
  .admin-nav-open .admin-backdrop {
    display: block;
  }
  .admin-header {
    min-height: 66px;
    padding-inline: 16px;
  }
  .admin-hamburger {
    display: block;
  }
  .admin-header-title {
    font-size: 14px;
  }
  .admin-workspace .dash,.admin-workspace .editor {
    width: calc(100% - 26px);
  }
  .admin-header-user {
    font-size: 10px;
    max-width: 40%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
}
@media(max-width:540px) {
  .admin-header {
    gap: 10px;
  }
  .admin-workspace .dash-head .btn {
    white-space: normal;
  }
  .admin-workspace .stats {
    gap: 10px;
  }
  .admin-workspace .editor {
    padding-top: 18px;
  }
  .admin-layout .editor-grid {
    gap: 12px;
  }
  .admin-layout .editor-tabs {
    display: flex;
    overflow-x: auto;
  }
  .admin-layout .editor-main {
    padding: 15px;
  }
  .admin-header-title {
    font-size: 13px;
  }
}
@media(prefers-reduced-motion:reduce) {
  .admin-sidebar {
    transition: none;
  }
}
/* Public link composer: standalone, no dashboard and no marketing navigation. */
.public-share-layout {
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  background: radial-gradient(ellipse at 7% 4%,#f4dcd5 0%,transparent 38%),#fbf6f1;
}
.public-share-header {
  min-height: 78px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 13px max(22px,calc((100vw - 1160px)/2));
  background: #fffdfa;
  border-bottom: 1px solid #efe2dc;
}
.public-share-header>span {
  font-size: 12px;
  font-weight: 700;
  color: #9b6971;
}
.public-share-layout .share-public {
  flex: 1;
  padding-block: 44px;
}
.public-share-footer {
  text-align: center;
  color: #857878;
  padding: 25px 15px;
  font-size: 11px;
}
.public-share-footer a {
  text-decoration: underline;
  color: #985b61;
}
@media(max-width:570px) {
  .public-share-header {
    min-height: 64px;
    padding: 10px 16px;
  }
  .public-share-header>span {
    font-size: 10px;
  }
  .public-share-layout .share-public {
    padding-block: 24px;
  }
}
/* Kawinku V1 R22 — isolated customer workspace and account management */
.customer-layout .admin-sidebar {
  background: linear-gradient(160deg,#213653 0%,#183048 64%,#102339 100%);
}
.customer-layout .admin-menu a.current {
  background: rgba(255,255,255,.16);
}
.customer-main {
  padding-bottom: 48px;
}
.customer-main .dash-panel {
  margin-top: 22px;
}
.customer-card .my-invite-actions {
  flex-wrap: wrap;
  gap: 8px;
}
.customer-stats>div {
  min-width: 0;
}
.customer-response {
  scroll-margin-top: 95px;
}
.customer-tabs {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: 4px 0 20px;
}
.customer-data-table {
  width: 100%;
  overflow: auto;
  border: 1px solid #e8e6e0;
  border-radius: 15px;
  background: #fff;
}
.customer-data-table table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
  min-width: 520px;
  font-size: 13px;
}
.customer-data-table th,.customer-data-table td {
  padding: 13px 14px;
  border-bottom: 1px solid #f1efea;
  vertical-align: top;
}
.customer-data-table th {
  background: #f8f6f2;
  color: #39455a;
  font-weight: 700;
  white-space: nowrap;
}
.customer-data-table tr:last-child td {
  border-bottom: 0;
}
.customer-data-table small {
  color: #7b8090;
}
.customer-wishes {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit,minmax(min(100%,245px),1fr));
}
.customer-wishes article {
  background: #fff;
  border: 1px solid #e7e4dd;
  border-radius: 14px;
  padding: 15px;
}
.customer-wishes p {
  line-height: 1.65;
  color: #4d5667;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.customer-wishes small,.customer-empty {
  color: #747d87;
}
.customer-assignment {
  margin: 16px 0 22px;
  padding: 24px;
  border-radius: 18px;
  background: #fff;
  border: 1px solid #eae5df;
}
.customer-assignment form {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  gap: 16px;
}
.customer-assignment .form-actions {
  grid-column: 1/-1;
}
.auth-warning {
  color: #a94d38;
  border: 1px solid #ead0ca;
  border-radius: 12px;
  padding: 12px;
}
@media(max-width:760px) {
  .customer-assignment form {
    grid-template-columns: 1fr;
  }
  .customer-main .dash-head {
    align-items: flex-start;
  }
  .customer-tabs button {
    flex: 1;
  }
  .customer-main .stats {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  .customer-assignment {
    padding: 16px;
  }
}
@media(max-width:400px) {
  .customer-main .stats {
    grid-template-columns: 1fr;
  }
  .customer-data-table table {
    font-size: 12px;
  }
}