/* The same clear, cool light palette as the creative workspace. */
:root{--paper:#f5f6f7;--surface:#ffffff;--raised:#eef1f2;--ink:#20272c;--muted:#5f6d77;--secondary:#5f6d77;--line:rgba(32,39,44,.10);--soft:#eef1f2;--accent:#274c46;--accent-hover:#1e3d38;--accent-ink:#ffffff;--font:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;color-scheme:light;font-family:var(--font);color:var(--ink);background:var(--paper);font-synthesis:none}
*{box-sizing:border-box}body{margin:0;font-size:14px;-webkit-font-smoothing:antialiased}::selection{background:#274c4626;color:var(--ink)}button,input,textarea,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:4px}svg{display:block}button svg,a svg{flex:none}h1,h2,h3,p{margin:0}button{color:inherit}[hidden]{display:none!important}
.lb-icon{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.lb-mark{width:32px;height:32px;fill:currentColor}.wordmark{display:inline-flex;align-items:center;gap:11px;white-space:nowrap;font:500 20px/1.2 var(--font);letter-spacing:-.055em}.wordmark .lb-mark{width:32px;height:32px;color:var(--accent)}.wordmark span{transform:translateY(-1px)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:42px;padding:0 20px;border:1px solid var(--line);border-radius:999px;background:transparent;transition:background .2s,transform .2s,box-shadow .2s;font-weight:500;white-space:nowrap}.btn:hover{background:var(--soft)}.btn:active{transform:translateY(1px)}.btn-dark{background:var(--accent);color:var(--accent-ink);border-color:transparent}.btn-dark:hover{background:var(--accent-hover);box-shadow:0 5px 24px #274c4618;transform:translateY(-2px)}.btn-quiet{border-color:transparent;padding-left:0;padding-right:0}.eyebrow{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:500}
.campaign{container-type:inline-size;position:relative;isolation:isolate;aspect-ratio:4/5;overflow:hidden;background:radial-gradient(ellipse at 25% 70%,#f6cc8f 0,transparent 54%),linear-gradient(130deg,#e9c6a2,#edddc6 45%,#d2bd98);color:#383b2c;text-align:left}.campaign:before{content:"";position:absolute;z-index:-1;left:-30%;top:28%;width:115%;aspect-ratio:1;border:1px solid #fff7e185;border-radius:50%;box-shadow:0 0 0 45px #fff8e511,0 0 0 90px #fff8e512;pointer-events:none}.campaign:after{content:"";position:absolute;z-index:-1;left:10%;right:10%;height:8%;bottom:11%;border-radius:50%;background:#49391e35;filter:blur(25px)}.campaign-overline{position:absolute;left:8.5%;top:6%;font:500 2.7cqw/1.4 var(--font);letter-spacing:.19em}.campaign-title{position:absolute;z-index:2;left:8.5%;top:15%;font:400 9.7cqw/1.28 "Songti SC","STSong",Georgia,serif;letter-spacing:-.04em}.campaign-product{position:absolute;object-fit:contain;width:59%;height:66%;left:22%;top:29%;transform:rotate(-7deg);filter:drop-shadow(15px 14px 12px #77613d26);user-select:none;-webkit-user-drag:none}.campaign-footer{position:absolute;z-index:3;left:8.5%;right:8.5%;bottom:5%;display:flex;align-items:center;justify-content:space-between;font:400 2.2cqw/1.4 var(--font);letter-spacing:.05em}.campaign-footer b{font:400 3.9cqw/1 Georgia,serif;letter-spacing:.18em}.campaign[data-theme=sage]{background:radial-gradient(ellipse at 25% 70%,#dbe0c7 0,transparent 54%),linear-gradient(130deg,#b5bea8,#e1e3d5 50%,#a9b398)}
@media(max-width:700px){.wordmark{font-size:21px}.wordmark .lb-mark{width:27px;height:27px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Every state restates the background longhands: the original
   `.btn-dark:hover{background:...}` shorthand resets size, repeat and origin,
   which made the gradient tile with a 1px offset along the edges. */
/* Creation buttons share the studio's action style: a diagonal amber -> green
   gradient, a sheen that glides across on hover, a soft settle on press and a
   click ripple (shared.js). Nothing lifts or sinks. No solid colour sits under
   the gradient: its anti-aliased edge would show as a dark rim on the pill. */
.btn-dark {
  --g-image: linear-gradient(110deg, transparent 38%, #ffffff2b 50%, transparent 62%),
    linear-gradient(to bottom right, #c18a22 0%, #8e893b 13%, #5e7f48 32%, #33634f 62%, #23453f 100%);
  position: relative;
  color: #fffdf7;
  border-color: transparent;
  background-color: transparent;
  background-image: var(--g-image);
  background-size: 250% 100%, 100% 100%;
  background-position: 100% 0, 0 0;
  background-repeat: no-repeat;
  background-origin: border-box;
  box-shadow: none;
  text-shadow: 0 1px 1px #20272c2e;
  letter-spacing: .02em;
  transition: filter .2s ease, background-position .8s cubic-bezier(.22,1,.36,1);
}
.btn-dark:hover,
.btn-dark:active {
  background-color: transparent;
  background-image: var(--g-image);
  background-size: 250% 100%, 100% 100%;
  background-position: 0% 0, 0 0;
  background-repeat: no-repeat;
  background-origin: border-box;
  box-shadow: none;
  filter: brightness(1.04);
  transform: none;
}
.btn-dark:active {
  box-shadow: none;
  filter: brightness(.97);
  transform: none;
}
.ripple-host { position: absolute; inset: 0; overflow: hidden; border-radius: inherit; pointer-events: none; }
.ripple {
  position: absolute;
  border-radius: 50%;
  background: radial-gradient(circle, currentColor 0%, currentColor 40%, transparent 70%);
  opacity: 0;
  transform: scale(0);
  animation: lb-ripple .7s cubic-bezier(.22,1,.36,1) forwards;
  pointer-events: none;
}
.ripple.is-released { animation: lb-ripple .7s cubic-bezier(.22,1,.36,1) forwards, lb-ripple-out .45s ease-out .15s forwards; }
@keyframes lb-ripple { 0% { transform: scale(0); opacity: .2; } 100% { transform: scale(1); opacity: .12; } }
@keyframes lb-ripple-out { to { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .btn-dark { transition: none; }
  .ripple-host { display: none; }
}