.Avatar{width:var(--avatar-size, 32px);height:var(--avatar-size, 32px);font-size:calc(var(--avatar-size, 32px) * .4);background:var(--avatar-bg, #9575cd);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;flex-shrink:0;line-height:1}.Banner{padding:var(--space-sm) var(--space-md);margin-top:var(--space-sm);display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);border-radius:var(--radius);border:1px solid var(--border)}.Banner-primary{font-size:14px;font-weight:500;display:flex;align-items:center;gap:var(--space-sm)}.Banner-icon{display:flex;align-items:center}.Banner-secondary{font-size:13px;font-weight:500;white-space:nowrap}.Banner--action{background:var(--banner-action-bg);border-color:var(--banner-action-border);color:var(--banner-action-text)}.Banner--waiting{background:var(--banner-waiting-bg);border-color:var(--banner-waiting-border);color:var(--banner-waiting-text)}.Banner--waiting .Banner-text{animation:pulse 2s ease-in-out infinite}.Banner--ready{background:var(--banner-ready-bg);border-color:var(--banner-ready-border);color:var(--banner-ready-text)}.Banner--info{background:var(--banner-info-bg);border-color:var(--banner-info-border);color:var(--banner-info-text)}.FileInput{border:2px dashed var(--border);border-radius:var(--radius);padding:var(--space-2xl) var(--space-lg);text-align:center;cursor:pointer;transition:border-color var(--transition),background var(--transition);margin-bottom:var(--space-md)}.FileInput:hover{border-color:var(--text-muted);background:var(--bg-subtle)}.FileInput--hasPreview{padding:0;border:none;background:transparent}.FileInput-preview{width:100%;aspect-ratio:1;object-fit:cover;border-radius:var(--radius)}.FileInput-icon{display:block;font-size:var(--space-xl);color:var(--text-muted);margin-bottom:var(--space-sm)}.FileInput-text{font-size:var(--font-md);color:var(--text-muted)}.FileInput-native{display:none}.rank-badge{width:var(--space-2xl);height:var(--space-2xl);min-width:var(--space-2xl);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:var(--font-xs);flex-shrink:0}.rank-badge.gold{background:gold;color:#5c4813}.rank-badge.silver{background:silver;color:#4a4a4a}.rank-badge.bronze{background:#cd7f32;color:#4a2c0a}.tag-list{list-style:none;padding:0;margin:var(--space-sm) 0 0;font-size:var(--font-xs);color:var(--accent);text-align:center}.tag{display:block}.tag:before{content:"✓ "}:root{--bg: #fafafa;--bg-subtle: rgba(0, 0, 0, .04);--bg-hover: rgba(0, 0, 0, .06);--text: #1a1a1a;--text-secondary: #555;--text-muted: #888;--border: rgba(0, 0, 0, .1);--border-subtle: rgba(0, 0, 0, .06);--accent: #0066cc;--accent-subtle: rgba(0, 102, 204, .1);--danger: #cc3333;--danger-subtle: rgba(204, 51, 51, .12);--success: #22863a;--warning: #f59e0b;--font-xs: 11px;--font-sm: 12px;--font-md: 13px;--font-base: 14px;--font-lg: 1.1rem;--font-xl: 1.25rem;--font-2xl: 1.5rem;--space-xs: 4px;--space-sm: 8px;--space-md: 12px;--space-lg: 16px;--space-xl: 24px;--space-2xl: 32px;--gutter: 20px;--touch-target: 44px;--radius-sm: 6px;--radius: 10px;--radius-pill: 50px;--shadow-sm: 0 2px 4px rgba(0, 0, 0, .1);--shadow: 0 2px 4px rgba(0, 0, 0, .2);--transition-fast: .1s ease;--transition: .15s ease;--transition-slow: .25s ease;--banner-action-bg: #dbeafe;--banner-action-border: #3b82f6;--banner-action-text: #1e40af;--banner-waiting-bg: var(--bg-subtle);--banner-waiting-border: var(--border);--banner-waiting-text: var(--text-muted);--banner-ready-bg: #d1fae5;--banner-ready-border: #10b981;--banner-ready-text: #065f46;--banner-info-bg: #dbeafe;--banner-info-border: #3b82f6;--banner-info-text: #1e40af}@media (prefers-color-scheme: dark){:root{--bg: #111;--bg-subtle: rgba(255, 255, 255, .06);--bg-hover: rgba(255, 255, 255, .1);--text: #f0f0f0;--text-secondary: #bbb;--text-muted: #777;--border: rgba(255, 255, 255, .1);--border-subtle: rgba(255, 255, 255, .06);--accent: #4d9fff;--accent-subtle: rgba(77, 159, 255, .15);--danger: #ff6b6b;--danger-subtle: rgba(255, 107, 107, .15);--success: #4caf50;--warning: #fbbf24;--shadow-sm: 0 2px 4px rgba(0, 0, 0, .3);--shadow: 0 2px 4px rgba(0, 0, 0, .4);--banner-action-bg: rgba(59, 130, 246, .15);--banner-action-border: rgba(59, 130, 246, .4);--banner-action-text: #60a5fa;--banner-waiting-bg: var(--bg-subtle);--banner-waiting-border: var(--border);--banner-waiting-text: var(--text-muted);--banner-ready-bg: rgba(16, 185, 129, .15);--banner-ready-border: rgba(16, 185, 129, .4);--banner-ready-text: #34d399;--banner-info-bg: rgba(59, 130, 246, .15);--banner-info-border: rgba(59, 130, 246, .4);--banner-info-text: #60a5fa}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes scale-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%,to{opacity:.4}50%{opacity:1}}*{box-sizing:border-box}button,input,textarea,select{font:inherit;color:inherit}button{border:none;background:none;cursor:pointer;padding:0;margin:0}input,textarea,select{margin:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif;font-size:var(--font-base);line-height:1.4;color:var(--text);background:var(--bg);padding:var(--space-lg) var(--gutter);padding-bottom:var(--space-2xl);max-width:480px;margin:0 auto;-webkit-font-smoothing:antialiased}h1,h2,h3{font-weight:600;margin:0 0 var(--space-sm)}h1{font-size:var(--font-xl)}h2{font-size:var(--font-lg)}h3{font-size:var(--font-base);color:var(--text-muted)}p{margin:0 0 var(--space-sm)}a{color:var(--accent);text-decoration:none;transition:opacity var(--transition)}a:hover{opacity:.8}a:active{opacity:.6}img{max-width:100%;height:auto}form{margin:0}header{padding-bottom:var(--space-lg);margin-bottom:var(--space-sm);border-bottom:1px solid var(--border-subtle)}header h1{margin-bottom:0}section,.section{margin-top:var(--space-xl)}.fixed{position:fixed}.fixed-top{position:fixed;top:0;left:0;right:0}.fixed-bottom{position:fixed;bottom:0;left:0;right:0}.fixed-full{position:fixed;top:0;right:0;bottom:0;left:0}.sticky-top{position:sticky;top:0}.z-bar{z-index:100}.z-modal{z-index:200}.z-overlay{z-index:300}.flex-center{display:flex;align-items:center;justify-content:center}.row{display:flex;gap:var(--space-sm);align-items:center}.row--between{justify-content:space-between}.stack{display:flex;flex-direction:column}.stack--sm{gap:var(--space-sm)}.stack--md{gap:var(--space-md)}.stack--lg{gap:var(--space-lg)}.grid{display:grid;gap:var(--space-md)}.grid--2col{grid-template-columns:repeat(2,1fr);margin-top:var(--space-md)}.text--muted{font-size:var(--font-sm);color:var(--text-muted);margin:var(--space-xs) 0 0}.text--secondary{color:var(--text-secondary)}.text--error{color:var(--danger);font-size:var(--font-md);margin:var(--space-sm) 0}.text--sm{font-size:var(--font-sm)}.text--mono{font-family:ui-monospace,monospace;letter-spacing:.03em}.text--center{text-align:center}.text--display{font-size:var(--font-2xl);font-weight:700;letter-spacing:.1em;margin:0}.bg-page{background:var(--bg)}.bg-subtle{background:var(--bg-subtle)}.border-t{border-top:1px solid var(--border)}.border-b{border-bottom:1px solid var(--border)}.container{max-width:480px;margin:0 auto}.p-sm{padding:var(--space-sm)}.p-md{padding:var(--space-md)}.p-lg{padding:var(--space-lg)}.p-xl{padding:var(--space-xl)}.px-sm{padding-left:var(--space-sm);padding-right:var(--space-sm)}.px-md{padding-left:var(--space-md);padding-right:var(--space-md)}.px-lg{padding-left:var(--space-lg);padding-right:var(--space-lg)}.px-xl{padding-left:var(--space-xl);padding-right:var(--space-xl)}.py-sm{padding-top:var(--space-sm);padding-bottom:var(--space-sm)}.py-md{padding-top:var(--space-md);padding-bottom:var(--space-md)}.py-lg{padding-top:var(--space-lg);padding-bottom:var(--space-lg)}.py-xl{padding-top:var(--space-xl);padding-bottom:var(--space-xl)}.pt-md{padding-top:var(--space-md)}.pb-md{padding-bottom:var(--space-md)}.px-gutter{padding-left:var(--gutter);padding-right:var(--gutter)}.m-0{margin:0}.mt-sm{margin-top:var(--space-sm)}.mt-md{margin-top:var(--space-md)}.mt-lg{margin-top:var(--space-lg)}.mt-xl{margin-top:var(--space-xl)}.mb-0{margin-bottom:0}.mb-sm{margin-bottom:var(--space-sm)}.mb-md{margin-bottom:var(--space-md)}.mb-lg{margin-bottom:var(--space-lg)}.mb-xl{margin-bottom:var(--space-xl)}.gap-sm{gap:var(--space-sm)}.gap-md{gap:var(--space-md)}.justify-start{justify-content:flex-start}.h-14{height:56px}.h-16{height:64px}.min-h-50{min-height:50vh}.pb-safe{padding-bottom:max(var(--space-md),env(safe-area-inset-bottom))}.Btn{font-family:inherit;font-size:var(--font-md);font-weight:500;padding:var(--space-sm) var(--space-lg);border:none;border-radius:var(--radius-pill);background:var(--bg-subtle);color:var(--text-secondary);cursor:pointer;transition:background var(--transition),transform var(--transition-fast)}.Btn:hover:not(:disabled){background:var(--bg-hover)}.Btn:active:not(:disabled){transform:scale(.97)}.Btn:disabled{opacity:.35;cursor:not-allowed;pointer-events:none}.Btn--accent{background:var(--accent);color:#fff}.Btn--accent:hover:not(:disabled){background:var(--accent);filter:brightness(1.1)}.Btn--accent.Btn--muted{background:var(--border);color:var(--text-muted)}.Btn--accent.Btn--muted:hover:not(:disabled){filter:brightness(1.05)}.Btn--danger{background:var(--danger-subtle);color:var(--danger)}.Btn--danger:hover:not(:disabled){background:var(--danger);color:#fff}.Btn--success{background:var(--success);color:#fff}.Btn--success:hover:not(:disabled){background:var(--success);filter:brightness(1.1)}.Btn--ghost{background:var(--accent-subtle);color:var(--accent)}.Btn--ghost:hover:not(:disabled){background:var(--accent-subtle);filter:brightness(.95)}.Btn--mono{display:inline-flex;align-items:center;gap:var(--space-xs);font-size:var(--font-xs);font-weight:500;font-family:ui-monospace,monospace;letter-spacing:.03em;padding:var(--space-xs) var(--space-sm);background:var(--bg-subtle);color:var(--text-muted)}.Btn--mono:hover:not(:disabled){background:var(--bg-hover)}.Btn--sm{font-size:var(--font-sm);padding:var(--space-xs) var(--space-md)}.Btn--full{width:100%}.Input{font-family:inherit;font-size:var(--font-base);padding:var(--space-sm) var(--space-md);border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);color:var(--text);width:100%;margin-bottom:var(--space-sm)}.Input:focus{outline:none;border-color:var(--text-muted)}.Input::placeholder{color:var(--text-muted)}.Input--code{text-transform:uppercase;letter-spacing:.1em;font-weight:600;text-align:center}.Label{display:block;font-size:var(--font-sm);font-weight:500;color:var(--text-muted);margin-bottom:var(--space-xs);margin-top:var(--space-md)}.List{list-style:none;padding:0;margin:0;background:var(--bg-subtle);border-radius:var(--radius);overflow:hidden}.List-item{padding:var(--space-md);min-height:var(--touch-target);border-bottom:1px solid var(--border-subtle);display:flex;justify-content:space-between;align-items:center;box-sizing:border-box;gap:var(--space-md)}.List-item:last-child{border-bottom:none}.List-item>span{flex:1;min-width:0}.List-item>button{flex-shrink:0}.List-item input{flex-shrink:0}.List-item input[type=checkbox]{width:20px;height:20px;margin:0;cursor:pointer}.List-item input[type=number]{width:56px;height:var(--space-2xl);margin:0;text-align:center;border:1px solid var(--border);border-radius:var(--radius-sm);padding:0 var(--space-sm);font-size:var(--font-base);background:var(--bg)}.List--results .List-item{justify-content:flex-start}.Card{background:var(--bg-subtle);border-radius:var(--radius);padding:var(--space-md)}.Card[aria-selected=true]{outline:2px solid var(--accent)}.Card--row{display:flex;align-items:center;gap:var(--space-lg);padding:var(--space-lg)}.Card-thumb{width:80px;height:80px;border-radius:var(--radius-sm);flex-shrink:0;padding:var(--space-sm);background:#fff}.Card--interactive{position:relative;text-align:center;cursor:pointer;padding:var(--space-sm);border-radius:var(--radius);transition:background var(--transition),transform var(--transition-fast);background:none;border:none;font:inherit;color:inherit;width:100%}.Card--interactive:active{background:var(--bg-hover);transform:scale(.98)}.Card--interactive[aria-pressed=true]{background:var(--accent-subtle);outline:2px solid var(--accent)}.Card-image{width:100%;aspect-ratio:1;object-fit:cover;border-radius:var(--radius-sm)}.Card-title{font-size:var(--font-sm);font-weight:600;color:var(--text);margin:var(--space-sm) 0 0;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.Card-meta{display:flex;align-items:center;justify-content:center;gap:var(--space-xs);font-size:var(--font-xs);color:var(--text-muted);margin:var(--space-xs) 0 0}.Card-meta span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.Card--interactive[data-owner=self] .Card-meta{color:var(--accent);font-weight:500}.Card--interactive[data-ready]:not([data-owner=self]){opacity:.7}.Badge{font-size:var(--font-xs);padding:2px var(--space-sm);background:var(--bg-subtle);border-radius:var(--radius-pill);color:var(--text-muted);font-weight:500}.Badge--accent{background:var(--accent);color:#fff}.Badge--success{background:var(--success);color:#fff}.Badge--overlay{position:absolute;top:var(--space-sm);right:var(--space-sm);width:var(--space-xl);height:var(--space-xl);padding:0;display:flex;align-items:center;justify-content:center;font-size:var(--font-sm);box-shadow:var(--shadow);z-index:1}.Badge--ready{position:absolute;top:var(--space-sm);left:var(--space-sm);width:var(--gutter);height:var(--gutter);padding:0;background:var(--success);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:var(--font-xs);font-weight:600}.ModalBackdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:200;padding:var(--gutter);animation:fade-in var(--transition)}.Modal{background:var(--bg);border-radius:var(--radius);padding:var(--space-xl);max-width:320px;width:100%;text-align:center;animation:scale-in var(--transition-slow)}.Modal h2{margin-bottom:var(--space-xs)}.Modal-subtitle{color:var(--text-muted);font-size:var(--font-md);margin-bottom:var(--gutter)}.Modal .text--display{margin-bottom:var(--gutter)}.Modal-actions{display:flex;gap:var(--space-sm);justify-content:center}.Modal--detail{padding:0;max-width:340px;overflow:hidden}.Modal--detail img{width:100%;aspect-ratio:1;object-fit:cover}.Modal--detail .Modal-body{padding:var(--space-lg)}.Modal--detail h2{font-size:var(--font-lg);margin:0 0 var(--space-xs)}.Stepper{display:flex;align-items:center;justify-content:center;gap:var(--space-lg);padding:var(--space-md) 0}.Stepper-arrow{flex-shrink:0}.Stepper-content{text-align:center;min-width:80px}.Stepper-title{font-size:var(--font-lg);font-weight:600;margin:0}.Stepper-subtitle{font-size:var(--font-md);color:var(--text-muted);margin:0}.Stepper-dots{display:flex;justify-content:center;gap:var(--space-sm);margin-bottom:var(--space-lg)}.Stepper-dot{width:12px;height:12px;padding:0;border-radius:50%;background:transparent;border:1.5px solid transparent;cursor:pointer;transition:border-color var(--transition),transform var(--transition-fast);box-sizing:border-box;display:flex;align-items:center;justify-content:center}.Stepper-dot:after{content:"";width:8px;height:8px;border-radius:50%;background:var(--border);transition:background var(--transition)}.Stepper-dot:hover{transform:scale(1.1)}.Stepper-dot:active{transform:scale(.95)}.Stepper-dot[data-status=full]:after{background:var(--accent)}.Stepper-dot[data-status=partial]:after{background:var(--warning)}.Stepper-dot[data-status=none]:after{background:var(--border)}.Stepper-dot[aria-current=step]{border-color:var(--accent)}.PageWrapper{display:flex;flex-direction:column;min-height:60vh}.PageContent{flex:1;display:flex;flex-direction:column}.List-thumb{width:var(--touch-target);height:var(--touch-target);object-fit:cover;border-radius:var(--radius-sm);flex-shrink:0}.List-details{flex:1;min-width:0}.List-name{font-weight:500;font-size:var(--font-base);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.List-meta{display:flex;align-items:center;gap:var(--space-xs);font-size:var(--font-sm);color:var(--text-muted);margin-top:2px}.List-value{font-size:var(--font-base);font-weight:600;color:var(--text);flex:0 0 auto;text-align:right}.QrCode{text-align:center;padding:var(--space-xl) 0}.QrCode img{width:180px;height:180px;border-radius:var(--radius)}.QrCode p{margin:var(--space-md) 0 0}.ChipGroup{display:flex;flex-wrap:wrap;gap:var(--space-sm)}.Chip{font-size:var(--font-md);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-pill);background:var(--bg-subtle);color:var(--text-secondary);border:1px dashed var(--border);cursor:pointer;transition:background var(--transition),border-color var(--transition),transform var(--transition-fast);display:inline-flex;align-items:center;gap:var(--space-sm)}.Chip:hover:not(:disabled){background:var(--accent-subtle);border-color:var(--accent);color:var(--accent)}.Chip:active:not(:disabled){transform:scale(.97)}.Chip:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.Status{text-align:center;padding:var(--space-xl) var(--space-lg);color:var(--text-muted)}
