.hex-root{--hex-accent:#00ae42;--hex-accent-dark:#00873a;--hex-ink:#212b36;--hex-muted:#637381;--hex-faint:#919aa6;--hex-line:#eceef0;--hex-line-strong:#dfe3e8;--hex-font:"Open Sans",system-ui,-apple-system,sans-serif;font-family:var(--hex-font);color:var(--hex-ink);color-scheme:light}.hex-root,.hex-root *,.hex-root :after,.hex-root :before{box-sizing:border-box}.hex-page{position:relative;min-height:100dvh;background:#fff}@keyframes hex-fade-in{0%{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}.hex-root ::-webkit-scrollbar{height:9px;width:9px}.hex-root ::-webkit-scrollbar-thumb{background:rgba(16,24,40,.18);border-radius:8px}.hex-root ::-webkit-scrollbar-track{background:transparent}.hex-root input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:3px;background:#dfe3e8;outline:none;cursor:pointer}.hex-root input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid var(--hex-accent);box-shadow:0 1px 3px rgba(16,24,40,.22);cursor:pointer}.hex-root input[type=range]::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#fff;border:2px solid var(--hex-accent);cursor:pointer}.hex-root select{font-family:var(--hex-font)}.hex-root .landing-hero-inner{max-width:1160px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,380px);align-items:center;gap:28px;padding:0 32px}.hex-root .landing-hero-copy{min-width:0;padding:66px 0;display:flex;flex-direction:column;justify-content:center}.hex-root .landing-hero-title{font:800 46px Open Sans;line-height:1.04;margin-top:14px;letter-spacing:0}.hex-root .landing-hero-actions{display:flex;gap:14px;margin-top:30px;align-items:center;flex-wrap:wrap}.hex-root .landing-hero-preview-wrap{min-width:0;display:flex;align-items:center;justify-content:center;padding:30px 0}.hex-root .landing-hero-preview{position:relative;width:min(360px,100%);height:340px}.hex-root .landing-gallery{max-width:1160px;margin:0 auto;padding:44px 32px 64px}.hex-root .landing-gallery-header{display:flex;align-items:baseline;gap:10px;margin-bottom:18px;flex-wrap:wrap}.hex-root .pattern-gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px}.hex-root .pattern-card{min-height:170px}.hex-root .pattern-card canvas{width:min(120px,100%);aspect-ratio:1/.866;filter:drop-shadow(0 8px 12px rgba(16,24,40,.16));pointer-events:none}.hex-root .landing-real-place{display:flex;flex-wrap:wrap;align-items:center;gap:18px;margin-top:40px;padding:20px 22px;border:1px dashed #c4cdd5;border-radius:12px;background:#fafbfc}.hex-root .editor-shell{height:100vh;display:flex;flex-direction:column;overflow:hidden}@media (max-width:860px){.hex-root .editor-body{flex-direction:column}.hex-root .editor-pane{width:100%!important;max-height:46vh;border-right:0!important;border-bottom:1px solid #eceef0}}@media (max-width:760px){.hex-root .landing-hero-inner{grid-template-columns:1fr;gap:0;padding:0 20px}.hex-root .landing-hero-copy{padding:48px 0 18px}.hex-root .landing-hero-title{font-size:40px}.hex-root .landing-hero-preview-wrap{padding:0 0 34px}.hex-root .landing-hero-preview{width:min(300px,100%);height:240px}.hex-root .landing-gallery{padding:34px 20px 52px}}@media (max-width:420px){.hex-root .landing-hero-inner{padding:0 16px}.hex-root .landing-hero-title{font-size:34px}.hex-root .landing-gallery{padding-left:16px;padding-right:16px}.hex-root .pattern-gallery-grid{grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:12px}}.hex-root .color-slot-row{display:flex;align-items:center;gap:10px;font-size:12px}.hex-root .color-slot-row small{display:block;color:var(--hex-muted);font-size:10px;margin-top:2px}.hex-root .color-slot-row input[type=color]{width:38px;height:34px;padding:2px}.hex-root .color-slot-row input[type=color],.hex-root .filament-open{border:1px solid var(--hex-line-strong);border-radius:6px;background:white;cursor:pointer}.hex-root .filament-open{margin-left:auto;padding:7px 9px;color:var(--hex-accent-dark);font:600 11px var(--hex-font)}.hex-root .filament-dialog{width:min(760px,calc(100vw - 28px));max-height:min(820px,calc(100dvh - 40px));padding:0;border:1px solid var(--hex-line);border-radius:18px;color:var(--hex-ink);background:#fff;box-shadow:0 24px 80px #10182840;overflow:hidden}.hex-root .filament-dialog[open]{display:flex;flex-direction:column}.hex-root .filament-filters,.hex-root .filament-footer,.hex-root .filament-header{flex-shrink:0}.hex-root .filament-dialog::backdrop{background:#0c0f138c}.hex-root .filament-dialog button,.hex-root .filament-dialog input{font:inherit}.hex-root .filament-dialog button{cursor:pointer}.hex-root .filament-dialog button:focus-visible,.hex-root .filament-dialog input:focus-visible,.hex-root .filament-open:focus-visible{outline:3px solid var(--hex-accent);outline-offset:3px}.hex-root .filament-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:24px 24px 16px}.hex-root .filament-header h2{margin:0;font-size:21px;letter-spacing:-.4px}.hex-root .filament-header p{margin:8px 0 0;font-size:12px;color:var(--hex-muted);line-height:1.7}.hex-root .filament-current{display:inline-block;width:12px;height:12px;vertical-align:-2px;border:1px solid #0003;border-radius:50%;margin:0 4px}.hex-root .filament-close{border:1px solid var(--hex-line);background:#fafbfc;border-radius:50%;width:32px;height:32px;flex-shrink:0;font-size:22px!important;color:var(--hex-muted)}.hex-root .filament-filters{padding:0 24px}.hex-root .filament-filters input[type=search]{width:100%;border:1px solid var(--hex-line-strong);border-radius:9px;padding:12px;background:#fafbfc;font-size:14px}.hex-root .filament-filter-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:14px}.hex-root .filament-series{display:flex;padding:3px;background:#f1f3f5;border-radius:8px}.hex-root .filament-series button{border:none;border-radius:6px;padding:7px 12px;color:var(--hex-muted);background:transparent;font-size:12px}.hex-root .filament-series button[aria-pressed=true]{background:white;color:var(--hex-accent-dark);box-shadow:0 1px 4px #1018281a;font-weight:700}.hex-root .filament-filter-row label{font-size:12px;color:var(--hex-muted);display:flex;align-items:center;gap:5px}.hex-root .filament-filter-row input{accent-color:var(--hex-accent)}.hex-root .filament-count{font-size:11px;color:var(--hex-muted);margin:12px 0}.hex-root .filament-results{overflow-y:auto;padding:4px 24px 20px;min-height:100px}.hex-root .filament-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:12px}.hex-root .filament-card{display:flex;flex-direction:column;text-align:left;border:1px solid var(--hex-line-strong);padding:7px 7px 10px;border-radius:10px;background:white;color:var(--hex-ink);transition:border-color .12s,box-shadow .12s}.hex-root .filament-card:hover{border-color:var(--hex-accent);box-shadow:0 3px 10px #10182814}.hex-root .filament-swatch{position:relative;display:block;width:100%;height:76px;border-radius:6px;box-shadow:inset 0 0 0 1px #0000000d;margin-bottom:9px}.hex-root .filament-gradient,.hex-root .filament-match{position:absolute;background:#fffffff0;color:#212b36;padding:3px 6px;border-radius:4px;font-size:9px;font-weight:600}.hex-root .filament-match{top:5px;right:5px}.hex-root .filament-gradient{bottom:5px;left:5px}.hex-root .filament-name{font-size:12px;font-weight:700;line-height:1.4}.hex-root .filament-meta{font-size:10px;color:var(--hex-muted);margin-top:3px}.hex-root .filament-hex{font-size:9px;color:var(--hex-muted);margin-top:5px}.hex-root .filament-footer{padding:14px 24px;background:#fafbfc;border-top:1px solid var(--hex-line);font-size:11px;color:var(--hex-muted);line-height:1.6}.hex-root .filament-empty{text-align:center;padding:40px 0;color:var(--hex-muted);font-size:14px}.hex-root .filament-empty button{border:1px solid var(--hex-line-strong);border-radius:6px;padding:8px 12px;background:white;color:var(--hex-accent-dark)}@media (max-width:480px){.hex-root .filament-header{padding:18px 16px 14px}.hex-root .filament-header h2{font-size:18px}.hex-root .filament-filters{padding:0 16px}.hex-root .filament-results{padding:4px 16px 16px}.hex-root .filament-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.hex-root .filament-footer{padding:12px 16px}}