@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Manrope:wght@500;600;650;700;750;800&display=swap'); :root{--bg:#f4f6f8;--ink:#172d36;--muted:#687981;--line:#e5eaed;--green:#1c6357;--purple:#7776b5;--amber:#9b6015;--radius:16px}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',system-ui,sans-serif;font-size:16px;line-height:1.5}button,input,textarea{font:inherit}button,a,input,textarea,summary{touch-action:manipulation}button{cursor:pointer}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #4c9cce;outline-offset:3px}button{transition:background .15s,transform .15s}button:active{transform:translateY(1px)}.topbar{height:82px;padding:0 4.3%;display:flex;align-items:center;gap:20px;background:white;border-bottom:1px solid var(--line)}.brand{text-decoration:none;color:var(--ink);font-family:Manrope,system-ui;font-size:25px;font-weight:800;letter-spacing:-1px;display:flex;align-items:center;gap:12px}.logo{display:grid;place-items:center;background:#204d47;color:white;font-size:32px;width:38px;height:38px;border-radius:11px;line-height:1}.brand-divider{height:23px;border-left:1px solid #dbe1e5;margin:0 10px}.workspace{font-family:'DM Sans',sans-serif;font-size:14px;font-weight:500;letter-spacing:0;color:var(--muted)}.prototype{font-size:13px;color:#687981;background:#f3f5f7;padding:5px 12px;border:1px solid var(--line);border-radius:6px;margin-left:auto}.avatar{border-radius:50%;background:#edf1f4;width:36px;height:36px;display:grid;place-items:center;font-size:12px;font-weight:700}main{max-width:1480px;margin:auto;padding:38px 4.3% 0}.heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}.eyebrow{font-size:12px;letter-spacing:2px;font-weight:650;color:var(--green);margin-bottom:5px}h1{font-family:Manrope,system-ui;font-size:36px;letter-spacing:-1.4px;margin:0;font-weight:800}h1 span{color:#4f9d85}.heading p{margin:7px 0 0;color:var(--muted);font-size:15px}.date-control{display:flex;align-items:center;background:#fff;border:1px solid var(--line);border-radius:9px;padding:5px}.date-control input{border:0;padding:7px 10px;font-weight:550;background:white;color:var(--ink);width:165px}.icon-button{border:0;background:transparent;font-size:26px;color:#64767e;width:32px;height:36px;line-height:1;border-radius:6px}.icon-button:hover{background:#eef2f4}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:26px}.stat{background:white;border:1px solid var(--line);border-radius:var(--radius);padding:21px 23px;position:relative;overflow:hidden;min-height:160px}.stat.documented{background:#edf6f2;border-color:#cce3d8}.stat-label{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:550;color:#576c73;justify-content:flex-start}.tag{font-size:10px;letter-spacing:1px;background:#f3f5f7;padding:2px 6px;border-radius:4px;margin-left:auto}#goal-icon{margin-left:auto;color:var(--green)}.stat-value{font-family:Manrope,system-ui;font-size:32px;letter-spacing:-1px;font-weight:750;margin:10px 0 8px;white-space:nowrap}.stat-value span{font-family:'DM Sans',sans-serif;font-size:17px;font-weight:400;color:var(--muted);letter-spacing:0}.stat-foot{font-size:12px;color:var(--muted)}.documented .stat-value,.documented .stat-foot{color:var(--green)}.progress{position:absolute;bottom:0;left:0;right:0;height:4px;background:#dcece5}.progress i{height:100%;display:block;background:#39846e}.stat.under{background:#fff6e8;border-color:#ecd7b7}.under .stat-value,.under .stat-foot{color:var(--amber)}.under .progress{background:#f0e0ca}.under .progress i{background:#cd963d}.layout{display:grid;grid-template-columns:minmax(0,1fr) 335px;gap:24px;align-items:start}.main-column{min-width:0}.panel{background:white;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:0 3px 8px #162c3502}.panel-heading{padding:23px 25px 18px;display:flex;align-items:center;justify-content:space-between;gap:10px}h2{font-size:17px;letter-spacing:-.3px;margin:0;font-weight:650}.panel-heading p{font-size:13px;color:var(--muted);margin:4px 0 0}.small-badge{font-size:12px;padding:4px 8px;background:#f2f4f7;border-radius:5px;color:#5d6f79;white-space:nowrap}.timeline{padding:6px 25px 0}.axis{position:relative;height:26px;color:var(--muted);font-size:11px;margin-left:0}.axis span{position:absolute;transform:translateX(-50%)}.axis span:first-child{transform:none}.axis span:last-child{transform:translateX(-100%)}.track{position:relative;height:28px;background:#f7f9fa;border-radius:5px;margin:5px 0;overflow:hidden}.block{position:absolute;top:2px;height:24px;border-radius:4px;border:0;min-width:2px;padding:0;color:white;opacity:.92}.block:hover{opacity:1;box-shadow:inset 0 0 0 2px #102f3640}.block.bill{background:#3c8b78}.block.internal{background:#8786bc}.block.gap{background:repeating-linear-gradient(135deg,#f4d39b,#f4d39b 3px,#ffedcb 3px,#ffedcb 7px)}.pause-block{position:absolute;top:0;bottom:0;background:repeating-linear-gradient(135deg,#e5e9ed,#e5e9ed 1px,#f0f3f6 1px,#f0f3f6 5px)}.legend{display:flex;gap:18px;padding:14px 25px 22px;flex-wrap:wrap;font-size:12px;color:var(--muted)}.legend span{display:flex;align-items:center;gap:6px}.dot{width:8px;height:8px;display:inline-block;border-radius:3px;flex-shrink:0}.dot.bill{background:#3c8b78}.dot.internal{background:#8786bc}.gap-dot{background:#e1af5e}.pause-dot{background:#cfd7dd}.gap-area{padding:14px 25px;background:#fffbf2;border-top:1px solid #f3e7cf;color:#896029}.gap-area.clear{background:#f1f8f4;color:#326851;border-color:#dcebe1}.gap-title{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:14px;font-weight:550}.gap-details{font-size:12px;margin-top:4px;color:#947b59}.gap-links{display:flex;gap:8px;flex-wrap:wrap}.gap-link{background:white;border:1px solid #e6d3b2;color:#8c5b18;border-radius:6px;padding:5px 9px;font-size:12px;white-space:nowrap}.entries-panel{margin-top:24px}.entries-panel .panel-heading{padding-bottom:20px}.count{display:inline-grid;place-items:center;border-radius:5px;background:#f1f4f6;color:#697d84;font-size:12px;min-width:23px;height:23px;margin-left:7px}.muted{font-size:12px;color:var(--muted)}.entry{display:grid;grid-template-columns:102px minmax(0,1fr) 87px 62px;gap:12px;padding:18px 25px;border-top:1px solid #eef1f4;align-items:center}.entry-time{font-size:13px;font-weight:550;font-variant-numeric:tabular-nums}.entry-duration{font-size:12px;color:var(--muted);font-weight:400;margin-top:2px}.entry-title{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;flex-wrap:wrap}.ticket{font-size:11px;font-weight:450;color:#7b8b92}.description{font-size:13px;color:var(--muted);margin-top:3px;overflow-wrap:anywhere}.entry-title .customer{overflow-wrap:anywhere}.billing-tag{font-size:11px;border-radius:5px;padding:4px 6px;text-align:center;color:#377562;background:#eff7f3}.billing-tag.nonbill{color:#7770a4;background:#f3f1f9}.actions{display:flex;gap:2px;justify-content:flex-end}.action{border:0;background:transparent;color:#89969d;padding:5px;border-radius:5px;width:28px;height:30px;display:grid;place-items:center}.action:hover{color:var(--green);background:#f0f5f3}.action.delete:hover{color:#b95050;background:#fff2f2}.action svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.table-footer{display:flex;justify-content:space-between;background:#f9fafb;padding:14px 25px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}.table-footer strong{color:var(--ink)}.entry-panel{padding:24px;position:relative}.form-heading{display:flex;align-items:center;gap:10px;margin-bottom:25px}.form-icon{width:27px;height:27px;border-radius:8px;background:#edf5f1;color:var(--green);font-size:22px;display:grid;place-items:center}.entry-panel label,.work-settings label{font-size:13px;font-weight:550;display:block;margin-bottom:17px}.entry-panel input:not([type=radio]):not([type=hidden]),textarea,.work-settings input,.snippet-panel input{width:100%;border:1px solid #dce3e7;border-radius:7px;padding:10px 11px;background:#fff;color:var(--ink);font-size:14px;margin-top:7px;outline:none;transition:border .15s,box-shadow .15s}.entry-panel input:focus,textarea:focus,.work-settings input:focus{border-color:#4b9885;box-shadow:0 0 0 3px #4b98851a}textarea{resize:vertical;min-height:85px}input::placeholder,textarea::placeholder{color:#98a3aa}.optional{float:right;font-size:12px;font-weight:400;color:#92a0a7}.time-fields{display:grid;grid-template-columns:1fr 14px 1fr;gap:10px;align-items:center}.time-fields label{margin-bottom:0}.time-fields>span{margin-top:25px;color:#94a2a8}.duration-preview{font-size:12px;color:var(--green);margin:8px 0 20px;text-align:right}fieldset{border:0;padding:0;margin:0 0 22px}legend{font-size:13px;font-weight:550;margin-bottom:8px}.billing-options{display:grid;grid-template-columns:1fr 1.35fr;gap:5px;background:#f2f5f6;padding:4px;border-radius:8px}.billing-options label{margin:0;position:relative;cursor:pointer}.billing-options input{position:absolute;opacity:0}.billing-options span{display:block;padding:9px 2px;border-radius:6px;text-align:center;font-size:12px;color:#6b7d84;white-space:nowrap}.billing-options input:checked+span{background:white;color:var(--green);box-shadow:0 1px 4px #1e384014}.billing-options input:focus-visible+span{outline:2px solid #4c9cce}.primary,.secondary{border:0;background:#205e53;color:#fff;border-radius:8px;padding:12px 15px;font-size:14px;font-weight:550}.primary{width:100%}.primary:hover{background:#16493f}.cancel{border:0;background:none;width:100%;color:var(--muted);font-size:13px;margin-top:12px}.form-note{font-size:12px;color:#8a979e;line-height:1.6;text-align:center;margin:14px 4px 0}.demo-note{display:flex;gap:12px;padding:24px 10px;color:#81929a}.demo-note>span{font-size:22px}.demo-note strong{font-size:13px;color:#61737b;font-weight:550}.demo-note p{font-size:12px;line-height:1.7;margin:5px 0 8px}.text-button{padding:0;background:none;border:0;color:var(--green);font-size:12px}.work-settings{font-size:13px;margin:20px 0;color:var(--muted)}.work-settings summary{cursor:pointer}.work-settings form{display:flex;gap:14px;align-items:end;flex-wrap:wrap}.work-settings label{margin:0}.work-settings p{max-width:620px}.work-settings input{display:block;width:145px}.work-settings button{height:42px}#form-error,#settings-error{font-size:13px;color:#b44444;margin-bottom:12px}.empty{text-align:center;padding:55px 20px;color:var(--muted)}.empty strong{color:var(--ink);display:block;margin-bottom:6px}footer{display:flex;justify-content:space-between;padding:30px 0 24px;color:#8d9ba1;font-size:12px;gap:14px}.toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#183e36;color:white;border-radius:10px;box-shadow:0 4px 24px #0002;padding:13px 22px;font-size:14px;z-index:10}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}[hidden]{display:none!important}@media(min-width:1600px){main{padding-left:45px;padding-right:45px}}@media(max-width:1150px){.layout{grid-template-columns:minmax(0,1fr) 310px;gap:18px}.stat{padding:19px 17px}.stat-value{font-size:27px}.entry{grid-template-columns:90px minmax(0,1fr) 55px;gap:10px;padding:17px 18px}.billing-tag{display:none}.panel-heading{padding-left:18px;padding-right:18px}.entries-panel .muted{display:none}.small-badge{white-space:normal;font-size:11px;max-width:112px}.stat-foot{font-size:11px}}@media(max-width:850px){main{padding:27px 22px 0}.topbar{padding:0 22px;height:70px}.stats{grid-template-columns:repeat(2,1fr);gap:12px}.layout{grid-template-columns:1fr}.entry-panel{margin-top:4px}.entry{grid-template-columns:102px minmax(0,1fr) 85px 62px}.billing-tag{display:block}.heading{align-items:flex-start;gap:20px}.heading h1{font-size:30px}.heading p{font-size:13px}.date-control{margin-top:18px}aside{display:grid;grid-template-columns:1.5fr 1fr;gap:20px}.demo-note{padding-top:30px}.small-badge{max-width:none;font-size:12px}.work-settings{margin-bottom:4px}}@media(max-width:580px){main{padding:24px 16px 0}.topbar{padding:0 16px;gap:10px}.workspace,.brand-divider{display:none}.prototype{font-size:11px;padding:5px 8px}.brand{font-size:23px}.avatar{display:none}.heading{display:block}.date-control{display:inline-flex;margin-top:18px}.stats{margin-bottom:18px}.stat{padding:16px;min-height:150px}.stat-label{font-size:12px}.stat-value{font-size:26px}.stat-value span{font-size:14px}.stat-foot{font-size:11px}.entry{grid-template-columns:85px minmax(0,1fr) 55px;padding:16px;gap:7px}.billing-tag{display:none}.entry-time{font-size:12px}.entry-title{font-size:13px}.description{font-size:12px}.panel-heading{padding:19px 16px 15px}.panel-heading p{font-size:12px}.timeline{padding-left:16px;padding-right:16px}.small-badge{font-size:10px;max-width:100px}.legend{gap:11px;padding:12px 16px 18px;font-size:10px}.gap-area{padding:14px 16px}.gap-title{align-items:flex-start;flex-direction:column}.gap-details{margin-top:8px}.axis{font-size:10px}.axis span:nth-child(even){display:none}aside{display:block}.demo-note{padding:20px 10px}.entry-panel{padding:22px}footer{font-size:10px;padding-top:12px}.entries-panel{margin-top:18px}h2{font-size:16px}} .stat-value span{margin-left:3px}.entry-panel label,.work-settings label,legend{font-size:14px}.description{font-size:14px}.entry-time{font-size:14px}.axis span:last-child{display:block} /* DoCoPi workflows, extending the original Zeitklar surface. */ .layout{grid-template-columns:minmax(0,1fr) 365px}.topbar{gap:15px}.connect-button{border:1px solid #dce5e2;background:white;color:var(--green);padding:8px 13px;border-radius:7px;font-size:13px}.day-toolbar{display:flex;justify-content:space-between;align-items:center;gap:14px;margin:-5px 0 20px;font-size:13px;color:var(--muted)}.day-toolbar>div{display:flex;gap:7px;flex-wrap:wrap}.secondary.soft{background:#eaf1ee;color:#286556;padding:8px 12px;font-size:13px}.mode-tabs,.connection-tabs{display:flex;padding:4px;background:#eff3f4;border-radius:8px;gap:4px;margin-bottom:20px}.mode-tabs button,.connection-tabs button{flex:1;border:0;background:none;padding:9px 5px;border-radius:6px;font-size:13px;color:#627780}.mode-tabs button[aria-pressed=true],.connection-tabs button[aria-pressed=true]{background:#fff;color:var(--green);box-shadow:0 1px 4px #0001;font-weight:600}.entry-panel input,.entry-panel select,dialog input,dialog select,dialog textarea{min-width:0}.entry-panel select,dialog select,.snippet-panel select{display:block;width:100%;font:inherit;font-size:14px;border:1px solid #dce3e7;border-radius:7px;padding:10px;background:#fff;color:var(--ink);margin:7px 0 0}.picker-button{width:100%;display:flex;justify-content:space-between;align-items:center;padding:11px;border:1px solid #dce3e7;border-radius:7px;background:#fff;color:var(--green);font-size:14px;text-align:left;margin-top:-8px;margin-bottom:12px;gap:10px}.selection-note{font-size:12px;color:var(--muted);margin-bottom:17px;line-height:1.6;overflow-wrap:anywhere}.hint{background:#f0f5f7;border:1px solid #e2e9ed;border-radius:7px;padding:11px 12px;font-size:13px;color:#566e79;margin-bottom:16px;line-height:1.6}.hint p{margin:4px 0 0}.microcopy{font-size:12px;color:var(--muted);line-height:1.65;margin:8px 0 15px}.ae-row{display:flex;align-items:center;justify-content:space-between;font-size:13px;margin-top:13px;color:var(--muted);gap:12px}.ae-row>div{display:flex;align-items:center;gap:4px}.ae-row button{border:0;background:#edf3f0;color:var(--green);border-radius:5px;width:29px;height:29px;font-size:17px}.entry-panel .ae-row input#\61 e{padding:4px;margin:0;width:60px;text-align:center;height:31px;font-size:14px}.duration-preview{margin:7px 0 15px}.form-heading{margin-bottom:18px}#overlap-hint{background:#fff8e9;border-color:#f0e1c7;color:#8d641e;font-size:12px}.entry-panel{padding:23px}.row-detail{border:0;padding:0;text-align:left;background:transparent;color:var(--ink);font-size:14px;font-weight:600;overflow-wrap:anywhere}.row-detail:hover{text-decoration:underline;color:var(--green)}#entry-filter{background:white;border:1px solid var(--line);padding:6px;border-radius:6px;color:var(--muted);font:inherit;font-size:12px;max-width:150px}.activity-panel{margin-top:22px}.activity-panel .panel-heading{padding-bottom:10px}.activity-tools{display:flex;justify-content:space-between;gap:10px;padding:0 24px 14px;font-size:12px;color:var(--muted)}.activity-tools input{accent-color:var(--green)}.activity-row{display:grid;grid-template-columns:82px minmax(0,1fr) auto;align-items:center;gap:12px;padding:15px 24px;border-top:1px solid var(--line);font-size:13px}.activity-row strong{font-weight:550}.activity-row p{margin:2px 0 0;color:var(--muted);font-size:12px}.activity-actions{display:flex;gap:8px;align-items:center}.activity-state{font-size:12px;color:var(--green);background:#ecf5ef;padding:4px 8px;border-radius:5px}.activity-muted{opacity:.65}.activity-row .text-button{font-size:12px}.monitoring-section{margin-top:20px;color:var(--muted);font-size:14px}.monitoring-section summary{cursor:pointer;margin-bottom:12px}.monitoring-section summary span{margin-left:10px}#monitoring-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:12px}.monitoring-tile{background:#fff;border:1px solid var(--line);border-radius:10px;padding:16px;text-align:left;min-width:0}.monitoring-tile strong{display:block;font-size:24px;color:var(--ink)}.monitoring-tile span{font-size:13px;color:var(--muted)}.monitoring-tile p{font-size:12px;color:#996324;margin:5px 0 0;overflow-wrap:anywhere}.error-banner,.error{color:#a63e3e;font-size:14px}.error-banner{padding:14px;border:1px solid #efd6d6;border-radius:9px;background:#fff3f3;margin-bottom:20px}.date-control #today{padding:0 10px}.entry-duration{font-size:11px}.entry{grid-template-columns:108px minmax(0,1fr) 80px 62px}.entry-title{gap:6px}dialog{border:1px solid #dfe7e8;border-radius:16px;box-shadow:0 20px 100px #102f3630;width:min(610px,calc(100vw - 28px));padding:26px;color:var(--ink);max-height:90vh;overflow:auto}dialog::backdrop{background:#152c3659;backdrop-filter:blur(3px)}.dialog-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;gap:15px}.dialog-header h2{font-size:20px}.dialog-header>button{border:0;border-radius:6px;background:#f0f3f4;color:var(--muted);font-size:24px;width:31px;height:31px;line-height:1}dialog input:not([type=checkbox]),dialog textarea{width:100%;padding:11px;border-radius:7px;border:1px solid #dce3e7;font-size:14px;margin-top:7px;color:var(--ink)}dialog label{display:block;font-size:14px;font-weight:550;margin-bottom:16px}dialog p{font-size:14px}dialog details{font-size:14px;margin:15px 0}dialog details[open] summary{margin-bottom:14px}.dialog-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:22px}.dialog-actions .primary{width:auto}.picker-results{max-height:52vh;overflow:auto}.picker-result{display:block;width:100%;text-align:left;border:1px solid var(--line);border-radius:8px;background:#fff;padding:13px;margin-bottom:8px;color:var(--ink)}.picker-result:hover{background:#eff6f3;border-color:#93bdaa}.picker-result strong{display:block;font-size:14px;font-weight:600}.picker-result span{font-size:12px;color:var(--muted);display:block;margin-top:4px}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.detail-grid dt{font-size:12px;color:var(--muted);margin-bottom:5px}.detail-grid dd{font-size:14px;margin:0;overflow-wrap:anywhere}.detail-wide{grid-column:1/-1}.detail-wide dd{white-space:pre-wrap}.two-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}.monitoring-editor{border-top:1px solid var(--line);padding-top:16px;margin-top:15px}.monitoring-editor textarea{font-family:ui-monospace,monospace;font-size:13px}.connection-tabs{margin-top:-5px}button:disabled{cursor:wait;opacity:.6}#connection-error:empty,#form-error:empty{display:none}#monitoring-test-results{font-size:13px;margin-top:16px}.status-badge{font-size:12px;border-radius:5px;background:#edf4f1;color:var(--green);padding:4px 8px}.entry-panel .time-fields label{font-size:14px}.empty{padding:30px 20px} @media(max-width:1200px){.entry{grid-template-columns:108px minmax(0,1fr) 60px}.billing-tag{display:none}.layout{grid-template-columns:minmax(0,1fr) 335px}.activity-row{padding:14px 18px;grid-template-columns:74px minmax(0,1fr)}.activity-actions{grid-column:2}.day-toolbar{align-items:flex-start}.day-toolbar>div{justify-content:flex-end}.entry-title .ticket{display:block}}@media(max-width:900px){.layout{grid-template-columns:1fr}.layout aside{display:block}.entry-panel{max-width:none}.entry{grid-template-columns:108px minmax(0,1fr) 80px 62px}.billing-tag{display:block}.activity-row{grid-template-columns:82px minmax(0,1fr) auto}.activity-actions{grid-column:auto}.prototype{display:none}.day-toolbar{flex-direction:column}.day-toolbar>div{justify-content:flex-start}}@media(max-width:580px){.workspace{display:none}.connect-button{font-size:12px}.topbar .avatar{display:none}.entry{grid-template-columns:91px minmax(0,1fr) 58px;padding:16px 12px}.billing-tag{display:none}.entry-duration{font-size:10px}.entry-time{font-size:12px}.description,.row-detail{font-size:13px}.activity-row{grid-template-columns:70px minmax(0,1fr);padding:14px 16px}.activity-actions{grid-column:2}.activity-tools{padding:0 16px 14px;flex-wrap:wrap}.day-toolbar .secondary.soft{font-size:12px;padding:7px 9px}.monitoring-section summary span{display:block;margin:5px 0}.monitoring-tile{padding:12px}.monitoring-tile span{font-size:12px}dialog{padding:20px}.dialog-header h2{font-size:18px}#entry-filter{max-width:135px}.detail-grid{gap:16px}.two-fields{gap:10px}.stat-label{font-size:12px}} .activity-header-actions{display:flex;gap:14px;align-items:center}.activity-tools[hidden]{display:none} /* Compact ticket groups and focused activity lists. */ .entry-group{border-top:1px solid var(--line)}.entry-group summary{list-style:none;display:flex;align-items:center;gap:12px;padding:16px 24px;cursor:pointer}.entry-group summary::-webkit-details-marker{display:none}.entry-group summary:hover,.compact-entry:hover{background:#f4f8f6}.group-chevron{color:var(--green);font-size:23px;transition:transform .15s}.entry-group[open] .group-chevron{transform:rotate(90deg)}.group-name{min-width:0;flex:1}.group-name strong{display:block;font-size:14px;font-weight:600;overflow-wrap:anywhere}.group-name>span{display:block;font-size:12px;color:var(--muted);margin-top:4px;overflow-wrap:anywhere}.group-total{font-size:14px;white-space:nowrap;color:var(--green)}.group-entries{background:#fafcfb}.compact-entry{display:grid;grid-template-columns:93px 8px minmax(0,1fr) auto;align-items:center;gap:10px;width:100%;padding:12px 24px;border:0;border-top:1px solid var(--line);background:transparent;text-align:left;color:var(--ink);font:inherit;font-size:12px}.compact-description{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.compact-time{color:var(--muted)}.compact-duration{white-space:nowrap;font-weight:550}.compact-duration>span{margin-left:8px;color:var(--green)}.list-pager{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 24px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}.list-pager>div{display:flex;align-items:center;gap:10px}.list-pager button{min-width:34px}.activity-tools{flex-wrap:wrap;align-items:center}.activity-filters{display:flex;flex-wrap:wrap;gap:4px;background:#eff3f1;padding:4px;border-radius:8px}.activity-filters button{border:0;background:none;border-radius:6px;padding:7px 9px;font-size:12px;color:var(--muted)}.activity-filters button[aria-pressed=true]{background:white;color:var(--green);box-shadow:0 1px 4px #0001}.activity-filters span{margin-left:4px;font-variant-numeric:tabular-nums}.activity-row{padding-top:11px;padding-bottom:11px}.activity-row strong,.activity-row p{overflow-wrap:anywhere}.activity-panel .panel-heading{flex-wrap:wrap;gap:10px}.entry-group summary:focus-visible,.compact-entry:focus-visible,.activity-filters button:focus-visible{outline:2px solid #4b9885;outline-offset:-3px} @media(max-width:580px){.entry-group summary{padding:14px 16px;gap:9px}.compact-entry{padding:12px 16px;grid-template-columns:80px 7px minmax(0,1fr);gap:8px}.compact-duration{grid-column:1;grid-row:2;color:var(--muted);font-size:11px}.compact-description{grid-column:3;grid-row:1/3;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.list-pager{padding:12px 16px}.activity-filters button{padding:8px 7px;font-size:11px}.group-name strong{font-size:13px}.group-total{font-size:13px}} /* Timeline and entry details share a single panel. */ .timeline-panel .track{height:56px;overflow:visible;margin:5px 0 12px}.timeline-panel .block{height:52px;top:2px;text-align:left;overflow:hidden;padding:6px;min-width:3px;transition:box-shadow .12s,opacity .12s}.timeline-panel .block strong,.timeline-panel .block>span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none}.timeline-panel .block strong{font-size:11px;font-weight:600}.timeline-panel .block>span{font-size:10px;margin-top:5px;opacity:.9}.timeline-panel .block.gap{padding:0}.timeline-panel .block.is-active,.timeline-panel .block:focus-visible{opacity:1;outline:2px solid #194e43;outline-offset:2px;z-index:2}.lane-caption{display:flex;justify-content:space-between;gap:12px;font-size:11px;color:var(--muted);margin-top:10px}.lane-caption>span{color:#8a989e}.timeline-detail{margin:18px 24px 0;padding:18px;background:#f4f8f6;border:1px solid #e0eae4;border-radius:10px;min-height:205px}.timeline-detail-top{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:12px;margin-bottom:12px}.timeline-detail-time{font-weight:600;color:var(--green)}.timeline-detail-billing{display:flex;align-items:center;gap:6px;color:var(--muted)}.timeline-customer{display:block;font-size:16px;font-weight:600}.timeline-ticket{font-size:12px;color:var(--muted);margin-top:5px;overflow-wrap:anywhere}.timeline-description{font-size:14px;line-height:1.5;margin:12px 0;white-space:pre-wrap;overflow-wrap:anywhere;max-height:105px;overflow:auto}.timeline-detail-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.timeline-detail-bottom>span{font-size:11px;color:var(--muted)}.timeline-detail-bottom>div{display:flex;gap:16px;align-items:center}.timeline-placeholder{padding:25px 8px;color:var(--muted);text-align:center}.timeline-placeholder strong{font-size:14px;color:var(--green)}.timeline-placeholder p{font-size:13px;line-height:1.6;max-width:460px;margin:10px auto}.timeline-panel .legend{padding-top:16px} @media(max-width:580px){.timeline-detail{margin:16px 16px 0;padding:14px;min-height:230px}.timeline-panel .block{padding:5px 2px}.timeline-panel .block strong{font-size:10px}.timeline-panel .block>span{font-size:9px}.timeline-detail-bottom>span{display:none}.timeline-customer{font-size:15px}.timeline-description{font-size:13px}.timeline-placeholder{padding:26px 2px}.timeline-detail-bottom>div{width:100%;justify-content:space-between}} /* One shared time axis; overlapping bookings stack inside it. */ .timeline-panel .unified-track{margin-top:16px;background:#f1f5f4;border:1px solid #e4eae7;border-radius:8px;isolation:isolate}.unified-track .pause-block{top:0;bottom:0;height:100%;border-radius:0;z-index:-1}.timeline-panel .unified-track .block.gap{top:0;height:100%;border-radius:0;opacity:.55;z-index:0}.unified-track .block:not(.gap){z-index:1}.timeline-panel .unified-track .block.is-active{z-index:2}.timeline-pin-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid #dce7df;font-size:11px;color:var(--green)}.timeline-pin-bar button{padding:6px 8px;background:#e5eee8;border-radius:5px}.timeline-pin-bar button:focus-visible{outline:2px solid var(--green);outline-offset:2px} /* The daily timeline is the full-width primary workspace. */ main>.timeline-panel{width:100%;margin-bottom:24px}main>.layout>.main-column>.activity-panel{margin-top:0} .timeline-search{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:0 25px 18px;font-size:12px;color:var(--muted)}.timeline-search label{font-weight:550;color:var(--ink)}.timeline-search-input{display:flex;align-items:center;gap:10px;flex:1;max-width:470px}.timeline-search input{width:100%;min-width:0;border:1px solid #dce3e7;border-radius:7px;padding:9px 11px;background:white;color:var(--ink);font:inherit;font-size:13px}.timeline-search input:focus{outline:2px solid #4b9885;outline-offset:1px}.timeline-search-clear,.timeline-search button{white-space:nowrap}.timeline-panel .block.search-dimmed{opacity:.22}.timeline-panel .block.search-match{opacity:1;box-shadow:inset 0 0 0 2px #fff,inset 0 0 0 4px #174e43}.timeline-panel .block.search-dimmed.is-active,.timeline-panel .block.search-dimmed:focus-visible{opacity:.65}@media(max-width:580px){.timeline-search{padding:0 16px 16px;gap:8px}.timeline-search-input{flex-basis:100%;max-width:none}.timeline-search>span{font-size:11px}} /* Separate adjacent bookings without changing their time-based widths. */ .timeline-panel .unified-track .block:not(.gap){border:2px solid #f1f5f4;border-radius:6px;background-clip:padding-box} /* Compact navigation keeps supporting tools out of the daily workspace. */ .workspace-menu{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:-8px 0 22px}.workspace-menu button{display:flex;align-items:center;gap:8px}.workspace-menu .count{margin:0;font-size:11px}.creation-layout{display:block}.creation-layout aside{display:block}.creation-layout .entry-panel{width:100%}.creation-layout #entry-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px 28px;align-items:start}.creation-layout #entry-form>.mode-tabs,.creation-layout #entry-form>.hint,.creation-layout #entry-form>fieldset,.creation-layout #entry-form>#form-error,.creation-layout #entry-form>.primary,.creation-layout #entry-form>.cancel,.creation-layout #entry-form>label:has(textarea),.creation-layout #entry-form>.microcopy{grid-column:1/-1}.creation-layout #entry-form>label{margin-bottom:0}.creation-layout #entry-form>.duration-preview{grid-column:1/-1;margin:0}.creation-layout .demo-note{padding:14px 10px}.creation-layout .demo-note p{margin:4px 0}.creation-layout #entry-form>.ae-row{margin-top:25px}#activities-dialog{width:min(820px,calc(100vw - 28px))}#activities-dialog .activity-panel{border:0;box-shadow:none;margin:0}#activities-dialog .panel-heading{padding:0 0 16px}#activities-dialog .activity-tools{padding:0 0 16px}#activities-dialog .activity-row{padding-left:0;padding-right:0}#work-dialog .work-settings{margin:0}#work-dialog .work-settings label{margin-bottom:0}#work-dialog .work-settings input{margin-top:7px}#monitoring-dialog .monitoring-section{margin:0}@media(max-width:580px){.workspace-menu{gap:6px}.workspace-menu .secondary.soft{font-size:12px;padding:8px}.creation-layout #entry-form{display:block}.creation-layout #entry-form>label{margin-bottom:18px}.creation-layout #entry-form>.ae-row{margin-top:13px}.creation-layout #entry-form>.duration-preview{margin:7px 0 15px}.creation-layout .entry-panel{padding:20px}} /* Keep touch scrolling vertical without gesture zoom. */ html,body{max-width:100%;overflow-x:hidden;overflow-x:clip;overscroll-behavior-x:none;touch-action:pan-y} dialog{overflow-x:hidden;overscroll-behavior-x:none;touch-action:pan-y} @media(max-width:580px){.topbar,.heading,.workspace-menu,.day-toolbar,.timeline-panel,.creation-layout,.entry-panel{min-width:0;max-width:100%}.topbar .brand{min-width:0;flex-shrink:1}.dialog-actions{flex-wrap:wrap}.activity-header-actions{flex-wrap:wrap}.work-settings input{max-width:100%}} /* Avoid automatic input zoom in mobile Safari. */ @media(hover:none) and (pointer:coarse){input,select,textarea,.entry-panel input,.entry-panel select,dialog input:not([type=checkbox]),dialog select,dialog textarea,.timeline-search input,.entry-panel .ae-row input#\61 e{font-size:16px}} /* Expand details in place, keeping the timeline in view. */ .inline-details{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .28s ease,opacity .2s ease}.inline-details.expanded{grid-template-rows:1fr;opacity:1}.inline-details-clip{min-height:0;overflow:hidden}.inline-details-content{margin:12px 24px 0;padding:22px;border:1px solid #dfe9e3;border-radius:10px;background:#fff}.inline-details .dialog-header{margin-bottom:18px}.inline-details .dialog-header h2{font-size:16px}.inline-details .dialog-header>button{width:auto;height:auto;font-size:12px;padding:7px 10px;line-height:1.5;color:var(--green)}.inline-details .detail-grid{grid-template-columns:repeat(3,minmax(0,1fr));margin:0}.inline-details .dialog-actions{flex-wrap:wrap}.inline-details .detail-wide{grid-column:1/-1}@media(max-width:580px){.inline-details-content{margin:10px 16px 0;padding:16px}.inline-details .detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.inline-details .dialog-header{align-items:flex-start;gap:8px}.inline-details .dialog-header>button{font-size:11px;white-space:nowrap}.inline-details .dialog-actions{justify-content:flex-start}}@media(prefers-reduced-motion:reduce){.inline-details{transition:none}} /* Supporting tools expand in the page below the menu. */ .menu-panel{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .28s ease,opacity .2s ease}.menu-panel.expanded{grid-template-rows:1fr;opacity:1}.menu-panel-clip{min-height:0;overflow:hidden}.menu-panel-content{padding:22px;margin:0 0 22px;background:#fff;border:1px solid var(--line);border-radius:var(--radius)}.menu-panel .dialog-header{margin-bottom:16px}.menu-panel .dialog-header h2{font-size:18px}.menu-panel .dialog-header>button{width:auto;height:auto;font-size:12px;padding:7px 10px;line-height:1.5;color:var(--green)}.workspace-menu button[aria-expanded=true]{background:var(--green);color:white}.menu-panel#activities-dialog{width:100%}.menu-panel .work-settings input{font:inherit;font-size:16px}.menu-panel .work-settings form{gap:14px}.menu-panel .activity-tools{margin-top:0}.menu-panel .monitoring-section{margin:0}@media(max-width:580px){.menu-panel-content{padding:16px}.menu-panel .dialog-header h2{font-size:16px}.menu-panel .work-settings form{align-items:stretch}.menu-panel .work-settings label{flex:1;min-width:110px}.menu-panel .work-settings input{width:100%}.menu-panel .work-settings button{align-self:end}}@media(prefers-reduced-motion:reduce){.menu-panel{transition:none}} /* A single quiet search field with an accessible clear icon. */ .timeline-search-input{position:relative;gap:0}.timeline-search input{padding-right:42px}.timeline-search input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}.timeline-search #timeline-search-clear{position:absolute;right:3px;top:50%;transform:translateY(-50%);width:34px;height:34px;display:grid;place-items:center;padding:0;border-radius:5px;color:var(--muted);font-size:23px;line-height:1}.timeline-search #timeline-search-clear:hover{background:#edf3f0;color:var(--green)} /* DoCoPi identity: original logo and accent palette from ui/styles.py. */ :root{--accent:#3e2883;--accent-hover:#4d3990;--accent-pressed:#32206b;--accent-light:#f1eef8;--accent-light-hover:#e9e4f5;--accent-border:#c7bfdf} .brand{color:var(--accent)}.brand-logo{display:block;width:38px;height:40px;object-fit:contain;flex-shrink:0}.brand .workspace{color:var(--muted)} .primary,.secondary{background:var(--accent)}.primary:hover,.secondary:hover{background:var(--accent-hover)}.primary:active,.secondary:active{background:var(--accent-pressed)} .secondary.soft{background:var(--accent-light);color:var(--accent)}.secondary.soft:hover{background:var(--accent-light-hover)} .text-button,.connect-button,.menu-panel .dialog-header>button{color:var(--accent)}.connect-button{border-color:var(--accent-border)}.connect-button:hover{background:var(--accent-light)} .form-icon,.avatar,.timeline-pin-bar button{background:var(--accent-light);color:var(--accent)} .mode-tabs,.connection-tabs,.activity-filters{background:#f3f1f7}.mode-tabs button[aria-pressed=true],.connection-tabs button[aria-pressed=true],.activity-filters button[aria-pressed=true],.billing-options input:checked+span{color:var(--accent)} .workspace-menu button[aria-expanded=true]{background:var(--accent);color:white}.workspace-menu button[aria-expanded=true]:hover{background:var(--accent-hover)}.workspace-menu .count{background:#e7e1f3;color:var(--accent)} .timeline-detail{background:#faf9fc;border-color:#e6e1f0}.timeline-detail-time,.timeline-placeholder strong,.timeline-pin-bar{color:var(--accent)}.timeline-pin-bar{border-bottom-color:#e6e1f0}.timeline-pin-bar button:hover{background:var(--accent-light-hover)} .timeline-panel .block.is-active,.timeline-panel .block:focus-visible{outline-color:var(--accent)}.timeline-panel .block.search-match{box-shadow:inset 0 0 0 2px #fff,inset 0 0 0 4px var(--accent)} .picker-result:hover{background:var(--accent-light);border-color:var(--accent-border)} button:focus-visible,a:focus-visible,summary:focus-visible,.billing-options input:focus-visible+span,.entry-group summary:focus-visible,.compact-entry:focus-visible,.activity-filters button:focus-visible,.timeline-pin-bar button:focus-visible,.timeline-search input:focus{outline-color:var(--accent)} .entry-panel input:focus,textarea:focus,.work-settings input:focus,select:focus-visible{border-color:var(--accent);box-shadow:0 0 0 3px #3e28831a}.toast{background:var(--accent)} .eyebrow,h1 span{color:var(--accent)} .account-link{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding:8px;text-decoration:none} /* Distinguish the two long-form detail sections without adding extra panels. */ .inline-details .detail-wide{padding-top:12px;border-top:1px solid var(--line)} .inline-details .detail-wide dt{color:var(--accent);font-size:13px;font-weight:700;margin-bottom:8px} .inline-details .detail-wide dd{line-height:1.65} /* Preview and pinned selection have distinct outlines; search highlights stay intact. */ .timeline-panel .block.is-active[aria-pressed="false"]{outline:2px dashed var(--accent);outline-offset:2px} .timeline-panel .unified-track .block[aria-pressed="true"]{outline:3px solid var(--accent);outline-offset:2px;z-index:3} /* AE changes use the explicit minus/plus controls in every browser. */ #ae{appearance:textfield;-moz-appearance:textfield} #ae::-webkit-inner-spin-button,#ae::-webkit-outer-spin-button{-webkit-appearance:none;margin:0} .ticket-description-field{margin-bottom:16px;min-width:0} .ticket-description-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px} .ticket-description-toolbar label{margin:0} .ticket-description-toolbar .ticket-stamp-button{font-size:12px;white-space:nowrap;padding:5px 0;flex-shrink:0} .ticket-description-field textarea{display:block;width:100%;margin:0} /* Three equal daily actions across the complete workspace width. */ .day-toolbar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;gap:12px} .day-toolbar>.secondary.soft{width:100%;min-width:0;white-space:normal;display:flex;align-items:center;justify-content:center;text-align:center} .form-icon{flex-shrink:0;line-height:0} .form-icon svg{display:block} @media(max-width:580px){.day-toolbar{gap:7px}.day-toolbar>.secondary.soft{font-size:clamp(10px,2.9vw,12px);padding:9px 5px;min-height:44px;line-height:1.4}} /* Only working, configured SQL metrics appear in the persistent summary. */ .monitoring-live{display:flex;align-items:center;gap:14px;padding:12px 14px;margin:0 0 22px;border:1px solid var(--accent-border);border-radius:12px;background:#fff;min-width:0} .monitoring-live-tiles{display:flex;flex:1;flex-wrap:wrap;gap:8px;min-width:0} .monitoring-live-tile{display:flex;flex:1 1 160px;align-items:center;justify-content:space-between;gap:14px;min-width:0;padding:7px 12px;border-radius:8px;background:var(--accent-light)} .monitoring-live-tile span{font-size:13px;color:var(--accent);overflow-wrap:anywhere;min-width:0} .monitoring-live-tile strong{font-size:23px;font-variant-numeric:tabular-nums;color:var(--accent);overflow-wrap:anywhere;min-width:0} .monitoring-live-tile.has-changed{animation:monitoring-value-change 4s ease-out} .monitoring-sound{display:inline-flex;align-items:center;justify-content:center;gap:6px;flex-shrink:0;min-height:40px;padding:8px;border:0;border-radius:8px;background:transparent;color:var(--muted);font-size:12px} .monitoring-sound[aria-pressed=true]{color:var(--accent);background:var(--accent-light)} .monitoring-sound:hover{background:var(--accent-light-hover)} .monitoring-live-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap} @keyframes monitoring-value-change{0%,35%{background:#ded5f5;box-shadow:inset 0 0 0 2px var(--accent)}100%{background:var(--accent-light);box-shadow:inset 0 0 0 0 transparent}} @media(prefers-reduced-motion:reduce){.monitoring-live-tile.has-changed{animation:none;box-shadow:inset 0 0 0 2px var(--accent)}} @media(max-width:580px){.monitoring-live{align-items:flex-start;gap:6px;padding:8px}.monitoring-live-tiles{gap:6px}.monitoring-live-tile{flex-basis:100%;padding:7px 9px}.monitoring-live-tile strong{font-size:21px}.monitoring-sound{padding:8px 5px}} /* Daily totals fill the row while keeping their height compact. */ .stats{display:flex;flex-wrap:wrap;align-items:stretch;gap:10px;margin-bottom:18px} .stat{flex:1 1 0;max-width:100%;min-width:0;min-height:0;padding:12px 16px;border-radius:12px} .stat-label{gap:8px;font-size:12px} .stat-value{font-size:26px;line-height:1.35;margin:5px 0 4px} .stat-value span{font-size:14px} .stat-foot{font-size:11px;overflow-wrap:anywhere} @media(max-width:850px){.stat{flex:0 1 calc(50% - 5px)}} @media(max-width:580px){.stats{gap:8px}.stat{flex-basis:calc(50% - 4px);padding:11px 12px}.stat-value{font-size:25px}} .monitoring-alert-controls{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:14px 0 8px} .monitoring-alert-controls .secondary{font-size:12px;padding:9px 12px} .monitoring-alert-controls .secondary:disabled{opacity:.5;cursor:default} .pause-marker{position:absolute;top:0;bottom:0;z-index:0;border-left:1px solid #c7cdd4;border-right:1px solid #c7cdd4;background:repeating-linear-gradient(135deg,#e4e7eb,#e4e7eb 4px,#f2f4f6 4px,#f2f4f6 8px);display:flex;align-items:center;justify-content:center;color:#687981;font-size:11px;overflow:hidden;min-width:2px}.unified-track .block{z-index:1} #settings{display:grid;grid-template-columns:minmax(120px,180px) 1fr;align-items:start}.pause-settings-group{min-width:0}#pause-settings{display:grid;gap:10px;margin-bottom:10px}.pause-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 32px;gap:10px;align-items:end}.menu-panel .work-settings .pause-row label{min-width:0}.pause-row button{font-size:24px}#settings>button{justify-self:start}.pause-settings-group button:disabled{opacity:.5;cursor:default} #new-time-contract-slot:empty{display:none}#time-contract-field .microcopy{margin-top:-8px} #default-time-contract-slot:empty{display:none}#ae-minus:disabled{cursor:default;opacity:.35} .pause-settings-group{max-width:430px}.menu-panel .work-settings .pause-row input{width:100%;min-width:0} .pause-dot{background:repeating-linear-gradient(135deg,#aab4bc,#aab4bc 2px,#e4e7eb 2px,#e4e7eb 4px)} @media(max-width:580px){#settings{grid-template-columns:1fr}.pause-row{gap:8px}} .loading-inline:not([hidden]),.loading-button{display:inline-flex;align-items:center;justify-content:center;gap:8px} .loading-inline::before,.loading-button::before{content:"";width:13px;height:13px;flex:0 0 13px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:loading-spin .75s linear infinite} .day-loading{margin-left:12px;font-size:12px;font-weight:400;color:var(--accent)} .timeline-panel.is-loading #timeline,.timeline-panel.is-loading #timeline-detail,.timeline-panel.is-loading #gaps{opacity:.45;transition:opacity .15s ease} .loading-button:disabled{cursor:wait;opacity:.8} @keyframes loading-spin{to{transform:rotate(360deg)}} @media(max-width:580px){.day-loading{margin:6px 0 0;display:flex!important;justify-content:flex-start!important}.day-loading[hidden]{display:none!important}} @media(prefers-reduced-motion:reduce){.loading-inline::before,.loading-button::before{animation:none}.timeline-panel.is-loading #timeline,.timeline-panel.is-loading #timeline-detail,.timeline-panel.is-loading #gaps{transition:none}} .recent-tickets{margin:10px 0 12px;min-width:0}.recent-ticket-heading{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;margin-bottom:6px;font-size:11px;color:var(--muted)}.recent-ticket-list{display:flex;flex-wrap:wrap;gap:6px}.recent-ticket{display:flex;align-items:center;gap:6px;min-width:0;max-width:100%;border:1px solid var(--line);border-radius:8px;padding:6px 9px;background:#f6f7f9;color:var(--ink);font-size:12px;text-align:left}.recent-ticket strong{flex-shrink:0;font-size:11px}.recent-ticket span{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.recent-ticket:hover,.recent-ticket[aria-pressed="true"]{border-color:var(--purple);background:#f0eff8}.recent-ticket:disabled{opacity:.55;cursor:wait} .theme-toggle{display:inline-grid;place-items:center;flex-shrink:0;width:36px;height:36px;padding:0;border:1px solid var(--accent-border,#c7bfdf);border-radius:8px;background:transparent;color:var(--accent);cursor:pointer}.theme-toggle:hover{background:var(--accent-light,#f1eef8)}.theme-toggle .theme-sun{display:none}[data-theme="dark"] .theme-toggle .theme-sun{display:block}[data-theme="dark"] .theme-toggle .theme-moon{display:none} :root{color-scheme:light}:root[data-theme="dark"]{color-scheme:dark} /* Dark surfaces retain the meaning of billable, internal, gap and pause colors. */ :root[data-theme="dark"]{--bg:#14151c;--ink:#e9eaf1;--muted:#a8adbf;--line:#363847;--green:#96d7bb;--purple:#b2a2e4;--amber:#f0c27a;--accent:#c4b0ff;--accent-hover:#765ac0;--accent-pressed:#6349a6;--accent-light:#302840;--accent-light-hover:#3e3355;--accent-border:#63547e;--surface:#1e202a;--surface-raised:#282a37;--field:#191b24} [data-theme="dark"] :is(.topbar,.stat,.panel,.date-control,.monitoring-tile,.monitoring-live,.menu-panel-content,.inline-details-content,dialog){background:var(--surface);border-color:var(--line);box-shadow:none;color:var(--ink)} [data-theme="dark"] :is(input:not([type="radio"]):not([type="checkbox"]),textarea,select,.picker-button,.picker-result,.connect-button){background:var(--field);color:var(--ink);border-color:var(--line)} [data-theme="dark"] input::placeholder,[data-theme="dark"] textarea::placeholder{color:#969caf} [data-theme="dark"] :is(.stat-label,.icon-button,.billing-options span,.mode-tabs button,.connection-tabs button,.ticket,.small-badge,.hint,.count,.prototype,.optional,.form-note,.gap-details,.monitoring-tile p){color:var(--muted)} [data-theme="dark"] :is(.prototype,.small-badge,.tag,.count,.hint,.table-footer,.billing-options,.mode-tabs,.connection-tabs,.activity-filters,.group-entries,.dialog-header>button,.recent-ticket){background:var(--surface-raised);border-color:var(--line)} [data-theme="dark"] :is(.mode-tabs button[aria-pressed="true"],.connection-tabs button[aria-pressed="true"],.activity-filters button[aria-pressed="true"],.billing-options input:checked+span){background:var(--accent-light);color:var(--accent)} [data-theme="dark"] :is(.primary,.secondary:not(.soft),.workspace-menu button[aria-expanded="true"],.toast){background:#674ba9;color:#fff} [data-theme="dark"] :is(.primary,.secondary:not(.soft)):hover{background:#785bc0} [data-theme="dark"] :is(.picker-result,.recent-ticket):hover,[data-theme="dark"] .recent-ticket[aria-pressed="true"]{background:var(--accent-light);border-color:var(--accent-border)} [data-theme="dark"] :is(.form-icon,.avatar,.timeline-pin-bar button,.workspace-menu .count){background:var(--accent-light);color:var(--accent)} [data-theme="dark"] :is(.icon-button:hover,.action:hover,.compact-entry:hover,.entry-group summary:hover,.timeline-search #timeline-search-clear:hover,.ae-row button){background:var(--surface-raised);color:var(--accent)} [data-theme="dark"] .stat.documented,[data-theme="dark"] .gap-area.clear{background:#20342e;border-color:#345447;color:var(--green)} [data-theme="dark"] .stat.under,[data-theme="dark"] :is(.gap-area:not(.clear),#overlap-hint){background:#372e22;border-color:#665333;color:var(--amber)} [data-theme="dark"] .gap-link{background:#30291f;border-color:#80643c;color:var(--amber)} [data-theme="dark"] .progress{background:#345447}[data-theme="dark"] .under .progress{background:#665333} [data-theme="dark"] :is(.activity-state,.status-badge,.billing-tag){background:#203b31;color:var(--green)} [data-theme="dark"] .billing-tag.nonbill{background:var(--accent-light);color:var(--accent)} [data-theme="dark"] :is(.timeline-detail,.timeline-pin-bar){background:#252230;border-color:#493e60} [data-theme="dark"] .timeline-panel .unified-track,[data-theme="dark"] .track{background:#171a23;border-color:var(--line)} [data-theme="dark"] .timeline-panel .unified-track .block:not(.gap){border-color:#171a23} [data-theme="dark"] :is(.pause-marker,.pause-dot){background:repeating-linear-gradient(135deg,#39404d,#39404d 4px,#262c36 4px,#262c36 8px);border-color:#697383;color:#d0d6e1} [data-theme="dark"] .block.gap{background:repeating-linear-gradient(135deg,#735a33,#735a33 3px,#463824 3px,#463824 7px)} [data-theme="dark"] :is(.error,.error-banner,#form-error,#settings-error){color:#ffb1b1}[data-theme="dark"] .error-banner{background:#41272d;border-color:#79434f} [data-theme="dark"] dialog::backdrop{background:#090b12a6} @media(max-width:580px){.topbar{flex-wrap:wrap;height:auto;min-height:70px;padding:12px 16px;gap:8px}.topbar .brand{margin-right:auto}.theme-toggle{width:34px;height:34px}} .connections-icon{display:block}.topbar #connections{width:36px;height:36px;padding:0;display:inline-grid;place-items:center;flex-shrink:0;border-radius:8px;background:transparent}.topbar #connections:hover{background:var(--accent-light)}@media(max-width:580px){.topbar #connections{width:34px;height:34px}} .activity-import{border-left:3px solid var(--accent);background:var(--accent-light);padding:12px 14px}.activity-customer-summary{display:grid;gap:3px;min-width:0}.activity-customer-label{font-size:10px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.6px}.activity-customer-summary strong{color:var(--ink);font-size:14px;overflow-wrap:anywhere}.activity-customer-note{font-size:12px;color:var(--accent);overflow-wrap:anywhere}.activity-source-note{margin-top:9px;padding-top:8px;border-top:1px solid var(--accent-border);font-size:11px;color:var(--muted)}#choose-ticket{overflow-wrap:anywhere}[data-theme="dark"] .activity-import{border-left-color:var(--accent);background:var(--accent-light)} .ticket-checklists{margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}.checklist-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.checklist-heading h3{margin:0;color:var(--accent);font-size:13px}.checklist-content{white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;line-height:1.75;color:var(--ink);padding:14px 16px;border:1px solid var(--line);border-radius:9px;background:var(--accent-light)} .checklist-content{white-space:normal;padding:0;background:transparent;border:0}.checklist-group{margin-top:12px;border:1px solid var(--line);border-radius:9px;overflow:hidden}.checklist-group h4{margin:0;padding:10px 14px;background:var(--accent-light);font-size:13px;color:var(--accent)}.checklist-items{list-style:none;padding:0;margin:0}.checklist-row{display:flex;align-items:baseline;gap:10px;padding:9px 14px;border-top:1px solid var(--line);font-size:13px}.checklist-row:first-child{border-top:0}.checklist-label{flex:1;min-width:0;white-space:pre-wrap;overflow-wrap:anywhere}.checklist-mark{color:var(--green);flex-shrink:0}.checklist-status{font-size:11px;color:var(--muted);background:var(--accent-light);border-radius:5px;padding:2px 6px;max-width:38%;overflow-wrap:anywhere}.checklist-status.is-done{color:var(--green);background:transparent}.checklist-level-1{padding-left:28px}.checklist-level-2{padding-left:42px}.checklist-level-3{padding-left:56px}.checklist-level-4,.checklist-level-5{padding-left:70px}@media(max-width:580px){.checklist-row{gap:7px;padding-right:10px}.checklist-level-3,.checklist-level-4,.checklist-level-5{padding-left:42px}} .booking-checklists{grid-column:1/-1;border:1px solid var(--line);border-radius:10px;margin:3px 0 14px;min-width:0;overflow:hidden}.booking-checklists>summary{padding:11px 14px;cursor:pointer;color:var(--accent);font-size:13px;font-weight:600;background:var(--accent-light)}#booking-checklist-count{float:right;font-size:12px;font-weight:400}.booking-checklists-body{padding:0 14px 14px}.booking-checklists .checklist-heading{margin:8px 0 0}.booking-checklists .checklist-heading p{margin:0}.checklist-complete{flex-shrink:0;font-size:11px!important;padding:4px 8px!important}.booking-checklists .checklist-row{align-items:center}#entry-form[inert] .checklist-complete{opacity:.5}@media(max-width:580px){.booking-checklists-body{padding:0 8px 10px}.booking-checklists .checklist-row{flex-wrap:wrap}.booking-checklists .checklist-label{flex-basis:60%}.booking-checklists .checklist-status{margin-left:22px}.booking-checklists .checklist-complete{margin-left:auto}} .checklist-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;flex-shrink:0}.checklist-actions .secondary{font-size:12px;padding:6px 10px}.booking-checklists .checklist-heading{flex-wrap:wrap;gap:8px} .weekend-note{margin:6px 0 0;font-size:12px;line-height:1.4;color:var(--accent);overflow-wrap:anywhere}.documented.no-target .progress{display:none} /* Personal week: compact navigation with text as well as color cues. */ .week-overview{margin:0 0 16px;min-width:0}.week-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-bottom:8px;font-size:12px;font-weight:600;color:var(--ink)}#week-range{margin-left:6px;color:var(--muted);font-weight:400}#week-summary{font-size:11px;color:var(--green);font-weight:400}.week-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px}.week-day{position:relative;min-width:0;text-align:left;padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--surface,#fff);color:var(--ink);cursor:pointer;transition:background .18s,border-color .18s}.week-day:hover{background:var(--accent-light)}.week-day:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.week-day[aria-pressed=true]{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.week-day-top{display:flex;flex-wrap:wrap;align-items:center;gap:4px;font-size:12px}.week-day-top>span{font-size:10px;color:var(--muted)}.week-day-top i{margin-left:auto;font-style:normal}.week-day-status{display:block;font-size:11px;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--muted)}.week-day.is-complete{background:color-mix(in srgb,var(--green) 9%,var(--surface,#fff))}.week-day.is-complete i,.week-day.is-complete .week-day-status{color:var(--green)}.week-day.is-missing i{color:var(--amber)}.week-day.is-error i{color:var(--amber)}.week-day.is-future,.week-day.is-weekend{background:var(--accent-light);color:var(--muted)}.week-day.is-loading i{animation:week-pulse 1s ease-in-out infinite}.week-days[inert]{opacity:.65} .day-achievement{display:flex;align-items:center;gap:10px;margin:0 0 15px;padding:11px 14px;border:1px solid color-mix(in srgb,var(--green) 30%,transparent);border-radius:11px;background:color-mix(in srgb,var(--green) 9%,var(--surface,#fff));color:var(--green)}.achievement-check{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:color-mix(in srgb,var(--green) 15%,transparent);flex-shrink:0;font-weight:700}.day-achievement strong{display:block;font-size:13px}.day-achievement div>span{display:block;font-size:11px;margin-top:2px}.achievement-spark{margin-left:auto;font-size:23px}.day-achievement.celebrate{animation:day-celebration 1.6s ease-out}.day-achievement.celebrate .achievement-spark{animation:day-spark 1.3s ease-out}@keyframes day-celebration{0%{transform:translateY(5px);opacity:.3}30%{transform:translateY(0);opacity:1;box-shadow:0 0 0 5px color-mix(in srgb,var(--green) 12%,transparent)}100%{box-shadow:0 0 0 0 transparent}}@keyframes day-spark{0%{transform:scale(.5) rotate(-30deg)}50%{transform:scale(1.3) rotate(20deg)}100%{transform:scale(1) rotate(0)}}@keyframes week-pulse{50%{opacity:.3}} @media(max-width:580px){.week-days{gap:4px}.week-day{padding:7px 3px;text-align:center;border-radius:8px}.week-day-top{flex-direction:column;gap:2px}.week-day-top i{margin:0;font-size:11px}.week-day-status{font-size:9px}.week-heading{font-size:11px}.day-achievement{padding:9px 11px}.day-achievement div>span{line-height:1.4}} @media(prefers-reduced-motion:reduce){.week-day{transition:none}.week-day.is-loading i,.day-achievement.celebrate,.day-achievement.celebrate .achievement-spark{animation:none}} /* Five quiet weekday indicators above the existing date picker. */ .date-and-week{display:flex;flex-direction:column;align-items:flex-end;gap:7px;min-width:0}.date-and-week .week-overview{margin:0}.date-and-week .week-heading{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.date-and-week .week-days{display:flex;gap:5px}.date-and-week .week-day{display:flex;align-items:center;justify-content:center;gap:5px;min-width:42px;padding:5px 7px;border-radius:7px;font-size:10px;line-height:1.3}.date-and-week .week-day strong{font-weight:500}.date-and-week .week-day>span{font-size:11px}.date-and-week .week-day.is-complete>span{color:var(--green)}.date-and-week .week-day.is-missing>span,.date-and-week .week-day.is-error>span{color:var(--amber)}.date-and-week .week-day.is-loading>span{animation:week-pulse 1s ease-in-out infinite}@media(max-width:580px){.date-and-week{align-items:flex-end;max-width:100%;width:100%}.date-and-week .week-day{min-width:36px;padding:5px;gap:4px}}@media(prefers-reduced-motion:reduce){.date-and-week .week-day.is-loading>span{animation:none}} .activity-description-field{grid-column:1/-1;min-width:0}.activity-description-field>textarea{width:100%}.ticket-description-toolbar{flex-wrap:wrap;gap:6px}.ticket-description-toolbar>label{margin-right:auto}.ticket-description-toolbar>.text-button{font-size:11px;white-space:nowrap}.snippet-panel{margin:8px 0 12px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--accent-light);min-width:0;grid-column:1/-1}.snippet-heading,.snippet-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.snippet-heading{justify-content:space-between;font-size:13px}.snippet-heading #snippet-close{font-size:20px;padding:0 4px}.snippet-panel .microcopy{font-size:11px;margin:4px 0 9px}.snippet-row{display:flex;align-items:center;gap:8px;border-top:1px solid var(--line);padding:5px 0;min-width:0}.snippet-preview{border:0;background:transparent;color:var(--ink);min-width:0;flex:1;text-align:left;padding:6px;border-radius:6px}.snippet-preview strong{display:block;font-size:12px;font-weight:600}.snippet-preview code{font-size:10px;color:var(--accent);margin-left:5px}.snippet-preview>span{display:block;color:var(--muted);font-size:11px;white-space:pre-wrap;overflow-wrap:anywhere}.snippet-row>.text-button{font-size:11px;flex-shrink:0}.snippet-actions{margin-top:8px}.snippet-actions button{font-size:12px}#snippet-editor{border-top:1px solid var(--line);margin-top:10px;padding-top:12px}.snippet-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.snippet-panel label{display:block!important;font-size:12px!important;min-width:0;margin:0 0 10px!important}.snippet-panel input,.snippet-panel textarea{width:100%;min-width:0;margin-top:4px}#snippet-error{font-size:12px;margin:8px 0}.snippet-content-fields textarea{display:block;min-height:320px;height:clamp(320px,50vh,640px);resize:vertical;line-height:1.6;padding:14px 16px}#snippet-list{max-height:clamp(320px,65vh,800px);overflow-y:auto;scrollbar-gutter:stable}#snippet-panel[inert]{opacity:.65}@media(max-width:580px){.snippet-fields{grid-template-columns:1fr}.snippet-panel{padding:10px}.ticket-description-toolbar>label{flex-basis:100%}.snippet-actions{gap:10px}} /* Text snippets share the compact workspace menu. */ #snippets-menu .snippet-panel{margin:0;padding:0;border:0;background:transparent}.snippet-missing-shortcut{margin-left:8px;color:var(--amber);font-size:11px;font-weight:400} /* Selectable shortcut preview, positioned at the current textarea caret. */ .snippet-caret-hint{position:fixed;inset:auto;margin:0;padding:10px 12px;width:320px;max-width:calc(100vw - 16px);border:1px solid var(--line);border-radius:10px;background:var(--surface,#fff);color:var(--ink);box-shadow:0 8px 28px #172d3626;z-index:1000;overflow:auto;pointer-events:auto;font:12px/1.45 'DM Sans',system-ui,sans-serif;overflow-wrap:anywhere}.snippet-caret-hint[hidden]{display:none}.snippet-hint-item+.snippet-hint-item{border-top:1px solid var(--line);margin-top:7px;padding-top:7px}.snippet-hint-item strong{display:block;font-size:12px}.snippet-hint-item code{color:var(--accent);margin-right:5px}.snippet-caret-hint p,.snippet-hint-item>span{margin:4px 0;white-space:pre-wrap;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;color:var(--muted)}.snippet-caret-hint small{display:block;margin-top:7px;font-size:10px;color:var(--muted)}[data-theme="dark"] .snippet-caret-hint{background:var(--field)} .snippet-hint-options{max-height:165px;overflow-y:auto;overscroll-behavior:contain;position:relative}.snippet-hint-item{display:block;width:100%;border:1px solid transparent;background:transparent;color:var(--ink);text-align:left;font:inherit;padding:7px 8px;border-radius:6px;cursor:pointer}.snippet-hint-item[aria-selected="true"]{background:var(--accent-light);border-color:var(--accent)}.snippet-hint-item:hover{background:var(--accent-light)}.snippet-hint-item+.snippet-hint-item{margin-top:3px;padding-top:7px}.snippet-hint-item>span{font-size:11px} /* Daily TeamViewer access stays separate from the configuration sections. */ .configuration-menu{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:0}.configuration-menu button[aria-expanded="true"]{background:var(--accent);color:#fff}.configuration-menu button[aria-expanded="true"]:hover{background:var(--accent-hover)}#configuration-panel .menu-panel-content .menu-panel-content{padding:18px 0 0;margin:0;border:0;border-radius:0;background:transparent;box-shadow:none}#configuration-panel .menu-panel .dialog-header h2{font-size:16px}#configuration-panel>.menu-panel-clip>.menu-panel-content>.dialog-header{margin-bottom:12px}@media(max-width:580px){.configuration-menu{gap:6px}.configuration-menu button{font-size:12px;padding:8px}} .topbar .configuration-toggle{display:inline-grid;place-items:center;flex-shrink:0;width:36px;height:36px;padding:0;border:1px solid var(--accent-border);border-radius:8px;background:transparent;color:var(--accent)}.topbar .configuration-toggle:hover{background:var(--accent-light)}.topbar .configuration-toggle[aria-expanded="true"]{background:var(--accent);border-color:var(--accent);color:white}@media(max-width:580px){.topbar .configuration-toggle{width:34px;height:34px}} /* Header actions share the same surfaces, borders and interaction colors. */ .topbar :is(#theme-toggle,#open-changelog,#feature-requests,#open-configuration,#connections,#access-account,#open-controlling){display:inline-grid;place-items:center;flex-shrink:0;width:36px;height:36px;padding:0;border:1px solid var(--accent-border);border-radius:8px;background:transparent;color:var(--accent);transition:background-color .15s,border-color .15s,color .15s} .topbar :is(#theme-toggle,#open-changelog,#feature-requests,#open-configuration,#connections,#access-account,#open-controlling):hover{background:var(--accent-light-hover);border-color:var(--accent);color:var(--accent)} .topbar #open-configuration[aria-expanded="true"]{background:var(--accent);border-color:var(--accent);color:#fff} .topbar #open-configuration[aria-expanded="true"]:hover{background:var(--accent-hover)} [data-theme="dark"] .topbar #open-configuration[aria-expanded="true"]{background:var(--accent-light);border-color:var(--accent);color:var(--accent)} [data-theme="dark"] .topbar #open-configuration[aria-expanded="true"]:hover{background:var(--accent-light-hover)} @media(max-width:580px){.topbar :is(#theme-toggle,#open-changelog,#feature-requests,#open-configuration,#connections,#access-account,#open-controlling){width:34px;height:34px}} @media(prefers-reduced-motion:reduce){.topbar :is(#theme-toggle,#open-changelog,#feature-requests,#open-configuration,#connections,#access-account,#open-controlling){transition:none}} .ticket-picker-tools{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:12px}.picker-scopes{display:flex;gap:5px}.picker-scopes button{border:1px solid var(--line);border-radius:7px;padding:6px 10px;background:transparent;color:var(--muted);font-size:12px}.picker-scopes button[aria-pressed="true"]{background:var(--accent-light);color:var(--accent);border-color:var(--accent-border)}.picker-done{display:flex;align-items:center;gap:7px;margin:0!important;font-size:12px!important;color:var(--muted)}.picker-done input{accent-color:var(--accent)}.ticket-picker-row{display:flex;align-items:stretch;gap:5px;margin-bottom:7px}.ticket-picker-row>.picker-result{flex:1;min-width:0;margin:0}.favorite-star{display:grid;place-items:center;align-self:center;flex-shrink:0;width:36px;height:36px;padding:0;border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--muted)}.favorite-star[aria-pressed="true"]{color:var(--accent);background:var(--accent-light)}.favorite-star:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-light-hover)}.favorite-star:disabled{opacity:.45;cursor:wait}#favorite-error{color:var(--amber)} /* Ticket search loads the next complete batch near the end of the result list. */ .picker-scroll{max-height:52vh;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;overflow-anchor:none}.picker-scroll .picker-results{max-height:none;overflow:visible}.picker-tail{padding:8px 2px 3px;text-align:center}.picker-tail .microcopy{margin:4px 0 8px}.picker-tail button{font-size:12px} /* Ticket status stays visible without a text label in search and favorites. */ #picker-results .picker-result[data-ticket-status]{border-left:4px solid var(--ticket-status-color,#7e899a);background:color-mix(in srgb,var(--ticket-status-color,#7e899a) 6%,var(--surface,#fff))} .picker-result[data-ticket-status="done"]{--ticket-status-color:#299b59} .picker-result[data-ticket-status="working"]{--ticket-status-color:#d4ac15} .picker-result[data-ticket-status="waiting"]{--ticket-status-color:#e47b24} #picker-results .picker-result[data-ticket-status]:hover{border-left-color:var(--ticket-status-color,#7e899a);background:color-mix(in srgb,var(--ticket-status-color,#7e899a) 13%,var(--surface,#fff))} [data-theme="dark"] .picker-result[data-ticket-status="done"]{--ticket-status-color:#67d696} [data-theme="dark"] .picker-result[data-ticket-status="working"]{--ticket-status-color:#efd34e} [data-theme="dark"] .picker-result[data-ticket-status="waiting"]{--ticket-status-color:#ff9d52} .topbar #open-changelog[aria-expanded="true"]{background:var(--accent-light);border-color:var(--accent);color:var(--accent)} .changelog-entries{max-height:55vh;overflow-y:auto;overscroll-behavior:contain;padding:2px 12px 2px 2px;scrollbar-gutter:stable} .changelog-day{display:grid;grid-template-columns:110px minmax(0,1fr);gap:18px;padding:16px 0;border-top:1px solid var(--line)} .changelog-day:first-child{padding-top:0;border-top:0}.changelog-day:last-child{padding-bottom:0} .changelog-day h3{margin:1px 0 0;font-size:13px;font-weight:600;color:var(--accent)} .changelog-day ul{margin:0;padding-left:18px;font-size:13px;line-height:1.6;color:var(--ink)} .changelog-day li+li{margin-top:7px}.changelog-day li::marker{color:var(--accent)} @media(max-width:580px){.changelog-day{grid-template-columns:1fr;gap:8px}.changelog-entries{padding-right:5px}} /* Keep all header actions together after adding the changelog icon. */ @media(max-width:580px){.topbar{gap:6px}.topbar .brand{font-size:18px;gap:6px}.topbar .brand-logo{width:28px;height:30px}} @media(max-width:480px){.topbar{justify-content:flex-end}.topbar .brand{flex-basis:100%}} #booking-checklist-content .checklist-state-select{width:auto;max-width:180px;flex-shrink:0;margin:0;padding:5px 8px;font-size:12px;align-self:center} #details-dialog>.inline-details-clip>.inline-details-content>.dialog-actions{justify-content:flex-start;margin:0 0 20px} @media(max-width:580px){#booking-checklist-content .checklist-row{flex-wrap:wrap}#booking-checklist-content .checklist-state-select{max-width:100%;font-size:16px}} /* Mampfi: drop-only mascot and editable mail preview. */ .mampfi-dock{display:block;position:fixed;right:22px;bottom:16px;z-index:35;max-width:calc(100vw - 24px)} .mampfi-toggle{display:flex;width:70px;height:70px;margin-left:auto;border-radius:50%;cursor:default;filter:drop-shadow(0 4px 8px #3e288320)} .mampfi-creature{flex:none;overflow:visible}.mampfi-body{transform-origin:44px 74px;animation:mampfi-breathe 5s ease-in-out infinite}.mampfi-eyes{transform-origin:44px 36px;animation:mampfi-blink 7s infinite}.mampfi-mouth{transform-origin:44px 55px;transition:transform .2s} .is-hungry .mampfi-toggle{outline:3px solid var(--accent);outline-offset:4px;background:var(--accent-light)}.is-hungry .mampfi-mouth{transform:scale(1.1,1.45)}.is-eating .mampfi-body{animation:mampfi-chew .45s ease-in-out infinite} .mampfi-panel{width:560px;max-width:calc(100vw - 24px);max-height:min(calc(100dvh - 112px),840px);overflow:auto;overscroll-behavior:contain;margin-bottom:10px;background:var(--surface,#fff);border:1px solid var(--accent-border);border-radius:20px;padding:22px 26px;box-shadow:0 16px 50px #23153626;animation:mampfi-arrive .18s ease-out} .mampfi-panel .dialog-header{align-items:center;margin-bottom:12px}.mampfi-panel .dialog-header button{font-size:24px;line-height:1;padding:2px 6px}.mampfi-eyebrow{font-size:10px;font-weight:750;letter-spacing:1.5px;color:var(--accent)} .mampfi-panel h2{font-family:Manrope,system-ui;font-size:20px;line-height:1.4;letter-spacing:-.3px;margin:0;overflow-wrap:anywhere}.mampfi-panel p{margin:8px 0}.mampfi-panel #mampfi-sender{font-size:12px;margin:4px 0 18px;color:var(--muted);overflow-wrap:anywhere}.mampfi-panel label{font-size:12px;font-weight:650;color:var(--ink)} .mampfi-assignment{border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:12px}.mampfi-section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px}.mampfi-match{font-size:13px;overflow-wrap:anywhere;color:var(--muted)}.mampfi-panel .mampfi-match{margin:6px 0 0} .mampfi-panel #mampfi-customer-query{width:100%;min-width:0;margin-top:10px;border:1px solid var(--line);border-radius:8px;background:var(--field,#faf9fc);color:var(--ink);padding:10px;font-size:13px}.mampfi-customer-results{max-height:180px;overflow:auto;overscroll-behavior:contain}.mampfi-customer-results button{display:flex;flex-direction:column;gap:3px;width:100%;padding:10px;border:0;border-bottom:1px solid var(--line);text-align:left;background:transparent;color:var(--ink);font-size:13px;overflow-wrap:anywhere}.mampfi-customer-results button span{color:var(--muted);font-size:11px}.mampfi-customer-results button:hover,.mampfi-customer-results button:focus-visible{background:var(--accent-light)} .mampfi-panel .mampfi-ticket-status{padding:11px 14px;margin:0 0 16px;border-radius:10px;background:var(--accent-light);color:var(--accent);font-size:13px;overflow-wrap:anywhere} .mampfi-panel textarea{width:100%;min-width:0;margin:7px 0 0;resize:vertical;background:var(--field,#faf9fc);color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:12px;font-size:14px;line-height:1.6} .mampfi-modes{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;margin:16px 0 12px;background:var(--field,#faf9fc);border:1px solid var(--line);border-radius:11px}.mampfi-modes button{padding:10px 6px;border:1px solid transparent;border-radius:7px;background:transparent;color:var(--muted);font-size:13px}.mampfi-modes button[aria-pressed=true]{background:var(--accent-light);border-color:var(--accent-border);color:var(--accent);font-weight:650}.mampfi-modes button:hover{color:var(--accent)} .mampfi-actions{display:flex;gap:10px;margin-top:24px}.mampfi-actions button{font-size:13px;padding:11px 12px}.mampfi-actions .primary{flex:1;width:auto}.mampfi-panel strong,#mampfi-message{overflow-wrap:anywhere}.mampfi-panel p:empty{display:none}.mampfi-panel [hidden],.mampfi-dock[hidden]{display:none!important} @keyframes mampfi-breathe{50%{transform:translateY(-2px) rotate(-2deg)}}@keyframes mampfi-blink{0%,44%,48%,100%{transform:scaleY(1)}46%{transform:scaleY(.1)}}@keyframes mampfi-chew{50%{transform:scale(1.05,.94) rotate(2deg)}}@keyframes mampfi-arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}} @media(max-width:600px){.mampfi-dock{right:12px;bottom:12px}.mampfi-toggle,.mampfi-creature{width:52px;height:52px}.mampfi-panel{max-height:calc(100dvh - 90px);padding:18px}.mampfi-panel textarea,.mampfi-panel #mampfi-customer-query{font-size:16px}} @media(prefers-reduced-motion:reduce){.mampfi-body,.mampfi-eyes,.mampfi-panel,.is-eating .mampfi-body{animation:none}.mampfi-mouth{transition:none}} .mampfi-arm{transition:transform .2s;transform-origin:44px 48px}.is-hungry .mampfi-arm-left{transform:rotate(16deg)}.is-hungry .mampfi-arm-right{transform:rotate(-16deg)}.is-eating .mampfi-mouth{animation:mampfi-nibble .45s ease-in-out infinite} @keyframes mampfi-nibble{50%{transform:scale(1.08,.55)}} .mampfi-time-preview{display:flex;gap:18px;align-items:flex-start;margin-top:10px;font-size:12px;color:var(--muted)}.mampfi-time-preview>span{font-weight:650}.mampfi-time-preview p{margin:0;color:var(--ink);line-height:1.5} @media(prefers-reduced-motion:reduce){.is-eating .mampfi-mouth{animation:none}.mampfi-arm{transition:none}} /* Floating droplet mascot with independently moving fins and face. */ .mampfi-toggle{width:104px;height:104px;filter:drop-shadow(0 3px 4px #27154015)} .mampfi-glider{display:block;width:100%;height:100%;overflow:visible;pointer-events:none} .mampfi-glider-float{transform-origin:60px 65px;animation:mampfi-glider-hover 4s ease-in-out infinite} .mampfi-glider-shadow{transform-origin:62px 107px;animation:mampfi-glider-shadow 4s ease-in-out infinite} .mampfi-glider-eyes{transform-origin:60px 53px;animation:mampfi-glider-blink 7s infinite} .mampfi-glider-pupils{transition:transform .2s} .mampfi-glider-mouth{opacity:0;transform-origin:61px 73px;transform:scaleY(.2);transition:opacity .15s,transform .25s} .mampfi-glider-smile{transition:opacity .15s} .mampfi-glider-letter{opacity:0;transform-origin:62px 72px;transform:translateY(-22px) rotate(-14deg);transition:opacity .2s,transform .25s} .is-hungry .mampfi-toggle{outline:0;background:transparent} .is-hungry .mampfi-glider-float{animation:mampfi-glider-eager .8s ease-in-out infinite} .is-hungry .mampfi-glider-eyes,.is-eating .mampfi-glider-eyes{animation:none} .is-hungry .mampfi-glider-pupils{transform:translate(-2px,-3px)} .is-hungry .mampfi-glider-smile,.is-eating .mampfi-glider-smile{opacity:0} .is-hungry .mampfi-glider-mouth{opacity:1;transform:scaleY(1.1)} .is-hungry .mampfi-glider-letter{opacity:1;transform:translateY(-9px) rotate(-14deg)} .is-eating .mampfi-glider-float{animation:mampfi-glider-chew .42s ease-in-out infinite} .is-eating .mampfi-glider-mouth{opacity:1;animation:mampfi-glider-chomp .42s ease-in-out infinite} .is-eating .mampfi-glider-eyes{transform:scaleY(.86)} .is-eating .mampfi-glider-letter{animation:mampfi-glider-swallow .65s ease-in forwards} .mampfi-panel{max-height:min(calc(100dvh - 146px),840px)} @keyframes mampfi-glider-hover{0%,100%{transform:translateY(1px) rotate(2deg)}50%{transform:translateY(-5px) rotate(-2deg)}} @keyframes mampfi-glider-shadow{50%{transform:scaleX(.8);opacity:.08}} @keyframes mampfi-glider-blink{0%,44%,48%,100%{transform:scaleY(1)}46%{transform:scaleY(.1)}} @keyframes mampfi-glider-eager{0%,100%{transform:translateY(-3px) rotate(-5deg)}50%{transform:translateY(-7px) rotate(-1deg)}} @keyframes mampfi-glider-chew{0%,100%{transform:scale(1.035,.96)}50%{transform:scale(.98,1.035)}} @keyframes mampfi-glider-chomp{0%,100%{transform:scaleY(.22)}50%{transform:scaleY(1)}} @keyframes mampfi-glider-swallow{0%{opacity:1;transform:translateY(-9px) rotate(-14deg)}70%{opacity:1}100%{opacity:0;transform:translateY(7px) rotate(6deg) scale(.15)}} @media(max-width:600px){.mampfi-toggle{width:76px;height:76px}.mampfi-panel{max-height:calc(100dvh - 114px)}} @media(prefers-reduced-motion:reduce){.mampfi-glider *{animation:none!important;transition:none!important}.is-eating .mampfi-glider-mouth{transform:scaleY(.65)}} /* Mail document selection and upload recovery. */ .mail-documents{grid-column:1/-1;margin:16px 0;padding:14px;border:1px solid var(--line);border-radius:12px;min-width:0;font-size:12px} .mail-documents strong{font-size:12px}.mail-documents label.mail-document-row{display:flex;align-items:flex-start;gap:9px;margin:10px 0;font-size:12px;font-weight:400;cursor:pointer} .mail-documents .mail-document-row input[type=checkbox]{width:16px;height:16px;flex:0 0 16px;margin:2px 0;padding:0;accent-color:var(--accent)} .mail-document-row span{min-width:0;overflow-wrap:anywhere}.mail-document-row small{display:block;color:var(--muted);font-size:11px;margin-top:3px} .mail-upload-jobs{margin-top:20px;border-top:1px solid var(--line);padding-top:14px;font-size:12px} .mail-upload-job{padding:10px 0}.mail-upload-job ul{padding-left:18px;line-height:1.6;overflow-wrap:anywhere}.mail-upload-job button{font-size:12px;margin:4px 8px 0 0}.mail-upload-job p{color:var(--muted);line-height:1.5} .mail-documents[hidden],.mail-upload-jobs[hidden]{display:none} .snippet-row-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}.snippet-row-actions>.text-button{font-size:11px}@media(max-width:580px){.snippet-row-actions{flex-direction:column;align-items:flex-end;gap:2px}} .booking-documents{padding:10px;margin:6px 0}.document-dropzone{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;padding:14px 10px;border:1px dashed var(--line);border-radius:8px;background:transparent;color:var(--muted);font:inherit;cursor:pointer;transition:background .15s,border-color .15s}.document-dropzone svg{flex-shrink:0}.document-dropzone:hover,.document-dropzone.is-dragging,.document-dropzone:focus-visible{border-color:var(--accent);background:var(--accent-light);color:var(--accent)}.document-dropzone:disabled{cursor:wait;opacity:.65}.booking-documents input[hidden]{display:none}.booking-documents .microcopy{margin:7px 0 0;font-size:10px}.booking-documents .error-banner{margin-top:8px} /* Customer access: compact entry list with one expanded selection. */ #open-customer-access{display:inline-flex;align-items:center;gap:6px} .access-search{display:flex;gap:10px}.access-search input{min-width:0;flex:1;border:1px solid var(--line);border-radius:8px;background:var(--surface,#fff);color:var(--ink);padding:10px 12px} .access-customer{font-weight:600;white-space:pre-line}#customer-access-results{max-height:280px;overflow:auto} .access-category{border:1px solid var(--line);border-radius:9px;margin:7px 0;overflow:hidden}.access-category>summary{padding:8px 12px;cursor:pointer;font-size:13px;font-weight:600;background:color-mix(in srgb,var(--green) 5%,var(--surface,#fff))}.access-category .count{margin-left:6px} .access-entry-list{padding:0 8px}.access-entry{min-width:0;border-bottom:1px solid var(--line);background:var(--surface,#fff)}.access-entry:last-child{border-bottom:0} .access-entry-heading{display:flex;align-items:center;gap:8px;padding-right:5px;border-radius:6px;transition:background .15s}.access-entry-heading:hover{background:var(--bg)}.access-entry.is-selected>.access-entry-heading{background:var(--accent-light);color:var(--accent);margin-top:3px} .access-entry-select{display:flex;align-items:center;gap:9px;flex:1;min-width:0;min-height:39px;padding:8px 7px;border:0;background:transparent;color:inherit;font:inherit;font-size:13px;text-align:left;cursor:pointer}.access-entry-select span{overflow-wrap:anywhere;line-height:1.4}.access-entry-select .access-icon{width:13px;height:13px;color:var(--muted);transition:transform .16s}.access-entry-select[aria-expanded="true"]{font-weight:650}.access-entry-select[aria-expanded="true"] .access-icon{transform:rotate(90deg);color:var(--accent)} .access-entry-detail{padding:5px 11px 12px 29px;animation:access-detail-in .15s ease-out}.access-entry-detail[hidden]{display:none}.access-entry dl{margin:0} .access-field{display:grid;grid-template-columns:minmax(80px,120px) minmax(0,1fr);align-items:center;gap:14px;padding:4px 0;border-bottom:1px solid var(--line)}.access-field:last-child{border-bottom:0} .access-field dt{font-size:12px;line-height:1.45;color:var(--muted);margin:0;overflow-wrap:anywhere}.access-field dd{display:flex;min-width:0;gap:10px;align-items:center;justify-content:space-between;margin:0;font-size:13px;line-height:1.45}.access-value{white-space:pre-wrap;overflow-wrap:anywhere;min-width:0}.access-field-actions{display:flex;gap:3px;flex-shrink:0;align-items:center} .access-icon{display:block;flex-shrink:0;pointer-events:none}.access-action,.access-teamviewer{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:30px;height:30px;padding:6px;border:1px solid transparent;border-radius:6px;background:transparent;color:var(--muted);text-decoration:none;cursor:pointer}.access-action:hover,.access-action[aria-pressed="true"]{background:var(--accent-light);color:var(--accent)}.access-teamviewer{color:var(--green);background:color-mix(in srgb,var(--green) 7%,var(--surface,#fff))}.access-teamviewer:hover{background:color-mix(in srgb,var(--green) 15%,var(--surface,#fff))} .access-action:focus-visible,.access-teamviewer:focus-visible,.access-entry-select:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.access-action:disabled,.access-teamviewer:disabled{opacity:.45;cursor:default}.access-teamviewer[aria-disabled="true"]{opacity:.55;cursor:wait}.access-teamviewer[aria-busy="true"] svg{animation:access-icon-pulse .8s infinite alternate}.access-spinning{animation:access-icon-spin .8s linear infinite}.access-empty{padding:0 10px} @keyframes access-detail-in{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:translateY(0)}}@keyframes access-icon-spin{to{transform:rotate(360deg)}}@keyframes access-icon-pulse{to{opacity:.35}} @media(max-width:580px){.access-field{grid-template-columns:1fr;gap:1px;padding:5px 0}.access-entry-detail{padding-left:13px;padding-right:5px}.access-search{flex-wrap:wrap}.access-search input{width:100%}.access-entry-select{min-height:42px}.access-entry-list{padding:0 5px}} @media(pointer:coarse){.access-action,.access-teamviewer{width:36px;height:36px}.access-entry-select{min-height:44px}} @media(prefers-reduced-motion:reduce){.access-entry-detail,.access-spinning,.access-teamviewer[aria-busy="true"] svg{animation:none}.access-entry-select .access-icon{transition:none}} /* Optional per-user Windows companion. */ .access-helper{margin:0 0 14px;border-bottom:1px solid var(--line);padding-bottom:10px}.access-helper>summary{cursor:pointer;font-size:12px;color:var(--muted);width:fit-content}.access-helper-tools{display:flex;align-items:end;gap:10px;flex-wrap:wrap;margin:10px 0}.access-helper-tools label{font-size:12px;display:grid;gap:5px;min-width:220px}.access-helper-tools a{text-decoration:none;font-size:12px}.access-autotype{display:none}#customer-access-panel[data-helper="ready"] .access-autotype{display:inline-flex}.access-helper .microcopy{margin:8px 0}.access-field-actions{flex-wrap:wrap}@media(max-width:600px){.access-helper-tools label{min-width:0;width:100%}.access-helper-tools>*{max-width:100%}} .access-helper-tools select{font:inherit;font-size:13px;border:1px solid var(--line);border-radius:8px;padding:8px 10px;color:var(--ink);background:var(--bg);min-height:36px;max-width:100%} /* A secret helmet for a mascot that has been poked once too often. */ .mampfi-toggle{user-select:none;-webkit-user-select:none;touch-action:manipulation;outline:none}.mampfi-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:2px} .mampfi-temper,.mampfi-slayer{opacity:0;pointer-events:none;transition:opacity .18s}.mampfi-slayer{transform-origin:62px 66px}.mampfi-anger-mark{opacity:0}.mampfi-temper .mampfi-frown{opacity:0} .mampfi-dock[data-mood="annoyed"] .mampfi-temper,.mampfi-dock[data-mood="angry"] .mampfi-temper{opacity:1} .mampfi-dock[data-mood="annoyed"] .mampfi-glider-eyes{animation:none;transform:scaleY(.88);transform-origin:60px 55px} .mampfi-dock[data-mood="annoyed"] .mampfi-glider-smile{opacity:.25} .mampfi-dock[data-mood="angry"] .mampfi-glider-eyes{animation:none;transform:scaleY(.77);transform-origin:60px 55px} .mampfi-dock[data-mood="angry"] .mampfi-glider-smile{opacity:0}.mampfi-dock[data-mood="angry"] .mampfi-frown,.mampfi-dock[data-mood="angry"] .mampfi-anger-mark{opacity:1} .mampfi-dock[data-mood="angry"] .mampfi-glider-float{animation:mampfi-grumble .3s ease-in-out infinite} .mampfi-dock[data-mood="slayer"] .mampfi-slayer{opacity:1} .mampfi-helmet-shell{transform-origin:62px 50px}.mampfi-helmet-visor{transform-origin:62px 38px}.mampfi-helmet-left{transform-origin:30px 54px}.mampfi-helmet-right{transform-origin:94px 54px}.mampfi-helmet-glint{opacity:0} .mampfi-dock[data-mood="slayer"] .mampfi-helmet-shell{animation:mampfi-helmet-on .48s ease-out both} .mampfi-dock[data-mood="slayer"] .mampfi-helmet-left{animation:mampfi-helmet-left .38s .12s ease-out both} .mampfi-dock[data-mood="slayer"] .mampfi-helmet-right{animation:mampfi-helmet-right .38s .12s ease-out both} .mampfi-dock[data-mood="slayer"] .mampfi-helmet-chin{animation:mampfi-helmet-chin .35s .22s ease-out both} .mampfi-dock[data-mood="slayer"] .mampfi-helmet-visor{animation:mampfi-visor-close .44s .3s cubic-bezier(.25,.8,.25,1) both} .mampfi-dock[data-mood="slayer"] .mampfi-helmet-glint{animation:mampfi-visor-glint .55s .72s ease-out both} .mampfi-dock[data-mood="slayer"] .mampfi-glider-eyes,.mampfi-dock[data-mood="slayer"] .mampfi-glider-smile{animation:mampfi-face-cover .12s .48s both} .mampfi-dock[data-mood="slayer"] .mampfi-glider-float{animation:mampfi-hero-hover 1.8s ease-in-out infinite} @keyframes mampfi-grumble{0%,100%{transform:translateX(-.8px) rotate(-1deg)}50%{transform:translateX(.8px) rotate(1deg)}} @keyframes mampfi-helmet-on{0%{opacity:0;transform:translateY(-24px) rotate(-6deg)}75%{opacity:1;transform:translateY(2px) rotate(1deg)}100%{opacity:1;transform:translateY(0) rotate(0)}} @keyframes mampfi-helmet-left{from{opacity:0;transform:translateX(-13px) rotate(-20deg)}to{opacity:1;transform:translateX(0) rotate(0)}} @keyframes mampfi-helmet-right{from{opacity:0;transform:translateX(13px) rotate(20deg)}to{opacity:1;transform:translateX(0) rotate(0)}} @keyframes mampfi-helmet-chin{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}} @keyframes mampfi-visor-close{0%{opacity:0;transform:translateY(-19px) scaleY(.18)}25%{opacity:1}85%{transform:translateY(1px) scaleY(1.02)}100%{opacity:1;transform:translateY(0) scaleY(1)}} @keyframes mampfi-face-cover{from{opacity:1}to{opacity:0}} @keyframes mampfi-visor-glint{0%,100%{opacity:0}35%{opacity:.85}} @keyframes mampfi-hero-hover{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-3px) rotate(2deg)}} /* A complete shell, with a separate return sequence before clearing the mood. */ .mampfi-slayer{transition:none} .mampfi-dock[data-mood="slayer"] .mampfi-original{animation:mampfi-face-cover .12s .68s both} .mampfi-dock[data-mood="unhelmet"] .mampfi-original{animation:mampfi-head-reveal .16s .08s both} .mampfi-dock[data-mood="unhelmet"] .mampfi-slayer{opacity:1} .mampfi-dock[data-mood="unhelmet"] .mampfi-glider-float{animation:mampfi-hero-hover 1.8s ease-in-out infinite} .mampfi-dock[data-mood="unhelmet"] .mampfi-helmet-visor{animation:mampfi-visor-open .38s ease-in both} .mampfi-dock[data-mood="unhelmet"] .mampfi-helmet-left{animation:mampfi-helmet-left .36s .16s ease-in reverse both} .mampfi-dock[data-mood="unhelmet"] .mampfi-helmet-right{animation:mampfi-helmet-right .36s .16s ease-in reverse both} .mampfi-dock[data-mood="unhelmet"] .mampfi-helmet-chin{animation:mampfi-helmet-chin .32s .12s ease-in reverse both} .mampfi-dock[data-mood="unhelmet"] .mampfi-helmet-shell{animation:mampfi-helmet-off .46s .4s ease-in both} @keyframes mampfi-head-reveal{from{opacity:0}to{opacity:1}} @keyframes mampfi-visor-open{0%{opacity:1;transform:translateY(0) scaleY(1)}70%{opacity:1}100%{opacity:0;transform:translateY(-22px) scaleY(.18)}} @keyframes mampfi-helmet-off{0%{opacity:1;transform:translateY(0) rotate(0)}40%{opacity:1}100%{opacity:0;transform:translateY(-30px) rotate(6deg)}} @media(prefers-reduced-motion:reduce){.mampfi-dock[data-mood] .mampfi-glider *{animation:none!important;transition:none!important}.mampfi-dock[data-mood="slayer"] .mampfi-original{opacity:0}.mampfi-dock[data-mood="unhelmet"] .mampfi-slayer{opacity:0}.mampfi-dock[data-mood="unhelmet"] .mampfi-original{opacity:1}} /* On-site workspace: one customer, the familiar booking form. */ .field-mode .stats,.field-mode .day-toolbar,.field-mode .timeline-panel,.field-mode #details-dialog,.field-mode #day-achievement,.field-mode #monitoring-live,.field-mode #week-overview,.field-mode .workspace-menu #open-activities,.field-mode .workspace-menu #open-customer-access,.field-mode footer{display:none!important} .field-mode:not(.field-has-ticket) .creation-layout{display:none} .field-mode .mode-tabs,.field-mode #choose-ticket,.field-mode #existing-fields>label:first-child{display:none} .field-mode .heading{margin-bottom:16px}.field-mode .heading h1{font-size:26px} #field-toggle[aria-pressed=true]{background:var(--accent-light);color:var(--accent);border-color:var(--accent-border)} #field-service{margin:16px 0 20px;min-width:0} .field-customer-bar{position:sticky;top:0;z-index:12;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 20px;margin-bottom:14px;background:var(--surface,#fff);border:1px solid var(--accent-border,var(--line));border-left:4px solid var(--accent);border-radius:12px;box-shadow:0 4px 18px #00000009} .field-customer-bar>div{min-width:0}.field-customer-bar span{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.field-customer-bar h2{font-size:18px;line-height:1.3;margin:4px 0 0;overflow-wrap:anywhere}.field-customer-bar button{flex-shrink:0;min-height:42px} .field-search,.field-details,.field-ticket-section{padding:18px 20px;margin-bottom:12px}.field-search input{width:100%}#field-results{max-height:310px;overflow-y:auto} .field-details>summary{font-size:14px;font-weight:650;cursor:pointer;min-height:24px;color:var(--ink)}.field-details[open]>summary{margin-bottom:15px} .field-info-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.field-info-grid h3,.field-helpdesk h3{font-size:12px;margin:0 0 10px;color:var(--muted);font-weight:600}.field-facts{margin:0}.field-facts>div{display:grid;grid-template-columns:105px minmax(0,1fr);gap:10px;margin:7px 0;font-size:13px}.field-facts dt{color:var(--muted)}.field-facts dd{margin:0;overflow-wrap:anywhere}#field-service a{color:var(--accent);text-decoration:none}#field-service a:hover{text-decoration:underline} .field-info-grid address{font-size:13px;font-style:normal;margin-top:12px;line-height:1.6}.field-contacts{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;max-height:270px;overflow-y:auto}.field-contacts article{padding:10px 12px;border:1px solid var(--line);border-radius:8px;display:flex;flex-direction:column;gap:5px;font-size:13px;overflow-wrap:anywhere}.field-contacts article>span{color:var(--muted);font-size:12px}.field-contacts a{padding:3px 0}.field-helpdesk{margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}.field-helpdesk p,#field-ticket-text{white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;line-height:1.6;margin:0;max-height:280px;overflow-y:auto} .field-mode #customer-access-panel{margin:0;border:0;box-shadow:none;background:transparent;display:block;grid-template-rows:1fr}.field-mode #customer-access-panel .menu-panel-content{padding:0}.field-mode #customer-access-panel .dialog-header,.field-mode #customer-access-panel .access-search,.field-mode #customer-access-customer,.field-mode #access-helper-settings{display:none} .field-section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}.field-section-heading h2{font-size:16px;margin:0}.field-section-heading button{min-height:40px}#field-tickets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.field-ticket{display:flex;align-items:center;gap:12px;text-align:left;padding:12px 14px;min-height:66px;border:1px solid var(--line);border-radius:10px;background:var(--surface,#fff);color:var(--ink);font:inherit}.field-ticket>span:nth-child(2){flex:1;min-width:0}.field-ticket small{display:block;font-size:11px;color:var(--muted);margin-bottom:3px}.field-ticket strong{display:block;font-size:13px;overflow-wrap:anywhere}.field-ticket-dot{width:8px;height:8px;border-radius:50%;background:#d9b326;flex-shrink:0}.field-ticket-dot.waiting{background:#ed933c}.field-ticket[aria-pressed=true]{border-color:var(--accent);background:var(--accent-light)}.field-ticket:hover{border-color:var(--accent-border)}.field-ticket:focus-visible{outline:2px solid var(--accent);outline-offset:2px}#field-more{margin-top:12px;width:100%;min-height:42px}#field-message:empty,#field-ticket-message:empty,#field-info-message:empty{display:none}.field-mode .entry-panel{scroll-margin-top:95px}.field-mode .entry-panel #submit-entry{min-height:48px} @media(max-width:650px){.field-info-grid{grid-template-columns:1fr;gap:18px}#field-tickets{grid-template-columns:1fr}.field-search,.field-details,.field-ticket-section{padding:15px}.field-customer-bar{padding:12px;gap:8px}.field-customer-bar h2{font-size:16px}.field-customer-bar button{font-size:11px;padding:8px}.field-mode .heading{gap:12px;align-items:flex-start}.field-mode .heading h1{font-size:23px}.field-mode .heading>div>p{display:none}.field-contacts{grid-template-columns:1fr}.field-mode #selected-ticket{overflow-wrap:anywhere}} #field-booking-context{display:none}.field-mode #field-booking-context{display:block;grid-column:1/-1;padding:10px 12px;margin-bottom:12px;border-left:3px solid var(--accent);background:var(--accent-light);color:var(--ink);font-size:14px;font-weight:600;overflow-wrap:anywhere;border-radius:6px} /* Helpdeskinfo search stays within the loaded customer context. */ .field-helpdesk-search{display:flex;align-items:center;gap:5px;margin-bottom:12px;min-width:0} .field-helpdesk-search input{flex:1;min-width:0;width:0;padding:9px 10px;font-size:13px;border:1px solid var(--line);border-radius:8px;background:var(--surface,#fff);color:var(--ink)} .field-helpdesk-search input::-webkit-search-cancel-button{-webkit-appearance:none} .field-helpdesk-search .text-button{flex:none;min-width:36px;min-height:38px;padding:6px;font-size:18px} #field-helpdesk-count{flex:none;font-size:11px;color:var(--muted)} #field-helpdesk-text mark{color:#453000;background:#fff0a8;border-radius:2px} #field-helpdesk-text mark.current{background:#ffc95b;outline:1px solid #ad7000} html[data-theme="dark"] #field-helpdesk-text mark{color:#fff0bc;background:#55461e} html[data-theme="dark"] #field-helpdesk-text mark.current{color:#fff;background:#805c14;outline-color:#dbaf48} @media(hover:none) and (pointer:coarse){.field-helpdesk-search input{font-size:16px}} /* Transient Easter egg effects never cover the page with an input surface. */ .mampfi-blaster{position:fixed;inset:0;width:100%;height:100%;pointer-events:none!important;z-index:36;contain:strict} @media(prefers-reduced-motion:reduce){.mampfi-blaster{display:none}} /* Hide only the painted block during the decorative fragment animation. */ #timeline .block.mampfi-fractured{opacity:0!important;transition:none!important} /* A saved selection for an on-site visit, shared between the user's devices. */ .field-preparation-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:12px 0 4px} .field-view-tabs{display:flex;gap:3px;padding:4px;border-radius:10px;background:var(--accent-light)} .field-view-tabs button{border:0;border-radius:7px;padding:10px 18px;min-height:42px;color:var(--muted);background:transparent;font:inherit;font-size:13px;font-weight:600} .field-view-tabs button[aria-pressed=true]{color:var(--accent);background:var(--surface,#fff);box-shadow:0 1px 5px #0000000c} .field-plans{padding:16px 20px;margin-bottom:12px}#field-plans-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:8px} .field-plans h2{font-size:14px}.field-plans .picker-result{border:1px solid var(--line);border-radius:8px} .field-pin{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:36px;height:36px;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--muted);cursor:pointer} .field-pin:hover{background:var(--accent-light);color:var(--accent)}.field-pin[aria-pressed=true]{background:var(--accent-light);color:var(--accent);border-color:var(--accent-border)} .field-pin[aria-pressed=true] svg{fill:var(--accent-light)} .field-pinnable{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;min-width:0}.field-pinnable>p,.field-pinnable>strong{min-width:0;overflow-wrap:anywhere}.field-pinnable address{margin:0} .field-facts>div{grid-template-columns:95px minmax(0,1fr) 36px;align-items:center;margin:2px 0}.field-focus-mode .field-facts>div{grid-template-columns:95px minmax(0,1fr)} .field-focus-mode .field-facts>div>span{display:none}.field-info-grid:empty{display:none}.field-info-grid>section:only-child{grid-column:1/-1} #field-helpdesk-text{max-height:320px;overflow-y:auto;overscroll-behavior:contain}.field-helpdesk-part{align-items:center;padding:5px 0}.field-helpdesk-part+.field-helpdesk-part{border-top:1px solid var(--line)}.field-helpdesk-part p{flex:1;max-height:none;overflow:visible;white-space:pre-wrap} .field-ticket-row{display:flex;align-items:center;gap:3px;min-width:0}.field-ticket-row .field-ticket{flex:1;min-width:0;width:0}.field-ticket-dot.done{background:#43a474} #field-service [hidden]{display:none!important}.field-focus-mode .field-contacts{max-height:none} #field-plan-status{margin:8px 0 14px}#field-focus-empty{padding:16px;border:1px dashed var(--accent-border);border-radius:10px} @media(max-width:650px){.field-preparation-toolbar{gap:8px}.field-view-tabs{flex:1}.field-view-tabs button{flex:1;padding:10px 12px}#field-plan-save{min-height:44px;font-size:12px}.field-plans{padding:15px}.field-facts>div{grid-template-columns:82px minmax(0,1fr) 36px;gap:5px}.field-focus-mode .field-facts>div{grid-template-columns:82px minmax(0,1fr)}.field-pin{width:40px;height:40px}.field-ticket-row{gap:2px}.field-helpdesk-search{flex-wrap:wrap}.field-helpdesk-search input{min-width:120px}} /* Personal snippet categories stay within the configuration panel. */ .snippet-group{border:1px solid var(--line);border-radius:10px;margin-bottom:10px;overflow:hidden} .snippet-group>summary{display:flex;align-items:center;gap:10px;padding:12px 14px;cursor:pointer;list-style:none;font-weight:600;font-size:14px;background:var(--accent-light)} .snippet-group>summary::-webkit-details-marker{display:none} .snippet-group>summary::before{content:'›';font-size:20px;line-height:1;transition:transform .15s} .snippet-group[open]>summary::before{transform:rotate(90deg)} .snippet-group>summary>.count{margin-left:auto;font-size:12px;font-weight:400} .snippet-group-content{padding:0 12px 8px}.snippet-category-actions{display:flex;justify-content:flex-end;padding:5px 0}.snippet-category-actions button{font-size:11px} #snippet-category-editor{padding:14px;margin-bottom:14px;border:1px solid var(--line);border-radius:10px} #snippet-category-editor>label{max-width:560px}#snippet-category-delete-note{margin:10px 0 0} #snippet-category{display:block;width:100%;margin-top:4px;border:1px solid var(--line);border-radius:7px;padding:10px 11px;font:inherit;font-size:14px;color:var(--ink);background:var(--surface,#fff)} [data-theme="dark"] .snippet-group>summary{background:var(--surface)} @media(max-width:580px){.snippet-group-content{padding:0 8px 8px}.snippet-group .snippet-row{flex-wrap:wrap}.snippet-group .snippet-preview{flex-basis:100%}.snippet-group .snippet-row-actions{display:flex;gap:10px}} /* Movable, customer-specific on-site tiles. */ #field-board{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start} .field-tile{min-width:0;border:1px solid var(--line);border-radius:14px;background:var(--surface,#fff);overflow:hidden} .field-tile-wide{grid-column:1/-1}.field-tile>.panel{border:0;margin:0;border-radius:0;box-shadow:none} .field-tile-tools{display:flex;align-items:center;justify-content:space-between;padding:4px 12px;background:var(--accent-light);border-bottom:1px solid var(--line)} .field-tile-tools button{font-size:16px;min-height:36px;min-width:36px}.field-tile-handle{touch-action:none;cursor:grab!important;user-select:none}.field-tile-handle span{font-size:11px;margin-left:5px} .field-tile-dragging{opacity:.6}.field-tile-target{outline:2px solid var(--accent);outline-offset:2px}.field-tile-ghost{position:fixed;z-index:1000;pointer-events:none;max-width:170px;padding:10px 14px;background:var(--accent);color:#fff;border-radius:10px;box-shadow:0 6px 22px #0003;font-size:12px} .field-tile:not(.field-tile-wide) .field-info-grid,.field-tile:not(.field-tile-wide) #field-tickets{grid-template-columns:1fr} .field-order{border:1px solid var(--line);border-radius:9px;margin:8px 0;padding:10px;font-size:13px;min-width:0} .field-order-heading{display:flex;align-items:center;gap:8px}.field-order-heading>div{flex:1;min-width:0}.field-order-heading strong{display:block;overflow-wrap:anywhere}.field-order-heading small{color:var(--muted)} .field-order details{margin-top:8px}.field-order summary{cursor:pointer;color:var(--accent);padding:5px 0}.field-order p{white-space:pre-wrap;overflow-wrap:anywhere}.field-order-items{max-height:300px;overflow-y:auto;padding:0;list-style:none}.field-order-items li{border-top:1px solid var(--line);padding:8px 0;white-space:pre-wrap;overflow-wrap:anywhere}.field-order-items small{display:block;color:var(--muted)} #field-order-message:empty{display:none}#field-order-more{margin-top:12px;width:100%} [data-theme="dark"] .field-tile-tools{background:var(--surface)} @media(max-width:800px){#field-board{grid-template-columns:1fr}.field-tile{grid-column:1/-1}.field-tile-tools [data-tile-width]{display:none}.field-tile .field-info-grid,.field-tile #field-tickets{grid-template-columns:1fr}} /* Keep ticket status, checklists and uploads together beside the ticket fields. */ .booking-context-layout{grid-column:1/-1;min-width:0} .booking-ticket-fields,.booking-side-fields{min-width:0} @media(min-width:800px){ .booking-context-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px 28px;align-items:start} .booking-side-fields>label:first-child{margin-top:0} } /* Planned appointments are visible, but do not count as documented work. */ .block.planned,.dot.planned{background:#ed941f} [data-theme="dark"] .block.planned,[data-theme="dark"] .dot.planned{background:#f2a43a} #planned-booking-hint{border-left:3px solid #ed941f} /* Only customer references are remembered; credentials are always fetched anew. */ .access-recent{margin-top:12px} .access-recent-label{display:block;font-size:11px;color:var(--muted);margin-bottom:6px} #customer-access-recent-list{display:flex;flex-wrap:wrap;gap:6px} .access-recent-customer{display:flex;align-items:center;gap:8px;max-width:min(100%,260px);min-width:0;padding:6px 9px;border:1px solid var(--line);border-radius:7px;background:var(--surface,#fff);color:var(--ink);font:inherit;font-size:12px;text-align:left} .access-recent-customer>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .access-recent-customer>small{flex-shrink:0;font-size:10px;color:var(--muted)} .access-recent-customer:hover,.access-recent-customer[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-light);color:var(--accent)} .field-mode #customer-access-recent{display:none} /* Mampfi's quiet everyday expressions; functional interactions take precedence. */ .mampfi-rest-eyes,.mampfi-hardhat,.mampfi-strawhat,.mampfi-sunglasses,.mampfi-zzz,.mampfi-question,.mampfi-burp,.mampfi-ticket-card{opacity:0;pointer-events:none} .mampfi-dock:is([data-mood="calm"],:not([data-mood]))[data-costume="field"] .mampfi-hardhat{opacity:1} .mampfi-dock:is([data-mood="calm"],:not([data-mood]))[data-costume="friday"][data-life="awake"]:not(.is-hungry):not(.is-eating):not([data-reaction="matched"]):not([data-reaction="question"]) :is(.mampfi-sunglasses,.mampfi-strawhat){opacity:1} .mampfi-dock:is([data-mood="calm"],:not([data-mood]))[data-costume="friday"][data-life="awake"]:not(.is-hungry):not(.is-eating):not([data-reaction="matched"]):not([data-reaction="question"]) .mampfi-glider-eyes{opacity:0;animation:none} .mampfi-dock:is([data-mood="calm"],:not([data-mood])):not(.is-hungry):not(.is-eating):not([data-reaction="matched"]):not([data-reaction="question"]):is([data-life="satisfied"],[data-life="sleeping"]) .mampfi-glider-eyes{opacity:0;animation:none} .mampfi-dock:is([data-mood="calm"],:not([data-mood])):not(.is-hungry):not(.is-eating):not([data-reaction="matched"]):not([data-reaction="question"]):is([data-life="satisfied"],[data-life="sleeping"]) .mampfi-rest-eyes{opacity:1} .mampfi-dock:is([data-mood="calm"],:not([data-mood])):not(.is-hungry):not(.is-eating):is([data-life="satisfied"],[data-life="sleeping"]) .mampfi-glider-float{animation:mampfi-rest 6s ease-in-out infinite} .mampfi-dock:is([data-mood="calm"],:not([data-mood]))[data-life="satisfied"]:not(.is-hungry):not(.is-eating) .mampfi-rest-eyes{transform:translateY(108px) scaleY(-1)} .mampfi-dock:is([data-mood="calm"],:not([data-mood]))[data-life="sleeping"]:not(.is-hungry):not(.is-eating) .mampfi-zzz{opacity:.8;animation:mampfi-snooze 4s ease-in-out infinite} .mampfi-dock:is([data-mood="calm"],:not([data-mood]))[data-reaction="matched"] .mampfi-glider-eyes{filter:drop-shadow(0 0 4px #bda0ff);animation:mampfi-recognized .6s ease-out 2} .mampfi-dock:is([data-mood="calm"],:not([data-mood]))[data-reaction="question"] .mampfi-question{opacity:1} .mampfi-dock:is([data-mood="calm"],:not([data-mood]))[data-reaction="question"]:not(.is-eating) .mampfi-glider-float{animation:none;transform:rotate(-7deg)} .mampfi-dock.is-looking:is([data-mood="calm"],:not([data-mood])):not(.is-hungry):not(.is-eating) .mampfi-glider-pupils{transform:translate(var(--mampfi-look-x,0px),var(--mampfi-look-y,0px))} .mampfi-dock.is-producing .mampfi-ticket-card{transform-origin:60px 76px;animation:mampfi-ticket-out .85s ease-in-out both} .mampfi-result-arrived #mampfi-preview{animation:mampfi-preview-in .65s ease-out both} .mampfi-dock.is-hiccup .mampfi-glider-float{animation:mampfi-hiccup .5s ease-in-out 2} .mampfi-dock.is-burping .mampfi-burp{animation:mampfi-burp 1.2s ease-out both} .mampfi-file-list{list-style:none;margin:18px 0;padding:0;max-height:200px;overflow:auto}.mampfi-file-list li{display:flex;align-items:baseline;gap:16px;padding:9px 0;border-bottom:1px solid var(--line);font-size:13px}.mampfi-file-list span{flex:1;overflow-wrap:anywhere;min-width:0}.mampfi-file-list small{flex:none;color:var(--muted)} @keyframes mampfi-rest{50%{transform:translateY(2px) scale(1.015,.985)}} @keyframes mampfi-snooze{50%{transform:translateY(-4px);opacity:.45}} @keyframes mampfi-recognized{50%{transform:scale(1.04);filter:drop-shadow(0 0 7px #cfb7ff)}} @keyframes mampfi-ticket-out{0%{opacity:0;transform:translateY(9px) scale(.15) rotate(-9deg)}20%{opacity:1}65%{opacity:1;transform:translate(-15px,-80px) scale(1.1) rotate(5deg)}100%{opacity:0;transform:translate(-24px,-125px) scale(.8)}} @keyframes mampfi-preview-in{0%,35%{opacity:.45;transform:translateY(6px)}100%{opacity:1;transform:none}} @keyframes mampfi-hiccup{30%{transform:translateY(-6px) scale(1.05,.95)}60%{transform:translateY(1px)}} @keyframes mampfi-burp{0%{opacity:0;transform:translateY(6px) scale(.8)}20%{opacity:.9}100%{opacity:0;transform:translate(-9px,-43px) scale(1.1)}} @media(prefers-reduced-motion:reduce){.mampfi-result-arrived #mampfi-preview{animation:none}.mampfi-dock .mampfi-ticket-card,.mampfi-dock .mampfi-burp{display:none}.mampfi-dock.is-looking .mampfi-glider-pupils{transform:none}} .mampfi-dock:is(.is-hungry,.is-eating) :is(.mampfi-question,.mampfi-zzz){opacity:0} .field-contact-phone,.field-contact-email{align-items:center}.field-contact-phone>a,.field-contact-email>a{min-width:0;overflow-wrap:anywhere} .field-map-link{display:inline-block;padding:4px 0;overflow-wrap:anywhere}.field-map-link:hover{text-decoration:underline}.field-map-link:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:3px} /* Timeline moves are previews until the separate confirmation succeeds. */ #timeline [data-timeline]{cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none} #timeline.is-dragging,#timeline.is-dragging *{cursor:grabbing!important} #timeline.is-dragging .is-drag-source{opacity:.25} #timeline .timeline-move-ghost{pointer-events:none;opacity:.9!important;z-index:6;outline:2px solid var(--accent);outline-offset:2px;box-shadow:0 5px 14px #24183e30} .timeline-move-hint{position:fixed;transform:translateX(-50%);z-index:30;pointer-events:none;border-radius:7px;background:var(--ink);color:var(--bg);padding:6px 10px;font-size:13px;font-weight:600;font-variant-numeric:tabular-nums;box-shadow:0 3px 12px #0002} #move-time-dialog{width:480px;max-width:calc(100vw - 28px)}#move-time-ticket{overflow-wrap:anywhere;font-size:14px}#move-time-error{color:#b44444;font-size:13px} .move-time-comparison{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 0}.move-time-comparison div{display:grid;gap:6px}.move-time-comparison small{color:var(--muted)}.move-time-comparison strong{font-size:22px;font-variant-numeric:tabular-nums}.move-time-comparison div:last-child strong{color:var(--accent)} /* Separate deployment indicator; never present in production markup. */ .docopi-staging-banner{position:sticky;top:0;z-index:9999;background:#fbbf24;color:#292015;text-align:center;padding:8px 12px;font:600 13px/1.4 system-ui,sans-serif;box-shadow:0 1px 5px #0002} /* Anonymous feature wishes: shared overview, separate from c-entron. */ #feature-requests-panel{width:91.4%;max-width:1440px;margin:0 auto}#feature-requests-panel .menu-panel-content{margin:20px 0 0} .topbar #feature-requests[aria-expanded="true"]{background:var(--accent-light);border-color:var(--accent)} .feature-layout{display:grid;grid-template-columns:minmax(230px,.7fr) minmax(0,1.3fr);gap:28px;margin-top:18px} #feature-request-form{display:flex;flex-direction:column;gap:8px;align-self:start}#feature-request-form label{font-size:13px;font-weight:600;margin-top:6px} #feature-request-form :is(input,textarea,select){box-sizing:border-box;width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:8px;font:inherit;font-size:14px;background:var(--surface,#fff);color:var(--ink)}#feature-request-form textarea{resize:vertical;min-height:140px}#feature-request-form .primary{margin-top:10px} .feature-tools,.feature-tools>div,.feature-card-heading,.feature-card footer{display:flex;align-items:center;gap:10px}.feature-tools{justify-content:space-between;margin-bottom:14px}.feature-tools [aria-pressed="true"]{background:var(--accent-light);border-color:var(--accent);color:var(--accent)} #feature-request-list{max-height:60vh;overflow:auto;overscroll-behavior:contain;padding-right:5px}.feature-card{padding:16px;border:1px solid var(--line);border-radius:10px;margin-bottom:10px;background:var(--surface,#fff)}.feature-card-heading{align-items:start;justify-content:space-between}.feature-card h3{margin:0;font-size:15px;overflow-wrap:anywhere}.feature-description{white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px;line-height:1.6;margin:12px 0}.feature-card footer{justify-content:space-between;flex-wrap:wrap;font-size:12px;color:var(--muted)}.feature-priority{white-space:nowrap;padding:3px 8px;border-radius:6px;font-size:11px;background:var(--accent-light);color:var(--accent)}.feature-priority-high{background:#fff0d5;color:#865410}.feature-priority-low{background:var(--surface-raised,#f0f2f5);color:var(--muted)}.feature-empty{padding:24px 12px;color:var(--muted);font-size:14px} #feature-submit-message,#feature-list-message{font-size:13px;color:var(--muted);margin:6px 0}#feature-submit-message:empty,#feature-list-message:empty{display:none} @media(max-width:700px){.feature-layout{grid-template-columns:1fr;gap:20px}#feature-requests-panel{width:calc(100% - 32px)}#feature-request-form :is(input,textarea,select){font-size:16px}.feature-card{padding:12px}} /* Compact, shared ticket actions. */ .time-action-menu{position:fixed;z-index:1500;width:min(290px,calc(100vw - 16px));padding:12px;border:1px solid var(--border,#d8dce7);border-radius:14px;background:var(--surface,#fff);color:var(--text,#24283d);box-shadow:0 12px 40px #0003;display:grid;gap:6px}.time-action-menu[hidden]{display:none}.time-action-menu button{display:flex;align-items:center;gap:8px;text-align:left;padding:9px;border:0;border-radius:8px;background:transparent;color:inherit}.time-action-menu button:hover{background:#8865c51c}.time-action-menu p{font-size:12px;margin:5px 0}.ticket-action-dialog{width:min(620px,calc(100vw - 24px));max-height:85dvh;overflow:auto}.ticket-action-dialog label{display:grid;gap:6px;margin:12px 0}.ticket-action-dialog .time-fields{display:flex;flex-wrap:wrap}.ticket-action-dialog .time-fields label{flex:1;min-width:100px}.ticket-action-dialog textarea{width:100%;min-height:130px}.ticket-action-dialog .primary{margin-top:16px}.document-ticket-results{display:grid;gap:4px;max-height:210px;overflow:auto}.document-ticket-results button{display:grid;text-align:left;gap:3px;padding:9px;border-radius:8px;background:transparent;color:inherit;border:1px solid var(--border,#d8dce7)}.timeline-panel .block>.support-time-badge{display:block;font-size:14px;margin:0;opacity:1;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}.support-time-label{font-size:12px;color:var(--muted,#686477)}.feature-priority-bug{background:#e94d6120;color:#c13b50}[data-theme=dark] .time-action-menu{background:#242137;color:#eee;border-color:#484054}[data-theme=dark] .ticket-action-dialog{background:#242137;color:#eee} .time-action-menu{max-height:calc(100dvh - 16px);overflow:auto}.ticket-action-dialog .mail-document-row{display:flex} /* Compact ticket checklist controls and independently collapsible groups. */ .ticket-checklist-picker{margin:10px 0;min-width:0} .ticket-checklist-toolbar{display:flex;align-items:center;gap:10px} #ticket-checklist-toggle{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;padding:8px;box-sizing:border-box;flex:none} .checklist-picker-toggle svg{width:22px;height:22px;flex:none} .checklist-picker-toggle[aria-expanded="true"]{background:var(--accent-light);box-shadow:inset 0 0 0 1px var(--accent)} .ticket-checklist-options{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:8px;padding:12px;margin-top:8px;border:1px solid var(--line);border-radius:10px;background:var(--surface)} .ticket-checklist-options[hidden]{display:none} .ticket-checklist-options>label{margin:0;min-width:0} .ticket-checklist-options select{margin-bottom:0;height:42px;box-sizing:border-box} .ticket-checklist-options>#ticket-checklist-add{margin:0;height:42px;box-sizing:border-box;align-self:end} .ticket-checklist-picker .microcopy{margin:0;overflow-wrap:anywhere} #ticket-checklist-message:empty{display:none} #ticket-checklist-message:not(:empty){margin-top:6px} .checklist-group>summary{display:flex;align-items:center;gap:10px;cursor:pointer;padding:9px 12px;background:var(--accent-light);color:var(--accent);font-size:13px;font-weight:600;list-style:none} .checklist-group>summary::-webkit-details-marker{display:none} .checklist-group>summary:before{content:'▸';flex:none} .checklist-group[open]>summary:before{content:'▾'} .checklist-group>summary>span{flex:1;min-width:0;overflow-wrap:anywhere} .checklist-group .checklist-delete{display:inline-flex;align-items:center;justify-content:center;padding:6px;margin:0;flex:none} .checklist-delete-confirm{padding:10px 12px;display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:12px;border-bottom:1px solid var(--line)} .checklist-delete-confirm[hidden]{display:none} .document-recent{margin:12px 0 16px}.document-recent>span{display:block;font-size:12px;color:var(--muted);margin-bottom:6px}.document-recent .recent-ticket-list{display:flex;flex-wrap:wrap;gap:6px} .ticket-action-dialog .time-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px} /* Ticket selection above three booking cards, followed by the activity. */ .creation-layout #entry-form{display:flex;flex-direction:column;gap:14px} .creation-layout #entry-form>div,.creation-layout #entry-form>.hint{width:100%;min-width:0} .creation-layout #entry-form>.mode-tabs{width:auto;align-self:flex-start;margin:0 0 2px;min-width:min(100%,390px)} .booking-cards.booking-context-layout{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:stretch} .booking-card{min-width:0;border:1px solid var(--line);border-radius:12px;padding:16px;background:var(--surface,#fff)} .booking-card-heading,.entry-panel label.booking-card-heading{display:flex;align-items:center;gap:10px;margin:0 0 18px;font-size:15px;font-weight:650;color:var(--ink);line-height:1.3} .booking-card-icon{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:9px;flex:none;background:var(--accent-light);color:var(--accent)} .booking-card-icon svg{width:20px;height:20px;flex:none} .booking-card-icon.clock{background:#eef0f8;color:#646b9e} .booking-card-icon.status{background:#e4f4ea;color:#267557} .booking-work-card .time-fields{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px} .booking-work-card .time-fields>span{display:none} .entry-panel .booking-work-card .time-fields label{margin:0;font-size:13px;min-width:0} .booking-work-card .ae-row{flex-direction:column;align-items:flex-start;gap:8px;margin-top:18px} .booking-work-card .ae-row button{width:38px;height:36px} .booking-work-card .duration-preview{text-align:left;margin:8px 0 0;font-size:11px} .booking-work-card #overlap-hint{margin:12px 0 0} .booking-ticket-fields .picker-button{text-align:left;line-height:1.5;overflow-wrap:anywhere} .booking-ticket-fields:has(#selected-ticket:not(:empty)) #choose-ticket{background:var(--accent-light);border-color:transparent;color:var(--accent);font-weight:600} .booking-ticket-fields .selection-note{font-size:11px;margin:8px 0 12px} .booking-ticket-fields .selection-note:empty{display:none} .booking-card label{margin-bottom:12px} .booking-card>label:last-child,.booking-card #time-contract-field label{margin-bottom:0} .booking-card .recent-ticket-list{gap:5px} .booking-card .recent-ticket{max-width:100%;font-size:11px} .booking-card #recent-tickets{margin-bottom:0} .entry-panel .activity-description-field{padding:14px 16px} .entry-panel .activity-description-field .booking-card-heading{margin:0} .entry-panel .activity-description-field textarea{margin-top:10px;min-height:92px} .booking-form-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-wrap:wrap} .entry-panel .booking-form-actions>.primary{width:auto;margin:0;min-width:230px} .entry-panel .booking-form-actions>.cancel{width:auto;margin:0;margin-right:auto} [data-theme="dark"] .booking-card-icon.clock{background:#33374b;color:#c5c9ee} [data-theme="dark"] .booking-card-icon.status{background:#243e34;color:#95d5b1} .project-credit{display:flex;align-items:baseline;justify-content:flex-end;gap:14px;flex-wrap:wrap;text-align:right} .project-about{font-size:12px;max-width:430px;text-align:left} .project-about summary{cursor:pointer;color:var(--accent);text-decoration:underline;text-underline-offset:3px;list-style:none;text-align:right} .project-about summary::-webkit-details-marker{display:none} .project-about-content{padding:14px;margin-top:10px;background:var(--surface,#fff);border:1px solid var(--line);border-radius:10px;line-height:1.65} .project-about-content strong{color:var(--ink)} .project-about-content p{margin:6px 0 0} @media(max-width:1050px){.booking-cards.booking-context-layout{grid-template-columns:repeat(2,minmax(0,1fr))}.booking-cards>#mail-booking-documents{grid-column:1/-1}} @media(max-width:640px){.booking-cards.booking-context-layout{grid-template-columns:minmax(0,1fr)}.creation-layout #entry-form>.mode-tabs{width:100%;min-width:0}.booking-card{padding:14px}.booking-card-heading,.entry-panel label.booking-card-heading{margin-bottom:14px}.booking-work-card .ae-row{flex-direction:row;align-items:center}.entry-panel .booking-form-actions>.primary{width:100%;min-width:0}.project-credit{justify-content:flex-start;text-align:left}.project-about summary{text-align:left}.project-about{max-width:100%}} main>footer{gap:16px;align-items:flex-start} .project-about[open]{margin-bottom:64px} @media(max-width:640px){main>footer{flex-direction:column;gap:10px}.project-credit{width:100%}.project-about{flex:1;min-width:180px}.project-about-content{margin-left:0}} /* Documents stay in the right-hand booking card. */ .booking-cards>#mail-booking-documents{grid-column:auto;width:100%;margin:0;padding:14px 16px} #mail-booking-documents>.booking-card-heading{margin-bottom:12px} #mail-booking-documents>.document-dropzone{min-height:60px;font-size:13px} #mail-booking-documents>#document-drop-note{font-size:11px;line-height:1.5;margin-top:8px} .booking-side-fields[hidden]{display:none} @media(max-width:1050px){.booking-cards>#mail-booking-documents{grid-column:1/-1}} .creation-layout #entry-form>fieldset{width:100%;min-width:0;margin:0} .creation-layout #entry-form>fieldset .billing-options{grid-template-columns:repeat(2,minmax(0,1fr))} /* Ticket checklists have their own compact section below the activity. */ .booking-checklist-section{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;width:100%;align-items:center} .booking-checklist-section[hidden],.booking-checklist-section:has(#ticket-checklist-picker[hidden]):has(#booking-checklists[hidden]){display:none} .booking-checklist-section>.booking-card-heading{margin:0} .booking-checklist-section>#ticket-checklist-picker{display:contents} .booking-checklist-section>#ticket-checklist-picker[hidden]{display:none} .booking-checklist-section .ticket-checklist-toolbar{justify-content:flex-end} .booking-checklist-section #ticket-checklist-toggle{width:auto;height:36px;padding:7px 11px;gap:6px;font-size:12px;border-radius:8px} .booking-checklist-section #ticket-checklist-toggle svg{width:17px;height:17px} .booking-checklist-section #ticket-checklist-selection{grid-column:1/-1;padding:8px 12px;border-radius:8px;background:var(--accent-light);color:var(--accent)} .booking-checklist-section .ticket-checklist-options{grid-column:1/-1;margin:0;padding:12px;background:var(--accent-light);gap:12px} .booking-checklist-section .ticket-checklist-options>label{margin:0;font-size:12px} .booking-checklist-section .ticket-checklist-options select{margin-top:6px;background:var(--surface)} .booking-checklist-section #ticket-checklist-add{font-size:12px;padding:8px 14px;white-space:nowrap} .booking-checklist-section #ticket-checklist-message{grid-column:1/-1;margin:0} .booking-checklist-section>#booking-checklists{grid-column:1/-1;width:100%;margin:0} .booking-checklist-section #booking-checklist-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:10px;align-items:start} .booking-checklist-section .checklist-group{margin:0} .booking-checklist-section .checklist-heading,.booking-checklist-section .checklist-actions{flex-wrap:wrap} @media(max-width:640px){.booking-checklist-section .ticket-checklist-options{grid-template-columns:minmax(0,1fr)}.booking-checklist-section #ticket-checklist-add{width:100%}.booking-checklist-section #ticket-checklist-selection{overflow-wrap:anywhere}} /* Checklist hierarchy and completion are visible independently of the controls. */ .booking-checklists .checklist-heading{margin:12px 0 16px;gap:12px} .checklist-row.checklist-parent{background:var(--accent-light);font-weight:700;color:var(--accent);padding-top:13px;padding-bottom:13px;border-left:3px solid var(--accent)} .checklist-parent .checklist-status{font-weight:400} .checklist-row.checklist-done{background:#eef8f0;box-shadow:inset 3px 0 #459762} .checklist-done .checklist-label{color:#236b3b;font-weight:600} .checklist-done .checklist-mark{color:#277940;font-size:16px;font-weight:700} #booking-checklist-content .checklist-done .checklist-state-select{border-color:#84bc94;color:#236b3b;background-color:#f4fcf6} [data-theme="dark"] .checklist-row.checklist-done{background:#21372c;box-shadow:inset 3px 0 #78bd91} [data-theme="dark"] .checklist-done .checklist-label,[data-theme="dark"] .checklist-done .checklist-mark{color:#ade0be} [data-theme="dark"] #booking-checklist-content .checklist-done .checklist-state-select{background-color:#293f33;color:#ade0be;border-color:#547f61} .booking-checklist-section .ticket-checklist-options select{appearance:none;padding-right:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%237b7590' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-size:16px;background-position:right 13px center} /* Inline ticket lookup leaves the rest of the booking form available. */ .inline-ticket-search{margin:12px 0 0;padding:14px;border:1px solid var(--line);border-radius:10px;background:var(--surface)} .inline-ticket-search[hidden]{display:none} .inline-ticket-search-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;font-weight:600;margin-bottom:8px} .inline-ticket-search-heading button{font-size:12px} .inline-ticket-search #picker-query{width:100%;margin:0 0 10px} .inline-ticket-search .picker-scroll{height:300px;max-height:300px;overflow-y:auto;overscroll-behavior:contain} .inline-ticket-search .picker-results{max-height:none;overflow:visible} .inline-ticket-search .microcopy{margin:8px 0} .inline-ticket-search .picker-result{margin:0;padding:10px 12px} .inline-ticket-search .ticket-picker-row{margin-bottom:6px} .inline-ticket-search #picker-hint{height:3.3em;overflow-y:auto} .ticket-context-disabled{opacity:.62;filter:saturate(.4)} .ticket-context-disabled *{cursor:default} #entry-form #submit-entry:disabled{cursor:not-allowed} @media(max-width:640px){.inline-ticket-search{padding:10px}.inline-ticket-search .picker-scroll{height:260px;max-height:260px}} .inline-ticket-search .picker-done{display:flex;align-items:center;gap:8px;margin:0;font-size:12px;font-weight:400} #entry-form .inline-ticket-search .picker-done input{width:16px;height:16px;margin:0;padding:0;flex:0 0 16px;accent-color:var(--accent)} /* Ticket-owned contact context; compact by default, inline customer editing on demand. */ .booking-contact-section{min-width:0} .contact-heading,.contact-actions,.contact-selection,.contact-editor-actions{display:flex;align-items:center;gap:10px} .contact-heading{justify-content:space-between;margin-bottom:10px} .contact-heading .booking-card-heading{margin:0} .contact-selection{align-items:flex-end;flex-wrap:wrap} .contact-selection>label{flex:1;min-width:200px;margin:0} .contact-selection>button{flex:none;margin-bottom:0} .contact-summary{display:grid;gap:12px;margin-top:16px;overflow-wrap:anywhere;font-size:13px} .contact-identity{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 24px} .contact-summary strong{font-weight:600} .contact-phones{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 20px;margin:0} .contact-phones>div{min-width:0} .contact-phones dt{color:var(--muted);font-size:12px;margin-bottom:4px} .contact-phones dd{margin:0} .contact-value-copy{display:inline-flex;align-items:center;gap:8px;max-width:100%;min-height:36px;padding:5px 8px;margin-left:-8px;border:0;border-radius:6px;background:transparent;color:var(--ink);font:inherit;text-align:left;user-select:text} .contact-value-copy span{min-width:0;overflow-wrap:anywhere} .contact-value-copy svg{width:14px;height:14px;flex:none;color:var(--muted)} .contact-value-copy:hover{background:var(--accent-light);color:var(--accent)} .contact-empty{display:inline-block;padding:5px 0;color:var(--muted)} .contact-emails{display:flex;flex-wrap:wrap;gap:8px 24px} .contact-copy-status{min-height:18px;font-size:12px;color:var(--muted)} @media(max-width:700px){.contact-phones{grid-template-columns:repeat(2,minmax(0,1fr))}.contact-identity{grid-template-columns:1fr}} .contact-editor{margin-top:16px;padding-top:16px;border-top:1px solid var(--line,#ddd)} .contact-editor h4{margin:0 0 8px} .contact-editor-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 14px} .contact-editor-fields label{margin:0} .contact-editor-fields label:last-child{grid-column:1/-1} .contact-editor-actions{justify-content:flex-end;margin-top:14px} .contact-editor input,.contact-editor select{width:100%} .booking-contact-section .error-banner{margin:10px 0 0} @media(max-width:700px){.contact-editor-fields{grid-template-columns:repeat(2,minmax(0,1fr))}.contact-selection>label{flex-basis:100%}} @media(max-width:420px){.contact-editor-fields{grid-template-columns:1fr}} .booking-contact-section{width:100%;grid-column:1/-1;min-height:190px} @media(max-width:700px){.booking-contact-section{min-height:245px}} .contact-emails .contact-value-copy{margin-left:0;vertical-align:middle} .detail-contact{padding:16px;margin-bottom:20px;border:1px solid var(--line);border-radius:12px;background:var(--bg)} .detail-contact .contact-heading{margin-bottom:0} .detail-contact .contact-summary{margin-top:12px} /* Compact monthly challenge under the date; details only on click. */ .contact-challenge{position:relative;color:var(--ink);max-width:100%;line-height:1.4} .contact-challenge[hidden]{display:none} .challenge-menu{margin:0} .challenge-trigger{display:flex;align-items:center;gap:8px;list-style:none;padding:4px 9px;border:1px solid var(--line);border-radius:9px;background:var(--surface,#fff);cursor:pointer;font-size:11px;white-space:nowrap;min-height:36px} .challenge-trigger::-webkit-details-marker{display:none}.challenge-trigger:hover,.challenge-menu[open]>.challenge-trigger{background:var(--accent-light);border-color:var(--accent-border)} .challenge-trigger>strong{font-size:12px;font-variant-numeric:tabular-nums}.challenge-trigger>strong span{font-size:11px;font-weight:400;color:var(--muted)} .challenge-trigger progress{width:48px;height:5px;border:0;border-radius:8px;overflow:hidden;accent-color:var(--accent);background:var(--line)} .challenge-trigger progress::-webkit-progress-bar{background:var(--line)}.challenge-trigger progress::-webkit-progress-value{background:var(--accent);border-radius:8px}.challenge-trigger progress::-moz-progress-bar{background:var(--accent)} .challenge-spark{display:grid;place-items:center;width:24px;height:26px;color:var(--accent);font-size:20px;flex-shrink:0} .challenge-medal{display:block;width:24px;height:27px;flex-shrink:0;--medal:#bd7b45;--medal-edge:#794522;--ribbon:#af5b36} .challenge-medal.silver{--medal:#d0d6e0;--medal-edge:#6d788d;--ribbon:#667a9d}.challenge-medal.gold{--medal:#f3c653;--medal-edge:#9f6d12;--ribbon:#b08120}.challenge-medal.platinum{--medal:#bfe5df;--medal-edge:#498c85;--ribbon:#488984}.challenge-medal.diamond{--medal:#ace0ff;--medal-edge:#4874bc;--ribbon:#7966c0} .medal-ribbon{fill:var(--ribbon)}.medal-face{fill:var(--medal);stroke:var(--medal-edge);stroke-width:1.2}.medal-ring{fill:none;stroke:#fff;stroke-opacity:.6}.medal-star{fill:var(--medal-edge)} .challenge-popup{position:absolute;z-index:40;top:calc(100% + 8px);right:0;width:min(340px,calc(100vw - 32px));max-height:min(560px,70dvh);overflow-y:auto;overscroll-behavior:contain;padding:16px;background:var(--surface,#fff);border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 36px #11132226;text-align:left;white-space:normal;animation:challenge-appear .15s ease-out} .challenge-popup-heading{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.challenge-popup-heading strong{font-size:14px}.challenge-popup-heading div>span{display:block;color:var(--muted);font-size:11px;margin-top:4px}.challenge-popup-heading button{display:grid;place-items:center;border:0;border-radius:6px;width:28px;height:28px;flex-shrink:0;background:var(--accent-light);color:var(--accent);font-size:20px} .challenge-current{display:flex;align-items:center;gap:10px;padding:12px;margin:14px 0;background:var(--accent-light);border-radius:10px}.challenge-current>svg,.challenge-current>.challenge-spark{width:32px;height:36px}.challenge-current strong{font-size:13px}.challenge-current div>span{display:block;font-size:11px;margin-top:3px;color:var(--muted)} .challenge-counts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 12px;text-align:center}.challenge-counts dt{font-size:11px;color:var(--muted)}.challenge-counts dd{font-size:19px;font-weight:650;margin:3px 0 0} .challenge-ranks{padding:0;margin:0;list-style:none}.challenge-ranks li{display:grid;grid-template-columns:26px 1fr auto 12px;gap:7px;align-items:center;padding:5px 0;color:var(--muted);font-size:12px}.challenge-ranks li>span:nth-last-child(2){font-size:11px}.challenge-ranks li.achieved{color:var(--ink);font-weight:600}.challenge-ranks li:not(.achieved) svg{opacity:.45} .heading .challenge-rules{font-size:11px;margin:12px 0 0;line-height:1.5;color:var(--muted)}.challenge-unavailable{font-size:11px;color:var(--muted)} @keyframes challenge-appear{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}} @media(prefers-reduced-motion:reduce){.challenge-popup{animation:none}} @media(max-width:580px){.challenge-trigger{gap:7px}.challenge-popup{width:min(320px,calc(100vw - 32px))}} .challenge-placement{border-left:1px solid var(--line);padding-left:8px;color:var(--accent);font-weight:650} .heading .challenge-purpose{font-size:12px;color:var(--muted);margin:12px 0 0;line-height:1.55} .challenge-leaderboard{border-top:1px solid var(--line);padding-top:12px;margin-top:12px}.challenge-leaderboard-heading{display:flex;justify-content:space-between;gap:8px;align-items:center;font-size:12px}.challenge-leaderboard-heading>span{font-size:10px;color:var(--muted)} .challenge-leaderboard ol{list-style:none;padding:0;margin:8px 0;max-height:154px;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable} .challenge-leaderboard li{display:grid;grid-template-columns:25px minmax(0,1fr) auto;align-items:center;gap:8px;padding:7px 9px;border-radius:7px;font-size:12px;font-variant-numeric:tabular-nums}.challenge-leaderboard li.is-self{background:var(--accent-light);color:var(--accent)}.challenge-place{font-weight:650}.challenge-user{overflow-wrap:anywhere}.challenge-user small{font-size:10px;font-weight:600}.challenge-leaderboard .challenge-rules{font-size:10px} .challenge-medal-levels{border-top:1px solid var(--line);margin-top:12px;padding-top:10px}.challenge-medal-levels>summary{font-size:12px;cursor:pointer;color:var(--muted)}.challenge-medal-levels[open]>summary{margin-bottom:8px} @media(max-width:380px){.challenge-trigger{gap:5px;padding:4px 7px}.challenge-trigger progress{width:32px}.challenge-placement{padding-left:5px}} /* Font-independent timeline symbols, with consistent contrast on all time colors. */ .pause-marker .pause-icon{width:18px;height:18px;flex:none;color:#354450;background:#f5f7f9;border-radius:4px;padding:2px;box-sizing:content-box} [data-theme=dark] .pause-marker .pause-icon{color:#f3f6fa;background:#303945} .timeline-panel .block>.support-time-badge{display:flex;align-items:center;justify-content:center;width:25px;height:25px;border:1px solid #fff;border-radius:8px;background:#172d43;color:#fff;box-shadow:0 1px 3px #0004} .support-time-badge svg{flex:none}.support-time-label{display:flex;align-items:center;gap:6px}.support-time-label svg{flex:none} .ticket-selection-row{display:flex;align-items:stretch;gap:8px;min-width:0;margin:-8px 0 12px}.ticket-selection-row #choose-ticket{flex:1;min-width:0;margin:0}.ticket-selection-row .favorite-star{flex:none;align-self:center;width:40px;height:40px}.ticket-selection-row .favorite-star[hidden]{display:none}.ticket-selection-row .favorite-star[aria-pressed=true]{color:#a06a00;background:#ffda6b33}[data-theme=dark] .ticket-selection-row .favorite-star[aria-pressed=true]{color:#ffda6b} .access-entry-heading{padding-left:5px} /* Compact predefined monitoring, separate from the day's hour totals. */ .monitoring-live{width:fit-content;max-width:100%;padding:7px;flex-wrap:wrap;gap:7px} .monitoring-live-tile{flex:0 1 auto;min-width:230px} #monitoring-live-error{flex-basis:100%;margin:0 5px;max-width:360px} #monitoring-tiles{grid-template-columns:repeat(auto-fit,minmax(180px,280px))} @media(max-width:580px){.monitoring-live{width:100%}.monitoring-live-tile{flex:1;min-width:0}} .snippet-content-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.snippet-content-fields label{min-width:0}.snippet-content-fields textarea{min-height:260px;height:clamp(260px,38vh,420px);width:100%;resize:vertical}@media(max-width:850px){.snippet-content-fields{grid-template-columns:1fr}.snippet-content-fields textarea{min-height:140px;height:180px}} /* Compact, persistent tools beside Mampfi; the booking form remains interactive. */ .mampfi-context-tools{position:fixed;right:28px;bottom:124px;z-index:46;display:flex;gap:7px} .mampfi-context-tools[hidden],.mampfi-context-window[hidden]{display:none!important} .mampfi-context-tools button{width:38px;height:38px;padding:8px;border-radius:50%;background:var(--surface,#fff);color:var(--accent,#6543bd);border:1px solid var(--line,#dcd9eb);box-shadow:0 3px 12px #24154625;display:grid;place-items:center} .mampfi-context-tools button[aria-expanded=true]{background:#6741ba;color:#fff} .mampfi-context-window{position:fixed;right:22px;bottom:176px;width:min(390px,calc(100vw - 24px));max-height:min(65vh,640px);z-index:45;background:var(--surface,#fff);color:var(--text,#222);border:1px solid var(--line,#ddd);border-radius:16px;box-shadow:0 12px 44px #15102235;overflow:hidden;display:flex;flex-direction:column} .mampfi-context-window>header{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--line,#ddd);flex-shrink:0} .mampfi-context-window h2{font-size:15px;margin:0;display:flex;align-items:center;gap:8px} .mampfi-context-window>header button{font-size:24px;width:30px;height:30px} .mampfi-context-body{overflow-y:auto;overscroll-behavior:contain;padding:10px 12px;min-height:0} .mampfi-access-content .menu-panel-clip,.mampfi-access-content .menu-panel-content{display:block!important;overflow:visible!important;padding:0!important;margin:0!important} .mampfi-access-content .access-search,.mampfi-access-content .access-recent{display:none!important} .mampfi-access-content .access-customer{font-size:12px;margin:8px 0;font-weight:650} .mampfi-access-content .access-helper{margin:0 0 8px;font-size:12px} .mampfi-access-content .access-helper-tools{flex-wrap:wrap} .mampfi-access-content .access-field dd{flex-wrap:wrap;gap:5px} .mampfi-access-content .access-entry-detail{padding:6px} .mampfi-access-content .access-entry-select{font-size:13px} .mampfi-access-content .access-category{margin-bottom:6px} .access-recent-entries{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin:6px 0 10px} .access-recent-entries small{width:100%;color:var(--muted,#777)} .access-recent-entries button{font-size:12px;padding:4px 8px;max-width:100%;white-space:normal} .mampfi-document-heading{display:flex;align-items:start;gap:8px;font-size:12px;margin-bottom:8px} .mampfi-document-heading strong{flex:1;overflow-wrap:anywhere} .mampfi-document-list{display:grid;gap:6px} .mampfi-document{display:flex;align-items:center;gap:9px;padding:9px;border:1px solid var(--line,#ddd);border-radius:9px;color:inherit;text-decoration:none;background:var(--surface,#fff);cursor:grab} .mampfi-document span{min-width:0;flex:1}.mampfi-document strong{display:block;font-size:12px;overflow-wrap:anywhere}.mampfi-document small{color:var(--muted,#777);font-size:11px}.mampfi-document svg{flex-shrink:0} [data-theme=dark] .mampfi-context-window,[data-theme=dark] .mampfi-context-tools button,[data-theme=dark] .mampfi-document{background:#252334;color:#eee9fa;border-color:#484052} [data-theme=dark] .mampfi-context-tools button[aria-expanded=true]{background:#6741ba} @media(max-width:850px){.mampfi-context-window{max-height:55vh}} @media(max-width:600px){.mampfi-context-tools{right:16px;bottom:96px}.mampfi-context-window{right:12px;bottom:143px;width:calc(100vw - 24px)}} .access-autotype{display:inline-flex} .mampfi-context-window h2{flex:1}.mampfi-context-window>header{gap:6px} .mampfi-access-content .access-helper{display:none!important} .mampfi-access-content .access-customer{margin:2px 0 12px;padding:0 2px;line-height:1.5} .mampfi-access-content .microcopy:empty{display:none} .mampfi-access-content .access-category{margin:0 0 9px} .mampfi-access-content .access-category>summary{padding:10px 12px;line-height:1.45} .mampfi-access-content .access-entry-list{padding:4px 8px} .mampfi-access-content .access-entry-heading{gap:5px;padding:3px 2px} .mampfi-access-content .access-entry-detail{padding:5px 8px 12px} .mampfi-access-content .access-field{grid-template-columns:1fr;gap:4px;padding:9px 0} .mampfi-access-content .access-field dd{gap:8px;align-items:center;flex-wrap:nowrap} .mampfi-access-content .access-field dt{font-size:11px;line-height:1.45} .mampfi-access-content .access-value{flex:1} .mampfi-access-content .access-field-actions{gap:4px} .mampfi-access-content .access-recent-entries{margin:0 0 12px;gap:6px} .mampfi-document[aria-busy=true]{cursor:progress;opacity:.7}.mampfi-document[data-drag-ready=true]{border-color:color-mix(in srgb,var(--accent) 40%,var(--line))} /* The compact access view shares its window surface with the documents view. */ .mampfi-access-content .menu-panel-content{border:0!important;border-radius:0;background:transparent!important;box-shadow:none!important} .access-recent-item{display:inline-flex;align-items:stretch;max-width:100%;gap:1px} .access-recent-item .access-recent-action{display:grid;place-items:center;flex:none;padding:6px 8px;border-radius:8px 0 0 8px} .access-recent-item .access-recent-name{min-width:0;overflow-wrap:anywhere;text-align:left;border-radius:0 8px 8px 0} .access-recent-item .access-recent-name:only-child{border-radius:8px} .mampfi-document-row{display:flex;align-items:center;gap:6px}.mampfi-document-row .mampfi-document{flex:1;min-width:0}.mampfi-document-helper{flex:none;width:34px;height:34px;color:var(--accent)} /* The detail picker shares the booking picker layout, including mobile wrapping. */ #detail-checklist-options>button{margin:0;min-height:42px;align-self:end} #detail-checklist-picker-message{grid-column:1/-1;margin:0} #detail-checklist-picker-message:empty{display:none} #detail-checklists>.checklist-heading{flex-wrap:wrap} @media(max-width:580px){#detail-checklist-options{grid-template-columns:minmax(0,1fr)}} /* Customer-first booking: bounded results and compact, direct shortcuts. */ .booking-customer-context{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 12px;background:var(--surface);border:1px solid var(--line);border-radius:10px;margin-bottom:12px} .booking-customer-context>div{display:grid;gap:3px;min-width:0}.booking-customer-context strong{font-size:14px;overflow-wrap:anywhere} .booking-customer-context button{flex-shrink:0} .booking-quick-section{margin-top:12px}.booking-quick-list{display:flex;gap:8px;overflow:auto;max-height:130px;padding:5px 0} .booking-quick-list .recent-ticket{min-width:150px;max-width:260px;flex:0 0 220px;text-align:left} .booking-new-ticket-actions{display:flex;gap:12px;align-items:center;border-top:1px solid var(--line);padding-top:12px;margin:14px 0} #existing-fields:not([hidden]){margin-top:12px}#new-fields:not([hidden]){margin-top:12px} #entry-form [hidden]{display:none!important} .inline-ticket-search{margin-top:0} @media(max-width:640px){.booking-customer-context{align-items:flex-start;gap:8px}.booking-customer-context button{font-size:12px;padding:8px}.booking-new-ticket-actions button{white-space:normal;text-align:left}} .booking-ticket-shortcuts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.booking-ticket-shortcuts>div{min-width:0}.booking-ticket-shortcuts .recent-ticket-list{display:flex;flex-wrap:nowrap;overflow-x:auto;max-height:130px}.booking-ticket-shortcuts .recent-ticket{flex:0 0 180px;max-width:240px}.picker-result>span:empty{display:none} @media(max-width:640px){.booking-ticket-shortcuts{grid-template-columns:1fr;gap:0}} /* Quiet shortcuts, above customer search. */ .booking-customer-context>.booking-customer-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}.booking-customer-actions svg{width:19px;height:19px}.booking-customer-actions [aria-expanded=true]{color:var(--accent);background:var(--accent-light)} .booking-shortcut-panel{border:1px solid var(--line);border-radius:10px;background:var(--surface);padding:12px;margin-bottom:12px;max-height:270px;overflow:auto} .booking-shortcut-panel .booking-ticket-shortcuts{display:block}.booking-shortcut-panel .booking-quick-section{margin:0 0 8px}.booking-shortcut-panel .recent-tickets{margin:8px 0 0} .booking-shortcut-panel .booking-quick-list,.booking-shortcut-panel .recent-ticket-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));max-height:none;overflow:visible;gap:6px} .booking-shortcut-panel .recent-ticket{min-width:0;max-width:none;width:100%;text-align:left}.booking-shortcut-panel .recent-ticket strong{white-space:normal;overflow-wrap:anywhere}.booking-shortcut-panel .recent-ticket span{font-size:11px} .contact-disclosure>summary{display:flex;align-items:center;gap:12px;list-style:none;cursor:pointer;min-height:36px}.contact-disclosure>summary::-webkit-details-marker{display:none}.contact-disclosure>summary .booking-card-heading{margin:0;flex-shrink:0}.contact-collapsed-name{font-size:13px;font-weight:500;overflow-wrap:anywhere;min-width:0}.contact-disclosure-chevron{margin-left:auto;color:var(--muted)}.contact-disclosure[open] .contact-disclosure-chevron{transform:rotate(180deg)}.contact-disclosure-body{padding-top:14px}.contact-disclosure-body .contact-heading{justify-content:flex-end}.contact-disclosure>summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:6px} .mampfi-customer-note{white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;line-height:1.6;margin:12px 0 0}.mampfi-note-customer{font-size:12px;color:var(--muted);margin:0} @media(max-width:640px){.booking-customer-actions{gap:4px}.booking-customer-context{flex-wrap:wrap}.contact-disclosure>summary{gap:8px;flex-wrap:wrap}.contact-collapsed-name{flex:1 1 100px}.booking-shortcut-panel .booking-quick-list,.booking-shortcut-panel .recent-ticket-list{grid-template-columns:1fr}} /* Context bubbles fan around Mampfi instead of forming a toolbar. */ .mampfi-context-tools{right:74px;bottom:68px;width:0;height:0;display:block;pointer-events:none;--orbit-radius:88px} .mampfi-context-tools button{position:absolute;left:calc(var(--orbit-x,0) * var(--orbit-radius));top:calc(var(--orbit-y,-1) * var(--orbit-radius));transform:translate(-50%,-50%);pointer-events:auto;transition:left .2s ease,top .2s ease,background .15s ease} .mampfi-context-window{bottom:190px} @media(max-width:600px){.mampfi-context-tools{right:50px;bottom:50px;--orbit-radius:74px}.mampfi-context-window{bottom:160px}} @media(prefers-reduced-motion:reduce){.mampfi-context-tools button{transition:none}} /* Collapsed contacts occupy only their summary, also on small screens. */ .booking-contact-section:has(.contact-disclosure:not([open])){min-height:0} .booking-shortcut-panel .recent-ticket{display:flex;flex-direction:column;align-items:flex-start;overflow:hidden;box-sizing:border-box} .booking-shortcut-panel .recent-ticket strong{flex-shrink:1;min-width:0;max-width:100%;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:normal;overflow-wrap:anywhere} .booking-shortcut-panel .recent-ticket span{min-width:0;max-width:100%;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .mampfi-note-search{display:flex;align-items:center;gap:4px;position:sticky;top:0;background:var(--surface);padding:4px 0;z-index:1} .mampfi-note-search input{min-width:0;flex:1;width:100%;padding:7px 9px;border:1px solid var(--line);border-radius:7px;background:var(--field);color:var(--ink);font:inherit;font-size:12px} .mampfi-note-search [data-note-count]{font-size:10px;white-space:nowrap;color:var(--muted)} .mampfi-note-search button{width:25px;height:28px;flex-shrink:0}.mampfi-note-search button:disabled{opacity:.35} .mampfi-customer-note mark{background:#fff0ac;color:#372900;border-radius:2px}.mampfi-customer-note mark[data-current-match]{background:#ffce54;outline:1px solid #a66c00} .mampfi-context-tools button{animation:mampfi-bubble-float 4.6s ease-in-out var(--float-delay,0s) infinite} .mampfi-context-tools button:hover,.mampfi-context-tools button:focus-visible{animation-play-state:paused} @keyframes mampfi-bubble-float{0%,100%{translate:-1px 1px}50%{translate:2px -3px}} @media(prefers-reduced-motion:reduce){.mampfi-context-tools button{animation:none}} .mampfi-customer-note mark{scroll-margin-top:48px}