/* UI coordinates are intrinsic screen pixels. Device projection owns all
   perspective; the UI itself remains flat and is never rotated or skewed. */
.workflow-app{position:relative;box-sizing:border-box;overflow:hidden;background:#fafbfc;color:#292e32;font-family:'Noto Sans JP',sans-serif;line-height:1.4;text-align:left;pointer-events:none;-webkit-font-smoothing:antialiased;contain:layout paint;--wf-line:#dce1e5;--wf-muted:#656e76;--wf-accent:#dfed42;--wf-ink:#292e32}
.workflow-app *{box-sizing:border-box;min-width:0}
.workflow-app :is(h2,h3,p,ol){margin:0}
.workflow-app [hidden]{display:none!important}
.workflow-app img{display:block;max-width:100%}
.workflow-app .wf-icon{display:block;color:var(--wf-ink)}
.workflow-app .wf-icon svg{display:block;width:100%;height:100%}
.workflow-app .wf-app-label{font-weight:600;letter-spacing:0;white-space:nowrap}
.workflow-app .wf-demo-label{font-family:'DM Sans',sans-serif;font-weight:600;letter-spacing:.08em;color:var(--wf-muted);white-space:nowrap}
.workflow-app .wf-phone-shell{position:absolute;inset:300px 140px 280px;display:grid;grid-template-rows:80px 430px 300px 600px minmax(0,1fr);gap:50px}
.workflow-app .wf-phone-header{display:flex;justify-content:space-between;align-items:center;gap:24px;font-size:64px;line-height:1.2}
.workflow-app .wf-phone-header .wf-demo-label{font-size:44px}
.workflow-app .wf-phone-title{align-self:center;font-size:170px;font-weight:700;line-height:1.22;letter-spacing:-.035em;white-space:pre-line;overflow-wrap:normal;word-break:keep-all}
.workflow-app .wf-phone-visual{position:relative;display:flex;align-items:center;justify-content:center;height:300px;background:#eef1f3;border-radius:72px;overflow:hidden}
.workflow-app .wf-phone-symbol{width:224px;height:224px;flex:none}
.workflow-app .wf-wave{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:16px;opacity:0}
.workflow-app .wf-wave i{display:block;flex:0 0 18px;max-height:260px;background:#565f67;border-radius:16px;transform-origin:center}
.workflow-app .wf-phone-visual[data-mode="wave"] .wf-wave{opacity:1}
.workflow-app .wf-phone-visual[data-mode="wave"] .wf-phone-symbol{opacity:0}
.workflow-app .wf-phone-panel{display:flex;flex-direction:column;justify-content:center;gap:32px;min-height:0}
.workflow-app .wf-fact{display:flex;flex-direction:column;gap:18px;min-height:0}
.workflow-app .wf-fact-label{color:var(--wf-muted);font-size:80px;font-weight:500;line-height:1.25;letter-spacing:-.025em}
.workflow-app .wf-fact-value{font-size:132px;font-weight:600;line-height:1.2;letter-spacing:-.04em;overflow-wrap:normal;word-break:keep-all}
.workflow-app .wf-phone-action{align-self:end;display:flex;align-items:center;justify-content:center;min-height:234px;padding:44px 20px;border-radius:56px;background:var(--wf-ink);color:#fff;text-align:center;font-size:130px;font-weight:600;line-height:1.25;letter-spacing:-.04em;white-space:pre-line;word-break:keep-all}
.workflow-app[data-confirmed="true"] .wf-phone-action{background:var(--wf-accent);color:var(--wf-ink)}
.workflow-app[data-confirmed="true"] .wf-phone-visual{background:#edf0de}
.workflow-app--counter .wf-phone-title{font-family:'DM Sans','Noto Sans JP',sans-serif}
.workflow-app--counter .wf-phone-panel{border-block:4px solid var(--wf-line);padding:24px 0;gap:24px}
.workflow-app--counter .wf-fact{gap:12px}
.workflow-app--counter .wf-fact:last-child .wf-fact-label{display:none}
.workflow-app--counter .wf-fact:first-child .wf-fact-value{font-family:'DM Sans','Noto Sans JP',sans-serif;font-size:158px;line-height:1.2;letter-spacing:-.045em;white-space:nowrap}
.workflow-app--counter .wf-fact:last-child .wf-fact-value{font-size:190px;line-height:1.1}
.workflow-app--counter .wf-phone-panel[data-revealed="false"] .wf-fact{visibility:hidden}
.workflow-app .wf-phone-shell--message{grid-template-rows:80px 370px minmax(0,1fr) 260px;gap:65px}
.workflow-app .wf-phone-shell--message .wf-phone-title{line-height:1.08}
.workflow-app .wf-message-panel{position:relative;display:block;background:#edf0f2;border-radius:72px;padding:72px 60px}
.workflow-app .wf-sms-waiting{position:absolute;inset:72px 60px;display:flex;align-items:center;justify-content:center;color:var(--wf-muted);font-size:138px;font-weight:500;line-height:1.6;text-align:center;white-space:pre-line;word-break:keep-all}
.workflow-app .wf-sms{display:flex;flex-direction:column;justify-content:center;height:100%;gap:24px;opacity:0}
.workflow-app .wf-sms>span{display:block;font-size:96px;font-weight:500;line-height:1.3;letter-spacing:-.035em;word-break:normal;line-break:strict}
.workflow-app .wf-sms-time{display:block;font-family:'DM Sans','Noto Sans JP',sans-serif;font-size:158px;font-weight:700;line-height:1.1;letter-spacing:-.045em;white-space:nowrap}
.workflow-app .wf-sms-time>span{display:block;font:inherit;letter-spacing:inherit}
.workflow-app .wf-sms-guests>span{display:block;white-space:nowrap}
.workflow-app .wf-message-panel[data-received="true"] .wf-sms{opacity:1}
.workflow-app .wf-message-panel[data-received="true"] .wf-sms-waiting{opacity:0}
.workflow-app .wf-source-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0}
.workflow-app .wf-phone-visual[data-show-photo="true"] .wf-source-photo{opacity:1}
.workflow-app .wf-phone-visual[data-show-photo="true"] :is(.wf-phone-symbol,.wf-wave){opacity:0}
.workflow-app .wf-input-prompt{display:flex;flex-direction:column;gap:35px}
.workflow-app .wf-ingredients{display:flex;flex-direction:column;gap:20px}
.workflow-app .wf-ingredients strong{display:block;padding:20px 30px;border-radius:28px;background:#edf0f2;font-size:126px;font-weight:600;line-height:1.1;letter-spacing:-.035em;white-space:nowrap}
.workflow-app .wf-recipe-name{font-size:145px;font-weight:700;line-height:1.22;letter-spacing:-.035em;white-space:pre-line;word-break:keep-all}
.workflow-app .wf-instructions{display:flex;flex-direction:column;gap:42px;padding:0;list-style:none}
.workflow-app .wf-instructions li{display:flex;align-items:center;gap:26px;font-size:110px;font-weight:600;line-height:1.35;letter-spacing:-.035em;white-space:nowrap}
.workflow-app .wf-instructions b{flex:0 0 100px;display:flex;align-items:center;justify-content:center;width:100px;height:110px;background:#edf0f2;border-radius:26px;font:600 80px/1 'DM Sans',sans-serif}
.workflow-app--delivery .wf-phone-panel{gap:24px}
.workflow-app--delivery .wf-fact{gap:12px}
.workflow-app--delivery .wf-fact-label{font-size:74px}
.workflow-app--delivery .wf-phone-header{font-size:57px}
.workflow-app--delivery .wf-fact:first-child .wf-fact-value{font-size:170px;letter-spacing:-.04em}
.workflow-app--delivery .wf-fact:last-child .wf-fact-value{font-size:132px}
/* A 1440×900 display: 10% side and vertical safety margins. */
.workflow-app .wf-desktop-shell{position:absolute;inset:90px 144px;display:grid;grid-template-rows:44px 94px minmax(0,1fr) 62px;gap:24px}
.workflow-app .wf-desktop-header{display:flex;align-items:center;justify-content:space-between;gap:24px;font-size:29px;line-height:1.25}
.workflow-app .wf-desktop-header .wf-demo-label{font-size:21px}
.workflow-app .wf-desktop-title{align-self:center;font-size:61px;font-weight:700;line-height:1.25;letter-spacing:-.035em;white-space:nowrap}
.workflow-app .wf-desktop-body{display:grid;grid-template-columns:1.16fr 1fr;gap:44px;min-height:0}
.workflow-app .wf-desktop-footer{display:flex;flex-direction:column;justify-content:end;gap:16px;min-height:0}
.workflow-app .wf-desktop-status{display:block;font-size:27px;font-weight:500;line-height:1.3;letter-spacing:-.015em;white-space:nowrap}
.workflow-app .wf-desktop-progress{height:7px;border-radius:8px;background:#e3e7e9;overflow:hidden}
.workflow-app .wf-desktop-progress i{display:block;width:100%;height:100%;background:#7a858e;transform:scaleX(0);transform-origin:0 50%}
.workflow-app .wf-doctor-video{position:relative;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:30px;background:#e8edef;border-radius:32px;overflow:hidden}
.workflow-app .wf-doctor-portrait{width:100%;height:100%;object-fit:contain;object-position:50% 50%}
.workflow-app .wf-video-label{position:absolute;left:26px;bottom:24px;padding:12px 20px;border-radius:14px;background:#fffffff0;font-size:27px;font-weight:500;line-height:1.3}
.workflow-app .wf-video-placeholder{width:132px;height:132px;color:#77828a}
.workflow-app .wf-video-placeholder-label{font-size:30px;font-weight:500;text-align:center}
.workflow-app .wf-consultation-record{display:flex;flex-direction:column;justify-content:center;gap:18px;padding:0;min-height:0}
.workflow-app .wf-review-state{display:inline-block;align-self:start;max-width:100%;padding:9px 18px;border-radius:12px;background:#e9edef;color:#59636c;font-size:29px;font-weight:600;line-height:1.3;white-space:nowrap}
.workflow-app[data-confirmed="true"] .wf-review-state{background:#e8eeae;color:var(--wf-ink)}
.workflow-app .wf-record-title{font-size:64px;font-weight:700;line-height:1.26;letter-spacing:-.035em;white-space:pre-line;word-break:keep-all}
.workflow-app .wf-consultation-notes{display:flex;flex-direction:column;gap:14px;padding-left:22px;border-left:4px solid #d4dce1}
.workflow-app .wf-consultation-notes .wf-fact{gap:3px}
.workflow-app .wf-consultation-notes .wf-fact-label{font-size:24px;line-height:1.35}
.workflow-app .wf-consultation-notes .wf-fact-value{font-size:36px;font-weight:500;line-height:1.3;letter-spacing:-.025em}
.workflow-app--estimate .wf-desktop-title{font-size:56px}
.workflow-app--estimate .wf-desktop-body{grid-template-columns:1fr 1fr;gap:56px}
.workflow-app .wf-drawing-source{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;background:#eceff1;border-radius:28px;overflow:hidden}
.workflow-app .wf-drawing-photo{width:100%;height:100%;object-fit:contain;object-position:center}
.workflow-app .wf-drawing-placeholder{width:150px;height:150px;color:#71808b}
.workflow-app .wf-drawing-placeholder-label{font-size:34px;font-weight:500;color:#5d6b75}
.workflow-app .wf-drawing-label{position:absolute;left:24px;bottom:22px;padding:10px 18px;border-radius:10px;background:#fffffff0;font:600 27px/1.3 'DM Sans','Noto Sans JP',sans-serif}
.workflow-app .wf-scan-frame{position:absolute;inset:30px;border:2px solid #81909c;border-radius:6px;opacity:.55}
.workflow-app .wf-scan-line{position:absolute;left:34px;right:34px;height:3px;background:#626f7a;box-shadow:0 0 14px #7a858e44}
.workflow-app .wf-estimate-result{display:flex;flex-direction:column;justify-content:center;align-items:start;gap:10px;padding:0;min-height:0}
.workflow-app .wf-estimate-result .wf-record-title{font-size:55px;line-height:1.2}
.workflow-app .wf-estimate-result .wf-review-state{font-size:26px;padding:7px 14px}
.workflow-app .wf-estimate-line{font-size:31px;font-weight:600;line-height:1.35;letter-spacing:-.025em;white-space:nowrap}
.workflow-app .wf-estimate-line--secondary{font-size:28px;font-weight:400;color:var(--wf-muted)}
.workflow-app .wf-estimate-completion{width:100%;margin-top:0;padding-top:12px;border-top:2px solid var(--wf-line);font-size:24px;font-weight:500;line-height:1.3;letter-spacing:-.025em;white-space:nowrap}

/* Compact-view close-ups keep the same 1440×900 glass. Only the app's information
   density changes: the physician/input image and the current task stay large. */
.workflow-app .wf-estimate-mobile-note{display:none}
@media(max-width:1024px){
  .workflow-app--desktop .wf-desktop-shell{grid-template-rows:104px minmax(0,1fr);gap:28px}
  .workflow-app--desktop .wf-desktop-header,.workflow-app--desktop .wf-desktop-footer{display:none}
  .workflow-app--desktop .wf-desktop-title{font-size:88px;line-height:1.15;letter-spacing:-.035em}
  .workflow-app--desktop .wf-desktop-body{grid-template-columns:1fr 1fr;gap:40px}
  .workflow-app--telehealth .wf-consultation-record{gap:28px;padding:0}
  .workflow-app--telehealth .wf-consultation-notes{display:none}
  .workflow-app--telehealth .wf-review-state{font-size:76px;line-height:1.2;padding:14px 16px}
  .workflow-app--telehealth .wf-record-title{font-size:90px;line-height:1.15;letter-spacing:-.035em}
  .workflow-app--telehealth .wf-video-label{font-size:76px;line-height:1.2;left:24px;bottom:24px;padding:14px 20px}
  .workflow-app--telehealth .wf-video-placeholder-label{display:none}
  .workflow-app--estimate .wf-estimate-result{gap:22px;padding:0}
  .workflow-app--estimate .wf-estimate-result .wf-review-state{font-size:76px;line-height:1.2;padding:14px 14px}
  .workflow-app--estimate .wf-estimate-result .wf-record-title{font-size:90px;line-height:1.15;letter-spacing:-.035em}
  .workflow-app--estimate .wf-estimate-line,.workflow-app--estimate .wf-estimate-completion{display:none}
  .workflow-app--estimate .wf-estimate-mobile-note{display:block;margin:0;font-size:76px;font-weight:500;line-height:1.2;letter-spacing:-.025em;white-space:nowrap}
  .workflow-app--estimate .wf-drawing-label{font-size:76px;line-height:1.2;left:24px;bottom:24px;padding:14px 18px}
  .workflow-app--estimate .wf-drawing-placeholder-label{font-size:76px;line-height:1.2}
}

/* The independent shop's own order app: a dish and two readable preferences. */
.workflow-app .wf-phone-shell--order{grid-template-rows:80px 430px minmax(0,1fr) 260px}
.workflow-app .wf-order-panel{gap:24px}
.workflow-app .wf-order-shop{color:var(--wf-muted);font-size:80px;font-weight:500;line-height:1.25;letter-spacing:-.025em}
.workflow-app .wf-order-dish{display:block;font-size:148px;font-weight:700;line-height:1.2;letter-spacing:-.035em;white-space:nowrap}
.workflow-app .wf-order-preferences{display:flex;flex-direction:column;gap:22px}
.workflow-app .wf-order-choice{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:24px;border:3px solid #dce1e5;border-radius:35px;background:#fff}
.workflow-app .wf-order-choice-copy{font-size:150px;font-weight:500;line-height:1.15;letter-spacing:-.035em;white-space:pre-line;word-break:keep-all}
.workflow-app .wf-order-choice-check{flex:0 0 64px;width:64px;height:64px;opacity:.12}
.workflow-app .wf-order-choice[data-selected="true"]{border-color:#7b858d;background:#f0f3f4}
.workflow-app .wf-order-choice[data-selected="true"] .wf-order-choice-check{opacity:1}

/* A categorical route proposal, not a geographic map or a measured result. */
.workflow-app .wf-route-diagram{width:100%;height:100%;padding:18px}
.workflow-app .wf-route-diagram svg{display:block;width:100%;height:100%}
.workflow-app .wf-route-diagram path{stroke:#b9c2c8;stroke-width:9;stroke-linecap:round;stroke-linejoin:round}
.workflow-app .wf-route-diagram .wf-route-option{stroke-dasharray:15 18;opacity:.65}
.workflow-app .wf-route-diagram .wf-route-proposal{stroke:#4c5963;opacity:.28}
.workflow-app .wf-route-diagram circle{fill:#f9fafb;stroke:#a0acb5;stroke-width:5}
.workflow-app .wf-route-diagram text{fill:#4b5964;font:600 48px/1 'DM Sans',sans-serif;text-anchor:middle;dominant-baseline:central}
.workflow-app .wf-route-diagram[data-route-phase="process"] .wf-route-proposal,.workflow-app .wf-route-diagram[data-route-phase="confirmation"] .wf-route-proposal,.workflow-app .wf-route-diagram[data-route-phase="delivered"] .wf-route-proposal{opacity:1}
.workflow-app .wf-route-diagram[data-route-phase="confirmation"] .wf-route-option,.workflow-app .wf-route-diagram[data-route-phase="delivered"] .wf-route-option{opacity:.12}