/* Shared controls. Semantic form elements remain the source of truth. */
:root{--control-paper:oklch(99% .006 155);--control-ink:oklch(33% .035 166);--control-muted:oklch(51% .025 162);--control-line:oklch(84% .018 155);--control-green:oklch(47% .072 171);--control-hover:oklch(96% .018 155);--control-focus:oklch(79% .06 157);--control-error:oklch(47% .13 27);--control-error-bg:oklch(97% .012 27);--control-shadow:0 8px 24px oklch(28% .035 166 / .1);--control-radius:9px;--control-ease:cubic-bezier(.16,1,.3,1)}
body{color:var(--control-ink)}.ui-icon{width:20px;height:20px;stroke-width:1.75;vertical-align:middle;flex:none;pointer-events:none}
:where(button,input,textarea,select){-webkit-tap-highlight-color:transparent}button{touch-action:manipulation}button,a,input,textarea{transition:background-color 160ms var(--control-ease),border-color 160ms var(--control-ease),box-shadow 160ms var(--control-ease),color 160ms var(--control-ease)}
:where(input,textarea,select){appearance:none;-webkit-appearance:none;border:1px solid var(--control-line);border-radius:var(--control-radius);background:var(--control-paper);color:var(--control-ink)}
:is(.field,.photo-field) input,.field textarea,.photo-note-field textarea,.photo-sentence-panel textarea,.photo-live-access input,.search input{font-size:16px;color:var(--control-ink);border-color:var(--control-line);background:var(--control-paper);border-radius:var(--control-radius);line-height:1.65}
:is(.field,.photo-field) input,.photo-live-access input{min-height:48px;padding:11px 13px}.field textarea,.photo-note-field textarea,.photo-sentence-panel textarea{padding:13px 14px;resize:vertical;min-height:90px}.photo-sentence-panel textarea{min-height:154px}
input:hover,textarea:hover{border-color:oklch(65% .04 160)}:is(input,textarea):focus{outline:0;border-color:var(--control-green);box-shadow:0 0 0 3px oklch(47% .072 171 / .12)}
:is(button,a):focus-visible{outline:3px solid var(--control-focus);outline-offset:3px}input::placeholder,textarea::placeholder{color:oklch(60% .022 162)}
input[aria-invalid=true],textarea[aria-invalid=true],.select-trigger[aria-invalid=true]{border-color:var(--control-error)!important;box-shadow:0 0 0 2px oklch(47% .13 27 / .08)}
input:disabled,textarea:disabled,.select-trigger:disabled{background:oklch(95% .008 155);color:oklch(63% .018 160);cursor:not-allowed;opacity:.7}input[readonly],textarea[readonly]{background:oklch(96% .01 155)}
.btn{border-radius:var(--control-radius);min-height:44px;gap:8px;font-weight:500;line-height:1.5;background:var(--control-paper);border:1px solid var(--control-line);padding:11px 16px}.btn:hover:not(:disabled){background:var(--control-hover);border-color:oklch(67% .04 160);box-shadow:0 2px 7px oklch(28% .035 166 / .05)}.btn.primary{background:var(--control-green);border-color:var(--control-green);color:oklch(99% .006 155)}.btn.primary:hover:not(:disabled){background:oklch(41% .07 171);border-color:oklch(41% .07 171)}.btn.danger{color:var(--control-error)}.btn.danger:hover:not(:disabled){background:var(--control-error-bg);border-color:oklch(74% .07 27)}.btn.small{min-height:40px;padding:9px 12px}.btn:active:not(:disabled),.icon-btn:active:not(:disabled){transform:translateY(1px)}button:disabled{cursor:not-allowed;opacity:.55;box-shadow:none}.btn .ui-icon{width:18px;height:18px}.icon-btn{width:40px;height:40px;border:1px solid transparent;border-radius:8px;display:inline-grid;place-items:center;flex:none}.icon-btn:hover:not(:disabled){background:var(--control-hover);border-color:var(--control-line)}
button[aria-busy=true]{cursor:wait}button[aria-busy=true]::before{content:'';width:15px;height:15px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;display:inline-block;flex:none;animation:control-spin 800ms linear infinite}button[aria-busy=true]>.ui-icon{display:none}@keyframes control-spin{to{transform:rotate(360deg)}}
.custom-select{min-width:0;width:100%}.select-trigger{width:100%;min-height:48px;font-size:16px;padding:11px 13px;line-height:1.65;border:1px solid var(--control-line);border-radius:var(--control-radius);background:var(--control-paper);color:var(--control-ink);display:flex;align-items:center;gap:12px;justify-content:space-between;text-align:left}.select-trigger:hover:not(:disabled){background:var(--control-paper);border-color:oklch(65% .04 160)}.select-trigger[aria-expanded=true]{border-color:var(--control-green);box-shadow:0 0 0 3px oklch(47% .072 171 / .12)}.select-trigger>.ui-icon{width:17px;height:17px;color:var(--control-muted);transition:transform 160ms var(--control-ease)}.select-trigger[aria-expanded=true]>.ui-icon{transform:rotate(180deg)}.select-text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.select-popover,.calendar-popover{position:fixed;z-index:180;padding:6px;border:1px solid var(--control-line);border-radius:12px;background:var(--control-paper);box-shadow:var(--control-shadow);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:oklch(74% .02 155) transparent}.select-option{min-height:44px;padding:10px 12px;font-size:15px;border-radius:7px;line-height:1.7;display:flex;align-items:center;gap:12px;justify-content:space-between;text-align:left;width:100%;color:var(--control-ink)}.select-option:hover:not(:disabled),.select-option:focus-visible{background:var(--control-hover);outline:2px solid var(--control-focus);outline-offset:-2px}.select-option.selected{background:oklch(94% .027 155);color:var(--control-green);font-weight:600}.select-option.selected>.ui-icon{width:17px;height:17px}.select-option:disabled{opacity:.4}.workspace-picker .select-trigger,.toolbar .select-trigger{min-height:44px;font-size:14px}
.date-control{display:flex;position:relative;width:100%;min-width:0}.date-control>input{width:100%;padding-right:50px}.date-trigger{position:absolute;inset:4px 4px 4px auto;display:grid;place-items:center;width:40px;border-radius:6px;color:var(--control-muted);border:0}.date-trigger:hover:not(:disabled),.date-trigger[aria-expanded=true]{background:var(--control-hover);color:var(--control-green)}.date-trigger .ui-icon{width:19px;height:19px}.calendar-popover{padding:14px}.calendar-head{display:flex;align-items:center;gap:7px;justify-content:space-between;margin-bottom:12px}.calendar-caption{display:flex;justify-content:center;align-items:center;gap:2px;min-width:0}.calendar-caption>button{display:inline-flex;align-items:center;gap:4px;min-height:40px;padding:7px 8px;border-radius:6px;font-size:15px;font-weight:600}.calendar-caption>button:hover{background:var(--control-hover)}.calendar-caption .ui-icon{width:14px;height:14px}.calendar-week{display:grid;grid-template-columns:repeat(7,1fr);font-size:12px;color:var(--control-muted);text-align:center;margin-bottom:6px;gap:0}.calendar-week span{padding:6px 0}.calendar-days{display:block}.calendar-row{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px;margin:2px 0}.calendar-days button{height:40px;min-width:0;border-radius:7px;font-size:14px;font-variant-numeric:tabular-nums;color:var(--control-ink)}.calendar-days button:hover:not(:disabled){background:var(--control-hover)}.calendar-days button:focus-visible{outline:2px solid var(--control-green);outline-offset:-2px}.calendar-days button.today{box-shadow:inset 0 0 0 1px var(--control-focus)}.calendar-days button.selected,.calendar-period-grid button.selected{background:var(--control-green);color:var(--control-paper)}.calendar-days button:disabled{opacity:.27;background:transparent}.calendar-period-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;padding:7px 0}.calendar-period-grid button{min-height:44px;font-size:14px;border-radius:7px;padding:10px}.calendar-period-grid button:hover:not(:disabled){background:var(--control-hover);color:var(--control-green)}.calendar-foot{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--control-line);padding-top:9px;margin:10px 0 0}.calendar-foot button{min-height:40px;padding:8px 10px;border-radius:6px;font-size:13px}.calendar-foot button:hover:not(:disabled){background:var(--control-hover)}
input[type=checkbox]{background:var(--control-paper)!important;border-color:oklch(66% .03 155)!important;border-radius:6px!important}input[type=checkbox]:checked{background:var(--control-green)!important;border-color:var(--control-green)!important}input[type=checkbox]:checked::after{border-color:var(--control-paper)}input[type=radio]{appearance:none;-webkit-appearance:none;display:inline-grid;place-items:center;flex:0 0 22px;width:22px;height:22px;min-height:22px;padding:0;margin:3px 0;border:1.5px solid var(--control-line);border-radius:50%;background:var(--control-paper)}input[type=radio]:checked{border-color:var(--control-green)}input[type=radio]:checked::after{content:'';width:10px;height:10px;border-radius:50%;background:var(--control-green)}.checks{min-height:40px}
summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;min-height:40px}summary::-webkit-details-marker{display:none}summary::marker{content:''}.disclosure-icon{margin-left:auto;flex:none;color:var(--control-muted);display:inline-grid;place-items:center;transition:transform 180ms var(--control-ease)}.disclosure-icon>.ui-icon{width:17px;height:17px}details[open]>summary>.disclosure-icon{transform:rotate(180deg)}summary:focus-visible{outline:3px solid var(--control-focus);outline-offset:3px;border-radius:5px}
.control-message{display:flex;align-items:flex-start;gap:7px;font-size:12px;line-height:1.75;margin-top:8px;overflow-wrap:anywhere;color:var(--control-error)}.control-message[hidden]{display:none}.control-message>.ui-icon{width:15px;height:15px;margin-top:3px}.control-message[data-tone=success]{color:var(--control-green)}.control-message[data-tone=neutral]{color:var(--control-muted)}.control-lookup{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--control-green);margin-top:7px;line-height:1.6;text-decoration:none;min-height:28px}.control-lookup .ui-icon{width:13px;height:13px}.control-lookup:hover{text-decoration:underline}.control-tooltip{position:fixed;z-index:200;max-width:min(260px,calc(100vw - 24px));padding:7px 10px;background:var(--control-ink);color:var(--control-paper);border-radius:6px;font-size:12px;line-height:1.6;pointer-events:none;box-shadow:var(--control-shadow)}
.photo-drop,.photo-preview,.upload{border-color:var(--control-line);border-radius:var(--control-radius);background:oklch(97% .01 155)}.photo-drop:hover,.photo-preview:hover,.upload.dragging{border-color:var(--control-green);background:var(--control-hover)}.photo-drop:focus-visible,.photo-preview:focus-visible{outline:3px solid var(--control-focus);outline-offset:3px}.photo-example{min-height:44px;border-radius:8px;border-color:var(--control-line)}.photo-example.selected{border-color:var(--control-green);background:var(--control-hover)}.photo-mode{display:inline-flex;align-items:center;gap:6px}.photo-mode::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--control-green)}
.modal-backdrop,.confirm-backdrop{background:oklch(23% .025 166 / .46);backdrop-filter:none}.modal,.confirm-card{background:var(--control-paper);border:1px solid var(--control-line);box-shadow:0 18px 60px oklch(20% .03 166 / .17)}.modal-head,.modal-foot{border-color:var(--control-line)}.modal-head [data-close]{width:40px;height:40px}.confirm-card .actions>.btn{min-width:96px}.confirm-symbol{background:var(--control-hover);color:var(--control-green)}
#toast{display:none;position:fixed;left:auto;right:24px;bottom:24px;top:auto;transform:none;max-width:min(440px,calc(100vw - 32px));padding:13px 14px;gap:11px;align-items:flex-start;border:1px solid var(--control-line);border-radius:12px;background:var(--control-paper);color:var(--control-ink);box-shadow:var(--control-shadow);font-size:14px;line-height:1.7;z-index:160}.toast-symbol{display:grid;place-items:center;background:var(--control-hover);color:var(--control-green);width:30px;height:30px;border-radius:8px;flex:none}.toast-symbol .ui-icon{width:17px;height:17px}#toast[data-tone=error] .toast-symbol{color:var(--control-error);background:var(--control-error-bg)}.toast-text{padding-top:3px;min-width:0;overflow-wrap:anywhere}.toast-close{display:grid;place-items:center;margin-left:auto;width:30px;height:30px;flex:none;border-radius:6px;color:var(--control-muted)}.toast-close:hover{background:var(--control-hover)}.toast-close .ui-icon{width:16px;height:16px}
@media(max-width:760px){.btn.small{min-height:44px}.icon-btn{width:44px;height:44px}.date-trigger{width:40px}.select-option{min-height:48px;font-size:16px}.select-trigger{min-height:48px}.calendar-days button{height:44px}.calendar-period-grid button{min-height:48px}.control-message{font-size:13px}.control-lookup{min-height:44px;font-size:13px}.field label,.photo-field label{font-size:15px}.confirm-card{padding:24px}.confirm-card .actions{display:grid;grid-template-columns:1fr 1fr}.confirm-card .actions>.btn{width:100%}#toast{right:16px;bottom:16px}.photo-fields{gap:20px}.photo-save-row .btn{min-height:48px}.select-popover{border-radius:10px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}