@import url("/styles/unified-ui.css");

/*
 * Shared button language. Four intentional tiers only:
 * compact 34px, standard 44px, primary 52px and game decision 50px.
 * Colours remain owned by each screen; this file keeps form, typography and feedback consistent.
 */
:root{--button-font:Inter,"Segoe UI",system-ui,sans-serif;--button-radius:12px;--button-radius-compact:10px;--button-transition:180ms cubic-bezier(.2,.75,.25,1);--button-compact:34px;--button-standard:44px;--button-primary:52px;--button-decision:50px}
:where(button,.button,.btn,.toolbar-btn,.primary-btn,.soft-btn,.green-btn,.danger-btn,.site-home-button):not(#btn){font-family:var(--button-font)!important;line-height:1.15!important;letter-spacing:0!important;border-radius:var(--button-radius)!important;transition:transform var(--button-transition),box-shadow var(--button-transition),filter var(--button-transition),border-color var(--button-transition),background-color var(--button-transition)!important}
:where(button,.button,.btn,.primary-btn,.soft-btn,.green-btn,.danger-btn):not(#btn):focus-visible{outline:2px solid #ffd75b!important;outline-offset:2px!important}
@media (hover:hover) and (pointer:fine){:where(button,.button,.btn,.toolbar-btn,.primary-btn,.soft-btn,.green-btn,.danger-btn,.site-home-button):not(#btn):not(:disabled):hover{transform:translateY(-1px);filter:brightness(1.045)}}
@media (prefers-reduced-motion:reduce){:where(button,.button,.btn,.toolbar-btn,.primary-btn,.soft-btn,.green-btn,.danger-btn,.site-home-button):not(#btn){transition-duration:1ms!important}}

/* Marketing, account pages and portal: primary actions are visibly larger; ordinary actions are one size. */
.site-header .button,.hero-actions .button,.cta .button,.join-strip .button{min-height:var(--button-primary)!important;border-radius:14px!important}
.auth-card button,.auth-card .button{min-height:50px!important}
body[data-motion-page="portal"] button,body[data-motion-page="portal"] .btn{min-height:var(--button-standard)!important}
body[data-motion-page="portal"] .impersonation-banner button,body[data-motion-page="portal"] input[type="file"]::file-selector-button{min-height:var(--button-compact)!important;border-radius:var(--button-radius-compact)!important}
body[data-motion-page="portal"] .project-delete-actions button,body[data-motion-page="portal"] .project-delete-actions .btn{min-height:var(--button-standard)!important}

/* Host panel: small service controls, standard controls and large game decisions. */
body[data-motion-page="admin"] button{min-height:var(--button-standard)!important}
body[data-motion-page="admin"] .small-btn,body[data-motion-page="admin"] .sound-icon-btn{min-height:var(--button-compact)!important;border-radius:var(--button-radius-compact)!important}
body[data-motion-page="admin"] .big-btn,body[data-motion-page="admin"] .round-answer-actions .big-btn,body[data-motion-page="admin"] .round-super-actions .big-btn{min-height:var(--button-decision)!important;border-radius:var(--button-radius)!important}
body[data-motion-page="admin"] .round-quick-actions .big-btn,body[data-motion-page="admin"] .round-quick-actions .small-btn{min-height:var(--button-standard)!important}

/* Project and question editors: compact tools stay compact, while confirmation actions get a clear second tier. */
body[data-motion-page="editor"] .primary-btn,body[data-motion-page="editor"] .soft-btn,body[data-motion-page="editor"] .green-btn,body[data-motion-page="editor"] .danger-btn{min-height:var(--button-standard)!important}
body[data-motion-page="question-editor"] button{min-height:var(--button-compact)!important;border-radius:var(--button-radius-compact)!important}
body[data-motion-page="question-editor"] .toolbar-btn,body[data-motion-page="question-editor"] .nav-btn,body[data-motion-page="question-editor"] .top-save-stack button{min-height:var(--button-compact)!important;border-radius:var(--button-radius-compact)!important}
body[data-motion-page="question-editor"] .friendly-btn,body[data-motion-page="question-editor"] .history-actions .toolbar-btn{min-height:38px!important}
body[data-motion-page="question-editor"] .close-save-actions button{min-height:var(--button-standard)!important;border-radius:var(--button-radius)!important}

/* Player and media utilities: icon controls are compact, choice and submit actions are standard. */
body[data-motion-page="player"] .settings-btn,body[data-motion-page="player"] .screen-awake-enable,body[data-motion-page="player"] .screen-fullscreen-enable,.zoom-controls button,.display-fullscreen-btn{min-height:var(--button-compact)!important;border-radius:var(--button-radius-compact)!important}
body[data-motion-page="player"] .bid-preset-btn,body[data-motion-page="player"] .cat-choice-btn,body[data-motion-page="player"] .cat-price-btn,body[data-motion-page="player"] .modal-actions button,body[data-motion-page="player"] .auth-actions button{min-height:var(--button-standard)!important;border-radius:var(--button-radius)!important}
body[data-motion-page="question-player"] .media-control-panel button{min-height:var(--button-compact)!important;border-radius:var(--button-radius-compact)!important}

/* Site administration already uses standard buttons and compact table actions. */
.top-actions .button,.top-actions button{min-height:var(--button-standard)!important}.actions button{min-height:var(--button-compact)!important;border-radius:var(--button-radius-compact)!important}

@media(max-width:620px){.site-header .site-home-header,.site-header .mobile-auth-direct .nav-login,.site-header .mobile-auth-direct .button{min-height:var(--button-primary)!important;height:var(--button-primary)!important;border-radius:12px!important}.corp-hero .hero-actions .button{min-height:58px!important}.corp-hero .hero-actions .text-link{min-height:var(--button-standard)!important}.site-header .site-home-header{font-size:12px!important;padding-inline:12px!important}}