:root{--ground: #0E0F11;--canvas: #141518;--border: #1B1C20;--text: #A9ACB4;--bright: #E4E5E9;--muted: #5C5F68;--selection: #7A85FF;--active: #1B1C21;--dim: #6E717A;--faint: #34363C;--count: #3E4048;--frame-ring: #24262B;--popover: #17181B;--popover-border: #26282D;--button-border: #2A2C32;--strong: #C9CBD1;--soft: #4A4D55;--done: #4CB782;--wip: #E9C46A;--missing: #E5484D;--paper: #FFFFFF;--shadow: rgba(0, 0, 0, .45);--dev-bg: #E9E9EE;--dev-text: #222222;--dev-border: #D0D0D8}:root{color-scheme:dark}html,body,#root{height:100%}body{margin:0;background:var(--ground);color:var(--text);font:400 12.5px/1.4 Geist,system-ui,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}input,select{font:inherit}input::placeholder{color:var(--muted)}:where(a,button,input,select):focus-visible{outline:2px solid var(--selection);outline-offset:1px}.mono{font-family:Geist Mono,ui-monospace,monospace}.page{height:100%;display:flex;flex-direction:column;overflow:hidden}.header{position:relative;z-index:2;height:40px;flex:none;box-sizing:border-box;display:flex;align-items:center;gap:10px;padding:0 10px;border-bottom:1px solid var(--border)}.header.plain{border-bottom:0;padding:0 16px}.header.home{gap:4px}.brand{color:var(--bright);padding:0 8px 0 4px}.spacer{flex:1}.btn{height:26px;display:inline-flex;align-items:center;padding:0 8px;border:0;border-radius:5px;background:transparent;color:var(--text);white-space:nowrap}.btn:hover{background:var(--active)}.btn.on{background:var(--active);color:var(--bright)}.btn[aria-disabled=true]{color:var(--dim);cursor:default;background:transparent}.icon-btn{width:28px;height:26px;display:grid;place-items:center;border:0;border-radius:5px;background:transparent;color:var(--muted)}.icon-btn.on{color:var(--strong)}.icon-btn:hover{background:var(--active)}.home-main{flex:1;min-height:0;overflow-y:auto;display:flex;justify-content:center;padding:28px 16px 48px}.home-col{width:100%;max-width:820px;display:flex;flex-direction:column;gap:24px}.toolbar{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.search{flex:1 1 240px;height:30px;box-sizing:border-box;display:flex;align-items:center;gap:8px;padding:0 10px;border-radius:6px;background:var(--canvas)}.search input{flex:1;min-width:0;border:0;background:transparent;color:var(--bright);outline:none}.search:focus-within{outline:2px solid var(--selection);outline-offset:1px}.filter{position:relative;height:30px;box-sizing:border-box;display:inline-flex;align-items:center;gap:4px;padding:0 10px;border-radius:6px;background:var(--canvas);color:var(--text);white-space:nowrap}.filter.on{background:var(--active);color:var(--bright)}.filter .k{color:var(--muted)}.filter select{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;opacity:0;cursor:pointer}.filter:focus-within{outline:2px solid var(--selection);outline-offset:1px}.group{display:flex;flex-direction:column}.group-label{padding:0 10px 6px;font-size:11.5px;color:var(--muted)}.group-label .n{color:var(--count);margin-left:4px}.row{height:40px;display:flex;align-items:center;gap:16px;padding:0 10px;border-radius:6px}a.row:hover{background:var(--canvas)}.row .status{flex:none;margin-right:-6px}.row .name{flex:1;min-width:0;color:var(--bright);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.row .products{width:120px;color:var(--dim)}.row .items{width:64px;color:var(--muted)}.row .when{width:72px;text-align:right;color:var(--muted)}.empty{padding:0 10px;color:var(--muted)}.crumb-link{color:var(--dim)}.crumb-link:hover{color:var(--text)}.crumb{color:var(--dim);white-space:nowrap}.crumb-sep{color:var(--faint)}.crumb-title{color:var(--bright);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kind{color:var(--muted);white-space:nowrap}.body{flex:1;min-height:0;display:flex}.left{width:220px;flex:none;box-sizing:border-box;border-right:1px solid var(--border);padding:14px 8px;display:flex;flex-direction:column;gap:14px;overflow-y:auto}.left-group{display:flex;flex-direction:column;gap:1px}.left-label{padding:0 8px 4px;font-size:11.5px;color:var(--muted)}.left-item{height:28px;line-height:28px;padding:0 8px;border-radius:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text)}.left-item:hover{background:var(--canvas)}.left-item[aria-current=page]{background:var(--active);color:var(--bright)}.canvas{flex:1;min-width:0;position:relative;overflow:hidden;background:var(--canvas);cursor:default;touch-action:none;-webkit-user-select:none;user-select:none}.canvas.panning{cursor:grabbing}.world{position:absolute;left:0;top:0;transform-origin:0 0;display:flex;align-items:flex-start}.world.unfitted{visibility:hidden}.frame-col{position:relative;flex:none}.frame-label{position:absolute;left:0;bottom:100%;padding-bottom:8px;transform-origin:0 100%;transform:scale(calc(1 / var(--z)));font-size:11.5px;color:var(--muted);white-space:nowrap}.frame-col.has-selection .frame-label{color:var(--text)}.arrow{position:absolute;display:flex;align-items:center;justify-content:center;transform:translate(-50%,-50%) scale(calc(1 / var(--z)))}.arrow-line{width:32px;height:1px;background:var(--faint);position:relative}.arrow-line:after{content:"";position:absolute;right:-1px;top:-3px;border-left:5px solid var(--faint);border-top:3.5px solid transparent;border-bottom:3.5px solid transparent}.frame{display:flex;flex-direction:column;overflow:hidden;background:var(--paper);box-shadow:0 0 0 calc(1px / var(--z, 1)) var(--frame-ring)}.frame.app{border-radius:28px}.frame.web,.frame.hub{border-radius:8px}.frame-col.has-selection .frame{box-shadow:0 0 0 calc(1px / var(--z, 1)) var(--selection)}.frame>*{flex-shrink:0}.frame-loading{margin:auto;color:var(--muted);font-size:11.5px}.frame-image{display:block;width:100%;height:auto}.canvas [data-relay-hover]{outline:calc(1px / var(--z)) solid var(--selection);outline-offset:calc(-1px / var(--z))}.canvas [data-relay-selected]{outline:calc(2px / var(--z)) solid var(--selection);outline-offset:calc(-2px / var(--z))}.right{width:248px;flex:none;box-sizing:border-box;border-left:1px solid var(--border);padding:16px 14px;display:flex;flex-direction:column;gap:18px;overflow-y:auto}.insp-head{display:flex;flex-direction:column;gap:2px}.insp-name{color:var(--bright);font-size:13px}.insp-path{color:var(--muted);overflow-wrap:anywhere}.insp-section{display:flex;flex-direction:column;gap:9px}.insp-caption{color:var(--muted);font-size:11.5px}.insp-row{display:flex;align-items:baseline;gap:8px}.insp-row.sub .k{padding-left:10px;box-sizing:border-box}.insp-row .k{flex:0 0 68px;color:var(--muted)}.insp-row .t{flex:1;min-width:0;font-size:11.5px;color:var(--strong);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.insp-row .v{flex:none;font-size:11px;color:var(--soft);text-align:right;white-space:nowrap}.insp-row .v.missing{color:var(--missing)}.swatch{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px;box-shadow:0 0 0 1px var(--frame-ring);vertical-align:-1px}.insp-hint{color:var(--muted);line-height:1.6}.insp-hint kbd{font:inherit;color:var(--text)}.share-pop{position:absolute;top:38px;right:40px;width:300px;box-sizing:border-box;padding:6px;background:var(--popover);border:1px solid var(--popover-border);border-radius:8px;box-shadow:0 12px 32px var(--shadow);display:flex;flex-direction:column}.share-row{display:flex;align-items:center;gap:10px;padding:8px}.share-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.share-title{color:var(--bright)}.share-desc{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.copy{height:24px;padding:0 8px;border:1px solid var(--button-border);border-radius:5px;background:transparent;color:var(--strong);min-width:56px}.copy:hover{background:var(--active)}.proto-main{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;gap:16px;padding-bottom:16px}.proto-stage{flex:1;min-height:0;align-self:stretch;display:grid;place-items:center;overflow:hidden}.proto-stage .frame{box-shadow:0 0 0 1px var(--frame-ring)}.proto-stage [data-relay-go]>*{cursor:pointer}.proto-nav{flex:none;display:flex;align-items:center;gap:6px}.proto-step{min-width:150px;text-align:center}.proto-step .name{color:var(--bright)}.proto-step .n{color:var(--muted);margin-left:8px}.sub{color:var(--muted)}.notfound{margin:auto;display:flex;flex-direction:column;gap:8px;align-items:center}.notfound a{color:var(--bright)}.version{margin-left:auto;padding:0 4px;color:var(--muted);font-size:11px;white-space:nowrap}
