/* Ciantic / Midnight. Shared presentation for every department workspace. */
:root {
  --bg:#08090d;--surface:#111319;--surface2:#191c25;--border:#292d3a;
  --text:#f1f2f7;--muted:#9da5b8;--accent:#ad96ff;--blue:#ad96ff;
  --blue-light:#cbbcff;--accent-soft:#ad96ff14;--green:#89d6bb;--danger:#ffa3b1;
  --line:var(--border);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
body {background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;}
body::before {background:radial-gradient(ellipse at 85% 0,#6752a014,transparent 50%),linear-gradient(180deg,#0b0c12,#08090d);}
button,a,input,textarea,select { -webkit-tap-highlight-color:transparent; }
:focus-visible {outline:2px solid #cab8ff!important;outline-offset:4px;}
.icon {fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.sidebar {inset:14px auto 14px 14px;width:238px;padding:24px 13px 18px;border:1px solid #30313e;border-radius:22px;background:linear-gradient(165deg,#181923ed,#101117f5);box-shadow:0 12px 40px #0003;}
.shell>main {margin-left:266px;}
.brand {padding:0 12px 24px;font-size:20px;letter-spacing:2.5px;gap:12px;}
.brand img {width:35px;height:44px;}
.brand small {font-size:7px;letter-spacing:2.2px;color:#8e95a9;}
.nav-label {margin:14px 13px 16px;font-size:8px;letter-spacing:2px;color:#82889e;}
.nav-button {padding:11px 12px;min-height:43px;margin-bottom:4px;border-radius:11px;font-size:12px;color:#a5adbf;gap:12px;transition:background .2s,color .2s,transform .2s;}
.nav-button .icon {width:17px;height:17px;}
.nav-button.active {background:linear-gradient(100deg,#ad96ff23,#ad96ff0b);border-color:#ad96ff30;color:#e0d7ff;box-shadow:inset 0 1px 0 #ffffff08;}
.nav-button.active::before {left:-1px;width:3px;background:#bba6ff;top:14px;bottom:14px;}
.nav-count {border-radius:7px;background:#ad96ff20;color:#d5c8ff;padding:3px 7px;}
.sidebar-bottom {padding:19px 12px 0;border-top:1px solid #ffffff0c;margin-top:auto;font-size:10px;}
.sidebar-bottom p {margin:14px 0 0;font-size:9px;color:#7e879c;}
.connection-dot {width:6px;height:6px;background:#89d6bb;box-shadow:0 0 0 4px #89d6bb0b;}
.topbar {height:78px;background:#08090db3;border-bottom:1px solid #ffffff08;padding:0 38px;}
.topbar-home {background:#171924;border:1px solid #30313f;border-radius:12px;width:38px;height:42px;}
.topbar-logo {width:22px;height:26px;}
.breadcrumb,#breadcrumb-current {font-size:9px!important;letter-spacing:1.7px;}
.account {font-size:12px;gap:12px;}
.account img {width:34px;height:34px;padding:2px;border:1px solid #7b679b;border-radius:12px;}
#logout {border-color:#30313f;color:#9da5b8;}
.content {max-width:1600px;padding:36px 38px 28px;}
.page-heading {align-items:center;margin-bottom:30px;gap:22px;}
.page-heading h1 {font-size:clamp(27px,2.5vw,38px);font-weight:650;letter-spacing:-1.3px;margin-bottom:9px;}
.page-heading .eyebrow {font-size:8px;letter-spacing:2.8px;color:#ad96ff;}
.page-heading .muted {font-size:12px;line-height:1.7;color:#929bad;}
.page:not([hidden]) {animation:midnight-enter .32s ease-out both;}
.button {border-radius:10px;min-height:42px;padding:11px 17px;background:#1b1e29;border-color:#34394b;color:#d7dce9;font-size:12px;font-weight:600;transition:transform .18s,background .18s,border-color .18s,box-shadow .18s;}
.button.primary {background:linear-gradient(135deg,#c1adff,#9c81ed);border-color:#ccbcff;color:#171123;box-shadow:0 4px 22px #9c81ed18;}
.button.primary:hover {background:linear-gradient(135deg,#d1c1ff,#b69afa);border-color:#dfd4ff;}
.button.danger {background:#ff879810;border-color:#ff879833;color:#ffafbc;}
.button.danger:hover {background:#ff879820;border-color:#ff87985c;}
.button:disabled {transform:none;cursor:not-allowed;box-shadow:none;opacity:.45;}
.text-button {color:#bbaaff;font-size:12px;}
.icon-button {border-radius:10px;color:#b0b8cb;}
.card,.stat {border-radius:18px;background:linear-gradient(145deg,#151720,#101218);border:1px solid #2b2f3d;box-shadow:inset 0 1px 0 #ffffff03,0 8px 25px #00000012;}
.card.padded {padding:27px;}
.card h2,.section-heading h2 {font-size:17px;letter-spacing:-.4px;font-weight:600;}
.card p.muted {font-size:12px;line-height:1.8;}
.hero {min-height:300px;padding:42px;border-radius:22px;border-color:#74618c60;margin-bottom:23px;}
.hero::before {background-image:url('/static/media/patrol.jpg');background-position:75% 55%;}
.hero::after {background:linear-gradient(90deg,#101019f7,#11101bcb 40%,#10101920),linear-gradient(0deg,#08090d99,transparent);}
.hero h2 {font-size:clamp(32px,3vw,46px);letter-spacing:-1.5px;line-height:1.08;font-weight:650;}
.hero .hero-label {font-size:8px;letter-spacing:2.6px;color:#d4c6ff;}
.hero p {font-size:12px;color:#c2bfd3;}
.hero>img {width:58px;height:74px;}
.stats-grid {gap:15px;margin-bottom:22px;}
.stat {padding:23px;min-width:0;}
.stat::before {background:linear-gradient(90deg,transparent,#c7b1ff35,transparent);}
.stat>span {font-size:8px;letter-spacing:1.7px;color:#949eb4;}
.stat strong {font-size:31px;letter-spacing:-1px;color:#e8e7f5;margin:17px 0 9px;}
.stat small {font-size:10px;color:#7f8aa0;line-height:1.7;}
.system-stats strong {font-size:21px;}
.system-strip {padding:17px 0;color:#828ca3;border-color:#ffffff0b;gap:12px;}
.workflow-stats {gap:14px;}
.workflow-stats .card {background:#13151d;border-radius:15px;}
.workflow-stats .card strong {color:#cdbbff;}
.section-heading {margin-top:27px;margin-bottom:16px;}
.toolbar {gap:14px;}
.tabs {padding:5px;border-radius:12px;border:1px solid #2c3040;background:#101219;}
.tabs button {padding:10px 15px;border-radius:8px;font-size:11px;color:#929db4;transition:background .18s,color .18s;}
.tabs button.active {background:#ad96ff22;color:#ded3ff;box-shadow:0 2px 8px #0002;}
.data-table th {padding:17px 21px;background:#191c26;color:#959fb6;letter-spacing:1.6px;font-size:8px;border-color:#292e3e;}
.data-table td {padding:20px 21px;border-color:#252a38;font-size:12px;color:#bcc5d7;line-height:1.6;}
.data-table td strong {color:#e7eaf2;font-size:12px;}
.data-table td small {color:#7f8ca5;font-size:10px;margin-top:6px;}
.data-table tbody tr {transition:background .18s;}
.data-table tbody tr:hover {background:#ad96ff08;}
.table-wrap {scrollbar-width:thin;scrollbar-color:#42415a transparent;}
.badge {border-radius:6px;padding:5px 9px;font-size:10px;background:#ad96ff17;border-color:#ad96ff33;color:#cbbaff;}
.badge.approved,.badge.completed,.badge.assigned,.badge.enabled {background:#89d6bb10;border-color:#89d6bb30;color:#9de2c9;}
.badge.pending,.badge.scheduled,.badge.processing {background:#e6bc7010;border-color:#e6bc7030;color:#e6c68e;}
.badge.rejected,.badge.blocked {background:#ff9fac10;border-color:#ff9fac30;color:#f9aeba;}
input,select,textarea {background:#0c0e15!important;border:1px solid #343a4e!important;border-radius:10px!important;color:#e6eaf5;padding:12px 14px;transition:border-color .18s,box-shadow .18s;}
input::placeholder,textarea::placeholder {color:#66718a;}
input:focus,select:focus,textarea:focus {border-color:#b29af6!important;box-shadow:0 0 0 3px #ad96ff12;}
input[type="checkbox"] {accent-color:#b29af6;}
label {font-size:12px;line-height:1.6;color:#b8c2d7;}
label>input,label>select,label>textarea {margin-top:8px;}
.notice,.feedback {border-radius:13px;border-color:#544769;background:#ad96ff0c;}
.notice {color:#cbbce9;line-height:1.8;padding:16px 19px;}
.notice.error {background:#ff9fac0b;border-color:#ff9fac33;color:#ffb2bf;}
.feedback {box-shadow:0 8px 28px #0002;}
.feedback-success {border-color:#89d6bb40;background:#11221f;}
.feedback-error {border-color:#ff9fac40;background:#271820;}
.empty {padding:50px 25px;}
.empty strong {font-size:15px;color:#d7ddec;}
.empty p {font-size:12px;line-height:1.7;color:#8996b0;}
.info-strip {background:#ad96ff09;border-color:#ad96ff25;padding:20px 24px;border-radius:14px;}
.tool-icon {width:44px;height:44px;border-radius:13px;background:#ad96ff15;border-color:#ad96ff28;color:#cbbaff;}
.tools-grid {gap:20px;}
/* Member workspace: a broad identity card and a balanced two-column layout. */
#shell[data-workspace="profile"] .content {max-width:1320px;}
#page-profile {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;}
#page-profile>.member-section {margin:0;border-top:1px solid var(--border);}
#page-profile>.member-profile-card,#profile-manual-link,#page-profile>.department-gallery {grid-column:1/-1;}
.member-profile-card {padding:30px!important;}
.profile-cover {height:225px;margin:-30px -30px 0;padding:26px 30px;background:linear-gradient(0deg,#13151ef5,transparent 80%),url('/static/media/team.jpg') center 36%/cover;}
.profile-cover span {letter-spacing:2.8px;font-size:8px;}
.profile-summary {padding:25px 0 18px;margin:0 0 14px;background:transparent;border:0;border-radius:0;gap:24px;}
.profile-summary::before {display:none;}
.profile-avatar {width:86px;height:86px;border-radius:22px;border:3px solid #3b354e;box-shadow:0 8px 30px #0003;}
.profile-summary h2 {font-size:28px;letter-spacing:-.9px;margin-bottom:10px;}
.profile-summary .eyebrow {font-size:8px;letter-spacing:2px;color:#9d8dbb;}
.profile-summary .detail-grid {background:#0b0e164d;border:1px solid #303444;border-radius:14px;padding:20px;}
.detail-grid {gap:19px;}
.detail-grid small {color:#7e8ca7;}
.member-profile-card>.toolbar {justify-content:flex-start;margin:22px 0 0;flex-wrap:wrap;}
#profile-manual-link {background:linear-gradient(110deg,#201b31,#12151e);border-color:#66508055;}
#profile-manual-link h2 {color:#e0d5ff;}
.member-note,.answer {border-radius:12px;background:#0e1119;border-color:#2c3344;}
.promotion-grid {gap:13px;}
.promotion-metric {border-radius:13px;background:#0d1019;border-color:#30364a;padding:19px;}
.promotion-metric span {color:#9ca8c1;font-size:11px;}
.promotion-metric strong {font-size:23px;color:#e3dbff;}
.promotion-metric progress {height:6px;accent-color:#b69aff;}
.task-remaining {color:#9ba9c4;}
.department-gallery {margin:0;}
.department-gallery>summary {padding:25px 28px;}
.department-photos {gap:18px;padding:0 28px 28px;}
.department-photos figure {border-color:#303445;border-radius:14px;background:#0c0f16;}
.department-photos figcaption {padding:19px;}
.department-photos figcaption span {color:#ad96ff;}
/* Manual, editors, console and access management share the same surfaces. */
.manual-card {margin-top:0;padding:30px!important;}
.manual-heading {border-color:#303445;}
.manual-book {background:#ad96ff16;border-color:#ad96ff30;color:#c9b7ff;}
.manual-chapter {border-radius:14px;border-color:#303445;background:#11151e;margin-bottom:13px;}
.manual-chapter>summary {padding:22px;}
.manual-chapter[open] {border-color:#8a70ba66;background:#131521;}
.manual-chapter-body {border-color:#303445;padding:24px;}
.manual-code {background:#ad96ff15;color:#cbbaff;border-color:#ad96ff22;}
.embed-editor {background:#10131c;border-color:#34394d;border-radius:14px;padding:23px;}
.builder-field {border-color:#303649;}
.builder-toolbar {gap:8px;}
.code-input,.file-editor-content {background:#090c13!important;border-color:#34394b!important;font-size:13px;line-height:1.8;}
.console-list {background:#0b0e15;border:1px solid #30374b;border-radius:16px;}
.console-event {border-color:#242c3c;padding:17px 20px;}
.console-event strong {color:#bca8ee;}
.console-event pre {color:#bac7df;font-size:12px;line-height:1.8;}
.file-toolbar {gap:8px;}
.file-toolbar .button {font-size:11px;}
/* All review, edit and confirmation dialogs. */
dialog {border:1px solid #45435b;border-radius:22px;background:linear-gradient(150deg,#191b27,#10131b);padding:30px;box-shadow:0 35px 100px #0009;max-height:90svh;color:var(--text);}
dialog[open] {animation:midnight-dialog .22s ease-out;}
dialog::backdrop {background:#02040bcc;backdrop-filter:blur(7px);}
.dialog-heading {padding-bottom:21px;margin-bottom:24px;border-color:#303749;}
.dialog-heading h2 {font-size:25px;letter-spacing:-.7px;}
.dialog-heading .eyebrow {font-size:8px;letter-spacing:2px;color:#ab98cf;}
.dialog-heading .icon-button {display:grid;place-items:center;width:34px;height:34px;border:1px solid #464158;background:#242433;}
.dialog-actions {gap:10px;border-color:#34394b;padding-top:20px;}
.confirmation-dialog {padding:32px;max-width:550px;}
.confirmation-symbol {background:#ad96ff18;border-color:#ad96ff35;color:#c7b4ff;border-radius:15px;}
.confirmation-message {font-size:13px;line-height:1.9;color:#b2bed4;}
#member-dialog {width:min(940px,calc(100vw - 36px));background:#10131c;border-radius:22px;}
#member-dialog>.dialog-heading {padding:35px 32px;background:linear-gradient(90deg,#10121df7,#10121d99),url('/static/media/department.jpg') center 36%/cover;}
#member-dialog>#member-details {background:#171c28;padding:23px;border:1px solid #30384b;border-radius:15px;}
#member-dialog>.member-section {background:#151925;border-color:#30374a;border-radius:15px;padding:22px;}
#member-task-toggle {background:linear-gradient(100deg,#ad96ff1c,#ad96ff08);border-color:#ad96ff38;padding:20px;color:#e1d7fa;}
#member-task-panel .promotion-metric {background:#0e121c;border-color:#30384d;}
#member-task-fields>label {background:#0e121c;border-color:#38425a;}
#member-task-panel {animation:midnight-enter .25s ease-out;}
/* Public front page. */
.login-screen {background-image:linear-gradient(90deg,#08090d8a,#08090dbb 50%,#08090df5),url('/static/media/department.jpg');background-position:center,center 40%;}
.login-brand {font-size:21px;gap:13px;}
.login-brand img {width:36px;height:46px;}
.login-brand small {font-size:8px;color:#b4bad1;}
.scene-copy h2 {font-size:clamp(38px,4.4vw,70px);letter-spacing:-2.7px;line-height:1.05;max-width:730px;}
.scene-kicker {font-size:8px;letter-spacing:3px;color:#ccbafa;}
.scene-copy p {color:#b8bfd3;font-size:13px;line-height:1.9;}
.scene-pills span {background:#111521b0;border-color:#8c79ac40;color:#d3cce4;border-radius:8px;padding:10px 14px;}
.scene-footer {font-size:8px;letter-spacing:3px;color:#9699b3;}
.login-screen .login-card {background:linear-gradient(145deg,#1c1c2bed,#11131bf5);border:1px solid #73708855;border-radius:24px;padding:38px;box-shadow:0 30px 100px #0007;backdrop-filter:blur(20px);}
.login-card h1 {font-size:35px;letter-spacing:-1.1px;line-height:1.12;}
.login-logo {width:49px;height:59px;}
.login-intro>.muted {font-size:13px;color:#a4adc5;}
.login-intro #login-link {min-height:49px;border-radius:11px;margin:20px 0;}
.front-community {border-color:#ffffff10;}
.front-community .button {background:#ffffff04;border-color:#52526655;color:#c7cce0;font-size:10px;}
.access-denied-icon {background:#ff9fac10;border-color:#ff9fac30;color:#ffb5c1;}
.page-footer {margin-top:38px;border-color:#ffffff0a;padding-top:22px;font-size:8px;letter-spacing:2px;color:#707e99;}
.loading {color:#c5b3f4;}
.loading:not([hidden])::before {content:"";display:inline-block;width:12px;height:12px;border:2px solid #ad96ff30;border-top-color:#cab7ff;border-radius:50%;margin-right:10px;vertical-align:middle;animation:midnight-spin .8s linear infinite;}
@keyframes midnight-enter {from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
@keyframes midnight-dialog {from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes midnight-spin {to{transform:rotate(360deg)}}
@media(hover:hover) {
  .nav-button:hover {background:#ffffff05;color:#f2edff;transform:translateX(2px);}
  .button:not(:disabled):hover {transform:translateY(-1px);box-shadow:0 5px 15px #0003;}
  .button:not(:disabled):active {transform:translateY(0);}
  .stat {transition:border-color .2s,transform .2s;}
  .stat:hover {border-color:#ad96ff55;transform:translateY(-2px);}
  .department-photos img {transition:transform .4s;}
  .department-photos figure:hover img {transform:scale(1.025);}
}
@media(max-width:1150px) {
  .sidebar {width:215px;left:10px;top:10px;bottom:10px;}
  .shell>main {margin-left:235px;}
  .content {padding:28px;}.topbar {padding:0 28px;}
  .brand {font-size:18px;padding-inline:8px;}.brand img {width:30px;}
  .nav-button {font-size:11px;padding:11px 10px;gap:9px;}
  .stats-grid {grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:900px) {
  .login-screen {background-attachment:scroll;}
  .login-screen .login-card {padding:32px;}
  #page-profile {grid-template-columns:1fr;}
  .profile-summary .detail-grid {min-width:100%;}
}
@media(max-width:760px) {
  .sidebar {position:sticky;inset:auto;top:0;width:100%;border-radius:0;border:0;border-bottom:1px solid #333343;padding:14px 16px 8px;background:#10121bf5;box-shadow:0 6px 20px #0002;}
  .brand {font-size:17px;padding:0 0 13px;gap:10px;}.brand img {width:26px;height:32px;}
  .brand small {font-size:6px;letter-spacing:1.8px;}
  .sidebar nav {gap:7px;padding-bottom:6px;}.nav-button {border-radius:9px;min-height:39px;padding:10px 13px;font-size:11px;margin:0;}
  .shell>main {margin-left:0;}.content {padding:25px 16px;}
  .topbar {padding:12px 16px;height:auto;min-height:66px;gap:12px;}
  .topbar-home {width:32px;height:36px;min-width:32px;min-height:36px;}.topbar-logo {width:19px;height:23px;}
  .account {font-size:10px;gap:8px;}.account img {width:27px;height:27px;border-radius:9px;}
  .page-heading {margin-bottom:23px;align-items:flex-start;flex-wrap:wrap;}.page-heading h1 {font-size:30px;}
  .workspace-actions {gap:8px;width:auto;flex-wrap:wrap;}
  .hero {padding:29px 25px;min-height:265px;border-radius:18px;}.hero h2 {font-size:35px;}.hero-copy {max-width:100%;}.hero>img {display:none;}
  .hero::after {background:linear-gradient(90deg,#101019ec,#10101977),linear-gradient(0deg,#08090d99,transparent);}
  .card.padded {padding:21px;}.stat {padding:19px;border-radius:15px;}.stat strong {font-size:27px;}.system-stats strong {font-size:19px;}
  .data-table th,.data-table td {padding:16px;}.data-table th {font-size:8px;}
  .toolbar {flex-wrap:wrap;}.tabs {max-width:100%;overflow-x:auto;}.tabs button {white-space:nowrap;padding:9px 12px;}
  input,select,textarea {font-size:16px;}.button {min-height:44px;padding:11px 14px;}
  .member-profile-card {padding:22px!important;}.profile-cover {margin:-22px -22px 0;height:175px;padding:22px;}
  .profile-summary {padding-top:20px;gap:17px;}.profile-summary h2 {font-size:25px;}.profile-avatar {width:68px;height:68px;border-radius:19px;}
  .profile-summary .detail-grid {padding:17px;}.member-profile-card>.toolbar {gap:10px;}
  #page-profile {gap:18px;}.manual-card {padding:21px!important;}.manual-chapter>summary {padding:17px;}
  dialog {padding:23px;border-radius:18px;max-width:calc(100vw - 24px);}.dialog-heading h2 {font-size:23px;}
  #member-dialog {width:calc(100vw - 20px);max-width:calc(100vw - 20px);padding:0;}
  #member-dialog>.dialog-heading {padding:26px 21px;}#member-dialog>#member-details,#member-dialog>.member-section,#member-dialog>.dialog-actions,#member-dialog>p {margin:18px;}
  #member-dialog>.member-section {padding:17px;}#member-task-fields {grid-template-columns:1fr;}
  .login-screen .login-card {padding:29px 24px;border-radius:20px;}.login-card h1 {font-size:30px;}
  .login-brand {font-size:18px;}.login-brand img {width:29px;height:38px;}.login-brand small {font-size:7px;}
  .department-gallery>summary {padding:21px;}.department-photos {padding:0 21px 21px;}
}
@media(max-width:440px) {
  .stats-grid {gap:10px;}.stat {padding:16px;}.stat>span {font-size:7px;letter-spacing:1px;}.stat small {font-size:9px;}
  .page-heading h1 {font-size:27px;}.hero h2 {font-size:31px;}
  .profile-cover span {font-size:7px;letter-spacing:1.6px;}
  .member-profile-card>.toolbar {display:grid;grid-template-columns:1fr;}
  .access-community-links {grid-template-columns:1fr;}
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {animation:none!important;transition:none!important;scroll-behavior:auto!important;}
}
input[type="checkbox"] {padding:0!important;min-height:0;}
.workflow-stats {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr));}
@media(max-width:600px) {
  .builder-grid,.tools-grid {grid-template-columns:1fr;}
  .dialog-actions {flex-wrap:wrap;}
  .console-filters {flex-wrap:wrap;}
  .login-screen .login-card {min-width:0;}
}
/* Profile Studio: clear identity, live service summary, and focused content. */
#page-profile {grid-template-columns:minmax(0,1.25fr) minmax(300px,.85fr);gap:24px;align-items:start;}
#page-profile>.member-profile-card {position:relative;isolation:isolate;grid-column:1/-1;min-height:390px;padding:0 34px 30px!important;border-color:#87749a55;}
#page-profile .profile-cover {position:absolute;z-index:-2;inset:0;margin:0;height:auto;align-items:flex-start;padding:25px 34px;background:linear-gradient(90deg,#10121aee 5%,#10121ac9 50%,#10121a44),linear-gradient(0deg,#11141dfc 3%,#11141d11 85%),url('/static/media/department.jpg') center 37%/cover;}
.profile-cover span:last-child {border:1px solid #d1c0f933;border-radius:30px;padding:4px 10px;background:#11131b88;}
.profile-welcome {max-width:520px;margin:80px 0 25px;}
.profile-welcome .eyebrow {font-size:8px;letter-spacing:2.8px;color:#b6a2dd;}
.profile-welcome h2 {font-size:clamp(30px,3.7vw,49px);letter-spacing:-1.8px;line-height:1.08;margin-bottom:13px;}
.profile-welcome>p:last-child {font-size:12px;color:#b1b9cd;line-height:1.8;}
#page-profile .profile-summary {padding:22px;background:#10131cbd;border:1px solid #53556855;border-radius:16px;margin:0 0 16px;backdrop-filter:blur(14px);}
#page-profile .profile-summary h2 {font-size:24px;}
#page-profile .profile-summary .detail-grid {border:0;border-left:1px solid #ffffff13;border-radius:0;background:transparent;padding:0 0 0 22px;}
#page-profile .profile-avatar {width:72px;height:72px;border-radius:19px;}
.profile-pulse {grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;}
.profile-pulse article {position:relative;overflow:hidden;padding:22px 24px;background:linear-gradient(135deg,#1c1b2b,#121620);border:1px solid #343748;border-radius:16px;}
.profile-pulse article::after {content:"";position:absolute;width:65px;height:65px;right:-25px;top:-28px;border:16px solid #bba6ff09;border-radius:50%;}
.profile-pulse span {display:block;font-size:8px;letter-spacing:1.7px;color:#a4a9c5;}
.profile-pulse strong {display:block;margin:14px 0 7px;font-size:29px;font-weight:600;letter-spacing:-1px;color:#e3d9ff;}
.profile-pulse small {font-size:10px;color:#7f8da8;line-height:1.7;}
#page-profile .card>h2,#page-profile .toolbar h2 {font-size:18px;}
#page-profile>.card:not(.member-profile-card) {border-top:2px solid #b9a2ee33;}
#page-profile>.profile-rank-card {grid-column:1/-1;background:linear-gradient(115deg,#191928,#11151e);}
#page-profile .promotion-grid {grid-template-columns:repeat(auto-fit,minmax(185px,1fr));}
#page-profile>.card,#page-profile>.profile-pulse {animation:studio-arrive .4s both;}
#page-profile>.profile-pulse {animation-delay:.05s;}
#page-profile>#profile-manual-link {animation-delay:.08s;}
#page-profile>.profile-rank-card {animation-delay:.1s;}
#profile-manual-link .toolbar {margin-bottom:0;}
/* Carry the refined visual rhythm through all staff pages. */
.page-heading {padding-bottom:23px;border-bottom:1px solid #ffffff0b;}
.page-heading h1 {background:linear-gradient(110deg,#faf9ff,#c9bbdf);background-clip:text;-webkit-background-clip:text;color:transparent;}
.nav-button.active {box-shadow:inset 0 0 20px #bba6ff05,0 4px 15px #0001;}
.card {transition:border-color .22s,box-shadow .22s;}
.section-heading h2 {display:flex;align-items:center;gap:10px;}
.section-heading h2::before {content:"";width:4px;height:16px;border-radius:3px;background:linear-gradient(#c8b4ff,#8765be);}
.hero {border-radius:24px;}
.tools-grid>.card {border-top:2px solid #ad96ff44;}
.dialog-heading {position:relative;}
.dialog-heading::after {content:"";position:absolute;bottom:0;left:0;width:64px;height:1px;background:#bd9fec;}
#member-dialog>.dialog-heading::after {left:32px;}
#members-list .data-table td:first-child strong {font-size:13px;color:#e5dcf7;}
.console-list {box-shadow:inset 0 0 50px #0002;}
.empty {background:radial-gradient(ellipse at 50% 0,#ad96ff07,transparent 65%);}
@keyframes studio-arrive {from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(hover:hover) {
 .profile-pulse article {transition:border-color .2s,transform .2s;}
 .profile-pulse article:hover {border-color:#b69aee77;transform:translateY(-3px);}
 .card:hover {border-color:#51506a;}
}
@media(max-width:1000px) {
 #page-profile {grid-template-columns:1fr;}
 #page-profile .profile-summary .detail-grid {min-width:100%;border-left:0;border-top:1px solid #ffffff10;padding:19px 0 0;}
}
@media(max-width:760px) {
 #page-profile {gap:18px;}
 #page-profile>.member-profile-card {padding:0 22px 23px!important;}
 #page-profile .profile-cover {padding:22px;background-position:center,center,60% 40%;}
 .profile-welcome {margin-top:80px;margin-bottom:24px;}
 .profile-welcome h2 {font-size:37px;}
 #page-profile .profile-summary {padding:17px;gap:16px;}
 #page-profile .profile-summary h2 {font-size:23px;}
 .profile-pulse {grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;}
 .profile-pulse article {padding:18px;}.profile-pulse strong {font-size:25px;}
 .profile-pulse span {font-size:7px;letter-spacing:1px;}
 .page-heading {padding-bottom:18px;}
 #page-profile .promotion-grid {grid-template-columns:1fr;}
}
@media(prefers-reduced-motion:reduce) {*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important;}}
/* Decoration only in the marked outer space of My Profile. */
#shell[data-workspace="profile"]:has(#page-profile:not([hidden]))>main {
  position:relative;isolation:isolate;
}
#shell[data-workspace="profile"]:has(#page-profile:not([hidden]))>main::before {
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(ellipse 150px 65% at 0% 45%,#a07be51c,transparent 90%),radial-gradient(ellipse 150px 65% at 100% 55%,#8c73da1c,transparent 90%),radial-gradient(ellipse 45% 160px at 50% 0%,#ab8cf111,transparent);
  animation:profile-edge-glow 7s ease-in-out infinite alternate;
}
#shell[data-workspace="profile"]:has(#page-profile:not([hidden]))>main::after {
  content:"";position:fixed;inset:100px 0 35px;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,transparent,#ad96ff35 35%,#ad96ff10 65%,transparent) 36px center/1px 80% no-repeat,linear-gradient(180deg,transparent,#ad96ff10 25%,#ad96ff35 65%,transparent) calc(100% - 36px) center/1px 80% no-repeat,radial-gradient(circle,#d6c3ff70 0 2px,transparent 3px) 33px 24%/7px 7px no-repeat,radial-gradient(circle,#d6c3ff70 0 2px,transparent 3px) calc(100% - 33px) 75%/7px 7px no-repeat;
}
@keyframes profile-edge-glow {from{opacity:.55}to{opacity:1}}
@media(max-width:760px) {
  #shell[data-workspace="profile"]:has(#page-profile:not([hidden]))>main::after {display:none;}
  #shell[data-workspace="profile"]:has(#page-profile:not([hidden]))>main::before {opacity:.5;animation:none;}
}
@media(prefers-reduced-motion:reduce) {
  #shell[data-workspace="profile"]:has(#page-profile:not([hidden]))>main::before {animation:none;opacity:.7;}
}
/* Keep Notifications aligned with its adjacent card. */
#page-profile>.member-section:has(#profile-notifications) {align-self:stretch;position:relative;overflow:hidden;}
#page-profile>.member-section:has(#profile-notifications)::after {content:"";position:absolute;pointer-events:none;width:110px;height:110px;right:-35px;bottom:-45px;border:1px solid #bca7ee12;border-radius:26px;transform:rotate(25deg);box-shadow:0 0 0 20px #bca7ee03,0 0 0 40px #bca7ee02;}

