:root{--bg-primary:#0e4530;--bg-darker:#0a3324;--bg-accent:#14563c;--text-main:#f4f2ea;--color-yellow:#f3de4b;--color-coral:#ee6b5f;--font-heading:"Space Grotesk", sans-serif;--font-body:"DM Sans", system-ui, sans-serif;--font-handwriting:"Caveat", cursive}*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:var(--text-main);font-family:var(--font-body);-webkit-font-smoothing:antialiased;background:#0e4530;margin:0;overflow-x:hidden}a{color:var(--color-yellow);text-decoration:none}a:hover{color:#fff}input[type=range]{accent-color:var(--color-coral)}::selection{background:var(--color-yellow);color:#0e4530}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:#0a3324}::-webkit-scrollbar-thumb{background:#14563c;border-radius:5px}::-webkit-scrollbar-thumb:hover{background:#ee6b5f}.pm-header{z-index:100;-webkit-backdrop-filter:blur(12px);background:#0e4530d9;border-bottom:1px solid #f4f2ea14;position:sticky;top:0}.pm-header-container{justify-content:space-between;align-items:center;gap:24px;max-width:1400px;margin:0 auto;padding:18px 40px;display:flex}.pm-brand{color:#f4f2ea;align-items:center;gap:11px;text-decoration:none;display:flex}.pm-brand-badge{background:#f3de4b;border-radius:8px;width:26px;height:26px;transition:transform .2s;box-shadow:4px 4px 0 -1px #ee6b5f}.pm-brand:hover .pm-brand-badge{transform:rotate(-6deg)scale(1.08)}.pm-brand-title{letter-spacing:-.02em;font-family:Space Grotesk,sans-serif;font-size:20px;font-weight:700}.pm-brand-tag{color:#f3de4b;letter-spacing:.05em;text-transform:uppercase;background:#f3de4b2e;border-radius:999px;padding:3px 8px;font-size:11px;font-weight:700}.pm-nav{align-items:center;gap:28px;font-size:14.5px;display:flex}.pm-nav-link{color:#f4f2eab8;font-weight:500;text-decoration:none;transition:color .2s}.pm-nav-link:hover{color:#fff}.pm-nav-cta{color:#0e4530;cursor:pointer;background:#f4f2ea;border:none;border-radius:999px;padding:9px 20px;font-size:14px;font-weight:600;transition:all .2s}.pm-nav-cta:hover{color:#0e4530;background:#f3de4b;transform:translateY(-1px);box-shadow:0 4px 12px #f3de4b4d}@media (width<=768px){.pm-header-container{padding:14px 20px}.pm-nav-link{display:none}}.pm-hero{max-width:1400px;margin:0 auto;padding:36px 40px 16px}.pm-hero-grid{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:36px;display:grid}.pm-hero-left{max-width:760px}.pm-hero-tag{letter-spacing:.09em;text-transform:uppercase;color:#f3de4b;align-items:center;gap:8px;margin-bottom:12px;font-size:12px;font-weight:700;display:inline-flex}.pm-tag-dot{background:#f3de4b;border-radius:50%;width:7px;height:7px;animation:2s ease-in-out infinite pm-pulse;box-shadow:0 0 8px #f3de4b99}@keyframes pm-pulse{0%,to{opacity:.6;transform:scale(.9)}50%{opacity:1;transform:scale(1.25)}}.pm-hero-title{letter-spacing:-.035em;color:#f4f2ea;margin:0 0 14px;font-family:Space Grotesk,sans-serif;font-size:clamp(32px,4.4vw,56px);font-weight:700;line-height:1.05}.pm-hero-subtitle{color:#f4f2eabf;max-width:500px;margin:0 0 22px;font-size:16px;line-height:1.45}.pm-hero-cta-group{flex-wrap:wrap;gap:12px;display:flex}.pm-btn-primary{color:#fff6f4;cursor:pointer;background:#ee6b5f;border:none;border-radius:999px;padding:12px 24px;font-size:14.5px;font-weight:600;transition:all .2s;box-shadow:0 6px 18px #ee6b5f4d}.pm-btn-primary:hover{background:#e2564a;transform:translateY(-2px);box-shadow:0 10px 24px #ee6b5f73}.pm-btn-secondary{color:#f4f2ea;cursor:pointer;background:0 0;border:1px solid #f4f2ea47;border-radius:999px;padding:12px 24px;font-size:14.5px;font-weight:600;transition:all .2s}.pm-btn-secondary:hover{background:#f4f2ea1f;border-color:#f4f2ea;transform:translateY(-2px)}.pm-hero-right{flex-direction:column;flex-shrink:0;gap:16px;padding-top:6px;display:flex}.pm-sticky-note{box-sizing:border-box;cursor:default;-webkit-user-select:none;user-select:none;font-family:Caveat,cursive;line-height:1.15;box-shadow:10px 14px 26px #00000052}.note-yellow{color:#3a3208;background:#f3de4b;border-radius:2px;width:155px;height:155px;padding:16px;font-size:21px}.note-coral{color:#4a150f;background:#ee6b5f;border-radius:2px;align-self:flex-end;width:140px;height:140px;padding:14px;font-size:19px}@media (width<=900px){.pm-hero-grid{grid-template-columns:1fr}.pm-hero-right{flex-direction:row;justify-content:flex-start}.note-coral{align-self:flex-start}}@media (width<=600px){.pm-hero{padding:36px 20px 20px}}.pm-studio-section{max-width:1400px;margin:0 auto;padding:40px 40px 0}.pm-studio-card{color:#1b1d19;background:#f4f2ea;border-radius:26px;grid-template-columns:minmax(0,1.55fr) minmax(300px,.95fr);align-items:start;gap:28px;padding:28px;display:grid;box-shadow:0 40px 80px #00000061}.pm-studio-preview-col{flex-direction:column;gap:18px;min-width:0;display:flex}.pm-studio-topbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;display:flex}.pm-device-tabs{background:#e4e1d5;border-radius:999px;gap:6px;padding:5px;display:flex}.pm-device-tab{cursor:pointer;color:#5c5a4f;background:0 0;border:none;border-radius:999px;padding:8px 18px;font-family:DM Sans,sans-serif;font-size:14px;font-weight:500;transition:all .2s}.pm-device-tab.active{color:#f4f2ea;background:#0e4530}.pm-dims-badge{color:#6c6a5e;letter-spacing:.02em;font-family:Space Grotesk,sans-serif;font-size:13.5px;font-weight:600}.pm-canvas-viewport{background:#dedbce;border-radius:18px;justify-content:center;align-items:center;min-height:420px;padding:20px;display:flex}.pm-live-canvas{border-radius:12px;max-width:100%;max-height:520px;display:block;box-shadow:0 16px 40px #00000047}.pm-action-buttons{flex-wrap:wrap;gap:14px;display:flex}.pm-btn-shuffle{color:#f4f2ea;cursor:pointer;background:#0e4530;border:none;border-radius:14px;flex:1;min-width:150px;padding:16px 22px;font-family:DM Sans,sans-serif;font-size:15.5px;font-weight:600;transition:all .2s}.pm-btn-shuffle:hover{background:#14563c;transform:translateY(-1px)}.pm-btn-download{color:#fff6f4;cursor:pointer;background:#ee6b5f;border:none;border-radius:14px;flex:1.4;min-width:180px;padding:16px 22px;font-family:DM Sans,sans-serif;font-size:15.5px;font-weight:600;transition:all .2s;box-shadow:0 6px 20px #ee6b5f40}.pm-btn-download:hover{background:#e2564a;transform:translateY(-1px);box-shadow:0 8px 24px #ee6b5f66}.pm-studio-controls-col{flex-direction:column;gap:24px;min-width:0;display:flex}.pm-control-group{flex-direction:column;display:flex}.pm-control-label{letter-spacing:.12em;text-transform:uppercase;color:#8a887a;margin-bottom:11px;font-family:Space Grotesk,sans-serif;font-size:12px;font-weight:700}.pm-pattern-grid{grid-template-columns:1fr 1fr;gap:8px;max-height:230px;padding-right:4px;display:grid;overflow-y:auto}.pm-pattern-grid::-webkit-scrollbar{width:6px}.pm-pattern-grid::-webkit-scrollbar-thumb{background:#c9c5b2;border-radius:4px}.pm-chip-btn{color:#3a3a33;cursor:pointer;text-align:left;white-space:nowrap;text-overflow:ellipsis;background:#fbfaf5;border:1px solid #d9d5c7;border-radius:10px;padding:9px 12px;font-family:DM Sans,sans-serif;font-size:13.5px;font-weight:500;transition:all .15s;overflow:hidden}.pm-chip-btn.active{color:#f4f2ea;background:#0e4530;border-color:#0e4530}.pm-chip-btn:hover:not(.active){background:#edeae0;border-color:#bebaa9}.pm-palette-list{flex-direction:column;gap:8px;display:flex}.pm-palette-btn{color:#3a3a33;cursor:pointer;background:#fbfaf5;border:1px solid #d9d5c7;border-radius:12px;justify-content:space-between;align-items:center;gap:12px;padding:11px 14px;font-family:DM Sans,sans-serif;font-size:14px;transition:all .15s;display:flex}.pm-palette-btn.active{color:#f4f2ea;background:#0e4530;border-color:#0e4530}.pm-palette-name{font-size:14.5px;font-weight:600}.pm-palette-swatches{gap:5px;display:flex}.pm-swatch{border:1px solid #0000002e;border-radius:5px;width:16px;height:16px;display:block}.pm-palette-btn.active .pm-swatch{border-color:#ffffff73}.pm-sliders-stack{flex-direction:column;gap:18px;display:flex}.pm-slider-header{justify-content:space-between;margin-bottom:7px;font-size:14px;font-weight:500;display:flex}.pm-slider-header span:first-child{color:#4a4940}.pm-slider-val{color:#8a887a;font-weight:600}.pm-range-input{accent-color:#ee6b5f;cursor:pointer;width:100%}.pm-grain-toggle{color:#3a3a33;cursor:pointer;background:#fbfaf5;border:1px solid #d9d5c7;border-radius:12px;justify-content:space-between;align-items:center;padding:12px 14px;font-family:DM Sans,sans-serif;font-size:14.5px;font-weight:500;transition:all .15s;display:flex}.pm-grain-toggle.active{color:#f4f2ea;background:#0e4530;border-color:#0e4530}.pm-grain-dot{background:#d9d5c7;border-radius:999px;width:36px;height:20px;transition:all .2s;display:block;position:relative}.pm-grain-dot.on{background:#f3de4b;box-shadow:inset 16px 0 0 -14px #0e4530}.pm-grain-dot.off{box-shadow:inset -16px 0 0 -14px #8a887a}@media (width<=1000px){.pm-studio-card{grid-template-columns:1fr}}@media (width<=600px){.pm-studio-section{padding:20px 16px 0}.pm-studio-card{border-radius:18px;padding:18px}}.pm-presets-section{max-width:1400px;margin:0 auto;padding:86px 40px 0}.pm-presets-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:28px;display:flex}.pm-presets-title{letter-spacing:-.03em;color:#f4f2ea;margin:0;font-family:Space Grotesk,sans-serif;font-size:clamp(30px,3.4vw,44px);font-weight:700}.pm-presets-sub{color:#f4f2eaa6;max-width:340px;margin:0;font-size:16px}.pm-presets-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:20px;display:grid}.pm-preset-card{cursor:pointer;text-align:left;color:inherit;transition:all .25 ease;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#f4f2ea0d;border:1px solid #f4f2ea29;border-radius:18px;padding:0;font-family:inherit;overflow:hidden}.pm-preset-card:hover{border-color:#f3de4b;transform:translateY(-4px);box-shadow:0 12px 30px #00000059}.pm-preset-thumb{aspect-ratio:16/10;object-fit:cover;border-bottom:1px solid #f4f2ea14;width:100%;display:block}.pm-preset-footer{justify-content:space-between;align-items:center;padding:14px 16px;display:flex}.pm-preset-name{color:#f4f2ea;font-size:14.5px;font-weight:600}.pm-preset-action{color:#f4f2ea8c;font-size:12.5px;font-weight:500;transition:color .2s}.pm-preset-card:hover .pm-preset-action{color:#f3de4b}.pm-loadmore-wrap{justify-content:center;margin-top:36px;display:flex}.pm-loadmore-btn{color:#f4f2ea;cursor:pointer;background:0 0;border:1px solid #f4f2ea4d;border-radius:999px;padding:16px 36px;font-family:DM Sans,sans-serif;font-size:15.5px;font-weight:600;transition:all .2s}.pm-loadmore-btn:hover{color:#0e4530;background:#f3de4b;border-color:#f3de4b;transform:translateY(-2px);box-shadow:0 8px 20px #f3de4b4d}@media (width<=600px){.pm-presets-section{padding:50px 20px 0}}.pm-how-section{max-width:1400px;margin:0 auto;padding:88px 40px 0}.pm-how-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px;display:grid}.pm-how-card{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#f4f2ea0f;border:1px solid #f4f2ea24;border-radius:20px;padding:32px;transition:all .25s}.pm-how-card:hover{border-color:#f4f2ea59;transform:translateY(-4px);box-shadow:0 16px 36px #0000004d}.pm-how-num{margin-bottom:14px;font-family:Space Grotesk,sans-serif;font-size:38px;font-weight:700}.pm-how-title{letter-spacing:-.02em;color:#f4f2ea;margin:0 0 10px;font-family:Space Grotesk,sans-serif;font-size:22px;font-weight:700}.pm-how-desc{color:#f4f2eaad;margin:0;font-size:15.5px;line-height:1.55}@media (width<=600px){.pm-how-section{padding:50px 20px 0}}.pm-footer{border-top:1px solid #f4f2ea1f;max-width:1400px;margin:80px auto 0;padding:40px 40px 60px}.pm-footer-container{color:#f4f2ea80;flex-wrap:wrap;justify-content:space-between;gap:20px;font-size:14px;display:flex}@media (width<=600px){.pm-footer{margin-top:50px;padding:30px 20px 40px}}.pm-toast{z-index:1000;color:#0e4530;pointer-events:none;background:#f3de4b;border-radius:999px;align-items:center;gap:10px;padding:14px 22px;font-family:DM Sans,sans-serif;font-size:14.5px;font-weight:600;display:flex;position:fixed;bottom:32px;right:32px;box-shadow:0 12px 32px #00000059}.pm-toast-icon{font-size:16px}@media (width<=600px){.pm-toast{justify-content:center;bottom:20px;left:20px;right:20px}}.pm-app-wrapper{color:#f4f2ea;background:linear-gradient(#ffffff0b 1px,#0000 1px) 0 0/100% 34px,linear-gradient(90deg,#ffffff0b 1px,#0000 1px) 0 0/34px 100%,radial-gradient(120% 80% at 50% 0,#14563c 0%,#0e4530 55%,#0a3324 100%);min-height:100vh;padding:0 0 60px;font-family:DM Sans,system-ui,sans-serif;overflow-x:hidden}