gift-note-studio { display:block; margin:42px 0; color:#3d243b; font-family:var(--body, 'DM Sans', sans-serif); }
gift-note-studio *, gift-note-studio *::before, gift-note-studio *::after { box-sizing:border-box; }
gift-note-studio [hidden] { display:none!important; }
gift-note-studio[print-order] :is(.gns-formats,.gns-preview,.gns-finished) { display:none!important; }
gift-note-studio .gns-shell { padding:38px; border:1px solid #3d243b24; background:#f6f3eb; }
gift-note-studio .gns-eyebrow { margin:0 0 15px; font-size:9px; font-weight:700; letter-spacing:.12em; }
gift-note-studio .gns-heading h3 { margin:0; font-family:var(--display, 'Arial Narrow', sans-serif); font-size:clamp(38px,4vw,60px); font-weight:600; text-transform:uppercase; letter-spacing:-.02em; line-height:.97; }
gift-note-studio .gns-product { margin:17px 0 0; font-size:12px; line-height:1.7; }
gift-note-studio .gns-formats { display:grid; grid-template-columns:1fr 1fr; gap:8px; max-width:420px; margin:23px 0 16px; }
gift-note-studio .gns-formats button { min-height:65px; display:flex; flex-direction:column; align-items:flex-start; gap:5px; padding:12px; border:1px solid #b9b2c0; background:transparent; font-size:12px; text-align:left; }
gift-note-studio .gns-formats button>span { font-size:9px; font-weight:400; opacity:.8; }
gift-note-studio .gns-formats [aria-pressed="true"] { border-color:#233b9d; background:#233b9d; color:#fff; }
gift-note-studio[data-kind="dedication"] .gns-disclosure { padding:13px 15px; border-left:2px solid #233b9d; background:#e9eaf1; color:#3d243b; }
gift-note-studio .gns-disclosure { max-width:600px; margin:11px 0 29px; font-size:11px; line-height:1.7; color:#6b5b66; }
gift-note-studio .gns-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:48px; }
gift-note-studio .gns-editor { min-width:0; }
gift-note-studio label { display:block; font-size:11px; font-weight:700; line-height:1.6; }
gift-note-studio .gns-names { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:19px; }
gift-note-studio input, gift-note-studio textarea { display:block; width:100%; min-height:48px; margin-top:6px; padding:12px; border:1px solid #c6bac0; border-radius:0; background:#fffdf8; color:#3d243b; font:400 14px/1.6 var(--body, 'DM Sans', sans-serif); }
gift-note-studio textarea { min-height:140px; resize:vertical; }
gift-note-studio input::placeholder, gift-note-studio textarea::placeholder { color:#877380; opacity:1; }
gift-note-studio button { min-height:44px; color:inherit; font:600 11px/1.4 var(--body, 'DM Sans', sans-serif); cursor:pointer; }
gift-note-studio button:focus-visible, gift-note-studio input:focus-visible, gift-note-studio textarea:focus-visible { outline:3px solid #233b9d; outline-offset:4px; }
gift-note-studio button:disabled { opacity:.5; cursor:default; }
gift-note-studio .gns-writing-tools { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:2px; }
gift-note-studio .gns-help { display:flex; gap:15px; align-items:center; padding:0; border:0; background:transparent; color:#233b9d; text-align:left; }
gift-note-studio .gns-help span[aria-hidden] { font-size:20px; }
gift-note-studio .gns-count { font-size:9px; font-variant-numeric:tabular-nums; color:#6b5b66; white-space:nowrap; }
gift-note-studio .gns-suggestion { margin:11px 0 19px; padding:17px; border-left:2px solid #233b9d; background:#e7e9f1; }
gift-note-studio .gns-suggestion p { margin:0 0 8px; font-size:10px; }
gift-note-studio .gns-suggestion blockquote { margin:0 0 10px; font:italic 17px/1.65 Georgia, serif; }
gift-note-studio .gns-suggestion>div { display:flex; flex-wrap:wrap; gap:8px 17px; }
gift-note-studio .gns-suggestion button { padding:0; border:0; background:transparent; text-decoration:underline; text-underline-offset:4px; }
gift-note-studio .gns-palettes { display:flex; flex-wrap:wrap; gap:4px 13px; margin:17px 0 12px; padding:0; border:0; }
gift-note-studio .gns-palettes legend { margin-bottom:7px; font-size:10px; font-weight:700; }
gift-note-studio .gns-palettes button { display:flex; align-items:center; gap:7px; padding:0; background:none; border:0; font-size:9px; }
gift-note-studio .gns-palettes button>span { display:block; width:24px; height:24px; border:1px solid #3d243b3b; border-radius:50%; background:#fcf7e8; }
gift-note-studio [data-note-palette="lilac"]>span { background:#eee8f1!important; }
gift-note-studio [data-note-palette="apricot"]>span { background:#f7dfcc!important; }
gift-note-studio .gns-palettes [aria-pressed="true"]>span { outline:2px solid #233b9d; outline-offset:3px; }
gift-note-studio .gns-error { margin:0 0 13px; color:#963d29; font-size:11px; line-height:1.6; }
gift-note-studio .gns-error:empty { display:none; }
gift-note-studio .gns-primary { display:flex; justify-content:space-between; align-items:center; gap:20px; min-height:51px; width:100%; padding:13px 16px; border:1px solid #233b9d; background:#233b9d; color:#fff; text-align:left; transition:background-color 180ms, transform 180ms; }
gift-note-studio .gns-primary:hover:not(:disabled) { background:#1c2d78; }
gift-note-studio .gns-primary>span[aria-hidden] { font-size:22px; font-weight:400; }
gift-note-studio .gns-private { margin:12px 0 0; font-size:9px; line-height:1.7; color:#6b5b66; }
gift-note-studio .gns-stage { position:relative; min-width:0; padding:12px 10px 0; isolation:isolate; scroll-margin-top:24px; }
gift-note-studio .gns-paper { position:relative; z-index:2; width:100%; max-width:360px; margin:0 auto; transform:rotate(1.6deg); box-shadow:0 17px 29px #3d243b18, 1px 2px 2px #3d243b16; }
gift-note-studio .gns-paper svg { display:block; width:100%; height:auto; aspect-ratio:105/148; }
gift-note-studio[data-kind="dedication"] .gns-paper { transform:rotate(0deg); box-shadow:-7px 0 0 #e0d7c8,-8px 0 0 #bfb4a3,0 13px 25px #3d243b12; }
gift-note-studio[data-kind="dedication"] .gns-paper svg { aspect-ratio:5.75/8; }
gift-note-studio[data-kind="dedication"] .gns-envelope { display:none!important; }
gift-note-studio[data-kind="dedication"][data-mode="preview"] .gns-paper { animation:gns-page-reveal .8s cubic-bezier(.22,.7,.25,1) both; }
gift-note-studio .gns-paper-caption { position:relative; z-index:2; margin:19px 0 0; text-align:center; color:#6b5b66; font-size:9px; line-height:1.7; }
gift-note-studio .gns-envelope { display:none; position:absolute; z-index:1; left:0; right:0; bottom:14px; height:52%; perspective:700px; }
gift-note-studio .gns-envelope-back { position:absolute; inset:0; background:#cfbbaa; transform:rotate(-4deg); box-shadow:0 9px 18px #3d243b0d; }
gift-note-studio .gns-envelope-flap { position:absolute; z-index:3; top:0; width:100%; height:57%; background:#e3d3c3; clip-path:polygon(0 0,100% 0,50% 100%); transform-origin:top; }
gift-note-studio .gns-envelope-front { position:absolute; z-index:4; inset:0; background:#e1cfbc; clip-path:polygon(0 0,50% 44%,100% 0,100% 100%,0 100%); }
gift-note-studio[data-mode="preview"] .gns-layout { display:block; }
gift-note-studio[data-mode="preview"] .gns-stage { width:min(100%,410px); margin:34px auto 0; padding-inline:20px; }
gift-note-studio[data-mode="preview"] .gns-envelope { display:block; }
gift-note-studio[data-mode="preview"] .gns-paper { animation:gns-letter-reveal 1s cubic-bezier(.22,.7,.25,1) both; }
gift-note-studio[data-mode="preview"] .gns-envelope-flap { animation:gns-envelope-open .65s cubic-bezier(.22,.7,.25,1) both; }
gift-note-studio[data-mode="preview"] .gns-envelope-front { animation:gns-envelope-away .8s .25s cubic-bezier(.22,.7,.25,1) both; }
gift-note-studio .gns-finished { margin:31px auto 0; max-width:480px; }
gift-note-studio .gns-ready { margin:0 0 18px; font:italic 22px/1.45 Georgia,serif; text-align:center; }
gift-note-studio .gns-ready:focus { outline:none; }
gift-note-studio .gns-finish-actions { display:flex; gap:18px; align-items:center; }
gift-note-studio .gns-finish-actions .gns-primary { flex:1; }
gift-note-studio .gns-edit { padding:0 4px; border:0; background:transparent; text-decoration:underline; text-underline-offset:4px; }
gift-note-studio .gns-print-help { margin:15px 0 0; color:#6b5b66; font-size:10px; line-height:1.7; }
gift-note-studio .gns-bottom { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:20px; border-top:1px solid #3d243b1f; padding-top:7px; }
gift-note-studio .gns-status { margin:0; font-size:10px; line-height:1.65; color:#6b5b66; }
gift-note-studio .gns-reset { flex-shrink:0; padding:0; border:0; background:transparent; font-size:9px; text-decoration:underline; text-underline-offset:4px; }
gift-note-studio .gns-reset-confirm { padding:12px 15px; background:#eee5de; }
gift-note-studio .gns-reset-confirm p { font-size:11px; margin:0; }
gift-note-studio .gns-reset-confirm button { padding:0; border:0; margin-right:20px; background:transparent; text-decoration:underline; text-underline-offset:4px; }
@keyframes gns-letter-reveal { 0% { opacity:.25; transform:translateY(12%) rotate(-4deg) scale(.91); } 30% { opacity:1; } 100% { opacity:1; transform:translateY(0) rotate(1.6deg) scale(1); } }
@keyframes gns-envelope-open { to { transform:rotateX(180deg); opacity:0; } }
@keyframes gns-envelope-away { to { opacity:0; transform:translateY(23px); } }
@keyframes gns-page-reveal { from { opacity:.2; transform:perspective(900px) rotateY(-9deg) translateY(8px); } to { opacity:1; transform:perspective(900px) rotateY(0deg) translateY(0); } }
html[data-motion="off"] gift-note-studio *, html[data-motion="off"] gift-note-studio *::before { animation:none!important; transition:none!important; }
html[data-motion="off"] gift-note-studio :is(.gns-envelope-front,.gns-envelope-flap) { opacity:0; }
@media(prefers-reduced-motion:reduce) {
  gift-note-studio *,gift-note-studio *::before { animation:none!important; transition:none!important; }
  gift-note-studio :is(.gns-envelope-front,.gns-envelope-flap) { opacity:0; }
}
@media(max-width:760px) {
  gift-note-studio .gns-shell { padding:26px 20px; }
  gift-note-studio .gns-layout { grid-template-columns:1fr; gap:32px; }
  gift-note-studio .gns-stage { max-width:370px; width:100%; margin-inline:auto; }
  gift-note-studio .gns-heading h3 { font-size:44px; }
  gift-note-studio input,gift-note-studio textarea { font-size:16px; }
}
@media(max-width:390px) {
  gift-note-studio .gns-shell { padding:23px 14px; }
  gift-note-studio .gns-heading h3 { font-size:38px; }
  gift-note-studio .gns-names { grid-template-columns:1fr; gap:16px; }
  gift-note-studio .gns-finish-actions { flex-direction:column; align-items:stretch; gap:6px; }
  gift-note-studio .gns-palettes { gap:4px 11px; }
  gift-note-studio[data-mode="preview"] .gns-stage { padding-inline:10px; }
}