.btn{--btn-bg:var(--color-accent);--btn-fg:var(--color-on-accent);--btn-border:transparent;justify-content:center;align-items:center;gap:var(--space-2);min-height:var(--touch-target);padding:0 var(--space-5);border:1.5px solid var(--btn-border);border-radius:var(--radius-pill);background:var(--btn-bg);color:var(--btn-fg);text-align:center;cursor:pointer;-webkit-user-select:none;user-select:none;transition:transform var(--duration-fast) var(--ease-out), background-color var(--duration-md) var(--ease-out), box-shadow var(--duration-md) var(--ease-out), opacity var(--duration-md);font-weight:650;text-decoration:none;display:inline-flex;position:relative}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{opacity:.55;cursor:default}.btn-primary{box-shadow:0 4px 14px color-mix(in srgb, var(--color-accent) 35%, transparent)}.btn-secondary{--btn-bg:var(--color-accent-soft);--btn-fg:var(--color-accent-strong)}.btn-ghost{--btn-bg:transparent;--btn-fg:var(--color-text)}.btn-ghost:hover:not(:disabled){--btn-bg:var(--color-surface-2)}.btn-outline{--btn-bg:transparent;--btn-fg:var(--color-text);--btn-border:var(--color-border)}.btn-danger{--btn-bg:var(--color-danger-soft);--btn-fg:var(--color-danger)}.btn-sm{min-height:36px;padding:0 var(--space-3);font-size:var(--font-size-sm)}.btn-sm:after,.btn-icon:after{content:"";min-width:var(--touch-target);min-height:var(--touch-target);position:absolute;inset:-4px}.btn-lg{min-height:54px;padding:0 var(--space-6);font-size:var(--font-size-lg)}.btn-block{width:100%}.btn-icon{width:var(--touch-target);padding:0}.btn-sm.btn-icon{width:36px}.btn .spinner{width:1.1em;height:1.1em}.card{gap:var(--space-3);padding:var(--space-4) var(--space-5);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);flex-direction:column;display:flex}.card-tone-accent{background:linear-gradient(135deg, var(--color-accent-soft), var(--color-surface) 90%)}.card-tone-lavender{background:linear-gradient(135deg, var(--color-lavender-soft), var(--color-surface) 90%)}.card-tone-peach{background:linear-gradient(135deg, var(--color-peach-soft), var(--color-surface) 90%)}.card-tone-mint{background:linear-gradient(135deg, var(--color-mint-soft), var(--color-surface) 90%)}.card-interactive{cursor:pointer;text-align:left;color:inherit;font:inherit;width:100%;transition:transform var(--duration-fast) var(--ease-out), box-shadow var(--duration-md) var(--ease-out)}.card-interactive:active{transform:scale(.985)}.card-header{justify-content:space-between;align-items:center;gap:var(--space-2);min-height:28px;display:flex}.card-title{align-items:center;gap:var(--space-2);font-size:var(--font-size-sm);color:var(--color-muted);text-transform:none;font-weight:650;display:flex}.card-title svg{color:var(--color-accent)}.sheet-backdrop{z-index:50;background:var(--color-overlay);animation:fade-in var(--duration-md) var(--ease-out) both;position:fixed;inset:0}.sheet{z-index:51;max-width:var(--content-max);max-height:calc(100dvh - var(--safe-top) - var(--space-6));background:var(--color-surface);border-radius:var(--radius-xl) var(--radius-xl) 0 0;box-shadow:var(--shadow-lg);animation:sheet-in var(--duration-slow) var(--ease-out) both;flex-direction:column;margin:0 auto;display:flex;position:fixed;bottom:0;left:0;right:0}.sheet-closing .sheet{animation:sheet-out var(--duration-md) var(--ease-out) both}.sheet-closing .sheet-backdrop{animation:fade-out var(--duration-md) var(--ease-out) both}.sheet-handle{width:40px;height:5px;margin:var(--space-2) auto 0;border-radius:var(--radius-pill);background:var(--color-border);flex-shrink:0}.sheet-header{justify-content:space-between;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3) 0 var(--space-5);display:flex}.sheet-body{overscroll-behavior:contain;padding:var(--space-3) var(--space-5) calc(var(--safe-bottom) + var(--space-5));gap:var(--space-4);flex-direction:column;display:flex;overflow-y:auto}@keyframes sheet-in{0%{transform:translateY(100%)}to{transform:none}}@keyframes sheet-out{to{transform:translateY(100%)}}@keyframes fade-in{0%{opacity:0}}@keyframes fade-out{to{opacity:0}}.field{gap:var(--space-1);flex-direction:column;display:flex}.field-label{font-size:var(--font-size-sm);color:var(--color-muted);padding-left:var(--space-1);font-weight:600}.field-control{width:100%;min-height:var(--touch-target);padding:var(--space-2) var(--space-4);border:1.5px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface-2);font-size:max(16px, var(--font-size-md));transition:border-color var(--duration-md), box-shadow var(--duration-md);appearance:none}.field-control::placeholder{color:var(--color-muted);opacity:.8}.field-control:focus{border-color:var(--color-accent);box-shadow:0 0 0 4px var(--color-focus);outline:none}textarea.field-control{resize:vertical;min-height:96px;padding-top:var(--space-3)}select.field-control{padding-right:var(--space-10);background-image:linear-gradient(45deg, transparent 50%, var(--color-muted) 50%), linear-gradient(135deg, var(--color-muted) 50%, transparent 50%);background-position:calc(100% - 22px),calc(100% - 16px);background-repeat:no-repeat;background-size:6px 6px}input[type=date].field-control{align-items:center;display:flex}.field-hint{font-size:var(--font-size-xs);color:var(--color-muted);padding-left:var(--space-1)}.field-error .field-control{border-color:var(--color-danger)}.field-error .field-hint{color:var(--color-danger)}.field-row{gap:var(--space-3);grid-template-columns:1fr 1fr;display:grid}.switch{justify-content:space-between;align-items:center;gap:var(--space-3);min-height:var(--touch-target);cursor:pointer;display:flex}.switch input{appearance:none;border-radius:var(--radius-pill);background:var(--color-border);cursor:pointer;width:52px;height:32px;transition:background-color var(--duration-md) var(--ease-out);flex-shrink:0;margin:0;position:relative}.switch input:after{content:"";background:var(--color-surface);width:26px;height:26px;box-shadow:var(--shadow-sm);transition:transform var(--duration-md) var(--ease-spring);border-radius:50%;position:absolute;top:3px;left:3px}.switch input:checked{background:var(--color-accent)}.switch input:checked:after{transform:translate(20px)}.avatar{width:var(--avatar-size,44px);height:var(--avatar-size,44px);background:linear-gradient(135deg, var(--avatar-a,var(--color-accent-soft)), var(--avatar-b,var(--color-peach-soft)));color:var(--color-accent-strong);font-weight:700;font-size:calc(var(--avatar-size,44px) * .42);border:2px solid var(--color-surface);box-shadow:var(--shadow-sm);border-radius:50%;flex-shrink:0;place-items:center;line-height:1;display:inline-grid;overflow:hidden}.avatar img{object-fit:cover;width:100%;height:100%}.badge{align-items:center;gap:var(--space-1);min-height:22px;padding:0 var(--space-2);border-radius:var(--radius-pill);font-size:var(--font-size-xs);white-space:nowrap;background:var(--color-surface-2);color:var(--color-muted);font-weight:650;display:inline-flex}.badge-accent{background:var(--color-accent-soft);color:var(--color-accent-strong)}.badge-lavender{background:var(--color-lavender-soft);color:var(--color-text)}.badge-mint{background:var(--color-mint-soft);color:var(--color-success)}.badge-peach{background:var(--color-peach-soft);color:var(--color-text)}.badge-danger{background:var(--color-danger-soft);color:var(--color-danger)}.empty{text-align:center;align-items:center;gap:var(--space-2);padding:var(--space-6) var(--space-4);color:var(--color-muted);flex-direction:column;display:flex}.empty-icon{background:var(--color-accent-soft);width:64px;height:64px;color:var(--color-accent-strong);margin-bottom:var(--space-1);border-radius:50%;place-items:center;display:grid}.empty-title{color:var(--color-text);font-weight:650}.empty-action{margin-top:var(--space-2)}.spinner{width:var(--spinner-size,24px);height:var(--spinner-size,24px);border:2.5px solid color-mix(in srgb, currentColor 22%, transparent);border-top-color:currentColor;border-radius:50%;animation:.8s linear infinite spin;display:inline-block}.spinner-center{padding:var(--space-8);color:var(--color-accent);place-items:center;display:grid}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.spinner{animation-duration:2s}}.skeleton{--skeleton-base:color-mix(in srgb, var(--color-text) 8%, transparent);--skeleton-shine:#ffffff8c;border-radius:var(--radius-sm);background:var(--skeleton-base);flex-shrink:0;max-width:100%;display:block;position:relative;overflow:hidden}@media (prefers-color-scheme:dark){.skeleton{--skeleton-base:color-mix(in srgb, var(--color-text) 9%, transparent);--skeleton-shine:#ffffff12}}.skeleton:after{content:"";background:linear-gradient(90deg, transparent, var(--skeleton-shine), transparent);animation:1.5s ease-in-out infinite skeleton-shimmer;position:absolute;inset:0;transform:translate(-100%)}.skeleton-circle{border-radius:50%}.skeleton-lines{gap:var(--space-2);flex-direction:column;width:100%;display:flex}.skeleton-group{gap:var(--space-2);flex-direction:column;display:flex}@keyframes skeleton-shimmer{to{transform:translate(100%)}}@media (prefers-reduced-motion:reduce){.skeleton:after{animation:none;display:none}}:root:has(.ptr){overscroll-behavior-y:none}.ptr{position:relative}.ptr-at-top{touch-action:pan-x pan-down}.ptr-indicator{top:calc(var(--safe-top) + var(--space-2));z-index:40;pointer-events:none;opacity:var(--ptr-progress);transform:translateY(calc(var(--ptr-pull) - var(--touch-target) - var(--space-2)));transition:transform var(--duration-md) var(--ease-out), opacity var(--duration-md) var(--ease-out);justify-content:center;display:flex;position:fixed;left:0;right:0}.ptr-bubble{width:var(--touch-target);height:var(--touch-target);border-radius:var(--radius-pill);color:var(--color-accent);background:var(--color-surface);border:1px solid var(--color-border);box-shadow:var(--shadow-md);transform:scale(calc(.6 + var(--ptr-progress) * .4)) rotate(calc(var(--ptr-progress) * -20deg));transition:background-color var(--duration-md), transform var(--duration-md) var(--ease-spring);place-items:center;display:grid}.ptr-ready .ptr-bubble,.ptr-refreshing .ptr-bubble{color:var(--color-on-accent);background:var(--color-accent);border-color:#0000}.ptr-refreshing .ptr-bubble svg{animation:.9s ease-in-out infinite ptr-beat}.ptr-content{transition:transform var(--duration-md) var(--ease-out)}.ptr-dragging .ptr-content,.ptr-refreshing .ptr-content{transform:translateY(var(--ptr-pull))}.ptr-dragging .ptr-indicator,.ptr-dragging .ptr-content{transition:none}@keyframes ptr-beat{0%,to{transform:scale(1)}30%{transform:scale(1.25)}60%{transform:scale(.95)}}@media (prefers-reduced-motion:reduce){.ptr-indicator,.ptr-bubble,.ptr-dragging .ptr-content,.ptr-refreshing .ptr-content{transform:none}.ptr-refreshing .ptr-bubble svg{animation:none}}.toaster{left:0;right:0;top:calc(var(--safe-top) + var(--space-3));z-index:100;align-items:center;gap:var(--space-2);padding:0 var(--space-4);pointer-events:none;flex-direction:column;display:flex;position:fixed}.toast{pointer-events:auto;align-items:center;gap:var(--space-2);max-width:min(440px,100%);padding:var(--space-3) var(--space-4);border-radius:var(--radius-pill);background:var(--color-text);color:var(--color-bg);font-size:var(--font-size-sm);box-shadow:var(--shadow-lg);animation:toast-in var(--duration-slow) var(--ease-spring) both;font-weight:600;display:flex}.toast-action{min-height:var(--touch-target);margin:calc(var(--space-2) * -1) calc(var(--space-2) * -1) calc(var(--space-2) * -1) 0;padding:0 var(--space-3);border-radius:var(--radius-pill);background:var(--color-accent);color:var(--color-on-accent);font:inherit;cursor:pointer;border:0;flex:none;font-weight:700}.toast-error{background:var(--color-danger);color:#fff}.toast-leaving{animation:fade-out var(--duration-md) var(--ease-out) both}@keyframes toast-in{0%{opacity:0;transform:translateY(-12px)scale(.96)}}.invite-code{align-items:center;gap:var(--space-3);padding:var(--space-5) var(--space-4);border-radius:var(--radius-lg);border:2px dashed color-mix(in srgb, var(--color-accent) 45%, transparent);background:var(--color-accent-soft);text-align:center;flex-direction:column;display:flex}.invite-code-value{font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:var(--font-size-2xl);letter-spacing:.18em;color:var(--color-accent-strong);-webkit-user-select:all;user-select:all;word-break:break-all;font-weight:700}.invite-code-actions{gap:var(--space-2);flex-wrap:wrap;justify-content:center;display:flex}.list{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.list-row{align-items:center;gap:var(--space-3);min-height:56px;padding:var(--space-2) 0;display:flex}.list-row+.list-row{border-top:1px solid var(--color-border)}.list-row-button{align-items:center;gap:var(--space-3);min-height:var(--touch-target);color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:0;flex:1;padding:0;display:flex}.list-row-button>svg:last-child{color:var(--color-muted)}.list-row-main{flex-direction:column;flex:1;min-width:0;display:flex}.list-row-sub{font-size:var(--font-size-sm);color:var(--color-muted)}.segmented{border-radius:var(--radius-pill);background:var(--color-surface-2);border:1px solid var(--color-border);gap:4px;padding:4px;display:flex}.segmented button{border-radius:var(--radius-pill);min-height:40px;color:var(--color-muted);cursor:pointer;transition:background-color var(--duration-md) var(--ease-out), color var(--duration-md);background:0 0;border:0;flex:1;font-weight:650}.segmented button[aria-pressed=true]{background:var(--color-accent-soft);color:var(--color-accent-strong);box-shadow:var(--shadow-sm)}.debug-out{margin:var(--space-2) 0 0;padding:var(--space-2);border-radius:var(--radius-sm);background:color-mix(in srgb, var(--color-muted) 12%, transparent);white-space:pre-wrap;overflow-wrap:anywhere;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.75rem;line-height:1.5}.debug-actions{gap:var(--space-2);margin-top:var(--space-2);flex-wrap:wrap;display:flex}