@layer faye-ui.product {
body{margin:0;background:var(--faye-ui-color-canvas);color:var(--faye-ui-color-text);font-family:var(--faye-ui-font-body)}
*{box-sizing:border-box}
.task-app{max-inline-size:60rem;margin-inline:auto;padding:var(--faye-ui-space-6)}
.task-header{position:relative;display:flex;align-items:center;justify-content:space-between;gap:var(--faye-ui-space-4);padding-block:var(--faye-ui-space-3)}
.task-header::after{content:"";position:absolute;inset-inline:0;inset-block-end:0;block-size:1px;background:var(--faye-ui-color-border);pointer-events:none}
.task-brand,.task-settings,.task-actions,.task-dialog-actions,.task-row-actions{display:flex;align-items:center;gap:var(--faye-ui-space-2)}
.task-brand{gap:var(--faye-ui-space-3)}.task-brand h1{margin:0}.task-brand>div{display:grid;gap:var(--faye-ui-space-1)}
.task-settings{flex-shrink:0;font-size:var(--faye-ui-font-size-sm)}.task-settings summary{cursor:pointer}.task-settings details{position:relative}
.task-settings-panel{position:absolute;inset-inline-end:0;inset-block-start:100%;z-index:2;display:grid;gap:var(--faye-ui-space-3);min-inline-size:12rem;padding:var(--faye-ui-space-3);background:var(--faye-ui-color-surface);border:1px solid var(--faye-ui-color-border);border-radius:var(--faye-ui-radius-control)}
.task-settings-panel label,.task-field{display:grid;gap:var(--faye-ui-space-2);font-size:var(--faye-ui-font-size-sm)}
.task-toolbar{display:flex;align-items:center;gap:var(--faye-ui-space-3);margin-block:var(--faye-ui-space-6) var(--faye-ui-space-4)}
.task-search{flex:1;min-inline-size:8rem}.task-filter{display:flex;align-items:center;gap:var(--faye-ui-space-2);font-size:var(--faye-ui-font-size-sm)}
.task-list{padding:0;margin-block:var(--faye-ui-space-4);list-style:none;border-block-start:1px solid var(--faye-ui-color-border)}
.task-list>li{display:flex;align-items:center;gap:var(--faye-ui-space-3);padding-block:var(--faye-ui-space-3);border-block-end:1px solid var(--faye-ui-color-border)}
.task-control{display:flex;align-items:flex-start;gap:var(--faye-ui-space-3);flex:1;min-inline-size:0}
.task-control>.faye-ui-checkbox-root{flex-shrink:0;margin-block-start:.125rem}
.task-copy{display:grid;gap:var(--faye-ui-space-1);min-inline-size:0;overflow-wrap:anywhere;font-size:var(--faye-ui-font-size-sm)}
.task-copy strong{font-weight:500}.task-copy>span{color:var(--faye-ui-color-muted);white-space:pre-wrap}
.task-list>li[data-completed="true"] .task-copy strong{text-decoration:line-through;color:var(--faye-ui-color-muted)}
.task-row-actions{flex-shrink:0}
.task-empty{padding:var(--faye-ui-space-8) var(--faye-ui-space-4);text-align:center;border:1px dashed var(--faye-ui-color-border);border-radius:var(--faye-ui-radius-control);margin-block:var(--faye-ui-space-4)}
.task-footer{display:grid;gap:var(--faye-ui-space-2);margin-block-start:var(--faye-ui-space-6)}
.task-editor form{display:grid;gap:var(--faye-ui-space-4);margin-block-start:var(--faye-ui-space-4)}
.task-dialog-actions{justify-content:flex-end;flex-wrap:wrap;margin-block-start:var(--faye-ui-space-4)}
.task-skip{position:fixed;inset-block-start:-5rem;inset-inline-start:1rem;z-index:1000;background:var(--faye-ui-color-surface);color:var(--faye-ui-color-text);padding:var(--faye-ui-space-3)}.task-skip:focus{inset-block-start:.5rem}
@media(forced-colors:active){.task-header::after{forced-color-adjust:none;background:CanvasText}}
@media(max-width:40rem){.task-app{padding:var(--faye-ui-space-4)}.task-header{align-items:flex-start}.task-brand>div>span{max-inline-size:12rem}.task-toolbar{flex-wrap:wrap}.task-search{flex-basis:100%}.task-filter{flex:1}.task-settings{flex-direction:column;align-items:flex-end}.task-row-actions{gap:0}.task-list>li{gap:var(--faye-ui-space-2)}}
}
