.cl-app{--cl-red:#c8371a;--cl-gold:#f5a623;--cl-green:#2d5016;--cl-cream:#fdf6ec;--cl-dark:#1a1a2e;--cl-card:#fff;--cl-border:#1a1a2e1a;--cl-shadow:0 2px 16px #1a1a2e14;--cl-shadow-lg:0 8px 32px #1a1a2e24;--cl-radius:16px;--cl-radius-sm:8px;--cl-font-d:"Playfair Display", Georgia, serif;--cl-font-b:"Nunito", system-ui, sans-serif;font-family:var(--cl-font-b);-webkit-font-smoothing:antialiased;background:var(--cl-cream);color:var(--cl-dark);flex-direction:column;flex:1;font-size:16px;display:flex}.cl-app *,.cl-app :before,.cl-app :after{box-sizing:border-box;margin:0;padding:0}.cl-app h1,.cl-app h2,.cl-app h3{font-family:var(--cl-font-d);line-height:1.2}.cl-app a{color:inherit;text-decoration:none}.cl-app button{cursor:pointer;font-family:var(--cl-font-b)}.cl-app img{max-width:100%;display:block}.cl-app .container{max-width:860px;margin:0 auto;padding:0 20px}.cl-app .cl-topbar{background:var(--cl-dark);color:var(--cl-cream);z-index:100;padding:14px 0;position:sticky;top:0;box-shadow:0 2px 12px #0003}.cl-app .cl-topbar-inner{align-items:center;gap:12px;max-width:860px;margin:0 auto;padding:0 20px;display:flex}.cl-app .cl-logo{font-family:var(--cl-font-d);color:var(--cl-cream);letter-spacing:-.5px;font-size:20px;font-weight:700}.cl-app .cl-logo span{color:var(--cl-gold)}.cl-app .cl-tag{color:var(--cl-gold);letter-spacing:.5px;text-transform:uppercase;background:#f5a62333;border-radius:20px;padding:3px 8px;font-size:11px;font-weight:600}.cl-app .cl-spacer{flex:1}.cl-app .cl-back{color:#fdf6ec99;background:0 0;border:none;border-radius:20px;padding:6px 12px;font-size:13px;text-decoration:none;transition:background .15s;display:inline-block}.cl-app .cl-back:hover{color:var(--cl-cream);background:#ffffff14}.cl-app .cl-hero{background:var(--cl-dark);color:var(--cl-cream);text-align:center;background-position:50%;background-size:cover;padding:72px 20px 80px;position:relative;overflow:hidden}.cl-app .cl-hero:before{content:"";background:#1a1a2ed1;position:absolute;inset:0}.cl-app .cl-hero>*{z-index:1;position:relative}.cl-app .cl-hero-emoji{margin-bottom:20px;font-size:56px;line-height:1}.cl-app .cl-hero h1{color:var(--cl-cream);margin-bottom:12px;font-size:clamp(36px,6vw,56px);font-weight:700}.cl-app .cl-hero h1 span{color:var(--cl-gold)}.cl-app .cl-tagline{color:#fdf6ecb3;max-width:540px;margin:0 auto 40px;font-size:clamp(16px,2.5vw,20px);line-height:1.6}.cl-app .cl-lang-grid{grid-template-columns:repeat(2,1fr);gap:16px;max-width:480px;margin:0 auto;display:grid}.cl-app .cl-lang-card{border-radius:var(--cl-radius);text-align:center;cursor:pointer;color:var(--cl-cream);background:#ffffff0f;border:1.5px solid #ffffff1f;flex-direction:column;align-items:center;gap:10px;padding:28px 16px;transition:background .15s,border-color .15s,transform .15s;display:flex}.cl-app .cl-lang-card:hover:not(.cl-lang-disabled){border-color:var(--cl-gold);background:#ffffff1a;transform:translateY(-2px)}.cl-app .cl-lang-active{border-color:var(--cl-gold)}.cl-app .cl-lang-disabled{opacity:.4;cursor:default}.cl-app .cl-flag{font-size:36px;line-height:1}.cl-app .cl-lang-name{font-size:15px;font-weight:600}.cl-app .cl-lang-soon{letter-spacing:.5px;text-transform:uppercase;color:#fdf6ec66;font-size:10px;font-weight:700}.cl-app .cl-how{text-align:center;padding:72px 20px}.cl-app .cl-how h2{color:var(--cl-dark);margin-bottom:48px;font-size:28px}.cl-app .cl-how-grid{grid-template-columns:repeat(2,1fr);gap:24px;max-width:600px;margin:0 auto;display:grid}.cl-app .cl-how-card{background:var(--cl-card);border-radius:var(--cl-radius);box-shadow:var(--cl-shadow);text-align:left;padding:28px 20px}.cl-app .cl-how-icon{margin-bottom:12px;font-size:28px}.cl-app .cl-how-card h3{font-size:16px;font-weight:700;font-family:var(--cl-font-b);margin-bottom:6px}.cl-app .cl-how-card p{color:#666;font-size:14px;line-height:1.5}.cl-app .cl-list-header{padding:48px 0 32px}.cl-app .cl-list-header h1{margin-bottom:8px;font-size:36px}.cl-app .cl-list-header p{color:#666;font-size:16px}.cl-app .cl-recipe-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px;padding-bottom:64px;display:grid}.cl-app .cl-recipe-card{background:var(--cl-card);border-radius:var(--cl-radius);box-shadow:var(--cl-shadow);cursor:pointer;color:var(--cl-dark);border:1.5px solid #0000;flex-direction:column;padding:0;transition:box-shadow .15s,transform .15s;display:flex;overflow:hidden}.cl-app .cl-recipe-card:hover{box-shadow:var(--cl-shadow-lg);border-color:var(--cl-red);transform:translateY(-2px)}.cl-app .cl-cover-img{border-radius:var(--cl-radius) var(--cl-radius) 0 0;background:var(--cl-dark);height:200px;position:relative;overflow:hidden}.cl-app .cl-cover-emoji{z-index:1;filter:drop-shadow(0 2px 8px #00000080);font-size:36px;line-height:1;position:absolute;bottom:12px;left:16px}.cl-app .cl-card-body{flex-direction:column;flex:1;gap:12px;padding:20px 24px;display:flex}.cl-app .cl-recipe-card h2{font-size:22px}.cl-app .cl-recipe-desc{color:#666;font-size:14px;line-height:1.5}.cl-app .cl-meta{flex-wrap:wrap;align-items:center;gap:10px;margin-top:auto;display:flex}.cl-app .cl-badge{letter-spacing:.3px;border-radius:20px;padding:4px 10px;font-size:11px;font-weight:700}.cl-app .cl-badge-diff{color:#fff}.cl-app .cl-badge-dur{color:var(--cl-dark);background:#1a1a2e14}.cl-app .cl-badge-srv{color:var(--cl-red);background:#c8371a14}.cl-app .cl-recipe-hero{background:var(--cl-dark);height:380px;position:relative;overflow:hidden}.cl-app .cl-recipe-hero-overlay{background:linear-gradient(#00000014 0%,#000000b8 100%);align-items:flex-end;display:flex;position:absolute;inset:0}.cl-app .cl-recipe-hero-content{width:100%;max-width:860px;margin:0 auto;padding:0 20px 36px}.cl-app .cl-recipe-hero-content h1{color:#fff;text-shadow:0 2px 12px #0006;margin-bottom:14px;font-size:clamp(28px,5vw,44px)}.cl-app .cl-recipe-desc-long{color:#555;max-width:600px;margin:20px 0 28px;font-size:16px;line-height:1.6}.cl-app .cl-steps-label{letter-spacing:1px;text-transform:uppercase;color:#1a1a2e66;margin-bottom:24px;font-size:13px;font-weight:700}.cl-app .cl-steps-list{flex-direction:column;gap:20px;margin-bottom:64px;display:flex}.cl-app .cl-step-card{background:var(--cl-card);border-radius:var(--cl-radius);box-shadow:var(--cl-shadow);overflow:hidden}.cl-app .cl-step-body{padding:24px}.cl-app .cl-step-num{background:var(--cl-red);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;margin-bottom:14px;font-size:13px;font-weight:700;display:inline-flex}.cl-app .cl-step-text{color:var(--cl-dark);font-size:17px;line-height:1.7}.cl-app .cl-vocab{color:var(--cl-dark);border-bottom:2px solid var(--cl-gold);cursor:pointer;transition:color .15s;display:inline;position:relative}.cl-app .cl-vocab:hover{color:var(--cl-red)}.cl-app .cl-popover{background:var(--cl-dark);color:var(--cl-cream);white-space:nowrap;z-index:50;pointer-events:none;border-radius:8px;padding:8px 14px;font-size:13px;font-weight:600;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%);box-shadow:0 4px 16px #0000004d}.cl-app .cl-popover:after{content:"";border:6px solid #0000;border-top-color:var(--cl-dark);position:absolute;top:100%;left:50%;transform:translate(-50%)}.cl-app .cl-vocab-loading{opacity:.6}.cl-app .cl-yt{aspect-ratio:16/9;background:#000;width:100%}.cl-app .cl-yt iframe{border:none;width:100%;height:100%;display:block}.cl-app .cl-yt-placeholder{border:2px dashed var(--cl-border);border-radius:0 0 var(--cl-radius) var(--cl-radius);aspect-ratio:16/9;color:#1a1a2e59;background:#1a1a2e0a;flex-direction:column;justify-content:center;align-items:center;gap:8px;font-size:13px;display:flex}.cl-app .cl-yt-placeholder-icon{opacity:.5;font-size:28px}.cl-app .cl-community{border-top:1px solid var(--cl-border);padding:48px 0 80px}.cl-app .cl-community h2{margin-bottom:8px;font-size:28px}.cl-app .cl-community-sub{color:#666;margin-bottom:32px;font-size:15px}.cl-app .cl-community-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;margin-bottom:40px;display:grid}.cl-app .cl-post{border-radius:var(--cl-radius-sm);box-shadow:var(--cl-shadow);background:var(--cl-card);overflow:hidden}.cl-app .cl-post-img{aspect-ratio:1;object-fit:cover;width:100%}.cl-app .cl-post-body{padding:12px}.cl-app .cl-post-name{margin-bottom:3px;font-size:13px;font-weight:700}.cl-app .cl-post-caption{color:#666;font-size:12px;line-height:1.4}.cl-app .cl-community-empty{text-align:center;color:#1a1a2e59;padding:48px 20px;font-size:15px}.cl-app .cl-community-empty-icon{margin-bottom:12px;font-size:40px}.cl-app .cl-upload-box{background:var(--cl-card);border-radius:var(--cl-radius);box-shadow:var(--cl-shadow);padding:32px}.cl-app .cl-upload-box h3{font-size:20px;font-family:var(--cl-font-d);margin-bottom:20px}.cl-app .cl-upload-form{flex-direction:column;gap:14px;display:flex}.cl-app .cl-drop{border:2px dashed var(--cl-border);border-radius:var(--cl-radius-sm);text-align:center;cursor:pointer;color:#666;padding:32px 20px;font-size:14px;transition:border-color .15s,background .15s}.cl-app .cl-drop:hover{border-color:var(--cl-red);background:#c8371a05}.cl-app .cl-drop.has-file{border-color:var(--cl-green);background:#2d501608}.cl-app .cl-drop-icon{margin-bottom:8px;font-size:28px}.cl-app .cl-preview{object-fit:cover;border-radius:var(--cl-radius-sm);width:100%;max-height:200px;margin-top:8px}.cl-app .cl-input{border:1.5px solid var(--cl-border);border-radius:var(--cl-radius-sm);width:100%;font-family:var(--cl-font-b);background:var(--cl-cream);outline:none;padding:12px 14px;font-size:14px;transition:border-color .15s}.cl-app .cl-input:focus{border-color:var(--cl-red)}.cl-app .cl-submit{background:var(--cl-red);color:#fff;border-radius:var(--cl-radius-sm);border:none;padding:14px 24px;font-size:15px;font-weight:700;transition:background .15s,transform .1s}.cl-app .cl-submit:hover:not(:disabled){background:#a82d14;transform:translateY(-1px)}.cl-app .cl-submit:disabled{opacity:.6;cursor:not-allowed}.cl-app .cl-upload-ok{color:var(--cl-green);border-radius:var(--cl-radius-sm);text-align:center;background:#2d501614;padding:12px 16px;font-size:14px;font-weight:600}.cl-app .cl-footer{text-align:center;border-top:1px solid var(--cl-border);color:#1a1a2e73;margin-top:auto;padding:32px 20px;font-size:13px}.cl-app .cl-footer a{color:var(--cl-red)}.cl-app .cl-footer a:hover{text-decoration:underline}@media (max-width:600px){.cl-app .cl-lang-grid{gap:10px}.cl-app .cl-lang-card{padding:20px 10px}.cl-app .cl-how-grid,.cl-app .cl-recipe-grid{grid-template-columns:1fr}.cl-app .cl-community-grid{grid-template-columns:repeat(2,1fr)}.cl-app .cl-upload-box{padding:20px}.cl-app .cl-recipe-hero{height:260px}.cl-app .cl-cover-img{height:160px}}
