:root {
  --ink: #2f2c29;
  --muted: #766f69;
  --paper: #f7f3ee;
  --paper-deep: #eee6de;
  --surface: #fffdf9;
  --line: #e6ddd4;
  --rose: #d9b8b0;
  --rose-soft: #f1dfda;
  --sage: #aab6a4;
  --sage-soft: #e5ece1;
  --gold: #b28f66;
  --gold-soft: #eee1d1;
  --dark-green: #314137;
  --shadow: 0 24px 70px rgba(71, 55, 43, 0.10);
  --shadow-soft: 0 14px 40px rgba(71, 55, 43, 0.075);
  --radius-xl: 32px;
  --radius-lg: 24px;
  --radius-md: 18px;
  --radius-sm: 12px;
  --sans: "DM Sans", "Manrope", Arial, sans-serif;
  --display: "Italiana", Georgia, serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--sans);
  color: var(--ink);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
img, svg { display: block; max-width: 100%; }
[hidden] { display: none !important; }

.view { display: none; min-height: 100vh; }
.view.is-active { display: block; }
.shell { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }

.toast {
  position: fixed;
  left: 50%;
  bottom: 26px;
  z-index: 5000;
  transform: translate(-50%, 26px);
  opacity: 0;
  pointer-events: none;
  background: #2f2c29;
  color: #fff;
  border-radius: 999px;
  padding: 12px 18px;
  box-shadow: 0 14px 40px rgba(0,0,0,.18);
  font-size: 13px;
  transition: .25s ease;
}
.toast.is-visible { opacity: 1; transform: translate(-50%, 0); }

.brand { display: inline-flex; align-items: center; gap: 11px; }
.brand-mark {
  width: 42px; height: 42px; display: grid; place-items: center;
  border: 1px solid rgba(47,44,41,.18); border-radius: 50%; position: relative;
  background: rgba(255,255,255,.5);
}
.brand-mark::before, .brand-mark::after {
  content: ""; position: absolute; inset: 4px; border: 1px solid rgba(178,143,102,.45); border-radius: 50% 50% 46% 54%; transform: rotate(18deg);
}
.brand-mark::after { inset: 8px 5px; transform: rotate(-24deg); }
.brand-mark span { position: relative; z-index: 1; font-family: var(--display); font-size: 20px; }
.brand-copy { display: flex; flex-direction: column; line-height: 1; }
.brand-copy strong { font-family: var(--display); font-size: 23px; font-weight: 400; letter-spacing: .02em; }
.brand-copy small { margin-top: 5px; font-size: 8px; letter-spacing: .32em; text-transform: uppercase; color: var(--muted); }
.brand.compact .brand-mark { width: 35px; height: 35px; }
.brand.compact .brand-copy strong { font-size: 19px; }

