/* Кристалл. All application changes are scoped to this selectable appearance. */
:root[data-design=crystal]{
 --bg:#edf0f7;--surface:#fff;--surface2:#f4f6fb;--ink:#252b3c;--text:var(--ink);--muted:#5d677a;--line:#dce2ed;
 --accent:#5464bb;--soft:#edf0ff;--d11-action:#5464bb;--d11-action-hover:#46559f;--d11-focus:#5464bb;--d11-control:#8c96a9;
 --d11-good:#267052;--d11-good-bg:#e7f4ed;--d11-warn:#85571f;--d11-warn-bg:#fbf1de;--d11-bad:#a72c50;--d11-bad-bg:#faeaf0;--d11-info:#3659a3;--d11-info-bg:#eaf0ff;
 --d11-radius:18px;--d11-control-radius:11px;--d11-nav:#e9edf7;--d11-glass:#f4f6fc;
 --c67-nav:rgba(234,238,248,.90);--c67-toolbar:rgba(249,250,255,.90);--c67-on-action:#fff;--c67-rose:#a72763;--c67-rose-bg:#faeaf2;
 --c67-glow-a:#e7eafb;--c67-glow-b:#f4e8f0;--c67-glow-c:#dfedf4;--c67-shine:#ffffffc9;
 --shadow:0 3px 14px #33426808;--d11-dialog-shadow:0 28px 90px #25335830;--d11-scrim:#242d496b;
 color-scheme:light;
 --d11-font:-apple-system,BlinkMacSystemFont,Inter,'Segoe UI',sans-serif;--d11-heading:var(--d11-font);--sidebar:260px;
}
:root[data-design=crystal][data-theme=dark]{
 --bg:#151d2c;--surface:#253144;--surface2:#202c40;--ink:#eef3ff;--muted:#b6c3da;--line:#44536c;
 --accent:#b5bfff;--soft:#36436a;--d11-action:#b5bfff;--d11-action-hover:#cbd1ff;--d11-focus:#b5bfff;--d11-control:#7e8faa;
 --d11-good:#a0dabc;--d11-good-bg:#294739;--d11-warn:#f1d094;--d11-warn-bg:#4c402a;--d11-bad:#ffabc5;--d11-bad-bg:#4b3044;--d11-info:#bdceff;--d11-info-bg:#304368;
 --d11-nav:#202c41;--d11-glass:#253144;--c67-nav:rgba(32,44,65,.94);--c67-toolbar:rgba(35,47,68,.94);--c67-on-action:#212d59;--c67-rose:#f4a6c9;--c67-rose-bg:#4b3044;
 --c67-glow-a:#202e4b;--c67-glow-b:#36283f;--c67-glow-c:#203e4b;--c67-shine:#72809a30;
 color-scheme:dark;
 --shadow:0 4px 20px #0000001c;--d11-dialog-shadow:0 28px 90px #0008;--d11-scrim:#090f1fb3;
}
:root[data-design=crystal] body{background:linear-gradient(125deg,var(--c67-glow-a),var(--c67-glow-b) 57%,var(--c67-glow-c));color:var(--ink);font-family:var(--d11-font);font-size:15px;line-height:1.5}
:root[data-design=crystal] :is(h1,h2,h3,h4){font-family:var(--d11-font);font-weight:600;line-height:1.3}
:root[data-design=crystal] h1{font-size:clamp(26px,2.2vw,31px);letter-spacing:-.8px}
:root[data-design=crystal] h2{font-size:22px;letter-spacing:-.4px}
:root[data-design=crystal] h3{font-size:17px;letter-spacing:-.15px}
:root[data-design=crystal] :is(.page-head p,.w35-heading p){font-size:14px;color:var(--muted);margin-top:8px}
:root[data-design=crystal] .page-head{padding-bottom:0;border-bottom:0;gap:20px;margin-bottom:26px}
:root[data-design=crystal] :is(button,.button){font-weight:500;border-radius:var(--d11-control-radius)}
:root[data-design=crystal] button:not(.primary):not(.link-button):not([aria-pressed=true]){box-shadow:none}
:root[data-design=crystal] :is(.primary,.icon-button.primary,.a4-login-submit){background:var(--d11-action);border-color:var(--d11-action);color:var(--c67-on-action);box-shadow:0 3px 8px #344b8514}
:root[data-design=crystal] :is(.primary,.icon-button.primary,.a4-login-submit):hover{background:var(--d11-action-hover);border-color:var(--d11-action-hover);color:var(--c67-on-action)}
:root[data-design=crystal] :is(.page-head .actions,.w35-heading-actions) button{min-height:42px;padding:10px 15px}
:root[data-design=crystal] :is(input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea){background:var(--surface);border-color:var(--d11-control);color:var(--ink)}
/* Native popups must not inherit a light foreground from their opening button. */
:root[data-design=crystal] select{color-scheme:light}
:root[data-design=crystal][data-theme=dark] select{color-scheme:dark}
:root[data-design=crystal] :is(option,optgroup){background:var(--surface);color:var(--ink)}
:root[data-design=crystal] :is(option,optgroup):disabled{color:var(--muted)}
:root[data-design=crystal] :is(.d11-design-option,.d11-color-options button,.u63-all-sections button){color:var(--ink);background:var(--surface)}
:root[data-design=crystal] :is(.d11-choice-heading,.u63-menu-choice label){color:var(--ink)}
:root[data-design=crystal] :is(.d11-design-option,.d11-color-options button)[aria-pressed=true]{color:var(--accent);background:var(--soft);border-color:var(--accent)}
:root[data-design=crystal] :is(.card,.board-col,.task-card,.e64-unit,.e64-person,.w13-analytic-card,.w13-editor,.n15-menu-group){background:var(--surface);border-color:var(--line);border-radius:var(--d11-radius);box-shadow:var(--shadow)}
:root[data-design=crystal] .card{padding:22px}
:root[data-design=crystal] .card .card{box-shadow:none}
:root[data-design=crystal] :is(.profile-avatar,.identity-card .avatar){background:var(--c67-rose-bg);color:var(--c67-rose)}
:root[data-design=crystal] :is(.avatar,.e64-initials){border-radius:50%;background:var(--soft);color:var(--accent)}
:root[data-design=crystal] .table th{background:var(--surface2);color:var(--muted);font-size:12px;font-weight:600;text-transform:none;letter-spacing:0}
:root[data-design=crystal] .table td{border-color:var(--line);padding-top:16px;padding-bottom:16px;line-height:1.5}
:root[data-design=crystal] .table tr:hover td{background:var(--surface2)}
:root[data-design=crystal] .sidebar{background:var(--d11-nav);border:1px solid var(--c67-shine);box-shadow:0 10px 35px #2638590a;color:var(--ink)}
:root[data-design=crystal] .sidebar .brand{margin:0 0 26px;padding:7px 6px}
:root[data-design=crystal] .sidebar .brand img{filter:none}
:root[data-design=crystal][data-theme=dark] .sidebar .brand img{filter:brightness(0) invert(1)}
:root[data-design=crystal] .sidebar .nav-label{font-size:11px;letter-spacing:.08em;font-weight:500;padding:0 11px;margin-bottom:10px;color:var(--muted)}
:root[data-design=crystal] .sidebar .nav button{background:transparent;color:var(--muted);border:1px solid transparent;border-radius:11px;min-height:44px;padding:10px 11px;gap:11px;margin:1px 0;font-weight:500;box-shadow:none}
:root[data-design=crystal] .sidebar .nav button:hover{background:var(--surface2);color:var(--ink)}
:root[data-design=crystal] .sidebar .nav button.active{background:var(--surface);color:var(--accent);border-color:var(--line);box-shadow:0 2px 8px #3647730b}
:root[data-design=crystal] .sidebar .nav button svg{width:19px;height:19px;stroke-width:1.7}
:root[data-design=crystal] .u63-nav-tools{gap:8px}
:root[data-design=crystal] .u63-nav-tools button{background:var(--surface);border-color:var(--line);color:var(--ink)}
:root[data-design=crystal] .u63-side-context{border-color:var(--line);padding-top:18px}
:root[data-design=crystal] .u63-side-context h3{font-size:13px;font-weight:600}
:root[data-design=crystal] .side-bottom{padding-top:12px}
:root[data-design=crystal] .identity{padding-top:16px}
:root[data-design=crystal] .identity .avatar{background:var(--c67-rose-bg);color:var(--c67-rose)}
:root[data-design=crystal] .topbar{background:var(--d11-glass);border:1px solid var(--c67-shine);box-shadow:0 2px 14px #2e3d6306}
:root[data-design=crystal] .topbar .path{font-size:13px;color:var(--muted)}
:root[data-design=crystal] .topbar .path strong{color:var(--ink);font-weight:600}
:root[data-design=crystal] .topbar .icon-button{border-radius:11px}
:root[data-design=crystal] :is(.a4-bottom-nav,.n15-bottom-nav){background:var(--d11-glass);border-color:var(--line)}
@supports ((backdrop-filter:blur(16px)) or (-webkit-backdrop-filter:blur(16px))){
 :root[data-design=crystal] .sidebar{background:var(--c67-nav);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
 :root[data-design=crystal] :is(.topbar,.a4-bottom-nav,.n15-bottom-nav){background:var(--c67-toolbar);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
}
:root[data-design=crystal] .hero{background:transparent;border:0;border-radius:0;box-shadow:none;padding:0 0 8px;align-items:center}
:root[data-design=crystal] .hero h1{font-size:clamp(27px,2.5vw,34px);font-weight:600;letter-spacing:-.8px}
:root[data-design=crystal] .hero .kicker{font-size:12px;letter-spacing:.05em;font-weight:500;color:var(--muted)}
:root[data-design=crystal] .home-kpis{gap:16px;margin:22px 0 26px}
:root[data-design=crystal] .dash-kpi{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:20px;box-shadow:var(--shadow)}
:root[data-design=crystal] .dash-kpi strong{font-family:var(--d11-font);font-size:32px;font-weight:600;letter-spacing:-.7px}
:root[data-design=crystal] :is(.dash-kpi p,.dash-kpi small){color:var(--muted)}
:root[data-design=crystal] .home-layout{gap:22px}
:root[data-design=crystal] .feed-post{padding:22px;border-color:var(--line)}
:root[data-design=crystal] .feed-post h4{font-size:17px;margin:14px 0 8px}
:root[data-design=crystal] .feed-post p{font-size:15px;line-height:1.7}
:root[data-design=crystal] .feed-post.important{border-left-color:var(--accent)}
:root[data-design=crystal] .u63-task-row{padding:18px 0;row-gap:5px}
:root[data-design=crystal] .u63-task-row .link-button{font-size:15px;font-weight:600}
:root[data-design=crystal] .u63-task-row>.badge{background:var(--surface2);border:1px solid var(--line);color:var(--muted);font-size:12px}
:root[data-design=crystal] .u63-process-tabs{border:1px solid var(--line);background:var(--surface2);padding:7px;border-radius:14px;gap:6px}
:root[data-design=crystal] .u63-process-tabs button{font-size:13px;font-weight:500;padding:9px 12px;min-height:42px;border-radius:9px}
:root[data-design=crystal] .u63-process-tabs button[aria-current=page]{background:var(--surface);color:var(--accent);box-shadow:0 2px 7px #283c5e0d}
:root[data-design=crystal] .o62-summary{background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}
:root[data-design=crystal] .o62-item{padding:16px 0;border-color:var(--line)}
:root[data-design=crystal] .o62-item .link-button{color:var(--ink);font-size:15px;font-weight:600}
:root[data-design=crystal] .board-col{background:var(--surface2);padding:14px}
:root[data-design=crystal] .task-card{padding:17px;border-radius:14px;border-left-width:3px}
:root[data-design=crystal] .task-card h4{font-size:15px;line-height:1.45}
:root[data-design=crystal] .task-card p{font-size:14px;line-height:1.55}
:root[data-design=crystal] .w35{--w-surface:var(--surface);--w-border:var(--line);--w-soft:var(--soft);--w-muted:var(--muted)}
:root[data-design=crystal] .w35-heading{margin-bottom:26px}
:root[data-design=crystal] .w35-heading h1{font-size:clamp(25px,2.2vw,31px);font-weight:600}
:root[data-design=crystal] :is(.w35-tabs,.w35-buckets){gap:7px;padding-bottom:12px;margin-bottom:16px}
:root[data-design=crystal] :is(.w35-tabs,.w35-buckets) button{border-radius:10px;font-weight:500}
:root[data-design=crystal] :is(.w35-tabs,.w35-buckets) button[aria-pressed=true]{background:var(--soft);border-color:var(--line);color:var(--accent)}
:root[data-design=crystal] .w35-tabs b{border-radius:7px;background:var(--surface2);color:var(--ink);font-weight:600}
:root[data-design=crystal] .w35-layout{background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}
:root[data-design=crystal] .w35-search{border-color:var(--d11-control);background:var(--surface);border-radius:11px}
:root[data-design=crystal] .w35-search input{background:transparent}
:root[data-design=crystal] .w35-listhead{background:var(--surface2);font-size:12px;padding:18px}
:root[data-design=crystal] .w35-memo{padding:21px 18px;background:var(--surface);border-radius:0}
:root[data-design=crystal] .w35-memo.selected{background:var(--soft);box-shadow:inset 3px 0 0 var(--accent)}
:root[data-design=crystal] .w35-fileicon{background:var(--soft);color:var(--accent);border-radius:11px}
:root[data-design=crystal] .w35-rowtext{gap:7px}
:root[data-design=crystal] .w35-rowtext strong{font-size:16px;font-weight:600;line-height:1.4}
:root[data-design=crystal] .w35-status{background:var(--surface2);color:var(--muted);border-radius:8px}
:root[data-design=crystal] .w35-status.routing{background:var(--d11-warn-bg);color:var(--d11-warn)}
:root[data-design=crystal] .w35-status.approved{background:var(--d11-good-bg);color:var(--d11-good)}
:root[data-design=crystal] :is(.w35-status.rejected,.w35-status.returned){background:var(--d11-bad-bg);color:var(--d11-bad)}
:root[data-design=crystal] .w35-detail{padding:26px}
:root[data-design=crystal] .e64-unit{min-height:145px;border-radius:18px;padding:23px}
:root[data-design=crystal] .e64-unit-icon{width:46px;height:46px;background:var(--soft);border-radius:13px}
:root[data-design=crystal] .e64-unit-copy strong{font-size:20px;letter-spacing:-.3px;font-weight:600}
:root[data-design=crystal] .e64-person{border-radius:16px;box-shadow:var(--shadow);border-left-width:1px}
:root[data-design=crystal] .e64-person-main .link-button{font-size:16px;line-height:1.45}
:root[data-design=crystal] .employee-profile{gap:22px}
:root[data-design=crystal] .identity-card h2{font-size:23px;line-height:1.3}
:root[data-design=crystal] .profile-fields{gap:24px;padding:8px 0}
:root[data-design=crystal] .profile-fields>div>span{font-size:12px;line-height:1.5}
:root[data-design=crystal] .profile-fields strong{font-size:15px;line-height:1.5;font-weight:500}
:root[data-design=crystal] .person-mini{background:transparent;border-color:transparent;padding:7px 0;gap:10px}
:root[data-design=crystal] .person-mini b{font-size:14px;font-weight:600}
:root[data-design=crystal] .u63-account{border-style:solid}
:root[data-design=crystal] .chat-layout{border:1px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:var(--shadow)}
:root[data-design=crystal] .chat-list{background:var(--surface2);border-color:var(--line)}
:root[data-design=crystal] .chat-list .list button{border-radius:12px;padding:14px 12px}
:root[data-design=crystal] .chat-list .list button.active{background:var(--soft);color:var(--ink)}
:root[data-design=crystal] .chat-head{background:var(--surface);border-color:var(--line);padding:17px 20px}
:root[data-design=crystal] .messages{background:var(--surface);padding:22px}
:root[data-design=crystal] .bubble{background:var(--surface2);color:var(--ink);border:1px solid var(--line);border-radius:16px;padding:13px 16px;font-size:15px;line-height:1.6;box-shadow:none}
:root[data-design=crystal] .mine .bubble{background:var(--soft);color:var(--ink);border-color:var(--line)}
:root[data-design=crystal] .compose{background:var(--surface);border-color:var(--line);padding:15px 18px}
:root[data-design=crystal] .chat-side{background:var(--surface);border-color:var(--line)}
:root[data-design=crystal] .dialog{background:var(--surface);border:1px solid var(--line);border-radius:20px;box-shadow:var(--d11-dialog-shadow)}
:root[data-design=crystal] .dialog-head{padding:20px 24px;border-color:var(--line);background:var(--surface)}
:root[data-design=crystal] .dialog-body{padding:24px}
:root[data-design=crystal] .dialog-head h2{font-size:22px;font-weight:600}
:root[data-design=crystal] .n15-menu-row{border-radius:12px;min-height:48px;color:var(--ink)}
:root[data-design=crystal] .n15-menu-row:hover{background:var(--soft)}
:root[data-design=crystal] .a4-login-art{background:linear-gradient(140deg,var(--c67-glow-a),var(--c67-glow-b));color:var(--ink)}
:root[data-design=crystal] .a4-login-main{background:var(--surface)}
/* The preview tile is visible while another appearance is selected. */
.d11-preview-crystal{color:#5464bb;background:linear-gradient(125deg,#e9ecf8,#f4eaf1 60%,#dceef3);border-radius:13px;border-color:#dce2ed}
.d11-preview-crystal .d11-preview-sidebar{background:#e9edf7;border-radius:7px}
.d11-preview-crystal .d11-preview-content i{border-radius:7px;box-shadow:0 2px 7px #384f760c}
:root[data-theme=dark] .d11-preview-crystal{color:#b5bfff;background:linear-gradient(125deg,#1d2b46,#3b2941 60%,#1c3a47);border-color:#44536c}
:root[data-theme=dark] .d11-preview-crystal .d11-preview-sidebar{background:#202c41}
:root[data-theme=dark] .d11-preview-crystal .d11-preview-content i{background:#253144}
@media(min-width:901px){
 :root[data-design=crystal] .sidebar{top:16px;left:16px;bottom:16px;height:calc(100dvh - 32px);width:calc(var(--sidebar) - 28px);padding:23px 14px 16px;border-radius:21px}
 :root[data-design=crystal] .topbar{margin:16px 24px 0 0;min-height:66px;padding:0 22px;border-radius:17px}
 :root[data-design=crystal] .page{padding:28px 24px 40px 0;max-width:1600px;margin:0}
 :root[data-design=crystal] .employee-profile{grid-template-columns:260px minmax(0,1fr);grid-template-rows:auto 1fr}
 :root[data-design=crystal] .employee-profile>aside:first-child{grid-column:1;grid-row:1 / span 2}
 :root[data-design=crystal] .employee-profile>main{grid-column:2;grid-row:1}
 :root[data-design=crystal] .employee-profile>aside:last-child{grid-column:2;grid-row:2;grid-template-columns:minmax(0,1fr);align-self:start}
}
@media(min-width:901px) and (max-width:1200px){:root[data-design=crystal]{--sidebar:238px}:root[data-design=crystal] .employee-profile{grid-template-columns:220px minmax(0,1fr)}}
@media(max-width:900px){
 :root[data-design=crystal] .shell{display:block}
 :root[data-design=crystal] .topbar{margin:0;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:0 14px;min-height:64px}
 :root[data-design=crystal] .page{padding:22px 16px calc(100px + env(safe-area-inset-bottom));margin:0;max-width:none}
 :root[data-design=crystal] .page-head{margin-bottom:22px;gap:15px}
 :root[data-design=crystal] :is(.page-head h1,.hero h1){font-size:27px;line-height:1.25}
 :root[data-design=crystal] :is(.page-head .actions,.w35-heading-actions) button{min-height:44px;padding:10px 12px;font-size:14px}
 :root[data-design=crystal] .card{padding:18px}
 :root[data-design=crystal] .home-kpis{gap:10px;margin:18px 0 22px}
 :root[data-design=crystal] .dash-kpi{padding:16px}
 :root[data-design=crystal] .dash-kpi strong{font-size:28px}
 :root[data-design=crystal] .u63-process-tabs{flex-wrap:nowrap;overflow-x:auto;max-width:100%;min-width:0;scrollbar-width:thin;overscroll-behavior-x:contain}
 :root[data-design=crystal] .u63-process-tabs button{font-size:13px;min-height:44px;padding:9px 12px;flex:0 0 auto;white-space:nowrap}
 :root[data-design=crystal] .w35-heading h1{font-size:25px}
 :root[data-design=crystal] .w35-memo{padding:18px 13px}
 :root[data-design=crystal] .w35-detail{padding:18px}
 :root[data-design=crystal] .w35-rowtext strong{font-size:15px}
 :root[data-design=crystal] .w35-tabs button{font-size:14px}
 :root[data-design=crystal] .e64-unit-copy strong{font-size:18px}
 :root[data-design=crystal] .employee-profile{gap:16px}
 :root[data-design=crystal] .profile-fields{gap:20px}
 :root[data-design=crystal] .dialog-head{padding:18px}
 :root[data-design=crystal] .dialog-body{padding:18px}
 :root[data-design=crystal] body.crm-chat-page .page{padding:0 0 calc(var(--a4-nav-h,70px) + env(safe-area-inset-bottom,0px));min-height:0}
 :root[data-design=crystal] body.crm-chat-page.keyboard-open .page{padding-bottom:0}
 :root[data-design=crystal] body.crm-chat-page .chat-layout{border:0;border-radius:0;box-shadow:none}
 :root[data-design=crystal] body.crm-chat-page .chat-list{border-radius:0}
 :root[data-design=crystal] body.crm-chat-page .chat-head{padding:10px 12px}
 :root[data-design=crystal] body.crm-chat-page .messages{padding:14px}
 :root[data-design=crystal] body.crm-chat-page .compose{padding:10px 12px}
}
@media(prefers-reduced-transparency:reduce){:root[data-design=crystal] :is(.sidebar,.topbar,.a4-bottom-nav,.n15-bottom-nav){background:var(--surface);backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(prefers-reduced-motion:reduce){:root[data-design=crystal] *{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
@media(forced-colors:active){:root[data-design=crystal] :is(.sidebar,.topbar,.card,.w35-layout,.e64-unit,.e64-person){background:Canvas;color:CanvasText;border:1px solid CanvasText;backdrop-filter:none}:root[data-design=crystal] :is(.primary,.sidebar .nav button.active){background:Highlight;color:HighlightText}:root[data-design=crystal] button{border:1px solid ButtonText}}
