:root{color-scheme:dark;--panel-bg: rgba(18, 22, 29, .97);--panel-border: rgba(255, 255, 255, .14);--text: #f3f4f6;--muted: #a9b0bd;--accent: #e8b53b;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0;height:100%;background:#0b0d12;color:var(--text)}#stage{position:fixed;inset:0;z-index:0}#stage svg{display:block;width:100%;height:100%}.periodic-background{position:absolute;top:50%;left:50%;width:300vmax;height:300vmax;transform-origin:center;background-repeat:repeat}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}#panel-toggle{position:fixed;top:1.85rem;right:1.85rem;z-index:3;display:flex;align-items:center;justify-content:center;gap:.5rem;min-width:2.75rem;height:2.75rem;border-radius:.75rem;border:1px solid var(--panel-border);background:var(--panel-bg);color:var(--text);padding:.6rem;font:inherit;font-size:.85rem;cursor:pointer;backdrop-filter:blur(8px)}#panel-toggle svg{display:block;width:1.35rem;height:1.35rem;fill:currentColor}#panel-toggle[aria-expanded=true] .toggle-open-icon,#panel-toggle[aria-expanded=false] .toggle-close-icon,#panel-toggle[aria-expanded=true] span{display:none}#panel{position:fixed;top:1rem;right:1rem;z-index:2;display:flex;flex-direction:column;width:min(25rem,calc(100vw - 2rem));max-height:calc(100vh - 2rem);max-height:calc(100dvh - 2rem);overflow:hidden;border-radius:1rem;border:1px solid var(--panel-border);background:var(--panel-bg);backdrop-filter:blur(10px);box-shadow:0 1.5rem 3rem #00000073}#panel[hidden]{display:none}#panel h1{margin:0;overflow-wrap:anywhere;font-size:1.15rem;line-height:1.25;letter-spacing:.01em}.panel-header{flex:none;padding:1.1rem 4.25rem 1rem 1.15rem;border-bottom:1px solid var(--panel-border)}.panel-content{min-height:0;overflow-y:auto;overscroll-behavior:contain;scroll-padding-block:.75rem;scrollbar-width:thin;scrollbar-color:#505866 transparent;padding:1rem 1.15rem}.panel-export{flex:none;padding:.85rem 1.15rem;border-top:1px solid var(--panel-border);background:#161c25}.export-heading{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:.3rem;margin-bottom:.6rem}.export-heading h2{margin:0;font-size:.8rem;font-weight:600}#export-size{font-size:.75rem;color:var(--muted);font-variant-numeric:tabular-nums}#status{max-height:3.9em;overflow-y:auto;overflow-wrap:anywhere;line-height:1.3;font-size:.7rem}summary{padding:.65rem 0;color:var(--muted);font-size:.8rem;cursor:pointer}summary:hover{color:var(--text)}summary::marker{color:var(--muted)}.tiling-about{margin-top:.25rem}.tiling-about>summary{padding-bottom:.15rem}.border-settings{margin-top:.75rem;border-top:1px solid var(--panel-border)}.border-settings>summary{padding-bottom:.15rem}#panel .panel-kicker{margin:0 0 .15rem;font-size:.68rem;font-weight:650;line-height:1.3;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}#panel a{color:var(--accent)}.tiling-description{margin-top:.65rem}.tiling-description p{margin:0;font-size:.78rem;line-height:1.5;color:var(--muted)}.tiling-description p+p{margin-top:.55rem}.tiling-references{margin-top:.7rem;padding-top:.55rem;border-top:1px solid var(--panel-border)}.tiling-references h2{margin:0;color:var(--muted);font-size:.65rem;font-weight:650;letter-spacing:.08em;text-transform:uppercase}.tiling-references ul{margin:.3rem 0 0;padding-left:1rem}.tiling-references li{padding-left:.1rem;color:var(--muted);font-size:.72rem;line-height:1.4}.tiling-references li+li{margin-top:.25rem}.tiling-references a{text-decoration-thickness:1px;text-underline-offset:.15em}fieldset{min-width:0;margin:0 0 .9rem;padding:.6rem 0 1rem;border:0;border-bottom:1px solid var(--panel-border)}fieldset:last-child{margin-bottom:0;padding-bottom:0;border-bottom:0}legend{padding:0;font-size:.72rem;text-transform:uppercase;letter-spacing:.09em;color:var(--muted)}label{font-size:.85rem}select,input[type=text],input[type=number]{width:100%;min-height:2.5rem;padding:.5rem .6rem;border-radius:.5rem;border:1px solid var(--panel-border);background:#ffffff0f;color:var(--text);font:inherit;font-size:.85rem}select option,select optgroup{background:#222832;color:var(--text)}#substitution-hierarchy-controls,#algorithmic-controls,#loop-fill-controls{margin-top:.65rem}#substitution-hierarchy-controls label,#algorithmic-controls label,#loop-fill-controls label{display:block;margin-bottom:.3rem}.row{display:grid;grid-template-columns:auto 2.6rem 1fr;align-items:center;gap:.5rem;margin-top:.5rem}.colour-editor-heading,.colour-popover-heading{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.4rem;font-size:.85rem}.colour-editor-heading p{margin:0;font-weight:600}.text-button{min-width:2.75rem;min-height:2.75rem;padding:.4rem .6rem;border:1px solid transparent;border-radius:.5rem;background:transparent;color:var(--accent);font:inherit;font-size:.8rem;cursor:pointer}.text-button:hover:not(:disabled){background:#ffffff14}.colour-stops{display:grid;gap:.5rem}.colour-control{display:grid;grid-template-columns:2.75rem minmax(0,1fr);align-items:center;gap:.65rem}.colour-option{display:flex;align-items:center;gap:.6rem;min-height:2.75rem;margin-top:.5rem;cursor:pointer}.colour-option input{margin:0}.colour-actions{display:flex;gap:.4rem;margin-top:.65rem}.colour-actions button{flex:1;min-height:2.75rem;padding:.5rem .4rem;border:1px solid var(--panel-border);border-radius:.5rem;background:#ffffff0f;color:var(--text);font:inherit;font-size:.8rem;cursor:pointer}.colour-actions button:hover{background:#ffffff1f;border-color:#ffffff52}.row:has(input[type=range]){grid-template-columns:1fr auto;row-gap:.25rem}.row:has(input[type=range])>label{grid-column:1;grid-row:1}.row:has(input[type=range])>input[type=range],.row:has(input[type=range])>.rotation-control{grid-column:1 / -1;grid-row:2}.row:has(input[type=range])>output{grid-column:2;grid-row:1}.row:has(#custom-height){grid-template-columns:auto 1fr auto 1fr}.row:has(input[type=checkbox]){grid-template-columns:1fr auto}input[type=range]{width:100%;min-height:1.75rem;margin:0;accent-color:var(--accent)}input[type=checkbox]{width:1.1rem;height:1.1rem;accent-color:var(--accent)}:where(button,input,select,summary,a):focus-visible,[data-focus-visible]{outline:2px solid var(--accent);outline-offset:3px}:where(button,input):disabled{opacity:.45;cursor:not-allowed}.inline-field{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:.5rem}.rotation-control{position:relative;min-width:0;padding-bottom:.35rem}#rotation{display:block;margin:0}.rotation-marks{position:absolute;right:.5rem;bottom:0;left:.5rem;height:.3rem;pointer-events:none}.rotation-mark{position:absolute;bottom:0;left:var(--rotation-position);width:1px;height:.1rem;background:var(--muted);opacity:.35;transform:translate(-50%)}.rotation-mark--medium{height:.2rem;opacity:.55}.rotation-mark--major{height:.3rem;opacity:.8}output{font-size:.78rem;color:var(--muted);text-align:right;font-variant-numeric:tabular-nums}.tiling-picker{display:grid;gap:.35rem}.tiling-picker-label{font-size:.85rem}.tiling-picker-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:.35rem}.select-trigger,.picker-step{min-height:2.75rem;border-radius:.5rem;border:1px solid var(--panel-border);background:#ffffff0f;color:var(--text);font:inherit;cursor:pointer}.select-trigger:hover,.picker-step:hover{border-color:#ffffff52;background:#ffffff1f}.select-trigger{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.6rem;width:100%;padding:.35rem .65rem .35rem .35rem;font-size:.85rem;text-align:left}.picker-step{display:grid;place-items:center;width:2.75rem;padding:0}.select-trigger svg,.picker-step svg{width:1.05rem;height:1.05rem;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.tiling-trigger-shapes{display:block;width:3.25rem;height:3.25rem;border-radius:.4rem;background:#00000040}.tiling-trigger-shapes img{display:block;width:100%;height:100%}.tiling-trigger-text{display:grid;min-width:0}.tiling-trigger-name,.tiling-trigger-family{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tiling-trigger-family{font-size:.7rem;color:var(--muted)}.tiling-summary{margin:.15rem 0 0;font-size:.78rem;line-height:1.45;color:var(--muted)}.gallery-overlay{position:fixed;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;padding:1rem;background:#05070a99;backdrop-filter:blur(3px)}.gallery-modal{display:flex;width:min(62rem,100%);height:min(46rem,100%);overflow:hidden;border:1px solid var(--panel-border);border-radius:1rem;background:#161b23;box-shadow:0 1.5rem 3rem #00000080}.gallery-dialog{display:flex;flex:1;flex-direction:column;min-width:0;min-height:0;outline:none}.gallery-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.6rem .6rem 0 1.15rem}.gallery-header h2{margin:0;font-size:1.05rem}.gallery-tools{display:grid;gap:.6rem;padding:.5rem 1.15rem .85rem;border-bottom:1px solid var(--panel-border)}.gallery-search{position:relative}.gallery-search input{width:100%;min-height:2.75rem;padding:.5rem 2.75rem .5rem .75rem;border-radius:.5rem;border:1px solid var(--panel-border);background:#ffffff0f;color:var(--text);font:inherit;font-size:.9rem}.gallery-search input::-webkit-search-cancel-button{display:none}.gallery-search button{position:absolute;top:0;right:0;width:2.75rem;height:2.75rem;border:0;background:none;color:var(--muted);font:inherit;cursor:pointer}.gallery-search[data-empty] button{display:none}.gallery-filters{display:flex;flex-wrap:wrap;gap:.35rem}.gallery-filters button{min-height:2.25rem;padding:.3rem .8rem;border:1px solid var(--panel-border);border-radius:999px;background:transparent;color:var(--muted);font:inherit;font-size:.8rem;cursor:pointer}.gallery-filters button:hover{color:var(--text);border-color:#ffffff52}.gallery-filters button[data-selected]{border-color:var(--accent);background:#e8b53b29;color:var(--text)}.gallery-list{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#505866 transparent;padding:.25rem 1.15rem 1.15rem;outline:none}.gallery-section{display:grid;grid-template-columns:repeat(auto-fill,minmax(8rem,1fr));gap:.6rem}.gallery-section-header{grid-column:1 / -1;display:grid;gap:.15rem;padding:.9rem 0 .15rem}.gallery-section-title{font-size:.72rem;font-weight:650;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}.gallery-section-blurb{font-size:.78rem;color:var(--muted)}.gallery-card{display:grid;grid-template-rows:auto 1fr;gap:.2rem;padding:.4rem .4rem .5rem;border:1px solid var(--panel-border);border-radius:.6rem;background:#ffffff08;cursor:pointer;outline:none}.gallery-card[data-hovered],.gallery-card[data-focused]{border-color:#ffffff5c;background:#ffffff14}.gallery-card[data-focus-visible]{outline:2px solid var(--accent);outline-offset:2px}.gallery-card[data-selected]{border-color:var(--accent);background:#e8b53b24}.gallery-thumbnail{display:block;aspect-ratio:1;margin-bottom:.2rem;overflow:hidden;border-radius:.4rem;background:#00000038}.gallery-thumbnail[data-loading],.tiling-trigger-shapes[data-loading]{animation:thumbnail-pulse 1.2s ease-in-out infinite alternate}@keyframes thumbnail-pulse{to{background:#ffffff1f}}@media(prefers-reduced-motion:reduce){.gallery-thumbnail[data-loading],.tiling-trigger-shapes[data-loading]{animation:none}}.gallery-thumbnail img{display:block;width:100%;height:100%}.gallery-card-name{padding:0 .15rem;font-size:.78rem;font-weight:600;line-height:1.3;text-align:center}.gallery-empty{margin:2rem 0;text-align:center;color:var(--muted)}.color-field{display:grid;grid-template-columns:4.5rem minmax(0,1fr);align-items:center;gap:.5rem;min-width:0}.hex-input{width:100%;min-height:2.75rem;padding:.4rem;border-radius:.45rem;border:1px solid var(--panel-border);background:#ffffff0f;color:var(--text);font:inherit;font-size:.85rem;font-variant-numeric:tabular-nums}.swatch-button{width:2.75rem;height:2.75rem;padding:.22rem;border:1px solid var(--panel-border);border-radius:.45rem;background:#ffffff0f;cursor:pointer}.swatch-button[data-disabled]{opacity:.45;cursor:not-allowed}.swatch-button .react-aria-ColorSwatch{display:block;width:100%;height:100%;border-radius:.28rem;box-shadow:inset 0 0 0 1px #00000040}.color-popover{width:12.5rem;max-width:calc(100vw - 1rem);padding:.6rem;border:1px solid var(--panel-border);border-radius:.7rem;background:#222832;box-shadow:0 1rem 2rem #00000059}.color-popover .react-aria-ColorArea{position:relative;width:100%;aspect-ratio:4 / 3;border-radius:.45rem;margin-bottom:.65rem}.color-popover .react-aria-ColorSlider{display:block}.color-popover .react-aria-SliderTrack{position:relative;width:100%;height:1.5rem;border-radius:999px}.color-popover .react-aria-ColorThumb{width:1.05rem;height:1.05rem;border:2px solid white;border-radius:50%;box-shadow:0 0 0 1px #00000059}.palettes{margin-top:1rem;padding-top:.35rem;border-top:1px solid var(--panel-border)}.palette-group:has(button[aria-pressed=true])>summary{color:var(--accent)}.palette-collection{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem;padding:.15rem .15rem .5rem}.palette-collection button{min-width:0;height:3rem;border-radius:.45rem;border:1px solid var(--panel-border);background:#ffffff0a;color:var(--text);cursor:pointer;padding:0;overflow:hidden;text-align:left}.palette-colours{display:flex;height:1.25rem}.palette-colours>span{flex:1}.palette-name{display:block;overflow:hidden;padding:.25rem .4rem 0;font-size:.72rem;line-height:1;text-overflow:ellipsis;white-space:nowrap}.palette-collection button:hover{border-color:#ffffff52}.palette-collection button[aria-pressed=true]{outline:2px solid var(--accent);outline-offset:1px}.buttons{display:flex;gap:.5rem}.buttons button{flex:1;min-height:2.75rem;padding:.5rem;border-radius:.55rem;border:1px solid var(--panel-border);background:#ffffff17;color:var(--text);font:inherit;font-size:.85rem;white-space:nowrap;cursor:pointer}.buttons button:hover:not(:disabled){background:#ffffff29}#download-svg{border-color:var(--accent);background:var(--accent);color:#171c24;font-weight:650}#download-svg:hover:not(:disabled){background:#f2c65a}.hint{margin:.5rem 0 0;font-size:.75rem;color:var(--muted);min-height:1rem}.credits{margin-top:.65rem;color:var(--muted);font-size:.68rem;text-align:center}#panel .repository-link{display:inline-flex;vertical-align:-.15rem;color:var(--muted)}#panel .repository-link:hover{color:var(--text)}.repository-link svg{width:.85rem;height:.85rem;fill:currentColor}.no-script{position:fixed;inset:50% auto auto 50%;z-index:4;width:min(28rem,calc(100vw - 2rem));padding:1.25rem;border:1px solid var(--panel-border);border-radius:1rem;background:#12141a;box-shadow:0 1.5rem 3rem #00000073;text-align:center;transform:translate(-50%,-50%)}.no-script h1{margin:0 0 .5rem;font-size:1.1rem}.no-script p{margin:0;color:var(--muted)}@media(max-width:32rem){#panel{top:auto;bottom:max(.5rem,env(safe-area-inset-bottom));right:.5rem;width:calc(100vw - 1rem);max-height:66vh;max-height:66dvh}.panel-header{padding:.85rem 1rem}#panel h1{font-size:1.05rem}.panel-content{padding:.85rem 1rem}.panel-export{padding:.75rem 1rem}#panel-toggle{top:.85rem;right:.85rem}#panel-toggle[aria-expanded=true] span{display:inline}.gallery-overlay{padding:0}.gallery-modal{width:100%;height:100%;border:0;border-radius:0}.gallery-section{grid-template-columns:repeat(3,minmax(0,1fr))}.gallery-search input,.hex-input,select,input[type=number]{font-size:1rem}}@media(max-height:32rem)and (max-width:32rem){#panel{max-height:calc(100dvh - 4.5rem)}}