.button {
  border: 0; border-radius: 999px; padding: 11px 17px; display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  font-size: 13px; font-weight: 600; transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
  white-space: nowrap;
}
.button:hover { transform: translateY(-1px); }
.button:active { transform: translateY(0); }
.button[disabled] { opacity: .55; cursor: default; transform: none; }
.button-dark { background: var(--ink); color: #fff; box-shadow: 0 10px 26px rgba(47,44,41,.16); }
.button-primary { background: var(--dark-green); color: #fff; box-shadow: 0 12px 28px rgba(49,65,55,.2); }
.button-soft { background: rgba(255,255,255,.72); color: var(--ink); border: 1px solid var(--line); }
.button-ghost { background: transparent; color: var(--ink); }
.button-light { background: #fff; color: var(--ink); }
.button-large { padding: 15px 22px; font-size: 14px; }
.button-full { width: 100%; }
.text-link { background: transparent; border: 0; padding: 0; font-weight: 600; color: var(--dark-green); display: inline-flex; gap: 8px; align-items: center; }

.eyebrow, .mini-eyebrow {
  display: flex; align-items: center; gap: 10px; color: var(--gold); text-transform: uppercase; letter-spacing: .19em; font-size: 10px; font-weight: 700;
}
.eyebrow span { width: 24px; height: 1px; background: currentColor; }
.eyebrow.centered { justify-content: center; }
.eyebrow.light { color: rgba(255,255,255,.72); }
.mini-eyebrow { font-size: 9px; }

.site-header {
  height: 92px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; position: relative; z-index: 50;
}
.desktop-nav { display: flex; align-items: center; gap: 31px; font-size: 13px; color: #5c5651; }
.desktop-nav a { position: relative; }
.desktop-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -7px; height: 1px; background: var(--ink); transition: right .2s ease; }
.desktop-nav a:hover::after { right: 0; }
.header-actions { display: flex; justify-content: flex-end; gap: 8px; }

.hero { min-height: 710px; display: grid; grid-template-columns: 1.02fr .98fr; align-items: center; gap: 56px; padding-top: 52px; padding-bottom: 88px; }
.hero-copy h1 {
  margin: 24px 0 22px; font-family: var(--display); font-size: clamp(58px, 6vw, 88px); line-height: .99; font-weight: 400; letter-spacing: -.035em;
}
.hero-copy h1 em { font-style: normal; color: #8f7468; }
.hero-copy > p { max-width: 570px; margin: 0; font-size: 17px; line-height: 1.72; color: var(--muted); }
.hero-actions { display: flex; gap: 11px; margin-top: 32px; }
.hero-trust { display: flex; align-items: center; gap: 15px; margin-top: 36px; }
.avatar-stack { display: flex; }
.avatar-stack span {
  width: 36px; height: 36px; border-radius: 50%; border: 2px solid var(--paper); display: grid; place-items: center; margin-left: -8px;
  background: #b3a294; color: #fff; font-size: 9px; font-weight: 700;
}
.avatar-stack span:first-child { margin-left: 0; background: #9aafa0; }
.avatar-stack span:nth-child(2) { background: #c69e93; }
.avatar-stack span:nth-child(3) { background: #a89baf; }
.avatar-stack span:last-child { background: var(--ink); }
.hero-trust > div:last-child { display: flex; flex-direction: column; gap: 4px; }
.hero-trust strong { font-size: 12px; }
.hero-trust small { font-size: 11px; color: var(--muted); }

.hero-visual { position: relative; min-height: 560px; isolation: isolate; }
.soft-orbit { position: absolute; border-radius: 50%; filter: blur(1px); z-index: -2; }
.orbit-one { width: 460px; height: 460px; right: 15px; top: 18px; background: radial-gradient(circle at 40% 35%, rgba(255,255,255,.95), rgba(225,214,203,.55) 54%, rgba(238,226,218,.1) 72%); }
.orbit-two { width: 220px; height: 220px; left: 20px; bottom: 15px; background: radial-gradient(circle, rgba(228,236,224,.75), rgba(228,236,224,0)); }
.floating-card { position: absolute; background: var(--surface); box-shadow: var(--shadow); border: 1px solid rgba(255,255,255,.8); }
.invite-card {
  width: 305px; height: 505px; border-radius: 42px; right: 72px; top: 18px; overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 32px; transform: rotate(2.4deg);
  background: linear-gradient(160deg, #f9f5ee, #f2e8df);
}
.invite-pattern { position: absolute; inset: 17px; border: 1px solid rgba(160,131,98,.25); border-radius: 33px 33px 100px 100px; }
.invite-pattern::before, .invite-pattern::after { content:""; position:absolute; width: 100px; height: 170px; border: 1px solid rgba(160,131,98,.14); border-radius: 50%; top: -58px; }
.invite-pattern::before { left:-42px; transform: rotate(35deg); }
.invite-pattern::after { right:-42px; transform: rotate(-35deg); }
.invite-topline { position: relative; z-index: 1; color: var(--gold); letter-spacing: .22em; text-transform: uppercase; font-size: 9px; }
.invite-monogram { position: relative; z-index: 1; margin: 40px 0 23px; font-family: var(--display); font-size: 61px; line-height: 1; color: #54483f; }
.invite-monogram span { font-size: 29px; color: var(--gold); margin: 0 -5px; }
.invite-card h2 { position: relative; z-index: 1; font-family: var(--display); font-size: 36px; font-weight: 400; margin: 0; }
.invite-card h2 span { color: var(--gold); font-size: 22px; }
.invite-card p { position: relative; z-index: 1; margin: 12px 0 0; color: #746960; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
.mini-divider { position: relative; z-index: 1; display: flex; align-items:center; gap: 8px; width: 140px; margin: 25px 0 17px; }
.mini-divider span { flex: 1; height: 1px; background: rgba(160,131,98,.25); }
.mini-divider i { color: var(--gold); font-style: normal; font-size: 9px; }
.invite-card small { position: relative; z-index: 1; line-height: 1.6; color: #7e746d; }
.invite-card button { position: relative; z-index: 1; border: 0; background: #39453d; color: #fff; border-radius: 999px; padding: 10px 17px; font-size: 10px; margin-top: 24px; }
.mini-editor-card { width: 260px; padding: 20px; border-radius: 23px; left: 8px; top: 91px; transform: rotate(-3deg); }
.mini-editor-head { display:flex; align-items:center; justify-content:space-between; margin-bottom: 17px; }
.mini-editor-head span { font-weight: 700; font-size: 12px; }
.mini-editor-head i { width: 7px; height: 7px; background: #78a87c; border-radius:50%; box-shadow: 0 0 0 4px rgba(120,168,124,.12); }
.mini-editor-row { display:flex; align-items:center; justify-content:space-between; padding: 11px 0; border-top:1px solid var(--line); font-size:10px; }
.mini-editor-row b { font-weight:500; color: var(--muted); }
.mini-editor-row span { font-weight:600; }
.mini-swatches { display:flex; gap:4px; }
.mini-swatches i { width:13px; height:13px; border-radius:50%; background:#e5ece1; border:1px solid rgba(0,0,0,.05); }
.mini-swatches i:nth-child(2) { background:#d9b8b0; }
.mini-swatches i:nth-child(3) { background:#b28f66; }
.mini-progress { height:5px; background:#eee8e2; border-radius:999px; overflow:hidden; margin-top:12px; }
.mini-progress span { display:block; height:100%; background:#596d60; border-radius:inherit; }
.mini-editor-card > small { display:block; margin-top:8px; color:var(--muted); font-size:9px; }
.rsvp-card { right: 2px; bottom: 58px; padding: 16px 18px; border-radius: 20px; display:flex; gap:25px; align-items:center; }
.rsvp-card > div { display:flex; flex-direction:column; }
.rsvp-card strong { font-family:var(--display); font-size:28px; font-weight:400; }
.rsvp-card small { font-size:9px; color:var(--muted); }
.rsvp-pill { background:var(--sage-soft); color:#5a6a5d; border-radius:999px; padding:7px 10px; font-size:9px; font-weight:700; }

.trust-strip { border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:rgba(255,255,255,.35); }
.trust-inner { min-height:75px; display:flex; align-items:center; justify-content:space-between; gap:24px; color:#68615b; font-size:11px; }
.trust-inner > span { font-weight:700; color:var(--ink); }
.trust-inner div { display:flex; align-items:center; gap:8px; }
.trust-inner i { color:var(--gold); font-style:normal; }

.section { padding-top: 118px; padding-bottom: 118px; }
.section-heading { margin-bottom: 48px; }
.section-heading.centered { max-width: 700px; margin-left:auto; margin-right:auto; text-align:center; }
.section-heading.row { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; }
.section-heading h2 { margin:18px 0 12px; font-family:var(--display); font-size:clamp(42px,5vw,64px); line-height:1.04; font-weight:400; letter-spacing:-.025em; }
.section-heading p { margin:0; color:var(--muted); line-height:1.7; font-size:15px; }
.section-heading.row h2 { margin-bottom:0; }

.feature-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.feature-card { background:var(--surface); border:1px solid rgba(255,255,255,.8); border-radius:var(--radius-lg); padding:34px; min-height:340px; position:relative; overflow:hidden; box-shadow:var(--shadow-soft); }
.feature-wide { grid-column:1/-1; min-height:430px; display:grid; grid-template-columns:.84fr 1.16fr; gap:45px; align-items:center; }
.feature-number { position:absolute; top:24px; right:26px; color:#aaa19b; font-size:10px; letter-spacing:.1em; }
.feature-card h3 { font-family:var(--display); font-size:34px; line-height:1.1; font-weight:400; margin:18px 0 14px; }
.feature-card p { color:var(--muted); line-height:1.7; font-size:14px; margin:0 0 25px; }
.feature-icon { width:49px; height:49px; border-radius:50%; display:grid; place-items:center; font-size:18px; }
.soft-pink { background:var(--rose-soft); color:#8f6660; }
.soft-sage { background:var(--sage-soft); color:#5a6d5e; }
.soft-gold { background:var(--gold-soft); color:#866d50; }
.stat-mini { display:flex; gap:10px; margin-top:32px; }
.stat-mini span { background:#f8f3ee; border:1px solid var(--line); border-radius:15px; padding:10px 13px; font-size:10px; color:var(--muted); }
.stat-mini b { display:block; color:var(--ink); font-family:var(--display); font-size:22px; font-weight:400; }
.event-mini { margin-top:30px; padding:14px; border-radius:18px; background:#f7f3ee; border:1px solid var(--line); display:flex; align-items:center; gap:13px; }
.event-mini i { width:44px; height:44px; border-radius:13px; background:#fff; display:grid; place-items:center; font-style:normal; font-family:var(--display); font-size:20px; }
.event-mini div { display:flex; flex-direction:column; gap:4px; }
.event-mini b { font-size:11px; }
.event-mini small { font-size:9px; color:var(--muted); }
.qr-mini { margin-top:29px; width:110px; height:110px; border-radius:15px; background:#fff; border:1px solid var(--line); padding:13px; display:grid; grid-template-columns:repeat(3,1fr); gap:6px; }
.qr-mini span { background:#43403c; border-radius:3px; }
.qr-mini span:nth-child(2), .qr-mini span:nth-child(4), .qr-mini span:nth-child(8) { background:transparent; border:2px solid #43403c; }
.feature-editor-mock { height:310px; border-radius:24px; background:#eee8e2; border:1px solid #e3dad2; display:grid; grid-template-columns:56px 1fr 110px; overflow:hidden; box-shadow: inset 0 1px 0 rgba(255,255,255,.8); }
.mock-sidebar { background:#f9f6f2; border-right:1px solid #ddd4cc; display:flex; flex-direction:column; gap:15px; align-items:center; padding-top:24px; }
.mock-sidebar i { width:22px; height:22px; border-radius:7px; border:1px solid #cfc5bb; }
.mock-sidebar i:first-child { background:#39453d; border-color:#39453d; }
.mock-canvas { display:grid; place-items:center; align-content:center; background:radial-gradient(circle at 60% 40%, #fff 0, #f8f2eb 62%, #ece2d9 100%); }
.mock-canvas > div { font-family:var(--display); font-size:62px; color:#405046; }
.mock-canvas small { font-size:25px; color:var(--gold); }
.mock-canvas p { margin:13px 0 0; font-family:var(--display); font-size:23px; }
.mock-panel { background:#fff; border-left:1px solid #ddd4cc; padding:25px 14px; display:flex; flex-direction:column; gap:13px; }
.mock-panel b { height:9px; width:70%; background:#d6cdc5; border-radius:999px; }
.mock-panel span { height:31px; background:#f1ebe6; border:1px solid #e2dad2; border-radius:9px; }
.feature-canva { background:linear-gradient(135deg,#f7efe9,#f0ece7 45%,#e7ede6); }
.canva-flow { display:grid; grid-template-columns:1fr 72px 1fr; grid-template-rows:auto auto; gap:12px; align-items:center; justify-content:center; }
.flow-node { min-height:170px; background:rgba(255,255,255,.8); border:1px solid rgba(255,255,255,.9); box-shadow:var(--shadow-soft); border-radius:25px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.flow-node span { width:52px; height:52px; display:grid; place-items:center; border-radius:16px; margin-bottom:14px; font-family:var(--display); font-size:25px; }
.flow-node b { font-size:12px; }
.flow-node small { margin-top:5px; color:var(--muted); font-size:9px; }
.walimah-node span { background:var(--sage-soft); color:#4a5b4e; }
.canva-node span { background:linear-gradient(145deg,#8a5cff,#17c5cc); color:#fff; font-family:var(--sans); font-weight:700; }
.flow-line { text-align:center; color:#7a726c; }
.flow-line i { display:block; font-size:24px; font-style:normal; }
.flow-line small { font-size:8px; }
.flow-line.reverse { grid-column:2; grid-row:2; }

.themes-section { background:#eee7df; }
.theme-filters { display:flex; gap:8px; margin-bottom:27px; overflow-x:auto; padding-bottom:3px; }
.theme-filters button, .studio-theme-row button { border:1px solid #ded4ca; background:rgba(255,255,255,.4); color:#6d655f; border-radius:999px; padding:9px 15px; font-size:11px; white-space:nowrap; }
.theme-filters button.is-active, .studio-theme-row button.is-active { background:var(--ink); color:#fff; border-color:var(--ink); }
.theme-gallery { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.theme-card { cursor:pointer; transition:.25s ease; }
.theme-card:hover { transform:translateY(-5px); }
.theme-card.is-hidden { display:none; }
.theme-preview { aspect-ratio:4/5.25; border-radius:23px; overflow:hidden; position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:30px; box-shadow:var(--shadow-soft); }
.theme-preview b { font-family:var(--display); font-size:37px; line-height:1.1; font-weight:400; position:relative; z-index:1; }
.theme-preview b i { font-style:normal; color:var(--gold); }
.theme-preview small, .theme-preview .tiny-label { position:relative; z-index:1; font-size:8px; letter-spacing:.18em; text-transform:uppercase; margin-bottom:22px; }
.theme-preview p { position:relative; z-index:1; font-size:9px; margin-top:18px; }
.theme-preview > i { font-style:normal; font-size:9px; margin-top:22px; letter-spacing:.12em; }
.theme-meta { display:flex; justify-content:space-between; align-items:center; padding:14px 4px 0; }
.theme-meta h3 { margin:0 0 3px; font-size:13px; }
.theme-meta p { margin:0; font-size:10px; color:var(--muted); }
.theme-meta > span { background:rgba(255,255,255,.7); border:1px solid #ded4ca; border-radius:999px; padding:6px 10px; font-size:9px; font-weight:700; }
.theme-ivory { background:#fbf8f3; color:#443d38; }
.theme-ivory::before { content:""; position:absolute; inset:24px; border:1px solid #d8c9bc; border-radius:50% 50% 35% 35%; }
.arch-line { position:absolute; inset:55px 56px; border-top:1px solid rgba(178,143,102,.4); border-radius:50%; }
.theme-sage { background:linear-gradient(160deg,#eaf0e7,#dfe9dc); color:#304137; }
.theme-sage::before, .theme-sage::after { content:""; position:absolute; width:180px; height:180px; border:1px solid rgba(89,109,96,.18); border-radius:50%; }
.theme-sage::before { top:-85px; left:-60px; }
.theme-sage::after { bottom:-90px; right:-50px; }
.arabesque { font-size:24px; margin-bottom:13px; color:var(--gold); }
.theme-blush { background:linear-gradient(160deg,#f7e7e2,#ead0ca); color:#624b46; }
.floral-corner { position:absolute; font-size:80px; opacity:.16; color:#9c655d; }
.floral-corner.one { top:-18px; left:-12px; transform:rotate(-25deg); }
.floral-corner.two { bottom:-22px; right:-8px; transform:rotate(20deg); }
.theme-songket { background:#3d3030; color:#f7e9dc; }
.songket-grid { position:absolute; inset:0; opacity:.18; background-image:linear-gradient(45deg,#d6b276 25%,transparent 25%),linear-gradient(-45deg,#d6b276 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#d6b276 75%),linear-gradient(-45deg,transparent 75%,#d6b276 75%); background-size:28px 28px; background-position:0 0,0 14px,14px -14px,-14px 0; }
.theme-songket b i { color:#d9b779; }
.theme-celadon { background:linear-gradient(150deg,#dbe8df,#bed2c5); color:#30483d; }
.fan-shape { width:190px; height:95px; border-radius:190px 190px 0 0; border:1px solid rgba(48,72,61,.23); position:absolute; bottom:30px; transform:rotate(-12deg); }
.fan-shape::before, .fan-shape::after { content:""; position:absolute; left:50%; bottom:0; width:1px; height:95px; background:rgba(48,72,61,.18); transform-origin:bottom; transform:rotate(28deg); }
.fan-shape::after { transform:rotate(-28deg); }
.theme-marigold { background:linear-gradient(150deg,#f3d5a7,#d99c59); color:#6b3b24; }
.mandala-shape { position:absolute; font-size:240px; opacity:.11; }

.steps-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.steps-grid article { position:relative; }
.steps-grid article > span { position:absolute; top:18px; right:20px; font-size:9px; color:var(--muted); z-index:2; }
.step-visual { height:200px; border-radius:22px; background:var(--surface); border:1px solid rgba(255,255,255,.8); box-shadow:var(--shadow-soft); margin-bottom:20px; position:relative; overflow:hidden; }
.steps-grid h3 { font-family:var(--display); font-size:25px; font-weight:400; margin:0 0 8px; }
.steps-grid p { margin:0; color:var(--muted); font-size:12px; line-height:1.65; }
.step-select { display:flex; align-items:flex-end; justify-content:center; gap:7px; padding:30px; }
.step-select i { width:48px; height:100px; border-radius:9px 9px 4px 4px; background:#e5ece1; border:1px solid #d6dfd2; transform:rotate(-5deg); }
.step-select i:nth-child(2) { height:130px; background:#f0ddd8; transform:none; }
.step-select i:nth-child(3) { background:#eadfce; transform:rotate(5deg); }
.step-edit { display:grid; place-items:center; }
.step-edit b { font-family:var(--display); font-size:48px; font-weight:400; }
.step-edit i { position:absolute; width:54px; height:5px; border-radius:999px; background:#e4d9cf; bottom:32px; left:35px; }
.step-edit i:last-child { left:auto; right:35px; background:#b2beae; }
.step-plan { padding:35px; }
.step-plan > i { display:grid; place-items:center; width:52px; height:52px; background:var(--rose-soft); border-radius:14px; font-style:normal; font-family:var(--display); font-size:24px; }
.step-plan div { height:13px; border-radius:999px; background:#e6dfd8; margin-top:24px; }
.step-plan div:last-child { width:68%; margin-top:10px; }
.step-share { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; }
.step-share b { width:58px; height:58px; display:grid; place-items:center; border-radius:50%; background:var(--dark-green); color:#fff; font-size:22px; }
.step-share small { background:#f0ebe5; border:1px solid #e2d9d0; padding:9px 12px; border-radius:999px; font-size:9px; }

.pricing-section { background:#f2ece5; }
.pricing-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; align-items:stretch; max-width:1000px; margin:0 auto; }
.price-card { background:var(--surface); border:1px solid rgba(255,255,255,.9); border-radius:25px; padding:31px; box-shadow:var(--shadow-soft); position:relative; }
.price-card.popular { background:#e6ece2; border-color:#cfdacb; transform:translateY(-10px); }
.popular-tag { position:absolute; top:17px; right:17px; background:#39483e; color:#fff; border-radius:999px; padding:6px 10px; font-size:8px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.plan-label { color:var(--gold); text-transform:uppercase; letter-spacing:.18em; font-size:8px; font-weight:700; }
.price-card h3 { font-family:var(--display); font-size:32px; font-weight:400; margin:13px 0 5px; }
.price { display:flex; align-items:baseline; gap:8px; margin:7px 0 17px; }
.price b { font-family:var(--display); font-size:45px; font-weight:400; }
.price small { color:var(--muted); font-size:9px; }
.price-card > p { color:var(--muted); font-size:12px; line-height:1.65; min-height:58px; }
.price-card ul { list-style:none; padding:0; margin:24px 0 27px; display:flex; flex-direction:column; gap:13px; }
.price-card li { font-size:11px; display:flex; align-items:center; gap:9px; }
.price-card li::before { content:"✓"; width:18px; height:18px; border-radius:50%; background:#f0ebe5; display:grid; place-items:center; font-size:9px; color:#59675d; }
.price-card.popular li::before { background:#fff; }

.final-cta { margin-top:110px; margin-bottom:110px; border-radius:38px; background:#37443b; color:#fff; min-height:350px; padding:56px 62px; display:grid; grid-template-columns:180px 1fr auto; align-items:center; gap:46px; overflow:hidden; position:relative; }
.final-cta h2 { font-family:var(--display); font-size:52px; line-height:1.04; font-weight:400; margin:18px 0 12px; }
.final-cta p { margin:0; color:rgba(255,255,255,.66); }
.final-art { width:170px; height:220px; border:1px solid rgba(255,255,255,.2); border-radius:90px 90px 25px 25px; display:grid; place-items:center; position:relative; }
.final-art span { font-family:var(--display); font-size:62px; }
.final-art i { position:absolute; width:110px; height:110px; border:1px solid rgba(255,255,255,.12); border-radius:50%; }
.final-art i:nth-of-type(2) { width:82px; height:145px; transform:rotate(45deg); }
.final-art i:nth-of-type(3) { width:82px; height:145px; transform:rotate(-45deg); }
.site-footer { min-height:150px; border-top:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; gap:30px; }
.site-footer p { color:var(--muted); font-size:11px; }
.site-footer > div { display:flex; gap:22px; font-size:11px; color:var(--muted); }

.reveal { animation:fadeUp .75s both; }
.delay-1 { animation-delay:.1s; }
.delay-2 { animation-delay:.2s; }
@keyframes fadeUp { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:none; } }

/* Application */
.app-view.is-active { display:grid; grid-template-columns:244px 1fr; background:#f4f1ed; }
.app-sidebar { height:100vh; position:sticky; top:0; background:#fbfaf8; border-right:1px solid #e4ddd6; padding:24px 16px 17px; display:flex; flex-direction:column; z-index:80; }
.app-brand { padding:0 8px 24px; }
.app-nav { display:flex; flex-direction:column; gap:4px; }
.app-nav button { border:0; background:transparent; border-radius:12px; padding:11px 12px; display:flex; align-items:center; gap:11px; color:#716b66; font-size:12px; text-align:left; }
.app-nav button span { width:23px; color:#5f5852; font-size:15px; }
.app-nav button i { margin-left:auto; font-style:normal; background:#ebe5df; border-radius:999px; min-width:20px; padding:3px 6px; text-align:center; font-size:8px; }
.app-nav button:hover, .app-nav button.is-active { background:#eee9e3; color:var(--ink); }
.app-nav button.is-active { font-weight:700; }
.sidebar-spacer { flex:1; }
.upgrade-card { background:#e6ece2; border:1px solid #d2ddce; border-radius:18px; padding:15px; margin-bottom:13px; }
.upgrade-card > span { display:grid; place-items:center; width:30px; height:30px; border-radius:10px; background:#fff; color:var(--gold); margin-bottom:12px; }
.upgrade-card h4 { margin:0 0 5px; font-family:var(--display); font-size:20px; font-weight:400; }
.upgrade-card p { margin:0 0 12px; color:#657067; font-size:9px; line-height:1.55; }
.upgrade-card button { border:0; background:#39483e; color:#fff; border-radius:999px; padding:8px 11px; font-size:9px; }
.app-nav-bottom { border-top:1px solid #e5ded8; padding-top:8px; }
.user-card { display:flex; align-items:center; gap:9px; margin-top:9px; padding:10px 8px 0; border-top:1px solid #e5ded8; }
.user-card > span { width:32px; height:32px; border-radius:50%; display:grid; place-items:center; background:#b7a497; color:#fff; font-size:9px; font-weight:700; }
.user-card div { display:flex; flex-direction:column; gap:3px; }
.user-card b { font-size:10px; }
.user-card small { font-size:8px; color:var(--muted); }
.user-card i { margin-left:auto; font-style:normal; color:var(--muted); }
.app-main { min-width:0; }
.app-topbar { height:73px; border-bottom:1px solid #e2dbd4; background:rgba(251,250,248,.85); backdrop-filter:blur(16px); display:flex; align-items:center; justify-content:space-between; padding:0 30px; position:sticky; top:0; z-index:50; }
#appBreadcrumb { display:flex; align-items:center; gap:9px; font-size:11px; }
#appBreadcrumb span, #appBreadcrumb i { color:var(--muted); font-style:normal; }
.topbar-actions { display:flex; gap:9px; align-items:center; }
.icon-button { width:36px; height:36px; border-radius:50%; border:1px solid #e0d9d2; background:#fff; position:relative; }
.icon-button i { position:absolute; right:8px; top:7px; width:5px; height:5px; background:#b46e60; border-radius:50%; }
.mobile-menu { display:none; }
.app-page { display:none; padding:38px 34px 60px; max-width:1500px; margin:0 auto; }
.app-page.is-active { display:block; }
.app-page-head { display:flex; align-items:flex-start; justify-content:space-between; gap:25px; margin-bottom:28px; }
.app-page-head h1 { font-family:var(--display); font-size:42px; font-weight:400; margin:9px 0 7px; }
.app-page-head p { margin:0; color:var(--muted); font-size:12px; }
.head-button-group { display:flex; gap:8px; }
.overview-grid { display:grid; grid-template-columns:minmax(430px,1.5fr) 1fr 1fr; gap:16px; }
.overview-primary { min-height:263px; background:linear-gradient(135deg,#3c4a40,#2f3932); color:#fff; border-radius:25px; padding:25px; position:relative; overflow:hidden; }
.overview-top { display:flex; justify-content:space-between; position:relative; z-index:2; }
.status-pill { display:inline-flex; border-radius:999px; padding:5px 9px; font-size:8px; font-weight:700; }
.status-pill.draft { background:#f2e4d5; color:#845f3c; }
.overview-primary h2 { font-family:var(--display); font-size:34px; font-weight:400; margin:12px 0 4px; }
.overview-primary p { margin:0; color:rgba(255,255,255,.65); font-size:10px; }
.kebab { border:0; background:rgba(255,255,255,.1); color:#fff; width:34px; height:34px; border-radius:50%; }
.progress-block { margin-top:28px; position:relative; z-index:2; max-width:440px; }
.progress-block > div:first-child { display:flex; justify-content:space-between; font-size:9px; }
.progress-track { height:6px; background:rgba(255,255,255,.14); border-radius:999px; margin:9px 0 7px; overflow:hidden; }
.progress-track i { display:block; height:100%; background:#d9e5d3; border-radius:inherit; }
.progress-block small { color:rgba(255,255,255,.55); font-size:8px; }
.overview-actions { display:flex; gap:8px; margin-top:22px; position:relative; z-index:2; }
.overview-primary .button-primary { background:#fff; color:#344038; box-shadow:none; }
.overview-primary .button-soft { background:rgba(255,255,255,.08); color:#fff; border-color:rgba(255,255,255,.16); }
.overview-flower { position:absolute; right:-17px; bottom:-18px; width:210px; height:180px; color:rgba(255,255,255,.07); }
.overview-flower i { position:absolute; font-size:105px; font-style:normal; }
.overview-flower i:nth-child(2) { left:55px; top:35px; }
.overview-flower i:nth-child(3) { right:0; top:-20px; }
.overview-card { background:#fff; border:1px solid #e6dfd8; border-radius:23px; padding:22px; min-height:263px; display:flex; flex-direction:column; position:relative; overflow:hidden; }
.overview-icon { width:39px; height:39px; border-radius:12px; display:grid; place-items:center; }
.overview-icon.blush { background:var(--rose-soft); color:#91675e; }
.overview-icon.sage { background:var(--sage-soft); color:#647365; }
.overview-card > div:nth-child(2) { margin-top:27px; display:flex; flex-direction:column; }
.overview-card small { color:var(--muted); font-size:9px; }
.overview-card strong { font-family:var(--display); font-size:42px; font-weight:400; margin-top:5px; }
.overview-card p { margin:5px 0 0; font-size:9px; color:var(--muted); }
.overview-card p b { color:#648266; }
.spark-bars { position:absolute; left:22px; right:22px; bottom:18px; height:45px; display:flex; gap:5px; align-items:flex-end; }
.spark-bars i { flex:1; background:#e8ded6; border-radius:4px 4px 0 0; height:35%; }
.spark-bars i:nth-child(2){height:52%}.spark-bars i:nth-child(3){height:42%}.spark-bars i:nth-child(4){height:70%;background:#d6b9b1}.spark-bars i:nth-child(5){height:62%}.spark-bars i:nth-child(6){height:86%;background:#d6b9b1}.spark-bars i:nth-child(7){height:74%}
.spark-line { position:absolute; left:20px; right:20px; bottom:12px; height:50px; color:#91a493; }
.dashboard-columns { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:16px; }
.panel { background:#fff; border:1px solid #e6dfd8; border-radius:22px; padding:22px; }
.panel-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:16px; }
.panel-head h3 { margin:0 0 4px; font-size:13px; }
.panel-head p { margin:0; color:var(--muted); font-size:9px; }
.panel-head button { border:0; background:transparent; color:#6a756d; font-size:9px; font-weight:700; }
.task-list { display:flex; flex-direction:column; }
.task-list label { display:flex; align-items:center; gap:12px; padding:14px 0; border-top:1px solid #eee8e3; }
.task-list input { width:17px; height:17px; accent-color:#566a5a; }
.task-list span { display:flex; flex-direction:column; gap:3px; }
.task-list b { font-size:10px; }
.task-list small { font-size:8px; color:var(--muted); }
.task-list input:checked + span b { text-decoration:line-through; color:#9a938e; }
.activity-list { display:flex; flex-direction:column; }
.activity-list > div { display:grid; grid-template-columns:34px 1fr auto; align-items:center; gap:10px; padding:11px 0; border-top:1px solid #eee8e3; }
.activity-list > div > span { width:32px; height:32px; border-radius:50%; background:#ede4dc; display:grid; place-items:center; font-size:8px; font-weight:700; }
.activity-list p { margin:0; display:flex; flex-direction:column; gap:3px; }
.activity-list b { font-size:9px; }
.activity-list small, .activity-list time { font-size:8px; color:var(--muted); }
.invitation-grid { display:grid; grid-template-columns:minmax(360px,560px) minmax(250px,360px); gap:18px; }
.invitation-project { background:#fff; border:1px solid #e6dfd8; border-radius:23px; overflow:hidden; display:grid; grid-template-columns:210px 1fr; min-height:280px; }
.project-preview { border-radius:0; aspect-ratio:auto; min-height:100%; }
.project-preview b { font-size:28px; }
.project-details { padding:25px; display:flex; flex-direction:column; justify-content:center; }
.project-details h3 { font-family:var(--display); font-size:30px; font-weight:400; margin:14px 0 4px; }
.project-details p { color:var(--muted); font-size:9px; margin:0 0 26px; }
.project-details > div { display:flex; gap:8px; }
.new-project { border:1.5px dashed #d8cec5; background:rgba(255,255,255,.35); border-radius:23px; display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:280px; color:var(--muted); }
.new-project span { width:48px; height:48px; border-radius:50%; display:grid; place-items:center; background:#fff; border:1px solid #e0d8d1; font-size:20px; margin-bottom:13px; }
.new-project b { color:var(--ink); font-size:11px; }
.new-project small { font-size:9px; margin-top:5px; }
.search-box { background:#fff; border:1px solid #dfd8d1; border-radius:999px; display:flex; align-items:center; gap:8px; padding:9px 13px; min-width:230px; color:var(--muted); }
.search-box input { border:0; outline:0; background:transparent; width:100%; font-size:10px; color:var(--ink); }
.studio-theme-row { display:flex; gap:7px; margin-bottom:20px; overflow-x:auto; }
.studio-theme-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:17px; }
.studio-theme-grid .theme-preview { border-radius:19px; }
.studio-theme-grid .theme-meta { padding-top:11px; }
.guest-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:15px; }
.guest-stats article { background:#fff; border:1px solid #e6dfd8; border-radius:19px; padding:19px; display:flex; flex-direction:column; }
.guest-stats small { color:var(--muted); font-size:9px; }
.guest-stats b { font-family:var(--display); font-size:34px; font-weight:400; margin:5px 0 2px; }
.guest-stats span { color:var(--muted); font-size:8px; }
.guest-stats span.positive { color:#5f7f62; }
.guest-panel { padding:0; overflow:hidden; }
.guest-toolbar { min-height:65px; display:flex; align-items:center; justify-content:space-between; padding:12px 16px; border-bottom:1px solid #e9e2dc; gap:16px; }
.guest-toolbar > div:last-child { display:flex; gap:5px; }
.filter-button { border:0; background:transparent; padding:8px 10px; border-radius:999px; font-size:9px; color:var(--muted); }
.filter-button.is-active { background:#ece7e1; color:var(--ink); font-weight:700; }
.guest-table-wrap { overflow:auto; }
.guest-table { width:100%; border-collapse:collapse; min-width:850px; }
.guest-table th { background:#faf8f5; color:#8a837d; text-transform:uppercase; letter-spacing:.08em; font-size:8px; text-align:left; padding:12px 14px; border-bottom:1px solid #e9e2dc; }
.guest-table td { padding:13px 14px; border-bottom:1px solid #eee8e3; font-size:9px; }
.guest-name { display:flex; align-items:center; gap:9px; }
.guest-name > span { width:30px; height:30px; border-radius:50%; background:#eee5dd; display:grid; place-items:center; font-size:8px; font-weight:700; }
.guest-name div { display:flex; flex-direction:column; gap:3px; }
.guest-name b { font-size:9px; }
.guest-name small { font-size:8px; color:var(--muted); }
.table-status { display:inline-flex; align-items:center; gap:6px; border-radius:999px; padding:5px 8px; font-size:8px; font-weight:700; }
.table-status::before { content:""; width:5px; height:5px; border-radius:50%; background:currentColor; }
.table-status.attending { background:#e6efe3; color:#5b765f; }
.table-status.pending { background:#f4ecdf; color:#8a6f49; }
.table-status.declined { background:#f1e4e2; color:#95645f; }
.billing-note { background:#37443b; color:#fff; border-radius:22px; padding:21px 24px; display:flex; align-items:center; gap:15px; margin-bottom:30px; }
.billing-note > span { width:41px; height:41px; border-radius:13px; background:rgba(255,255,255,.1); display:grid; place-items:center; color:#dbc39f; }
.billing-note div { flex:1; }
.billing-note b { font-size:11px; }
.billing-note p { color:rgba(255,255,255,.6); font-size:9px; margin:4px 0 0; }
.pricing-grid.in-app { max-width:none; }

/* Editor */
.editor-view.is-active { display:block; height:100vh; overflow:hidden; background:#ece8e3; }
.editor-topbar { height:64px; background:#fbfaf8; border-bottom:1px solid #ddd6cf; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:0 14px; position:relative; z-index:100; }
.editor-left { display:flex; align-items:center; min-width:0; }
.back-button { width:34px; height:34px; border-radius:50%; border:1px solid #dfd8d1; background:#fff; margin-right:11px; }
.editor-separator { width:1px; height:25px; background:#ddd6cf; margin:0 14px; }
.document-name { display:flex; align-items:center; gap:7px; flex-wrap:wrap; min-width:0; }
.document-name input { border:0; background:transparent; font-weight:700; font-size:11px; outline:0; width:120px; }
.document-name small { font-size:8px; color:var(--muted); width:100%; }
.status-dot { width:6px; height:6px; border-radius:50%; background:#76a177; }
.editor-center { display:flex; background:#eee9e3; border-radius:999px; padding:3px; }
.device-button { border:0; width:34px; height:28px; background:transparent; border-radius:999px; color:#817a74; }
.device-button.is-active { background:#fff; color:var(--ink); box-shadow:0 2px 8px rgba(0,0,0,.06); }
.editor-actions { display:flex; justify-content:flex-end; gap:7px; }
.canva-button { background:linear-gradient(135deg,#7c59e6,#22a9bd); color:#fff; box-shadow:0 10px 22px rgba(86,84,191,.18); }
.canva-button > span { width:20px; height:20px; border-radius:6px; background:rgba(255,255,255,.2); display:grid; place-items:center; font-weight:700; }
.editor-workspace { height:calc(100vh - 64px); display:grid; grid-template-columns:72px 355px minmax(0,1fr); }
.editor-rail { background:#f7f5f2; border-right:1px solid #ddd6cf; display:flex; flex-direction:column; align-items:center; padding-top:12px; gap:5px; }
.editor-rail button { border:0; background:transparent; width:60px; min-height:55px; border-radius:12px; color:#807973; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; }
.editor-rail button span { font-size:16px; }
.editor-rail button small { font-size:8px; }
.editor-rail button.is-active, .editor-rail button:hover { background:#e9e4de; color:var(--ink); }
.editor-panel { background:#fff; border-right:1px solid #dcd5ce; overflow:auto; }
.editor-tab { display:none; padding:24px 22px 40px; }
.editor-tab.is-active { display:block; }
.panel-title { display:flex; align-items:flex-start; justify-content:space-between; border-bottom:1px solid #eee8e2; padding-bottom:18px; margin-bottom:20px; }
.panel-title h2 { font-family:var(--display); font-size:29px; font-weight:400; margin:7px 0 0; }
.collapse-button { border:1px solid #e1dad3; background:#fff; border-radius:50%; width:27px; height:27px; color:var(--muted); }
.panel-intro { font-size:10px; line-height:1.6; color:var(--muted); margin:-7px 0 18px; }
.form-section { border-bottom:1px solid #eee8e2; padding:0 0 21px; margin:0 0 21px; }
.form-section:last-child { border-bottom:0; }
.form-section h3 { margin:0 0 13px; font-size:10px; text-transform:uppercase; letter-spacing:.12em; color:#7e7771; }
.form-section-head { display:flex; align-items:center; justify-content:space-between; }
.form-section-head button { border:0; background:transparent; color:#5f6f63; font-size:9px; font-weight:700; }
.form-section label, .compact-modal-card label { display:flex; flex-direction:column; gap:6px; color:#716a65; font-size:9px; margin-bottom:12px; }
.form-section input, .form-section textarea, .form-section select, .compact-modal-card input, .compact-modal-card select {
  width:100%; border:1px solid #ddd6cf; border-radius:10px; background:#fbfaf8; padding:10px 11px; outline:0; color:var(--ink); font-size:10px; resize:vertical;
}
.form-section input:focus, .form-section textarea:focus, .form-section select:focus, .compact-modal-card input:focus, .compact-modal-card select:focus { border-color:#9eaa9d; box-shadow:0 0 0 3px rgba(158,170,157,.12); }
.form-grid { display:grid; gap:10px; }
.form-grid.two { grid-template-columns:1fr 1fr; }
.theme-picker { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.theme-picker button { border:1px solid #ddd6cf; border-radius:11px; background:#fff; padding:8px; display:flex; align-items:center; gap:8px; color:var(--ink); }
.theme-picker button.is-active { border-color:#718071; box-shadow:0 0 0 2px rgba(113,128,113,.13); }
.theme-picker b { font-size:8px; }
.swatch { width:24px; height:24px; border-radius:7px; border:1px solid rgba(0,0,0,.05); }
.swatch.sage { background:#dfe9dc; }.swatch.ivory{background:#f7f2eb}.swatch.blush{background:#ecd4ce}.swatch.songket{background:#4d3738}.swatch.celadon{background:#bfd5c8}.swatch.marigold{background:#e1a75e}
.color-row { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.color-row label { border:1px solid #e0d9d2; border-radius:10px; padding:8px; margin:0; }
.color-row label span { font-size:8px; }
.color-row input[type="color"] { border:0; padding:0; height:27px; background:none; }
.range-label > span { display:flex; justify-content:space-between; }
.range-label input { padding:0; accent-color:#6f7f71; }
.toggle-row { flex-direction:row !important; align-items:center; justify-content:space-between; gap:12px; position:relative; }
.toggle-row > span { display:flex; flex-direction:column; gap:3px; }
.toggle-row b { color:var(--ink); font-size:9px; }
.toggle-row small { font-size:8px; color:var(--muted); }
.toggle-row input { opacity:0; width:40px; height:22px; position:absolute; right:0; z-index:2; cursor:pointer; }
.toggle-row i, .section-list label i { width:38px; height:21px; border-radius:999px; background:#d7d0c9; position:relative; transition:.2s; flex:0 0 auto; }
.toggle-row i::after, .section-list label i::after { content:""; position:absolute; width:17px; height:17px; top:2px; left:2px; background:#fff; border-radius:50%; transition:.2s; box-shadow:0 1px 4px rgba(0,0,0,.15); }
.toggle-row input:checked + i, .section-list input:checked + i { background:#718173; }
.toggle-row input:checked + i::after, .section-list input:checked + i::after { left:19px; }
.section-list { display:flex; flex-direction:column; gap:7px; }
.section-list > div { display:grid; grid-template-columns:17px 1fr auto; align-items:center; gap:9px; border:1px solid #e2dbd4; border-radius:11px; padding:10px; background:#fff; cursor:grab; }
.section-list > div.dragging { opacity:.45; }
.section-list > div > span { color:#aaa29c; font-size:10px; }
.section-list > div > div { display:flex; flex-direction:column; gap:3px; }
.section-list b { font-size:9px; }
.section-list small { color:var(--muted); font-size:7.5px; }
.section-list label { position:relative; display:flex; }
.section-list label input { opacity:0; position:absolute; }
.section-list label i { width:32px; height:18px; }
.section-list label i::after { width:14px; height:14px; }
.section-list input:checked + i::after { left:16px; }
.add-section-button { width:100%; margin-top:10px; border:1px dashed #d3cac1; background:#fbfaf8; border-radius:11px; padding:11px; color:#6f6862; font-size:9px; }
.upload-zone { border:1.5px dashed #d6ccc3; border-radius:15px; background:#fbfaf8; padding:27px 20px; text-align:center; }
.upload-zone > span { width:37px; height:37px; display:grid; place-items:center; margin:0 auto 10px; border-radius:50%; background:#eee8e2; }
.upload-zone b { display:block; font-size:10px; }
.upload-zone p { color:var(--muted); font-size:8px; }
.media-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:17px 0 22px; }
.media-placeholder, .media-add { aspect-ratio:1.25; border-radius:10px; overflow:hidden; position:relative; border:1px solid #e0d9d2; }
.media-placeholder { background:linear-gradient(145deg,#d5c9bf,#f2eae2); }
.media-placeholder.two { background:linear-gradient(145deg,#c9d3c5,#edf1eb); }
.media-placeholder.three { background:linear-gradient(145deg,#dabeb6,#f2ded8); }
.media-placeholder span { position:absolute; left:7px; bottom:7px; background:rgba(255,255,255,.8); border-radius:999px; padding:4px 7px; font-size:7px; }
.media-add { background:#fbfaf8; border-style:dashed; color:var(--muted); font-size:19px; }
.quick-stat-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:20px; }
.quick-stat-grid article { border:1px solid #e1dad3; border-radius:13px; padding:13px; display:flex; flex-direction:column; }
.quick-stat-grid b { font-family:var(--display); font-size:27px; font-weight:400; }
.quick-stat-grid small { color:var(--muted); font-size:8px; }
.canvas-area { min-width:0; background:#ece8e3; overflow:hidden; display:flex; flex-direction:column; }
.canvas-toolbar { height:43px; padding:0 16px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid #d8d1ca; color:#77706a; font-size:9px; }
.canvas-toolbar > div { display:flex; align-items:center; gap:8px; background:rgba(255,255,255,.55); padding:4px; border-radius:999px; }
.canvas-toolbar button { width:24px; height:24px; border:0; background:#fff; border-radius:50%; }
.canvas-toolbar b { min-width:34px; text-align:center; font-size:8px; }
.device-stage { flex:1; overflow:auto; display:grid; place-items:start center; padding:40px 70px 80px; }
.device-frame { transform-origin:top center; transition:width .25s ease, transform .2s ease; }
.device-frame.mobile { width:390px; }
.device-frame.tablet { width:680px; }
.device-frame.desktop { width:980px; }
.phone-top { height:22px; background:#292b29; border-radius:28px 28px 0 0; position:relative; display:flex; align-items:center; justify-content:center; }
.phone-top i { width:44px; height:5px; border-radius:999px; background:#080808; }
.phone-top span { position:absolute; right:18px; width:5px; height:5px; background:#111; border-radius:50%; }
.wedding-preview { position:relative; overflow:hidden; min-height:1280px; background:var(--preview-bg,#eaf0e7); color:var(--preview-text,#304137); font-family:var(--preview-body,"DM Sans"); border-radius:0 0 28px 28px; box-shadow:0 30px 60px rgba(66,55,47,.18); }
.preview-hero { min-height:700px; padding:75px 42px 45px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; position:relative; overflow:hidden; }
.preview-hero::before, .preview-hero::after { content:""; position:absolute; width:340px; height:340px; border:1px solid color-mix(in srgb, var(--preview-accent,#a08362) 25%, transparent); border-radius:50%; }
.preview-hero::before { top:-190px; left:-170px; }
.preview-hero::after { bottom:-200px; right:-160px; }
.preview-ornament { color:var(--preview-accent,#a08362); font-size:27px; margin-bottom:24px; }
.preview-kicker, .preview-section-label { color:var(--preview-accent,#a08362); font-size:9px; letter-spacing:.22em; text-transform:uppercase; font-weight:700; }
.preview-monogram { margin:58px 0 26px; display:flex; align-items:center; font-family:var(--preview-display,"Italiana"); }
.preview-monogram b { font-size:78px; font-weight:400; }
.preview-monogram i { font-style:normal; font-size:31px; color:var(--preview-accent,#a08362); margin:0 -6px; }
.preview-monogram.small { margin:0 0 13px; }
.preview-monogram.small b { font-size:36px; }.preview-monogram.small i{font-size:17px}
.preview-hero h1 { font-family:var(--preview-display,"Italiana"); font-size:44px; line-height:1; font-weight:400; margin:0; }
.preview-hero h1 i { font-style:normal; color:var(--preview-accent,#a08362); font-size:26px; }
.preview-hero > p { max-width:270px; margin:19px 0 26px; font-size:10px; line-height:1.8; opacity:.75; }
.preview-date { display:flex; align-items:center; gap:12px; margin-top:7px; }
.preview-date > span { font-family:var(--preview-display,"Italiana"); font-size:43px; padding-right:12px; border-right:1px solid color-mix(in srgb,var(--preview-text,#304137) 20%,transparent); }
.preview-date div { display:flex; flex-direction:column; text-align:left; }
.preview-date b { text-transform:uppercase; letter-spacing:.12em; font-size:9px; }
.preview-date small { font-size:8px; opacity:.65; margin-top:4px; }
.preview-open { margin-top:31px; border:0; border-radius:999px; padding:12px 20px; background:var(--preview-text,#304137); color:var(--preview-bg,#eaf0e7); font-size:9px; }
.preview-scroll { position:absolute; bottom:20px; font-size:7px; letter-spacing:.1em; text-transform:uppercase; opacity:.5; display:flex; gap:7px; }
.preview-section { padding:65px 35px; text-align:center; border-top:1px solid color-mix(in srgb,var(--preview-text,#304137) 10%,transparent); position:relative; }
.preview-section h2 { font-family:var(--preview-display,"Italiana"); font-size:35px; font-weight:400; margin:12px 0 19px; }
.preview-section > p { font-size:10px; line-height:1.7; opacity:.75; }
.preview-countdown { background:color-mix(in srgb,var(--preview-bg,#eaf0e7) 75%,white); }
.preview-countdown > div { display:flex; justify-content:center; gap:10px; margin-top:28px; }
.preview-countdown > div span { width:72px; height:80px; border-radius:18px; background:rgba(255,255,255,.48); border:1px solid rgba(255,255,255,.68); display:flex; flex-direction:column; align-items:center; justify-content:center; }
.preview-countdown b { font-family:var(--preview-display,"Italiana"); font-size:27px; font-weight:400; }
.preview-countdown small { font-size:7px; text-transform:uppercase; letter-spacing:.1em; opacity:.6; }
.story-photo { height:210px; margin-top:25px; border-radius:100px 100px 16px 16px; background:linear-gradient(145deg,color-mix(in srgb,var(--preview-accent,#a08362) 30%,white),color-mix(in srgb,var(--preview-bg,#eaf0e7) 70%,#cab8a7)); position:relative; overflow:hidden; }
.story-photo::before { content:"A + D"; position:absolute; inset:0; display:grid; place-items:center; font-family:var(--preview-display,"Italiana"); font-size:42px; opacity:.45; }
.preview-event { background:var(--preview-text,#304137); color:var(--preview-bg,#eaf0e7); }
.preview-event .preview-section-label { color:color-mix(in srgb,var(--preview-accent,#a08362) 50%,white); }
.event-date-card { display:flex; align-items:center; gap:16px; background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.12); padding:14px 18px; border-radius:18px; text-align:left; margin:25px 0 18px; }
.event-date-card > b { font-family:var(--preview-display,"Italiana"); font-size:42px; font-weight:400; border-right:1px solid rgba(255,255,255,.17); padding-right:16px; }
.event-date-card div { display:flex; flex-direction:column; gap:5px; }
.event-date-card span { font-size:9px; text-transform:uppercase; letter-spacing:.12em; }
.event-date-card small { font-size:8px; opacity:.65; }
.preview-event > p { opacity:.65; }
.preview-event > button, .preview-guestbook > button { margin-top:14px; border:1px solid rgba(255,255,255,.25); background:transparent; color:inherit; border-radius:999px; padding:10px 15px; font-size:8px; }
.preview-map { background:color-mix(in srgb,var(--preview-bg,#eaf0e7) 86%,white); }
.map-art { height:170px; border-radius:20px; background:linear-gradient(135deg,#ddd7cf,#f5f1ec); position:relative; overflow:hidden; margin:25px 0 18px; }
.map-art::before, .map-art::after, .map-art i { content:""; position:absolute; width:260px; height:1px; background:#c7beb5; transform:rotate(25deg); left:-20px; top:50%; }
.map-art::after { transform:rotate(-32deg); top:38%; }
.map-art i { transform:rotate(80deg); top:50%; left:30px; }
.map-art span { position:absolute; left:56%; top:47%; width:33px; height:33px; border-radius:50% 50% 50% 0; transform:rotate(-45deg); background:var(--preview-text,#304137); color:#fff; display:grid; place-items:center; font-size:13px; }
.map-art span::first-letter { transform:rotate(45deg); }
.preview-map > div:last-child { display:flex; justify-content:center; gap:8px; }
.preview-map button { border:1px solid color-mix(in srgb,var(--preview-text,#304137) 18%,transparent); background:rgba(255,255,255,.45); color:inherit; border-radius:999px; padding:9px 14px; font-size:8px; }
.preview-rsvp { background:#f9f6f1; color:#393532; text-align:left; }
.preview-rsvp > .preview-section-label, .preview-rsvp > h2 { display:block; text-align:center; }
.preview-rsvp label { display:flex; flex-direction:column; gap:6px; margin-top:12px; font-size:8px; color:#6f6863; }
.preview-rsvp input, .preview-rsvp select { border:1px solid #ddd5cc; background:#fff; border-radius:10px; padding:11px; font-size:9px; }
.preview-choice { display:grid; grid-template-columns:1fr 1fr; gap:7px; margin-top:12px; }
.preview-choice button { border:1px solid #ddd5cc; background:#fff; border-radius:10px; padding:10px; font-size:8px; }
.preview-choice button.selected { background:#435047; color:#fff; border-color:#435047; }
.preview-submit { width:100%; border:0; background:#435047; color:#fff; border-radius:999px; padding:12px; margin-top:17px; font-size:9px; }
.preview-gallery { background:color-mix(in srgb,var(--preview-bg,#eaf0e7) 80%,white); }
.preview-gallery > div { display:grid; grid-template-columns:1.2fr .8fr; grid-template-rows:100px 100px; gap:7px; margin-top:24px; }
.preview-gallery i { display:block; border-radius:14px; background:linear-gradient(145deg,color-mix(in srgb,var(--preview-accent,#a08362) 28%,white),color-mix(in srgb,var(--preview-bg,#eaf0e7) 60%,#bba99a)); }
.preview-gallery i:first-child { grid-row:1/3; }
.preview-gallery i:nth-child(2){background:linear-gradient(145deg,#d8c2ba,#f4e6df)}
.preview-gallery i:nth-child(3){background:linear-gradient(145deg,#b7c5b6,#e5eee2)}
.preview-gift { background:#f6efe8; color:#4a3f38; }
.preview-qr { width:125px; height:125px; margin:22px auto 0; border:12px solid #fff; border-radius:12px; background:repeating-conic-gradient(#3d3935 0 25%,transparent 0 50%) 50% / 18px 18px; }
.preview-guestbook { background:var(--preview-text,#304137); color:var(--preview-bg,#eaf0e7); }
.preview-guestbook .preview-section-label { color:color-mix(in srgb,var(--preview-accent,#a08362) 50%,white); }
.preview-guestbook blockquote { margin:27px 0 0; padding:20px; border:1px solid rgba(255,255,255,.14); border-radius:17px; font-family:var(--preview-display,"Italiana"); font-size:21px; line-height:1.35; }
.preview-guestbook blockquote small { display:block; margin-top:10px; font-family:var(--preview-body,"DM Sans"); font-size:8px; opacity:.6; }
.preview-footer { padding:55px 35px 35px; text-align:center; background:#f9f6f1; color:#48413c; }
.preview-footer p { font-size:9px; }
.preview-footer > small { display:block; margin-top:30px; font-size:7px; opacity:.5; text-transform:uppercase; letter-spacing:.12em; }
.music-fab { position:absolute; top:18px; right:17px; width:32px; height:32px; border-radius:50%; border:1px solid color-mix(in srgb,var(--preview-text,#304137) 15%,transparent); background:rgba(255,255,255,.42); color:var(--preview-text,#304137); }
.petal { position:absolute; top:55px; color:var(--preview-accent,#a08362); opacity:.18; pointer-events:none; animation:petalFall 12s linear infinite; }
.petal-one { left:12%; }.petal-two{left:57%;animation-delay:-4s}.petal-three{left:84%;animation-delay:-8s}
@keyframes petalFall { from{transform:translateY(-40px) rotate(0deg)} to{transform:translateY(980px) rotate(360deg)} }
.preview-ivory { --preview-bg:#f8f4ed; --preview-text:#443d38; --preview-accent:#b28f66; }
.preview-sage { --preview-bg:#eaf0e7; --preview-text:#304137; --preview-accent:#a08362; }
.preview-blush { --preview-bg:#f3dfda; --preview-text:#604a45; --preview-accent:#a8766d; }
.preview-songket { --preview-bg:#4b3637; --preview-text:#f4e8da; --preview-accent:#d7b576; }
.preview-celadon { --preview-bg:#dce9df; --preview-text:#30483d; --preview-accent:#936f58; }
.preview-marigold { --preview-bg:#f1d19f; --preview-text:#643b28; --preview-accent:#9d5936; }
.preview-songket .preview-hero { background-image:linear-gradient(45deg,rgba(215,181,118,.08) 25%,transparent 25%),linear-gradient(-45deg,rgba(215,181,118,.08) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,rgba(215,181,118,.08) 75%),linear-gradient(-45deg,transparent 75%,rgba(215,181,118,.08) 75%); background-size:34px 34px; }

/* Full preview */
.full-preview-view.is-active { display:flex; flex-direction:column; background:#e8e4df; min-height:100vh; }
.preview-bar { min-height:65px; background:#fbfaf8; border-bottom:1px solid #ddd6cf; padding:11px 20px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:15px; position:sticky; top:0; z-index:100; }
.preview-bar > div:nth-child(2) { text-align:center; display:flex; flex-direction:column; gap:3px; }
.preview-bar span { font-size:9px; color:var(--muted); }
.preview-bar b { font-size:10px; }
.preview-bar > div:last-child { display:flex; justify-content:flex-end; gap:8px; }
.full-preview-stage { padding:40px 20px 90px; display:flex; justify-content:center; }
.full-phone { width:390px; }
.full-phone .phone-top { display:none; }
.full-phone .wedding-preview { border-radius:28px; }

/* Modals */
.modal { position:fixed; inset:0; z-index:3000; display:none; align-items:center; justify-content:center; padding:22px; }
.modal.is-open { display:flex; }
.modal-backdrop { position:absolute; inset:0; background:rgba(28,25,23,.48); backdrop-filter:blur(6px); }
.modal-card { position:relative; z-index:1; width:min(620px,100%); max-height:calc(100vh - 44px); overflow:auto; background:#fffdf9; border-radius:28px; padding:34px; box-shadow:0 35px 90px rgba(0,0,0,.25); animation:modalIn .25s ease both; }
@keyframes modalIn { from{opacity:0;transform:translateY(12px) scale(.98)} to{opacity:1;transform:none} }
.modal-close { position:absolute; right:18px; top:16px; width:32px; height:32px; border-radius:50%; border:1px solid #e1dad3; background:#fff; font-size:19px; color:#6e6761; }
.modal-icon { width:52px; height:52px; border-radius:16px; display:grid; place-items:center; margin-bottom:19px; }
.canva-logo { background:linear-gradient(145deg,#825ae8,#1ab3be); color:#fff; font-weight:700; font-size:23px; }
.modal-card h2 { font-family:var(--display); font-size:38px; line-height:1.08; font-weight:400; margin:10px 0 13px; }
.modal-card > p { color:var(--muted); line-height:1.65; font-size:12px; }
.canva-steps { display:flex; flex-direction:column; margin:24px 0 18px; }
.canva-steps > div { display:flex; gap:13px; padding:13px 0; border-top:1px solid #ece6e0; }
.canva-steps > div > span { width:27px; height:27px; border-radius:50%; background:#eee9e3; display:grid; place-items:center; font-size:9px; flex:0 0 auto; }
.canva-steps p { margin:0; display:flex; flex-direction:column; gap:4px; }
.canva-steps b { font-size:10px; }
.canva-steps small { color:var(--muted); font-size:9px; }
.modal-note { display:flex; gap:10px; background:#f1ece6; border-radius:13px; padding:12px; }
.modal-note > span { width:22px; height:22px; border-radius:50%; background:#fff; display:grid; place-items:center; font-size:9px; }
.modal-note p { margin:0; color:var(--muted); font-size:9px; line-height:1.5; }
.modal-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:22px; }
.checkout-modal-card { width:min(880px,100%); }
.checkout-layout { display:grid; grid-template-columns:1.2fr .8fr; gap:22px; margin-top:22px; }
.checkout-plans { display:flex; flex-direction:column; gap:9px; }
.checkout-plan input { position:absolute; opacity:0; }
.checkout-plan > span { display:grid; grid-template-columns:22px 1fr auto; align-items:center; gap:11px; border:1px solid #ddd6cf; border-radius:14px; padding:14px; cursor:pointer; }
.checkout-plan > span > i { width:18px; height:18px; border:1.5px solid #b7aea6; border-radius:50%; position:relative; }
.checkout-plan input:checked + span { border-color:#718173; box-shadow:0 0 0 3px rgba(113,129,115,.12); background:#f5f8f3; }
.checkout-plan input:checked + span > i::after { content:""; position:absolute; inset:4px; background:#667769; border-radius:50%; }
.checkout-plan div { display:flex; flex-direction:column; gap:4px; }
.checkout-plan b { font-size:11px; }
.checkout-plan small { color:var(--muted); font-size:8px; }
.checkout-plan strong { font-family:var(--display); font-size:24px; font-weight:400; }
.payment-methods { margin-top:10px; }
.payment-methods h3 { font-size:10px; text-transform:uppercase; letter-spacing:.1em; color:#7b746e; margin:4px 0 8px; }
.payment-methods label { display:grid; grid-template-columns:42px 1fr; align-items:center; gap:10px; padding:10px 0; border-top:1px solid #eee8e2; position:relative; }
.payment-methods label input { position:absolute; right:3px; accent-color:#667769; }
.payment-symbol { width:36px; height:28px; border-radius:8px; background:#edf2f9; color:#345889; display:grid; place-items:center; font-size:8px; font-weight:700; }
.payment-symbol.qr { background:#f2ede6; color:#4c4742; }.payment-symbol.card{background:#e7ece4;color:#4b5f50;font-size:15px}
.payment-methods label div { display:flex; flex-direction:column; gap:3px; }
.payment-methods b { font-size:9px; }
.payment-methods small { color:var(--muted); font-size:8px; }
.order-summary { background:#f2eee8; border-radius:18px; padding:20px; align-self:start; }
.order-summary h3 { margin:0 0 17px; font-size:12px; }
.order-summary > div { display:flex; justify-content:space-between; gap:20px; padding:8px 0; font-size:9px; }
.order-summary hr { border:0; border-top:1px solid #ded6ce; margin:10px 0; }
.order-summary .summary-total { align-items:baseline; }
.order-summary .summary-total span { font-weight:700; }
.order-summary .summary-total b { font-family:var(--display); font-size:29px; font-weight:400; }
.order-summary p { color:var(--muted); font-size:8px; line-height:1.6; }
.order-summary > small { display:block; text-align:center; color:var(--muted); font-size:7px; margin-top:9px; }
.compact-modal-card { width:min(520px,100%); }
.compact-modal-card form { margin-top:22px; }

@media (max-width: 1100px) {
  .desktop-nav { display:none; }
  .site-header { grid-template-columns:1fr 1fr; }
  .hero { grid-template-columns:1fr; padding-top:70px; }
  .hero-copy { max-width:720px; }
  .hero-visual { width:min(620px,100%); margin:0 auto; }
  .trust-inner { flex-wrap:wrap; justify-content:center; padding:18px 0; }
  .steps-grid { grid-template-columns:repeat(2,1fr); }
  .studio-theme-grid { grid-template-columns:repeat(3,1fr); }
  .app-view.is-active { grid-template-columns:210px 1fr; }
  .overview-grid { grid-template-columns:1fr 1fr; }
  .overview-primary { grid-column:1/-1; }
  .editor-actions .button-soft:first-child { display:none; }
  .editor-workspace { grid-template-columns:64px 320px minmax(0,1fr); }
  .editor-topbar .brand-copy { display:none; }
  .device-stage { padding-left:30px; padding-right:30px; }
}

@media (max-width: 860px) {
  .shell { width:min(100% - 30px,1180px); }
  .header-actions .button-ghost { display:none; }
  .hero { min-height:auto; padding-top:50px; }
  .hero-copy h1 { font-size:58px; }
  .feature-grid, .feature-wide { grid-template-columns:1fr; }
  .feature-wide { grid-column:auto; }
  .theme-gallery { grid-template-columns:repeat(2,1fr); }
  .pricing-grid { grid-template-columns:1fr; max-width:520px; }
  .price-card.popular { transform:none; }
  .final-cta { grid-template-columns:1fr; text-align:center; justify-items:center; }
  .site-footer { flex-direction:column; justify-content:center; padding:35px 0; }
  .app-view.is-active { grid-template-columns:1fr; }
  .app-sidebar { position:fixed; left:-250px; width:244px; transition:.25s ease; box-shadow:20px 0 50px rgba(0,0,0,.15); }
  .app-sidebar.is-open { left:0; }
  .mobile-menu { display:block; border:0; background:transparent; font-size:19px; }
  .app-topbar { padding:0 18px; }
  #appBreadcrumb { display:none; }
  .app-page { padding:28px 18px 45px; }
  .dashboard-columns { grid-template-columns:1fr; }
  .studio-theme-grid { grid-template-columns:repeat(2,1fr); }
  .guest-stats { grid-template-columns:repeat(2,1fr); }
  .editor-topbar { grid-template-columns:1fr auto; }
  .editor-center { display:none; }
  .editor-actions .canva-button { display:none; }
  .editor-workspace { grid-template-columns:62px 320px 1fr; }
  .canvas-area { min-width:450px; }
  .checkout-layout { grid-template-columns:1fr; }
}

@media (max-width: 640px) {
  .site-header { height:76px; }
  .brand-mark { width:36px; height:36px; }
  .brand-copy strong { font-size:20px; }
  .header-actions .button-dark { padding:10px 13px; }
  .hero-copy h1 { font-size:49px; }
  .hero-copy > p { font-size:15px; }
  .hero-actions { flex-direction:column; align-items:stretch; }
  .hero-trust { align-items:flex-start; }
  .hero-visual { min-height:510px; transform:scale(.88); transform-origin:top center; margin-bottom:-60px; }
  .invite-card { right:15px; }
  .mini-editor-card { left:-28px; }
  .rsvp-card { right:-25px; }
  .section { padding-top:84px; padding-bottom:84px; }
  .section-heading.row { align-items:flex-start; flex-direction:column; }
  .section-heading h2 { font-size:43px; }
  .feature-card { padding:26px; }
  .feature-editor-mock { grid-template-columns:44px 1fr 80px; height:250px; }
  .canva-flow { grid-template-columns:1fr; }
  .flow-line, .flow-line.reverse { grid-column:auto; grid-row:auto; transform:rotate(90deg); }
  .theme-gallery { grid-template-columns:1fr; }
  .steps-grid { grid-template-columns:1fr; }
  .final-cta { padding:42px 24px; }
  .final-cta h2 { font-size:42px; }
  .site-footer > div { flex-wrap:wrap; justify-content:center; }
  .app-page-head { flex-direction:column; }
  .overview-grid { grid-template-columns:1fr; }
  .overview-primary { grid-column:auto; }
  .invitation-grid { grid-template-columns:1fr; }
  .invitation-project { grid-template-columns:1fr; }
  .project-preview { min-height:300px; }
  .studio-theme-grid { grid-template-columns:1fr; }
  .guest-toolbar { align-items:flex-start; flex-direction:column; }
  .billing-note { align-items:flex-start; flex-wrap:wrap; }
  .editor-topbar { padding:0 8px; }
  .editor-topbar .editor-left .brand { display:none; }
  .editor-separator { display:none; }
  .editor-actions .button-soft { display:none; }
  .editor-workspace { grid-template-columns:54px 1fr; }
  .editor-panel { width:calc(100vw - 54px); }
  .canvas-area { display:none; }
  .editor-rail button { width:48px; }
  .preview-bar { grid-template-columns:1fr auto; }
  .preview-bar > div:nth-child(2) { display:none; }
  .preview-bar > div:last-child .button-soft { display:none; }
  .full-preview-stage { padding-left:0; padding-right:0; }
  .full-phone { width:100%; max-width:390px; }
  .full-phone .wedding-preview { border-radius:0; }
  .modal-card { padding:27px 20px; border-radius:23px; }
  .modal-card h2 { font-size:33px; }
  .modal-actions { flex-direction:column-reverse; }
  .modal-actions .button { width:100%; }
  .form-grid.two { grid-template-columns:1fr; }
}

/* Working MVP interaction states */
.toast[data-type="error"] { background:#8f443d; }
.toast[data-type="success"] { background:#314137; }
.status-pill.published { background:#dce9de; color:#37613e; }
.invitation-project.is-current { border-color:#859487; box-shadow:0 0 0 3px rgba(95,116,99,.11),0 18px 45px rgba(66,54,45,.08); }
.icon-project-action { width:34px; height:34px; border-radius:50%; border:1px solid #ded7d0; background:#fff; color:#8b6f66; padding:0; font-size:16px; }
.icon-project-action:hover { background:#f5e8e4; border-color:#ddc7c1; }
.guest-row-actions { display:flex; align-items:center; gap:5px; }
.guest-row-actions button { border:1px solid #ddd6cf; background:#fff; color:#625d58; border-radius:999px; padding:5px 8px; font-size:8px; }
.guest-row-actions button:hover { background:#f3efea; }
.guest-row-actions button:last-child { color:#9b4d46; }
.guest-status-select { min-width:94px; border:1px solid #ded7d0; border-radius:999px; padding:6px 25px 6px 9px; background:#f3efe9; color:#6d665f; font-size:8px; font-weight:700; outline:0; }
.guest-status-select.attending { background:#e5efe5; color:#3f6846; border-color:#d4e3d5; }
.guest-status-select.declined { background:#f3e5e2; color:#8c4d46; border-color:#ead6d2; }
.empty-table { padding:35px!important; text-align:center; color:var(--muted); }
.empty-activity { display:flex; align-items:center; justify-content:center; min-height:150px; text-align:center; border-top:1px solid #eee8e3; }
.empty-activity p { display:flex; flex-direction:column; gap:5px; }
.empty-activity b { font-size:10px; }
.empty-activity small { color:var(--muted); font-size:8px; }
.media-placeholder.has-image { background-size:cover; background-position:center; }
.media-placeholder.has-image::after { content:""; position:absolute; inset:0; background:linear-gradient(transparent 58%,rgba(0,0,0,.28)); }
.media-placeholder.has-image span { z-index:2; color:#fff; background:rgba(47,44,41,.58); }
.auth-tabs { display:grid; grid-template-columns:1fr 1fr; padding:4px; border-radius:999px; background:#f0ebe5; margin:22px 0 18px; }
.auth-tabs button { border:0; border-radius:999px; padding:10px 12px; background:transparent; color:var(--muted); font-size:10px; font-weight:700; }
.auth-tabs button.is-active { background:#fff; color:var(--ink); box-shadow:0 4px 14px rgba(58,45,36,.08); }
.auth-form { display:grid; gap:2px; }
.auth-form label,.compact-modal-card form>label { display:flex; flex-direction:column; gap:6px; margin-bottom:11px; color:#716a65; font-size:9px; }
.auth-form input,.compact-modal-card form>label input { width:100%; border:1px solid #ddd6cf; border-radius:11px; background:#fbfaf8; padding:11px 12px; outline:0; color:var(--ink); font-size:10px; }
.auth-form input:focus,.compact-modal-card form>label input:focus { border-color:#9eaa9d; box-shadow:0 0 0 3px rgba(158,170,157,.12); }
.auth-divider { display:flex; align-items:center; gap:10px; margin:16px 0; color:#a29b95; font-size:8px; text-transform:uppercase; letter-spacing:.12em; }
.auth-divider::before,.auth-divider::after { content:""; height:1px; flex:1; background:#e8e1da; }
.modal-feedback { min-height:18px; margin:11px 0 0; text-align:center; font-size:9px; color:var(--muted); }
.modal-feedback[data-tone="error"],.modal-feedback.error { color:#9b4d46; }
.modal-feedback[data-tone="success"],.modal-feedback.success { color:#47704d; }
.upload-zone.small { padding:22px 18px; margin-top:18px; }
.manual-canva-row { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
.button.canva-button { background:linear-gradient(135deg,#765ee8,#24a8b3); color:#fff; }
.button.canva-button>span { width:21px; height:21px; border-radius:50%; display:grid; place-items:center; background:rgba(255,255,255,.18); }
.filter-button { border:0; border-radius:999px; background:transparent; color:var(--muted); padding:7px 10px; font-size:8px; }
.filter-button.is-active,.filter-button:hover { background:#e9e4de; color:var(--ink); }
.guest-toolbar>div:last-child { display:flex; gap:3px; flex-wrap:wrap; }
.upgrade-card.is-active-plan { background:#edf1e9; border-color:#d8e1d4; }
.upgrade-card.is-active-plan > span { color:#4f6954; }
.task-list input:disabled { opacity:1; cursor:default; }
.field-note{margin:8px 0 0;color:var(--muted);font-size:10px;line-height:1.55}.add-section-button:disabled,.media-add:disabled,.icon-button:disabled,.kebab:disabled{cursor:not-allowed;opacity:.55}

/* v1.1 editable botanical theme system */
.ws-floral-svg { width:100%; height:100%; display:block; overflow:visible; }
.ws-density-extra { opacity:var(--ws-extra-opacity,1); transition:opacity .25s ease; }
.theme-decor-layer { position:absolute; inset:-3%; z-index:0; pointer-events:none; }
.theme-decor-layer .ws-floral-svg { width:100%; height:100%; }
.theme-preview > small,.theme-preview > b,.theme-preview > p,.theme-preview > .theme-venue { position:relative; z-index:2; }
.theme-venue { margin-top:10px; font-size:7px; letter-spacing:.14em; text-transform:uppercase; opacity:.68; }
.theme-gardenarch { background:linear-gradient(180deg,#f8f6ee 0%,#f0eee4 100%); color:#5a5147; }
.theme-gardenarch b { font-family:"Allura",cursive; font-size:48px; line-height:.8; }
.theme-gardenarch small { color:#768266; }
.theme-gardenarch p { color:#69715e; }
.theme-pearlbotanic { background:linear-gradient(180deg,#fff 0%,#f8f6f1 100%); color:#474644; }
.theme-pearlbotanic b { font-family:"Cormorant Garamond",Georgia,serif; font-size:33px; letter-spacing:.09em; text-transform:uppercase; }
.theme-pearlbotanic small { color:#8e7a60; max-width:155px; line-height:1.5; }
.theme-olivegarden { background:linear-gradient(180deg,#f2f4ed 0%,#e5eadf 100%); color:#46503f; }
.theme-olivegarden b { font-family:"Allura",cursive; font-size:46px; line-height:.83; }
.theme-magnolialinen { background:linear-gradient(160deg,#f7f4ef,#ebe5dd); color:#554e47; }
.theme-magnolialinen b { font-family:"Cormorant Garamond",Georgia,serif; font-size:37px; font-style:italic; }
.featured-theme .theme-preview { box-shadow:0 24px 55px rgba(83,74,61,.16); }
.editable-badge { display:inline-flex; align-items:center; min-height:22px; padding:4px 8px; border:1px solid #d8d2ca; border-radius:999px; background:#f8f5f1; color:#657265; font-size:7.5px; font-weight:700; letter-spacing:.04em; text-transform:none; }
.floral-studio { padding:16px; margin-left:-8px; margin-right:-8px; border:1px solid #e4ddd4; border-radius:16px; background:linear-gradient(180deg,#fbfaf7,#f5f2ed); }
.floral-studio .form-section-head h3 { margin-bottom:0; }
.floral-note { margin:10px 0 15px; line-height:1.55; }
.decor-color-row { margin-bottom:14px; }
.swatch.gardenarch { background:linear-gradient(135deg,#f7f4ea 0 58%,#758263 58%); }
.swatch.pearlbotanic { background:linear-gradient(135deg,#fbfaf7 0 58%,#aa916b 58%); }
.swatch.olivegarden { background:linear-gradient(135deg,#eef1e7 0 58%,#637557 58%); }
.swatch.magnolialinen { background:linear-gradient(135deg,#f4f1ec 0 58%,#aa8c72 58%); }
.preview-decor-layer { position:absolute; inset:0; z-index:1; pointer-events:none; overflow:hidden; }
.preview-decor-layer::after { content:""; position:absolute; inset:0; opacity:0; pointer-events:none; background-image:radial-gradient(circle at 22% 18%,rgba(80,66,50,.07) 0 .55px,transparent .8px),radial-gradient(circle at 74% 68%,rgba(255,255,255,.65) 0 .6px,transparent .9px); background-size:11px 11px,13px 13px; mix-blend-mode:multiply; }
.wedding-preview.has-paper-texture .preview-decor-layer::after { opacity:.22; }
.preview-hero > :not(.preview-decor-layer) { position:relative; z-index:2; }
.preview-hero.has-cover-art .preview-decor-layer { opacity:.82; }
.preview-gardenarch .preview-hero::before,.preview-gardenarch .preview-hero::after,.preview-pearlbotanic .preview-hero::before,.preview-pearlbotanic .preview-hero::after,.preview-olivegarden .preview-hero::before,.preview-olivegarden .preview-hero::after,.preview-magnolialinen .preview-hero::before,.preview-magnolialinen .preview-hero::after { display:none; }
.preview-gardenarch .preview-hero,.preview-olivegarden .preview-hero { padding-top:98px; padding-bottom:60px; }
.preview-gardenarch .preview-ornament,.preview-pearlbotanic .preview-ornament,.preview-olivegarden .preview-ornament,.preview-magnolialinen .preview-ornament { opacity:.5; font-size:15px; }
.preview-gardenarch .preview-hero h1,.preview-olivegarden .preview-hero h1 { font-size:58px; line-height:.74; margin-top:12px; }
.preview-gardenarch .preview-monogram,.preview-olivegarden .preview-monogram { margin:40px 0 12px; opacity:.68; }
.preview-gardenarch .preview-monogram b,.preview-olivegarden .preview-monogram b { font-size:48px; }
.preview-pearlbotanic .preview-hero { background:linear-gradient(180deg,#fff,#fbfaf7); }
.preview-pearlbotanic .preview-hero h1 { font-size:37px; letter-spacing:.13em; text-transform:uppercase; line-height:1.2; }
.preview-pearlbotanic .preview-monogram { margin:46px 0 32px; }
.preview-pearlbotanic .preview-monogram b { font-size:42px; }
.preview-magnolialinen .preview-hero h1 { font-size:49px; font-style:italic; }
.preview-gardenarch { --preview-bg:#f7f4ea; --preview-text:#5a5147; --preview-accent:#758263; }
.preview-pearlbotanic { --preview-bg:#fbfaf7; --preview-text:#474644; --preview-accent:#aa916b; }
.preview-olivegarden { --preview-bg:#eef1e7; --preview-text:#46503f; --preview-accent:#74805f; }
.preview-magnolialinen { --preview-bg:#f4f1ec; --preview-text:#554e47; --preview-accent:#aa8c72; }
@media(max-width:760px){.theme-gallery{grid-template-columns:repeat(2,1fr)}.theme-picker{grid-template-columns:1fr}.theme-gardenarch b,.theme-olivegarden b{font-size:42px}}

/* Floral theme expansion v1.1 */
.editable-badge { display:inline-flex; align-items:center; border:1px solid #d9d1c8; background:#f7f3ee; color:#6d766b; border-radius:999px; padding:4px 8px; font-size:7px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }
.floral-studio { padding:16px; margin-left:-6px; margin-right:-6px; border:1px solid #e6ddd4; border-radius:16px; background:linear-gradient(145deg,#fffdf9,#f6f2ec); }
.floral-studio .form-section-head { margin-bottom:10px; }
.floral-studio .form-section-head h3 { margin:0; }
.floral-note { margin:-1px 0 14px; line-height:1.55; }
.decor-color-row { margin-bottom:14px; }
.composition-controls { padding:12px; margin:12px 0 15px; border:1px solid #e6ddd4; border-radius:13px; background:rgba(255,255,255,.66); }
.composition-controls .range-label:last-child { margin-bottom:0; }

.theme-preview > small,
.theme-preview > b,
.theme-preview > p,
.theme-preview > i,
.theme-preview > .theme-venue,
.theme-preview > .tiny-label,
.theme-preview > .arabesque { position:relative; z-index:3; }
.theme-decor-layer { position:absolute; inset:0; z-index:1; pointer-events:none; overflow:hidden; }
.theme-decor-layer .ws-floral-svg { width:100%; height:100%; display:block; }
.ws-density-extra { opacity:var(--ws-extra-opacity,1); }
.theme-venue { margin-top:8px; font-size:7px; letter-spacing:.08em; text-transform:uppercase; opacity:.72; }
.theme-gardenarch { background:linear-gradient(180deg,#f8f5ed 0%,#f1ede3 68%,#ebe5d9 100%); color:#5a5147; }
.theme-gardenarch::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(255,255,255,.2),transparent 48%,rgba(117,130,99,.08)); pointer-events:none; }
.theme-gardenarch b { font-family:"Allura",cursive; font-size:48px; line-height:.86; }
.theme-gardenarch b i { font-family:"Cormorant Garamond",serif; font-size:.62em; }
.theme-gardenarch small { margin-bottom:17px; color:#758263; }
.theme-pearlbotanic { background:#fbfaf7; color:#474644; }
.theme-pearlbotanic b { font-family:"Cormorant Garamond",serif; font-size:34px; letter-spacing:.12em; text-transform:uppercase; }
.theme-pearlbotanic small { color:#8e816e; }
.theme-olivegarden { background:linear-gradient(170deg,#f5f5ef,#e8ede2); color:#46503f; }
.theme-olivegarden b { font-family:"Allura",cursive; font-size:46px; line-height:.9; }
.theme-magnolialinen { background:linear-gradient(155deg,#f7f4ef,#eee9e2); color:#554e47; }
.theme-magnolialinen b { font-family:"Cormorant Garamond",serif; font-size:36px; font-weight:500; }
.featured-theme .theme-preview { box-shadow:0 22px 50px rgba(83,73,61,.14); }

.preview-decor-layer { position:absolute; inset:0; z-index:1; pointer-events:none; overflow:hidden; }
.preview-decor-layer .ws-floral-svg { width:100%; height:100%; display:block; }
.preview-hero > :not(.preview-decor-layer) { position:relative; z-index:3; }
.preview-hero > .preview-scroll { position:absolute; }
.wedding-preview.has-paper-texture .preview-decor-layer::after { content:""; position:absolute; inset:0; background-image:radial-gradient(circle at 25% 20%,rgba(90,75,60,.06) 0 .6px,transparent .8px),radial-gradient(circle at 76% 67%,rgba(90,75,60,.045) 0 .55px,transparent .75px); background-size:8px 8px,11px 11px; opacity:.58; mix-blend-mode:multiply; }
.preview-gardenarch { --preview-bg:#f7f4ea; --preview-text:#5a5147; --preview-accent:#758263; }
.preview-pearlbotanic { --preview-bg:#fbfaf7; --preview-text:#474644; --preview-accent:#aa916b; }
.preview-olivegarden { --preview-bg:#eef1e7; --preview-text:#46503f; --preview-accent:#74805f; }
.preview-magnolialinen { --preview-bg:#f4f1ec; --preview-text:#554e47; --preview-accent:#aa8c72; }
.preview-gardenarch .preview-hero::before,
.preview-gardenarch .preview-hero::after,
.preview-pearlbotanic .preview-hero::before,
.preview-pearlbotanic .preview-hero::after,
.preview-olivegarden .preview-hero::before,
.preview-olivegarden .preview-hero::after,
.preview-magnolialinen .preview-hero::before,
.preview-magnolialinen .preview-hero::after { display:none; }
.preview-gardenarch .preview-hero { background:linear-gradient(180deg,#f8f5ed 0%,#f4f0e7 64%,#ede8dd 100%); }
.preview-gardenarch .preview-hero h1,
.preview-olivegarden .preview-hero h1 { font-family:"Allura",cursive; font-size:60px; line-height:.82; }
.preview-gardenarch .preview-hero h1 i,
.preview-olivegarden .preview-hero h1 i { font-family:"Cormorant Garamond",serif; font-size:.5em; }
.preview-gardenarch .preview-monogram,
.preview-olivegarden .preview-monogram { font-family:"Cormorant Garamond",serif; }
.preview-pearlbotanic .preview-hero { background:#fbfaf7; }
.preview-pearlbotanic .preview-hero h1 { font-family:"Cormorant Garamond",serif; font-size:41px; letter-spacing:.1em; text-transform:uppercase; }
.preview-pearlbotanic .preview-monogram { border-color:rgba(71,70,68,.22); }
.preview-magnolialinen .preview-hero { background:linear-gradient(150deg,#f8f5f0,#efebe5); }
.preview-magnolialinen .preview-hero h1 { font-family:"Cormorant Garamond",serif; font-size:49px; }
.preview-gardenarch .preview-ornament,
.preview-pearlbotanic .preview-ornament,
.preview-olivegarden .preview-ornament,
.preview-magnolialinen .preview-ornament { opacity:.5; }

@media (max-width:1100px) {
  .floral-studio { padding:13px; }
}

/* v1.1 finishing refinements */
.composition-controls input[type="range"],.floral-studio input[type="range"]{accent-color:#687967}
.floral-studio select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,#7d756d 50%),linear-gradient(135deg,#7d756d 50%,transparent 50%);background-position:calc(100% - 14px) 50%,calc(100% - 10px) 50%;background-size:4px 4px,4px 4px;background-repeat:no-repeat;padding-right:28px}
@media(max-width:520px){.theme-gallery{grid-template-columns:1fr}.composition-controls{padding:10px}}