.demo-main{padding-top:56px;padding-bottom:80px}.demo-heading{display:flex;justify-content:space-between;align-items:end;gap:24px}.demo-heading h1{font-size:clamp(32px,4vw,48px);letter-spacing:-.04em}.demo-heading p{font-size:15px;margin-top:20px}.demo-heading .button{flex-shrink:0;margin-bottom:4px}.demo-info{display:flex;align-items:center;gap:12px;padding:16px 20px;margin:32px 0;border:1px solid var(--line);border-radius:4px;background:var(--panel)}.demo-info>span:not(.status-dot){font:400 8px var(--mono);color:var(--green);letter-spacing:.05em}.demo-info p{font-size:12px;color:var(--muted);margin-left:auto}.demo-toolbar{display:flex;align-items:center;gap:20px;margin-bottom:28px}.demo-toolbar .support-search{margin:0;max-width:520px;width:100%}.priority-filter{display:flex;align-items:center;gap:12px;flex-shrink:0}.priority-filter>span{font:400 8px var(--mono);color:var(--muted)}.priority-filter select{background:var(--panel);border:1px solid var(--line-strong);border-radius:4px;color:var(--text);padding:14px 12px;font-size:12px;min-height:48px}.demo-toolbar>.mono{margin-left:auto;white-space:nowrap;font-size:9px}.task-board{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:start}.task-column{padding:16px;background:var(--bg-2);border:1px solid var(--line);border-radius:6px;min-height:390px}.task-column-header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:8px 4px 20px}.task-column-header h2{font:700 11px var(--mono);color:var(--muted);letter-spacing:.04em}.task-column[data-status=doing] .task-column-header h2{color:var(--accent)}.task-column[data-status=done] .task-column-header h2{color:var(--green)}.task-column-header>span{font:400 10px var(--mono);border:1px solid var(--line);padding:2px 6px;color:var(--muted);border-radius:3px}.task-card{margin-top:16px;padding:20px;background:var(--panel);border:1px solid var(--line-strong);border-radius:4px}.task-card-top{display:flex;justify-content:space-between;align-items:center;gap:8px}.priority-tag{font:400 8px var(--mono);text-transform:uppercase;border:1px solid var(--line-strong);border-radius:3px;padding:4px 7px;color:var(--muted)}.priority-alta{color:var(--accent);border-color:rgba(255,106,0,.3);background:rgba(255,106,0,.06)}.priority-media{color:var(--text)}.task-card h3{font-size:18px;margin:16px 0 12px;overflow-wrap:anywhere;line-height:1.4}.task-card p{font-size:12px;color:var(--muted);white-space:pre-wrap;overflow-wrap:anywhere}.task-card .date{font:400 8px var(--mono);color:var(--muted);margin-top:20px}.task-actions{display:flex;align-items:center;gap:8px;border-top:1px solid var(--line);margin-top:16px;padding-top:12px}.task-actions select{font-size:11px;color:var(--text);border:1px solid var(--line-strong);background:var(--bg-2);border-radius:3px;padding:8px;min-height:44px;min-width:0;flex:1}.task-edit,.task-remove{font:400 9px var(--mono);color:var(--muted);min-height:44px;padding:8px}.task-edit:hover{color:var(--accent)}.task-remove:hover{color:var(--error)}.task-empty{padding:32px 12px;font-size:12px;color:var(--muted);text-align:center;border:1px dashed var(--line-strong);border-radius:4px;margin-top:16px}.task-form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}.task-form-row>.field{margin:0}.demo-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:24px}.demo-bottom p{font-size:12px;color:var(--muted)}.demo-storage-warning{padding:16px 20px;border:1px solid var(--accent);border-radius:4px;margin-bottom:24px;font-size:13px}.task-status-done h3{color:#a09a90}.demo-main .note-panel{margin-top:40px}
@media(max-width:1000px){.task-board{gap:12px}.task-column{padding:12px}.task-card{padding:16px}.task-actions{flex-wrap:wrap}.task-actions select{flex-basis:100%}.demo-info{flex-wrap:wrap}.demo-info p{margin-left:0}.demo-toolbar{flex-wrap:wrap}.demo-toolbar .support-search{flex:1}.demo-toolbar>.mono{width:100%;margin-left:0}}
@media(max-width:700px){.demo-main{padding-top:32px;padding-bottom:64px}.demo-heading{align-items:start;flex-direction:column;gap:24px}.demo-heading h1{font-size:34px;line-height:1.15}.demo-heading p{font-size:14px}.demo-info{padding:16px;gap:10px;margin-block:24px}.demo-info p{width:100%;font-size:11px}.demo-toolbar{gap:16px}.demo-toolbar .support-search{width:100%;flex:auto;max-width:none}.demo-toolbar>.mono{width:auto;margin-left:auto}.priority-filter>span{font-size:7px}.task-board{grid-template-columns:1fr;gap:20px}.task-column{min-height:0;padding:16px}.task-card{padding:20px}.task-actions{flex-wrap:nowrap}.task-actions select{flex-basis:auto}.task-column-header{padding-bottom:16px}.demo-bottom{flex-direction:column;align-items:start;gap:12px}.task-form-row{gap:12px}}
