.portal-main { max-width: 1260px; width: min(1260px,calc(100% - 56px)); margin: 34px auto 80px; }
.portal-main [hidden], .portal-dialog [hidden], .notification-dock [hidden] { display: none !important; }
.portal-heading { display: flex; justify-content: space-between; align-items: center; gap: 24px; margin-bottom: 28px; }
.portal-heading > div { min-width:0; }
.portal-heading h1 { margin: 0 0 8px; font-size: clamp(30px,4vw,48px); }
.project-picker { max-width: 100%; color: #edf5ff; background: transparent; border: 0; font: 600 clamp(27px,4vw,44px)/1.2 "Google Sans Flex",sans-serif; padding: 0 30px 5px 0; cursor: pointer; letter-spacing: -.035em; }
.project-picker option { color: #edf5ff; background: #122b43; font-size: 18px; }
.portal-subtitle { margin: 4px 0 0; color: #a8bfd8; font-size: 14px; }
.portal-toolbar { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.portal-action { position: relative; overflow: hidden; display: inline-flex; justify-content: center; align-items: center; gap: 8px; min-height: 44px; padding: 12px 22px; border: 1px solid #a9cfff38; border-radius: 999px; background: #a9cfff; color: #102b45; font: 600 14px/1.4 "Google Sans Flex",sans-serif; cursor: pointer; text-decoration: none; box-shadow: inset 0 1px #fff3,0 4px 12px #0002; transition: transform 180ms,background 200ms; }
.portal-action:hover { background: #c9e2ff; }.portal-action:active { transform: scale(.96); }.portal-action:disabled { opacity: .5; cursor: wait; }
.portal-action.secondary { background: #a9cfff0d; color: #bedbff; box-shadow: none; }.portal-action.secondary:hover { background: #a9cfff23; }
.portal-action.animated-action { --action-ink: #102b45; }.portal-action.secondary.animated-action { --action-ink: #bedbff; }
.portal-main .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.portal-action.danger { color: #ffb5b5; background: #ff77770c; border-color: #ff999940; }
.portal-action.danger.animated-action { --action-ink:#ffb5b5; }
/* The account page's general link colour must not override button contrast. */
.account-main a.portal-action { color:#102b45; }
.account-main a.portal-action.secondary { color:#bedbff; }
.account-main a.portal-action.danger { color:#ffb5b5; }
.account-delete { border-color:#ff999930; margin-top:28px; min-height:0; }.account-delete>p,.account-delete form>p { line-height:1.7; color:#b9cce2; font-size:14px; }.account-delete summary { cursor:pointer; color:#ffb5b5; padding:12px 0; font-size:14px; }.account-delete .portal-form { max-width:560px; margin-top:18px; }.account-delete .portal-error:empty { display:none; }
.portal-tabs { display: flex; gap: 6px; border-bottom: 1px solid #a9cfff26; margin-bottom: 26px; overflow-x: auto; padding: 0 0 12px; }
.portal-tabs a { display: inline-block; white-space: nowrap; padding: 12px 18px; border-radius: 18px; text-decoration: none; font-size: 14px; transition: background 220ms; }
.portal-tabs a[aria-current="page"] { color: #102b45; background: #b4d5ff; font-weight: 600; }.portal-tabs a:hover:not([aria-current]) { background: #a9cfff12; }
.portal-grid { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(250px,1fr); gap: 24px; align-items: start; }
.portal-card { border: 1px solid #a9cfff27; border-radius: 28px; padding: clamp(22px,3vw,32px); background: linear-gradient(145deg,#1b3a53bd,#10253de0); box-shadow: inset 0 1px #ffffff08; min-width: 0; }
.portal-card + .portal-card { margin-top: 22px; }.portal-card h2 { font-size: 24px; margin-bottom: 18px; }.portal-card h3 { font-size: 18px; }
.portal-card p { line-height: 1.7; }.portal-card p:last-child { margin-bottom: 0; }
.portal-kicker { color: #aacfff; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; margin: 0 0 12px; font-weight: 650; }
.portal-next { background: linear-gradient(125deg,#2e5875,#163950); border-color: #acdaff59; }
.portal-badge { display: inline-block; font-size: 12px; padding: 5px 10px; background: #a9cfff16; border: 1px solid #a9cfff24; border-radius: 12px; color: #c5e0ff; }
.portal-badge.green { color: #b4ead2; background: #7bdfb216; }.portal-badge.amber { color: #ffe0ae; background: #f0bd6412; }
.portal-empty { color: #9fb9d3; line-height: 1.7; padding-block: 12px; }
.portal-progress { height: 7px; border-radius: 99px; overflow: hidden; background: #a9cfff1a; margin: 20px 0; }.portal-progress span { display: block; height: 100%; border-radius: inherit; background: #b5d7ff; transition: width 550ms cubic-bezier(.2,.8,.2,1); }
.portal-timeline { padding: 0; list-style: none; margin: 0; }.portal-timeline li { display: flex; gap: 14px; align-items: baseline; padding: 12px 0; color: #a6bdd5; }.portal-timeline li::before { content: ''; width: 8px; height: 8px; flex: 0 0 8px; border-radius: 50%; background: #a9cfff36; }.portal-timeline li.current { color: #e6f1ff; font-weight: 600; }.portal-timeline li.current::before { background: #b5d7ff; box-shadow: 0 0 14px #90c5ff70; }
.portal-list { list-style: none; padding: 0; margin: 0; }.portal-list > li { padding: 16px 0; border-bottom: 1px solid #a9cfff1c; }.portal-list > li:last-child { border: 0; }.portal-list time, .portal-meta { display: block; font-size: 12px; color: #8faac6; margin-top: 6px; }.portal-list p { margin: 7px 0; }
.portal-row { display: flex; gap: 18px; justify-content: space-between; align-items: center; }.portal-row > * { min-width: 0; }
.portal-text { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.75; }.portal-total { font-size: 30px; color: #c9e3ff; letter-spacing: -.03em; }
.portal-chat { max-height: 430px; min-height: 160px; overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; gap: 14px; padding-right: 8px; }
.portal-message { max-width: 88%; align-self: flex-start; padding: 14px 18px; border-radius: 20px 20px 20px 6px; background: #a9cfff10; border: 1px solid #a9cfff1a; }.portal-message.mine { align-self: flex-end; background: #a9cfff22; border-radius: 20px 20px 6px 20px; }.portal-message p { margin: 5px 0; white-space: pre-wrap; overflow-wrap: anywhere; }.portal-message small { font-size: 11px; color: #a8c1db; }
.portal-form { display: grid; gap: 18px; }.portal-form label { display: grid; gap: 8px; font-size: 14px; color: #cbdff6; }.portal-form input:not([type=checkbox]), .portal-form select, .portal-form textarea, .crm-search { width: 100%; border: 1px solid #a9cfff40; border-radius: 14px; padding: 13px 15px; background: #091d30; color: #e8f2ff; font: inherit; min-width: 0; }.portal-form textarea { resize: vertical; min-height: 100px; }.portal-form textarea.tall { min-height: 240px; }
.portal-form .checkline { display: flex; gap: 12px; align-items: flex-start; line-height: 1.6; }.checkline input { margin-top: 5px; accent-color: #b5d7ff; width: 18px; height: 18px; flex-shrink: 0; }.portal-form fieldset { border: 0; padding: 0; margin: 0; }.portal-form legend { margin-bottom: 10px; }
.portal-form .portal-toolbar { margin-top: 6px; }.portal-chat + .portal-form { margin-top: 24px; padding-top: 22px; border-top: 1px solid #a9cfff22; }
.portal-dialog { width: min(660px,calc(100vw - 28px)); max-height: calc(100svh - 40px); padding: 0; color: #e8f2ff; border: 1px solid #a9cfff40; border-radius: 30px; background: #10263cf5; box-shadow: 0 28px 100px #0008; color-scheme: dark; }
.portal-dialog::backdrop { background: #020a16a6; backdrop-filter: blur(10px); }.portal-dialog-head { position: sticky; top: 0; z-index: 1; background: #10263cf5; display: flex; justify-content: space-between; gap: 18px; align-items: center; padding: 20px 28px; border-bottom: 1px solid #a9cfff26; }.portal-dialog-head h2 { font-size: 22px; margin: 0; }.portal-dialog-body { padding: 28px; }.portal-dialog-body > p { line-height: 1.7; color: #b9cce2; }
.portal-error { color: #ffc0c0; font-size: 14px; white-space: pre-wrap; }.portal-status { color: #b5d7ff; min-height: 22px; font-size: 14px; }.portal-agreement { max-height: 300px; overflow-y: auto; border: 1px solid #a9cfff28; padding: 20px; border-radius: 16px; background: #081b2a; }
.crm-summary { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; margin-bottom: 26px; }.crm-summary .portal-card { margin: 0; padding: 22px 26px; }.crm-summary strong { display: block; font-size: 34px; margin-bottom: 4px; }.crm-summary span { color: #aac2db; font-size: 14px; }
.crm-board { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; align-items: start; }.crm-column { border-radius: 24px; background: #a9cfff07; padding: 18px; border: 1px solid #a9cfff17; }.crm-column h2 { font-size: 16px; padding: 0 4px; }.crm-project { display: block; border-radius: 18px; padding: 18px; margin: 12px 0 0; text-decoration: none; border: 1px solid #a9cfff2c; background: #19354b; transition: transform 220ms,background 220ms; }.crm-project:hover { transform: translateY(-3px); background: #224761; }.crm-project strong { display: block; margin-bottom: 9px; }.crm-project p { font-size: 13px; margin: 10px 0 0; }
.crm-requests { margin-bottom: 30px; }.crm-search { margin-bottom: 24px; max-width: 440px; }
.notification-dock { position: fixed; z-index: 100; right: 24px; bottom: 24px; font-family: "Google Sans Flex",sans-serif; color: #e8f2ff; }.notification-bell { width: 54px; height: 54px; border-radius: 20px; border: 1px solid #a9cfff55; color: #c5e0ff; background: #15334de8; backdrop-filter: blur(16px); cursor: pointer; box-shadow: 0 8px 30px #0004; }.notification-bell svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.6; }.notification-count { position: absolute; right: -5px; top: -6px; min-width: 21px; height: 21px; padding: 2px 5px; border-radius: 99px; background: #b5d7ff; color: #102a42; font: 600 11px/17px sans-serif; }
.notification-panel { position: absolute; right: 0; bottom: 68px; width: min(380px,calc(100vw - 32px)); max-height: min(540px,70svh); overflow-y: auto; border: 1px solid #a9cfff36; border-radius: 26px; padding: 24px; background: #10283ff5; backdrop-filter: blur(20px); box-shadow: 0 22px 90px #0007; }.notification-panel h2 { margin: 0 0 18px; font-size: 22px; }.notification-item { width: 100%; display: block; border: 0; border-bottom: 1px solid #a9cfff20; padding: 15px 0; background: transparent; color: #e0edff; text-align: left; font: 14px/1.6 "Google Sans Flex",sans-serif; cursor: pointer; }.notification-item.read { opacity: .65; }.notification-item small { display: block; color: #8caac9; }.notification-panel .portal-toolbar { margin-block: 16px; }.notification-panel label { display: flex; justify-content: space-between; padding: 10px 0; font-size: 14px; }.notification-panel input { accent-color: #b5d7ff; }
.plan-picker { margin-top: 24px; padding: 20px; border-radius: 20px; background: #a9cfff09; border: 1px solid #a9cfff25; }.plan-picker > p { margin-top: 0; line-height: 1.7; font-size: 13px; }.plan-picker label { margin-bottom: 16px; }.plan-picker .checkline { font-size: 13px; }.plan-price { font-size: 14px; color: #b5d7ff; margin-top: 8px; }
@media (max-width: 600px) {
  .portal-main :is(.portal-card, .portal-form, .portal-row, .portal-toolbar, .board-composer) { min-width: 0; }
  .portal-main .portal-toolbar, .portal-dialog .portal-toolbar { flex-wrap: wrap; }
  .portal-main :is(input, select, textarea), .portal-dialog :is(input, select, textarea), .account-page :is(input, select, textarea) { font-size: 16px; }
  .portal-main .portal-action, .portal-dialog .portal-action { min-height: 44px; max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
  .portal-main :is(h1, h2, h3, p, a), .portal-dialog :is(h1, h2, h3, p, a) { overflow-wrap: anywhere; }
  .portal-main .portal-form select, .portal-dialog .portal-form select { max-width: 100%; }
}
@media(max-width:850px) { .portal-main { width: calc(100% - 32px); }.portal-grid,.crm-board { grid-template-columns: 1fr; }.portal-heading { align-items: flex-start; flex-direction: column; }.portal-heading > div { max-width: 100%; }.project-picker { font-size: 30px; }.crm-summary { gap: 8px; }.crm-summary .portal-card { padding: 18px 14px; }.crm-summary span { font-size: 12px; }.crm-summary strong { font-size: 27px; }.portal-dialog-body { padding: 22px; }.portal-dialog-head { padding: 16px 22px; }.notification-dock { right: 16px; bottom: 16px; } }
@media(prefers-reduced-motion:reduce) { .portal-main *, .portal-dialog *, .notification-dock * { animation: none !important; transition: none !important; } }

/* Project workspace: quiet depth, with progress leading the page. */
body[data-account-route="workspace"],body[data-account-route="admin"] { background: radial-gradient(ellipse at 9% 15%,#1d4a6938,transparent 42%),radial-gradient(ellipse at 86% 42%,#20548720,transparent 45%),linear-gradient(150deg,#0c2239,#071424 75%); }
.portal-main { position: relative; isolation: isolate; }
.portal-main::before { content:''; position:absolute; z-index:-1; inset:100px -24px 0; opacity:.18; pointer-events:none; background-image:radial-gradient(#91bff53a .7px,transparent .7px); background-size:24px 24px; mask-image:linear-gradient(transparent,#000 120px,#000 70%,transparent); }
.portal-heading .project-title { margin:0; }.portal-heading { padding:12px 0 8px; }
.portal-tabs { position:relative; isolation:isolate; border-bottom:0; padding:6px; gap:4px; background:#a9cfff07; border:1px solid #a9cfff17; border-radius:24px; margin-bottom:32px; scroll-behavior:smooth; }
.portal-tabs { scrollbar-width: thin; scrollbar-color: #5d82a8 transparent; scroll-padding-inline: 8px; }
.portal-tabs a { position:relative; z-index:1; flex-shrink:0; color:#c2d6ec; transition:color 180ms; }
.portal-tabs a[aria-current="page"] { background:transparent; color:#f5f9ff; }
.portal-tabs a:hover { color:#fff; }
.portal-tabs a:focus-visible { outline-offset:-3px; }
.portal-tab-indicator { position:absolute; top:6px; z-index:0; border-radius:18px; border:1px solid #b8dcff55; background:linear-gradient(135deg,#305577,#244a69); box-shadow:inset 0 1px #ffffff12,0 3px 15px #00152835; pointer-events:none; }
@media (max-width:600px) {
  .portal-main .portal-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); overflow:visible; }
  .portal-main .portal-tabs a { min-width:0; min-height:44px; display:flex; align-items:center; justify-content:center; text-align:center; white-space:normal; overflow-wrap:anywhere; padding:10px; }
}
.overview-pair { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:24px; align-items:stretch; }
.overview-pair>.portal-card { margin:0; }.overview-secondary { margin-top:24px; }
.live-progress { background:radial-gradient(ellipse at top left,#39719848,transparent 75%),linear-gradient(135deg,#1d405a,#112c44); border-color:#a9cfff45; display:flex; flex-direction:column; }
.live-progress h2 { max-width:440px; font-size:clamp(26px,3vw,34px); letter-spacing:-.04em; margin:12px 0; }
.live-progress .work-caption { flex:1; min-height:44px; margin-bottom:24px; }.live-progress>.portal-row:last-child { margin-top:10px; gap:16px; font-size:14px; }
.live-indicator { height:14px; width:14px; display:block; border-radius:50%; border:2px solid #a9cfff50; }
.live-indicator.is-working { width:22px; height:22px; border:2px solid #bddfff35; border-top-color:#c4e2ff; border-right-color:#c4e2ff; animation:live-work-spin 1.1s linear infinite; }
.activity-preview .portal-row>a { font-size:13px; white-space:nowrap; }.activity-preview .portal-list { margin-top:8px; }.activity-preview .portal-list li { font-size:14px; }.activity-preview h2 { margin-bottom:0; }
.overview-pair + .portal-next { margin-top:24px; display:flex; align-items:center; justify-content:space-between; gap:24px; }.portal-next h2 { margin:0; }
.section-intro { display:flex; justify-content:space-between; align-items:center; gap:28px; margin-bottom:28px; }.section-intro>div { max-width:680px; }.section-intro h2 { font-size:clamp(28px,3vw,38px); letter-spacing:-.04em; }.section-intro p { line-height:1.75; margin-bottom:0; }.section-intro .portal-kicker { margin-bottom:10px; }
.progress-section { padding:18px 6px 34px; }.progress-stage-row { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin:32px 0; }.progress-stage { border-top:2px solid #a9cfff25; padding:18px 10px 0 0; color:#8daac6; }.progress-stage>span { display:block; margin-bottom:12px; font-size:12px; }.progress-stage strong { font-size:14px; font-weight:500; }.progress-stage.current { border-color:#b5d7ff; color:#e4f0ff; }.progress-stage.current>span { color:#b5d7ff; }
.progress-section>.portal-row { margin-top:32px; }.progress-section>.portal-progress { margin-bottom:32px; }
.milestone-path { padding:0; margin:20px 0; list-style:none; }.milestone-path li { display:flex; gap:18px; align-items:center; padding:20px 4px; border-bottom:1px solid #a9cfff20; }.milestone-path li>strong { flex:1; font-weight:500; }.milestone-check { display:grid; place-items:center; border-radius:14px; background:#a9cfff10; color:#a9cfff; width:36px; height:36px; }.milestone-path .done .milestone-check { background:#90d9ba20; color:#b4ead2; }.milestone-path small { color:#8ba8c4; }
.project-decisions { border-top:1px solid #a9cfff26; padding-top:32px; }.project-decisions>.portal-card { margin-bottom:22px; }
.drawing-board { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; align-items:start; }
.board-workspace { display:grid; grid-template-columns:minmax(330px,.85fr) minmax(0,1.15fr); gap:28px; align-items:start; }
.board-composer { border:1px solid #a9cfff3d; border-radius:26px; background:linear-gradient(140deg,#1c3b53d9,#112940f2); padding:26px; scroll-margin-top:150px; }
.board-composer>h3 { font-size:22px; margin:0 0 22px; letter-spacing:-.025em; }.board-compose-fields { display:grid; gap:18px; }.board-composer textarea { min-height:120px; }
.board-composer .upload-drop { padding:18px; font-size:13px; transition:background 180ms,border-color 180ms; }.board-composer .upload-drop.is-dragging { background:#a9cfff20; border-color:#c4e1ff; }
.board-composer input[type=file] { padding:0; border:0; border-radius:0; background:none; font-size:12px; }.board-composer input::file-selector-button { border:1px solid #a9cfff45; border-radius:99px; background:#a9cfff18; color:#d4e6ff; padding:9px 14px; font:inherit; margin-right:10px; cursor:pointer; }
.board-composer .upload-drop small { font-size:11px; line-height:1.5; }.board-composer .portal-toolbar { justify-content:flex-end; }.board-composer .portal-error:empty { display:none; }.board-composer [data-attachments-preview]:empty { display:none; }
.board-feed { min-width:0; }.board-feed>h3 { display:flex; align-items:center; gap:10px; font-size:17px; margin:0 0 20px; }.board-item-count { padding:3px 9px; border:1px solid #a9cfff30; border-radius:99px; color:#abc9e7; font-size:12px; }
.board-feed .drawing-board { grid-template-columns:minmax(0,1fr); }.board-feed .board-empty { padding:36px 22px; border-radius:24px; }.board-feed .board-empty h3 { font-size:18px; margin:0; }.board-feed .board-empty p { margin:10px auto 0; font-size:14px; }
.board-inline-reply { margin-top:16px; border-top:1px solid #a9cfff26; padding-top:16px; }.board-inline-reply summary,.board-existing summary { color:#b5d7ff; font-size:13px; cursor:pointer; }.board-inline-reply .portal-form { margin-top:16px; }.board-inline-reply[open] .portal-form { animation:board-reply-in 220ms ease-out; }
.board-composer .composer-attachment { padding:0 0 18px; }.board-composer .composer-attachment>.portal-row { flex-wrap:wrap; gap:10px; }.board-composer .composer-attachment .portal-action { font-size:12px; padding:8px 14px; min-height:36px; }
@keyframes board-reply-in { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:none; } }
@media(max-width:850px) { .board-workspace { grid-template-columns:minmax(0,1fr); gap:28px; }.board-composer { padding:22px; } }
.drawing-card { border:1px solid #a9cfff30; padding:26px; border-radius:28px; background:linear-gradient(140deg,#203e55dc,#122940eb); box-shadow:0 12px 40px #00101d20,inset 0 1px #ffffff08; min-width:0; transition:border-color 220ms; }.drawing-card:hover { border-color:#a9cfff58; }
.drawing-card>header { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:18px; }.drawing-card h3 { font-size:22px; letter-spacing:-.025em; }.board-kind { color:#9ebbd7; font-size:12px; }.drawing-card>.portal-text { margin-top:12px; }
.board-attachment { margin:20px 0; border:1px solid #a9cfff24; border-radius:18px; overflow:hidden; background:#071a2c; }.board-attachment figcaption { padding:12px 16px; display:flex; flex-wrap:wrap; justify-content:space-between; gap:6px; font-size:13px; }.board-attachment figcaption>a { overflow-wrap:anywhere; }.board-attachment small { color:#89a7c4; }.board-attachment video { display:block; width:100%; max-height:400px; background:#06121f; }.board-attachment audio { display:block; width:100%; padding:12px; }
.board-image { position:relative; width:100%; }.board-image img { display:block; width:100%; height:auto; }.image-pin { position:absolute; transform:translate(-50%,-50%); display:grid; place-items:center; width:26px; height:26px; border-radius:50%; border:2px solid #fff; background:#1468ad; color:#fff; font:600 12px/1 sans-serif; box-shadow:0 2px 10px #001a3f77; pointer-events:none; }
.pin-notes { font-size:13px; padding:0 20px 14px 36px; color:#c5dcf1; line-height:1.7; }.pin-notes li+li { margin-top:8px; }
.board-responses { border-left:2px solid #a9cfff40; padding-left:16px; margin:20px 0; font-size:14px; }.board-responses p { white-space:pre-wrap; margin-bottom:6px; }.board-responses small { color:#8ba9c4; font-size:11px; }.board-library { border-top:1px solid #a9cfff20; margin-top:40px; padding-top:28px; }
.board-empty { grid-column:1/-1; border:1px dashed #a9cfff45; border-radius:30px; padding:64px 28px; text-align:center; background:#a9cfff05; }.board-empty>span { color:#c1deff; font-size:48px; }.board-empty h3 { margin-top:16px; font-size:24px; }.board-empty p { max-width:490px; margin:12px auto 26px; line-height:1.8; }
.upload-drop { padding:24px; border:1px dashed #a9cfff60; border-radius:20px; background:#a9cfff08; }.upload-drop small { color:#91acc8; }.composer-attachment { border-bottom:1px solid #a9cfff24; padding-bottom:22px; margin-bottom:22px; }.composer-attachment>.portal-row strong { overflow-wrap:anywhere; font-size:14px; }.annotation-image { cursor:crosshair; border-radius:14px; overflow:hidden; margin-bottom:12px; }.composer-pins { display:grid; gap:12px; margin-top:18px; }.pin-remove { justify-self:start; border:0; background:transparent; color:#ffb5b5; cursor:pointer; padding:6px 0; }.existing-attachments { display:grid; gap:12px; margin-top:18px; }
.history-stream { list-style:none; padding:0; margin:0; }.history-stream li { display:flex; gap:24px; position:relative; padding:24px 0; border-bottom:1px solid #a9cfff17; }.history-stream li>div { flex:1; }.history-stream h3 { font-size:17px; font-weight:500; line-height:1.6; }.history-stream p { font-size:13px; margin:5px 0 0; color:#8ca9c3; }.history-stream time { color:#a2bbd4; font-size:13px; white-space:nowrap; padding-top:4px; }.history-dot { flex:0 0 8px; height:8px; background:#aacfff; border-radius:50%; margin-top:10px; box-shadow:0 0 0 6px #a9cfff0a; }
.credential-policy { display:flex; gap:22px; padding:26px; background:#86b6da0c; border:1px solid #a9cfff30; border-radius:24px; margin-bottom:26px; }.credential-policy svg { flex:0 0 30px; width:30px; height:30px; fill:none; stroke:#b7d8ff; stroke-width:1.5; }.credential-policy p { line-height:1.75; font-size:14px; margin:8px 0; }.credential-policy small { color:#aad8c9; }.credential-list .portal-card { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:22px 26px; }.credential-requests { margin-top:32px; }.credential-form-note { font-size:13px; color:#b9cce2; line-height:1.7; }
.quick-chat-dock { position:fixed; z-index:100; right:88px; bottom:24px; color:#e9f2ff; font-family:"Google Sans Flex",sans-serif; }.quick-chat-dock[hidden],.quick-chat-panel[hidden] { display:none !important; }.quick-chat-panel { position:absolute; bottom:68px; right:-64px; width:min(410px,calc(100vw - 32px)); max-height:calc(100svh - 145px); overflow-y:auto; border:1px solid #a9cfff45; border-radius:28px; background:#10283ff7; backdrop-filter:blur(22px); box-shadow:0 20px 90px #0008; }
.quick-chat-heading { position:sticky; top:0; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:16px; background:#18354b; padding:18px 22px; }.quick-chat-heading strong { display:block; font-size:16px; }.quick-chat-heading small { display:block; font-size:11px; color:#9cb8d3; margin-top:4px; }.quick-chat-heading button { border:0; background:transparent; color:#c9e1ff; padding:4px 8px; font-size:24px; cursor:pointer; }
.quick-chat-panel>.portal-card { border:0; background:none; padding:20px; border-radius:0; box-shadow:none; }.quick-chat-panel .portal-row h2 { display:none; }.quick-chat-panel .portal-badge { margin-bottom:16px; font-size:11px; }.quick-chat-panel .portal-chat { max-height:230px; min-height:110px; font-size:14px; }.quick-chat-panel .portal-form { gap:10px; margin-top:16px; padding-top:16px; }.quick-chat-panel .portal-form textarea { min-height:70px; max-height:140px; }.quick-chat-panel .portal-meta { font-size:11px; line-height:1.6; }.quick-chat-panel .portal-error:empty { display:none; }
.chat-media-link { border:0; border-top:1px solid #a9cfff25; color:#b5d7ff; background:#a9cfff05; font:500 13px/1.6 "Google Sans Flex",sans-serif; width:100%; padding:16px 20px; cursor:pointer; }.chat-media-link:hover { background:#a9cfff12; }
/* A non-modal guide: the dashboard stays clear, readable and interactive. */
.project-tour { position:fixed; z-index:120; visibility:hidden; box-sizing:border-box; width:min(320px,calc(100vw - 24px)); max-height:min(300px,46svh); overflow-y:auto; padding:18px; border:1px solid #a9cfff65; border-radius:22px; background:linear-gradient(145deg,#1c3c54,#11283e); color:#e8f2ff; box-shadow:0 12px 32px #00101d55,inset 0 1px #ffffff0d; font-family:"Google Sans Flex",sans-serif; }
.tour-topline { display:flex; justify-content:space-between; align-items:center; gap:12px; color:#a9cfff; font-size:10px; font-weight:650; letter-spacing:.1em; }
.tour-count { margin-left:8px; color:#9cb6ce; letter-spacing:0; }
.tour-dismiss { display:grid; place-items:center; width:28px; height:28px; padding:0; border:0; border-radius:50%; background:transparent; color:#c3d9ed; font:24px/1 sans-serif; cursor:pointer; }
.tour-dismiss:hover,.tour-previous:hover { background:#a9cfff18; }
.project-tour h2 { margin:10px 0 7px; font-size:19px; line-height:1.25; letter-spacing:-.025em; }
.project-tour .tour-copy p { margin:0; color:#c3d9ed; font-size:13px; line-height:1.6; }
.tour-controls { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:16px; }
.tour-controls>div { display:flex; align-items:center; gap:8px; }
.tour-controls .portal-action { min-height:38px; padding:9px 16px; font-size:12px; }
.tour-skip,.tour-previous { border:0; background:transparent; color:#aac6de; font:500 12px/1.4 "Google Sans Flex",sans-serif; cursor:pointer; }
.tour-skip { padding:10px 0; }.tour-skip:hover { color:#edf5ff; }.tour-previous { width:32px; height:36px; border-radius:12px; font-size:18px; }
.project-tour button:focus-visible { outline:2px solid #c9e2ff; outline-offset:3px; }
.project-tour .portal-error:empty { display:none; }.project-tour .portal-error { margin:10px 0 0; font-size:12px; }
.tour-highlight { outline:2px solid #b3d8ff; outline-offset:5px; scroll-margin-block:140px 100px; }
@media(max-width:600px) { .project-tour { padding:14px 16px; width:min(300px,calc(100vw - 24px)); border-radius:20px; }.project-tour h2 { font-size:18px; }.tour-controls { margin-top:12px; } }
@media(prefers-reduced-motion:reduce) { .project-tour * { animation:none !important; transition:none !important; } }
.retention-project { padding:20px 0; border-top:1px solid #a9cfff25; }.retention-project .checkline { display:flex; align-items:flex-start; gap:12px; line-height:1.7; font-size:14px; margin:16px 0; }.retention-project p { font-size:13px; line-height:1.7; }
@keyframes live-work-spin { to { transform:rotate(360deg); } }
@media(max-width:850px) { .overview-pair,.drawing-board { grid-template-columns:1fr; }.progress-stage-row { grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px 12px; }.section-intro { align-items:flex-start; flex-direction:column; gap:18px; }.overview-pair+.portal-next { flex-direction:column; align-items:flex-start; }.credential-list .portal-card { align-items:flex-start; flex-direction:column; gap:16px; }.history-stream li { flex-wrap:wrap; gap:14px; }.history-stream li>div { flex:1 1 calc(100% - 28px); }.history-stream time { margin-left:22px; }.quick-chat-dock { right:80px; bottom:16px; }.portal-tabs a { padding:11px 14px; font-size:13px; }.drawing-card { padding:22px; }.live-progress .portal-row:last-child { flex-wrap:wrap; } }
@media(prefers-reduced-motion:reduce) { .live-indicator.is-working { animation:none !important; border-color:#b4ead2; }.quick-chat-dock * { animation:none !important; transition:none !important; } }

.roadmap-summary { display:flex; align-items:center; gap:40px; padding:26px 30px; margin-bottom:30px; border:1px solid #a9cfff35; border-radius:26px; background:radial-gradient(ellipse at top left,#35648040,transparent 75%),#102a40; }
.roadmap-summary>div:first-child { min-width:115px; }.roadmap-summary strong { display:block; margin-top:8px; font-size:42px; line-height:1; letter-spacing:-.05em; }.roadmap-summary strong small { font-size:22px; margin-left:3px; color:#b5d7ff; }
.roadmap-summary-track { flex:1; min-width:0; }.roadmap-summary-track .portal-progress { margin:0; }.roadmap-summary-track p { font-size:15px; margin:14px 0 0; overflow-wrap:anywhere; }.roadmap-summary-track p>span { color:#8eafce; margin-right:12px; }
.project-roadmap { list-style:none; padding:0; margin:0 0 32px; max-width:960px; }
.invoice-services{list-style:none;padding:0;margin:18px 0;border-block:1px solid #a9cfff30}
.invoice-services li{display:flex;justify-content:space-between;align-items:baseline;gap:18px;padding:14px 0;border-bottom:1px solid #a9cfff18}
.invoice-services li:last-child{border-bottom:0}.invoice-services li span{min-width:0;overflow-wrap:anywhere}.invoice-services li strong{white-space:nowrap}
.credential-requests{display:grid;gap:20px;margin-top:28px}.credential-requests .portal-card{margin:0}.credential-requests .portal-form{margin-top:22px}
.credential-list .portal-card{gap:18px;flex-wrap:wrap}.credential-requests .portal-row{align-items:flex-start;flex-wrap:wrap;gap:12px}
@media(max-width:480px){.invoice-services li{flex-wrap:wrap;gap:8px}.credential-requests{gap:16px}.credential-requests .portal-form .portal-toolbar>.portal-action{width:100%}}
.roadmap-step { position:relative; display:flex; align-items:flex-start; gap:22px; padding-bottom:16px; }.roadmap-step:not(:last-child)::before { content:''; position:absolute; top:40px; bottom:-5px; left:20px; width:1px; background:#a9cfff2d; }.roadmap-step.done::before { background:#94ceb378; }
.roadmap-node { position:relative; flex:0 0 42px; display:grid; place-items:center; height:42px; margin-top:16px; border-radius:50%; background:#10283d; border:1px solid #a9cfff3b; font-size:12px; color:#9bb8d3; }
.roadmap-step.done .roadmap-node { background:#173b3e; color:#b4ead2; border-color:#94ceb37a; }.roadmap-step.current .roadmap-node { color:#102b45; background:#b5d7ff; border-color:#cfe6ff; box-shadow:0 0 0 6px #a9cfff0b; }
.roadmap-step-content { flex:1; min-width:0; display:flex; align-items:center; justify-content:space-between; gap:22px; min-height:80px; padding:18px 24px; border:1px solid transparent; border-radius:22px; }
.roadmap-step.current .roadmap-step-content { background:linear-gradient(110deg,#203f57d9,#14304799); border-color:#a9cfff40; }
.roadmap-state { color:#8eaecb; font-size:11px; }.roadmap-step.done .roadmap-state { color:#a8d8c1; }.roadmap-step.current .roadmap-state { color:#b5d7ff; }
.roadmap-step h3 { margin:5px 0 0; font-size:20px; line-height:1.35; font-weight:550; overflow-wrap:anywhere; }.roadmap-step p { color:#acc4dc; margin:8px 0 0; font-size:14px; line-height:1.6; overflow-wrap:anywhere; }.roadmap-step time { display:block; margin-top:8px; color:#8eacc6; font-size:12px; }
.marker-editor { padding:20px 0 0; border:0; border-top:1px solid #a9cfff35; min-width:0; }.marker-editor legend { padding:0 12px 0 0; font-weight:600; }.marker-editor>p { margin:0 0 18px; }.marker-editor-row { display:flex; gap:14px; align-items:center; padding:18px; margin-bottom:14px; border-radius:18px; background:#a9cfff08; border:1px solid #a9cfff24; }.marker-editor-fields { display:grid; gap:12px; flex:1; min-width:0; }.marker-editor-fields label { font-size:12px; }.marker-editor-actions { display:flex; flex-direction:column; gap:6px; }.marker-editor-actions button { width:32px; height:32px; border-radius:50%; border:1px solid #a9cfff30; color:#b5d7ff; background:#a9cfff08; cursor:pointer; font-size:18px; }.marker-editor-actions button:hover { background:#a9cfff25; }.marker-editor-actions [data-marker-remove] { color:#ffb5b5; }
@media(max-width:600px) { .roadmap-summary { gap:20px; padding:22px; }.roadmap-summary>div:first-child { min-width:95px; }.roadmap-summary strong { font-size:34px; }.roadmap-step { gap:12px; }.roadmap-step-content { padding:16px; flex-wrap:wrap; gap:14px; }.roadmap-step h3 { font-size:18px; }.roadmap-node { flex-basis:34px; height:34px; }.roadmap-step:not(:last-child)::before { left:16px; } }

/* Floating menus must remain readable above the sticky navigation. */
.notification-dock, .quick-chat-dock { z-index:100000; bottom:max(24px,env(safe-area-inset-bottom)); }
.notification-panel, .quick-chat-panel { max-height:min(560px,calc(100dvh - 112px)); background:#10283f; border-color:#9fc8f05c; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#5d82a8 transparent; }
.notification-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:18px; }
.notification-heading h2 { margin:0; }
.notification-close { display:grid; place-items:center; flex:0 0 38px; width:38px; height:38px; padding:0; border:1px solid #a9cfff40; border-radius:50%; color:#e0eeff; background:#a9cfff0c; font:24px/1 sans-serif; cursor:pointer; }
.notification-close:hover { background:#a9cfff22; }
.notification-item.read { opacity:1; color:#bdd0e4; }
.notification-item small { color:#a5bed7; }
.notification-item:focus-visible { outline-offset:-3px; border-radius:10px; }
.notification-panel summary { cursor:pointer; color:#d4e7ff; padding:10px 0; }
.notification-panel a:not(.portal-action) { color:#bddbff; text-underline-offset:4px; }
.quick-chat-panel .portal-chat { max-height:min(280px,38dvh); }
@media(max-width:850px) { .notification-dock, .quick-chat-dock { bottom:max(16px,env(safe-area-inset-bottom)); } }
/* Chat keeps the composer visible while the conversation scrolls. */
.quick-chat-panel { display:flex; flex-direction:column; height:min(650px,calc(100dvh - 115px)); max-height:calc(100dvh - 115px); overflow:hidden; }
.quick-chat-panel>.chat-ui { min-height:0; flex:1; padding:14px 18px 16px; }
.quick-chat-panel .chat-ui .portal-chat { min-height:70px; max-height:none; padding-top:14px; padding-bottom:14px; }
.quick-chat-panel .chat-ui form { padding-top:12px!important; }
.quick-chat-panel .chat-ui .portal-action { min-width:92px; min-height:42px; padding:10px 20px; }
.quick-chat-panel .chat-ui textarea { font-size:16px; }
.quick-chat-panel .chat-ui [data-chat-status]:empty { display:block; }
@media(max-width:600px) { .quick-chat-panel { height:min(630px,calc(100dvh - 105px)); width:calc(100vw - 24px); right:-68px; border-radius:24px; }.quick-chat-heading { padding:14px 18px; } }
@media(max-height:600px){ .quick-chat-panel { height:calc(100dvh - 90px); max-height:calc(100dvh - 90px); bottom:58px; }.quick-chat-panel>.chat-ui { padding:8px 14px; }.quick-chat-heading { padding:10px 14px; }.quick-chat-heading small,.quick-chat-panel .chat-help { display:none; }.quick-chat-panel .chat-ui .portal-chat { min-height:32px; padding:8px 3px; }.quick-chat-panel .chat-ui textarea { min-height:48px!important; max-height:64px; }.quick-chat-panel .chat-ui form { gap:4px!important; padding-top:6px!important; }.quick-chat-panel .chat-ui .portal-action { min-height:36px; padding:6px 16px; } }