/* Authority: user-supplied Plane screenshots, 2026-10-15. */
:root {
 --template-primary:#006399;
 --template-hover:#005580;
 --brand-primary:var(--template-primary);
 --brand-hover:var(--template-hover);
 --brand-tint:#edf6fb;
 --blue:#006399;
 --ui-focus:#006399;
 --template-tab:#eeeeef;
 --template-segment:#f3f3f4;
}
:root.dark {
 --brand-primary:var(--template-primary);
 --brand-hover:#0879b1;
 --brand-tint:#17303d;
 --blue:#8cc8e9;
 --ui-focus:#5996b7;
 --template-tab:#2b2b2d;
 --template-segment:#202022;
}
.btn,.dark .btn,.plane-page .btn,.plane-route-header .btn {
 min-height:28px;padding:4px 10px;border-radius:5px;font-size:13px;font-weight:500;line-height:19px;
}
.btn.primary,.dark .btn.primary,.plane-page .btn.primary,.dark .plane-page .btn.primary,.login-form .btn.primary,.dark .login-form .btn.primary {
 background:var(--template-primary);border-color:var(--template-primary);color:#fff;
}
.btn.primary:not(:disabled):hover,.dark .btn.primary:not(:disabled):hover {background:var(--brand-hover);border-color:var(--brand-hover);}
.btn:not(.primary):not(.quiet) {background:var(--plane-control);border-color:var(--line);}
.btn:not(.primary):not(.quiet):not(:disabled):hover {border-color:var(--line);background:var(--ui-hover);}
.btn>.icon {width:15px;height:15px;}
.btn:not(:disabled):active {transform:none;}
.platform-name {display:inline-flex;align-items:center;gap:8px;vertical-align:middle;min-width:0;}
svg.ai-platform-icon {display:block;flex:none;width:22px;height:22px;aspect-ratio:1;object-fit:contain;color:var(--text);}
.plane-rail-item.selected {color:var(--text);}
.plane-rail-item.selected>.icon {color:var(--text);background:var(--plane-active);}
.plane-nav-item.selected>.icon {color:var(--text);}
.plane-select-trigger {border-radius:5px;min-height:30px;font-size:13px;}
.field .plane-select-trigger {min-height:36px;font-size:14px;}
.plane-select-option {min-height:32px;font-size:13px;border-radius:5px;}
.plane-select-menu {padding:5px;border-radius:6px;}
.plane-switch {width:28px;height:16px;background:#dadbdd;}
.plane-switch:checked {background:var(--template-primary);}
.plane-switch:checked::before {transform:translateX(12px);}
.plane-switch:focus-visible {outline:2px solid var(--ui-focus);outline-offset:3px;}
.plane-page .tabs,.plane-settings-tabs {
 position:relative;display:flex;gap:4px;align-items:stretch;min-height:44px;height:44px;padding:0;margin-bottom:20px;
 border:0;overflow-x:auto;white-space:nowrap;
}
.plane-page .tabs::after,.plane-settings-tabs::after {content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line);pointer-events:none;}
.plane-page .tabs>button,.plane-settings-tabs>button {
 display:inline-flex;align-items:flex-start;gap:7px;position:relative;isolation:isolate;z-index:1;min-height:44px;height:44px;margin:0;
 padding:4px 8px 20px;border:0;border-radius:0;background:transparent;font-size:14px;font-weight:400;color:var(--plane-secondary);line-height:20px;
}
.plane-page .tabs>button::before,.plane-settings-tabs>button::before {content:'';position:absolute;left:0;right:0;top:0;height:28px;border-radius:5px;z-index:-1;pointer-events:none;}
.plane-page .tabs>button:hover,.plane-settings-tabs>button:hover {background:transparent;color:var(--text);}
.plane-page .tabs>button:hover::before,.plane-settings-tabs>button:hover::before {background:var(--ui-hover);}
.plane-page .tabs>button.active,.plane-settings-tabs>button.active {background:transparent;color:var(--text);border:0;}
.plane-page .tabs>button.active::before,.plane-settings-tabs>button.active::before {background:var(--template-tab);}
.plane-page .tabs>button.active::after,.plane-settings-tabs>button.active::after {
 content:'';position:absolute;left:8px;right:8px;bottom:0;height:2px;border-radius:1px;background:var(--text);
}
.plane-page .tabs .badge {background:transparent;border:0;padding:0;font-size:12px;min-width:16px;line-height:18px;color:var(--muted);}
.plane-page .segmented {
 display:inline-flex;align-items:center;gap:2px;padding:3px;border:0;border-radius:8px;background:var(--template-segment);
}
.plane-page .segmented>button {
 display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:24px;padding:2px 7px;border:1px solid transparent;border-radius:5px;
 font-size:13px;line-height:18px;font-weight:400;color:var(--plane-secondary);background:transparent;
}
.plane-page .segmented>button.active {background:var(--surface);border-color:var(--line);box-shadow:0 1px 2px #0000000d;color:var(--text);}
.plane-page .segmented>button:not(.active):hover {color:var(--text);}
.task-status-filters {gap:4px;}
.task-status-filters>button {font-size:13px;min-height:28px;padding:4px 8px;}
.task-status-filters>button.active {background:var(--template-tab);}
.plane-page .empty {text-align:left;max-width:460px;}
.plane-page .empty .plane-empty-art {width:164px;max-height:185px;margin:0 0 28px;}
.plane-page .empty h3 {font-size:16px;font-weight:600;}
.plane-page .empty p {font-size:14px;line-height:1.6;max-width:44ch;margin:12px 0 18px;}
.plane-drafts-page>.empty {display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-height:calc(100% - 110px);padding:36px 24px;}
.plane-header-brand .brand-wordmark {width:100px;height:18px;}
.login-wordmark .brand-wordmark {width:148px;height:27px;}
@media(max-width:700px) {
 .plane-header-brand .brand-wordmark {width:94px;height:17px;}
 .login-wordmark .brand-wordmark {width:134px;height:25px;}
 .plane-page .btn {min-height:32px;font-size:13px;}
 .plane-page .empty {padding:36px 18px;}
 .plane-page .tabs>button {font-size:13px;}
}