:root{--color-yes:#2f765a;--color-no:#ad3f4a;--color-primary:#2b5f91;--color-primary-strong:#1f4b78;--color-accent:#b08a57;--color-bg:#fff9f3;--color-text:#2d2930;--color-muted:#625c66;--color-card:#fff;--color-border:#e7d8c6;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--safe-right:env(safe-area-inset-right,0px)}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;font-size:100%}body{background:var(--color-bg);color:var(--color-text);min-height:100vh;min-height:100dvh;margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Hiragino Sans,Yu Gothic,Meiryo,sans-serif}#app{min-height:100vh;flex-direction:column;min-height:100dvh;display:flex}.screen{padding:max(1rem, var(--safe-top)) max(1rem, var(--safe-right)) max(1rem, var(--safe-bottom)) max(1rem, var(--safe-left));text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:1rem;display:flex}.start-card{background:var(--color-card);border:1px solid var(--color-border);border-radius:22px;flex-direction:column;align-items:center;gap:1rem;width:min(100%,380px);padding:1.5rem;display:flex;box-shadow:0 12px 32px #2d293014}.brand-mark{place-items:center;width:64px;height:48px;display:grid;position:relative}.brand-barcode{background:linear-gradient(90deg, var(--color-text) 0 8%, transparent 8% 16%, var(--color-text) 16% 22%, transparent 22% 32%, var(--color-text) 32% 42%, transparent 42% 50%, var(--color-text) 50% 56%, transparent 56% 68%, var(--color-text) 68% 78%, transparent 78% 86%, var(--color-text) 86% 100%), #fff;border:1px solid var(--color-border);border-radius:8px;width:48px;height:34px}.brand-check{background:var(--color-accent);color:#fff;border-radius:50%;place-items:center;width:24px;height:24px;font-size:1rem;font-weight:700;display:grid;position:absolute;bottom:0;right:4px}.app-title{margin:0;font-size:clamp(1.85rem,6vw,2.35rem);font-weight:700;line-height:1.3}.app-subtitle{color:var(--color-muted);margin:0;font-size:clamp(.9rem,3.5vw,1.1rem)}.period{color:var(--color-muted);border:1px solid var(--color-border);background:#fffdf9;border-radius:999px;justify-content:center;align-items:center;margin:0;padding:.35rem .75rem;font-size:clamp(.85rem,3vw,1rem);display:inline-flex}.btn{cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;border:1px solid #0000;border-radius:1rem;justify-content:center;align-items:center;min-width:220px;min-height:56px;padding:.85rem 1.25rem;font-size:1.1rem;font-weight:600;transition:background-color .12s,border-color .12s,transform .12s;display:inline-flex}.btn:active{transform:translateY(1px)}.btn:focus-visible{outline-offset:3px;outline:3px solid #b08a576b}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:active{background:var(--color-primary-strong)}.btn-secondary{border-color:var(--color-border);color:var(--color-text);background:#fff}.btn-close{color:var(--color-text);background:#f2ebe3;border-color:#dfd0be}.photo-picker{position:relative}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.screen-scan{justify-content:flex-start;padding:0;position:relative}.video-wrapper{background:#000;flex:1;justify-content:center;align-items:center;width:100%;display:flex;position:relative;overflow:hidden}#camera-video{object-fit:cover;width:100%;height:100%}.scan-guide{opacity:.55;pointer-events:none;border:none;width:min(80vw,480px);height:120px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.scan-guide:before,.scan-guide:after{content:"";border:4px solid #fffffff2;border-radius:.75rem;position:absolute;inset:0;-webkit-mask:linear-gradient(#000 0 0) 0 0/48px 48px no-repeat,linear-gradient(#000 0 0) 100% 0/48px 48px no-repeat,linear-gradient(#000 0 0) 0 100%/48px 48px no-repeat,linear-gradient(#000 0 0) 100% 100%/48px 48px no-repeat;mask:linear-gradient(#000 0 0) 0 0/48px 48px no-repeat,linear-gradient(#000 0 0) 100% 0/48px 48px no-repeat,linear-gradient(#000 0 0) 0 100%/48px 48px no-repeat,linear-gradient(#000 0 0) 100% 100%/48px 48px no-repeat}.scan-guide:after{border-color:#b08a57e6;inset:6px}.scan-guide.is-ready{opacity:1}.scan-guide-text{color:#fff;white-space:nowrap;background:#0009;border-radius:.5rem;margin:0;padding:.5rem .75rem;font-size:clamp(.85rem,3.5vw,1rem);position:absolute;top:calc(50% + 80px);left:50%;transform:translate(-50%)}.scan-controls{width:100%;padding:1rem;padding-bottom:max(1rem, var(--safe-bottom));flex-direction:column;gap:.75rem;display:flex}.scan-controls .btn{width:100%;min-width:0}.scan-help{color:var(--color-muted);margin:0 1rem 1rem;font-size:.85rem}.manual-label{font-size:1rem;font-weight:600}#manual-input{text-align:center;letter-spacing:.1em;border:2px solid #ced4da;border-radius:.5rem;width:min(90vw,320px);padding:.75rem;font-size:1.5rem}.manual-hint{color:var(--color-muted);margin:0;font-size:.85rem}.result-icon{margin-bottom:.5rem;font-size:clamp(4rem,18vw,7rem);font-weight:700;line-height:1}.result-yes{color:var(--color-yes)}.result-no{color:var(--color-no)}.result-error{color:var(--color-muted)}.result-title{margin:0;font-size:clamp(1.5rem,6vw,2.25rem);font-weight:700}.screen-result .result-yes+.result-title{background:#eaf5ef;border-radius:1rem;padding:.6rem 1rem}.screen-result .result-no+.result-title{background:#faecee;border-radius:1rem;padding:.6rem 1rem}.result-barcode{letter-spacing:.05em;color:var(--color-muted);margin:0;font-size:1.25rem}.result-reason{color:var(--color-muted);margin:0;font-size:.95rem}.result-products{flex-direction:column;gap:.75rem;width:100%;max-width:480px;display:flex}.product-card{background:var(--color-card);border:1px solid var(--color-border);text-align:left;border-radius:.75rem;padding:1rem;box-shadow:0 1px 3px #2d29300d}.product-name{margin:0 0 .25rem;font-size:1.1rem;font-weight:600}.product-meta{color:var(--color-muted);margin:0 0 .25rem;font-size:.9rem}.product-barcode{color:var(--color-muted);margin:0;font-size:.85rem}.error-message{color:var(--color-no);margin:0;font-weight:600}@media (min-width:600px){.scan-controls{flex-direction:row;justify-content:center}.scan-controls .btn{width:auto;min-width:180px}}@media (max-width:360px){.btn{min-width:100%}}@media (prefers-reduced-motion:reduce){.btn{transition:none}}