/* Shared web/native presentation. No overlay or timer blocks entry to work. */
:root {
  --accent:#3278aa; --green:#23745c; --amber:#94621d; --red:#b33940;
  --soft:#edf3f5;
}
body {
  background:radial-gradient(ellipse at 95% 0%, #dce9ef80, transparent 42%),
    radial-gradient(ellipse at 0% 30%, #e7e8db80, transparent 45%), var(--bg,#f4f3eb);
}
.btn:not(.ghost), .native-entry button,
main > form.card button, main.login button, main > form > button {
  color:#fff; border:1px solid #ffffff30; border-radius:12px;
  background:linear-gradient(145deg,#394443f2,#141b20fa 62%,#202b32);
  box-shadow:inset 0 1px 0 #ffffff29,0 3px 8px #14242c14;
  transition:background .18s ease,box-shadow .18s ease,transform .18s ease;
}
.btn:not(.ghost):hover:not(:disabled), .native-entry button:hover:not(:disabled) {
  color:#fff; background:linear-gradient(145deg,#45595af2,#202b35fa);
  box-shadow:inset 0 1px 0 #ffffff38,0 4px 12px #14242c24;
}
.btn:not(.ghost):active:not(:disabled), .native-entry button:active:not(:disabled) {transform:translateY(1px)}
.btn.danger {border-color:#d6757d;color:#ffdadd}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible {outline:3px solid #418fc6;outline-offset:3px}
.card {box-shadow:0 4px 20px #24435007}
.clock-card {background:linear-gradient(135deg,#172724,#1c2a36 75%,#29444e)}
.pill.blue {color:#225b83;background:#e1eef9}
.pill.green {color:#215f4c;background:#e1f1e8}
.pill.amber {color:#79501b;background:#fff0ce}
.pill.red {color:#993139;background:#fce5e7}
.native-entry {border:1px solid #ffffffb0;border-radius:26px;background:#ffffffb8;box-shadow:0 18px 65px #233e4810}
.native-entry h1 {font-size:28px;margin-bottom:12px}
.native-entry p {margin-top:14px;color:var(--muted,#53645e);font-size:14px;line-height:1.65}
.native-entry input {border:1px solid #bbc8c9;border-radius:10px;padding:12px;background:#fff;color:#172024}
.hanaman-entrance {position:relative;padding:20px 0 12px;overflow:hidden}
.hanaman-entrance img {display:block;animation:hanaman-reveal .85s cubic-bezier(.2,.7,.2,1) both;transform-origin:center}
.hanaman-entrance::after {content:"";display:block;height:2px;width:72px;margin:0 auto 16px;background:linear-gradient(90deg,#3c9386,#69a2c7,#c3aa7e);animation:hanaman-line .9s ease both}
@keyframes hanaman-reveal {from {opacity:0;transform:translateY(9px) scale(.97);filter:blur(3px)}to {opacity:1;transform:none;filter:none}}
@keyframes hanaman-line {from {opacity:0;transform:scaleX(.15)}to {opacity:1;transform:scaleX(1)}}
[data-theme=night] {--accent:#8ac2e9;--green:#8bd4b4;--amber:#edc079;--red:#f49ba1}
[data-theme=night] .native-entry {background:#202c32;border-color:#526168}
[data-theme=night] .pill.blue {background:#223e54;color:#b0dbf8}
[data-theme=night] .pill.green {background:#203f34;color:#b4e5cb}
[data-theme=night] .pill.amber {background:#44391f;color:#f7d999}
[data-theme=night] .pill.red {background:#4b2b32;color:#ffbec4}
@media(prefers-reduced-motion:reduce) {
  .hanaman-entrance img,.hanaman-entrance::after {animation:none}
  .btn:not(.ghost),.native-entry button {transition:none;transform:none!important}
}
/* Attention is reserved for an actual non-empty review queue. */
.review-attention {position:relative;border:1px solid #73a7d0!important;background:linear-gradient(135deg,#eef7ff,#fff)!important;color:#173b58!important;animation:hanaman-review 3s ease-out infinite}
@keyframes hanaman-review {0%,100% {box-shadow:0 0 0 0 #418fc600}25% {box-shadow:0 0 0 2px #418fc62b}75% {box-shadow:0 0 0 9px #418fc600}}
[data-theme=night] .review-attention {background:linear-gradient(135deg,#213d52,#202c32)!important;color:#d2ebff!important}
@media(prefers-reduced-motion:reduce) {.review-attention {animation:none}}
[data-theme=night] .native-entry img {filter:brightness(0) invert(1)}
@media(max-width:480px) {.native-entry {margin:6vh 16px;padding:28px 22px}.native-entry h1{font-size:26px}}
.activity-summary ul {list-style:none;margin:12px 0 0;padding:0}
.activity-summary li {border-left:2px solid #77a7bd;padding:2px 0 2px 12px;margin:12px 0;font-size:13px}
.activity-summary summary {cursor:pointer;color:var(--accent);font-size:13px;padding:10px 0}
.drive-file-row {display:flex;align-items:center;gap:10px;min-width:0}
.drive-file-row .drive-item {flex:1;min-width:0}
.drive-file-row .btn {flex-shrink:0}
dialog:has(.drive-document-preview) {width:calc(100vw - 16px);max-width:none;height:calc(100dvh - 16px);max-height:calc(100dvh - 16px);margin:auto;padding:18px;border-radius:18px}
.drive-image-pan {overflow:auto;max-height:calc(100dvh - 300px);min-height:200px;overscroll-behavior:contain;touch-action:pan-x pan-y pinch-zoom;margin-top:12px}
@media(max-width:480px) {.drive-file-row{flex-wrap:wrap;padding-bottom:12px}.drive-file-row .drive-item{flex-basis:100%}}
/* Pearl glass by day; retain the opal treatment at night. */
html:not([data-theme=night]) {--bg:#edf3f6;--card:#ffffffd9;--line:#d4e0e6;--soft:#e6eef3}
html:not([data-theme=night]) body {min-height:100dvh;background:radial-gradient(ellipse at 90% 0%,#cee5f0,transparent 55%),radial-gradient(ellipse at 0% 65%,#e2ece4,transparent 60%),#f3f6f8;background-attachment:fixed}
html:not([data-theme=night]) .btn:not(.ghost),html:not([data-theme=night]) .native-entry button {color:#234256;background:linear-gradient(145deg,#ffffffed,#e8f0f5d9);border-color:#bdcfdc;box-shadow:inset 0 1px 0 #fff,0 4px 14px #264e6810;backdrop-filter:blur(16px)}
html:not([data-theme=night]) .btn:not(.ghost):hover,html:not([data-theme=night]) .native-entry button:hover {background:linear-gradient(145deg,#fff,#dbeaf3);color:#173b58}
html:not([data-theme=night]) .btn.primary {background:linear-gradient(145deg,#e4f2fc,#c9dfec);border-color:#94b8ce;color:#173b58}
html:not([data-theme=night]) .btn.danger {color:#a03240;border-color:#dbaeb5}
.topbar {background:#f5f9fbc2;backdrop-filter:blur(22px) saturate(135%);-webkit-backdrop-filter:blur(22px) saturate(135%)}
[data-theme=night] .topbar {background:#18252b80;border-bottom:1px solid #ffffff0b}
[data-theme=night] .demo-strip {background:#18252b40}
.hanaman-entrance {isolation:isolate}
.hanaman-entrance::before {content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse,#7db6d759,transparent 65%);animation:hanaman-aura 1.7s ease-out both;pointer-events:none}
.hanaman-entrance img {animation:hanaman-reveal 1.25s cubic-bezier(.16,1,.3,1) both}
.hanaman-entrance::after {height:3px;width:110px;box-shadow:0 0 18px #62a9d14a;animation:hanaman-line 1.5s cubic-bezier(.16,1,.3,1) both}
@keyframes hanaman-reveal {0%{opacity:0;transform:translateY(18px) scale(.88);clip-path:inset(0 50%);filter:blur(6px)}55%{opacity:1;clip-path:inset(0 0);filter:blur(0)}100%{opacity:1;transform:none;clip-path:inset(0 0)}}
@keyframes hanaman-aura {0%{opacity:0;transform:scale(.3)}45%{opacity:1}100%{opacity:.3;transform:scale(1.2)}}
.document-spinner {display:inline-block;width:22px;height:22px;border:2px solid var(--line,#73877d);border-top-color:var(--accent);border-right-color:transparent;border-radius:50%;animation:document-turn .95s linear infinite;vertical-align:middle}
@keyframes document-turn {to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.hanaman-entrance img,.hanaman-entrance::before,.hanaman-entrance::after,.document-spinner{animation:none}}
.crew-publish-bar {position:sticky;top:78px;z-index:18;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px;margin-bottom:18px;border:1px solid var(--line);border-radius:16px;background:var(--card);backdrop-filter:blur(20px);box-shadow:0 5px 20px #173b5810}
.crew-publish-bar p{margin:5px 0 0}.crew-publish-bar .btn{flex-shrink:0}
@media(max-width:760px){.crew-publish-bar{top:66px;padding:12px;flex-wrap:wrap}.crew-publish-bar .btn{width:100%}}

/* Let the page colour flow through the masthead rather than a separate banner. */
.topbar {background:linear-gradient(180deg,#f5f9fb80,#f5f9fb25);border-bottom-color:#bccedc30;box-shadow:none}
[data-theme=night] .topbar {background:linear-gradient(180deg,#18252b55,#18252b15);border-bottom-color:#ffffff08}
.topbar .mobile-brand,.brand img {background:transparent}

.urgent-review{border:1px solid #d19455!important}.urgent-review>.eyebrow{color:var(--amber,#94621d)}
/* Desktop conversations retain their own list, history and composer. */
.team-chat{display:grid;grid-template-columns:320px minmax(0,1fr);height:calc(100dvh - 240px);min-height:430px;border:1px solid var(--border,#68736c);border-radius:16px;overflow:hidden;background:var(--card,#fff)}
.conversation-list{padding:16px;border-right:1px solid var(--border,#68736c);display:flex;flex-direction:column;min-height:0}.conversation-scroll{overflow:auto;flex:1;margin-top:12px}.conversation-item{display:grid;text-align:left;width:100%;gap:6px;padding:14px;border:0;border-bottom:1px solid #8893a333;background:transparent;color:inherit}.conversation-item small{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.conversation-item.selected{background:#72aeda26}.conversation-pane{display:flex;flex-direction:column;min-height:0;min-width:0;padding:16px}.conversation-pane>header{flex:none;border-bottom:1px solid #8893a333;padding-bottom:12px}.conversation-pane .chat-messages{flex:1;overflow:auto;min-height:0;max-height:none;padding:12px}.conversation-pane .chat-compose{flex:none;margin:0}.conversation-pane .chat-compose .field{flex:1}.conversation-pane textarea{min-height:64px;max-height:150px}.conversation-pane .chat-message{max-width:80%;width:fit-content;background:#87959b1c;border:1px solid #87959b33;border-radius:12px;padding:10px 14px;margin:10px 0}.conversation-pane .chat-message.mine{margin-left:auto;background:#5492bd26}.chat-message p{white-space:pre-wrap;overflow-wrap:anywhere}.chat-date{text-align:center;font-size:.85rem;opacity:.7}.chat-mobile-back{display:none}
@media(max-width:760px){.team-chat{display:block;height:calc(100dvh - 260px)}.conversation-list,.conversation-pane{height:100%}.team-chat .conversation-pane{display:none}.team-chat.conversation-open .conversation-list{display:none}.team-chat.conversation-open .conversation-pane{display:flex}.chat-mobile-back{display:inline-flex}}
.efficiency-workspace{display:grid;grid-template-columns:240px minmax(0,1fr);gap:20px}.efficiency-workspace aside{display:flex;flex-direction:column;gap:8px;align-self:start}.efficiency-workspace aside button{text-align:left;justify-content:flex-start}.efficiency-entries{max-height:65dvh;overflow:auto}.efficiency-entries p{margin:6px 0}.efficiency-workspace .field{flex:1}@media(max-width:760px){.efficiency-workspace{grid-template-columns:1fr}.efficiency-workspace aside{flex-direction:row;overflow:auto}.efficiency-workspace aside h2{display:none}.efficiency-workspace aside button{flex-shrink:0}}
@media(min-width:1000px){.main:has(.team-chat){padding:16px 24px;max-width:none}.main:has(.team-chat) .page-title{margin:8px 0;align-items:center}.main:has(.team-chat) .page-title h1{font-size:26px;margin:0}.main:has(.team-chat) .page-title p,.main:has(.team-chat) .page-title .eyebrow{display:none}.main:has(.team-chat) .team-chat{height:calc(100dvh - 280px);min-height:320px}.conversation-list>.row{gap:4px;flex-wrap:nowrap}.conversation-list>.row .btn{padding:7px 9px;font-size:12px}}
.brand a{display:block}.brand a:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.tracker-progress{display:grid;gap:12px}.tracker-progress>h3,.tracker-progress>p{margin:8px 0}.tracker-progress article{margin:0}

/* Optional details stay beside the conversation on desktop and overlay on phones. */
.team-chat{position:relative}.team-chat.details-open{grid-template-columns:300px minmax(260px,1fr) 250px}.chat-details-panel{overflow:auto;padding:16px;border-left:1px solid var(--line);background:var(--card)}.chat-details-panel h3{font-size:16px}.chat-details-panel a{overflow-wrap:anywhere}.chat-message-search{font-size:12px;padding:8px 0;display:flex;align-items:center;gap:10px}.chat-message-search input{min-width:0;flex:1;padding:7px}.chat-compose [readonly]{opacity:.7}
@media(max-width:1100px){.team-chat.details-open{grid-template-columns:300px minmax(0,1fr)}.chat-details-panel{position:absolute;right:0;top:0;bottom:0;width:min(320px,100%);z-index:3;box-shadow:-6px 0 20px #0003}}
@media(max-width:760px){.team-chat.details-open{display:block}}

@media(min-width:1000px){.main:has(.team-chat){position:relative;padding-top:12px}.main:has(.team-chat)>.app-back-row{display:none}.main:has(.team-chat)>.page-title{min-height:42px;margin:0 0 8px}.main:has(.team-chat)>.page-help{position:absolute;right:122px;top:16px;margin:0!important}.main:has(.team-chat) .team-chat{height:calc(100dvh - 180px)}}

.chat-avatar{float:left;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;margin-right:8px;background:#87afc32b;color:inherit;font-size:12px;font-weight:600}.chat-photo{display:block;max-width:min(260px,100%);max-height:200px;border-radius:10px;margin-top:8px;object-fit:contain}.chat-jump[hidden]{display:none!important}
/* Keep the phone composer above the navigation; history alone scrolls. */
@media(max-width:760px){
 .main:has(.team-chat){padding:10px 12px;position:relative}
 .main:has(.team-chat)>.app-back-row{display:none}
 .main:has(.team-chat)>.page-title{margin:0 0 8px;min-height:36px;align-items:center}
 .main:has(.team-chat)>.page-title h1{font-size:22px;margin:0}
 .main:has(.team-chat)>.page-title p,.main:has(.team-chat)>.page-title .eyebrow{display:none}
 .main:has(.team-chat)>.page-help{position:absolute;right:12px;top:8px;margin:0!important}
 .main:has(.team-chat)>.page-help .btn{font-size:11px;min-height:32px;padding:6px 9px}
 .main:has(.team-chat) .team-chat{height:calc(100dvh - 245px - env(safe-area-inset-top) - env(safe-area-inset-bottom));min-height:300px}
 .conversation-pane{padding:10px}
 .conversation-pane>header h2{font-size:16px;margin:0}
 .conversation-pane>header .row{gap:6px;min-width:0}
 .conversation-pane>header .btn,.conversation-pane>.row .btn{padding:7px 9px;min-height:36px;font-size:12px}
 .conversation-pane>header .chat-avatar{width:26px;height:26px;font-size:10px;flex-shrink:0}
 .conversation-pane textarea{min-height:48px}
 .conversation-pane .chat-compose{padding-top:8px}
}

/* Consistent action hierarchy on job, document and planning screens. */
.account-actions{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.crew-day-footer{display:flex;justify-content:flex-end;margin-top:20px;padding-top:14px;border-top:1px solid var(--line,#ffffff20)}
.btn.crew-discard{color:#ffd4d4;border:1px solid #e47b7b70;background:linear-gradient(135deg,#9b393950,#702d2d40);backdrop-filter:blur(12px)}
html[data-theme="day"] .btn.crew-discard{color:#922b2b;background:linear-gradient(135deg,#fff0f0cc,#f8d9d980);border-color:#bd656560}
.drive-file-row .drive-download{width:44px;height:44px;min-width:44px;padding:10px;display:inline-flex;justify-content:center;align-items:center}
.drive-download.is-downloaded{color:#b8f5cc!important;border-color:#64bb8680!important;background:linear-gradient(135deg,#236d4855,#194d3b70)!important}
html[data-theme="day"] .drive-download.is-downloaded{color:#17623b!important;background:#daf2e5!important}
.job-detail-layout .job-back-row{margin-bottom:16px}.job-detail-layout .page-title{margin-top:0}
.job-main-actions{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 24px}.job-main-actions>.btn{flex:1;min-width:160px}
.job-collaboration{padding:18px 0;margin-bottom:18px;border-block:1px solid var(--line,#ffffff20)}
.job-collaboration h2{font-size:14px;text-transform:uppercase;letter-spacing:.08em;opacity:.7;margin-bottom:12px}
.job-detail-layout [aria-label="Job records"]{gap:6px;flex-wrap:nowrap;overflow:auto;padding-bottom:8px;margin-bottom:20px}
.job-detail-layout [aria-label="Job records"] .btn{white-space:nowrap;flex-shrink:0;border-radius:12px}
.job-management{margin-top:24px}.job-management summary{cursor:pointer;font-weight:600;padding:8px 0}.job-management .row{margin-top:14px}
@media(max-width:600px){.drive-file-row{flex-wrap:nowrap}.drive-file-row .drive-item{flex-basis:auto}.drive-file-row .drive-item strong{overflow-wrap:anywhere}.job-main-actions{gap:8px}.job-main-actions>.btn{min-width:130px}.job-collaboration .btn{flex:1;min-width:140px}}
.desktop-account-actions{display:flex;gap:8px;padding:8px 0 16px;border-bottom:1px solid var(--line,#ffffff20);margin-bottom:10px}.desktop-account-actions .btn{flex:1;justify-content:center;font-size:13px}
.account-signout-footer{display:flex;justify-content:flex-end;margin-top:28px;padding-top:20px;border-top:1px solid var(--line,#ffffff20)}
.btn.signout-glass{color:#ffd4d4;border:1px solid #e47b7b70;background:linear-gradient(135deg,#9b393950,#702d2d40);backdrop-filter:blur(12px)}
html[data-theme="day"] .btn.signout-glass{color:#922b2b;background:linear-gradient(135deg,#fff0f0cc,#f8d9d980);border-color:#bd656560}
.btn.settings-gear,.desktop-account-actions .btn.settings-gear{flex:0 0 44px;width:44px;height:44px;padding:10px;display:inline-flex;align-items:center;justify-content:center}
.settings-gear svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linejoin:round}
html .btn.signout-glass{color:#ffd4d4!important;border-color:#e47b7b70!important;background:linear-gradient(135deg,#9b393950,#702d2d40)!important}
html[data-theme="day"] .btn.signout-glass{color:#922b2b!important;background:linear-gradient(135deg,#fff0f0ee,#f8d9d9bb)!important;border-color:#bd656580!important}
html button.destructive-glass,html input.destructive-glass{color:#ffd4d4!important;border:1px solid #e47b7b70!important;background:linear-gradient(135deg,#9b393960,#702d2d50)!important;backdrop-filter:blur(12px);box-shadow:inset 0 1px 0 #ffffff20,0 3px 12px #48111118}
html[data-theme="day"] button.destructive-glass,html[data-theme="day"] input.destructive-glass{color:#922b2b!important;border-color:#bd656580!important;background:linear-gradient(135deg,#fff0f0ee,#f8d9d9bb)!important}
.destructive-glass:focus-visible{outline:2px solid #db6262;outline-offset:3px}
