﻿/* Shared clear surfaces and controls. Layout and handwriting remain page-owned. */
:root { --surface:#fcfdfb; --surface-soft:#f2f5ee; --line:#dce4d5; --text-main:#3e4c39; --text-secondary:#74806c; --control-bg:#fff; --control-border:#d3ddcb; --control-shadow:none; --control-focus:#e3edd9; }
body::before { display:none!important; }
body,body.has-tabbar { background:#edf0ea; --brand:#596f4e; --brand-2:#75876a; --ink:#3e4939; --muted:#75806e; --shadow:0 5px 18px -15px rgba(57,75,46,.16); }
body .card,body.has-tabbar .card,body.has-tabbar .my-identity,body.has-tabbar .profile-hero { background:var(--surface); border:1px solid #e1e7dc; box-shadow:var(--shadow); }
body .topbar,body.has-tabbar .topbar,body .side,body .tabbar,body.has-tabbar .tabbar { background:#fafcf7; border-color:#e1e7dc; box-shadow:none; }
body .dialog { background:#fcfdfb; border:1px solid #e0e7d9; box-shadow:0 18px 60px -30px rgba(37,53,28,.25); padding:24px; }
body .overlay { background:rgba(44,57,36,.18); }
body .dialog h3 { font-size:20px; font-weight:500; margin-bottom:16px; }
body .dialog label { color:#66755c; margin-top:16px; }
body input:not([type="checkbox"]):not([type="radio"]),body textarea,body select,body .select-trigger { background:#fff; border:1px solid #d3ddcb; box-shadow:none; color:#3e4c39; }
body input:not([type="checkbox"]):not([type="radio"]):focus,body textarea:focus,body select:focus,body .select-trigger:focus-visible { background:#fff; border-color:#8da379; outline:2px solid #e2edd8; outline-offset:2px; box-shadow:none; }
body input::placeholder,body textarea::placeholder { color:#919b88; opacity:1; }
body .select-options { background:#fff; border:1px solid #dce5d4; box-shadow:0 8px 20px -14px rgba(53,75,38,.2); }
body .select-option[aria-selected="true"] { background:#eaf2e1; color:#4d653e; box-shadow:none; }
body .btn:not(.danger),body.has-tabbar .btn:not(.soft):not(.danger),body .dlg-actions .btn:not(.danger) { background:#edf4e5; border:1px solid #c8d9ba; color:#49633b; box-shadow:none; text-shadow:none; }
body .btn.soft,body.has-tabbar .btn.soft,body .dlg-actions .btn.soft { background:#f5f7f1; border-color:#e0e7d9; color:#6b775f; }
body .btn:not(.danger):hover,body.has-tabbar .btn:not(.danger):hover { background:#e5efdc; filter:none; }
body .btn:disabled { opacity:.55; }
body .dlg-actions { gap:12px; margin-top:24px; }
body .dlg-actions .btn { min-height:44px; font-weight:500; }
body .service-rating { gap:2px; flex-wrap:wrap; }
body .service-rating-star { min-width:40px; min-height:44px; font-size:30px; color:#dce3d5; text-shadow:none; }
body .service-rating-star.selected,body .service-rating-star:hover { color:#b99a56; }
body .plan-card,body .stage-focus,body .arcglass,body .rk-types,body .supervisor-goal-filter { background:#f7faf3; border-color:#e0e7d9; box-shadow:none; }
body .stage-focus-glow { display:none; }
body.has-tabbar .my-page .my-next-step { background:#f6f9f1; }
body .profile-metrics>div,body .work-summary>span { background:#fafcf7; }
body .tabbar button.active svg { filter:none; }
@media(max-width:480px) { body .dialog { padding:22px 20px; } body .dialog input:not([type="checkbox"]):not([type="radio"]),body .dialog textarea,body .dialog select { font-size:16px; } }
/* Keep ranking switches stationary even when result length changes. */
html { scrollbar-gutter:stable; }
body .rank-card .rk-type:active { transform:none; }
body .rank-card .rk-label { transition:background .15s,color .15s; }
body .rank-card .rk-body { overflow-anchor:none; }
input[type="date"]::-webkit-calendar-picker-indicator { pointer-events:none; opacity:.55; }
.clear-date-picker { position:fixed; z-index:1000; width:min(310px,calc(100vw - 16px)); padding:14px; background:#fcfdfb; border:1px solid #d8e3ce; border-radius:18px; box-shadow:0 10px 30px -15px #52634440; color:#526548; }
.clear-date-picker button { font:inherit; color:inherit; background:transparent; border:1px solid transparent; border-radius:10px; min-height:36px; cursor:pointer; }
.date-head,.date-foot { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.date-head b { font-weight:500; }.date-head button { min-width:40px; font-size:23px; }
.date-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:3px; margin:12px 0; text-align:center; }
.date-grid>span { font-size:12px; color:#89967d; }.date-grid button { min-width:0; padding:0; }
.clear-date-picker button:hover,.date-grid button[aria-pressed="true"] { background:#eaf3df; border-color:#c5d6b5; }
.clear-date-picker button:disabled { opacity:.35; cursor:default; }.date-foot button { font-size:13px; }
