:root{--bg:#111821;--panel:#1e2935;--panel2:#243241;--line:#3a4e5e;--text:#f4f8fd;--muted:#a7bbcc;--gold:#ffbd63;--aqua:#61cceb;--mint:#77dcc6;--red:#f98583;--r:21px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:radial-gradient(ellipse 980px 420px at 55% -9%,#294457,transparent),var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;line-height:1.45}[hidden]{display:none!important}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}button:focus-visible,input:focus-visible,label.dropzone:focus-within{outline:3px solid var(--mint);outline-offset:3px}.shell{max-width:1270px;padding:16px 20px 35px;margin:auto}.topbar,.brand,.top-actions,.tabs,.sectionhead,.program-toolbar{display:flex;align-items:center;gap:15px}.topbar{justify-content:space-between;flex-wrap:wrap;padding:9px 4px 20px}.brandmark{background:linear-gradient(125deg,#ffc96e,#e3982e);width:49px;height:49px;display:grid;place-items:center;border-radius:14px;color:#142638;font-size:26px;font-weight:1000;box-shadow:0 2px 28px #ecaa5a3a}.brand strong{display:block;font-weight:900;letter-spacing:2px;font-size:23px}.brand span{display:block;color:var(--muted);font-size:11px;letter-spacing:1.7px}.top-actions{flex-wrap:wrap}.env,.tier,.count,.badge-off,.badge-soon{border-radius:30px;padding:9px 15px;background:#26333e;border:1px solid #455665;font-size:12px;font-weight:800;letter-spacing:.25px}.env{color:#92e3cf}.led{width:8px;height:8px;background:#76dfca;border-radius:50%;display:inline-block;margin-right:7px}.tier b{color:var(--gold)}.notice{background:linear-gradient(100deg,#3f3421,#282d34);border:1px solid #8c6d40;border-radius:15px;display:flex;gap:15px;align-items:center;padding:11px 15px;color:#f7d49e;font-size:12px}.notice b{white-space:nowrap}.notice span{color:#dccdb9}.tabs{border-bottom:1px solid #4d627955;gap:9px;padding:19px 0 17px;overflow-x:auto;scrollbar-width:thin;scrollbar-color:#546879 transparent}.tab{white-space:nowrap;border:1px solid #3e5466;border-radius:13px;color:#d1e0ed;background:#253542;padding:12px 17px;font-size:14px;font-weight:800;transition:.18s}.tab:hover{border-color:var(--aqua);transform:translateY(-1px)}.tab.on{border-color:#72daf9;background:linear-gradient(130deg,#267d9d,#205c7d);color:#fff;box-shadow:0 8px 25px #2687b02f}.view{animation:fade .16s ease-out}@keyframes fade{from{opacity:.5;transform:translateY(3px)}to{opacity:1;transform:none}}.sectionhead{align-items:flex-start;justify-content:space-between;flex-wrap:wrap;padding:19px 0 24px}.overline{color:var(--mint);font-size:11px;font-weight:900;letter-spacing:2.1px}.sectionhead h1{margin:6px 0 8px;font-size:clamp(31px,4vw,45px);line-height:1.12;letter-spacing:-1.2px}.sectionhead p{color:var(--muted);margin:0;max-width:710px}.badge-off{color:#f0a6a6;border-color:#af5e6677}.badge-soon{color:var(--gold);border-color:#daa24f77}.metrics{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.metric{border:1px solid #486078;border-radius:22px;min-height:183px;padding:22px 24px;position:relative;overflow:hidden;background:linear-gradient(138deg,#2b3949,#1d2936 65%);box-shadow:0 17px 35px #0002,inset 0 1px #fff1}.metric:after{content:'°';position:absolute;right:-8px;top:-27px;font-size:174px;font-weight:900;color:#788e9f0e;pointer-events:none}.metric .eyebrow{color:#d1ddeb;letter-spacing:2px;font-size:12px;font-weight:900}.temperature{font-size:clamp(55px,6vw,82px);font-weight:900;line-height:1.2;margin-top:11px;letter-spacing:-4px}.temperature small{font-size:25px;letter-spacing:0}.gold .temperature{color:var(--gold)}.cyan .temperature{color:var(--aqua)}.metric .value{margin-top:23px;font-size:clamp(21px,2.3vw,29px);font-weight:900}.metric.green .value{color:var(--mint)}.metric.red .value{color:var(--red)}.metric p{color:var(--muted);font-size:14px;margin:6px 0}.home-row{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:16px}.tile,.stage-explainer,.program-detail,.empty-large{border:1px solid #455c71;background:linear-gradient(140deg,#263645,#1c2936);border-radius:23px;padding:24px}.tile{min-height:196px}.tile-icon,.round-icon{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:14px;background:#254e61;color:#8cdeed;font-size:24px}.tile h2{margin:11px 0;font-size:22px}.tile p,.tile small{color:var(--muted)}.tile p{margin:5px 0 18px}.primary,.secondary{border:1px solid transparent;border-radius:13px;background:linear-gradient(120deg,#2485a3,#226a8a);color:#fff;padding:12px 17px;font-size:13px;font-weight:900;letter-spacing:.4px;box-shadow:0 9px 18px #102e3f44}.primary:hover,.secondary:hover{filter:brightness(1.12)}.secondary{background:#293e4e;border-color:#4e6777}.safetyline{background:#1f313c;border:1px solid #435e6e;border-radius:13px;padding:13px 17px;font-size:13px;color:#b9d2df;margin:18px 0}.count{color:var(--mint)}.category-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.category{min-height:134px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;text-align:left;border:1px solid #586c7b;border-radius:21px;padding:18px;color:var(--text);background:linear-gradient(155deg,#314454,#253342);position:relative;overflow:hidden;transition:.18s}.category:hover{transform:translateY(-3px);border-color:#94dce7}.category.on{box-shadow:0 0 0 2px #72c7dd90 inset;border-color:#6cc5e8}.category .glyph{font-size:32px;line-height:1.1}.category strong{font-size:18px;margin-top:7px;letter-spacing:.4px}.category small{color:#bdd2df}.category.gold{background:linear-gradient(130deg,#7b5133,#423b35)}.category.cyan{background:linear-gradient(130deg,#245e73,#274151)}.category.mint{background:linear-gradient(130deg,#35614d,#253e3a)}.category.violet{background:linear-gradient(130deg,#654e82,#3a354f)}.category.rose{background:linear-gradient(130deg,#845459,#42393e)}.category.special{background:linear-gradient(130deg,#85642e,#443b30)}.category.dim{background:linear-gradient(130deg,#3d4654,#27323c)}.program-toolbar{justify-content:space-between;flex-wrap:wrap;margin:27px 0 13px}.crumb{font-size:15px;font-weight:900;color:var(--gold)}.search{border:1px solid #425d70;border-radius:12px;display:flex;align-items:center;background:#253340;padding-left:13px}.search span{font-size:24px;color:var(--aqua)}.search input{padding:10px 11px;max-width:250px;border:0;outline:0;background:transparent;color:var(--text)}.program-list{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.program{border-radius:17px;padding:18px;text-align:left;background:linear-gradient(145deg,#273e4c,#202f3c);border:1px solid #4b6578;color:var(--text);min-height:115px}.program:hover{border-color:var(--mint)}.program.selected{border-color:var(--gold);background:linear-gradient(145deg,#534831,#263341)}.program strong{display:block;font-size:18px}.program span{display:block;margin-top:7px;color:var(--muted);font-size:13px}.empty{grid-column:1/-1;border:1px dashed #4a6275;border-radius:19px;color:#b4c7d7;padding:32px;text-align:center}.program-detail{margin-top:16px;border-color:#c29b4e;box-shadow:0 14px 50px #0003}.detail-top{display:flex;justify-content:space-between;align-items:flex-start;gap:13px;flex-wrap:wrap}.detail-top h2{font-size:29px;margin:4px 0}.detail-top small{color:var(--gold);font-size:11px;letter-spacing:1.3px}.detail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0}.detail-val{background:#1b2935;border:1px solid #455e6e;border-radius:14px;padding:14px}.detail-val b{display:block;color:var(--muted);font-size:12px;letter-spacing:1px}.detail-val strong{font-size:32px;color:var(--gold);display:block;margin-top:6px}.detail-grid .detail-val:nth-child(2) strong{color:var(--mint)}.detail-grid .detail-val:nth-child(3) strong{color:var(--aqua)}.detail-note{color:#adc3d2;font-size:13px}.stage-explainer{margin-top:18px}.stage-explainer h2{margin:0 0 16px}.stage-explainer p{color:#a9bbca;font-size:13px}.stage-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.stage-flow>span{display:none}.stage-flow>div{min-height:115px;padding:15px;border-radius:13px;background:#1c2d3a;border:1px solid #445c70}.stage-flow b{font-size:14px;color:var(--gold)}.stage-flow strong,.stage-flow small{display:block;margin-top:5px}.stage-flow small{color:var(--muted);font-size:12px}.recipe-intro{display:grid;grid-template-columns:1.4fr 1fr;gap:16px}.recipe-intro>div{border:1px solid #4a6173;border-radius:20px;background:linear-gradient(130deg,#273d4b,#212c38);padding:26px}.recipe-intro h2{font-size:27px}.recipe-intro p{color:#b5c8d8;max-width:570px}.recipe-steps>div{display:grid;grid-template-columns:36px 1fr;gap:0 8px;margin-bottom:12px}.recipe-steps span{grid-row:1/3;color:var(--mint);font-weight:1000}.recipe-steps small{color:var(--muted)}.subheading{margin:28px 0 14px}.recipe-preview-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.teaser{background:#233541;border:1px solid #50667a;border-radius:18px;overflow:hidden;padding-bottom:17px}.teaser .visual{height:128px;display:grid;place-items:center;font-size:68px;color:#ffffff60;margin-bottom:14px}.v-meat{background:radial-gradient(circle at 40% 20%,#a36b5a,#563f42)}.v-fish{background:radial-gradient(circle at 40% 20%,#5bafbf,#325064)}.v-cheese{background:radial-gradient(circle at 40% 20%,#ddc68c,#68583c)}.teaser strong,.teaser small{display:block;margin:4px 18px}.teaser small{color:#9eacb9}.empty-large{text-align:center;padding:60px 22px}.empty-large h2{font-size:26px}.empty-large p{color:var(--muted)}.empty-icon{font-size:64px;color:var(--aqua)}.ai-layout{display:grid;grid-template-columns:1fr .84fr;gap:15px}.gold-text{color:var(--gold)}.dropzone{display:grid;place-items:center;margin:17px 0;border:2px dashed #5a8ca1;border-radius:20px;min-height:246px;text-align:center;background:#1c3342;color:#a7d7e6;cursor:pointer;padding:17px}.dropzone.dragging{border-color:var(--gold);background:#384138}.dropzone input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}.dropzone b,.dropzone small{display:block}.dropzone b{color:var(--text);font-size:20px}.dropzone small{font-size:13px;margin-top:9px}.dropzone img{max-width:100%;max-height:300px;object-fit:contain;border-radius:13px}.tip{color:#b7c9d7!important;font-size:12px}.qr-placeholder{min-height:244px;display:flex;align-items:center;justify-content:center;flex-direction:column;border:1px dashed #718b9b;border-radius:17px;background:#1b2c39}.qr-placeholder .squares{font-size:92px;color:#57788a;line-height:1}.qr-placeholder strong{margin-top:7px;color:#d8e5ef}.qr-placeholder small{color:#adc2d1}.settings-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}footer{padding:34px 10px 5px;text-align:center;color:#839cad;font-size:11px}footer b{color:#b8cdde}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#305062;color:white;padding:11px 18px;border-radius:13px;box-shadow:0 10px 40px #0006;font-size:14px;max-width:90vw}@media(max-width:900px){.category-grid{grid-template-columns:repeat(3,1fr)}.ai-layout,.recipe-intro{grid-template-columns:1fr}.program-list{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){.shell{padding:12px 12px 25px}.topbar{gap:9px}.brand strong{font-size:21px}.env,.tier{font-size:10px;padding:7px 9px}.notice{align-items:flex-start;flex-wrap:wrap;gap:4px}.tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;overflow:visible;padding:13px 0}.tab{font-size:11px;padding:10px 5px;white-space:normal;min-height:45px;line-height:1.15}.metrics,.home-row,.settings-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.metric{padding:15px;min-height:155px}.metric .eyebrow{font-size:10px;letter-spacing:1px}.metric .value{font-size:16px;margin-top:15px;word-break:break-word}.metric p{font-size:11px}.temperature{font-size:55px}.temperature small{font-size:20px}.tile{padding:17px}.tile h2{font-size:17px}.tile p{font-size:13px}.home-row .primary,.home-row .secondary{font-size:11px;padding:10px}.category-grid{grid-template-columns:repeat(2,1fr);gap:9px}.category{padding:15px;min-height:118px}.category .glyph{font-size:27px}.category strong{font-size:16px}.category small{font-size:11px}.program-list{grid-template-columns:1fr}.sectionhead{padding:19px 0}.search{width:100%}.search input{width:100%;max-width:none}.program-toolbar{gap:11px}.detail-grid{grid-template-columns:repeat(3,1fr);gap:7px}.detail-val{padding:9px}.detail-val b{font-size:10px}.detail-val strong{font-size:20px}.stage-flow{grid-template-columns:repeat(2,1fr);gap:8px}.stage-flow>div{padding:12px}.recipe-preview-grid{grid-template-columns:1fr}.top-actions{gap:7px}}
/* CLOUDAI 0.1.0-dev3 — isolated editor & recipe cards */
.recipe-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:20px}.recipe-card{border:1px solid #435968;border-radius:22px;overflow:hidden;background:linear-gradient(160deg,#273746,#1c2937);box-shadow:0 14px 25px #050d1322}.recipe-illustration{height:172px;display:flex;align-items:center;justify-content:center;flex-direction:column;font-size:75px;overflow:hidden;position:relative}.recipe-illustration:before{content:'';position:absolute;inset:-30px;background:radial-gradient(circle at 23% 20%,#ffffff38,transparent 32%),repeating-linear-gradient(-45deg,transparent,transparent 22px,#fff1 23px,transparent 24px)}.recipe-illustration span{position:relative;filter:drop-shadow(0 18px 12px #0006)}.recipe-illustration small{position:relative;font-size:10px;color:#fff9;letter-spacing:2px;text-transform:uppercase}.vis-meat{background:linear-gradient(115deg,#4e2d37,#a16c56)}.vis-sausage{background:linear-gradient(115deg,#5d2e39,#cf955e)}.vis-fish{background:linear-gradient(115deg,#1b5069,#64a7a4)}.vis-cheese{background:linear-gradient(115deg,#755823,#d9b954)}.vis-bird{background:linear-gradient(115deg,#68513b,#aa826a)}.recipe-photo{width:100%;height:172px;object-fit:cover;display:block}.recipe-card-body{padding:17px 19px 20px}.recipe-card h3{font-size:21px;margin:9px 0 6px}.recipe-card p{color:#b9cbd6;font-size:13px;min-height:58px}.recipe-cat{display:block;color:#91d0df;margin-top:9px;font-size:11px;letter-spacing:1px}.recbadge{font-size:10px;padding:5px 8px;border-radius:20px;letter-spacing:.5px;display:inline-flex;align-items:center;font-weight:900}.recbadge.source{color:#ffd99f;background:#6b5132}.recbadge.published{color:#aef3e3;background:#276451}.recbadge.draft{color:#bdcad7;background:#42556a}.card-buttons{display:flex;gap:9px;align-items:center;margin-top:12px}.card-buttons .primary{flex:1}.favorite-btn{border:1px solid #8b627b;background:#493b4c;color:#ffd4db;font-size:24px;line-height:1;width:46px;height:45px;border-radius:13px}.favorite-btn.chosen{background:#704d56;color:#ffc2c8}.recipe-tools{margin:17px 0 7px;display:flex;flex-wrap:wrap;gap:12px;align-items:center}.recipe-tools .search{flex:1;min-width:230px}.recipe-tools .search input{width:100%;max-width:none}.recipe-tools select,.editor-fields select,.editor-fields input,.editor-fields textarea,.login-bar input,.edit-panel input,.edit-panel textarea{color:#e4f2fb;background:#192d3b;border:1px solid #577184;border-radius:12px;font:inherit;padding:12px;width:100%}.recipe-check{display:flex;align-items:center;gap:9px;color:#c5d5df}.recipe-check input{width:auto!important}.account-tile{min-height:0;background:linear-gradient(120deg,#264950,#24313c);padding:19px}.account-tile>strong{color:#aef5d9;font-size:12px;letter-spacing:2px}.account-tile p{margin:6px 0 12px}.login-bar{display:flex;align-items:end;gap:10px;flex-wrap:wrap}.login-bar label{display:flex;flex-direction:column;gap:7px;flex:1;min-width:185px;color:#c8dbe5;font-size:12px;font-weight:900}.login-bar .primary{height:45px}.recipe-detail{border:1px solid #9b814f;border-radius:25px;margin-top:20px;padding:27px;background:linear-gradient(140deg,#303e4a,#1d2d39);box-shadow:0 16px 48px #0003}.recipe-detail h2{font-size:29px}.recipe-detail h3{color:#f7ce8b;margin-top:20px}.recipe-detail-layout{display:grid;grid-template-columns:.8fr 1.25fr;gap:25px;margin-top:18px}.recipe-detail-layout>.recipe-photo,.recipe-detail-layout .recipe-illustration{border-radius:17px;height:260px}.recipe-detail-layout p,.recipe-detail-layout li{color:#d1dfec}.recipe-detail-layout li{margin:10px 0}.recipe-detail-layout ul,.recipe-detail-layout ol{padding-left:25px}.recipe-stage{display:grid;grid-template-columns:32px 1fr;gap:10px;border-radius:13px;padding:12px;background:#1b3240;border:1px solid #425a6a;margin-bottom:8px}.recipe-stage strong{color:#88e1d6}.recipe-stage p{margin:3px 0!important;font-size:13px}.recipe-stage small{color:#aac2d2}.step-n{display:grid;place-items:center;border:1px solid #b99a61;background:#554832;border-radius:50%;width:29px;height:29px;color:#f7d494;font-weight:900;font-size:12px}.recipe-warning{background:#4e3a2e;border:1px solid #8d634c;border-radius:14px;padding:15px;margin:18px 0}.recipe-warning p{margin:5px 0 8px}.recipe-warning small{color:#f0cebc}.rec-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;color:#bed0db}.rec-footer a,.safetyline a{color:#8bdfff;text-underline-offset:3px}.rec-actions{display:flex;gap:8px;flex-wrap:wrap}.edit-panel{margin-top:17px}.editor-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.editor-fields>label,.edit-panel form>label{display:block;color:#d3e0eb;font-size:12px;font-weight:900}.editor-fields>label input,.editor-fields>label select,.editor-fields>label textarea{display:block;margin-top:8px}.editor-fields>label:has(textarea),.editor-fields>h3,.editor-fields>.form-actions,.editor-fields>div[id$="Stages"],.editor-fields>button{grid-column:1/-1}.stage-edit{display:grid;grid-template-columns:1.1fr repeat(3,.65fr) auto;gap:9px;border:1px solid #49677c;background:#1d2f3a;border-radius:14px;margin:9px 0;padding:12px}.stage-edit label{font-size:10px;letter-spacing:.5px;color:#9ab6c6}.stage-edit input,.stage-edit select{width:100%;margin-top:5px;min-width:0}.stage-edit .stage-wide{grid-column:1 / -2}.stage-edit .stage-remove{align-self:end;padding:10px}.form-actions{display:flex;gap:10px;flex-wrap:wrap}.edit-panel form .recipe-check{margin:15px 0}.edit-panel form .recipe-check input{margin-right:9px}.edit-panel h2{margin-top:0}#adminExisting{max-width:570px}#myGrid .tile{min-height:180px}@media(max-width:1050px){.recipe-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:710px){.recipe-grid,.recipe-detail-layout,.editor-fields{grid-template-columns:1fr}.stage-edit{grid-template-columns:repeat(2,minmax(0,1fr))}.stage-edit .stage-wide{grid-column:1/-1}.recipe-tools .search{min-width:100%}.recipe-detail{padding:16px}.login-bar label{min-width:100%}.tabs{grid-template-columns:repeat(3,minmax(0,1fr))}}


/* CLOUDAI dev4 — profesjonalny układ biblioteki przepisów */
.recipe-hero{display:grid;grid-template-columns:1.3fr .9fr;gap:20px;padding:26px 28px;border:1px solid #456277;border-radius:28px;background:linear-gradient(140deg,#163042 0%,#162636 45%,#1d2934 100%);box-shadow:0 18px 55px rgba(0,0,0,.24), inset 0 1px rgba(255,255,255,.05);overflow:hidden;position:relative}
.recipe-hero:before{content:'';position:absolute;inset:auto auto -60px -60px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(96,203,235,.18),transparent 70%)}
.recipe-hero:after{content:'';position:absolute;top:-80px;right:-40px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(255,189,99,.14),transparent 68%)}
.recipe-hero-copy,.recipe-hero-cards{position:relative;z-index:1}
.hero-kicker{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:rgba(93,198,232,.12);border:1px solid rgba(123,207,232,.35);color:#9fe7f7;font-size:11px;font-weight:900;letter-spacing:1.6px;text-transform:uppercase}
.recipe-hero h2{margin:16px 0 12px;font-size:clamp(28px,3vw,40px);line-height:1.08;letter-spacing:-1.1px;max-width:700px}
.recipe-hero p{margin:0;color:#c0d4e2;max-width:700px;font-size:15px}
.hero-bullets{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.hero-bullets span,.recipe-meta span,.detail-hero-meta span,.mini-chip{display:inline-flex;align-items:center;justify-content:center;padding:8px 12px;border-radius:999px;background:rgba(19,35,48,.78);border:1px solid rgba(100,130,151,.55);color:#d6e5f1;font-size:12px;font-weight:800}
.recipe-hero-cards{display:grid;grid-template-columns:1fr;gap:12px;align-content:center}
.recipe-hero-cards article{padding:18px 18px 16px;border-radius:22px;background:linear-gradient(160deg,rgba(37,55,71,.9),rgba(23,34,45,.9));border:1px solid rgba(103,132,154,.48);box-shadow:inset 0 1px rgba(255,255,255,.03)}
.recipe-hero-cards strong{display:block;font-size:32px;line-height:1;color:#fff;margin-bottom:5px}
.recipe-hero-cards span{color:#b7cad8;font-size:13px}
.recipe-tools{margin:22px 0 8px;display:grid;grid-template-columns:minmax(0,1fr) 220px auto;gap:14px;align-items:center}
.recipe-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:24px}
.recipe-card{position:relative;overflow:hidden;border-radius:28px;border:1px solid rgba(83,111,130,.72);background:linear-gradient(180deg,rgba(25,39,52,.96) 0%,rgba(18,29,39,.98) 100%);box-shadow:0 14px 34px rgba(2,8,14,.28);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.recipe-card:hover{transform:translateY(-4px);border-color:#7dd8f1;box-shadow:0 24px 46px rgba(2,8,14,.36)}
.recipe-card-body{padding:18px 20px 20px}
.recipe-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-top:-2px}
.recipe-card h3{font-size:24px;line-height:1.15;margin:12px 0 10px;letter-spacing:-.5px}
.recipe-card p{margin:0;color:#b7cad7;font-size:14px;line-height:1.55;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;min-height:64px}
.recipe-photo,.recipe-illustration{width:100%;height:228px;display:block;object-fit:cover}
.recipe-visual-wrap{position:relative}.recipe-visual-wrap .recipe-visual-overlay{position:absolute;left:18px;top:18px;z-index:2}
.recipe-illustration{position:relative;display:flex;align-items:flex-end;justify-content:flex-start;padding:20px}
.recipe-illustration:before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.04),transparent 45%,rgba(4,8,12,.42) 100%),radial-gradient(circle at 20% 15%,rgba(255,255,255,.26),transparent 28%)}
.recipe-illustration span{position:relative;z-index:1;font-size:74px;filter:drop-shadow(0 12px 16px rgba(0,0,0,.38))}
.recipe-illustration small{display:none}
.recipe-visual-overlay{position:absolute;left:18px;top:18px;z-index:2;display:flex;gap:8px;flex-wrap:wrap}
.recipe-cat{display:inline-flex;align-items:center;gap:8px;color:#9bdced;font-size:11px;font-weight:900;letter-spacing:1.3px;text-transform:uppercase}
.recipe-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.recipe-meta span{background:#1a2a37;border-color:#314757;color:#c9d7e3}
.recbadge{font-size:10px;padding:7px 10px;border-radius:999px;letter-spacing:.8px;display:inline-flex;align-items:center;font-weight:900;text-transform:uppercase}
.recbadge.source{color:#dff6ff;background:rgba(45,118,145,.82);border:1px solid rgba(118,214,245,.35)}
.recbadge.published{color:#d7ffef;background:rgba(34,119,92,.9);border:1px solid rgba(100,224,187,.36)}
.recbadge.draft{color:#eef7ff;background:rgba(88,108,124,.82);border:1px solid rgba(167,188,205,.28)}
.card-buttons{display:flex;gap:10px;align-items:center;margin-top:18px}
.card-buttons .primary{flex:1;min-height:46px;border-radius:16px}
.favorite-btn{width:48px;height:46px;border-radius:16px;border:1px solid rgba(171,119,137,.42);background:#3c3140;color:#ffd8df;font-size:24px}
.favorite-btn.chosen{background:#70434e}
.recipe-detail{border:1px solid rgba(123,161,187,.38);border-radius:30px;margin-top:30px;padding:0;background:linear-gradient(180deg,#1f303f 0%,#172632 100%);box-shadow:0 22px 60px rgba(0,0,0,.30);overflow:hidden}
.detail-top{padding:28px 28px 14px}
.detail-top h2{font-size:clamp(30px,3.5vw,42px);margin:8px 0 0;letter-spacing:-1px;line-height:1.06}
.detail-hero-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.recipe-detail-layout{display:grid;grid-template-columns:.88fr 1.12fr;gap:0;padding:0}
.recipe-detail-layout>div{padding:0 28px 28px}
.recipe-detail-layout>div:first-child{padding-bottom:28px}
.recipe-detail-layout .recipe-photo,.recipe-detail-layout .recipe-illustration{height:320px;border-radius:0 0 24px 24px;margin:0 -28px 22px}
.recipe-detail h3{margin:20px 0 12px;color:#ffd39b;font-size:18px;letter-spacing:.2px}
.recipe-detail p,.recipe-detail li{color:#d1dfec}
.recipe-detail ul,.recipe-detail ol{padding-left:20px;margin-top:0}
.recipe-stage{display:grid;grid-template-columns:40px 1fr;gap:14px;border-radius:16px;padding:15px;background:linear-gradient(180deg,#1b3240,#182a36);border:1px solid #35586d;margin-bottom:10px}
.step-n{width:34px;height:34px;font-size:13px}
.recipe-warning{margin:0 28px 24px;border-radius:18px;background:linear-gradient(180deg,#4e382d,#392c25);border:1px solid #8e684a;padding:16px 18px}
.recipe-warning strong{display:block;margin-bottom:6px;color:#ffe2bc}
.recipe-warning p{margin:0;color:#f3dac5}
.rec-footer{padding:0 28px 28px;display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;color:#bfd0dd}
.rec-footer .helper{color:#9eb6c8;font-size:13px;max-width:640px}
.account-tile{min-height:0;background:linear-gradient(140deg,#243f51,#1c2e3a);padding:21px;border-radius:24px}
.account-tile p{margin-top:8px}
#myGrid .tile{min-height:190px;border-radius:24px}
#myGrid .tile small{display:block;margin-top:10px}
@media(max-width:1100px){.recipe-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.recipe-hero{grid-template-columns:1fr}.recipe-tools{grid-template-columns:1fr 220px auto}}
@media(max-width:720px){.recipe-grid,.recipe-detail-layout{grid-template-columns:1fr}.recipe-tools{grid-template-columns:1fr}.recipe-hero{padding:22px 18px}.recipe-hero h2{font-size:30px}.recipe-detail{border-radius:24px}.detail-top,.recipe-detail-layout>div,.rec-footer,.recipe-warning{padding-left:18px;padding-right:18px;margin-left:0;margin-right:0}.recipe-detail-layout .recipe-photo,.recipe-detail-layout .recipe-illustration{height:230px;margin:0 -18px 18px}.card-buttons{align-items:stretch}.favorite-btn{width:46px;min-width:46px;height:auto}.recipe-card h3{font-size:22px}}

/* CLOUDAI dev4 — culinary photography and refined hero */
.recipe-hero{grid-template-columns:1fr .88fr;gap:16px;min-height:360px;padding:24px;border-color:rgba(132,165,185,.45);background:linear-gradient(135deg,#1d3242,#182630 62%,#252b32)}
.recipe-hero-copy{padding:22px 14px 22px 8px;align-self:center}
.recipe-hero h2{max-width:580px;font-size:clamp(31px,3.6vw,46px);line-height:1.08;letter-spacing:-1.4px}
.recipe-hero-photo{min-height:310px;border-radius:23px;background:linear-gradient(180deg,rgba(11,16,20,.03) 20%,rgba(11,16,20,.82) 100%),url('recipes/pub-01.webp') center/cover no-repeat;position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;padding:27px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 20px 40px rgba(4,11,18,.3)}
.hero-photo-overline{color:#f0e0c8;font-size:11px;letter-spacing:1.65px;font-weight:900}
.hero-photo-title{font-size:26px;line-height:1.1;letter-spacing:-.8px;font-weight:900;margin:7px 0;color:#fff;text-shadow:0 2px 18px #000}
.hero-photo-caption{color:#f2d4ae;font-size:13px;font-weight:700}
.recipe-card .recipe-visual-wrap{position:relative}
.recipe-card .recipe-visual-wrap>.recipe-photo{display:block;height:235px;width:100%;object-fit:cover}
.recipe-card:hover .recipe-photo{filter:saturate(1.09) contrast(1.025)}
.recipe-card-head{min-height:16px;align-items:center}
.recipe-card .recipe-meta span{font-size:11px;padding:7px 10px;white-space:nowrap}
.recipe-card .recipe-photo{border-bottom:1px solid rgba(167,202,219,.15)}
.recipe-card .card-buttons .primary{letter-spacing:.1px;background:linear-gradient(110deg,#3189a5,#247a99)}
.recipe-detail .recipe-photo{display:block;object-fit:cover;width:calc(100% + 56px)}
.recipe-detail .recipe-photo~h3{margin-top:20px}
@media(max-width:1100px){.recipe-hero{grid-template-columns:1fr 1fr}}
@media(max-width:820px){.recipe-hero{grid-template-columns:1fr}.recipe-hero-photo{min-height:270px}.recipe-hero-copy{padding:12px 4px}}
@media(max-width:650px){.recipe-hero{padding:16px}.recipe-hero h2{font-size:30px}.recipe-hero-photo{min-height:220px;padding:18px}.recipe-card .recipe-visual-wrap>.recipe-photo{height:208px}}

/* Process status remains visible across every view. */
.process-notice{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;padding:14px 18px;margin:14px 0;border:1px solid #456373;border-radius:14px;background:#112632;color:#e4f1f7}.process-notice p{flex:1 1 360px;margin:0;line-height:1.5}.process-notice[data-state="running"]{border-color:#ffc36b}.process-notice[data-state="unknown"],.process-notice[data-state="fault"]{border-color:#ed9d82}.photo-guide{padding:16px;border-left:3px solid #58d9ec;background:#102833;border-radius:8px;margin:16px 0;line-height:1.6}.photo-guide strong{display:block;color:#fff}.photo-guide p{margin:8px 0}.top-actions{flex-wrap:wrap}.top-actions a{white-space:normal}@media(max-width:600px){.topbar{flex-wrap:wrap}.process-notice{padding:12px}.process-notice button{width:100%}}

.journey-dialog{max-width:560px;width:calc(100% - 30px);background:#112632;color:#eef8ff;border:1px solid #58d9ec;border-radius:16px;padding:22px}.journey-dialog::backdrop{background:#000b}.journey-dialog textarea{width:100%}.photo-slots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.photo-slot{border:1px solid #456373;padding:14px;border-radius:12px}.photo-slot img{width:100%;max-height:180px;object-fit:contain}.photo-slot input{width:100%;max-width:100%}.photo-slot label{display:block;font-weight:bold;margin-bottom:10px}.process-notice{position:relative}.process-notice #processStop{background:#a53030;color:white;min-width:120px}.process-notice #processCommand,.process-notice #startReadiness{flex-basis:100%}#resumeProcess{margin-bottom:14px}@media(max-width:600px){.photo-slots{grid-template-columns:1fr}}

.chart-probe-0{color:#58d9ec}.chart-probe-1{color:#ffc36b}.chart-probe-2{color:#a8e387}.chart-probe-3{color:#df99ff}.chart-probe-4{color:#ff8d8d}.chart-probe-5{color:#a8b3ff}

/* dev19: pending steps remain visible across all views. */
.process-pending{padding:16px;border:2px solid #ffc36b;border-radius:12px;background:#322915;margin:12px 0}.process-pending button{margin:6px 12px 6px 0;min-height:48px}.process-notice[data-state="await_confirm"]{border-color:#ffc36b}#processState{font-size:1.15rem}#packageStatus{display:flex;flex-wrap:wrap;gap:12px 24px}#equipmentModel,#equipmentMaker{min-height:48px;max-width:100%}

.pv-title h1{margin:0 0 8px;font-size:clamp(25px,4vw,38px)}.pv-title h2{margin:4px 0}.pv-title p{margin:5px 0}.pv-title small{color:#b8d1de}.pv-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0}.pv-card{padding:18px;border:1px solid #426070;border-radius:16px;background:#152a36;color:#f3f8fc;min-width:0}.pv-card>small{font-weight:800;font-size:12px;letter-spacing:.7px}.pv-card>strong{display:block;font-size:clamp(22px,3vw,33px);margin:12px 0;color:#ffcf82;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}.pv-card p{color:#c3d7e3;margin-bottom:0}.pv-timeline{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.pv-timeline span{padding:8px 12px;border:1px solid #46606d;border-radius:20px;color:#bac8d1}.pv-timeline .done{color:#77e2b5}.pv-timeline .current{background:#176578;border-color:#79d8e1;color:white;font-weight:bold}.pv-actions{display:flex;flex-wrap:wrap;gap:12px;margin:16px 0}.pv-actions button{min-height:50px}.pv-guide{display:grid;gap:12px}.pv-guide>h1,.pv-guide>p{margin:0}.pv-checks{padding:16px;border:1px solid #608172;border-radius:12px;margin:12px 0}@media(max-width:700px){.pv-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pv-card{padding:13px}.pv-card>strong{font-size:23px}}@media(max-width:390px){.pv-grid{grid-template-columns:1fr}}

nav.tabs,.device>.nav,main>nav.nav{display:grid!important;grid-auto-flow:column;grid-template-rows:repeat(2,auto);grid-template-columns:none!important;grid-auto-columns:minmax(140px,1fr);overflow-x:auto;gap:8px;padding-bottom:12px}nav.tabs button,.device>.nav button,main>nav.nav button{white-space:normal;min-height:46px}
