*{margin:0;padding:0;box-sizing:border-box}:root{--color-primary: #20df60;--color-primary-content: #064e1f;--color-primary-hover: #1bc954;--color-bg: #f8fafc;--color-surface: #ffffff;--color-text: #0f172a;--color-text-secondary: #64748b;--color-text-muted: #94a3b8;--color-border: #e2e8f0;--color-border-light: #f1f5f9;--color-success: #10b981;--color-warning: #f59e0b;--color-danger: #ef4444;--color-orange: #f97316;--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--radius-sm: .5rem;--radius-md: .75rem;--radius-lg: 1rem;--radius-xl: 1.5rem;--radius-full: 9999px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .07), 0 2px 4px -2px rgba(0, 0, 0, .05);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .08), 0 4px 6px -4px rgba(0, 0, 0, .04);--shadow-nav: 0 -4px 6px -1px rgba(0, 0, 0, .05);font-family:Be Vietnam Pro,-apple-system,BlinkMacSystemFont,Noto Sans KR,sans-serif;font-size:16px;line-height:1.5;color:var(--color-text);background-color:var(--color-bg)}body{margin:0;min-height:100dvh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{max-width:430px;margin:0 auto;min-height:100dvh;background-color:var(--color-bg);position:relative;overflow-x:hidden;box-shadow:0 25px 50px -12px #00000026}a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer;border:none;background:none}img{display:block;max-width:100%}ul,ol{list-style:none}.material-symbols-outlined{font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24}.scrollbar-hide::-webkit-scrollbar{display:none}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}.app{display:flex;flex-direction:column;min-height:100dvh}.header{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:48px 16px 16px;background:#ffffffe6;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:var(--shadow-sm)}.header-info{display:flex;flex-direction:column}.header-location{display:flex;align-items:center;gap:4px;font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-secondary)}.header-greeting{margin-top:4px;font-size:1.2rem;font-weight:700;letter-spacing:-.02em;color:var(--color-text)}.header-noti{position:relative;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-full);background:#f1f5f9;transition:background .2s}.header-noti:hover{background:#e2e8f0}.header-noti .material-symbols-outlined{font-size:22px;color:var(--color-text-secondary)}.noti-dot{position:absolute;top:8px;right:8px;width:8px;height:8px;border-radius:var(--radius-full);background:var(--color-danger);border:2px solid white}.icon-sm{font-size:18px!important}.icon-xs{font-size:16px!important}.main-content{flex:1;display:flex;flex-direction:column;gap:24px;padding:24px 16px 96px}.section-bar{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.section-label{display:flex;align-items:center;gap:8px;font-size:.85rem;font-weight:600;color:var(--color-text)}.section-title-lg{font-size:1.1rem;font-weight:700;color:var(--color-text)}.link-btn{font-size:.75rem;font-weight:500;color:var(--color-primary);transition:color .2s}.link-btn:hover{color:var(--color-primary-content)}.lunch-card{display:flex;gap:16px;align-items:center;padding:16px;background:var(--color-surface);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);border:1px solid rgba(15,23,42,.05);transition:box-shadow .2s}.lunch-card:hover{box-shadow:var(--shadow-md)}.lunch-thumb{flex-shrink:0;width:80px;height:80px;border-radius:var(--radius-lg);overflow:hidden;background:#f1f5f9}.lunch-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s}.lunch-card:hover .lunch-thumb img{transform:scale(1.1)}.lunch-info{flex:1;min-width:0}.lunch-menu{font-size:.95rem;font-weight:700;color:var(--color-text);line-height:1.4}.lunch-tip{margin-top:4px;font-size:.75rem;color:var(--color-text-secondary);line-height:1.4}.lunch-check{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--radius-full);background:#20df601a;color:var(--color-primary)}.lunch-check .material-symbols-outlined{font-size:20px}.trending-scroll{display:flex;gap:16px;overflow-x:auto;padding-bottom:8px;margin:0 -16px;padding-left:16px;padding-right:16px}.trending-item{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:72px;transition:transform .2s}.trending-item:hover{transform:scale(1.05)}.trending-ring{width:72px;height:72px;border-radius:var(--radius-full);padding:2px;border:2px solid #e2e8f0;outline:2px solid transparent;outline-offset:2px;transition:border-color .2s}.trending-ring.active{border-color:var(--color-primary)}.trending-ring img{width:100%;height:100%;border-radius:var(--radius-full);object-fit:cover}.trending-name{font-size:.75rem;font-weight:500;color:var(--color-text-secondary)}.hero-card{border-radius:var(--radius-xl);overflow:hidden;background:var(--color-surface);box-shadow:var(--shadow-lg);border:1px solid rgba(15,23,42,.05)}.hero-image{position:relative;height:192px;width:100%}.hero-image img{width:100%;height:100%;object-fit:cover}.hero-badge{position:absolute;top:16px;left:16px;padding:4px 12px;border-radius:var(--radius-full);background:#ffffffe6;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-size:.72rem;font-weight:700;color:var(--color-primary);box-shadow:var(--shadow-sm)}.hero-fav{position:absolute;top:16px;right:16px;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--radius-full);background:#ffffff4d;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:background .2s}.hero-fav:hover{background:#ffffff80}.hero-fav .material-symbols-outlined{font-size:20px;color:#fff}.hero-body{padding:20px}.hero-top{display:flex;align-items:flex-start;justify-content:space-between}.hero-name{font-size:1.2rem;font-weight:700;color:var(--color-text)}.hero-meta{display:flex;align-items:center;gap:12px;margin-top:8px;font-size:.82rem;color:var(--color-text-secondary)}.hero-meta-item{display:flex;align-items:center;gap:4px}.hero-avatars{display:flex;align-items:center}.hero-avatar{width:32px;height:32px;border-radius:var(--radius-full);border:2px solid white;object-fit:cover;margin-left:-8px}.hero-avatar:first-child{margin-left:0}.hero-avatar-count{width:32px;height:32px;border-radius:var(--radius-full);border:2px solid white;margin-left:-8px;display:flex;align-items:center;justify-content:center;background:#f1f5f9;font-size:.62rem;font-weight:700;color:var(--color-text-secondary)}.hero-cta{margin-top:20px;width:100%;padding:12px;border-radius:var(--radius-lg);background:var(--color-primary);color:#fff;font-size:.9rem;font-weight:700;box-shadow:0 4px 12px #20df6033;transition:transform .1s,background .2s}.hero-cta:hover{background:var(--color-primary-hover)}.hero-cta:active{transform:scale(.98)}.feed-grid{columns:2;column-gap:16px}.feed-item{break-inside:avoid;margin-bottom:16px;cursor:pointer;position:relative}.feed-img-wrap{border-radius:var(--radius-lg);overflow:hidden;background:#e2e8f0}.feed-img-wrap img{width:100%;display:block;object-fit:cover;transition:transform .3s}.feed-item:hover .feed-img-wrap img{transform:scale(1.05)}.feed-user{position:absolute;bottom:8px;left:8px;display:flex;align-items:center;gap:6px;padding:4px 8px;border-radius:var(--radius-full);background:#0006;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.feed-avatar{width:20px;height:20px;border-radius:var(--radius-full);border:1px solid rgba(255,255,255,.5);object-fit:cover}.feed-username{font-size:.62rem;font-weight:500;color:#fff}.placeholder-page{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:48px 0;min-height:400px}.placeholder-icon{font-size:56px!important;color:var(--color-text-muted);margin-bottom:16px}.placeholder-page h2{font-size:1.2rem;font-weight:700;color:var(--color-text);margin-bottom:8px}.placeholder-page p{font-size:.9rem;color:var(--color-text-muted)}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:430px;display:flex;align-items:center;justify-content:space-between;padding:12px 24px;padding-bottom:max(12px,env(safe-area-inset-bottom));background:var(--color-surface);border-top:1px solid #f1f5f9;box-shadow:var(--shadow-nav);z-index:30}.nav-item{display:flex;flex-direction:column;align-items:center;gap:4px}.nav-icon-wrap{display:flex;align-items:center;justify-content:center;width:48px;height:40px;border-radius:var(--radius-full);transition:background .2s}.nav-item:hover .nav-icon-wrap{background:#f1f5f9}.nav-item .material-symbols-outlined{font-size:24px;color:var(--color-text-muted);transition:color .2s}.nav-item:hover .material-symbols-outlined{color:var(--color-text-secondary)}.nav-label{font-size:.62rem;font-weight:500;color:var(--color-text-muted);transition:color .2s,font-weight .2s}.nav-item:hover .nav-label{color:var(--color-text-secondary)}.nav-item.active .nav-icon-wrap{background:#20df601a}.nav-item.active .material-symbols-outlined{color:var(--color-primary)}.nav-item.active .nav-label{color:var(--color-primary);font-weight:700}.loading-screen{display:flex;align-items:center;justify-content:center;min-height:100dvh}.loading-brand{display:flex;flex-direction:column;align-items:center;animation:pulse 1.5s ease-in-out infinite}.loading-logo{display:flex;align-items:center;justify-content:center;width:72px;height:72px;border-radius:var(--radius-xl);background:var(--color-primary);margin-bottom:16px;box-shadow:0 8px 24px #20df604d}.loading-logo .material-symbols-outlined{font-size:36px;color:#fff;font-variation-settings:"FILL" 1}.loading-title{font-size:1.4rem;font-weight:800;color:var(--color-text);letter-spacing:-.03em}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.login-page{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100dvh;padding:48px 24px;text-align:center}.login-brand{display:flex;flex-direction:column;align-items:center;margin-bottom:48px}.login-logo{display:flex;align-items:center;justify-content:center;width:80px;height:80px;border-radius:var(--radius-xl);background:var(--color-primary);margin-bottom:20px;box-shadow:0 8px 24px #20df604d}.login-logo .material-symbols-outlined{font-size:40px;color:#fff;font-variation-settings:"FILL" 1}.login-title{font-size:1.8rem;font-weight:800;color:var(--color-text);letter-spacing:-.03em}.login-slogan{margin-top:8px;font-size:.9rem;color:var(--color-text-secondary);line-height:1.6}.login-actions{width:100%;max-width:320px}.email-form{display:flex;flex-direction:column;gap:12px}.email-input{width:100%;padding:14px 16px;border-radius:var(--radius-lg);border:1px solid var(--color-border);background:var(--color-surface);font-family:inherit;font-size:.9rem;color:var(--color-text);outline:none;transition:border-color .2s,box-shadow .2s}.email-input::placeholder{color:var(--color-text-muted)}.email-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #20df6026}.email-error{font-size:.78rem;color:var(--color-danger);text-align:left;margin:0}.email-submit-btn{width:100%;padding:14px;border-radius:var(--radius-lg);background:var(--color-primary);color:#fff;font-family:inherit;font-size:.95rem;font-weight:700;border:none;cursor:pointer;box-shadow:0 4px 12px #20df6033;transition:background .2s,transform .1s}.email-submit-btn:hover{background:var(--color-primary-hover)}.email-submit-btn:active{transform:scale(.98)}.email-submit-btn:disabled{opacity:.6;cursor:not-allowed}.mode-toggle{margin-top:16px;font-size:.82rem;color:var(--color-text-secondary)}.mode-toggle-btn{background:none;border:none;font-family:inherit;font-size:.82rem;font-weight:600;color:var(--color-primary-content);cursor:pointer;padding:0;text-decoration:underline;text-underline-offset:2px}.login-divider{display:flex;align-items:center;gap:16px;margin:24px 0;color:var(--color-text-muted);font-size:.75rem}.login-divider:before,.login-divider:after{content:"";flex:1;height:1px;background:var(--color-border)}.google-btn{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;padding:14px 24px;border-radius:var(--radius-lg);background:var(--color-surface);border:1px solid var(--color-border);font-size:.95rem;font-weight:600;color:var(--color-text);box-shadow:var(--shadow-sm);transition:background .2s,box-shadow .2s,transform .1s;cursor:pointer}.google-btn:hover{background:#f8fafc;box-shadow:var(--shadow-md)}.google-btn:active{transform:scale(.98)}.google-icon{flex-shrink:0}.login-terms{margin-top:24px;font-size:.72rem;color:var(--color-text-muted);line-height:1.5}.login-link{color:var(--color-primary-content);font-weight:500}.profile-page{display:flex;flex-direction:column;gap:24px}.profile-card{display:flex;flex-direction:column;align-items:center;padding:32px 16px 24px;background:var(--color-surface);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);border:1px solid rgba(15,23,42,.05)}.profile-avatar-wrap{width:80px;height:80px;border-radius:var(--radius-full);overflow:hidden;margin-bottom:16px;border:3px solid var(--color-primary);padding:2px}.profile-avatar{width:100%;height:100%;border-radius:var(--radius-full);object-fit:cover}.profile-avatar-fallback{width:100%;height:100%;border-radius:var(--radius-full);background:#f1f5f9;display:flex;align-items:center;justify-content:center}.profile-avatar-fallback .material-symbols-outlined{font-size:40px;color:var(--color-text-muted)}.profile-name{font-size:1.2rem;font-weight:700;color:var(--color-text)}.profile-email{margin-top:4px;font-size:.82rem;color:var(--color-text-secondary)}.profile-menu{background:var(--color-surface);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);border:1px solid rgba(15,23,42,.05);overflow:hidden}.profile-menu-item{display:flex;align-items:center;width:100%;padding:16px 20px;background:none;border:none;cursor:pointer;transition:background .2s}.profile-menu-item:not(:last-child){border-bottom:1px solid var(--color-border-light)}.profile-menu-item:hover{background:#f8fafc}.profile-menu-icon{font-size:22px!important;color:var(--color-text-secondary);margin-right:14px}.profile-menu-label{flex:1;text-align:left;font-size:.9rem;font-weight:500;color:var(--color-text)}.profile-menu-arrow{font-size:20px!important;color:var(--color-text-muted)}.profile-logout{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:14px;border-radius:var(--radius-lg);background:#ef444414;color:var(--color-danger);font-size:.9rem;font-weight:600;border:none;cursor:pointer;transition:background .2s,transform .1s}.profile-logout:hover{background:#ef444424}.profile-logout:active{transform:scale(.98)}.profile-logout .material-symbols-outlined{font-size:20px}