:root{--font-sans: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--color-background: #f7fee7;--color-surface: #ffffff;--color-foreground: #1a2e05;--color-muted: #ecf3d8;--color-muted-foreground: #55613f;--color-border: #e2edc8;--color-primary: #4d7c0f;--color-accent: #a3e635;--color-accent-hover: #bef264;--color-on-accent: #1a2e05;--color-header: #1a2e05;--color-on-header: #ecfccb;--color-destructive: #b91c1c;--color-scrim: rgba(26, 46, 5, .55);--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px}*{box-sizing:border-box}body{margin:0;font-family:var(--font-sans);font-size:16px;line-height:1.5;background:var(--color-background);color:var(--color-foreground)}#root{min-height:100dvh;display:flex;flex-direction:column}button{font-family:inherit;touch-action:manipulation}:focus-visible{outline:3px solid rgba(77,124,15,.5);outline-offset:2px}.page{flex:1;display:flex;flex-direction:column}.header{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:center;gap:10px;padding:14px 16px;padding-top:calc(14px + env(safe-area-inset-top));background:var(--color-header);color:var(--color-on-header)}.header-icon{width:22px;height:22px;color:var(--color-accent);flex-shrink:0}.header-title{font-size:18px;font-weight:600;overflow-wrap:anywhere}.content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:24px 16px;padding-bottom:calc(24px + env(safe-area-inset-bottom))}.status-text{margin:0;font-size:17px;font-weight:500;color:var(--color-muted-foreground)}.state-card{display:flex;flex-direction:column;align-items:center;gap:12px;width:100%;max-width:420px;padding:40px 24px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);text-align:center}.state-icon{width:48px;height:48px;color:var(--color-primary)}.state-title{margin:0;font-size:24px;font-weight:700}.state-hint{margin:0;font-size:15px;color:var(--color-muted-foreground)}.scanner{width:100%;max-width:420px;display:flex;flex-direction:column;gap:12px}.scanner-view{position:relative}.scanner-video{display:block;width:100%;aspect-ratio:1 / 1;object-fit:cover;border-radius:var(--radius-xl);background:#101507}.flash-button{position:absolute;right:12px;bottom:12px;z-index:1;width:44px;height:44px;border:none;border-radius:50%;background:#1a2e0599;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background-color .15s ease,color .15s ease}.flash-button-on{background:var(--color-accent);color:var(--color-on-accent)}.flash-icon{width:22px;height:22px}.camera-error{margin:0;color:var(--color-destructive);text-align:center}.scan-button{width:100%;max-width:420px;min-height:52px;padding:14px;font-size:17px;font-weight:700;color:var(--color-on-accent);background:var(--color-accent);border:none;border-radius:var(--radius-lg);cursor:pointer;transition:background-color .15s ease,transform .15s ease}.scan-button:hover:not(:disabled){background:var(--color-accent-hover)}.scan-button:active:not(:disabled){transform:scale(.98)}.scan-button:disabled{background:var(--color-muted);color:var(--color-muted-foreground);cursor:not-allowed}.instructions{width:100%;max-width:420px;display:flex;flex-direction:column;gap:8px}.instruction{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md)}.instruction-title{padding:14px 16px;font-weight:600;cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;border-radius:var(--radius-md);transition:background-color .15s ease}.instruction-title:hover{background:#fbfdf2}.instruction-title::-webkit-details-marker{display:none}.instruction-title:after{content:"";width:8px;height:8px;flex-shrink:0;border-right:2px solid var(--color-primary);border-bottom:2px solid var(--color-primary);transform:translateY(-25%) rotate(45deg);transition:transform .15s ease}.instruction[open]>.instruction-title:after{transform:translateY(25%) rotate(225deg)}.instruction-body{padding:0 16px 14px;font-size:15px;line-height:1.6}.instruction-body>:first-child{margin-top:0}.instruction-body>:last-child{margin-bottom:0}.instruction-body img{max-width:100%;border-radius:var(--radius-md)}.instruction-body ul,.instruction-body ol{padding-left:20px}.instruction-body a{color:var(--color-primary)}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:var(--color-scrim);display:flex;align-items:center;justify-content:center;padding:24px}.dialog{width:100%;max-width:320px;background:var(--color-surface);border-radius:var(--radius-xl);padding:24px;display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center}.dialog-icon{width:40px;height:40px}.dialog-icon-success{color:var(--color-primary)}.dialog-icon-error{color:var(--color-destructive)}.dialog-text{margin:0;font-size:16px;overflow-wrap:anywhere}.dialog-button{width:100%;min-height:44px;padding:10px;font-size:16px;font-weight:700;border:none;border-radius:var(--radius-md);background:var(--color-accent);color:var(--color-on-accent);cursor:pointer;transition:background-color .15s ease}.dialog-button:hover{background:var(--color-accent-hover)}.spinner{width:44px;height:44px;border:4px solid var(--color-muted);border-top-color:var(--color-primary);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.scan-button,.dialog-button,.flash-button,.instruction-title,.instruction-title:after{transition:none}.scan-button:active:not(:disabled){transform:none}.spinner{animation-duration:1.6s}}