@import"https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Instrument+Serif:ital@0;1&family=Marcellus&family=Outfit:wght@400;500;700&family=Playfair+Display:wght@600;700;800&family=Plus+Jakarta+Sans:wght@500;700;800&family=Sora:wght@500;700;800&display=swap";:root{--pine-900: #12352a;--pine-700: #2a6d56;--pine-500: #3f9274;--sand-100: #fbf4df;--sand-200: #f1ddb0;--ink: #13241e;--muted: rgba(19, 36, 30, .7);--line: rgba(15, 64, 49, .18);--glass: rgba(255, 251, 242, .86)}*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:Outfit,Trebuchet MS,sans-serif;color:var(--ink);background:radial-gradient(circle at 7% 16%,rgba(141,207,173,.42) 0%,transparent 44%),radial-gradient(circle at 86% 9%,rgba(242,206,133,.44) 0%,transparent 42%),linear-gradient(160deg,#f6edcd,#e0f1de 48%,#f6ebc8);padding:14px}body.no-scroll{overflow:hidden;overscroll-behavior:none;touch-action:none}.bg-glow{position:fixed;border-radius:50%;z-index:-1;filter:blur(80px);animation:drift 12s ease-in-out infinite}.bg-a{width:220px;height:220px;left:-90px;top:-70px;background:#287d5c54}.bg-b{width:260px;height:260px;right:-110px;bottom:-110px;background:#e8b66654;animation-delay:.6s}.app-shell{width:100%;margin:0 auto;max-width:1140px}.hero{border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:20px;box-shadow:0 14px 34px #0c322524;padding:16px}.eyebrow{margin:0;letter-spacing:1px;text-transform:uppercase;font-size:11px;font-weight:700;color:var(--pine-700)}h1{margin:8px 0;font-family:Sora,Trebuchet MS,sans-serif;font-size:27px;line-height:1.15}.hero p{margin:0;color:var(--muted)}.tabs{margin-top:12px;display:grid;grid-template-columns:1fr;gap:10px}.tab-button{border:1px solid rgba(30,92,70,.28);border-radius:14px;padding:12px;font:inherit;font-weight:700;background:#fffcf4;color:var(--pine-900);cursor:pointer;transition:background .2s ease,color .2s ease,transform .2s ease,box-shadow .2s ease}.tab-button .tab-button:hover:not(.active){background:#f0f7f3;border-color:#2a6d566b}.tab-button.active{background:linear-gradient(130deg,var(--pine-700),#ca9948);color:#fff;box-shadow:0 10px 24px #1f654f47}.tab-panel{display:none;margin-top:12px}.tab-panel.active{display:block;animation:fadeSlideIn .22s ease both;@keyframes fadeSlideIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}}.card{border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:20px;box-shadow:0 14px 34px #0c322524;padding:16px}h2{margin:0;font-family:Sora,Trebuchet MS,sans-serif;font-size:20px}.card>p{margin:8px 0 14px;color:var(--muted)}label{display:block;margin:10px 0 5px;font-size:14px;font-weight:600}input,select{width:100%;font:inherit;border:1px solid rgba(14,58,45,.26);border-radius:12px;padding:10px 11px;background:#fffeff;color:var(--ink)}input:focus,select:focus{outline:none;border-color:#247c5bcc;box-shadow:0 0 0 3px #247c5b29}input[type=color]{min-height:44px;padding:4px}input[type=range]{accent-color:var(--pine-500);padding:0}.helper{margin:9px 0 0;color:#13241e9e;font-size:13px}.studio-mobile-hint{display:none;margin-top:8px;align-items:center;gap:6px;opacity:1;transform:translateY(0);transition:opacity .16s ease,transform .16s ease}.studio-mobile-hint.is-hidden{display:none!important}.studio-mobile-hint.is-dismissing{opacity:0;transform:translateY(-3px)}.studio-mobile-hint .hint-icon{display:inline-flex;width:16px;height:16px;color:var(--pine-700)}.studio-mobile-hint .hint-icon svg{width:100%;height:100%;fill:currentColor}.template-preview-list{margin-top:12px;display:grid;gap:12px}.simple-card{border:1px solid var(--line);background:var(--glass);border-radius:18px;padding:12px}.simple-card h3{margin:0;font-size:16px}.card-head,.section-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.card-head h3,.section-head h2{margin:0;min-width:0}.simple-card p{margin:4px 0 10px;color:var(--muted);font-size:13px}.usage-pill{display:inline-flex;align-items:center;flex:0 0 auto;gap:5px;border:1px solid rgba(30,92,70,.25);border-radius:999px;padding:4px 8px;background:#ffffffbf;font-size:11px;font-weight:700;line-height:1;color:var(--pine-900)}.usage-icon{display:inline-flex;align-items:center;justify-content:center;width:12px;height:12px;color:currentColor;opacity:.88}.usage-icon svg{width:100%;height:100%;fill:currentColor}.usage-count{min-width:1ch}.usage-count.usage-pop{animation:usagePop .18s ease-out}@keyframes usagePop{0%{transform:scale(1)}45%{transform:scale(1.16)}to{transform:scale(1)}}@media(prefers-reduced-motion:reduce){.usage-count.usage-pop{animation:none}}.usage-pill-frame{background:#ffffffbf}.usage-pill-gallery{background:#e2f6eddb;border-color:#2a6d5657;color:#1b5844}.usage-pill-studio{background:#f3e8c9d1;border-color:#7e5d2442;color:#6c4d1f}.usage-pill.offline{color:#8f5a1a}.canvas-shell{position:relative;width:100%;overflow:hidden;border-radius:12px;border:1px solid rgba(13,52,40,.2);background:#fff}.canvas-skeleton{position:absolute;inset:0;background:linear-gradient(110deg,#fff0 20%,#ffffffb3,#fff0 52%),linear-gradient(180deg,#e1ede5eb,#f2e9d2e0);background-size:200% 100%,100% 100%;animation:shimmerSlide 1.15s linear infinite;transition:opacity .22s ease}.simple-canvas{width:100%;height:100%;display:block;background:#fff;opacity:0;transition:opacity .22s ease}.canvas-shell.is-loaded .canvas-skeleton{opacity:0;pointer-events:none}.canvas-shell.is-loaded .simple-canvas{opacity:1}@keyframes shimmerSlide{0%{background-position:200% 0,0 0}to{background-position:-20% 0,0 0}}.simple-actions{margin-top:10px;display:grid;grid-template-columns:1fr 1fr;gap:8px}.small-btn,.actions button{border:0;border-radius:12px;padding:10px;font:inherit;font-weight:700;cursor:pointer;color:#fff;background:linear-gradient(130deg,var(--pine-700),#ca9948)}.small-btn.ghost,.actions .ghost{color:var(--pine-900);background:#fffdf5;border:1px solid rgba(30,92,70,.3)}.studio-grid{display:grid;gap:14px}.control-row{display:grid;gap:10px;grid-template-columns:1fr}.studio-preview-wrap{border:1px dashed rgba(30,92,70,.36);border-radius:14px;padding:10px;background:#ffffff8c}#studioMeta{margin:0 0 8px;font-size:13px;color:var(--muted)}#studioCanvas{width:100%;height:100%;display:block;border-radius:0;border:0;background:#fff;touch-action:manipulation}#studioCanvas.dragging{cursor:grabbing}.actions{margin-top:12px;display:grid;gap:8px;grid-template-columns:1fr}.preset-tools{margin-top:14px;border:1px dashed rgba(30,92,70,.36);border-radius:12px;padding:12px;background:#ffffff80}.preset-tools h3{margin:0;font-size:16px;font-family:Sora,Trebuchet MS,sans-serif}.preset-tools p{margin:5px 0 10px;font-size:13px;color:var(--muted)}textarea{width:100%;border:1px solid rgba(14,58,45,.26);border-radius:10px;padding:8px;font-family:Consolas,Courier New,monospace;font-size:12px;background:#fff;color:#213126;resize:vertical}.footer{width:min(1140px,100%);margin:12px auto 4px;font-size:13px;color:#14251fc2;display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:center;text-align:center}.footer a{color:var(--pine-700);font-weight:700;text-decoration:none}.footer a:hover{text-decoration:underline}.footer-build{margin-bottom:0;font-size:11px;color:#14251f73}.heart-green{color:#2f9868}@media(min-width:700px){body{padding:20px}.tabs{grid-template-columns:repeat(3,minmax(0,1fr))}.template-preview-list,.control-row{grid-template-columns:repeat(2,minmax(0,1fr))}.actions{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(min-width:980px){.studio-grid{grid-template-columns:420px 1fr;align-items:start}.template-preview-list{grid-template-columns:repeat(3,minmax(0,1fr))}}@keyframes drift{0%,to{transform:translate(0)}50%{transform:translate(20px,-12px)}}.fab-top{position:fixed;right:16px;bottom:24px;width:44px;height:44px;border-radius:50%;background:linear-gradient(130deg,var(--pine-700),#ca9948);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px #0c322559;z-index:98;opacity:0;pointer-events:none;transition:opacity .25s ease,transform .25s ease;transform:translateY(8px)}.fab-top.visible{opacity:1;pointer-events:auto;transform:translateY(0)}.fab-top svg{width:20px;height:20px;fill:#fff}.bottom-nav{display:none;position:fixed;bottom:0;left:0;right:0;height:64px;background:#fffcf4f2;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--line);z-index:100;align-items:stretch}.bottom-nav-btn{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:none;background:transparent;cursor:pointer;font:inherit;font-size:10px;font-weight:600;color:#13241e80;padding:0;position:relative;-webkit-tap-highlight-color:transparent;transition:color .2s}.bottom-nav-btn:before{content:"";position:absolute;top:8px;left:50%;transform:translate(-50%) scaleX(0);width:58px;height:28px;border-radius:14px;background:#2a6d5626;transition:transform .22s cubic-bezier(.34,1.56,.64,1)}.bottom-nav-btn.active{color:var(--pine-700)}.bottom-nav-btn.active:before{transform:translate(-50%) scaleX(1)}.bottom-nav-btn svg{width:22px;height:22px;fill:currentColor;position:relative;z-index:1;transition:transform .2s ease}.bottom-nav-btn.active svg{transform:translateY(-1px)}.bottom-nav-btn span{position:relative;z-index:1}@media(max-width:699px){.tabs{display:none}.studio-controls .studio-preview-wrap{margin:12px 0}.studio-mobile-hint{display:inline-flex}.bottom-nav{display:flex}body{padding-bottom:78px}.fab-top{bottom:80px}}