:root{--bg-color:#f7f9fc;--surface-color:#fff;--primary:#4a6ee0;--primary-hover:#3b5cbd;--secondary:#21ce99;--text-main:#1a1f36;--text-muted:#697386;--border-color:#e3e8ee;--coupang:#08c;--naver:#03c75a;--shinsegae:red;--shadow-sm:0 2px 4px #0000000a;--shadow-md:0 8px 16px #00000014;--shadow-glass:0 8px 32px 0 #1f268712;--radius-sm:8px;--radius-md:16px;--radius-lg:24px;--radius-pill:9999px;--font-family:"Inter", system-ui, -apple-system, sans-serif;--transition-fast:.2s cubic-bezier(.4, 0, .2, 1);--transition-smooth:.4s cubic-bezier(.16, 1, .3, 1)}@media (prefers-color-scheme:dark){:root{--bg-color:#0b0f19;--surface-color:#1a1f2e;--primary:#5c7df5;--text-main:#f0f2f5;--text-muted:#8b95a5;--border-color:#2d3748;--shadow-sm:0 2px 4px #0003;--shadow-md:0 8px 16px #0000004d;--shadow-glass:0 8px 32px 0 #0006}}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);background-color:var(--bg-color);color:var(--text-main);-webkit-font-smoothing:antialiased;min-height:100vh;transition:background-color var(--transition-smooth), color var(--transition-smooth);background-image:radial-gradient(circle at 100% 0,#4a6ee00d 0%,#0000 40%),radial-gradient(circle at 0 100%,#21ce990d 0%,#0000 40%);background-attachment:fixed}#root{flex-direction:column;min-height:100vh;display:flex}.glass-panel{background:var(--surface-color);-webkit-backdrop-filter:blur(12px);border-radius:var(--radius-md);box-shadow:var(--shadow-glass);border:1px solid #ffffff1a}@media (prefers-color-scheme:dark){.glass-panel{background:#1a1f2eb3;border:1px solid #ffffff0d}}.btn{border-radius:var(--radius-pill);cursor:pointer;transition:all var(--transition-fast);font-weight:600;font-family:var(--font-family);border:none;justify-content:center;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-size:.875rem;display:inline-flex}.btn-primary{background:linear-gradient(135deg, var(--primary), var(--secondary));color:#fff;box-shadow:0 4px 14px #4a6ee04d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #4a6ee066}.btn-primary:active{transform:translateY(0)}.btn-outline{color:var(--text-main);border:1px solid var(--border-color);background:0 0}.btn-outline:hover{border-color:var(--primary);color:var(--primary);background:#4a6ee00d}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn .5s var(--transition-smooth) forwards}input[type=text]{border-radius:var(--radius-sm);border:1px solid var(--border-color);background:var(--surface-color);width:100%;color:var(--text-main);transition:all var(--transition-fast);outline:none;padding:.875rem 1rem;font-family:inherit}input[type=text]:focus{border-color:var(--primary);box-shadow:0 0 0 3px #4a6ee026}.app-container{background:var(--bg-color);width:100%;max-width:480px;min-height:100vh;box-shadow:var(--shadow-md);flex-direction:column;margin:0 auto;display:flex;position:relative;overflow-x:hidden}.page-content{flex:1;padding:1.5rem 1.5rem 5rem}.header{z-index:10;-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border-color);background:#f7f9fccc;justify-content:space-between;align-items:center;padding:1rem 1.5rem;display:flex;position:sticky;top:0}@media (prefers-color-scheme:dark){.header{background:#0b0f19cc}}.brand{background:linear-gradient(135deg, var(--primary), var(--secondary));-webkit-text-fill-color:transparent;-webkit-background-clip:text;align-items:center;gap:.25rem;font-size:1.25rem;font-weight:800;display:flex}.bottom-nav{background:var(--surface-color);border-top:1px solid var(--border-color);z-index:100;width:100%;max-width:480px;padding:.75rem 0;padding-bottom:calc(.75rem + env(safe-area-inset-bottom));justify-content:space-around;display:flex;position:fixed;bottom:0}.nav-item{color:var(--text-muted);transition:color var(--transition-fast);cursor:pointer;background:0 0;border:none;flex-direction:column;align-items:center;gap:.25rem;font-size:.75rem;font-weight:500;text-decoration:none;display:flex}.nav-item.active{color:var(--primary)}.nav-item svg{transition:transform var(--transition-fast)}.nav-item:hover svg{transform:translateY(-2px)}.toast{background:var(--text-main);color:var(--bg-color);border-radius:var(--radius-pill);box-shadow:var(--shadow-md);z-index:1000;pointer-events:none;white-space:nowrap;padding:.8rem 1.5rem;font-size:.9rem;font-weight:600;animation:.3s cubic-bezier(.16,1,.3,1) forwards slideUp;position:fixed;bottom:80px;left:50%;transform:translate(-50%)}@keyframes slideUp{0%{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%)}}.scanning-overlay{-webkit-backdrop-filter:blur(10px);z-index:2000;color:#fff;background:#000000a6;flex-direction:column;justify-content:center;align-items:center;animation:.3s ease-out forwards fadeIn;display:flex;position:fixed;inset:0}.scanner-box{border:4px solid #fff3;border-radius:20px;width:220px;height:220px;margin-bottom:2rem;position:relative;overflow:hidden;box-shadow:0 0 40px #00000080}.scanner-box:before{content:"";clip-path:polygon(0 0,20% 0,20% 100%,0 100%,0 20%,100% 20%,100% 0,0 0);opacity:.5;border:4px solid #fff;border-radius:20px;position:absolute;inset:0}.scanner-line{background:var(--primary);height:3px;box-shadow:0 0 15px var(--primary), 0 0 30px var(--primary);animation:1.5s cubic-bezier(.4,0,.2,1) infinite alternate scan;position:absolute;top:0;left:0;right:0}@keyframes scan{0%{opacity:.5;top:0%}50%{opacity:1}to{opacity:.5;top:100%}}