:root{font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,PingFang SC,Noto Sans CJK SC,Microsoft YaHei,sans-serif;color:#15171b;background:#f3f5f8;font-synthesis:none;--blue: #2864ec;--muted: #737984;--surface: #ffffff}*{box-sizing:border-box}html{background:#e8ebef}body{margin:0;min-width:320px;min-height:100vh;overflow-x:hidden;background:#f3f5f8;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overscroll-behavior-y:none}#root{min-height:100vh}button{color:inherit;font:inherit}button:focus-visible{outline:3px solid rgba(40,100,236,.25);outline-offset:2px}.app-shell{position:relative;width:min(100%,520px);min-height:100dvh;margin:0 auto;overflow:visible;background:#f3f5f8;box-shadow:0 0 50px #272f3d14}.home-view,.detail-view{min-height:100dvh;animation:fade-in .24s ease both}.home-view{padding-bottom:116px}.hero{position:relative;height:clamp(188px,27vh,238px);overflow:hidden;background:#dce1e8}.hero>img{width:100%;height:100%;object-fit:cover;object-position:59% center}.hero:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,rgba(242,245,249,.52),transparent 72%);pointer-events:none}.hero-glass{position:absolute;z-index:1;left:18px;top:50%;width:50%;min-height:62%;padding:18px 17px;transform:translateY(-50%);border:1px solid rgba(255,255,255,.72);border-radius:22px;background:repeating-linear-gradient(90deg,#ffffff1f 0,#ffffff1f 2px,#ffffff05 2px,#ffffff05 7px),#f7f9fcb8;box-shadow:inset 0 1px 1px #ffffffe6,0 20px 45px #1821311f;-webkit-backdrop-filter:blur(18px) saturate(1.15);backdrop-filter:blur(18px) saturate(1.15)}.eyebrow{margin:0 0 6px!important;color:var(--blue)!important;font-size:8px!important;font-weight:800;letter-spacing:.16em}.hero-glass h1{margin:0;font-family:Songti SC,STSong,"Noto Serif CJK SC",serif;font-size:clamp(27px,7.6vw,36px);font-weight:700;letter-spacing:-.07em;white-space:nowrap}.hero-glass p{margin:0;color:#4d535d;font-size:13px;line-height:1.62;letter-spacing:.06em}.category-bar{position:sticky;z-index:15;top:0;display:flex;gap:29px;overflow-x:auto;padding:max(14px,env(safe-area-inset-top)) 20px 0;border-bottom:1px solid rgba(214,220,229,.72);background:#f3f5f8db;box-shadow:0 10px 24px #2831400f;-webkit-backdrop-filter:blur(20px) saturate(1.2);backdrop-filter:blur(20px) saturate(1.2);scrollbar-width:none}.category-bar::-webkit-scrollbar{display:none}.category-bar button{position:relative;flex:0 0 auto;padding:0 0 16px;border:0;background:none;font-size:16px;font-weight:560;cursor:pointer}.category-bar button:after{content:"";position:absolute;right:1px;bottom:8px;left:1px;height:3px;border-radius:4px;background:var(--blue);opacity:0;transform:scaleX(.45);transition:.22s ease}.category-bar button.active{color:var(--blue);font-weight:750}.category-bar button.active:after{opacity:1;transform:scaleX(1)}.dish-list{padding:14px 18px 24px}.dish-row{position:relative;overflow:hidden;margin-bottom:14px;border-radius:10px;background:transparent}.delete-reveal{position:absolute;top:0;right:-1px;bottom:0;display:flex;width:84px;flex-direction:column;align-items:center;justify-content:center;gap:5px;border:0;border-radius:0 10px 10px 0;background:#e23b44;color:#fff;font-size:12px;font-weight:650;cursor:pointer;opacity:0;transition:opacity .16s ease}.delete-reveal.visible{opacity:1}.dish-card{position:relative;z-index:1;display:grid;width:100%;height:96px;grid-template-columns:96px 1fr;padding:0;overflow:hidden;border:0;border-radius:10px;background:var(--surface);box-shadow:0 6px 22px #20293712;text-align:left;cursor:pointer;touch-action:pan-y;-webkit-user-select:none;user-select:none;transition:transform .22s cubic-bezier(.2,.75,.3,1),box-shadow .18s ease}.dish-card:active{box-shadow:0 3px 12px #20293714}.dish-card img{width:100%;height:100%;object-fit:cover;pointer-events:none}.dish-copy{display:flex;min-width:0;flex-direction:column;justify-content:center;padding:17px 14px 10px 17px}.dish-copy.title-only{padding-bottom:17px}.dish-copy strong{overflow:hidden;font-family:Songti SC,STSong,"Noto Serif CJK SC",serif;font-size:clamp(19px,5.3vw,23px);font-weight:700;letter-spacing:-.04em;text-overflow:ellipsis;white-space:nowrap}.dish-copy>span{display:block;margin-top:6px;overflow:hidden;color:var(--muted);font-size:12px;line-height:1.45;text-overflow:ellipsis;white-space:nowrap}.skeleton{display:grid;height:96px;grid-template-columns:46% 1fr;margin-bottom:14px;overflow:hidden;border-radius:10px;background:#fff}.skeleton span,.skeleton i{background:linear-gradient(100deg,#e8ebef 20%,#f6f7f9,#e8ebef 70%);background-size:240% 100%;animation:shimmer 1.2s infinite linear}.skeleton i{width:68%;height:18px;margin:auto;border-radius:6px}.empty-state{padding:62px 20px;border-radius:24px;background:#fff;text-align:center}.empty-state>div{display:grid;width:74px;height:74px;margin:0 auto 18px;place-items:center;border-radius:50%;background:#edf3ff;color:var(--blue)}.empty-state h3{margin:0;font-size:20px}.empty-state p{margin:8px 0 22px;color:var(--muted);font-size:14px}.empty-state button{padding:11px 20px;border:0;border-radius:13px;background:var(--blue);color:#fff;font-weight:700}.empty-state small{display:block;margin-top:12px;color:#a0a5ae;font-size:11px}.tab-bar{position:fixed;z-index:20;top:auto;right:max(18px,calc((100vw - 520px)/2 + 18px));bottom:calc(env(safe-area-inset-bottom) + 6px);left:max(18px,calc((100vw - 520px)/2 + 18px));display:grid;height:68px;grid-template-columns:repeat(3,1fr);overflow:hidden;border:1px solid rgba(255,255,255,.84);border-radius:24px;background:#fafcffc7;box-shadow:0 14px 34px #343f5129,inset 0 1px #ffffffdb;-webkit-backdrop-filter:blur(24px) saturate(1.35);backdrop-filter:blur(24px) saturate(1.35);contain:paint;transform:translateZ(0)}.tab-bar button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:0;background:none;color:#767c87;font-size:11px;cursor:pointer;transition:.16s ease}.tab-bar button:active{transform:scale(.92)}.tab-bar button.active{color:var(--blue)}.page-with-tabs{min-height:100dvh;padding:0 18px 122px;animation:fade-in .3s ease both}.edit-view{min-height:100dvh;padding:0 18px 102px;animation:fade-in .3s ease both}.edit-view .page-header{padding-top:max(76px,calc(env(safe-area-inset-top) + 54px))}.page-header{padding:max(42px,env(safe-area-inset-top)) 4px 24px}.page-kicker,.profile-hero>div>p,.stats-heading p{margin:0 0 7px;color:var(--blue);font-size:10px;font-weight:800;letter-spacing:.16em}.page-header h1{margin:0;font-family:Songti SC,STSong,serif;font-size:34px;letter-spacing:-.055em}.page-header>p:last-child{margin:10px 0 0;color:#797f89;font-size:14px}.dish-form{padding-bottom:82px}.file-input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.form-back-button{position:fixed;z-index:28;top:max(18px,env(safe-area-inset-top));left:max(18px,calc((100vw - 520px)/2 + 18px));display:grid;width:42px;height:42px;place-items:center;border:1px solid rgba(255,255,255,.62);border-radius:50%;background:#ffffffd1;box-shadow:0 10px 26px #222a381a;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.upload-area{position:relative;display:block;width:100%;height:250px;padding:0;overflow:hidden;border:1.5px dashed #b9c4d5;border-radius:24px;background:#ffffffa8;cursor:pointer}.upload-area.has-image{border:0;box-shadow:0 12px 30px #2630401f}.upload-area>img{width:100%;height:100%;object-fit:cover}.upload-placeholder{display:flex;height:100%;flex-direction:column;align-items:center;justify-content:center;color:#252932}.upload-icon{display:grid;width:68px;height:68px;margin-bottom:17px;place-items:center;border-radius:22px;background:#eaf1ff;color:var(--blue)}.upload-placeholder strong{font-size:17px}.upload-placeholder small{margin-top:7px;color:#858b96;font-size:12px}.change-photo{position:absolute;right:12px;bottom:12px;display:flex;align-items:center;gap:6px;padding:9px 12px;border:1px solid rgba(255,255,255,.45);border-radius:20px;background:#191d24b3;color:#fff;font-size:12px;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.form-section{display:grid;min-width:0;gap:24px;margin-top:18px;padding:24px 20px;border:1px solid rgba(255,255,255,.78);border-radius:24px;background:#ffffffc2;box-shadow:0 8px 28px #2630400e;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.form-field{display:block;min-width:0}.form-field>span,.category-picker legend{display:flex;width:100%;align-items:center;justify-content:space-between;margin-bottom:10px;color:#272b33;font-size:14px;font-style:normal;font-weight:750}.form-field>span small{color:#a0a5ae;font-size:11px;font-weight:500}.form-field input,.form-field textarea{width:100%;border:0;border-bottom:1px solid #dce1e8;border-radius:0;outline:0;background:transparent;color:#171a20}.form-field input{padding:5px 0 13px;font-family:Songti SC,STSong,serif;font-size:25px;font-weight:700}.form-field input::placeholder,.form-field textarea::placeholder{color:#b1b5bc}.form-field input:focus,.form-field textarea:focus{border-color:var(--blue)}.category-picker{min-width:0;margin:0;padding:0;border:0}.category-picker legend{padding:0}.category-picker>div{display:flex;flex-wrap:wrap;gap:9px;overflow:visible;scrollbar-width:none}.category-picker>div::-webkit-scrollbar{display:none}.category-picker label{flex:0 1 auto;padding:9px 13px;border:1px solid #e0e4ea;border-radius:18px;background:#f7f8fa;color:#686e78;font-size:13px;font-weight:650}.category-picker label.selected{border-color:#bdd0ff;background:#eaf1ff;color:var(--blue)}.category-picker input{position:absolute;opacity:0;pointer-events:none}.form-field textarea{min-height:150px;padding:8px 0 12px;resize:vertical;font-size:15px;line-height:1.75}.recipe-input em{display:block;margin-top:8px;color:#9a9fa8;font-size:11px;font-style:normal}.form-error{margin:14px 5px 0;color:#d72e39;font-size:13px}.save-button{position:fixed;z-index:18;right:max(18px,calc((100vw - 520px)/2 + 18px));bottom:calc(env(safe-area-inset-bottom) + 88px);left:max(18px,calc((100vw - 520px)/2 + 18px));display:flex;height:58px;align-items:center;justify-content:center;gap:8px;margin:0;border:0;border-radius:18px;background:var(--blue);box-shadow:0 12px 25px #2864ec3d;color:#fff;font-size:16px;font-weight:750}.save-button:disabled{opacity:.62}.edit-view .save-button{bottom:calc(env(safe-area-inset-bottom) + 18px)}.profile-view{position:relative;padding-top:max(20px,env(safe-area-inset-top));background:radial-gradient(circle at 50% 5%,rgba(91,124,255,.18),transparent 34%),linear-gradient(180deg,#eef2ffe6,#f3f5f800 34%)}.profile-hero{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:138px;margin-bottom:12px;padding:12px 24px 18px;text-align:center}.avatar{display:grid;width:62px;height:62px;flex:0 0 auto;place-items:center;border:4px solid rgba(255,255,255,.95);border-radius:50%;background:#fff;box-shadow:0 12px 30px #232c3a1f;color:var(--blue)}.profile-hero h1{margin:0;font-size:24px;color:#20242c;letter-spacing:-.035em}.profile-hero>div>span{display:block;margin-top:5px;color:#8c929c;font-size:13px;line-height:1.55}.stats-section{padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}.stats-heading{display:none}.stats-heading p{margin-bottom:3px}.stats-heading h2{margin:0;font-size:22px;letter-spacing:-.04em}.stats-heading>span{color:#9499a2;font-size:12px}.stats-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.stat-card{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:block;width:100%;text-align:left;min-height:64px;padding:12px 14px;border:1px solid #e7eaf0;border-radius:17px;background:#ffffffd1;box-shadow:0 5px 18px #2630400b}.stat-card>span{display:block;color:#646a75;font-size:13px;font-weight:650}.stat-card strong{display:inline-block;margin-top:8px;color:#1b1f27;font-size:38px;line-height:.9;letter-spacing:-.055em}.stat-card small{margin-left:5px;color:#9a9fa8;font-size:11px}.stat-card.featured{grid-column:1 / -1;min-height:82px;border-color:transparent;background:var(--blue);box-shadow:0 10px 22px #2864ec33}.stat-card.featured>span,.stat-card.featured small{color:#ffffffc2}.stat-card.featured strong{color:#fff}.detail-view{padding-bottom:110px;background:#f5f6f8}.detail-hero{position:relative;height:44vh;min-height:310px;max-height:440px}.detail-hero img{width:100%;height:100%;object-fit:cover}.back-button{position:fixed;z-index:30;top:max(18px,env(safe-area-inset-top));left:max(18px,calc((100vw - 520px)/2 + 18px));display:grid;width:44px;height:44px;place-items:center;border:1px solid rgba(255,255,255,.5);border-radius:50%;background:#fffc;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.detail-content{position:relative;margin-top:-28px;padding:28px 22px;border-radius:30px 30px 0 0;background:#f5f6f8}.detail-category{display:inline-block;padding:6px 11px;border-radius:20px;background:#eaf1ff;color:var(--blue);font-size:12px;font-weight:700}.detail-content h1{margin:0 0 12px;font-family:Songti SC,STSong,serif;font-size:38px;letter-spacing:-.06em}.recipe-block{margin-top:24px}.recipe-steps{display:grid;gap:12px;margin:0;padding:0;list-style:none}.recipe-steps li{display:grid;grid-template-columns:38px 1fr;gap:12px;padding:16px;border:1px solid rgba(220,225,232,.8);border-radius:18px;background:#ffffffc2;box-shadow:0 5px 18px #242c390b}.step-number{display:grid;width:36px;height:36px;place-items:center;border-radius:12px;background:#eaf1ff;color:var(--blue);font-size:12px;font-weight:800}.recipe-steps strong{display:block;margin:1px 0 5px;font-size:15px}.recipe-steps p{margin:0;color:#5d626c;font-size:14px;line-height:1.7}.detail-actions{position:fixed;right:max(18px,calc((100vw - 520px)/2 + 18px));bottom:calc(env(safe-area-inset-bottom) + 18px);left:max(18px,calc((100vw - 520px)/2 + 18px));z-index:20;display:grid;grid-template-columns:1fr 1.25fr;gap:12px;padding:10px;border:1px solid rgba(255,255,255,.7);border-radius:22px;background:#ffffffc7;box-shadow:0 12px 32px #1c233024;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.detail-actions button{height:50px;border:0;border-radius:14px;font-weight:750}.detail-actions .secondary{background:#edf0f4}.primary-danger{background:#e23b44;color:#fff}@supports (height: 100dvh){.app-shell,.home-view,.detail-view,.page-with-tabs,.edit-view{min-height:100dvh}}.dialog-backdrop{position:fixed;z-index:50;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:22px;background:#0f141d61;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:fade-in .18s ease both}.dialog{width:min(100%,330px);padding:25px 22px 18px;border:1px solid rgba(255,255,255,.8);border-radius:26px;background:#ffffffed;box-shadow:0 24px 70px #0f141d38;text-align:center}.dialog-icon{display:grid;width:48px;height:48px;margin:0 auto 12px;place-items:center;border-radius:50%;background:#ffe9eb;color:#d72e39}.dialog h2{margin:0;font-size:21px}.dialog p{margin:8px 0 22px;color:#737984;font-size:14px}.dialog-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.dialog-actions button{height:46px;border:0;border-radius:13px;background:#edf0f4;font-weight:700}.dialog-actions .danger{background:#e23b44;color:#fff}.toast{position:fixed;z-index:100;top:max(22px,env(safe-area-inset-top));left:50%;padding:10px 16px;transform:translate(-50%);border:1px solid rgba(255,255,255,.18);border-radius:22px;background:#191c22e6;box-shadow:0 10px 30px #0f141d2e;color:#fff;font-size:13px;white-space:nowrap;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);animation:toast-in .22s ease both}@keyframes shimmer{to{background-position:-240% 0}}@keyframes fade-in{0%{opacity:0}}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,-10px)}}@media(min-width:521px){body{padding:20px 0}#root{min-height:calc(100dvh - 40px)}.app-shell{min-height:calc(100dvh - 40px);border-radius:32px}}@media(max-width:370px){.hero-glass{left:14px;width:58%;padding:21px 18px}.category-bar{gap:24px;padding-right:16px;padding-left:16px}.dish-list{padding-right:14px;padding-left:14px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
