/* v28 Visual Service Board — image-led overlay on the v27 operating model */
:root{--visualDark:#071c15;--visualDeep:#0c2b21;--visualGold:#d8ff73;--visualCream:#f8fbf9;--visualInk:#10231d;--visualLine:#d3e3dc}
body{background:radial-gradient(circle at 80% -10%,#225c49 0,transparent 35%),linear-gradient(140deg,#06130f 0,#0d3025 62%,#081c16 100%)}
.main{max-width:1840px;width:100%;margin:0 auto}.top{align-items:center}.top h2{letter-spacing:-.025em}.top p{font-size:14px}.version{box-shadow:0 0 0 1px rgba(202,255,88,.08),0 8px 30px rgba(0,0,0,.2)}
.visualSectionHead{display:flex;align-items:center;justify-content:space-between;gap:16px;background:linear-gradient(120deg,#0d2c22,#154b3a);border:1px solid rgba(202,255,88,.23);color:#fff;padding:18px 20px;border-radius:20px;box-shadow:var(--shadow)}.visualSectionHead h3{font-size:23px;margin:3px 0 0}.visualSectionHead .eyebrow{color:#c5e8d9}.visualSearch{padding:10px 12px;border:1px solid rgba(255,255,255,.2);border-radius:12px;min-width:280px;background:#fff;color:var(--visualInk)}
.homeLeadGrid{grid-template-columns:minmax(0,1.42fr) minmax(330px,.58fr)}
.visualHero{min-height:280px;position:relative;border-radius:22px;overflow:hidden;background-size:cover;background-position:center;box-shadow:var(--shadow);border:1px solid rgba(255,255,255,.13)}.visualHero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,19,14,.94) 0%,rgba(4,19,14,.76) 43%,rgba(4,19,14,.16) 82%),linear-gradient(0deg,rgba(2,15,10,.42),transparent 55%)}.visualHeroContent{position:relative;z-index:1;padding:28px;max-width:780px;color:#fff}.visualHeroContent h2{font-size:38px;line-height:1.02;margin:6px 0 10px;letter-spacing:-.035em}.visualHeroContent p{font-size:16px;line-height:1.5;color:#d7ebe2}.visualHeroStats{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.visualHeroStat{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(9px);border-radius:14px;padding:10px 13px;min-width:130px}.visualHeroStat strong{display:block;font-size:19px}.visualHeroStat span{font-size:11px;color:#d5ebe1}.visualHeroActions{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.visualMetric{min-height:142px;overflow:hidden}.visualMetricIcon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(135deg,#e8f7ef,#cbf0de);font-size:23px;margin-bottom:12px}.visualMetric .metric{font-size:31px}.visualMetric .metricLabel{line-height:1.3}.visualMetric:hover .visualMetricIcon{transform:scale(1.06)}
.todayVisual{min-height:330px;position:relative;overflow:hidden;border-radius:20px;background-size:cover;background-position:center;box-shadow:var(--shadow);cursor:pointer}.todayVisual:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,21,16,.95),rgba(6,21,16,.78) 50%,rgba(6,21,16,.22))}.todayVisualBody{position:relative;z-index:1;color:#fff;padding:24px;max-width:680px}.todayVisualBody h3{font-size:30px;line-height:1.08;margin:7px 0}.todayVisualBody p{color:#d4e9e0;font-size:14px;line-height:1.5}.todayVisualRoute{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:16px}.todayVisualRoute>div{background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.16);padding:11px;border-radius:13px;backdrop-filter:blur(8px)}.todayVisualRoute span{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#b9d8ca}.todayVisualRoute strong{font-size:13px}.todayVisual .progress{background:rgba(255,255,255,.18)}
.visualCalendarCard{min-height:330px}.calendarPreview{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin-top:10px}.calendarPreviewDay{min-height:88px;border:1px solid var(--line);border-radius:12px;padding:7px;background:#f9fcfa;cursor:pointer}.calendarPreviewDay.today{border-color:#0d9d5c;box-shadow:inset 0 0 0 1px #0d9d5c}.calendarPreviewDay .dayNum{font-size:17px;font-weight:900}.calendarPreviewDay .dayName{font-size:9px;text-transform:uppercase;color:var(--muted)}.calendarPreviewDot{height:5px;border-radius:99px;background:var(--green);margin-top:5px}.calendarPreviewThumb{width:100%;aspect-ratio:16/8;object-fit:cover;border-radius:7px;margin-top:5px}
.recipeVisualCard{position:relative;min-height:330px;border-radius:18px;overflow:hidden;background-size:cover;background-position:center;cursor:pointer;border:1px solid rgba(0,0,0,.07);box-shadow:0 12px 34px rgba(5,25,18,.18);transition:.18s ease}.recipeVisualCard:hover{transform:translateY(-4px);box-shadow:0 20px 48px rgba(4,24,17,.25)}.recipeVisualCard:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(4,18,13,.98) 0%,rgba(4,18,13,.78) 48%,rgba(4,18,13,.12) 85%)}.recipeVisualCard.attract{box-shadow:inset 0 4px 0 var(--purple),0 12px 34px rgba(5,25,18,.18)}.recipeVisualCard.prove{box-shadow:inset 0 4px 0 var(--blue),0 12px 34px rgba(5,25,18,.18)}.recipeVisualCard.convert{box-shadow:inset 0 4px 0 var(--green),0 12px 34px rgba(5,25,18,.18)}.recipeVisualBody{position:absolute;inset:auto 0 0;padding:18px;color:#fff}.recipeVisualBody h3{font-size:22px;line-height:1.08;margin:7px 0}.recipeVisualBody p{color:#d8e9e2;font-size:12px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.recipeProgressBadge{position:absolute;top:13px;right:13px;width:54px;height:54px;border-radius:50%;background:rgba(3,20,14,.76);border:4px solid rgba(202,255,88,.85);display:grid;place-items:center;color:#fff;font-weight:900;backdrop-filter:blur(6px)}.recipeVisualMeta{display:flex;gap:6px;flex-wrap:wrap}.recipeVisualMeta span{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);padding:5px 7px;border-radius:999px;font-size:10px}.recipeNextVisual{border-left:3px solid #87f6b9;padding-left:10px;margin-top:9px}.recipeNextVisual small{color:#a9cfc0;display:block}.recipeNextVisual strong{font-size:12px}
.visualRail{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:10px}.railVisualItem{min-height:104px;border:1px solid var(--line);border-radius:14px;background:#fbfdfc;padding:10px;cursor:pointer;position:relative}.railVisualItem.active{background:linear-gradient(145deg,#ebfff4,#f8fcfa);border-color:#9ed5b9}.railVisualIcon{font-size:24px}.railVisualCount{position:absolute;top:8px;right:8px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#e4f4ec;color:#116c45;font-weight:900;font-size:11px}.railVisualItem strong{display:block;font-size:11px;margin-top:7px}.railVisualItem span{display:block;font-size:9px;color:var(--muted);margin-top:3px}.visualCallSheet{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.callSheetCard{display:grid;grid-template-columns:48px 1fr;gap:10px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:10px;background:#fbfdfc;cursor:pointer}.roleAvatar{width:46px;height:46px;border-radius:14px;background:linear-gradient(135deg,#0f7e4e,#caff58);display:grid;place-items:center;font-weight:900;font-size:18px;color:#062118}.callSheetCard strong{font-size:12px}.callSheetCard span{font-size:10px;color:var(--muted)}
.visualMiniGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.visualMiniCard{position:relative;min-height:130px;border-radius:14px;overflow:hidden;background-size:cover;background-position:center;cursor:pointer}.visualMiniCard:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(4,20,14,.92),rgba(4,20,14,.25))}.visualMiniBody{position:absolute;inset:auto 0 0;color:#fff;padding:11px}.visualMiniBody strong{font-size:12px}.visualMiniBody span{font-size:9px;color:#d3e8df;display:block;margin-top:3px}.visualMiniIcon{position:absolute;top:9px;left:9px;width:34px;height:34px;border-radius:11px;background:rgba(255,255,255,.88);display:grid;place-items:center;font-size:18px}
.platformLogoStrip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.platformMiniVisual{border:1px solid var(--line);border-radius:14px;padding:10px;background:#fbfdfc;cursor:pointer;text-align:center}.platformMiniVisual img{height:30px;width:30px;object-fit:contain}.platformMiniVisual strong{display:block;font-size:11px;margin-top:5px}.platformMiniVisual span{font-size:9px;color:var(--muted)}
.visualStageMap{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:11px}.stageVisualCard{min-height:190px;border-radius:18px;padding:15px;background:linear-gradient(145deg,#fff,#f5faf7);border:1px solid var(--line);cursor:pointer;position:relative;overflow:hidden}.stageVisualCard:after{content:"";position:absolute;left:0;bottom:0;height:6px;width:var(--stage-fill,0%);background:linear-gradient(90deg,var(--green),var(--lime))}.stageVisualIcon{font-size:34px}.stageVisualCard h3{font-size:15px;margin:9px 0 4px}.stageVisualCard p{font-size:10px;line-height:1.4}.stageVisualDish{margin-top:10px;padding:8px;border-radius:10px;background:#eaf7f0;font-size:10px;font-weight:800}.stageVisualCount{position:absolute;right:12px;top:12px;font-size:24px;font-weight:900;color:#0e6d45}
.pantryImageCard img,.draftVisualCard img,.platformVisualCard img,.publishedVisualCard img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:13px}.draftVisualCard{overflow:hidden}.draftVisualCard .cardImageWrap{position:relative}.playBadge{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:50%;background:rgba(255,0,0,.92);display:grid;place-items:center;color:#fff;font-size:20px;box-shadow:0 8px 28px rgba(0,0,0,.28)}.draftTagRow{display:flex;gap:5px;flex-wrap:wrap}.draftVisualCard h3{font-size:17px;line-height:1.15}.aiTagStatus{display:grid;grid-template-columns:50px 1fr;gap:10px;align-items:center;background:#eff7ff;border:1px solid #cadcf2;border-radius:13px;padding:11px}.aiTagStatus .icon{width:46px;height:46px;border-radius:13px;background:#dbeafe;display:grid;place-items:center;font-size:23px}.actionWithTip{position:relative}.actionWithTip:hover:after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%);width:220px;padding:8px 9px;border-radius:9px;background:#071b14;color:#fff;font-size:10px;line-height:1.4;box-shadow:0 8px 24px rgba(0,0,0,.25);z-index:20;pointer-events:none}
.platformVisualCard{min-height:260px}.platformBrandHead{display:flex;align-items:center;gap:11px}.platformBrandHead img{width:48px;height:48px;object-fit:contain;background:#fff;padding:7px;border-radius:14px;border:1px solid var(--line)}.platformBrandHead h3{margin:0}.platformMetricTiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:12px}.platformMetricTile{background:#f4f8f6;border-radius:11px;padding:8px;text-align:center}.platformMetricTile strong{display:block;font-size:18px}.platformMetricTile span{font-size:8px;color:var(--muted);text-transform:uppercase}.connectionDots{display:flex;gap:5px;margin-top:10px}.connectionDot{height:7px;flex:1;border-radius:999px;background:#dfe9e4}.connectionDot.on{background:#22a66a}.connectionDot.partial{background:#e9a62a}
.jobtreadBanner{display:grid;grid-template-columns:72px 1fr auto;gap:14px;align-items:center;background:linear-gradient(130deg,#f1fff7,#fff);border:1px solid #bce0cc;border-radius:18px;padding:15px}.jobtreadIcon{width:68px;height:68px;border-radius:17px;background:#0a7c4a;color:#fff;display:grid;place-items:center;font-weight:900;font-size:20px}.guestVisualCard{min-height:180px;position:relative;overflow:hidden;border-radius:17px;background:linear-gradient(145deg,#103b2d,#0b231b);color:#fff;padding:16px;cursor:pointer}.guestVisualCard:before{content:"";position:absolute;width:150px;height:150px;border-radius:50%;right:-45px;top:-50px;background:rgba(202,255,88,.12)}.guestVisualCard .guestIcon{font-size:36px}.guestVisualCard p{color:#cfe4da;font-size:11px}.guestCardsGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.guestAccountCard{border:1px solid var(--line);border-radius:15px;padding:12px;background:#fbfdfc;cursor:pointer}.guestAccountCard .guestMark{width:42px;height:42px;border-radius:13px;background:#dff4e8;display:grid;place-items:center;font-size:22px}.guestAccountCard h4{margin:8px 0 3px}.guestAccountCard p{font-size:10px}
.serviceWindowHero{display:flex;align-items:center;justify-content:space-between;gap:20px;background:linear-gradient(120deg,#391f0b,#9b5017 52%,#e1983a);color:#fff;border-radius:21px;padding:22px;box-shadow:var(--shadow)}.serviceWindowHero h3{font-size:28px;margin:4px 0}.serviceWindowHero p{color:#ffe9ca;max-width:800px}.heatLampIcon{font-size:66px;filter:drop-shadow(0 8px 18px rgba(0,0,0,.25))}.visualQueue{display:grid;gap:9px}.passDishCard{display:grid;grid-template-columns:110px 1fr;gap:11px;border:1px solid var(--line);border-radius:14px;padding:9px;background:#fff}.passDishCard img{width:110px;aspect-ratio:16/10;object-fit:cover;border-radius:10px}.riskIconRow{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}.riskIconRow>div{background:#fff;border:1px solid var(--line);border-radius:14px;text-align:center;padding:13px;font-size:25px;box-shadow:var(--shadow)}.riskIconRow span{display:block;font-size:9px;color:var(--muted);margin-top:4px;text-transform:uppercase;letter-spacing:.04em}
.calendarShell{background:#fff;border:1px solid var(--line);border-radius:20px;padding:15px;box-shadow:var(--shadow)}.calendarMonthTitle{font-size:25px;font-weight:900;margin-bottom:12px}.calendarWeekdays,.calendarGrid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}.calendarWeekdays div{text-align:center;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);padding:7px}.calendarCell{min-height:132px;border:1px solid var(--line);border-radius:12px;padding:7px;background:#fbfdfc;overflow:hidden}.calendarCell.outside{opacity:.42}.calendarCell.today{border:2px solid var(--green);background:#effbf4}.calendarDate{display:flex;justify-content:space-between;align-items:center;font-weight:900}.calendarDate span:last-child{font-size:8px;color:var(--muted)}.calendarEvent{display:grid;grid-template-columns:28px 1fr;gap:5px;align-items:center;margin-top:5px;padding:5px;border-radius:8px;background:#eaf7f0;cursor:pointer;overflow:hidden}.calendarEvent img{width:28px;height:28px;object-fit:cover;border-radius:6px}.calendarEvent .eventIcon{width:28px;height:28px;border-radius:6px;background:#d9efe4;display:grid;place-items:center;font-size:14px}.calendarEvent strong{font-size:8px;line-height:1.15}.calendarEvent span{display:block;font-size:7px;color:var(--muted)}.calendarLegend{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}.calendarLegend span{font-size:9px;padding:5px 8px;border-radius:999px;background:#f0f5f2}
.visualTaskList{display:grid;gap:9px}.taskVisualCard{display:grid;grid-template-columns:54px 1fr 118px;gap:11px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:10px;background:#fbfdfc}.taskVisualCard .taskIcon{width:52px;height:52px;border-radius:14px;background:#e2f5eb;display:grid;place-items:center;font-size:23px}.taskVisualCard select{width:100%;padding:8px;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:10px}.taskVisualCard strong{font-size:12px}.taskVisualCard span{font-size:9px;color:var(--muted)}
.activityTimeline{display:grid;gap:10px}.activityEvent{display:grid;grid-template-columns:58px 1fr auto;gap:12px;align-items:start;background:#fff;border:1px solid var(--line);border-radius:16px;padding:12px;box-shadow:0 8px 25px rgba(5,24,17,.08)}.activityEventIcon{width:54px;height:54px;border-radius:15px;background:#ddf3e7;display:grid;place-items:center;font-size:24px}.activityEvent h4{margin:0 0 4px}.activityEvent p{margin:0;font-size:11px}.activityMeta{text-align:right;font-size:9px;color:var(--muted)}
.visualArchitecture{display:flex;gap:7px;align-items:center;flex-wrap:wrap}.visualArchitecture span{padding:8px 10px;border-radius:999px;background:#0e2b21;color:#dfff7c;font-size:9px;font-weight:900}.visualArchitecture b{color:#6d8c7f}
.recipeDrawerHero{min-height:250px;border-radius:17px;background-size:cover;background-position:center;position:relative;overflow:hidden;margin-bottom:12px}.recipeDrawerHero:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(3,17,12,.95),rgba(3,17,12,.2))}.recipeDrawerOverlay{position:absolute;inset:auto 0 0;padding:18px;color:#fff}.recipeDrawerOverlay h2{font-size:28px;margin:5px 0}.recipeDrawerStats{display:flex;gap:7px;flex-wrap:wrap}.recipeDrawerStats span{background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.17);border-radius:999px;padding:5px 8px;font-size:9px}.visualStepGrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px;margin-top:10px}.visualStep{min-height:105px;border:1px solid var(--line);border-radius:13px;padding:9px;background:#f9fcfa;cursor:pointer}.visualStep.done{background:#e9f9f0;border-color:#9ed2b5}.visualStepIcon{font-size:23px}.visualStep strong{display:block;font-size:9px;margin-top:6px}.visualStep span{font-size:8px;color:var(--muted)}.sourceVisualGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.sourceVisualItem{border:1px solid var(--line);border-radius:13px;overflow:hidden;background:#fff}.sourceVisualItem img{width:100%;aspect-ratio:16/8;object-fit:cover}.sourceVisualItem .body{padding:9px}.sourceVisualItem h4{margin:0 0 4px;font-size:12px}.sourceMissing{display:grid;place-items:center;min-height:105px;background:repeating-linear-gradient(135deg,#f7faf8,#f7faf8 10px,#eef5f1 10px,#eef5f1 20px);color:#8b3a3a;font-weight:800;text-align:center;padding:10px}
.drawerBody,.drawerActions{color:#10231d}.drawer .plainBox{color:#10231d;background:#fff;border-color:#c9dbd3}.drawer .tiny{color:#536e63}.drawerActions{z-index:4}.drawer{background:#f2f7f4}
@media(max-width:1400px){.visualRail{grid-template-columns:repeat(3,minmax(0,1fr))}.visualStageMap{grid-template-columns:repeat(4,minmax(0,1fr))}.homeLeadGrid{grid-template-columns:1fr}.calendarPreview{grid-template-columns:repeat(7,minmax(44px,1fr))}}
@media(max-width:1000px){.visualStageMap{grid-template-columns:repeat(2,minmax(0,1fr))}.visualStepGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.guestCardsGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.calendarCell{min-height:100px}.platformMetricTiles{grid-template-columns:1fr}.todayVisualRoute{grid-template-columns:1fr}.taskVisualCard{grid-template-columns:45px 1fr}.taskVisualCard select{grid-column:1/-1}}
@media(max-width:700px){.visualHeroContent h2{font-size:29px}.visualRail,.visualCallSheet,.visualMiniGrid,.platformLogoStrip,.visualStageMap,.guestCardsGrid,.sourceVisualGrid,.visualStepGrid{grid-template-columns:1fr}.calendarShell{overflow:auto}.calendarWeekdays,.calendarGrid{min-width:850px}.riskIconRow{grid-template-columns:repeat(2,minmax(0,1fr))}.passDishCard{grid-template-columns:1fr}.passDishCard img{width:100%}.serviceWindowHero{display:block}.heatLampIcon{margin-top:12px}.jobtreadBanner{grid-template-columns:52px 1fr}.jobtreadBanner .btn{grid-column:1/-1}.homeLeadGrid{display:block}.visualCalendarCard{margin-top:14px}}
.platformLogoBox{display:grid;place-items:center;border-radius:14px;background:#fff;border:1px solid var(--line);padding:7px;flex:0 0 auto}.platformLogoBox img{width:100%;height:100%;object-fit:contain}.platformLogoBox span{width:100%;height:100%;place-items:center;font-weight:900;color:#0b5c39;background:#e4f5ec;border-radius:9px}.visualMetricIcon{transition:transform .16s ease}