*,*:before,*:after{box-sizing:border-box}body{margin:0;background:#08080c;color:#e4e4e7;font-family:system-ui,-apple-system,sans-serif}.app{min-height:100vh;padding:28px 20px 40px}.app-header{max-width:1440px;margin:0 auto 28px}.app-title{margin:0;font-size:28px;font-weight:700;letter-spacing:-.02em}.app-subtitle{margin:6px 0 0;font-size:14px;color:#71717a}.app-grid{display:grid;grid-template-columns:220px minmax(0,1fr) 272px;gap:20px;max-width:1440px;margin:0 auto;align-items:start}.gulley--pathways{position:sticky;top:20px;padding:12px 8px;max-height:calc(100vh - 140px);overflow-y:auto}.gulley__label{margin:0 0 10px 10px;font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#3f3f46}.pathway-list{list-style:none;margin:0;padding:0}.pathway-item{display:flex;align-items:stretch;width:100%;padding:0;border:none;background:transparent;cursor:pointer;text-align:left;border-radius:6px}.pathway-item__groove{flex-shrink:0;width:2px;margin:10px 0 10px 12px;border-radius:2px;background:#ffffff0a;box-shadow:inset 0 0 4px #00000080;transition:background .2s,box-shadow .2s,width .2s}.pathway-item:hover .pathway-item__groove,.pathway-item.is-active .pathway-item__groove{width:3px;background:#6366f180;box-shadow:0 0 10px #6366f180,inset 0 0 2px #a78bfa66}.pathway-item__text{flex:1;padding:9px 10px;min-width:0}.pathway-item__name{display:block;font-size:13px;font-weight:600;color:#71717a;transition:color .15s}.pathway-item__desc{display:none}.pathway-item.is-active .pathway-item__name,.pathway-item:hover .pathway-item__name{color:#e4e4e7}.loader-canvas{position:relative}.loader-mark{position:relative;background:#f4f2ec;box-shadow:0 0 0 1px #0000000f,0 8px 32px #00000059}.loader-mark--circle{border-radius:50%;overflow:hidden}.loader-mark--square{border-radius:3px;overflow:hidden}.shape-toggle{display:flex;align-items:center;gap:12px;width:100%}.shape-toggle__track{display:flex;gap:6px}.shape-chip{display:inline-flex;align-items:center;gap:7px;padding:5px 12px;border:none;background:transparent;color:#52525b;font-size:11px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;cursor:pointer}.shape-chip__icon{display:block;width:12px;height:12px;border:1.5px solid currentColor;opacity:.45;transition:opacity .15s}.shape-chip__icon--circle{border-radius:50%}.shape-chip__icon--square{border-radius:1px}.shape-chip:hover,.shape-chip.is-active{color:#e4e4e7}.shape-chip.is-active .shape-chip__icon{opacity:1;box-shadow:0 0 8px #ffffff40}.gulley--stage{padding:20px;display:flex;flex-direction:column;align-items:center;gap:18px}.preset-gulley{display:flex;align-items:center;gap:12px;width:100%;flex-wrap:wrap}.preset-track{display:flex;flex-wrap:wrap;gap:4px}.preset-chip{position:relative;padding:5px 12px 5px 14px;border:none;background:transparent;color:#52525b;font-size:11px;cursor:pointer}.preset-chip__line{position:absolute;left:4px;top:50%;width:2px;height:0;margin-top:-1px;border-radius:1px;background:transparent;transition:height .15s,box-shadow .15s,background .15s}.preset-chip:hover .preset-chip__line,.preset-chip.is-active .preset-chip__line{height:10px;background:#6366f173;box-shadow:0 0 6px #6366f166}.preset-chip.is-active{color:#c4b5fd}.preview-well{padding:20px}.settings-panel{position:sticky;top:20px;max-height:calc(100vh - 140px);display:flex;flex-direction:column}.settings-panel__head{display:flex;align-items:center;justify-content:space-between;padding:0 4px 12px}.settings-panel__title{margin:0;font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#3f3f46}.settings-panel__reset{padding:2px 8px;border:none;background:transparent;color:#52525b;font-size:10px;cursor:pointer}.settings-panel__reset:hover{color:#a5b4fc}.settings-panel__lines{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:14px;padding-right:4px}.setting-line{display:flex;flex-direction:column;gap:5px}.setting-line__meta{display:flex;align-items:baseline;justify-content:space-between;gap:8px;padding:0 2px}.setting-line__label{font-size:10px;font-weight:500;color:#52525b;letter-spacing:.03em;transition:color .15s}.setting-line.is-lit .setting-line__label{color:#a1a1aa}.setting-line__value{width:52px;padding:0;border:none;background:transparent;color:#3f3f46;font-size:10px;font-family:ui-monospace,monospace;text-align:right;transition:color .15s}.setting-line.is-lit .setting-line__value{color:#a5b4fc}.setting-line__gulley{position:relative;height:14px;display:flex;align-items:center}.setting-line__groove{position:absolute;left:0;right:0;height:3px;border-radius:2px;background:#00000059;box-shadow:inset 0 1px 2px #000000b3,inset 0 -1px #ffffff05;overflow:visible;transition:box-shadow .2s,background .2s}.setting-line:hover .setting-line__groove,.setting-line.is-lit .setting-line__groove{background:#00000073;box-shadow:inset 0 1px 3px #000000a6,inset 0 -1px #ffffff0a,0 0 12px #6366f114}.setting-line__beam{position:absolute;left:0;top:0;height:100%;border-radius:2px;background:#6366f11f;pointer-events:none;transition:width .05s linear,background .15s,box-shadow .15s}.setting-line:hover .setting-line__beam,.setting-line.is-lit .setting-line__beam{background:linear-gradient(90deg,#4f46e58c,#7c3aedd9);box-shadow:0 0 8px #6366f18c,0 0 2px #a78bfacc}.setting-line__tick{position:absolute;top:50%;width:4px;height:4px;margin:-2px 0 0 -2px;padding:0;border:none;border-radius:50%;background:#ffffff0f;cursor:pointer;z-index:2;opacity:0;transition:opacity .15s,background .15s,box-shadow .15s}.setting-line:hover .setting-line__tick,.setting-line.is-lit .setting-line__tick{opacity:1}.setting-line__tick:hover{background:#818cf8;box-shadow:0 0 6px #6366f1b3}.setting-line__range{position:relative;width:100%;height:14px;margin:0;background:transparent;-moz-appearance:none;appearance:none;-webkit-appearance:none;cursor:pointer;z-index:3}input[type=range]{-moz-appearance:none;appearance:none;-webkit-appearance:none;background:transparent}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:8px;height:8px;border-radius:50%;background:#71717a;border:none;box-shadow:none;cursor:grab;transition:background .15s,box-shadow .15s,transform .1s}.setting-line.is-lit input[type=range]::-webkit-slider-thumb,.setting-line:hover input[type=range]::-webkit-slider-thumb{background:#e0e7ff;box-shadow:0 0 8px #6366f1b3}input[type=range]::-moz-range-thumb{width:8px;height:8px;border-radius:50%;background:#71717a;border:none;cursor:grab}.setting-line.is-lit input[type=range]::-moz-range-thumb{background:#e0e7ff;box-shadow:0 0 8px #6366f1b3}input[type=range]:active::-webkit-slider-thumb{cursor:grabbing;transform:scale(1.15)}.gulley{position:relative;border-radius:14px;background:linear-gradient(180deg,#0a0a0f,#070709);box-shadow:inset 0 1px #ffffff05,inset 0 -8px 24px #00000073}.gulley__rim{pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;box-shadow:inset 0 0 0 1px #ffffff04}.gulley__label--inline{margin:0}
