html[data-surface=panel] .hostly-scrollbar{scrollbar-width:thin;scrollbar-color:var(--hostly-border) transparent}html[data-surface=panel] .hostly-scrollbar::-webkit-scrollbar{width:4px}html[data-surface=panel] .hostly-scrollbar::-webkit-scrollbar-track{background:transparent}html[data-surface=panel] .hostly-scrollbar::-webkit-scrollbar-thumb{background:var(--hostly-border);border-radius:9999px}html[data-surface=panel] .hostly-scroll-edge-x{overflow-x:auto;background:linear-gradient(to right,var(--hostly-surface-raised) 30%,transparent),linear-gradient(to left,var(--hostly-surface-raised) 30%,transparent) 100% 0;background-size:12px 100%,12px 100%;background-repeat:no-repeat;background-attachment:local,local}html[data-surface=panel]{--background: oklch(.953 .0045 245);--foreground: oklch(.28 .013 245);--card: oklch(.995 .0015 245);--card-foreground: oklch(.28 .013 245);--popover: oklch(.995 .0015 245);--popover-foreground: oklch(.28 .013 245);--primary: oklch(.52 .1 56);--primary-foreground: oklch(.985 .008 245);--secondary: oklch(.958 .004 245);--secondary-foreground: oklch(.32 .012 245);--muted: oklch(.958 .004 245);--muted-foreground: oklch(.505 .014 245);--accent: oklch(.95 .008 245);--accent-foreground: oklch(.32 .012 245);--destructive: oklch(.55 .16 27);--border: oklch(.876 .006 245);--input: oklch(.876 .006 245);--ring: oklch(.52 .1 56);--chart-1: oklch(.52 .1 56);--chart-2: oklch(.58 .055 245);--chart-3: oklch(.7 .035 245);--chart-4: oklch(.5 .012 245);--chart-5: oklch(.34 .01 245);--radius: .4rem;--sidebar: oklch(.948 .004 245);--sidebar-foreground: oklch(.28 .013 245);--sidebar-primary: oklch(.52 .1 56);--sidebar-primary-foreground: oklch(.985 .008 245);--sidebar-accent: oklch(.93 .035 56);--sidebar-accent-foreground: oklch(.52 .1 56);--sidebar-border: oklch(.9 .005 245);--sidebar-ring: oklch(.52 .1 56);--hostly-ink: oklch(.28 .013 245);--hostly-ink-soft: oklch(.505 .014 245);--hostly-surface: oklch(.953 .0045 245);--hostly-surface-raised: oklch(.995 .0015 245);--hostly-border: oklch(.876 .006 245);--hostly-border-focus: oklch(.52 .1 56);--hostly-border-strong: oklch(.84 .006 245);--hostly-accent: oklch(.52 .1 56);--hostly-accent-hover: oklch(.44 .1 56);--hostly-accent-soft: oklch(.95 .032 56);--hostly-success: oklch(.55 .11 156);--hostly-success-soft: oklch(.945 .035 156);--hostly-warning: oklch(.64 .115 72);--hostly-warning-soft: oklch(.93 .05 72);--hostly-error: oklch(.55 .16 27);--hostly-danger: oklch(.5 .18 27);--hostly-danger-soft: oklch(.925 .05 27);--hostly-info: oklch(.52 .1 244);--hostly-info-soft: oklch(.93 .04 244);--hostly-shadow-soft: 0 1px 2px -1px oklch(.3 .05 245 / .13), 0 2px 6px -1px oklch(.3 .05 245 / .09);--hostly-shadow-pop: 0 4px 12px -2px oklch(.3 .05 245 / .18), 0 10px 28px -6px oklch(.3 .05 245 / .12)}html[data-surface=panel].dark{--background: oklch(.205 .008 245);--foreground: oklch(.93 .006 245);--card: oklch(.252 .009 245);--card-foreground: oklch(.93 .006 245);--popover: oklch(.252 .009 245);--popover-foreground: oklch(.93 .006 245);--primary: oklch(.72 .095 56);--primary-foreground: oklch(.2 .02 245);--secondary: oklch(.285 .009 245);--secondary-foreground: oklch(.93 .006 245);--muted: oklch(.285 .009 245);--muted-foreground: oklch(.68 .012 245);--accent: oklch(.3 .012 245);--accent-foreground: oklch(.93 .006 245);--destructive: oklch(.62 .16 27);--border: oklch(.32 .01 245);--input: oklch(.32 .01 245);--ring: oklch(.62 .1 56);--chart-1: oklch(.72 .095 56);--chart-2: oklch(.62 .06 245);--chart-3: oklch(.52 .035 245);--chart-4: oklch(.6 .012 245);--chart-5: oklch(.74 .01 245);--sidebar: oklch(.178 .008 245);--sidebar-foreground: oklch(.93 .006 245);--sidebar-primary: oklch(.72 .095 56);--sidebar-primary-foreground: oklch(.2 .02 245);--sidebar-accent: oklch(.32 .04 56);--sidebar-accent-foreground: oklch(.83 .09 56);--sidebar-border: oklch(.3 .01 245);--sidebar-ring: oklch(.62 .1 56);--hostly-ink: oklch(.93 .006 245);--hostly-ink-soft: oklch(.68 .012 245);--hostly-surface: oklch(.205 .008 245);--hostly-surface-raised: oklch(.252 .009 245);--hostly-border: oklch(.32 .01 245);--hostly-border-focus: oklch(.62 .1 56);--hostly-border-strong: oklch(.4 .012 245);--hostly-accent: oklch(.72 .095 56);--hostly-accent-hover: oklch(.79 .09 56);--hostly-accent-soft: oklch(.33 .05 56);--hostly-success: oklch(.68 .12 156);--hostly-success-soft: oklch(.32 .06 156);--hostly-warning: oklch(.76 .12 72);--hostly-warning-soft: oklch(.34 .06 72);--hostly-error: oklch(.66 .17 27);--hostly-danger: oklch(.64 .18 27);--hostly-danger-soft: oklch(.33 .08 27);--hostly-info: oklch(.68 .11 244);--hostly-info-soft: oklch(.32 .06 244);--hostly-shadow-soft: 0 1px 2px -1px oklch(0 0 0 / .45), 0 2px 6px -1px oklch(0 0 0 / .32);--hostly-shadow-pop: 0 4px 12px -2px oklch(0 0 0 / .55), 0 10px 28px -6px oklch(0 0 0 / .4)}html[data-surface=panel] body{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}