@import"https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css";@import"https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@200..900&display=swap";@import"https://fonts.cdnfonts.com/css/georgia";@layer swiper,reset,print,atom,molecules,organisms,template,page,utillity;@layer reset{:where(h1,h2,h3,h4,h5,h6,div,p,blockquote,pre,code,address,ul,ol,li,nav,section,article,header,footer,main,aside,dl,dt,dd,table,thead,tbody,tfoot,label,caption,th,td,form,fieldset,legend,hr,input,button,textarea,object,figure,figcaption,span,em,strong,i,b,u,ins,dialog){margin:0;padding:0;word-break:keep-all;font-family:var(--fontFamily)}:where(body,input,select,textarea,button,img,fieldset){border:none}:where(ul,ol,li,summary){list-style:none}:where(table){width:100%;border-spacing:0;border-collapse:collapse;table-layout:fixed}:where(address,cite,code,em,i){font-style:normal;font-weight:400}:where(u,ins,a){text-decoration:none}:where(button){background-color:unset}:where(a){color:inherit}:where(button,label,select,summary,[role=button],[role=option]){cursor:pointer}:where(:disabled,:disabled+label){cursor:not-allowed}:where(input,button,textarea,select){font:inherit;color:inherit;letter-spacing:inherit;word-spacing:inherit;font-feature-settings:inherit;font-variation-settings:inherit}:where(input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button){-webkit-appearance:none}:where(input[type=number]){-moz-appearance:textfield}:where(input[type=number],input[type=text],input[type=password],input[type=url],input[type=email],input[type=tel],input[type=date],textarea){-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:0}:where(input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration){-webkit-appearance:none}:where(input[type=date]){position:relative}:where(input[type=date]::-webkit-clear-button,input[type=date]::-webkit-inner-spin-button){display:none}:where(input[type=date]::-webkit-calendar-picker-indicator){position:absolute;left:0;top:0;background:transparent;color:transparent;cursor:pointer;width:100%;height:100%}:where(input[type=date]:before){content:attr(data-placeholder);width:100%}:where(input[type=date]:valid:before){display:none}:where(select){appearance:none}:where(html){padding:0;margin:0;font-size:var(--REM, 62.5%);-webkit-text-size-adjust:none}:where(body){font-size:1rem;padding:0;margin:0}:where(caption,legend,.a11y-hidden){overflow:hidden;position:absolute;border:0;width:1px;height:1px;clip:rect(1px,1px,1px,1px)}:where(summary::-webkit-details-marker){display:none}:where(dialog,[popover]){width:auto;height:auto;border:none}}@layer atom.variable.base{:root{--white: #ffffff;--gray50: #f7f7f7;--gray100: #f2f2f2;--gray200: #e6e6e6;--gray300: #cccccc;--gray400: #c7c7c7;--gray500: #b3b3b3;--gray600: #999999;--gray700: #666666;--gray800: #333333;--gray900: #222222;--green100: #f0fdf4;--green200: #dcfce7;--green300: #bbf7d0;--green400: #86efac;--green500: #4ade80;--green600: #22c55e;--green700: #16a34a;--green800: #15803d;--green900: #14532d;--green-primary: #69c86a;--amber100: #fffbeb;--amber200: #fef3c7;--amber300: #fde68a;--amber400: #fcd34d;--amber500: #fbbf24;--amber600: #f59e0b;--amber700: #d97706;--amber800: #b45309;--amber900: #78350f;--red100: #fef2f2;--red200: #fee2e2;--red300: #fecaca;--red400: #fca5a5;--red500: #f87171;--red600: #ef4444;--red700: #dc2626;--red800: #b91c1c;--red900: #7f1d1d;--red-danger: #cf1322;--blue100: #eff6ff;--blue200: #dbeafe;--blue300: #93c5fd;--blue400: #2563eb;--blue500: #1e3a8a;--color-primary: var(--green-primary);--color-secondary: var(--blue400);--color-warm: var(--amber600);--color-danger: var(--red-danger);--white0: rgba(255, 255, 255, 0);--white10: rgba(255, 255, 255, .1);--white20: rgba(255, 255, 255, .2);--white30: rgba(255, 255, 255, .3);--white40: rgba(255, 255, 255, .4);--white50: rgba(255, 255, 255, .5);--white60: rgba(255, 255, 255, .6);--white70: rgba(255, 255, 255, .7);--white80: rgba(255, 255, 255, .8);--white90: rgba(255, 255, 255, .9);--white100: rgba(255, 255, 255, 1);--black: #000;--black10: rgba(0, 0, 0, .1);--black20: rgba(0, 0, 0, .2);--black30: rgba(0, 0, 0, .3);--black40: rgba(0, 0, 0, .4);--black50: rgba(0, 0, 0, .5);--black60: rgba(0, 0, 0, .6);--black70: rgba(0, 0, 0, .7);--black80: rgba(0, 0, 0, .8);--black90: rgba(0, 0, 0, .9);--black100: rgba(0, 0, 0, 1);--radius-sm: .4rem;--radius-md: .6rem;--radius-lg: .9rem;--radius-xl: 1.2rem;--radius-2xl: 1.6rem;--radius-3xl: 2rem;--radius-pill: 999px;--border-width-thin: .15rem;--border-width-bold: .25rem;--border-main: var(--border-width-thin) solid var(--gray400);--border-primary: var(--border-width-bold) solid var(--green-primary);--space-xs: .2rem;--space-sm: .4rem;--space-md: .8rem;--space-lg: 1.2rem;--space-xl: 1.6rem;--space-2xl: 2.4rem}@media not (min-width:1024px){:root{--containerWidth: 100%}}}@layer utillity.align{.align{display:flex}.align.both{justify-content:space-between}.align.right{justify-content:end}.align.center{justify-content:center}.align.triple{display:grid;grid-template-columns:min-content 1fr min-content;align-items:center}.align.triple>:nth-child(1){justify-self:start;white-space:nowrap}.align.triple>:nth-child(2){justify-self:center}.align.triple>:nth-child(3){white-space:nowrap;justify-self:end}.align.vt{align-items:start}.align.vm{align-items:center}.align.vb{align-items:end}@media not (min-width:768px){.align:has(.breadcrumb){display:grid;gap:1.2rem}}.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}.text-justify{text-align:justify;word-break:normal}}@layer utillity.spacing{.mt-lg{margin-top:5rem}@media not (min-width:1024px){.mt-lg{margin-top:4rem}}@media not (min-width:768px){.mt-lg{margin-top:3rem}}.mt-md{margin-top:6rem}@media not (min-width:1024px){.mt-md{margin-top:6rem}}@media not (min-width:768px){.mt-md{margin-top:3.6rem}}.mt-base{margin-top:4.8rem}@media not (min-width:1024px){.mt-base{margin-top:3.6rem}}@media not (min-width:768px){.mt-base{margin-top:2.4rem}}.mt-xs{margin-top:2.4rem}@media not (min-width:1024px){.mt-xs{margin-top:1.6rem}}@media not (min-width:768px){.mt-xs{margin-top:1.2rem}}.mt-2xs{margin-top:1.6rem}@media not (min-width:1024px){.mt-2xs{margin-top:1.4rem}}@media not (min-width:768px){.mt-2xs{margin-top:1rem}}}@layer utillity.rounded{.rounded-none{border-radius:0}.rounded-sm{border-radius:var(--radius-sm)}.rounded-md{border-radius:var(--radius-md)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-3xl{border-radius:var(--radius-3xl)}.rounded-full{border-radius:var(--radius-pill)}}@layer atom.typography{:root{--font-4xl: 4.4rem;--font-3xl: 3.2rem;--font-2xl: 2.4rem;--font-xl: 2rem;--font-lg: 1.8rem;--font-md: 1.6rem;--font-base: 1.4rem;--font-sm: 1.2rem;--font-xs: 1rem;--lh-sm: 1.2;--lh-base: 1.5;--lh-md: 1.8;--ls-sm: -.02rem;--ls-base: 0;--ls-md: .01rem;--georgia: "Georgia", sans-serif;--pretendard: "Pretendard Variable", Pretendard;--notoserif: "Noto Serif KR", serif;--baseFontFamily: -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;--fontFamily: var(--pretendard), var(--baseFontFamily);--REM: 62.5%}body{background-color:var(--white)}.text-4xl{font-size:var(--fs, var(--font-4xl));line-height:160%;letter-spacing:-.08rem}.text-3xl{font-size:var(--fs, var(--font-3xl));line-height:160%;letter-spacing:-.08rem}.text-2xl{font-size:var(--fs, var(--font-2xl));line-height:160%;letter-spacing:-.08rem}@media not (min-width:768px){.text-2xl{--fs: 2.4rem;letter-spacing:-.072rem}}.text-xl{font-size:var(--fs, var(--font-xl));line-height:160%;letter-spacing:-.08rem}@media not (min-width:768px){.text-xl{--fs: 2rem;line-height:150%;letter-spacing:0}}.text-lg{font-size:var(--fs, var(--font-lg));line-height:160%;letter-spacing:-.08rem}.text-base{font-size:var(--fs, var(--font-base));line-height:160%;letter-spacing:-.08rem}.text-md{font-size:var(--fs, var(--font-md));line-height:160%;letter-spacing:-.08rem}.text-sm{font-size:var(--fs, var(--font-sm));line-height:160%}@media not (min-width:768px){.text-sm{--fs: 1.2rem}}.text-xs{font-size:var(--fs, var(--font-xs));line-height:160%;letter-spacing:-.08rem}strong,b{font-weight:var(--fw, 700)}.link{text-decoration:underline 2px;text-decoration-color:red;text-underline-offset:3px}.text-primary{color:var(--color-primary, #000)}.text-secondary{color:var(--color-warm, #000)}.text-danger{color:var(--color-danger, #000)}.text-success{color:var(--green600, #000)}.text-gray100{color:var(--gray100)}.text-gray200{color:var(--gray200)}.text-gray300{color:var(--gray300)}.text-gray400{color:var(--gray400)}.text-gray500{color:var(--gray500)}.text-gray600{color:var(--gray600)}.text-gray700{color:var(--gray700)}.text-gray800{color:var(--gray800)}.text-gray900{color:var(--gray900)}.app-bar-title{font-size:var(--font-base);font-weight:700;color:var(--gray900);flex:1;text-align:center}}@layer atom.layout{.container{max-width:120rem;margin-inline:auto;box-sizing:border-box}@media not (min-width:768px){.container{padding-inline:1.6rem}}body{overflow-x:hidden}body:has(.nav-container){padding-bottom:12rem}body:has(.header) main{padding-top:2rem}body:has(.onboarding-container,.auth-container) .btn-recipe{display:none}}@layer atom.button{.btn{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;text-align:center;border-radius:var(--radius-md);cursor:pointer;border:none;text-decoration:none;font-weight:700;transition:all .2s;white-space:nowrap;padding-inline:var(--px, 2rem);padding-block:var(--py, 1rem);font-size:var(--fs, 1rem)}.btn svg{width:var(--iconSize);height:var(--iconSize)}.btn.xs{--px: 1rem;--py: .4rem;--fs: .75rem;--iconSize: 1.2rem}.btn.sm{--px: 1.4rem;--py: .6rem;--fs: .875rem}.btn.base{--px: 1.6rem;--py: .8rem;--fs: 1.2rem;--iconSize: 1.6rem}.btn.md{--px: 2rem;--py: 1rem;--fs: 1.4rem}.btn.lg{--px: 2.4rem;--py: 1.2rem;--fs: 1.6rem}.btn.xl{--px: 2.8rem;--py: 1.4rem;--fs: 1.8rem}.btn.fullsize{width:100%}.btn.primary{background:var(--color-primary);color:var(--white)}.btn.primary:hover{filter:brightness(1.1)}.btn.outline{background:var(--white);border:.1rem solid var(--gray400);color:var(--gray800)}.btn.outline:hover{border-color:var(--gray900);background:var(--gray100)}.btn.ghost{background:transparent;color:var(--gray600)}.btn.ghost:hover{background:var(--gray100);color:var(--gray900)}.btn.secondary{background:var(--blue400);color:var(--white)}.btn.secondary:hover{background:var(--blue500)}.btn.danger{background:var(--red-danger);color:var(--white)}.btn.danger:hover{background:var(--red700)}.btn.dark{background:var(--gray900);color:var(--white)}.btn.dark:hover{background-color:var(--gray800)}.btn.edit{--px: 0;--py: 1.2rem;--fs: 1.2rem;background:transparent;color:var(--green-primary)}.btn.edit:hover{background:var(--green100)}.btn.delete{--px: 0;--py: 1.2rem;--fs: 1.2rem;background:transparent;color:var(--red-danger)}.btn.delete:hover{background:var(--red100)}.btn.share{--px: 0;--py: 1.2rem;--fs: 1.2rem;background:transparent;color:var(--gray900)}.btn.share:hover{background:var(--gray50)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn:has(svg){gap:0}.ico-button{--size: var(--iconSize, 3rem);--rounded: 0;display:inline-flex;justify-content:center;align-items:center;width:var(--size);aspect-ratio:1;border-radius:var(--rounded, 0);background-color:transparent;cursor:pointer;position:relative}.ico-button:has(svg:not(svg[aria-hidden=true])):after{content:"svg에 aria-hidden을 정의하세요";position:absolute;left:0;top:-1.5rem;white-space:nowrap;font-size:1.2rem;color:red;background-color:var(--white)}.ico-button:not([aria-label]):after{content:"button에 aria-label에 대체텍스트를 넣어주세요";position:absolute;left:0;top:-1.5rem;white-space:nowrap;font-size:1.2rem;color:red;background-color:var(--white)}.ico-button.xs{--iconSize: 1.5rem}.ico-button.sm{--iconSize: 1.6rem}.ico-button.base{--iconSize: 2rem}.ico-button.md{--iconSize: 2.5rem}.ico-button.lg{--iconSize: 2.8rem}.btn-dialog-close{width:2rem;height:2rem;border:none;cursor:pointer;position:absolute;top:1rem;right:1rem;background:#0000001a}.btn-recipe{position:fixed;right:3rem;bottom:15rem;z-index:200;text-align:center;font-size:1.6rem;font-weight:400}.btn-recipe div{background:var(--color-primary);width:4rem;height:4rem;border-radius:100rem;text-align:center;align-content:center;box-shadow:2px 2px 15px var(--black20);margin-inline:auto;margin-bottom:1rem;font-size:0}.btn-recipe svg{transition:rotate .5s}.btn-recipe:hover svg{rotate:360deg}.btn-group{display:flex;gap:.8rem}.btn-group .glow{flex:1}.btn-group .btn{flex-shrink:0}}@layer molecules.navigation{.nav-container{--circle-size: 6rem;--hole-size: 4rem;margin-top:10rem;position:fixed;inset:auto 0 0;z-index:5000;filter:drop-shadow(0 -.4rem 1.1rem var(--black10))}.nav-container .nav-bar{display:flex;justify-content:space-around;align-items:center;background:var(--white);height:7rem;border-radius:2.5rem 2.5rem 0 0;position:relative;-webkit-mask-image:radial-gradient(circle at 50% 0,transparent var(--hole-size),black calc(var(--hole-size) + .1rem));mask-image:radial-gradient(circle at 50% 0,transparent var(--hole-size),black calc(var(--hole-size) + .1rem));-webkit-mask-size:100% 100%;mask-size:100% 100%}.nav-container .nav-home-wrapper{position:absolute;top:0;left:50%;translate:-50% -50%;z-index:10}.nav-container .home-circle{width:var(--circle-size);height:var(--circle-size);background:linear-gradient(135deg,var(--green700) 0%,var(--green-primary) 100%);border-radius:50%;display:flex;justify-content:center;align-items:center;box-shadow:0 1rem 2rem color-mix(in srgb,var(--green-primary) 30%,transparent);cursor:pointer;transition:transform .3s cubic-bezier(.175,.885,.32,1.275)}.nav-container .home-circle:hover{transform:scale(1.05)}.nav-container .icon{width:2.4rem;height:2.4rem;color:var(--gray300);cursor:pointer;transition:.3s}.nav-container .icon:hover{color:var(--color-primary);transform:translateY(-.3rem)}.bottom-nav{position:fixed;bottom:0;left:0;right:0;height:7.2rem;background-color:var(--white90);-webkit-backdrop-filter:blur(1.2rem);backdrop-filter:blur(1.2rem);display:flex;justify-content:space-around;align-items:center;border-top:var(--border-width-thin) solid var(--gray200);padding-bottom:env(safe-area-inset-bottom);z-index:1000}.nav-item{display:flex;flex-direction:column;align-items:center;text-decoration:none;color:var(--gray500);gap:0rem;flex:1;transition:all .2s ease}.nav-item.active{color:var(--gray900)}.nav-icon{width:3.5rem;aspect-ratio:1;display:inline-flex;align-items:center;justify-content:center}.nav-label{font-size:1.2rem;font-weight:300}.nav-item[href="/camera"] .nav-icon{font-size:2.6rem;color:var(--white);padding:1rem;border-radius:2rem;margin-top:-3rem;box-shadow:none;display:block;border:.2rem solid var(--white);width:4.5rem}.nav-item.active .nav-icon{transform:translateY(-.2rem)}.category{display:flex;gap:1.6rem}@media not (min-width:768px){.category{display:grid;grid-template-columns:repeat(auto-fill,minmax(7rem,1fr));gap:1.6rem .8rem}}.category button{display:grid;gap:.8rem;justify-content:center;text-align:center}@media not (min-width:768px){.category button{gap:.4rem}}.category button.active{color:var(--color-primary);font-weight:700}.category button.active img{filter:drop-shadow(3px 3px 6px var(--black20))}.category img{width:100%;height:100%;object-fit:contain}.category .img{width:6rem;height:6rem;border-radius:calc(infinity * 1rem)}}@layer molecules.ui-common.molecules.ui-common{.ui-card{border-width:1.5px;border-style:solid;border-color:#e2e8f0;border-radius:24px;background:#fff;box-shadow:none}.ui-card-interactive{transition:transform .18s ease,box-shadow .18s ease}.ui-card-interactive:hover{border-color:#cbd5e1}.ui-card-list{display:grid;grid-template-columns:160px 1fr}.ui-card-soft{border-width:1.5px;border-style:solid;border-color:#e2e8f0;border-radius:24px;background:#f8fafc}.ui-btn{border-width:1.5px;border-style:solid;border-color:#e2e8f0;border-radius:999px;background:#fff;color:#4b5563;font-size:13px;font-weight:800;padding:10px 20px;cursor:pointer;transition:all .2s}.ui-btn-primary{border-color:#2ea44f;background:#2ea44f;color:#fff}.ui-btn-primary:hover{background:#268a42}.ui-btn-danger{border-color:#b91c1c;background:#b91c1c;color:#fff}.ui-badge{display:inline-flex;align-items:center;border-width:1px;border-style:solid;border-color:#cbd5e1;border-radius:999px;background:#fff;color:#334155;font-size:11px;font-weight:700;padding:4px 8px;white-space:nowrap}.ui-input{width:100%;box-sizing:border-box;border-width:1.5px;border-style:solid;border-color:#e2e8f0;border-radius:999px;background:#fff;color:#111827;padding:12px 20px;font-size:14px;outline:none;transition:all .2s}.ui-input:focus{border-color:#2ea44f}.ui-stack-8{display:grid;gap:8px}.ui-blocking-overlay{position:fixed;inset:0;z-index:999;background:#0f172a66;display:flex;align-items:center;justify-content:center;padding:24px}.ui-blocking-card{background:#fff;border-radius:16px;padding:24px 28px;display:grid;gap:8px;text-align:center;max-width:320px;box-shadow:0 12px 30px #0f172a33}.ui-blocking-title{font-size:18px;color:#111827}.ui-blocking-message{margin:0;font-size:14px;color:#475569}.ui-blocking-spinner{width:44px;height:44px;border-radius:50%;border:4px solid #e2e8f0;border-top-color:#2ea44f;margin:0 auto 4px;animation:ui-spin .8s linear infinite}.platform-banner{width:100%;background:#111827;color:#f9fafb;font-size:14px;font-weight:700;text-align:center;padding:10px 16px;position:sticky;left:0;display:block;top:0;z-index:50;display:none}@keyframes ui-spin{to{transform:rotate(360deg)}}}@layer atom.badge{.badge{--paddingX: .8rem;--paddingY: .5rem;--fontSize: 1.1rem;--radius: .8rem;display:inline-flex;align-items:center;box-sizing:border-box;text-align:center;justify-content:center;padding-inline:var(--paddingX);padding-block:var(--paddingY);font-size:var(--fontSize, var(--font-base));border-radius:var(--radius);font-weight:600}.badge.primary{color:var(--green700);background-color:var(--green200)}.badge.warm{color:var(--amber700);background-color:var(--amber200)}.badge.danger{color:var(--red700);background-color:var(--red200)}.badge.light{color:var(--gray600);background-color:var(--gray100)}.badge.circle{--paddingX: 0;--paddingY: 0;width:3.4rem;height:3.4rem;border-radius:var(--radius-pill);color:var(--green700);background-color:var(--green200)}}@layer molecules.chip{.chip{--borderOnColor: var(--color-primary);--borderOffColor: var(--gray400);--fontOnColor: var(--color-primary);--fontOffColor: var(--gray800);--bgOnColor: var(--green100);--bgOffColor: var(--white);--px: 1rem;--py: .5rem;--fontSize: var(--font-sm);--rounded: var(--radius-pill);--gap: .5rem;display:flex;align-items:center;gap:var(--gap)}.chip input{position:absolute;width:1px;height:1px;overflow:hidden}.chip input:checked+label{border-color:var(--borderOnColor);background-color:var(--bgOnColor);color:var(--fontOnColor)}.chip input:focus+label{outline:.2rem solid #000;outline-offset:.2rem}.chip label{padding:var(--py) var(--px);border:.1rem solid var(--borderOffColor);background-color:var(--bgOffColor);border-radius:var(--rounded);font-size:var(--fontSize);font-weight:600;color:var(--fontOffColor);cursor:pointer;transition:all .2s}}@layer molecules.pagination{.pagination{display:flex;justify-content:center;align-items:center;gap:8px}.pagination button{padding:8px 16px;border:var(--border-main);background:var(--white);border-radius:var(--radius-pill);cursor:pointer;font-size:14px;font-weight:800;color:var(--gray700);transition:all .2s}.pagination button.active{background:var(--green-primary);color:var(--white);border-color:var(--green-primary)}.pagination button:disabled{background:var(--gray100);color:var(--gray400);cursor:not-allowed;border-color:var(--gray200)}.pagination button:hover:not(:disabled):not(.active){background:var(--gray200);border-color:var(--gray600);color:var(--gray900)}.pagination-desktop-pages{display:contents}.pagination-mobile-indicator{display:none;min-width:4.25rem;padding:.6rem 1rem;border:var(--border-main);border-radius:var(--radius-pill);background:var(--gray100);font-size:13px;font-weight:800;color:var(--gray800);text-align:center}@media not (min-width:768px){.pagination{gap:6px}.pagination>button:first-child,.pagination>button:last-child,.pagination-desktop-pages{display:none}.pagination-mobile-indicator{display:inline-flex;align-items:center;justify-content:center}.pagination>button{min-width:52px;padding:8px 12px}}}@layer molecules.select{.select{--height: 4rem;--pl: 1.6rem;--pr: 4rem;--rounded: var(--radius-md);--borderColor: var(--gray400);--bgColor: var(--white);--fontSize: 1.4rem;--fontColor: var(--gray800);--arrowImage: url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d%3D%22M5%207.5L10%2012.5L15%207.5%22%20stroke%3D%22%232EA44F%22%20stroke-width%3D%222.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%3C/svg%3E);--arrowPositionX: right 1.6rem;--arrowPositionY: center;--arrowSize: 1.4rem;height:var(--height);padding-inline:var(--pl) var(--pr);border-radius:var(--rounded);border:1px solid var(--borderColor);background-color:var(--bgColor);background-image:var(--arrowImage);background-repeat:no-repeat;background-position:var(--arrowPositionX) var(--arrowPositionY);background-size:var(--arrowSize) auto;color:var(--fontColor);font-size:var(--fontSize);font-weight:700;outline:none;appearance:none;cursor:pointer;transition:all .2s}.select:focus{border-color:var(--green-primary)}}@layer molecules.textfield{.text-field{--paddingX: 1.2rem;--paddingY: 0;--width: 100%;--height: 4rem;--borderColor: var(--gray400);--rounded: var(--radius-md);--fontSize: var(--font-base);--fontWeight: 500;--color: inherit;--bgColor: transparent;--placeholderColor: var(--gray500);--hoverBorderColor: var(--gray400);--focusBorderColor: var(--green-primary);--focusBgColor: var(--green100);--readonlyBorderColor: var(--gray500);--readonlyBgColor: var(--gray100);--disabledBorderColor: var(--gray500);--disabledBgColor: var(--gray100);width:var(--width);padding-inline:var(--paddingX);padding-block:var(--paddingY);min-width:0;height:var(--height);border:.15rem solid var(--borderColor);border-radius:var(--rounded);box-sizing:border-box;background-color:var(--bgColor);color:var(--color);font-size:var(--fontSize);font-weight:var(--fontWeight);outline:none;transition:all .2s}.text-field::placeholder{color:var(--placeholderColor)}.text-field:hover{border-color:var(--hoverBorderColor)}.text-field:focus{border-color:var(--focusBorderColor);background:var(--focusBgColor);outline:none}.text-field:disabled{border-color:var(--disabledBorderColor);background-color:var(--disabledBgColor)}.text-field:read-only{border-color:var(--readonlyBorderColor);background-color:var(--readonlyBgColor)}.text-field:invalid,.text-field.error{border:.15rem solid var(--danger);color:var(--danger)}textarea.text-field{--width: 100%;--height: 10rem;--paddingY: 1.6rem}}@layer molecules.checkbox{.checkbox{--offImage: none;--onImage: none;--fontSize: var(--font-base);--fontWeight: 800;--offColor: var(--gray800);--onColor: #166534;--pl: 2rem;--pr: 2rem;--py: 1rem;--height: auto;--rounded: var(--radius-pill);--borderColor: var(--gray400);--checkedBorderColor: var(--green-primary);--bgColor: transparent;--checkedBgColor: var(--green100);--outline: none;display:inline-flex;align-items:center}.checkbox input{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}.checkbox input:checked+label{color:var(--onColor);border-color:var(--checkedBorderColor);background-color:var(--checkedBgColor)}.checkbox input:focus+label{outline:var(--outline);border-radius:var(--rounded)}.checkbox input:disabled+label{opacity:.4;cursor:not-allowed}.checkbox label{display:inline-flex;align-items:center;padding:var(--py) var(--pr) var(--py) var(--pl);border-radius:var(--rounded);border:.15rem solid var(--borderColor);font-size:var(--fontSize);font-weight:var(--fontWeight);color:var(--offColor);background-color:var(--bgColor);cursor:pointer;transition:all .2s;-webkit-user-select:none;user-select:none;background-image:var(--offImage);background-repeat:no-repeat;background-position:left center}.checkbox:has(label:empty){--pl: 2.4rem}}@layer molecules.file{.file{width:100%;padding:.4rem;border:.1rem solid var(--gray300);border-radius:var(--radius-md);background:#fff;color:#222;font-size:1.4rem;box-sizing:border-box;cursor:pointer}.file:hover{border-color:var(--gray600);background:var(--gray50)}.file:focus{outline:none;border-color:#222;box-shadow:0 0 0 .3rem var(--black10)}.file::file-selector-button{margin-right:1.2rem;padding:.55rem 1.4rem;border:0;border-radius:.8rem;background:var(--gray900);color:var(--white);font-size:1.3rem;cursor:pointer}.file::file-selector-button:hover{background:var(--gray700)}}@layer molecules.switch{.switch{--height: 3.8rem;--width: calc(var(--height) * 1.714);--padding: .4rem;--thumbSize: calc(var(--height) - (var(--padding) * 2));--borderColor: transparent;--offColor: var(--white);--offBgColor: var(--gray400);--onColor: var(--white);--onBgColor: var(--color-primary);--textColor: transparent}.switch.sm{--height: 2.6rem;--width: calc(var(--height) * 1.714);--padding: .3rem;--thumbSize: calc(var(--height) - (var(--padding) * 2))}.switch input{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}.switch input:checked+label{background-color:var(--onBgColor)}.switch input:checked+label:before{left:100%;translate:calc(-100% - var(--padding)) -50%;background-color:var(--onColor)}.switch input:focus+label{outline:.2rem solid #000}.switch label{position:relative;display:flex;align-items:center;justify-content:end;box-sizing:border-box;width:var(--width);height:var(--height);padding:var(--padding);border:.1rem solid var(--borderColor);border-radius:var(--height);background-color:var(--offBgColor);transition:.3s;cursor:pointer}.switch label:before{content:"";position:absolute;left:var(--padding);top:50%;translate:0 -50%;width:var(--thumbSize);height:var(--thumbSize);border-radius:50%;background-color:var(--offColor);transition:.3s}.switch label:after{content:"";font-size:0}}@layer molecules.tab{.tab{--bg-tab-default: var(--gray200);--bg-tab-active: var(--color-primary);--text-title: var(--gray800);--text-body: var(--gray500);--text-muted: #b8b8b8;--text-tab-default: var(--gray700);--text-tab-active: var(--white);--border-light: #ececec;--shadow-tab-active: 3px 8px 18px var(--black20);--tab-height: 4rem;--tab-radius: 1.5rem;--tab-padding-x: 2rem;--tab-font-size: 1.4rem;--tab-font-weight: 500;--tab-gap: 1rem;display:flex;gap:var(--tab-gap);scrollbar-width:none}.tab::-webkit-scrollbar{display:none}.tab>button{height:var(--tab-height);padding-inline:var(--tab-padding-x);border-radius:var(--tab-radius);background:var(--bg-tab-default);color:var(--text-tab-default);font-size:var(--tab-font-size);font-weight:var(--tab-font-weight);line-height:1;letter-spacing:.02em;cursor:pointer;white-space:nowrap;transition:background-color .2s ease,color .2s ease,box-shadow .2s ease,transform .2s ease}.tab>button.active{background:var(--bg-tab-active);color:var(--text-tab-active);box-shadow:var(--shadow-tab-active)}.tab>button.active.failure{background:var(--color-danger)}}@layer molecules.sort{.sort{display:flex;background-color:var(--gray50);border-radius:var(--radius-lg);padding:4.5px}.sort button{padding:8px 16px;font-size:13px;font-weight:700;color:var(--gray600);border-radius:var(--radius-md)}.sort button.active{background-color:var(--white);color:var(--gray900);box-shadow:0 1px 2px var(--black10)}}@layer molecules.forms{.search-form{display:grid;grid-template-columns:1fr min-content min-content;gap:10px}@media not (min-width:768px){.search-form{grid-template-columns:1fr 1fr;grid-template-rows:min-content min-content}.search-form input{grid-column:1 / -1}}.search-form:has(.input-group){grid-template-columns:repeat(4,1fr)}@media not (min-width:1024px){.search-form:has(.input-group){grid-template-columns:repeat(auto-fill,minmax(20rem,1fr))}}.search-form .colspan{grid-column:1/-1}.input-group{display:grid;gap:.4rem}.input-group label{font-size:var(--font-base);font-weight:400;color:var(--gray800)}.form-group{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.form-group:has(.btn-group){grid-template-columns:1fr 1fr 1fr 1fr 8rem}@media not (min-width:768px){.form-group:has(.btn-group){grid-template-columns:1fr 1fr}.form-group:has(.btn-group) .input-group:first-child,.form-group:has(.btn-group) .input-group:nth-last-child(2){grid-column:1/-1}}.form-group:has(.btn-group) .btn-group{display:flex;align-items:center}.form-group:has(.btn-group) .btn-group button{align-self:end}.form-group-type2{display:grid;grid-template-columns:min-content 5fr 1fr min-content;gap:1rem .5rem}.form-group-type2 .text-field{--bgColor: var(--white)}.form-group-type2 .btn.dark{order:3}.form-group-type2 .btn.outline{order:4}@media not (min-width:1024px){.form-group-type2{grid-template-columns:min-content 1fr 1fr 1fr;gap:1rem .5rem}.form-group-type2 .text-field{grid-column:2/-1}.form-group-type2 .btn.dark{grid-column:2/-1;order:4}}.form-row{display:grid;gap:.4rem}.form-row~.form-row{margin-top:1rem}.form-row.type2{grid-template-columns:1fr 7rem min-content min-content}.form-row.type3{grid-template-columns:1fr min-content}.form-row.colspan{grid-column:1/-1}.search-form2{padding:1rem;background-color:var(--gray50);border-radius:var(--radius-md)}}@layer molecules.date{input[type=date].text-field{--date-icon-size: 1.6rem;--date-icon-right: 1.2rem;--date-field-radius: .3rem;--date-sep-color: var(--gray500);--date-field-bg: var(--green200);--date-field-color: var(--white);--date-icon-opacity: .7;--date-disabled-opacity: .5;appearance:none;-webkit-appearance:none;position:relative;padding-right:calc(var(--paddingX) + var(--date-icon-size) + 1.2rem);line-height:1;cursor:pointer}input[type=date].text-field::-webkit-datetime-edit{padding:0;color:var(--color)}input[type=date].text-field::-webkit-datetime-edit-fields-wrapper{padding:0}input[type=date].text-field::-webkit-datetime-edit-text{color:var(--date-sep-color);padding-inline:.2rem}input[type=date].text-field::-webkit-datetime-edit-year-field,input[type=date].text-field::-webkit-datetime-edit-month-field,input[type=date].text-field::-webkit-datetime-edit-day-field{color:var(--color)}input[type=date].text-field::-webkit-datetime-edit-year-field:focus,input[type=date].text-field::-webkit-datetime-edit-month-field:focus,input[type=date].text-field::-webkit-datetime-edit-day-field:focus{background:var(--date-field-bg);color:var(--date-field-color);border-radius:var(--date-field-radius);outline:none}input[type=date].text-field::-webkit-calendar-picker-indicator{position:absolute;right:var(--date-icon-right);top:50%;transform:translateY(-50%);width:var(--date-icon-size);height:var(--date-icon-size);margin:0;padding:0;opacity:var(--date-icon-opacity);cursor:pointer;background-repeat:no-repeat;background-position:center;background-size:contain;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23888888' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'/%3E%3Cline x1='16' y1='2' x2='16' y2='6'/%3E%3Cline x1='8' y1='2' x2='8' y2='6'/%3E%3Cline x1='3' y1='10' x2='21' y2='10'/%3E%3C/svg%3E");color:transparent}input[type=date].text-field::-webkit-calendar-picker-indicator:hover{opacity:1}input[type=date].text-field:disabled{cursor:not-allowed}input[type=date].text-field:disabled::-webkit-calendar-picker-indicator{opacity:var(--date-disabled-opacity);cursor:not-allowed}}@layer organisms.header{.header{display:grid;grid-template-columns:1fr 3fr 1fr;align-items:center;padding:16px;background-color:#fff;border-bottom:1px solid #f1f5f9;position:sticky;top:var(--headerTop, 0);z-index:1000}.header h1{order:2;justify-self:center}.header .btn-search{order:1;justify-self:start}.header .utility{order:3;justify-self:end}@media not (min-width:768px){.header{padding:16px}}.logo{display:block;width:10rem;aspect-ratio:5/1;background:url(/assets/dundun-X2gpqz9H.svg) no-repeat center / contain}.utility{display:flex;align-items:center;gap:16px}@media not (min-width:768px){.utility{gap:8px}}.nav-link{text-decoration:none;font-size:15px;color:#888;transition:color .2s ease}.nav-link.active{color:#2ea44f;font-weight:800}.search-trigger{background:#f8fafc;border:1.5px solid #e2e8f0;border-radius:999px;padding:8px 16px;color:#64748b;font-weight:600;cursor:pointer;transition:all .2s}@media not (min-width:768px){.search-trigger{padding:8px}.search-trigger span{display:none}}.search-trigger:hover{background:#f1f5f9;border-color:#cbd5e1}.btn-menu{padding:6px 14px;border-radius:8px;font-size:13px;font-weight:700;text-decoration:none;transition:all .2s}.kitchen-btn{background-color:#fff1f0;color:#ff4d4f;border:1px solid #ffccc7}.kitchen-btn:hover{background-color:#ff4d4f;color:#fff}.master-btn{background-color:#111827;color:#fff;border:1.5px solid #111827;border-radius:999px}.master-btn:hover{background-color:#374151;transform:translateY(-1px)}.btn-logout{padding:8px 16px;background:none;border:1.5px solid #e2e8f0;border-radius:999px;font-size:13px;cursor:pointer;color:#4b5563;font-weight:700;transition:all .2s}.btn-logout:hover{background:#f9fafb}.btn-login{padding:10px 22px;background-color:#2ea44f;color:#fff;border-radius:999px;text-decoration:none;font-size:14px;font-weight:800;transition:all .2s}.btn-login:hover{background-color:#268a42}.search-dialog{padding:0;inset:50% auto auto 50%;translate:-50% -50%;border:1.5px solid #e2e8f0;border-radius:32px;width:90%;max-width:600px;background:#fff;box-shadow:none}.search-dialog[open]{animation:slideUp .3s ease-out}.search-dialog::backdrop{background:#0f172ab3;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);animation:fadeIn .3s ease-out}.search-dialog .dialog-inner{display:flex;flex-direction:column}.search-dialog .dialog-inner .search-input-wrapper{display:flex;align-items:center;padding:24px 32px;border-bottom:1.5px solid #f1f5f9;gap:16px}.search-dialog .dialog-inner .search-input-wrapper .modal-search-input{flex:1;border:none;font-size:20px;font-weight:800;outline:none;color:#111827}.search-dialog .dialog-inner .search-input-wrapper .modal-search-input::placeholder{color:#94a3b8}.search-dialog .dialog-inner .search-input-wrapper .search-confirm-btn{background:#2ea44f;color:#fff;border:none;padding:8px 20px;border-radius:999px;font-weight:800;cursor:pointer;transition:all .2s}.search-dialog .dialog-inner .search-input-wrapper .search-confirm-btn:hover{background:#268a42}.search-dialog .dialog-inner .search-input-wrapper .modal-close-btn{background:#f1f5f9;border:none;width:36px;height:36px;border-radius:50%;cursor:pointer;color:#64748b;transition:all .2s;display:flex;align-items:center;justify-content:center;font-size:18px}.search-dialog .dialog-inner .search-input-wrapper .modal-close-btn:hover{background:#e2e8f0;color:#111827}.search-dialog .dialog-inner .search-results{max-height:450px;overflow-y:auto;padding:12px}.search-dialog .dialog-inner .search-results .result-item{padding:16px;border-radius:16px;cursor:pointer;display:flex;flex-direction:column;gap:4px;transition:all .2s}.search-dialog .dialog-inner .search-results .result-item:hover{background:#f8fafc;transform:translate(4px)}.search-dialog .dialog-inner .search-results .result-item .result-title{font-size:16px;font-weight:600;color:#334155}.search-dialog .dialog-inner .search-results .result-item .result-meta{font-size:13px;color:#94a3b8}.search-dialog .dialog-inner .search-tip-text{padding:16px 32px 32px;font-size:13px;color:#94a3b8;text-align:center;font-weight:500;margin:0}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}}@layer organisms.card{.card{cursor:pointer;transition:transform .2s ease,border-color .2s;border:1px solid transparent;text-align:left}.card:active{transform:scale(.98)}.card .meta{margin-top:.4rem;color:var(--gray500)}.card .title{color:var(--gray900);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-align:left}.card .channel{margin-top:.4rem;color:var(--gray600)}.card .thumb-img{width:100%;height:100%;object-fit:cover}.card .missing{display:grid;grid-template-columns:min-content 1fr;justify-content:start;color:var(--red700);margin-block:.8rem;align-items:start;align-self:start;gap:.5rem;text-align:left;font-weight:400}.card .missing strong{white-space:nowrap}.card .state{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.2rem}.card .actions{display:flex;border-top:1px solid var(--gray200)}.card .actions button{flex:1;border-radius:0}.card .actions button+button{border-left:1px solid var(--gray200)}.card.type1 .thumbnail{position:relative;width:100%;aspect-ratio:16 / 9;border-radius:var(--radius-md);overflow:hidden;background-color:var(--gray200);box-shadow:0 .4rem 1.2rem #0000000d}.card.type1 .thumbnail .badge{position:absolute;top:.8rem;left:.8rem}.card.type1 .info{padding:1rem .4rem}.card.type2{display:grid;grid-template-rows:min-content 1fr min-content;border:.1rem solid var(--gray200);border-radius:var(--radius-md);background:var(--white);padding:0;overflow:hidden;text-align:left}.card.type2:hover{transform:translateY(-.2rem);box-shadow:0 .4rem 1.2rem #0000000d;border-color:var(--green-primary)}.card.type2 .thumbnail{border-radius:var(--radius-md) var(--radius-md) 0 0;overflow:hidden}.card.type2 .thumb-img{width:100%;aspect-ratio:3 / 2;object-fit:cover;background:var(--gray100)}.card.type2 .info{display:grid;grid-template-rows:min-content min-content 1fr min-content;padding:1.6rem}.card.type2.list:not(:has(.thumbnail)){grid-template-columns:1fr min-content}.card.type2.list:not(:has(.thumbnail)) .actions{border:none}.card.type2.list:not(:has(.thumbnail)) .actions button{--px: 1rem;border-left:1px solid var(--gray200)}.card.type2:has(.actions){grid-template-rows:1fr min-content}.card.type2:has(.actions).list{grid-template-columns:1fr min-content;grid-template-rows:auto}.card.type2:has(.actions).list>a{display:grid;grid-template-columns:min-content 1fr}.card.type2:has(.actions).list .actions{border:none}.card.type2:has(.actions).list .actions button{--px: 1rem;border-left:1px solid var(--gray200)}.card.type3{display:grid;border-color:var(--red300);background-color:var(--red100);border-radius:.8rem;padding:1.2rem;font-weight:700}.card.type3 .title{padding-bottom:.4rem}.card.list{width:100%;display:grid;grid-template-columns:min-content 1fr}.card.list .thumbnail{width:10rem;grid-row:span 2;border-radius:var(--radius-md) 0 0 var(--radius-md)}.card.list .thumb-img{aspect-ratio:1}.card.list .info{padding:1rem}.recipe-list-view{display:flex;flex-direction:column;gap:10px}.recipe-list-view .kitchen-recipe-card{flex-direction:row;align-items:center;padding:10px 20px}.recipe-list-view .card-content{display:flex;align-items:center;gap:20px;padding:0}.recipe-list-view .card-actions{border-top:none;background:none;margin-left:auto}}@layer organisms.hero{.hero{max-width:1200px;margin-inline:auto;box-sizing:border-box}@media not (min-width:768px){.hero{padding-inline:1.6rem}}.hero.type1>div{display:grid;grid-template-columns:1.8fr 1fr;gap:4em;align-items:center;background:var(--white);border:.2rem solid var(--pointColor, var(--color-primary));border-radius:1rem;padding:2rem}@media not (min-width:768px){.hero.type1>div{grid-template-columns:1fr;padding:1rem}}.hero.type1 .text-3xl{line-height:1;font-weight:800}.hero.type1 .text-3xl span{color:var(--pointColor, var(--color-primary))}.hero.type1 .status{display:flex;gap:.4rem}.hero.type1 .status .badge:not(.light){color:var(--pointColor, var(--color-primary));background-color:color-mix(in srgb,var(--pointColor, var(--color-primary)) 10%,transparent)}.hero.type1 .panel{min-width:20rem;box-sizing:border-box;background:var(--gray900);color:var(--white);padding:2.4rem;border-radius:var(--radius-2xl)}.hero.type1 .row{display:flex;justify-content:space-between}.hero.type1 .tag{color:var(--tag, var(--green-primary))}.hero.type1 .divider{height:.1rem;background:var(--white10);margin:.8rem 0}}@layer organisms.footer{.footer{background-color:var(--color-bg-main);border-top:1px solid var(--color-border);text-align:center;margin-top:10rem}@media not (min-width:768px){.footer{padding:0}}.footer .info{font-size:12px;color:var(--gray700);margin-block:3rem;padding-inline:16px;border-top:1px solid var(--gray200);border-bottom:1px solid var(--gray200);padding-block:30px}.footer .name{font-size:18px;font-weight:800;color:var(--gray900);margin-bottom:12px;margin-top:0}.footer .description{font-size:14px;color:var(--gray700);line-height:1.6;margin:0 auto}.footer .bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:15px;padding-inline:16px}.footer .copyright{font-size:13px;color:var(--gray600);margin:0}.footer .links{display:flex;gap:20px}.footer .links .link-item{font-size:13px;color:var(--gray800);cursor:pointer;text-decoration:none}.footer .links .link-item:hover{text-decoration:underline;text-underline-offset:.4rem}}@layer template.grid{.grid{display:grid}.grid.autofill{grid-template-columns:repeat(auto-fill,minmax(17rem,1fr));gap:1.2rem}.grid.autofill.lg{grid-template-columns:repeat(auto-fill,minmax(21rem,1fr));gap:1.8rem}.grid.autofill:has(.card.list){grid-template-columns:1fr}}@layer template.register{.register-grid{display:grid;grid-template-columns:1fr 1fr;gap:5rem 3rem}@media not (min-width:768px){.register-grid{grid-template-columns:1fr;gap:2rem}}.register-grid>div:not(.btn-group){display:grid;gap:5rem 0}@media not (min-width:768px){.register-grid>div:not(.btn-group){gap:2rem 0}}.register-grid .btn-group{grid-column:1/-1}.register-block{border:1px solid var(--gray200);padding:2rem;border-radius:var(--radius-md)}.register-block:has(:focus){border-color:var(--color-primary)}.register-block h3{padding-bottom:1rem}.register-form1{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.register-form1 .form-row{margin-top:0}.register-form2{display:grid;gap:1rem}.register-form2 .form-row{margin-top:0}.register-form3{display:grid;gap:1rem}.register-form3 .step-header{display:flex;justify-content:space-between}.register-form3 .step-left{display:flex;align-items:center;gap:1rem}.register-form3 .step-right{display:grid;grid-template-columns:6rem min-content min-content;white-space:nowrap;align-items:center;gap:1rem}.register-form3+.register-form3{margin-top:2.4rem}}@layer page.guide{.ds-container{max-width:1200px;margin:0 auto;padding:60px 16px 0}.ds-section{margin-bottom:var(--space-2xl);padding-bottom:var(--space-xl);border-bottom:1px solid var(--color-line)}.ds-section-title{font-size:28px;font-weight:950;letter-spacing:-.04em;margin-bottom:var(--space-xl);color:var(--color-ink)}.component-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(30rem,1fr));gap:16px;grid-auto-flow:dense}.component-card{display:grid;grid-template-rows:min-content 1fr min-content;gap:10px;background:var(--gray50);border:1px solid var(--gray200);border-radius:var(--radius-lg);padding:16px}.component-card.colspan{grid-column:1/-1}.component-card.colspan .demo-area{display:block}.component-card code{display:block;background-color:var(--white);font-size:var(--font-sm);color:var(--gray700);padding:8px}.component-card .demo-area{background:var(--white);border-radius:var(--radius-md);padding:12px;display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:start;align-self:start}.component-card .demo-area.btns{display:grid;gap:1rem}.component-card .demo-area.btns>div{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}.component-card .demo-area.btns>div>.text-sm{width:100%}.component-card .card-lg{border:1px solid var(--gray600);padding:1.5rem 1rem}.demo-footer{text-align:center;color:var(--gray600)}.text-hero{font-size:44px;font-weight:950;line-height:1.1;letter-spacing:-.04em}.text-h1{font-size:32px;font-weight:900;letter-spacing:-.03em}.text-h2{font-size:24px;font-weight:900;letter-spacing:-.02em}.text-h3{font-size:20px;font-weight:800}.text-body{font-size:16px;font-weight:500}.text-small{font-size:14px;font-weight:600;color:var(--color-soft-ink)}.text-xs{font-size:12px;font-weight:700;color:var(--color-muted)}.accent-primary{color:var(--color-primary)}.color-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:var(--space-md)}.color-swatch{height:80px;border-radius:var(--radius-md);border:var(--border-main);margin-bottom:var(--space-sm)}.input-main{width:100%;padding:16px 24px;border-radius:var(--radius-pill);border:var(--border-width-thin) solid var(--color-line);font-size:16px;font-weight:600;outline:none;transition:all .2s;box-sizing:border-box}.input-main:focus{border-color:var(--color-primary);background:var(--color-primary-soft)}.select-main{width:100%;padding:14px 44px 14px 24px;border-radius:var(--radius-pill);border:var(--border-width-thin) solid var(--color-line);font-size:15px;font-weight:800;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%232ea44f' stroke-width='2.5'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19.5 8.25l-7.5 7.5-7.5-7.5' /%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 20px center;background-size:18px;outline:none;cursor:pointer;background-color:var(--color-surface)}.checkbox-pill-label{display:inline-flex;align-items:center;padding:10px 20px;border-radius:var(--radius-pill);border:var(--border-width-thin) solid var(--color-line);font-size:14px;font-weight:800;cursor:pointer;transition:all .2s;-webkit-user-select:none;user-select:none}.checkbox-pill-label input{display:none}.checkbox-pill-label:has(input:checked){border-color:var(--color-primary);background:var(--color-primary-soft);color:#166534}.meta-group{display:flex;gap:12px;margin-bottom:24px;flex-wrap:wrap}.meta-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;background:var(--color-surface-soft);border:var(--border-main);border-radius:var(--radius-pill);font-size:13px;font-weight:800;color:var(--color-soft-ink)}.ingredient-list{list-style:none;padding:0;margin:0}.ingredient-item{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid var(--color-line)}.ingredient-item:last-child{border-bottom:none}.ing-name{font-weight:700;color:var(--color-ink)}.ing-amount{font-weight:800;color:var(--color-primary);font-size:14px}.step-card{display:flex;gap:20px;background:var(--color-surface);border:var(--border-main);border-radius:var(--radius-xl);padding:24px;margin-bottom:20px}.step-number{flex-shrink:0;width:32px;height:32px;background:var(--color-ink);color:#fff;border-radius:var(--radius-pill);display:flex;align-items:center;justify-content:center;font-weight:950;font-size:14px}.step-content{flex:1;font-weight:500;line-height:1.6;color:var(--color-sub-ink)}.avatar-row{display:flex;align-items:center;gap:16px}.avatar-img{width:48px;height:48px;border-radius:50%;object-fit:cover;background-color:#cbd5e1;color:#fff}.avatar-info{display:flex;flex-direction:column}.avatar-role{font-size:13px;color:var(--color-muted);font-weight:500}.avatar-name{font-size:16px;color:var(--color-ink);font-weight:700}.rating-badge{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;background:var(--color-surface-soft);border-radius:var(--radius-pill);font-size:14px;font-weight:800;box-shadow:0 4px 12px #00000008}.rating-badge svg{width:14px;height:14px;fill:var(--color-warm)}.timeline{display:flex;flex-direction:column;position:relative;padding-left:20px;margin-top:16px}.timeline:before{content:"";position:absolute;left:3px;top:8px;bottom:8px;width:2px;border-left:2px dashed var(--color-line)}.timeline-item{position:relative;padding-bottom:32px}.timeline-item:last-child{padding-bottom:0}.timeline-dot{position:absolute;left:-20px;top:6px;width:8px;height:8px;border-radius:50%;z-index:1}.timeline-dot.origin{background-color:var(--color-warm)}.timeline-dot.destination{background-color:var(--color-primary)}.timeline-content{font-size:15px;color:var(--color-muted);line-height:1.5;font-weight:500}.info-card{display:flex;align-items:center;justify-content:space-between;background:var(--color-surface-soft);border-radius:var(--radius-xl);padding:16px 20px;cursor:pointer;transition:opacity .2s}.info-card:hover{opacity:.8}.info-card-left{display:flex;align-items:center;gap:16px}.info-card-text{display:flex;flex-direction:column;gap:2px}.info-card-title{font-size:16px;font-weight:800;color:var(--color-ink)}.info-card-subtitle{font-size:13px;font-weight:500;color:var(--color-muted)}.floating-search-bar{display:flex;align-items:center;background:var(--color-surface);border-radius:var(--radius-pill);padding:8px 16px;box-shadow:0 8px 24px #0000000f;gap:12px}.floating-search-input{flex:1;width:100%;outline:none;font-size:16px;font-weight:600;color:var(--color-ink);background:transparent}.floating-search-input::placeholder{color:var(--color-muted)}.icon-btn{background:transparent;border:none;display:flex;align-items:center;justify-content:center;color:var(--color-ink);cursor:pointer}.icon-btn-primary{background:var(--color-primary);color:var(--color-surface);border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:none}.map-tooltip{display:inline-flex;align-items:center;background:var(--color-sub-ink);color:var(--color-surface);padding:8px 16px;border-radius:var(--radius-pill);font-size:13px;font-weight:600;position:relative;box-shadow:0 4px 12px #0000001a}.map-tooltip:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border-width:6px;border-style:solid;border-color:var(--color-sub-ink) transparent transparent transparent}.input-with-icon-wrapper{position:relative;display:flex;align-items:center}.input-with-icon-wrapper .input-main{padding-left:48px;padding-right:48px}.input-prefix-icon{position:absolute;left:20px;color:var(--color-ink);display:flex;align-items:center}.input-suffix-icon{position:absolute;right:20px;display:flex;align-items:center}.textarea-focused-warm{border-color:var(--color-warm)!important}.checkbox-circular{display:flex;align-items:center;gap:12px;cursor:pointer;-webkit-user-select:none;user-select:none}.checkbox-circular input{opacity:0;width:0;height:0;position:absolute}.checkbox-circle-mark{width:24px;height:24px;border-radius:50%;border:2px solid var(--color-line);display:flex;align-items:center;justify-content:center;transition:all .2s;background:transparent}.checkbox-circular input:checked~.checkbox-circle-mark{background:var(--color-primary);border-color:var(--color-primary)}.checkbox-circular input:checked~.checkbox-circle-mark:after{content:"";width:5px;height:10px;border:solid white;border-width:0 2.5px 2.5px 0;transform:rotate(45deg);margin-bottom:2px}.checkbox-circular-label{font-size:14px;font-weight:600;color:var(--color-muted)}.avatar-wrapper{position:relative;display:inline-block}.notification-dot{position:absolute;top:0;right:0;width:10px;height:10px;background-color:var(--color-primary);border:2px solid var(--color-surface);border-radius:50%}.alert-row-success{display:flex;align-items:center;gap:12px;color:var(--color-primary)}.alert-icon-success{display:flex;align-items:center;justify-content:center;width:20px;height:20px;background-color:var(--color-primary);color:var(--color-surface);border-radius:50%}.alert-text-success{font-size:15px;font-weight:500}.qty-selector{display:inline-flex;align-items:center;gap:8px;background-color:var(--color-sub-ink);color:var(--color-surface);padding:6px 12px;border-radius:var(--radius-pill);font-size:13px;font-weight:700;cursor:pointer}.qty-selector svg{width:14px;height:14px}.ingredient-badge{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background-color:var(--color-surface-soft);box-shadow:0 4px 16px #0000000a;font-size:18px}.divider-dashed{width:100%;border-top:1px dashed var(--color-line);margin:32px 0}.summary-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.summary-label{font-size:16px;color:var(--color-muted);font-weight:500}.summary-value{font-size:16px;color:var(--color-sub-ink);font-weight:500}.segmented-tabs{display:flex;background-color:#fff3;padding:6px;border-radius:var(--radius-xl);gap:4px}.tab-item{flex:1;padding:12px 16px;border-radius:var(--radius-lg);border:none;background:transparent;color:#fffc;font-size:15px;font-weight:700;cursor:pointer;transition:all .2s;text-align:center}.tab-item.active{background-color:#ffffff4d;color:#fff}.tab-item-solid{flex:1;padding:14px 16px;border-radius:var(--radius-lg);border:none;background:transparent;color:#fff;font-size:16px;font-weight:700;cursor:pointer}.tab-item-solid.active{background-color:#fff6}.activity-list{display:flex;flex-direction:column;gap:16px;padding:24px 0}}@layer page.main{.landing-container{min-height:100vh;background-color:#fff;padding-bottom:80px}@media not (min-width:768px){.landing-container{padding-bottom:40px}}.landing-main{max-width:1200px;margin:0 auto}.hero-section{text-align:left;padding:0;background:linear-gradient(135deg,#f8f9fa,#e9ecef)}@media(min-width:768px){.hero-inner-container{flex-direction:row;justify-content:space-between;align-items:center;padding:24px 16px}}.hero-title{font-size:28px;font-weight:900;margin-bottom:10px}.hero-subtitle{font-size:15px;color:#666}.hero-login-btn{padding:12px 24px;background-color:#111;color:#fff;border:none;border-radius:50px;font-weight:700;cursor:pointer}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.section-title{font-size:19px;font-weight:800;color:#111}.section-title.centered{text-align:center;margin-bottom:25px}.more-link{font-size:13px;color:#007aff;text-decoration:none;font-weight:600}.tab-container{display:flex;gap:8px;margin-bottom:15px;overflow-x:auto;scrollbar-width:none;padding:4px 0}.tab-item{white-space:nowrap;padding:8px 16px;border-radius:20px;background-color:#f1f3f5;border:1px solid transparent;font-size:14px;font-weight:600;color:#495057;cursor:pointer;transition:all .2s}.tab-item.active{background-color:#059669;color:#fff;border-color:#059669}.variant-2 .tab-item{flex:1;text-align:center}.mood-banner{padding:30px;background-color:#f8f9fa;border-radius:16px;border-left:5px solid #059669}.mood-tag{display:inline-block;color:#059669;font-weight:800;font-size:13px;margin-bottom:8px}.horizontal-scroll{display:flex;gap:12px;overflow-x:auto;padding-bottom:10px;scrollbar-width:none}.recent-card{min-width:220px;cursor:pointer}.recent-thumb-wrapper{position:relative;border-radius:12px;overflow:hidden;aspect-ratio:16/9}.recent-thumb{width:100%;height:100%;object-fit:cover}.recent-badge{position:absolute;bottom:6px;right:6px;background:#0009;color:#fff;padding:2px 6px;border-radius:4px;font-size:10px}.recent-title{font-size:13px;margin-top:8px;font-weight:600;line-height:1.4;height:2.8em;overflow:hidden}.channel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:15px;margin-top:20px}.channel-card{text-align:center;cursor:pointer}.profile-wrapper{width:65px;height:65px;border-radius:50%;overflow:hidden;margin:0 auto 8px;border:1px solid #eee}.profile-img{width:100%;height:100%;object-fit:cover}.channel-name{font-size:12px;font-weight:600}.empty-box{padding:30px;text-align:center;background-color:#f8f9fa;border-radius:14px;color:#adb5bd;font-size:13px}.recipe-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.category-story-section{padding:20px 0;background:#fff}.story-scroll{display:flex;gap:16px;scroll-behavior:smooth;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}.story-scroll::-webkit-scrollbar{display:none}.story-item{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer;scroll-snap-align:start;transition:transform .2s;border:none;background:transparent;padding:0}.story-item img{transition:filter .5s}.story-item.active{color:var(--color-primary);font-weight:700}.story-item.active img{filter:drop-shadow(3px 3px 6px var(--black20))}.section{margin-top:40px}.section-title{font-size:20px;font-weight:800;display:flex;align-items:center;gap:8px}@media not (min-width:768px){.section-title{margin-bottom:0}}.empty-box{padding:40px;background:#f8f9fa;border-radius:12px;text-align:center;color:#adb5bd}.story-circle{width:6rem;height:6rem;border-radius:100rem;display:flex;align-items:center;justify-content:center}.story-img{width:100%;height:100%;object-fit:contain}.story-emoji{line-height:1}.curated-youtube{padding-top:10px}.curated-empty{display:grid;gap:6px;justify-items:center;padding:20px 16px}.curated-empty-title{margin:0;font-size:14px;font-weight:800;color:#0f172a}.curated-empty-desc{margin:0;font-size:12px;color:#64748b;text-align:center}.curated-empty-action{border:none;background:transparent;cursor:pointer;padding:0}.curated-card{cursor:pointer;transition:transform .2s ease}.curated-card:active{transform:scale(.98)}.thumb-container{position:relative;width:100%;aspect-ratio:16 / 9;border-radius:8px;overflow:hidden;background-color:#f1f3f5;box-shadow:0 4px 12px #0000000d}.thumb-img{width:100%;height:100%;object-fit:cover}.match-badge{position:absolute;top:8px;left:8px;background:#059669e6;color:#fff;padding:4px 10px;border-radius:10px;font-size:11px;font-weight:800;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);box-shadow:0 2px 8px #0003}.curated-info{padding:10px 4px}.curated-title{font-size:14px;font-weight:700;color:#1a1a1a;line-height:1.4;margin-bottom:4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.curated-channel{font-size:12px;color:#868e96;font-weight:500}.hero-badge{display:inline-block;background-color:#fff;padding:6px 14px;border-radius:50px;font-size:12px;font-weight:800;color:#111}.hero-section.guest-mode{background:linear-gradient(135deg,#fff5f5,#ffe3e3)}}@layer page.inventory{.inventory{display:grid;gap:1.5rem}@media not (min-width:1024px){.inventory{gap:2rem 3rem}}@media not (min-width:768px){.inventory{grid-template-columns:repeat(auto-fill,minmax(30rem,1fr));gap:5rem}}@media not (min-width:768px){.inventory-btns{display:grid!important;gap:1rem;grid-template-columns:1fr}.inventory-btns .btn-group{order:1}.inventory-btns .btn-group button{flex:1}.inventory-btns>button{order:2}}.inv-container{box-sizing:border-box;padding:2rem 1.6rem 12rem;max-width:120rem;margin-inline:auto}@media not (min-width:768px){.inv-container{padding:1.6rem 1.6rem 6rem}}.inv-header{font-size:28px;font-weight:900;margin-bottom:32px;color:#0f172a;letter-spacing:-.02em}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:20px;margin-bottom:24px}.native-input{padding:14px 16px;border:1.5px solid #cbd5e1;border-radius:16px;font-size:15px;outline:none;background:#fff;transition:all .2s;color:#1e293b;width:100%;box-sizing:border-box}.native-input:focus{border-color:#2ea44f;background-color:#fff}select.native-input{appearance:none;background-image:url(data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20d%3D%22M5%207.5L10%2012.5L15%207.5%22%20stroke%3D%22%232EA44F%22%20stroke-width%3D%222.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22/%3E%3C/svg%3E);background-repeat:no-repeat;background-position:right 16px center;background-size:14px auto;padding-right:40px}.save-btn{width:100%;padding:18px;background-color:#2ea44f;color:#fff;border:none;border-radius:999px;font-weight:900;font-size:16px;cursor:pointer;transition:all .2s}.save-btn:hover{background-color:#1e293b;transform:translateY(-2px)}.list-controls{margin-bottom:32px;display:flex;flex-direction:column;gap:20px}@media not (min-width:768px){.list-controls{display:grid}.list-controls .controls-row{flex-direction:row;justify-content:space-between}}.search-row{display:flex;gap:12px;align-items:stretch}@media not (min-width:768px){.search-row{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}.search-row .search-input{grid-column:1/-1}}.search-input{flex:1;padding:14px 24px;border:1.5px solid #cbd5e1;border-radius:999px;font-size:16px;outline:none;background-color:#fff;transition:all .2s;box-sizing:border-box}.search-input:focus{border-color:#2ea44f}.search-btn{padding:0 28px;background:#2ea44f;border:none;border-radius:999px;font-weight:950;font-size:14px;cursor:pointer;color:#fff;transition:all .2s;display:flex;align-items:center;justify-content:center;white-space:nowrap}.search-btn:hover{background:#1e293b;transform:translateY(-1px)}.reset-btn{padding:0 24px;background:#fff;border:1.5px solid #cbd5e1;border-radius:999px;font-weight:800;font-size:14px;cursor:pointer;color:#64748b;transition:all .2s;display:flex;align-items:center;justify-content:center;white-space:nowrap}.reset-btn:hover{background:#f1f5f9;border-color:#64748b;color:#0f172a}.controls-row{display:flex;justify-content:space-between;align-items:center;gap:16px}@media not (min-width:768px){.controls-row{flex-direction:column}}.sort-group{display:flex;gap:16px}.sort-item{background:none;border:none;font-size:14px;font-weight:700;color:#94a3b8;cursor:pointer;padding:4px 0;position:relative}.sort-item.active{color:#0f172a}.sort-item.active:after{content:"";position:absolute;bottom:-4px;left:0;right:0;height:3px;background-color:#2ea44f;border-radius:99px}.view-toggle{display:flex;background:#e2e8f0;padding:4px;border-radius:999px}.toggle-btn{padding:8px 16px;border:none;background:none;font-size:13px;font-weight:800;cursor:pointer;border-radius:999px;color:#64748b;transition:all .2s}.toggle-btn.active{background:#fff;color:#0f172a}.inv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}.items-list{display:flex;flex-direction:column;gap:12px}.inventory-card{background:#fff;border:2px solid #cbd5e1;border-radius:28px;padding:24px;display:flex;transition:all .2s cubic-bezier(.4,0,.2,1)}.inventory-card:hover{border-color:#2ea44f}.inventory-card.low-stock{border-color:#ef4444;background-color:#fff5f5}.inventory-card.card{flex-direction:column;gap:16px}.inventory-card.list{flex-direction:row;justify-content:space-between;align-items:center;padding:16px 24px}.card-main-info{display:flex;flex-direction:column;gap:6px}.list .card-main-info{flex-direction:row;align-items:center;gap:20px;flex:1}.item-name{font-size:18px;font-weight:950;color:#0f172a}.item-qty{font-size:20px;font-weight:900;color:#2ea44f}.item-qty.danger{color:#ef4444}.low-badge{background:#ef4444;color:#fff;font-size:11px;font-weight:900;padding:4px 10px;border-radius:999px;margin-left:8px;vertical-align:middle}.card-sub-info{display:flex;justify-content:space-between;align-items:flex-end}.list .card-sub-info{flex:1;justify-content:flex-end;gap:40px;align-items:center}.expiry-info{display:flex;flex-direction:column;gap:2px}.expiry-info .label{font-size:12px;font-weight:700;color:#94a3b8}.expiry-info .value{font-size:14px;font-weight:800;color:#475569}.action-group{display:flex;gap:8px}.action-group button{background:#f1f5f9;border:1.5px solid #cbd5e1;border-radius:999px;width:40px;height:40px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:16px;transition:all .2s}.action-group button:hover{background:#fff;border-color:#2ea44f}.btn-delete:hover{border-color:#ef4444!important;color:#ef4444}.shopping-banner{background-color:#eff6ff;border:2px solid #cbd5e1;border-radius:28px;padding:24px;margin-bottom:32px}.banner-title{font-size:16px;font-weight:900;color:#1e40af;margin-bottom:16px;display:flex;align-items:center;gap:8px}.shopping-tags{display:flex;flex-wrap:wrap;gap:10px}.shopping-tag{background:#fff;border:1.5px solid #cbd5e1;padding:8px 16px;border-radius:999px;font-size:14px;font-weight:700;display:flex;gap:8px}.tag-qty{color:#2ea44f;font-weight:900}.floating-scan-btn{position:fixed;bottom:100px;right:20px;background:#2ea44f;color:#fff;border:none;padding:16px 28px;border-radius:999px;font-weight:900;font-size:16px;display:flex;align-items:center;gap:10px;box-shadow:0 8px 20px #2ea44f4d;cursor:pointer;z-index:1000;transition:all .3s}.floating-scan-btn:hover{transform:translateY(-5px);background:#1e293b;box-shadow:0 10px 25px #1e293b66}.floating-scan-btn span{font-size:20px}}@layer page.kitchen{.kitchen-container{margin-inline:auto;max-width:1200px;padding:60px 16px 120px}@media not (min-width:768px){.kitchen-container{padding:16px 16px 60px}}.dna-insight-card{background:linear-gradient(145deg,#0f172a,#1e293b);border-radius:32px;padding:32px 24px;color:#fff;margin-bottom:24px;border:1px solid rgba(255,255,255,.1);position:relative;overflow:hidden}.dna-insight-card:after{content:"";position:absolute;top:-50%;right:-20%;width:200px;height:200px;background:radial-gradient(circle,rgba(46,164,79,.15) 0%,transparent 70%);pointer-events:none}.dna-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.dna-avatar-group{position:relative;cursor:pointer;background:transparent;border:none;padding:0}.dna-avatar-wrapper{width:80px;height:80px;border-radius:50%;background:#334155;border:3px solid #fbbf24;overflow:hidden;display:flex;align-items:center;justify-content:center}.dna-avatar-wrapper img{width:100%;height:100%;object-fit:cover}.dna-placeholder{font-size:40px}.dna-badge{position:absolute;bottom:-5px;left:50%;transform:translate(-50%);background:#2ea44f;color:#fff;font-size:10px;font-weight:900;padding:4px 12px;border-radius:999px;white-space:nowrap;border:2px solid #0f172a}.dna-chart-wrapper{width:140px;height:140px;position:relative}.radar-placeholder{width:100%;height:100%;background:#ffffff0d;border-radius:50%;position:relative;border:1px dashed rgba(255,255,255,.2)}.radar-line{position:absolute;background:#ffffff1a}.radar-line.v{width:1px;height:100%;left:50%}.radar-line.h{height:1px;width:100%;top:50%}.radar-shape{position:absolute;width:65%;height:65%;background:#2ea44f4d;top:17.5%;left:17.5%;clip-path:polygon(50% 0%,100% 38%,82% 100%,18% 100%,0% 38%);border:2px solid #2ea44f;filter:drop-shadow(0 0 8px rgba(46,164,79,.4))}.radar-placeholder .label{position:absolute;font-size:10px;color:#94a3b8;font-weight:700}.radar-placeholder .label.t{top:-5px;left:50%;transform:translate(-50%)}.radar-placeholder .label.r{right:-10px;top:50%}.radar-placeholder .label.br{bottom:-5px;right:10px}.radar-placeholder .label.bl{bottom:-5px;left:10px}.radar-placeholder .label.l{left:-10px;top:50%}.dna-footer{display:flex;justify-content:space-between;align-items:flex-end;border-top:1px solid rgba(255,255,255,.1);padding-top:20px}.dna-text h3{margin:0;font-size:18px;color:#f8fafc}.dna-text p{margin:4px 0 0;font-size:12px;color:#94a3b8}.dna-btn{background:#2ea44f;color:#fff;border:none;padding:12px 20px;border-radius:999px;font-weight:900;font-size:13px;cursor:pointer;transition:transform .2s}.dna-btn:active{transform:scale(.95)}.kitchen-header-row{display:flex;gap:15px;margin-bottom:24px}.user-point-card{background:#fff;padding:24px;border-radius:24px;display:flex;justify-content:space-between;align-items:center;border:1.5px solid #f1f5f9;position:relative;overflow:hidden;width:100%;text-align:left;cursor:pointer}.user-point-card:before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:#2ea44f}.point-info .label{font-size:14px;color:#64748b;display:block;margin-bottom:2px}.point-info .value{font-size:28px;font-weight:900;color:#1e293b;line-height:1.2}.charge-btn{background:#f1f5f9;color:#475569;border:none;padding:10px 18px;border-radius:999px;font-weight:800;font-size:13px;cursor:pointer}.stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:24px}.stat-card{background:#fff;padding:28px 24px;border-radius:28px;box-shadow:none;border:1.5px solid #f1f5f9;display:flex;flex-direction:column;justify-content:space-between;transition:all .3s cubic-bezier(.4,0,.2,1)}.stat-card:hover{transform:translateY(-4px);border-color:#2ea44f;background:#fafdfb}.stat-card .card-label{font-size:14px;font-weight:700;color:#64748b;margin-bottom:8px;display:block}.stat-card .stat-value{font-size:28px;font-weight:900;color:#1e293b;margin:0}.card-link{display:inline-block;padding:10px 20px;background-color:#f1f5f9;color:#475569;border-radius:999px;text-decoration:none;font-size:13px;font-weight:800;margin-top:16px;transition:all .2s;text-align:center}.card-link:hover{background-color:#2ea44f;color:#fff}.premium-ad{grid-column:span 2;background:#fdfae6;border:1.5px solid #f9e8a2}.card-link-offset{margin-top:14px}.ai-tip-text{font-size:13px;line-height:1.5;color:#92400e;margin:8px 0 16px}.card-btn.dark{background:#1e293b;color:#fff}.timer-settings-card{margin-bottom:24px;border:1.5px solid #e0f2fe;background:#fff;border-radius:24px;padding:24px}.timer-settings-head h4{margin:0;font-size:16px;color:#0369a1;font-weight:900}.timer-settings-head p{margin:8px 0 0;font-size:12px;color:#64748b;line-height:1.5}.timer-settings-options{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.timer-setting-toggle{display:inline-flex;align-items:center;justify-content:space-between;gap:12px;flex:1;min-width:140px;border:1.5px solid #f1f5f9;background:#fff;border-radius:999px;padding:12px 20px;font-size:13px;font-weight:800;color:#1e293b;cursor:pointer}.timer-settings-save{margin-top:16px;border:none;background:#2ea44f;color:#fff;padding:14px 28px;border-radius:999px;font-size:13px;font-weight:900;cursor:pointer;width:100%}.detail-grid{display:flex;flex-direction:column;gap:16px}.detail-card{padding:24px;background:#fff;border-radius:28px;border:1.5px solid #f1f5f9}.detail-title{font-size:18px;font-weight:900;margin:0 0 20px;display:flex;align-items:center;gap:10px}.detail-list{list-style:none;padding:0;margin:0}.detail-item{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid #f8fafc}.detail-item span{font-size:14px}.detail-item:last-child{border-bottom:none}.detail-emphasis{font-weight:900;font-size:14px}.detail-emphasis-danger{color:#e03131}.detail-emphasis-warn{color:#f08c00}.detail-emphasis-info{color:#3b82f6}.empty-state{padding:40px 0;text-align:center;color:#94a3b8;font-size:14px;font-weight:600}.view-btn{padding:6px 14px;background:#f1f5f9;color:#475569;border-radius:999px;font-size:12px;text-decoration:none;font-weight:800}.account-manage-card{margin-top:24px;border:1.5px solid #fee2e2;background:#fff;border-radius:28px;padding:24px}.account-manage-desc{font-size:12px;color:#94a3b8;margin:8px 0 16px;line-height:1.6}.card-btn{display:block;text-align:center;padding:14px;border-radius:999px;text-decoration:none;font-size:13px;font-weight:900;cursor:pointer;border:1.5px solid transparent}.card-btn.light{background:#f8fafc;color:#64748b}.card-btn-danger{border-color:#fee2e2;color:#ef4444}.modal-overlay{position:fixed;inset:0;background:#0f172a99;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;justify-content:center;align-items:center;z-index:1000;padding:20px}.modal-overlay-backdrop{position:absolute;inset:0;border:none;background:transparent;padding:0;cursor:pointer}.profile-modal{background:#fff;padding:32px;border-radius:32px;width:100%;max-width:400px;box-shadow:0 20px 25px -5px #0000001a;position:relative;z-index:1}.profile-modal h3{font-size:20px;font-weight:900;margin:0 0 24px;text-align:center}.modal-avatar-section{display:flex;justify-content:center;margin-bottom:24px}.modal-avatar{width:100px;height:100px;border-radius:50%;background:#f8fafc;border:3px solid #2ea44f;position:relative;display:flex;align-items:center;justify-content:center;font-size:40px;cursor:pointer;overflow:hidden}.camera-icon{position:absolute;bottom:0;right:0;background:#2ea44f;color:#fff;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;border:3px solid #fff}.modal-actions{display:flex;gap:12px;margin-top:24px}.cancel-btn{flex:1;background:#f1f5f9;color:#64748b;padding:14px;border-radius:999px;border:none;font-weight:800;cursor:pointer}.save-btn{flex:2;background:#2ea44f;color:#fff;padding:14px;border-radius:999px;border:none;font-weight:800;cursor:pointer}.save-btn-danger{background:#ef4444}.hidden-file-input{display:none}}@layer page.scanner{.scanner-container{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#000;display:flex;flex-direction:column;z-index:1000;color:#fff}.camera-view{flex:1;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center}.camera-video{width:100%;height:100%;object-fit:cover}.scan-guide{position:absolute;border:2px solid rgba(255,255,255,.5);border-radius:16px;transition:all .3s ease}.scan-guide.receipt{width:70%;height:80%;border-style:dashed}.scan-guide.object{width:250px;height:250px;border-color:#2ea44f}.scanner-controls{padding:30px 20px 50px;background:linear-gradient(to top,rgba(0,0,0,.9),transparent);display:flex;flex-direction:column;align-items:center;gap:20px}.mode-switcher{display:flex;background:#fff3;padding:4px;border-radius:30px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.mode-btn{padding:8px 20px;border:none;background:none;color:#ccc;border-radius:25px;font-size:14px;font-weight:700;cursor:pointer}.mode-btn.active{background:#fff;color:#000}.shutter-wrapper{display:flex;align-items:center;justify-content:center;width:80px;height:80px;border:4px solid #fff;border-radius:50%;cursor:pointer;padding:4px}.shutter-inner{width:100%;height:100%;background-color:#fff;border-radius:50%;transition:transform .1s}.shutter-wrapper:active .shutter-inner{transform:scale(.9)}.close-scanner{position:absolute;top:40px;right:20px;background:#00000080;border:none;color:#fff;width:40px;height:40px;border-radius:50%;font-size:20px;cursor:pointer;z-index:1001}.analyzing-overlay{position:absolute;inset:0;background:#000000b3;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:1002}.scan-line{width:100%;height:2px;background:#2ea44f;position:absolute;top:0;animation:scan 2s infinite}@keyframes scan{0%{top:10%}to{top:90%}}.analyzing-content{display:flex;flex-direction:column;align-items:center;gap:15px}.spinner{width:40px;height:40px;border:4px solid rgba(255,255,255,.3);border-top-color:#2ea44f;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-overlay{position:absolute;inset:0;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:3000;padding:20px}.error-box{background:#fff;padding:25px;border-radius:20px;text-align:center;width:100%;max-width:300px}.error-msg{color:#111;font-weight:700;margin-bottom:20px;line-height:1.5}.error-btns{display:flex;gap:10px}.err-btn{flex:1;padding:12px;border-radius:10px;border:none;font-weight:700;cursor:pointer}.err-btn.back{background:#f1f3f5;color:#495057}.err-btn.retry{background:#111;color:#fff}.shutter-wrapper.disabled{opacity:.3;pointer-events:none}.warning-box{background:#fff;padding:40px 30px;border-radius:24px;border:1px solid #e2e8f0;text-align:center;color:#111;max-width:320px}.desktop-warning{background-color:#f8f9fa;justify-content:center;align-items:center}.warning-box{background:#fff;padding:40px 30px;border-radius:24px;box-shadow:0 10px 40px #0000001a;text-align:center;color:#111;max-width:320px}.warning-box h2{margin:20px 0 10px;font-size:20px;font-weight:900}.warning-box p{font-size:14px;color:#666;line-height:1.6;margin-bottom:25px}.floating-scan-btn{transition:transform .2s cubic-bezier(.175,.885,.32,1.275),background-color .2s}.floating-scan-btn:hover{transform:scale(1.05) translateY(-5px);background-color:#2ea44f}.floating-scan-btn:active{transform:scale(.95)}.spinner{width:30px;height:30px;border:3px solid #eee;border-top:3px solid #2ea44f;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.shutter-wrapper{width:80px;height:80px;border:5px solid #fff;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:transform .1s;background-color:transparent}.shutter-inner{width:60px;height:60px;background-color:#fff;border-radius:50%}.shutter-wrapper:active{transform:scale(.9)}.shutter-wrapper.disabled{opacity:.5;border-color:#666}.shutter-wrapper.disabled .shutter-inner{background-color:#666}.scan-guide{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border:2px solid #2ea44f;background:#0000001a;z-index:10;pointer-events:none}.scan-guide.recipe{width:80%;height:60%;border:2px dashed rgba(255,255,255,.8);border-radius:10px;position:absolute;top:45%;left:50%;transform:translate(-50%,-50%)}.mode-switcher.scroll-x{display:flex;overflow-x:auto;padding:10px 20px;gap:10px;width:100%;justify-content:center;-webkit-overflow-scrolling:touch}.mode-switcher::-webkit-scrollbar{display:none}}@layer page.membership{.membership-container{padding:20px;background-color:#f8f9fa;min-height:100vh;font-family:-apple-system,sans-serif}.membership-header{text-align:center;padding:30px 0}.hot-deal-badge{display:inline-block;padding:6px 15px;background-color:#e8f5e9;color:#2e7d32;border-radius:15px;font-size:13px;font-weight:700;margin-bottom:10px}.membership-header h1{font-size:26px;font-weight:900;color:#111;margin:0}.membership-header .subtitle{color:#666;margin-top:8px;font-size:14px;line-height:1.5}.my-point-card{margin:25px auto 0;max-width:450px;background:linear-gradient(135deg,#111,#333);color:#fff;padding:25px;border-radius:24px;display:flex;justify-content:space-between;align-items:center;border:1px solid rgba(255,255,255,.12);text-align:left}.my-point-card .label{font-size:14px;opacity:.7;display:block;margin-bottom:5px}.my-point-card .point-value{font-size:26px;font-weight:700}.my-point-card .ticket-count{font-size:18px;font-weight:700;color:#eab308}.package-list{display:flex;flex-direction:column;gap:15px;max-width:450px;margin:25px auto 0}.package-item{padding:22px;border-radius:22px;background-color:#fff;border:1px solid #eee;display:flex;justify-content:space-between;align-items:center;cursor:pointer;position:relative;transition:transform .1s}.package-item:active{transform:scale(.98)}.package-item.featured{border:2.5px solid #111}.package-item .tag{position:absolute;top:-11px;left:22px;color:#fff;padding:3px 12px;border-radius:10px;font-size:11px;font-weight:700;letter-spacing:.5px}.tag.red{background-color:#d32f2f}.tag.black{background-color:#111}.pkg-points{font-size:20px;font-weight:900;color:#111;margin-bottom:4px}.pkg-points .bonus{color:#d32f2f;font-size:14px}.pkg-desc{font-size:13px;color:#888;font-weight:500}.pkg-price{font-size:19px;font-weight:900;color:#111}.free-charge-box{margin-top:10px;padding:25px;border-radius:24px;background-color:#fff;text-align:center;border:1px solid #e2e8f0}.free-charge-box h4{margin:0 0 10px;font-size:16px;font-weight:700;color:#333}.free-charge-box p{font-size:13px;color:#666;margin-bottom:18px;line-height:1.5}.ad-go-btn{width:100%;padding:14px;border-radius:14px;border:none;background:#f1f5f9;color:#334155;font-weight:700;font-size:14px;cursor:pointer;transition:background .2s}.ad-go-btn:hover{background:#e2e8f0}.membership-footer{text-align:center;padding:40px 20px}.back-link{color:#aaa;text-decoration:underline;cursor:pointer;font-size:14px;margin-bottom:30px}.policy-box{text-align:left;background-color:#eee;padding:20px;border-radius:18px}.policy-box h5{margin:0 0 10px;font-size:13px;font-weight:700}.policy-box ul{margin:0;padding-left:18px;font-size:12px;color:#777;line-height:1.8}}@layer page.onboarding.page.onboarding{@keyframes onboarding-pulse{0%{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.7}to{transform:scale(1);opacity:1}}[data-scope=onboarding] .animate-pulse{animation:onboarding-pulse 1.5s infinite}[data-scope=onboarding]{--color-primary: #2ea44f;--color-primary-soft: #ecfdf5;--color-ink: #111827;--color-sub-ink: #4b5563;--color-soft-ink: #9ca3af;--color-line: #e5e7eb;--color-surface: #ffffff;--color-surface-soft: #f9fafb;height:100vh;align-content:center}[data-scope=onboarding] .onboarding-container{height:100vh;display:flex;align-items:center;justify-content:center;background:var(--color-surface-soft);padding:20px;font-family:Inter,sans-serif;box-sizing:border-box}[data-scope=onboarding] .onboarding-content{width:100%;max-width:440px;text-align:center;background:var(--color-surface);padding:48px 32px;border-radius:24px;border:1px solid var(--color-line);margin-inline:auto}[data-scope=onboarding] .onboarding-progress{font-size:13px;font-weight:900;color:var(--color-primary);margin-bottom:16px;letter-spacing:1px;text-transform:uppercase}[data-scope=onboarding] .onboarding-title{font-size:28px;font-weight:900;margin-bottom:10px;line-height:1.3;color:var(--color-ink);letter-spacing:-.02em}[data-scope=onboarding] .onboarding-subtitle{color:var(--color-soft-ink);margin-bottom:32px;font-size:15px;font-weight:500}[data-scope=onboarding] .onboarding-gender-group{display:flex;justify-content:center;gap:32px;margin-bottom:40px}[data-scope=onboarding] .onboarding-age-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:40px}[data-scope=onboarding] .onboarding-next-btn{width:100%;padding:18px;border-radius:18px;background:var(--color-ink);color:var(--color-surface);border:none;font-weight:800;font-size:16px;cursor:pointer;transition:all .2s}[data-scope=onboarding] .onboarding-analysis-box{padding:40px 24px;background:var(--color-surface-soft);border-radius:24px;margin-bottom:24px;border:1px solid var(--color-line)}[data-scope=onboarding] .onboarding-pulse-icon{font-size:56px;margin-bottom:20px}[data-scope=onboarding] .onboarding-analysis-text{font-size:16px;color:var(--color-sub-ink);line-height:1.6;font-weight:500}[data-scope=onboarding] .onboarding-analysis-strong{color:var(--color-primary);font-weight:800}[data-scope=onboarding] .onboarding-tag-cloud{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:40px}[data-scope=onboarding] .onboarding-tag{padding:8px 16px;background:var(--color-surface);border-radius:999px;font-size:12px;color:var(--color-sub-ink);font-weight:700;border:1px solid var(--color-line)}[data-scope=onboarding] .onboarding-personality-list{display:flex;flex-direction:column;gap:12px;margin-bottom:24px}[data-scope=onboarding] .onboarding-type-card{display:flex;align-items:center;gap:20px;padding:20px;border-radius:18px;border:1px solid var(--color-line);background:var(--color-surface);cursor:pointer;text-align:left;transition:all .2s}[data-scope=onboarding] .onboarding-type-card-body{text-align:left}[data-scope=onboarding] .onboarding-type-icon{font-size:36px}[data-scope=onboarding] .onboarding-type-label{font-size:17px;font-weight:800;color:var(--color-ink)}[data-scope=onboarding] .onboarding-type-desc{font-size:14px;color:var(--color-soft-ink);margin-top:4px;font-weight:500}[data-scope=onboarding] .onboarding-age-icon{font-size:28px}[data-scope=onboarding] .onboarding-age-label{font-size:13px;font-weight:700}[data-scope=onboarding] .onboarding-submitting-text{margin-top:20px;font-size:13px;color:var(--color-primary);font-weight:600}[data-scope=onboarding] .icon-btn{font-size:60px;border-width:3px;border-style:solid;border-radius:24px;padding:15px;cursor:pointer;transition:all .3s}[data-scope=onboarding] .icon-btn.active{background:var(--color-primary-soft);border-color:var(--color-primary)}[data-scope=onboarding] .icon-btn.inactive{background:var(--color-surface-soft);border-color:transparent}[data-scope=onboarding] .age-btn{display:flex;flex-direction:column;gap:8px;align-items:center;padding:16px 8px;border-radius:18px;border-style:solid;cursor:pointer;transition:all .2s}[data-scope=onboarding] .age-btn.active{border-width:2px;border-color:var(--color-primary);background:var(--color-primary);color:var(--color-surface)}[data-scope=onboarding] .age-btn.inactive{border-width:1px;border-color:var(--color-line);background:var(--color-surface);color:var(--color-ink)}}@layer page.master{.master-container{max-width:1240px;margin:0 auto;padding:40px 16px;background-color:#f9f9f9;min-height:100vh}.master-title{font-size:28px;font-weight:800;margin-bottom:30px;color:#1a1a1a}.master-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}.col-span-full{grid-column:1 / -1}.master-card{background:#fff;padding:24px;border-radius:16px;box-shadow:0 4px 20px #0000000d;border:1px solid #eee}.card-title{font-size:18px;font-weight:700;margin-bottom:20px;color:#333;display:flex;align-items:center;gap:8px}.usage-stats-flex{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.stat-item{flex:1;min-width:200px;display:flex;flex-direction:column;gap:8px}.label{display:block;font-size:13px;color:#666;margin-bottom:8px;font-weight:600}.value{font-size:14px;font-weight:600}.value-large{display:block;font-size:24px;font-weight:800;color:#000}.bar-bg{width:100%;height:8px;background:#eee;border-radius:4px;margin-bottom:8px;overflow:hidden}.bar-fill{height:100%;background:#2563eb;transition:width .3s ease}.bar-fill.green{background-color:#059669}.bar-progress{width:100%;height:100%;border:0;appearance:none;-webkit-appearance:none;background:transparent}.bar-progress::-webkit-progress-bar{background:transparent}.bar-progress::-webkit-progress-value{background-color:#111;transition:width .5s ease}.bar-progress::-moz-progress-bar{background-color:#111;transition:width .5s ease}.bar-progress.green::-webkit-progress-value{background-color:#059669}.bar-progress.green::-moz-progress-bar{background-color:#059669}.master-input{width:100%;padding:12px;border-radius:8px;border:1px solid #ddd;font-size:14px}.btn-primary{width:100%;padding:14px;background:#000;color:#fff;border:none;border-radius:10px;font-weight:700;cursor:pointer}.btn-primary:hover{background-color:#374151}.config-row{display:flex;justify-content:space-between;align-items:center;padding:12px 0;font-size:14px}.bold{font-weight:700}.text-blue{color:#2563eb}.text-green{color:#059669}.text-red{color:#ef4444}.table-wrapper{overflow-x:auto;margin-top:10px}@media not (min-width:768px){.table-wrapper{overflow:visible}}.master-table{width:100%;border-collapse:collapse}.master-table th{text-align:left;padding:12px;background:#f5f5f5;font-size:13px;color:#666}@media not (min-width:768px){.master-table tr{display:block;padding:15px 0;border-bottom:1px solid #eee}}.master-table td{padding:15px 12px;border-bottom:1px solid #eee;font-size:14px}@media not (min-width:768px){.master-table td{display:block;padding:2px;width:100%;border-bottom:none}}.uid-text{font-size:11px;color:#aaa;margin-top:4px;font-family:monospace}.btn-small{padding:4px 8px;border:1px solid #ddd;background:#fff;border-radius:6px;cursor:pointer;font-size:11px}.btn-text-red{color:#ef4444;border:none;background:none;cursor:pointer;font-size:12px}.btn-text-blue{color:#2563eb;border:none;background:none;cursor:pointer;font-size:14px;font-weight:600;margin-top:15px}@media(max-width:1000px){.master-grid{grid-template-columns:1fr}}[data-scope=hq-dashboard] .hq-loading-view,[data-scope=hq-payment-history] .hq-loading-view{text-align:center;padding-top:100px}[data-scope=hq-dashboard] .value{text-align:left;margin-top:4px}[data-scope=hq-dashboard] .hq-danger-note{margin-top:6px;color:#b91c1c;font-weight:700}[data-scope=hq-dashboard] .btn-text-blue{margin-left:auto;font-size:12px}[data-scope=hq-payment-history] .hq-revenue-summary{margin-bottom:20px;background:#f0fdf4;padding:20px;border-radius:12px}[data-scope=hq-payment-history] .hq-revenue-title{font-size:16px;color:#166534}[data-scope=hq-payment-history] .hq-revenue-value{font-size:24px}[data-scope=hq-payment-history] .hq-payment-badge{background:#dcfce7;color:#166534;padding:4px 8px;border-radius:6px;font-size:11px}[data-scope=hq-payment-history] .hq-empty-row{text-align:center;padding:40px;color:#999}}@layer page.explore-detail{[data-scope=explore-detail].explore-detail-container{max-width:1000px;margin:0 auto;padding:40px 16px;min-height:100vh;animation:fadeIn .4s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}[data-scope=explore-detail] .detail-header{margin-bottom:32px;display:flex;justify-content:space-between;align-items:center}[data-scope=explore-detail] .video-hero-section{width:100%;aspect-ratio:16 / 9;border-radius:16px;overflow:hidden;box-shadow:none;margin-bottom:40px;position:relative}@media(max-width:768px){[data-scope=explore-detail] .video-hero-section.sticky-enabled{top:0;border-radius:0;border:none}}[data-scope=explore-detail] .detail-content-section{display:flex;flex-direction:column;gap:32px}[data-scope=explore-detail] .detail-title{font-size:32px;font-weight:950;color:#0f172a;line-height:1.3;letter-spacing:-.02em;margin:0}@media not (min-width:768px){[data-scope=explore-detail] .detail-title{font-size:24px}}[data-scope=explore-detail] .actions-bar{display:flex;justify-content:space-between;align-items:center;padding:32px;background:#fff;border:2px solid #cbd5e1;border-radius:16px;flex-wrap:wrap;gap:24px}@media not (min-width:768px){[data-scope=explore-detail] .actions-bar{padding:16px;border-radius:16px}}[data-scope=explore-detail] .channel-info{display:flex;flex-direction:column;gap:12px}@media not (min-width:768px){[data-scope=explore-detail] .channel-info{flex-direction:row;justify-content:space-between;width:100%;align-items:center}}[data-scope=explore-detail] .channel-name-txt{font-size:20px;font-weight:900;color:#1e293b}[data-scope=explore-detail] .sub-btn{font-size:13px;font-weight:800;padding:8px 16px;border-radius:999px;text-decoration:none;display:inline-flex;align-items:center;gap:6px;background:#fee2e2;color:#ef4444;transition:all .2s}[data-scope=explore-detail] .sub-btn:hover{background:#fecaca;transform:translateY(-1px)}[data-scope=explore-detail] .recipe-btn-group{display:flex;gap:12px;align-items:center}@media not (min-width:768px){[data-scope=explore-detail] .recipe-btn-group{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem}}[data-scope=explore-detail] .text-desktop{display:inline}[data-scope=explore-detail] .text-mobile{display:none}@media not (min-width:768px){[data-scope=explore-detail] .text-desktop{display:none}[data-scope=explore-detail] .text-mobile{display:inline}}[data-scope=explore-detail] .manual-save-btn{padding:14px 24px;background:#fff;border:2px solid #cbd5e1;border-radius:999px;font-weight:800;color:#475569;cursor:pointer;font-size:14px;transition:all .2s}@media not (min-width:768px){[data-scope=explore-detail] .manual-save-btn{width:100%;box-sizing:border-box}}[data-scope=explore-detail] .manual-save-btn:hover{background:#f1f5f9;border-color:#64748b;color:#0f172a;transform:translateY(-2px)}[data-scope=explore-detail] .ai-save-btn{display:flex;align-items:center;gap:12px;padding:14px 28px;background:#2ea44f;color:#fff;border:none;border-radius:999px;font-weight:900;cursor:pointer;transition:all .2s}@media not (min-width:768px){[data-scope=explore-detail] .ai-save-btn{width:100%}}[data-scope=explore-detail] .ai-save-btn:hover:not(:disabled){background:#1e293b;transform:translateY(-2px)}[data-scope=explore-detail] .btn-icon{font-size:20px}[data-scope=explore-detail] .btn-txt-group{display:flex;flex-direction:column;align-items:flex-start;line-height:1.2}@media not (min-width:768px){[data-scope=explore-detail] .btn-txt-group{flex:1;flex-direction:row;align-items:center;gap:10px;justify-content:space-between}}[data-scope=explore-detail] .btn-main-txt{font-size:15px}[data-scope=explore-detail] .btn-sub-txt{font-size:11px;opacity:.8;font-weight:700}[data-scope=explore-detail] .compare-grid{display:grid;grid-template-columns:1fr;gap:24px}[data-scope=explore-detail] .compare-panel{background-color:#fff;border:1px solid #cbd5e1;border-radius:16px;padding:32px}@media not (min-width:768px){[data-scope=explore-detail] .compare-panel{padding:16px}}[data-scope=explore-detail] .compare-panel-header{margin-bottom:24px;display:flex;justify-content:flex-end}[data-scope=explore-detail] .description-text{white-space:pre-wrap;word-break:break-all;font-size:16px;line-height:1.8;color:#334155;margin:0;font-family:inherit;font-weight:500}@media not (min-width:768px){[data-scope=explore-detail] .description-text{font-size:14px}}[data-scope=explore-detail] .linked-recipe-actions{display:flex;gap:12px;padding-top:24px;border-top:2px solid #f1f5f9;width:100%}[data-scope=explore-detail] .master-mode-badge{color:#f59e0b;font-weight:900}[data-scope=explore-detail] .ai-save-btn.loading{cursor:wait;background:#94a3b8;animation:pulse 1.5s infinite}@keyframes pulse{0%{opacity:1}50%{opacity:.6}to{opacity:1}}[data-scope=explore-detail] .video-player-wrapper{position:relative;width:100%;aspect-ratio:16 / 9}[data-scope=explore-detail] .video-player-wrapper iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none;display:block}[data-scope=explore-detail] .error-state{padding:80px 20px;text-align:center;font-weight:800;color:#64748b;font-size:18px}}@layer page.shoppinglist{.shopping-container{max-width:1080px;margin:0 auto;padding:40px 16px;width:100%;background-color:#f8fafc;min-height:100vh;box-sizing:border-box}.shopping-container .control-group{display:grid;grid-template-columns:1fr 1fr;gap:10px}@media not (min-width:768px){.shopping-container .control-group{width:100%}}.shopping-container .shopping-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:40px}@media not (min-width:768px){.shopping-container .shopping-header{flex-direction:column;align-items:flex-start;gap:16px}}.shopping-container .shopping-header .header-info .title{font-size:28px;font-weight:900;margin:0 0 8px;color:#0f172a;letter-spacing:-.02em}.shopping-container .shopping-header .header-info .subtitle{font-size:14px;color:#64748b;margin:0;font-weight:600}.shopping-container .shopping-header .refresh-btn{padding:12px 24px;border-radius:999px;border:2px solid #cbd5e1;background-color:#fff;cursor:pointer;font-weight:800;color:#1e293b;transition:all .2s}.shopping-container .shopping-header .refresh-btn:hover{background-color:#f1f5f9;border-color:#64748b;transform:translateY(-1px)}.shopping-container .shopping-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:32px}.shopping-container .shopping-grid .card{background:#fff;border:2px solid #cbd5e1;border-radius:32px;padding:32px;box-shadow:none;transition:all .2s}.shopping-container .shopping-grid .card:hover{border-color:#2ea44f}.shopping-container .shopping-grid .card .card-title{display:flex;align-items:center;gap:12px;font-size:18px;font-weight:950;margin-bottom:24px;color:#0f172a}.shopping-container .shopping-grid .card .card-title .badge{padding:4px 12px;border-radius:999px;font-size:11px;font-weight:900;text-transform:uppercase}.shopping-container .shopping-grid .card .card-title .badge.missing{background:#ffebeb;color:#ef4444}.shopping-container .shopping-grid .card .card-title .badge.low-stock{background:#fff7ed;color:#f59e0b}.shopping-container .shopping-grid .card .item-list{list-style:none;padding:0;margin:0}.shopping-container .shopping-grid .card .item-list .list-item{padding:20px 0;border-bottom:1.5px solid #f1f5f9}.shopping-container .shopping-grid .card .item-list .list-item:last-child{border-bottom:none}.shopping-container .shopping-grid .card .item-list .list-item .item-main{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.shopping-container .shopping-grid .card .item-list .list-item .item-main .name{font-weight:800;font-size:17px;color:#1e293b}.shopping-container .shopping-grid .card .item-list .list-item .item-main .stock-info{color:#ef4444;font-size:14px;font-weight:700}.shopping-container .shopping-grid .card .item-list .list-item .recipe-info{font-size:13px;color:#64748b;line-height:1.5;font-weight:500;margin-bottom:12px}.shopping-container .shopping-grid .card .item-list .list-item .btn-action{padding:8px 18px;border-radius:999px;font-size:13px;font-weight:800;cursor:pointer;background:#fff;border:1.5px solid #cbd5e1;color:#475569;transition:all .2s}.shopping-container .shopping-grid .card .item-list .list-item .btn-action.add{border-color:#2ea44f;color:#2ea44f}.shopping-container .shopping-grid .card .item-list .list-item .btn-action.add:hover{background:#2ea44f;color:#fff}.shopping-container .shopping-grid .card .item-list .list-item .btn-action.edit{border-color:#f59e0b;color:#f59e0b}.shopping-container .shopping-grid .card .item-list .list-item .btn-action.edit:hover{background:#f59e0b;color:#fff}.shopping-container .shopping-grid .card .empty-msg{text-align:center;color:#94a3b8;padding:60px 0;font-size:15px;font-weight:600}.shopping-container .premium-footer{margin-top:60px;padding:32px;background:#f1f5f9;border-radius:24px;text-align:center;font-size:14px;color:#64748b;font-weight:600}.shopping-container .premium-footer .link{color:#2ea44f;font-weight:800;cursor:pointer;margin-left:8px;text-decoration:none}.shopping-container .premium-footer .link:hover{text-decoration:underline}.loading-screen{display:flex;justify-content:center;align-items:center;height:60vh;font-weight:800;color:#64748b;font-size:16px}.shopping-controls{display:flex;justify-content:flex-end;margin-bottom:32px;gap:12px}[data-scope=kitchen-shopping] .card-title-warn{color:#f59e0b}}@layer page.kitchenrecipe{.kitchen-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.register-link{padding:12px 24px;background-color:#2ea44f;color:#fff;border-radius:999px;text-decoration:none;font-weight:700;transition:background .2s}.register-link:hover{background-color:#047857}.tab-container{display:flex;gap:20px;margin-bottom:20px;border-bottom:1px solid #e2e8f0}.tab-btn{padding:12px 8px;background:none;border:none;cursor:pointer;font-size:15px;color:#64748b;border-bottom:3px solid transparent;transition:all .2s;white-space:nowrap}.tab-btn.active{border-bottom:3px solid #2ea44f;color:#2ea44f;font-weight:700}.tab-btn.tab-btn-empty{color:#cbd5e1}.initial-filter-group{margin-bottom:20px}.initial-filter-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}.initial-filter-label{font-size:14px;font-weight:700;color:#0f172a}.initial-filter-toggle{display:flex;align-items:center;gap:8px;font-size:13px;color:#64748b}.initial-filter-active{color:#0f172a;font-weight:700}.tab-container.initial-filter{flex-wrap:wrap;gap:12px}.tab-container.alphabet-filter{border-bottom:none;margin-top:-8px}.tab-container.alphabet-filter .tab-btn{padding:10px 6px;font-size:13px}.tab-container.category-filter{margin:8px 0 20px;flex-wrap:wrap;gap:12px}.kitchen-total-count{margin:12px 0;color:#475569;font-size:14px;font-weight:700}.filter-bar{display:flex;gap:12px;margin-bottom:30px}.category-select{padding:12px;border-radius:10px;border:1px solid #e2e8f0;min-width:140px;background-color:#fff}.search-input{flex:1;width:100%;padding:12px 18px;border-radius:10px;border:1px solid #e2e8f0;outline:none}.recipe-card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px}.kitchen-recipe-card{background:#fff;border-radius:24px;border:1px solid #f1f5f9;overflow:hidden;box-shadow:none;display:flex;flex-direction:column;transition:transform .2s}.kitchen-recipe-card:hover{transform:translateY(-4px)}.card-content{padding:20px;flex:1}.card-top-info{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.source-badge{font-size:10px;padding:3px 8px;border-radius:6px;color:#fff;font-weight:700;text-transform:uppercase}.source-yt{background-color:red}.source-wk{background-color:#00af89}.source-my{background-color:#3b82f6}.recipe-category-tag{font-size:11px;background:#f1f5f9;color:#64748b;padding:2px 8px;border-radius:6px}.recipe-card-title{font-size:18px;font-weight:700;color:#1e293b;margin-bottom:8px;display:block}.recipe-meta{font-size:12px;color:#94a3b8}.card-actions{display:flex;border-top:1px solid #f1f5f9;background:#f8fafc}.action-btn{flex:1;padding:14px;border:none;background:none;cursor:pointer;font-size:14px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:6px;transition:background .2s}.action-edit{color:#2ea44f;border-right:1px solid #f1f5f9}.action-edit:hover{background-color:#eff6ff}.action-delete{color:#ef4444}.action-delete:hover{background-color:#fef2f2}.loading-box,.empty-box{text-align:center;padding:80px 20px;color:#64748b}.kitchen-toolbar{display:flex;justify-content:space-between;align-items:center;background:#f8fafc;padding:12px 20px;border-radius:12px;margin-bottom:20px;border:1px solid #e2e8f0}@media not (min-width:768px){.kitchen-toolbar{display:grid;gap:10px}}.toolbar-group{display:flex;gap:10px;align-items:center}@media not (min-width:768px){.toolbar-group{display:grid;grid-template-columns:1fr min-content min-content}.toolbar-group button{align-self:stretch}.toolbar-group select{grid-column:1/-1}.toolbar-group:last-child{grid-template-columns:1fr 1fr}}.view-toggle-btn{padding:6px 12px;border:1px solid #cbd5e1;background:#fff;cursor:pointer;border-radius:6px;font-size:13px}.view-toggle-btn.active{background:#334155;color:#fff;border-color:#334155}[data-scope=kitchen-recipes] .tab-guide-box{margin-top:10px;margin-bottom:14px;font-size:12px;color:#64748b;background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:8px 10px}[data-scope=kitchen-recipes] .kitchen-recipe-card-list{display:grid;grid-template-columns:72px 1fr auto;align-items:center;gap:12px}[data-scope=kitchen-recipes] .card-thumb-wrap{width:100%;aspect-ratio:16 / 9;overflow:hidden;border-radius:12px;margin-bottom:10px;background:#f1f5f9}[data-scope=kitchen-recipes] .card-thumb-wrap-list{width:72px;height:72px;aspect-ratio:auto;border-radius:999px;background-color:#2ea44f;margin-bottom:0}[data-scope=kitchen-recipes] .card-thumb-media{width:100%;height:100%;object-fit:cover;object-position:center}[data-scope=kitchen-recipes] .recipe-group-list{display:grid;gap:20px}[data-scope=kitchen-recipes] .recipe-group-title{margin-bottom:10px}.avail-badge{font-size:11px;padding:3px 8px;border-radius:20px;font-weight:700}.status-ok{background:#dcfce7;color:#15803d}.status-no{background:#fee2e2;color:#b91c1c}.missing-info{margin-top:10px;font-size:12px;color:#ef4444;background:#fff1f2;padding:8px;border-radius:6px}.kitchen-recipe-card{cursor:pointer;transition:all .2s ease-in-out}.kitchen-recipe-card:hover{transform:translateY(-5px);box-shadow:0 12px 20px -5px #0000001a;border-color:#059669}.recipe-card-title{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;margin:8px 0}.card-actions{background:#fdfdfd;z-index:2}}@layer page.billing{.point-store-card{background:linear-gradient(135deg,#fff,#f0f9ff);border:1px solid #e0f2fe;border-radius:16px;padding:20px;margin-bottom:20px;box-shadow:0 4px 6px -1px #0000000d}.point-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.point-header h3{margin:0;font-size:18px;color:#0369a1}.credit-display{display:flex;align-items:center;gap:8px;background:#fff;padding:8px 16px;border-radius:12px;border:1px solid #bae6fd}.credit-count{font-size:20px;font-weight:800;color:#0c4a6e}.ad-section{text-align:center}.ad-btn{width:100%;padding:16px;background-color:#0ea5e9;color:#fff;border:none;border-radius:12px;font-size:16px;font-weight:700;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:10px}.ad-btn:hover{background-color:#0284c7;transform:translateY(-2px)}.ad-btn:active{transform:translateY(0)}.ad-hint{font-size:12px;color:#64748b;margin-top:10px}}@layer page.pointstore{.point-store-card{background:linear-gradient(135deg,#fff,#f0f9ff);border:1px solid #e0f2fe;border-radius:24px;padding:20px;margin-bottom:20px;box-shadow:none;border:1.5px solid #f1f5f9}.point-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.point-header h3{margin:0;font-size:18px;color:#0369a1}.credit-display{display:flex;align-items:center;gap:8px;background:#fff;padding:8px 16px;border-radius:12px;border:1px solid #bae6fd}.credit-count{font-size:20px;font-weight:800;color:#0c4a6e}.ad-section{text-align:center}.ad-btn{width:100%;padding:16px;background-color:#2ea44f;color:#fff;border:none;border-radius:999px;font-size:16px;font-weight:700;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:10px}.ad-btn:hover{background-color:#0284c7;transform:translateY(-2px)}.ad-btn:active{transform:translateY(0)}.ad-hint{font-size:12px;color:#64748b;margin-top:10px}.point-store-container{padding:20px;max-width:500px;width:100%;margin:0 auto;font-family:-apple-system,sans-serif}.store-header{margin-bottom:30px;text-align:center;position:relative}.back-btn{position:absolute;left:0;top:5px;border:none;background:none;font-size:24px;cursor:pointer;color:#333}.store-header h2{font-weight:900;margin:0}.current-point-card{background:linear-gradient(135deg,#111,#333);color:#fff;padding:20px;border-radius:20px;margin-top:25px;display:flex;justify-content:space-between;align-items:center;box-shadow:none}.current-point-card .label{font-size:14px;opacity:.8}.current-point-card .value{font-size:22px;font-weight:700;color:#fbbf24}.ad-list{display:flex;flex-direction:column;gap:16px;margin-top:30px}.ad-unit-card{background:#fff;padding:24px;border-radius:24px;border:1px solid #eef2f6;box-shadow:none;border:1.5px solid #f1f5f9;transition:transform .2s}.ad-unit-card:hover{transform:translateY(-2px)}.ad-badge{display:inline-block;font-size:11px;background:#fef3c7;color:#92400e;padding:4px 10px;border-radius:10px;font-weight:700;margin-bottom:10px}.ad-unit-card h4{margin:0 0 6px;font-size:18px;color:#111}.ad-unit-card p{font-size:14px;color:#666;margin:0 0 20px;line-height:1.4}.earn-btn-main{width:100%;padding:16px;border-radius:999px;border:none;background:#2ea44f;color:#fff;font-weight:700;font-size:16px;cursor:pointer;transition:background .2s}.earn-btn-main:disabled{background:#cbd5e1;cursor:not-allowed}.earn-btn-sub{width:100%;padding:14px;border-radius:14px;border:1.5px solid #059669;background:#fff;color:#059669;font-weight:700;font-size:14px;cursor:pointer}.ad-footer-notice{text-align:center;font-size:12px;color:#aaa;margin-top:40px;line-height:1.6}}@layer page.usermanagement{.kitchen-header{margin-bottom:30px;border-bottom:2px solid #f1f5f9;padding-bottom:20px}.kitchen-table{width:100%;border-collapse:collapse;font-size:14px}.kitchen-table th{text-align:left;background:#f8fafc;padding:12px;color:#64748b;border-bottom:1px solid #e2e8f0}.kitchen-table td{padding:15px 12px;border-bottom:1px solid #f1f5f9}.point-cell{font-weight:700;color:#0f172a}.edit-point-btn{padding:6px 12px;background:#f1f5f9;border:1px solid #e2e8f0;border-radius:6px;cursor:pointer;font-size:12px;transition:all .2s}.edit-point-btn:hover{background:#e2e8f0;color:#1e293b}}@layer page.cookdna{.shell{max-width:560px;margin:0 auto;padding:0 20px}.system-header{padding:40px 0 28px;border-bottom:1px solid var(--border);margin-bottom:32px}.sys-badge{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:10px;color:var(--accent);background:#d4541a14;border:1px solid rgba(212,84,26,.25);padding:4px 12px;border-radius:4px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}.sys-badge .dot{width:6px;height:6px;background:var(--accent);border-radius:50%;animation:blink 1.2s ease-in-out infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.2}}.system-header h1{font-size:30px;font-weight:900;line-height:1.2;letter-spacing:-.5px;margin-bottom:8px}.system-header h1 em{color:var(--accent);font-style:normal}.sys-sub{font-family:var(--mono);font-size:11px;color:var(--muted);line-height:1.7}.prog-system{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:36px}.prog-node{position:relative;cursor:default}.prog-bar-wrap{height:3px;background:var(--border);border-radius:2px;margin-bottom:8px;overflow:hidden}.prog-bar-fill{height:100%;background:var(--accent);border-radius:2px;width:0%;transition:width .5s cubic-bezier(.16,1,.3,1)}.prog-node.done .prog-bar-fill{width:100%;background:var(--green)}.prog-node.active .prog-bar-fill{width:100%}.prog-node-label{font-family:var(--mono);font-size:9px;color:var(--muted);letter-spacing:.05em;line-height:1.4}.prog-node.active .prog-node-label{color:var(--accent);font-weight:600}.prog-node.done .prog-node-label{color:var(--green)}.prog-step-num{font-size:10px;font-weight:700;display:block;margin-bottom:2px}.step-panel{display:none}.step-panel.active{display:block;animation:slideIn .4s cubic-bezier(.16,1,.3,1)}@keyframes slideIn{0%{opacity:0;transform:translate(24px)}to{opacity:1;transform:translate(0)}}.step-head{margin-bottom:28px}.step-type-row{display:flex;align-items:center;gap:10px;margin-bottom:12px}.step-num-badge{font-family:var(--mono);font-size:10px;font-weight:600;color:var(--surface);background:var(--ink);padding:3px 9px;border-radius:4px;letter-spacing:.05em}.step-type-tag{font-family:var(--mono);font-size:10px;color:var(--muted);letter-spacing:.08em;text-transform:uppercase}.step-title{font-size:24px;font-weight:900;line-height:1.25;letter-spacing:-.3px;margin-bottom:6px}.step-desc{font-size:13px;color:var(--muted);line-height:1.7;font-family:var(--mono)}.q-block{margin-bottom:28px}.q-label{font-size:12px;font-family:var(--mono);color:var(--muted);letter-spacing:.08em;text-transform:uppercase;margin-bottom:12px;display:flex;align-items:center;gap:8px}.q-label .hint{color:var(--accent2);font-size:10px;background:#2563a814;border:1px solid rgba(37,99,168,.2);padding:2px 8px;border-radius:3px;letter-spacing:0}.chip-grid{display:flex;flex-wrap:wrap;gap:8px}.chip.selected{border-color:var(--accent);background:#d4541a0f;color:var(--accent)}.chip.selected .chip-icon{filter:none}.chip-icon{font-size:17px}.chip-sub{font-size:10px;font-family:var(--mono);color:var(--muted);margin-left:2px}.chip.selected .chip-sub{color:#d4541a99}.icon-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.icon-card{background:var(--card-bg);border:1.5px solid var(--border);border-radius:var(--r);padding:18px 15px;cursor:pointer;transition:all .18s;-webkit-user-select:none;user-select:none;position:relative;overflow:hidden}.icon-card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--accent);transform:scaleX(0);transition:transform .2s;transform-origin:left}.icon-card.selected:before{transform:scaleX(1)}.icon-card:hover{border-color:var(--ink);transform:translateY(-2px);box-shadow:0 4px 16px #00000012}.icon-card.selected{border-color:var(--accent);background:#d4541a0a}.ic-check{position:absolute;top:10px;right:10px;width:20px;height:20px;background:var(--accent);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;color:#fff;font-weight:700;opacity:0;transform:scale(.5);transition:all .2s}.icon-card.selected .ic-check{opacity:1;transform:scale(1)}.ic-emoji{font-size:30px;margin-bottom:10px;display:block}.ic-name{font-size:14px;font-weight:700;margin-bottom:4px}.ic-tag{font-family:var(--mono);font-size:10px;color:var(--accent);margin-bottom:5px}.ic-desc{font-size:11px;color:var(--muted);font-family:var(--mono);line-height:1.5}.icon-card.full{grid-column:span 2}.icon-card.full .inner{display:flex;align-items:center;gap:16px}.icon-card.full .ic-emoji{font-size:28px;margin-bottom:0;flex-shrink:0}.range-block{margin-bottom:4px}.range-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.range-header label{font-size:13px;font-weight:600}.range-val{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--accent);background:#d4541a14;padding:3px 10px;border-radius:4px;min-width:70px;text-align:center}input[type=range]{width:100%;appearance:none;height:4px;background:var(--border);border-radius:2px;outline:none;cursor:pointer}input[type=range]::-webkit-slider-thumb{appearance:none;width:22px;height:22px;border-radius:50%;background:var(--surface);border:2.5px solid var(--accent);box-shadow:0 2px 8px #d4541a40;transition:transform .15s}input[type=range]:hover::-webkit-slider-thumb{transform:scale(1.15)}.range-legend{display:flex;justify-content:space-between;font-family:var(--mono);font-size:10px;color:var(--muted);margin-top:7px}.skill-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.skill-card{padding:14px 10px;background:var(--card-bg);border:1.5px solid var(--border);border-radius:var(--r);cursor:pointer;text-align:center;transition:all .18s;-webkit-user-select:none;user-select:none}.skill-card:hover{border-color:var(--ink)}.skill-card.selected{border-color:var(--accent);background:#d4541a0d}.skill-icon{font-size:22px;margin-bottom:6px;display:block}.skill-name{font-size:12px;font-weight:700;margin-bottom:3px}.skill-desc{font-size:10px;color:var(--muted);font-family:var(--mono);line-height:1.4}.budget-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.budget-card{padding:14px 8px;background:var(--card-bg);border:1.5px solid var(--border);border-radius:var(--r);cursor:pointer;text-align:center;transition:all .18s;-webkit-user-select:none;user-select:none}.budget-card:hover{border-color:var(--ink)}.budget-card.selected{border-color:var(--accent2);background:#2563a80d;color:var(--accent2)}.budget-price{font-size:14px;font-weight:700;margin-bottom:3px}.budget-label{font-size:10px;font-family:var(--mono);color:var(--muted)}.serving-row{display:flex;align-items:center;gap:0;background:var(--card-bg);border:1.5px solid var(--border);border-radius:var(--r);overflow:hidden}.serving-btn{width:52px;height:52px;background:transparent;border:none;cursor:pointer;font-size:20px;color:var(--muted);transition:all .15s;flex-shrink:0}.serving-btn:hover{background:var(--border);color:var(--ink)}.serving-display{flex:1;text-align:center;font-family:var(--mono);font-size:15px;font-weight:600;border-left:1px solid var(--border);border-right:1px solid var(--border)}.serving-display span{color:var(--muted);font-size:11px}.text-input{width:100%;padding:13px 16px;background:var(--card-bg);border:1.5px solid var(--border);border-radius:var(--r);font-family:var(--mono);font-size:12px;color:var(--ink);outline:none;transition:border-color .2s;resize:none}.text-input::placeholder{color:var(--muted)}.text-input:focus{border-color:var(--accent2)}hr.div{border:none;border-top:1px solid var(--border);margin:24px 0}.cuisine-row{display:flex;gap:8px;flex-wrap:wrap}.cuisine-chip{padding:9px 14px;background:var(--card-bg);border:1.5px solid var(--border);border-radius:8px;cursor:pointer;font-size:13px;font-weight:500;transition:all .18s;-webkit-user-select:none;user-select:none}.cuisine-chip:hover{border-color:var(--ink)}.cuisine-chip.selected{border-color:var(--accent2);background:#2563a80f;color:var(--accent2)}.time-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.time-card{background:var(--card-bg);border:1.5px solid var(--border);border-radius:var(--r);padding:16px 10px;cursor:pointer;text-align:center;transition:all .18s;-webkit-user-select:none;user-select:none}.time-card:hover{border-color:var(--ink);transform:translateY(-1px)}.time-card.selected{border-color:var(--accent);background:#d4541a0d}.time-num{font-family:var(--mono);font-size:22px;font-weight:700;color:var(--accent);display:block;margin-bottom:3px}.time-unit{font-family:var(--mono);font-size:10px;color:var(--muted);display:block;margin-bottom:8px}.time-label{font-size:11px;font-weight:600;display:block;margin-bottom:3px}.time-sub{font-size:10px;color:var(--muted);font-family:var(--mono)}.nav-row{display:flex;gap:10px;margin-top:36px;position:sticky;bottom:24px}.btn-back{flex:0 0 auto;padding:15px 20px;background:var(--surface);border:1.5px solid var(--border);border-radius:var(--r);font-size:13px;font-family:var(--mono);color:var(--muted);cursor:pointer;transition:all .18s}.btn-back:hover{border-color:var(--ink);color:var(--ink)}.btn-next{flex:1;padding:15px;border-radius:999px;background-color:#2ea44f;font-size:14px;font-weight:700;font-family:var(--sans);cursor:pointer;transition:all .2s;letter-spacing:-.2px}.btn-next:hover,.btn-next.primary{background:var(--accent)}.btn-next.primary:hover{background:#b8431a}.transition-screen{display:none;min-height:80vh;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:60px 20px}.transition-screen.active{display:flex;animation:fadeIn .5s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.scan-anim{width:80px;height:80px;border:2px solid var(--border);border-radius:50%;position:relative;margin:0 auto 32px}.scan-anim:after{content:"";position:absolute;inset:6px;border:2px solid var(--accent);border-radius:50%;border-top-color:transparent;animation:spin .9s linear infinite}.scan-anim:before{content:"⚙️";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:28px;animation:spin 3s linear infinite reverse}@keyframes spin{to{transform:rotate(360deg)}}.trans-title{font-size:20px;font-weight:900;margin-bottom:8px}.trans-sub{font-family:var(--mono);font-size:12px;color:var(--muted);line-height:1.7}.trans-log{margin-top:28px;text-align:left;background:var(--ink);color:#6effa0;font-family:var(--mono);font-size:11px;padding:16px 20px;border-radius:var(--r);width:100%;max-width:400px;line-height:2}.trans-log .log-line{opacity:0;animation:logIn .3s ease forwards}.trans-log .log-line:nth-child(1){animation-delay:.2s}.trans-log .log-line:nth-child(2){animation-delay:.6s}.trans-log .log-line:nth-child(3){animation-delay:1s}.trans-log .log-line:nth-child(4){animation-delay:1.4s}.trans-log .log-line:nth-child(5){animation-delay:1.8s}@keyframes logIn{to{opacity:1}}.result-screen{display:none}.result-screen.active{display:block;animation:slideIn .5s ease}.profile-card{background:var(--ink);color:var(--bg);border-radius:20px;padding:28px;margin-bottom:16px;position:relative;overflow:hidden}.profile-card:after{content:"";position:absolute;top:-40px;right:-40px;width:160px;height:160px;border-radius:50%;background:#d4541a26}.profile-eyebrow{font-family:var(--mono);font-size:10px;color:var(--accent);letter-spacing:.15em;text-transform:uppercase;margin-bottom:10px}.profile-persona{font-size:28px;font-weight:900;margin-bottom:6px;line-height:1.2;position:relative}.profile-desc{font-size:13px;color:#f5f2eca6;font-family:var(--mono);line-height:1.7;margin-bottom:20px;position:relative}.profile-chips{display:flex;flex-wrap:wrap;gap:6px;position:relative}.profile-chip{font-family:var(--mono);font-size:10px;padding:4px 11px;border-radius:20px;border:1px solid rgba(245,242,236,.2);color:#f5f2eccc}.spec-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:22px;margin-bottom:12px}.spec-title{font-family:var(--mono);font-size:10px;color:var(--muted);letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}.spec-row{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid var(--border);font-size:13px}.spec-row:last-child{border-bottom:none;padding-bottom:0}.spec-key{color:var(--muted);font-family:var(--mono);font-size:11px}.spec-val{font-weight:700;font-size:12px;text-align:right;max-width:60%}.spec-val.accent{color:var(--accent)}.spec-val.blue{color:var(--accent2)}.recipe-preview{background:linear-gradient(135deg,#d4541a14,#2563a80f);border:1.5px solid rgba(212,84,26,.2);border-radius:16px;padding:22px;margin-bottom:16px}.recipe-label{font-family:var(--mono);font-size:10px;color:var(--accent);letter-spacing:.1em;margin-bottom:8px}.recipe-name{font-size:19px;font-weight:900;margin-bottom:6px;line-height:1.3}.recipe-why{font-family:var(--mono);font-size:11px;color:var(--muted);line-height:1.7}.btn-restart{width:100%;padding:15px;background:transparent;border:1.5px solid var(--border);border-radius:var(--r);font-family:var(--mono);font-size:12px;color:var(--muted);cursor:pointer;transition:all .18s;margin-top:8px}.btn-restart:hover{border-color:var(--ink);color:var(--ink)}.allergy-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.allergy-chip{padding:12px 6px;background:var(--card-bg);border:1.5px solid var(--border);border-radius:10px;cursor:pointer;text-align:center;transition:all .18s;-webkit-user-select:none;user-select:none}.allergy-chip:hover{border-color:var(--ink)}.allergy-chip.selected{border-color:#e63d3d;background:#e63d3d0d}.allergy-icon{font-size:20px;display:block;margin-bottom:5px}.allergy-name{font-size:10px;font-family:var(--mono);color:var(--muted)}.allergy-chip.selected .allergy-name{color:#e63d3d}}@layer page.recipe{.recipe-container{padding:16px 16px 120px;max-width:1024px;margin:0 auto;position:relative;width:100%;box-sizing:border-box;font-family:Inter,sans-serif}@media not (min-width:768px){.recipe-container{padding-bottom:0}}.top-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.category-badge,.category-label{font-size:13px;color:#2ea44f;background:#ecfdf5;padding:6px 14px;border-radius:999px;font-weight:700}.edit-button,.edit-btn{background:#fff;border:1.5px solid #e2e8f0;border-radius:999px;padding:6px 14px;font-size:13px;color:#4b5563;cursor:pointer;font-weight:700;transition:all .2s}.edit-button:hover,.edit-btn:hover{background:#f9fafb;border-color:#cbd5e1}.nav-buttons{display:flex;gap:8px;align-items:center}.scrap-button{background:#fff;border:1.5px solid #e2e8f0;border-radius:999px;padding:6px 14px;font-size:13px;color:#4b5563;cursor:pointer;font-weight:700;transition:all .2s;display:flex;align-items:center;gap:4px}.scrap-button:hover{background:#f9fafb;border-color:#cbd5e1}.scrap-button:disabled{opacity:.6;cursor:not-allowed}.recipe-header{text-align:center;margin-bottom:30px}.recipe-title{margin:10px 0 20px;font-size:26px;font-weight:700;color:#1a202c}.media-box>img:only-child{height:200px}@media not (min-width:768px){.media-box>img:only-child{height:auto}}.media-box,.media-wrapper{width:100%;overflow:hidden;margin-bottom:24px}.media-box.sticky-enabled{position:sticky;top:72px;z-index:100;width:calc(100% - 60px);max-width:520px;margin-left:auto;margin-right:auto}@media(max-width:768px){.media-box.sticky-enabled{top:8px;width:100%;max-width:none}}.video-ratio,.video-container{position:relative;width:100%;aspect-ratio:16 / 9}.video-ratio iframe,.video-container iframe,.video-frame iframe{position:absolute;top:0;left:0;width:100%!important;height:100%!important;border:none}.header-img,.recipe-img{width:100%;height:auto;display:block;object-fit:cover}.servings-section,.servings-card{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;background:#fff;border-radius:16px;border:1.5px solid #e2e8f0;margin-bottom:30px}.servings-input-group,.servings-control{display:flex;align-items:center;gap:8px}.servings-btn{width:36px;height:36px;border:1.5px solid #e2e8f0;background:#fff;border-radius:999px;cursor:pointer;font-size:20px;display:flex;align-items:center;justify-content:center;color:#4b5563;transition:all .2s}.servings-btn:hover{background:#f9fafb;border-color:#cbd5e1}.servings-input{width:45px;border:none;background:transparent;text-align:center;font-size:18px;font-weight:700}.section-title{border-bottom:2px solid #f1f5f9;padding-bottom:10px;font-weight:700;font-size:19px;color:#1e293b}@media not (min-width:768px){.section-title{margin-bottom:0}}.item-row,.ingredient-item{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid #f1f5f9}.ingredient-name-wrapper span{font-size:1.8rem;font-weight:600;color:#1f2937}.ingredient-name-wrapper span.badge{font-size:1.4rem}.amount-container,.amount-group{display:flex;flex-direction:column;align-items:flex-end;gap:4px}.primary-amount,.main-amount{font-weight:700;color:#334155;font-size:15px}.conversion-badge,.convert-badge{font-size:11px;background-color:#fef3c7;color:#92400e;padding:2px 8px;border-radius:4px;font-weight:700}.sauce-container{background:#fffbeb;padding:24px;border-radius:16px;border:1.5px solid #fde68a;margin-bottom:24px}.sauce-name{display:block;margin-bottom:12px;color:#92400e;font-weight:700;font-size:16px}.step-card,.step-item{margin-bottom:20px;padding:24px;background:#fff;border-radius:16px;border:1.5px solid #e2e8f0;transition:all .3s ease}.sauce-detail-block{margin-top:20px}.step-detail-block{margin-top:40px}.sauce-section-title{color:#d97706;border-bottom-color:#fcd34d}.sauce-ingredient-name{font-size:14px}.step-flash{animation:timer-flash .6s ease-in-out 4}.step-label-row{display:flex;align-items:center;gap:10px;margin-bottom:8px}.step-id,.step-num{font-weight:900;color:#2ea44f;font-size:14px;letter-spacing:-.02em}.duration-tag,.time-tag{font-size:12px;color:#2ea44f;background:#ecfdf5;padding:4px 12px;border-radius:999px;font-weight:700}.step-text{line-height:1.7;color:#1f2937;font-size:16px;margin:12px 0 0}.timer-preferences{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.timer-mode-badge{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:800;border:1px solid transparent}.timer-mode-badge.mode-global{background:#eff6ff;border-color:#bfdbfe;color:#1d4ed8}.timer-mode-badge.mode-local{background:#fffbeb;border-color:#fde68a;color:#a16207}.timer-global-toggle{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:8px;border:1px dashed #cbd5e1;background:#f8fafc;font-size:12px;color:#334155;font-weight:700}.timer-sound-btn{border:1px solid #cbd5e1;background:#fff;padding:6px 10px;border-radius:8px;font-size:12px;cursor:pointer;font-weight:700}.timer-sound-btn.sound-on{color:#0f766e;border-color:#99f6e4;background:#f0fdfa}.timer-sound-btn.sound-off{color:#a16207;border-color:#fde68a;background:#fffbeb}.timer-sound-hint{font-size:11px;color:#a16207}.timer-sound-warning{display:flex;align-items:center;gap:8px;font-size:11px;color:#b91c1c;background:#fef2f2;padding:6px 10px;border-radius:8px;border:1px solid #fecaca}.timer-test-btn{border:none;background:#ef4444;color:#fff;padding:4px 8px;border-radius:6px;font-size:11px;cursor:pointer}.alarm-banner{position:fixed;left:50%;bottom:210px;transform:translate(-50%);width:calc(100% - 24px);max-width:560px;background:linear-gradient(120deg,#dc2626,#b91c1c);color:#fff;border-radius:14px;padding:12px;display:flex;align-items:center;justify-content:space-between;gap:10px;z-index:1200;border:1px solid #dc2626;animation:alarm-pulse .9s ease-in-out infinite}.alarm-banner-text{display:flex;flex-direction:column;gap:4px;min-width:0}.alarm-banner-text strong{font-size:14px;line-height:1.2}.alarm-banner-text span{font-size:12px;line-height:1.3;opacity:.95}.alarm-stop-btn{border:none;background:#fff;color:#991b1b;padding:9px 12px;border-radius:10px;font-size:12px;font-weight:800;cursor:pointer;white-space:nowrap}.alarm-stop-btn:active{transform:scale(.98)}@keyframes alarm-pulse{0%{opacity:.9}50%{opacity:1}to{opacity:.9}}@media(max-width:480px){.alarm-banner{flex-direction:column;align-items:stretch;bottom:196px}.alarm-stop-btn{width:100%}}.timer-controls{display:flex;align-items:center;gap:8px;margin-top:10px}.timer-btn{border:1.5px solid #e2e8f0;background:#fff;padding:8px 18px;border-radius:999px;font-size:13px;cursor:pointer;font-weight:700;transition:all .2s}.timer-btn.start{color:#2ea44f;border-color:#2ea44f;background:#fff}.timer-btn.start:hover{background:#ecfdf5}.timer-btn.stop{color:#fff;border-color:#ef4444;background:#ef4444}.timer-btn:disabled{opacity:.4;cursor:not-allowed}.timer-remaining{font-size:12px;font-weight:700;color:#1e293b;background:#f1f5f9;padding:4px 10px;border-radius:999px}@keyframes timer-flash{0%{opacity:.8}50%{opacity:1}to{opacity:.8}}.floating-cook-btn,.cook-btn{width:100%;box-sizing:border-box;padding:20px;background:#2ea44f;color:#fff;border:none;border-radius:14px;font-size:18px;font-weight:700;cursor:pointer;z-index:1000}.center-msg{padding:50px;text-align:center;color:#666}.stock-status{font-size:10px;padding:2px 6px;border-radius:4px;margin-left:6px;font-weight:700}.status-in-stock{background-color:#dcfce7;color:#166534}.status-out-of-stock{background-color:#fee2e2;color:#991b1b}.ingredient-name-wrapper{display:flex;align-items:center;flex-wrap:wrap;gap:6px}.replenish-mini-btn{border:1px solid #fca5a5;background:#fff1f2;color:#be123c;font-size:11px;padding:2px 8px;border-radius:999px;font-weight:700;cursor:pointer}.cook-count-text{align-self:center;margin-right:auto;color:#475569;font-size:13px;font-weight:700}.replenish-mini-btn:hover{background:#ffe4e6}.replenish-overlay{position:fixed;inset:0;background:#0f172a75;z-index:1300;display:flex;align-items:center;justify-content:center;padding:20px}.replenish-overlay-backdrop{position:absolute;inset:0;border:none;background:transparent;cursor:pointer}.replenish-modal{position:relative;z-index:1;width:min(100%,420px);background:#fff;border-radius:16px;border:1px solid #e2e8f0;box-shadow:0 14px 30px #02061740;padding:18px}.replenish-title{margin:0;font-size:18px;font-weight:800;color:#111827}.replenish-guide{margin:8px 0 12px;font-size:13px;color:#475569}.replenish-grid{display:grid;grid-template-columns:1fr;gap:8px}.replenish-label{font-size:12px;font-weight:700;color:#334155}.replenish-input{width:100%;border:1px solid #cbd5e1;border-radius:10px;padding:10px 12px;font-size:14px;box-sizing:border-box}.replenish-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}.replenish-cancel,.replenish-save{border-radius:10px;padding:9px 12px;border:1px solid #cbd5e1;font-weight:800;cursor:pointer}.replenish-cancel{background:#fff;color:#475569}.replenish-save{border-color:#16a34a;background:#16a34a;color:#fff}.replenish-save:disabled{opacity:.65;cursor:not-allowed}}