/* Shared finish: quiet surfaces, readable controls, and theme-specific character. */
:root { --ui-ease:cubic-bezier(.2,.7,.2,1); }
html[data-theme] .os-window { --content-focus:color-mix(in srgb,var(--content-accent),transparent 76%); }
html[data-theme=macos] .os-window {
  --content-paper:#f7f8fa; --content-card:#fff; --content-soft:#eef0f4;
  --content-ink:#242832; --content-muted:#5e6573; --content-line:#d9dde5;
  --content-accent:#315fb3; --content-hover:#254c96; --content-tint:#eaf0fb;
  --content-dark:#252c3b; --content-dark-muted:#c6d0e2;
  --content-result:#35435c; --content-result-muted:#dce5f5;
  --content-radius:16px; --content-control-radius:10px;
}
html[data-device=desktop][data-theme=modern] .os-window {
  --content-paper:#f6f8fb; --content-soft:#edf1f6; --content-card:#fff;
  --content-ink:#203047; --content-muted:#58687d; --content-line:#d5deea;
  --content-accent:#165faa; --content-hover:#104c8c; --content-tint:#e9f2fc;
  --content-dark:#1d3149; --content-dark-muted:#c5d7ea;
  --content-result:#2b4968; --content-result-muted:#dce9f7;
  --content-radius:10px; --content-control-radius:7px;
}
html[data-theme] :is(button,a,input,select,textarea) { touch-action:manipulation; }
html[data-theme] .os-window .window-content :is(button,a,input,select,textarea):focus-visible {
  outline:3px solid var(--content-accent); outline-offset:3px;
}
html[data-theme] .os-window .window-content { scroll-padding:24px; }
html[data-theme] .os-window .window-content :is(.button,.example-tabs button) { min-height:44px; }
html[data-theme] .os-window .window-content .button { gap:10px; }
html:is([data-theme=macos],[data-theme=modern]) .os-window {
  border-color:#ffffffb3; box-shadow:0 16px 48px #101c302b,0 1px 4px #101c3014;
}
html:is([data-theme=macos],[data-theme=modern]) .os-window.is-active {
  box-shadow:0 28px 80px #101c3038,0 2px 8px #101c301a;
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content {
  font-family:var(--ui-font); font-size:1rem; line-height:1.65;
  scrollbar-width:thin; scrollbar-color:#b7bfcb transparent;
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content :is(h1,h2,h3) {
  font-family:var(--ui-font); font-weight:650; text-wrap:balance;
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content h1 {
  font-size:clamp(1.9rem,4.7cqi,2.8rem); line-height:1.12; letter-spacing:-.045em;
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content h2 {
  font-size:clamp(1.65rem,3.8cqi,2.15rem); line-height:1.2; letter-spacing:-.035em;
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content :is(.hero-intro,.section-intro,.about-copy .lead,.service>p,.process-grid article p,.about-copy p,.contact-grid>div>p) {
  font-size:1rem; line-height:1.7;
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content :is(.hero-secondary,.theme-settings>p,.theme-description) {
  font-size:.875rem; line-height:1.65;
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content :is(.hero-grid,.section-content) {
  padding:32px; gap:32px;
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .hero-copy { padding-block:8px; align-self:start; }
html:is([data-theme=macos],[data-theme=modern]) .welcome-brand { margin-bottom:14px; }
html:is([data-theme=macos],[data-theme=modern]) .welcome-brand img { width:216px; }
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .eyebrow {
  font:650 .75rem/1.5 var(--ui-font); letter-spacing:.08em; margin-bottom:14px;
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .button {
  padding:11px 18px; font:600 .875rem/1.4 var(--ui-font); border-width:1px;
  box-shadow:0 1px 2px #15243c0a;
  transition:background-color .16s var(--ui-ease),box-shadow .16s var(--ui-ease),transform .16s var(--ui-ease);
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .button.primary {
  box-shadow:inset 0 1px #ffffff20,0 3px 8px #16355b17;
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .button:active { transform:translateY(1px); }
/* The example is a composed card, with one clear selected tab and aligned flow. */
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .terminal-window {
  border:1px solid var(--content-line); border-radius:var(--content-radius); box-shadow:0 8px 28px #172b4810;
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .terminal-title {
  background:var(--content-card); padding:14px 16px; font-size:.75rem; color:var(--content-muted);
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .example-tabs {
  margin:0; padding:7px; gap:4px; border-bottom:1px solid var(--content-line);
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .example-tabs button {
  background:transparent; border:1px solid transparent; font-size:.875rem; font-weight:550; box-shadow:none;
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .example-tabs button[aria-pressed=true] {
  background:var(--content-card); color:var(--content-accent); border-color:var(--content-line); box-shadow:0 2px 4px #152a4310;
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .terminal-body { padding:24px; }
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .flow-step strong {
  font:600 1.125rem/1.5 var(--ui-font); letter-spacing:-.015em;
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .flow-step span { font-size:.75rem; letter-spacing:.04em; }
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .flow-connector { height:36px; padding-left:4px; opacity:.7; }
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .flow-result {
  border:1px solid #ffffff26; padding:16px; border-radius:var(--content-control-radius);
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .terminal-note { font-size:.875rem; line-height:1.6; }
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .terminal-status { padding:10px 16px; font-size:.75rem; }
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content :is(.service,.process-grid article) {
  padding:24px; border:1px solid var(--content-line); box-shadow:0 2px 6px #172b4805;
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .service h3 { margin-block:14px 12px; }
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .service-label { font-size:.75rem; letter-spacing:.04em; }
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .step-number { font-size:1.5rem; padding-bottom:12px; margin-bottom:16px; }
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .info-strip { padding:16px 20px; font-size:.875rem; }
/* One readable, consistent form system across the complete assistant. */
html[data-theme] .project-wizard { font-size:.9375rem; line-height:1.6; }
html[data-theme] #projekt .wizard-choice { font-size:.875rem; line-height:1.5; padding:12px; gap:10px; }
html[data-theme] .os-window .window-content :is(.wizard-intro,.wizard-field,.project-wizard legend) { font-size:.9375rem; }
html[data-theme] .os-window .window-content :is(.wizard-tip,.wizard-privacy,.wizard-field>span,.project-wizard legend span) { font-size:.8125rem; line-height:1.6; }
html[data-theme] .os-window .window-content .wizard-field :is(input,select,textarea) { font-size:1rem; padding:12px; }
html[data-theme] .os-window .window-content .wizard-field textarea { line-height:1.65; }
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .wizard-sidebar {
  background:var(--content-soft); padding:22px 12px; border-right:1px solid var(--content-line);
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .wizard-sidebar button { font-size:.875rem; padding:10px 8px; }
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .wizard-main { padding:28px; }
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .wizard-choice {
  border:1px solid var(--content-line); box-shadow:0 1px 2px #18274005;
  transition:background .15s,border-color .15s;
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .wizard-choice:has(input:checked) {
  outline:none; border-color:var(--content-accent); box-shadow:inset 0 0 0 1px var(--content-accent);
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .wizard-field :is(input,textarea,select):focus {
  border-color:var(--content-accent); outline:3px solid var(--content-focus); outline-offset:1px;
}
html[data-theme] .wizard-field-error { display:block; margin-top:6px; color:#a52826; font-size:.8125rem; font-weight:500; }
html[data-theme] .os-window .window-content .wizard-field [aria-invalid=true] { border-color:#b63732; }
html[data-theme] .wizard-character-count { display:block; text-align:right; margin-top:5px; font-size:.75rem; font-weight:400; color:var(--content-muted); }
html[data-theme] footer.wizard-footer[hidden] { display:none; }
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content footer.wizard-footer {
  background:var(--content-card); border-top:1px solid var(--content-line); padding:14px 22px; box-shadow:0 -4px 16px #18274005;
}
html[data-theme] .wizard-footer .button { min-height:44px; }
html[data-theme] #wizard-step-count { font-size:.8125rem; font-variant-numeric:tabular-nums; }
html[data-theme] .os-window .window-content .wizard-summary { padding:20px; }
html[data-theme] .wizard-summary dd { padding-bottom:12px; border-bottom:1px solid var(--content-line); }
html[data-theme] .wizard-summary dd:last-child { border-bottom:0; padding-bottom:0; }
/* Settings and onboarding share the same selection language. */
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .theme-settings { padding:32px; }
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .theme-option {
  padding:16px; border:1px solid var(--content-line); gap:12px; box-shadow:none;
}
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .theme-option:has(input:checked) {
  border-color:var(--content-accent); outline:0; box-shadow:0 0 0 2px var(--content-accent);
}
html[data-theme] .os-window .window-content .theme-option strong { font-size:.9375rem; }
html[data-theme] .os-window .window-content .theme-description { font-size:.875rem; }
#setup-dialog { border-radius:24px; box-shadow:0 32px 100px #101c304d,0 0 0 1px #ffffff80; }
#setup-dialog .setup-heading { padding-top:32px; }
#setup-dialog .setup-kicker { font-size:.75rem; }
#setup-dialog .theme-description,#setup-dialog .setup-heading>p:last-child { font-size:.875rem; }
#setup-dialog .setup-footer p { font-size:.8125rem; }
#setup-dialog .theme-option { border-width:1px; padding:14px; border-radius:14px; }
#setup-dialog .setup-continue { border-radius:10px; min-height:48px; font-size:.9375rem; }
/* Speech is an inviting action, with a calm, fully themed recording dialog. */
html:is([data-theme=macos],[data-theme=modern]) .dictation-toolbar {
  padding:16px; border:1px solid var(--content-line); border-radius:var(--content-radius);
  background:var(--content-card); box-shadow:0 2px 8px #18274006; margin-bottom:18px;
}
html:is([data-theme=macos],[data-theme=modern]) .dictation-entry-heading { font-size:1rem; font-weight:600; }
html:is([data-theme=macos],[data-theme=modern]) .dictation-button.dictation-entry { min-height:46px; font-size:.9375rem; }
html:is([data-theme=macos],[data-theme=modern]) .dictation-dialog,
html:is([data-theme=macos],[data-theme=modern]) .dictation-dialog :is(h2,textarea) { font-family:var(--ui-font); }
html:is([data-theme=macos],[data-theme=modern]) .dictation-dialog { padding:28px; border-width:1px; border-radius:20px; }
.dictation-dialog::backdrop { backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); background:#111b3259; }
.dictation-dialog h2 { letter-spacing:-.025em; }
.dictation-clock { padding:16px 0; font-size:2rem; letter-spacing:-.04em; }
.dictation-actions { position:sticky; bottom:-1px; padding:14px 0 2px; background:var(--content-paper); border-top:1px solid var(--content-line); }
.dictation-status:focus { outline:none; }
.dictation-dialog[data-phase=recording] .dictation-clock { color:#b43332; }
.dictation-dialog[data-phase=transcribing] .dictation-status { color:var(--content-accent); }
/* Reading surfaces: consistent navigation and stronger article hierarchy. */
html[data-theme] #wissen .knowledge-toolbar { gap:6px; padding:10px 14px; }
html[data-theme] #wissen .knowledge-search input { box-shadow:inset 0 1px 3px #15243c06; }
html[data-theme] #wissen .window-content .knowledge-card { padding:24px; box-shadow:0 2px 6px #18274005; }
html[data-theme] #wissen .window-content .knowledge-card h2 { font-size:1.125rem; line-height:1.45; }
html[data-theme] #wissen .knowledge-card p { font-size:.9375rem; line-height:1.65; }
html[data-theme] #wissen .knowledge-topics button { font-size:.875rem; }
html:is([data-theme=macos],[data-theme=modern]) #wissen .knowledge-topics button { border-radius:999px; padding:8px 15px; }
html[data-theme] #wissen :is(.knowledge-result-count,.knowledge-card-meta,.knowledge-meta) { font-size:.8125rem; }
html[data-theme] #wissen .knowledge-article { font-size:1rem; line-height:1.8; }
html[data-theme] #wissen .knowledge-note { border-radius:var(--content-control-radius); }
.knowledge-page .knowledge-card { box-shadow:0 3px 16px #15243c07; }
.knowledge-page .knowledge-topics button { font-size:.875rem; border-radius:999px; }
.knowledge-page .knowledge-card p { font-size:.9375rem; }
/* Desktop chrome gets restraint; app icons stay original and recognizable. */
html[data-device=desktop][data-theme=macos] .windows-os {
  background:radial-gradient(ellipse at 100% 100%,#e8bfb4 0,transparent 52%),radial-gradient(ellipse at 4% 96%,#847db3 0,transparent 58%),linear-gradient(145deg,#172543 3%,#454878 46%,#b38d9f 100%);
}
html[data-device=desktop][data-theme=macos] .mac-menubar { background:#eef0f4d4; font-size:.8125rem; gap:20px; }
html[data-device=desktop][data-theme=macos] .mac-clock { font-size:.75rem; }
html[data-device=desktop][data-theme=macos] .os-titlebar { background:linear-gradient(#fafbfc,#eef0f4); border-color:#d9dde5; }
html[data-device=desktop][data-theme=macos] .drag-handle { font-size:.8125rem; font-weight:600; }
html[data-device=desktop][data-theme=macos] footer.taskbar { background:#eef0f4a8; border-color:#ffffffa8; box-shadow:inset 0 1px #ffffffa0,0 12px 32px #17253f2e; }
html[data-device=desktop][data-theme=modern] footer.taskbar { background:#edf2f9e8; border-top-color:#ffffffb3; box-shadow:0 -1px 16px #0a1c2b12; }
html[data-device=desktop][data-theme=modern] .desktop-clock:after { font-size:.75rem; }
html[data-device=desktop][data-theme] .desktop-icons {
  top:20px; bottom:24px; width:max-content; display:grid; grid-auto-flow:column; grid-template-rows:repeat(auto-fit,88px); grid-auto-columns:108px; gap:10px 8px;
}
html[data-device=desktop][data-theme] .desktop-icon { min-height:0; padding:6px 4px; justify-content:center; }
html[data-device=desktop]:is([data-theme=macos],[data-theme=modern]) .desktop-icon { font-size:.75rem; line-height:1.35; gap:8px; }
html[data-device=desktop]:is([data-theme=macos],[data-theme=modern]) .start-menu-items :is(button,a) { font-size:.875rem; min-height:40px; }
html[data-device=desktop][data-theme=retro] .desktop-icons { grid-template-rows:repeat(auto-fit,86px); }
html[data-device=desktop][data-theme=retro] .os-window .window-content :is(.hero-secondary,.section-intro) { line-height:1.7; }
html[data-theme=retro] .wizard-field-error { font-family:Tahoma,Arial,sans-serif; }
@container (max-width:650px) {
  html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content :is(.hero-grid,.section-content,.theme-settings) { padding:24px; gap:24px; }
  html[data-theme] #projekt .wizard-sidebar { padding:6px 10px; border-right:0; border-bottom:1px solid var(--content-line); }
  html[data-theme] #projekt .wizard-sidebar button { flex-direction:column; padding:8px 2px; font-size:.75rem; gap:5px; min-height:54px; }
  html[data-theme] #projekt .wizard-main { padding:24px 20px; }
  html[data-theme] .os-window .window-content .theme-option { padding:14px 38px 14px 14px; }
  html[data-theme] .os-window .window-content :is(.about-grid,.contact-grid) { grid-template-columns:1fr; }
}
@container (max-width:480px) {
  html[data-theme] #wissen .knowledge-toolbar { flex-wrap:wrap; }
  html[data-theme] #wissen .knowledge-search { flex-basis:100%; order:2; }
  html[data-theme] #wissen .knowledge-body { padding:24px 18px 36px; }
  html[data-theme] #wissen .knowledge-grid { grid-template-columns:1fr; }
  html[data-theme] #projekt footer.wizard-footer { display:grid; grid-template-columns:1fr; gap:6px; }
  html[data-theme] #projekt footer.wizard-footer>div { display:flex; width:100%; margin:0; }
  html[data-theme] #projekt footer.wizard-footer>div .button { flex:1; }
  html[data-theme] #projekt #wizard-step-count { max-width:none; font-size:.75rem; }
}
/* Phone content follows its native palette without desktop density. */
@media (max-width:600px), (max-width:1000px) and (max-height:600px) and (pointer:coarse) {
  html[data-device=phone][data-theme] .os-window .window-content :is(.hero-grid,.section-content,.theme-settings) { padding:24px 20px; gap:24px; }
  html[data-device=phone][data-theme] .os-window .window-content .hero-grid { grid-template-columns:1fr; }
  html[data-device=phone][data-theme] #projekt .wizard-sidebar { padding:4px 8px; }
  html[data-device=phone][data-theme] #projekt .wizard-sidebar button { min-height:40px; padding:6px 2px; font-size:.75rem; gap:0; }
  html[data-device=phone][data-theme] #projekt .wizard-main { padding:22px 18px; }
  html[data-device=phone][data-theme] #projekt .wizard-field textarea { min-height:120px; }
  html[data-device=phone][data-theme] #projekt .wizard-field textarea[name=process] { min-height:180px; }
  html[data-device=phone][data-theme] #projekt .wizard-field textarea[name=outcome] { min-height:152px; }
  html[data-device=phone][data-theme] #projekt footer.wizard-footer { padding:8px 14px; min-height:0; gap:5px; }
  html[data-device=phone][data-theme] #projekt .wizard-footer .button { min-height:44px; padding:10px 12px; font-size:.875rem; }
  html[data-device=phone][data-theme] .os-window .window-content .theme-description { font-size:.8125rem; }
  html[data-device=phone][data-theme] .os-window .window-content .terminal-body { padding:22px; }
  html[data-device=phone][data-theme] .dictation-toolbar { padding:14px; }
  html[data-device=phone][data-theme] .dictation-entry-hint { font-size:.8125rem; }
  html[data-device=phone][data-theme] .dictation-dialog { padding:22px 18px; }
  html[data-device=phone][data-theme] .dictation-actions { gap:8px; }
  html[data-device=phone][data-theme] .phone-search-dialog { padding:22px; }
  html[data-device=phone][data-theme] .phone-search-result { padding:14px; }
  html[data-device=phone][data-theme] .phone-search-result small { font-size:.8125rem; }
  #setup-dialog .setup-heading { padding:24px 22px 0; }
  #setup-dialog .setup-options { padding:20px 22px; }
  #setup-dialog .theme-option { padding:12px 36px 12px 12px; gap:4px 14px; }
  #setup-dialog .theme-description { font-size:.8125rem; line-height:1.5; }
  #setup-dialog .setup-footer { padding:16px 22px; gap:12px; }
  #setup-dialog .setup-footer p { font-size:.75rem; }
}
@media (max-height:500px) and (pointer:coarse) {
  html[data-device=phone][data-theme] #projekt .wizard-field textarea { min-height:96px; }
  html[data-device=phone][data-theme] #projekt .wizard-field textarea[name=process] { min-height:128px; }
  html[data-device=phone][data-theme] #projekt footer.wizard-footer { display:flex; flex-wrap:nowrap; }
  html[data-device=phone][data-theme] #projekt footer.wizard-footer>div { width:auto; }
}
@media (prefers-reduced-motion:reduce) {
  html[data-theme] *,html[data-theme] *::before,html[data-theme] *::after { scroll-behavior:auto!important; transition:none!important; animation-duration:.01ms!important; animation-iteration-count:1!important; }
}

/* Crisp, consistently sized navigation symbols at every pixel density. */
html[data-theme] #wissen .knowledge-toolbar button { display:grid; place-items:center; }
html[data-theme] #wissen .knowledge-toolbar .knowledge-search>button { width:44px; min-width:44px; padding:0; flex-shrink:0; }
html[data-theme] #wissen .knowledge-toolbar .ui-icon { display:block; flex:none; width:18px; height:18px; aspect-ratio:1; }
html:is([data-theme=macos],[data-theme=modern]) .window-status>span[aria-hidden] { display:none; }
@media (max-width:350px) {
  html[data-device=phone][data-theme] #projekt .wizard-footer .button { font-size:.8125rem; padding-inline:8px; white-space:nowrap; }
}
html[data-device=phone][data-theme] #projekt #wizard-step-count { max-width:none; white-space:nowrap; }
html:is([data-theme=macos],[data-theme=modern]) .os-window .window-content .section-content .eyebrow { font-size:.75rem; line-height:1.5; }
