/* Shared control finish. Deliberately excludes scene pins, markers and form choices. */
:root{--control-radius:7px;--control-bg:transparent;--control-ink:#edf0f2;--control-line:#ffffff30;--control-hover:#ffffff0c;--control-hover-line:#ffffff60;--control-focus:#c3d8f0}

html body :is(.btn,.site-header .btn,.branch-hero-actions .btn,.service-question-link,.portfolio-action,.feature-action,.preview-tab,.room-switch button,.order-module-dialog-top button,.order-module-dialog-bottom a),
html body[data-page="order"] .site-header .btn,
html #platform-preview .product-tabs a,
html #demo-shell :is(.flow-primary,.flow-secondary,.app-tabs>button,.tour-journey>button,.tour-node-links>button,.tour-tools button,.scene-map-controls button,.gym-tour-search,.gym-tour-bottom button,.gym-tour-exit,.gym-tour-quick button,.gym-tour-dialog-heading button,.gym-tour-empty button,[data-tour-retry],.execution-phases>button,.pill-row button,[data-plan-toggle],[data-export-plan]),
html #demo-shell .week-grid [data-plan-toggle],
html body:is([data-page="order"],[data-order-module]) :is(.pbtn,.tk-act button,.callbar button,.order-module-toolbar button,.mini .btn-sm,.fake-btn){
 min-height:36px;height:auto;max-width:100%;padding:7px 13px;gap:8px;border:1px solid var(--control-line);border-radius:var(--control-radius);
 background:var(--control-bg);color:var(--control-ink);font-family:Supreme,Arial,sans-serif;font-size:13px;font-weight:500;line-height:1.4;letter-spacing:0;
 text-align:center;white-space:normal;text-decoration:none;box-shadow:none;filter:none;scale:none;transform:none;touch-action:manipulation;
 transition:background-color 150ms ease,border-color 150ms ease,color 150ms ease,opacity 150ms ease,transform 130ms cubic-bezier(.23,1,.32,1);
}

/* Tokens keep primary and selected states consistent without flattening their roles. */
html body :is(.btn.solid,.service-question-link,.order-module-dialog-bottom a,.room-switch button[aria-pressed="true"]),
html #demo-shell :is(.flow-primary,.app-tabs>button[aria-pressed="true"],.tour-journey>button[aria-pressed="true"],.tour-next-link,.gym-tour-quick button[aria-pressed="true"],.execution-phases>button[aria-pressed="true"],.pill-row button[aria-pressed="true"],[data-plan-toggle][aria-pressed="true"],[data-export-plan]),
html body:is([data-page="order"],[data-order-module]) :is(.tk-act button:not(.line),.callbar:not(.acc) button,[data-order-add-example],.mini .btn-sm,.fake-btn){
 --control-bg:#f0f2f3;--control-ink:#101416;--control-line:#f0f2f3;--control-hover:#fff;--control-hover-line:#fff;
}
html body :is(.branch-hero-actions .btn,.service-question-link){min-height:42px;padding:10px 18px;font-size:13px}
html body :is(.site-header .btn,.dialog-top .btn,.order-module-dialog-top button){min-height:36px;padding:8px 13px;font-size:12px}
html body[data-page="order"] .site-header .btn{min-height:36px;padding:8px 13px;font-size:12px}
html #platform-preview .product-tabs a,html body .preview-tab{min-height:34px;padding:7px 10px;font-size:12px}
html body .room-switch{border-radius:8px;padding:3px;background:#10141699;backdrop-filter:blur(12px)}
html body[data-page] .room-switch button{min-height:32px;padding:6px 12px;font-size:12px;border:0;--control-bg:transparent;--control-ink:#f0f2f3;--control-hover:#ffffff16}
html body[data-page] .room-switch button[aria-pressed="true"]{--control-bg:#ffffff18;--control-ink:#fff;--control-hover:#ffffff24}
html #demo-shell :is(.tour-tools button,.scene-map-controls button,.gym-tour-bottom button){min-width:34px;padding:7px 10px;font-size:12px}
html #demo-shell .gym-tour-search{justify-content:flex-start;text-align:left}
html #demo-shell .execution-phases>button{min-height:48px;padding:8px 10px}
html #demo-shell .tour-journey>button>span:first-child{color:inherit;opacity:.68}

/* Secondary navigation reads as navigation, without another filled CTA. */
html body :is(.portfolio-action,.feature-action){
 --control-bg:transparent;--control-hover:transparent;--control-line:transparent;--control-hover-line:transparent;
 min-height:32px;padding:5px 0;border:0;border-radius:0;color:#e6eaed;font-size:13px;font-weight:400;
 text-decoration:underline;text-decoration-color:#ffffff45;text-underline-offset:6px;
}
html body .portfolio-action:hover,html body .feature-link:hover .feature-action{background:transparent;color:#fff;text-decoration-color:#fff}
html body .portfolio-action:focus-visible{background:transparent;color:#fff}

/* The light phone screen uses the same geometry with a dark primary action. */
html body:is([data-page="order"],[data-order-module]) .screen .pbtn{
 --control-bg:#171c20;--control-ink:#f0f2f3;--control-line:#171c20;--control-hover:#303a42;--control-hover-line:#303a42;--control-focus:#356da8;
 min-height:42px;padding:10px 14px;
}
html body:is([data-page="order"],[data-order-module]) .screen .pbtn.line{
 --control-bg:transparent;--control-ink:#171c20;--control-line:#a1abb2;--control-hover:#e1e6e9;--control-hover-line:#64717c;
}
html body:is([data-page="order"],[data-order-module]) .screen :is(.seg,.qty){border-radius:7px}
html body:is([data-page="order"],[data-order-module]) .screen :is(.seg button,.qty button){min-height:36px;border-radius:5px;font-weight:500}
html body:is([data-page="order"],[data-order-module]) .screen .qty button{min-width:36px}
html body:is([data-page="order"],[data-order-module]) .screen .cartbar{border-radius:12px}
html body:is([data-page="order"],[data-order-module]) .tk-foot{flex-wrap:wrap}
html body:is([data-page="order"],[data-order-module]) .tk-foot .badge{flex:none;height:auto;min-height:22px;padding:3px 8px;line-height:1.35;white-space:nowrap}
html[data-input-mode] body:is([data-page="order"],[data-order-module]) .screen .cartbar.on:active{transform:none;scale:none}

@media(hover:hover) and (pointer:fine){
 html body :is(.btn,.site-header .btn,.branch-hero-actions .btn,.service-question-link,.portfolio-action,.preview-tab,.room-switch button,.order-module-dialog-top button,.order-module-dialog-bottom a):not(:disabled):hover,
 html body[data-page="order"] .site-header .btn:hover,
 html #platform-preview .product-tabs a:hover,
 html body .feature-link:hover .feature-action,
 html #demo-shell :is(.flow-primary,.flow-secondary,.app-tabs>button,.tour-journey>button,.tour-node-links>button,.tour-tools button,.scene-map-controls button,.gym-tour-search,.gym-tour-bottom button,.gym-tour-exit,.gym-tour-quick button,.gym-tour-dialog-heading button,.gym-tour-empty button,[data-tour-retry],.execution-phases>button,.pill-row button,.week-grid [data-plan-toggle],[data-export-plan]):not(:disabled):hover,
 html body:is([data-page="order"],[data-order-module]) :is(.pbtn,.tk-act button,.callbar button,.order-module-toolbar button,.mini .btn-sm):not(:disabled):hover{
  background:var(--control-hover);border-color:var(--control-hover-line);color:var(--control-ink);filter:none;
 }
}

/* Focus does not depend on color inversion, and disabled actions stay visibly inactive. */
html body :is(.btn,.service-question-link,.portfolio-action,.preview-tab,.room-switch button,.order-module-dialog-top button,.order-module-dialog-bottom a):focus-visible,
html #demo-shell :is(.flow-primary,.flow-secondary,.app-tabs>button,.tour-journey>button,.tour-node-links>button,.tour-tools button,.scene-map-controls button,.gym-tour-search,.gym-tour-bottom button,.gym-tour-exit,.gym-tour-quick button,.gym-tour-dialog-heading button,.gym-tour-empty button,[data-tour-retry],.execution-phases>button,.pill-row button,[data-plan-toggle],[data-export-plan]):focus-visible,
html body:is([data-page="order"],[data-order-module]) :is(.pbtn,.tk-act button,.callbar button,.order-module-toolbar button,.mini .btn-sm):focus-visible{
 outline:2px solid var(--control-focus);outline-offset:4px;box-shadow:none;
}
html body .feature-link:focus-visible .feature-action{outline:2px solid var(--control-focus);outline-offset:4px;background:var(--control-bg);color:var(--control-ink)}
html body :is(.btn,.service-question-link):disabled,
html #demo-shell :is(.flow-primary,.flow-secondary,[data-plan-toggle],[data-export-plan]):disabled,
html body:is([data-page="order"],[data-order-module]) :is(.pbtn,.tk-act button,.order-module-toolbar button):disabled{opacity:.45;cursor:not-allowed}

/* Cancel older scaling feedback; only explicit standard controls receive a 1 px press. */
html[data-input-mode] body :is(.btn,.service-question-link,.portfolio-action,.feature-action,.preview-tab,.room-switch button,.order-module-dialog-top button,.order-module-dialog-bottom a):active,
html[data-input-mode] body .feature-link:active .feature-action,
html[data-input-mode] #demo-shell :is(.flow-primary,.flow-secondary,.app-tabs>button,.tour-journey>button,.tour-node-links>button,.tour-tools button,.scene-map-controls button,.gym-tour-search,.gym-tour-bottom button,.gym-tour-exit,.gym-tour-quick button,.gym-tour-dialog-heading button,.gym-tour-empty button,[data-tour-retry],.execution-phases>button,.pill-row button,[data-plan-toggle],[data-export-plan]):active,
html[data-input-mode] body:is([data-page="order"],[data-order-module]) :is(.pbtn,.tk-act button,.callbar button,.order-module-toolbar button,.mini .btn-sm):active{scale:none;transform:none}
@media(prefers-reduced-motion:no-preference){
 html[data-input-mode="pointer"] body :is(.btn,.service-question-link,.portfolio-action,.preview-tab,.room-switch button,.order-module-dialog-top button,.order-module-dialog-bottom a):not(:disabled):active,
 html[data-input-mode="pointer"] body .feature-link:active .feature-action,
 html[data-input-mode="pointer"] #demo-shell :is(.flow-primary,.flow-secondary,.app-tabs>button,.tour-journey>button,.tour-node-links>button,.tour-tools button,.scene-map-controls button,.gym-tour-search,.gym-tour-bottom button,.gym-tour-exit,.gym-tour-quick button,.gym-tour-dialog-heading button,.gym-tour-empty button,[data-tour-retry],.execution-phases>button,.pill-row button,[data-plan-toggle],[data-export-plan]):not(:disabled):active,
 html[data-input-mode="pointer"] body:is([data-page="order"],[data-order-module]) :is(.pbtn,.tk-act button,.callbar button,.order-module-toolbar button,.mini .btn-sm):not(:disabled):active{transform:translateY(1px)}
 html[data-input-mode="pointer"] body:is([data-page="order"],[data-order-module]) .screen .cartbar.on:active{transform:translateY(1px)}
}
@media(max-width:640px){
 html body :is(.dialog-top .btn,.dialog-bottom .btn,.order-module-dialog-top button,.order-module-dialog-bottom a){padding:7px 11px;font-size:12px}
 html #demo-shell :is(.tour-tools button,.scene-map-controls button){padding:7px;font-size:12px}
}
html[data-input-mode="keyboard"] body :is(.btn,.service-question-link,.portfolio-action,.feature-action,.preview-tab,.room-switch button,.order-module-dialog-top button,.order-module-dialog-bottom a),
html[data-input-mode="keyboard"] #demo-shell :is(.flow-primary,.flow-secondary,.app-tabs>button,.tour-journey>button,.tour-node-links>button,.tour-tools button,.scene-map-controls button,.gym-tour-search,.gym-tour-bottom button,.gym-tour-exit,.gym-tour-quick button,.gym-tour-dialog-heading button,.gym-tour-empty button,[data-tour-retry],.execution-phases>button,.pill-row button,[data-plan-toggle],[data-export-plan]),
html[data-input-mode="keyboard"] body:is([data-page="order"],[data-order-module]) :is(.pbtn,.tk-act button,.callbar button,.order-module-toolbar button,.mini .btn-sm){transition:none!important}
@media(prefers-reduced-motion:reduce){
 html body :is(.btn,.service-question-link,.portfolio-action,.feature-action,.preview-tab,.room-switch button,.order-module-dialog-top button,.order-module-dialog-bottom a),
 html #demo-shell :is(.flow-primary,.flow-secondary,.app-tabs>button,.tour-journey>button,.tour-node-links>button,.tour-tools button,.scene-map-controls button,.gym-tour-search,.gym-tour-bottom button,.gym-tour-exit,.gym-tour-quick button,.gym-tour-dialog-heading button,.gym-tour-empty button,[data-tour-retry],.execution-phases>button,.pill-row button,[data-plan-toggle],[data-export-plan]),
 html body:is([data-page="order"],[data-order-module]) :is(.pbtn,.tk-act button,.callbar button,.order-module-toolbar button,.mini .btn-sm){transition:none!important}
}
