:root{color-scheme:dark;--panel-bg: rgba(18, 20, 26, .86);--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:1rem;right:1rem;z-index:3;width:2.75rem;height:2.75rem;border-radius:.75rem;border:1px solid var(--panel-border);background:var(--panel-bg);color:var(--text);font-size:1.1rem;cursor:pointer;backdrop-filter:blur(8px)}#panel-toggle svg{display:block;width:1.35rem;height:1.35rem;margin:auto;fill:currentColor}#panel{position:fixed;top:1rem;right:1rem;z-index:2;width:min(24rem,calc(100vw - 2rem));max-height:calc(100vh - 2rem);overflow-y:auto;padding:1rem 1.1rem 1.2rem;border-radius:1rem;border:1px solid var(--panel-border);background:var(--panel-bg);backdrop-filter:blur(10px);box-shadow:0 1.5rem 3rem #00000073;transition:transform .16s ease,opacity .16s ease}#panel[hidden]{display:none}#panel h1{margin:0;max-width:16rem;font-size:1.15rem;line-height:1.25;letter-spacing:.01em}#panel header{margin-bottom:.9rem}#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{margin:0 0 .9rem;padding:.7rem .8rem .85rem;border:1px solid var(--panel-border);border-radius:.7rem}legend{padding:0 .35rem;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%;padding:.4rem .5rem;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,.color-row{display:grid;grid-template-columns:auto 2.6rem 1fr;align-items:center;gap:.5rem;margin-top:.5rem}.colour-pair,.colour-third-row{display:grid;grid-template-columns:minmax(0,1fr) 2rem minmax(0,1fr);column-gap:.5rem;align-items:end}.colour-third-row .color-row{grid-column:3}.colour-pair .row,.colour-pair .color-row{min-width:0}.colour-pair .row:first-child,.colour-pair .color-row:nth-child(1){grid-column:1;grid-row:1}.colour-pair .row:nth-child(2),.colour-pair .color-row:nth-child(2){grid-column:3;grid-row:1}.colour-pair .color-row,.colour-third-row .color-row{grid-template-columns:minmax(0,1fr) 2rem;row-gap:.25rem}.colour-pair .color-row>label,.colour-third-row .color-row>label{grid-column:1 / -1}.colour-pair .color-row>.color-field,.colour-third-row .color-row>.color-field{grid-column:1}.colour-pair .color-row>.swatch-button,.colour-third-row .color-row>.swatch-button{grid-column:2}.color-row{grid-template-columns:auto minmax(0,1fr) 2.4rem}.toggle-label{font-size:.85rem}.icon-button{grid-column:2;grid-row:1;width:2rem;height:2rem;padding:0;border:1px solid var(--panel-border);border-radius:.5rem;background:#ffffff0f;color:var(--text);cursor:pointer}.icon-button:hover{border-color:#ffffff52;background:#ffffff1f}.icon-button svg{display:block;width:1.15rem;height:1.15rem;margin:auto;fill:currentColor}.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%;accent-color:var(--accent)}.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-select{display:grid;gap:.3rem}.select-trigger{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.45rem;width:100%;padding:.42rem .55rem;border-radius:.5rem;border:1px solid var(--panel-border);background:#ffffff0f;color:var(--text);font:inherit;font-size:.85rem;text-align:left;cursor:pointer}.select-trigger:hover{border-color:#ffffff52;background:#ffffff1f}.select-trigger .react-aria-SelectValue{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.select-trigger svg{width:1.05rem;height:1.05rem;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.picker-popover{width:var(--trigger-width, 20rem);max-height:18rem;overflow-y:auto;border:1px solid var(--panel-border);border-radius:.6rem;background:#222832;box-shadow:0 1rem 2rem #00000059}.picker-listbox{padding:.25rem}.picker-listbox [role=group]+[role=group]{margin-top:.25rem;border-top:1px solid var(--panel-border)}.picker-listbox h3{margin:0;padding:.45rem .55rem .25rem;font-size:.68rem;font-weight:650;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}.picker-listbox [role=option]{padding:.42rem .55rem;border-radius:.4rem;font-size:.82rem;cursor:pointer}.picker-listbox [role=option]:hover,.picker-listbox [role=option][data-focused]{background:#ffffff1f}.picker-listbox [role=option][data-selected]{background:#e8b53b29;color:#fff}.picker-listbox [role=option][data-selected]:after{content:"✓";float:right;color:var(--accent)}.color-field{display:block;min-width:0}.hex-input{width:100%;padding:.38rem .45rem;border-radius:.45rem;border:1px solid var(--panel-border);background:#ffffff0f;color:var(--text);font:inherit;font-size:.8rem}.swatch-button{width:2.4rem;height:2.15rem;padding:.22rem;border:1px solid var(--panel-border);border-radius:.45rem;background:#ffffff0f;cursor:pointer}.colour-pair .swatch-button,.colour-third-row .swatch-button{width:2rem}.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:.75rem;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-bottom:.65rem}.palettes h3{margin:0 0 .3rem;color:var(--muted);font-size:.68rem;font-weight:600}.palette-group:not(:first-child) h3{margin-top:.65rem}.palette-collection{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0}.palette-collection button{min-width:0;height:2.85rem;border-radius:0;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:.68rem;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;padding:.5rem .6rem;border-radius:.55rem;border:1px solid var(--panel-border);background:#ffffff17;color:var(--text);font:inherit;font-size:.85rem;cursor:pointer}.buttons button:hover{background:#ffffff29}.hint{margin:.5rem 0 0;font-size:.75rem;color:var(--muted);min-height:1rem}.credits{color:var(--muted);font-size:.68rem;text-align:right}#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(prefers-reduced-motion:reduce){#panel{transition:none}}@media(max-width:32rem){#panel{top:.5rem;right:.5rem;width:calc(100vw - 1rem);max-height:calc(100vh - 1rem)}#panel-toggle{top:.85rem;right:.85rem}}