.admin-profile-form select,
.admin-add-card select {
  color: #f7f3e9;
  background: #17231f;
  color-scheme: dark;
}

.admin-profile-form select option,
.admin-add-card select option {
  color: #f7f3e9;
  background: #17231f;
}

.admin-profile-form select option:disabled,
.admin-add-card select option:disabled {
  color: #9ba7a2;
}

/* Topbar account controls load last so module styles cannot flatten them. */
.topbar-tools { gap: 8px; }
.command-trigger,
.topbar-profile,
.topbar-logout {
  min-height: 46px;
  border-color: rgba(255,255,255,.12);
  background: linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.035));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055),0 8px 22px rgba(0,0,0,.12);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.command-trigger { min-width:206px; border-radius:14px; padding-inline:14px 10px; }
.command-trigger svg { color:rgba(255,255,255,.78); }
.command-trigger kbd { border-color:rgba(255,255,255,.14); background:rgba(0,0,0,.22); }
.topbar-profile {
  gap:11px;
  max-width:310px;
  padding:4px 15px 4px 5px;
  border-radius:999px;
  color:var(--paper-strong);
  transition:color 180ms ease,border-color 180ms ease,background 180ms ease,box-shadow 180ms ease,transform 180ms ease;
}
.topbar-profile>span {
  width:36px;
  height:36px;
  border:1px solid rgba(255,255,255,.28);
  color:#12352d;
  background:linear-gradient(145deg,#91dfcb,#5ebda7);
  font-size:.72rem;
  letter-spacing:.02em;
  box-shadow:0 4px 12px rgba(25,115,96,.28);
}
.topbar-profile>span.has-profile-avatar,
.topbar-profile-menu-head>span.has-profile-avatar,
.own-profile-head>span.has-profile-avatar {
  background-color:transparent!important;
  background-position:center!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
  color:transparent!important;
}
body[data-view="profile"] .own-profile-head>span.has-profile-initials{
  color:var(--uis-head)!important;
  border-color:color-mix(in srgb,var(--uis-accent) 72%,var(--uis-line-strong))!important;
  background:var(--uis-accent)!important;
  box-shadow:inset 0 1px color-mix(in srgb,var(--uis-head) 18%,transparent),0 7px 18px color-mix(in srgb,var(--uis-accent) 24%,transparent)!important;
  font-weight:950!important;
  text-shadow:none!important
}
.profile-avatar-form{margin:22px 0 28px;padding:24px 0 0!important;border:0!important;border-top:1px solid color-mix(in srgb,var(--theme-glass-text) 18%,transparent)!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.profile-avatar-grid{display:grid;grid-template-columns:repeat(7,minmax(82px,1fr));gap:12px;margin-top:18px}
.profile-avatar-option{position:relative;display:grid;justify-items:center;gap:8px;padding:12px 8px;border:1px solid color-mix(in srgb,var(--theme-glass-text) 14%,transparent);border-radius:16px;background:color-mix(in srgb,var(--theme-glass-text) 4%,transparent);cursor:pointer;transition:border-color .18s ease,background .18s ease,transform .18s ease}
.profile-avatar-option:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--theme-glass-accent) 55%,transparent)}
.profile-avatar-option:has(input:checked){border-color:var(--theme-glass-accent);background:color-mix(in srgb,var(--theme-glass-accent) 13%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--theme-glass-accent) 12%,transparent)}
.profile-avatar-option input{position:absolute;opacity:0;pointer-events:none}
.profile-avatar-option>span{display:grid;width:72px;height:72px;overflow:hidden;place-items:center;border:2px solid color-mix(in srgb,var(--theme-glass-text) 25%,transparent);border-radius:18px;color:var(--theme-glass-text);background:color-mix(in srgb,var(--theme-glass-accent) 25%,var(--theme-body-base));font-size:.8rem;font-weight:900}
.profile-avatar-option img{display:block;width:100%;height:100%;object-fit:cover}
.profile-avatar-option strong{font-size:.66rem;text-align:center}
.topbar-profile>strong {
  display:grid;
  gap:1px;
  min-width:0;
  text-align:left;
  line-height:1.1;
}
.topbar-profile>strong>span {
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:.78rem;
  font-weight:900;
  letter-spacing:-.01em;
}
.topbar-profile>strong>small {
  color:rgba(255,255,255,.62);
  font-size:.64rem;
  font-weight:650;
}
.topbar-profile:hover,
.topbar-profile:focus-visible {
  border-color:rgba(121,215,192,.42);
  background:linear-gradient(145deg,rgba(121,215,192,.13),rgba(255,255,255,.055));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 11px 26px rgba(0,0,0,.18);
  outline:none;
  transform:translateY(-1px);
}
.topbar-logout { width:46px; height:46px; border-radius:14px; }
.topbar-logout:hover,
.topbar-logout:focus-visible {
  color:#fff;
  border-color:rgba(223,105,121,.48);
  background:linear-gradient(145deg,rgba(143,32,51,.34),rgba(143,32,51,.16));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 10px 24px rgba(80,12,24,.22);
  outline:none;
}

@media (max-width:1240px) and (min-width:861px) {
  .command-trigger { min-width:46px; width:46px; padding:0; }
  .command-trigger span,.command-trigger kbd { display:none; }
}

@media (max-width:860px) {
  .topbar-tools { gap:6px; }
  .command-trigger,.topbar-profile {
    width:44px;
    min-width:44px;
    min-height:44px;
    height:44px;
    padding:0;
    justify-content:center;
  }
  .command-trigger { grid-template-columns:1fr; place-items:center; border-radius:13px; }
  .command-trigger span,.command-trigger kbd,.topbar-profile>strong { display:none; }
  .topbar-profile>span { width:34px; height:34px; }
  .profile-avatar-grid{grid-template-columns:repeat(4,minmax(68px,1fr));gap:9px}
  .profile-avatar-option>span{width:62px;height:62px;border-radius:15px}

  body[data-view="board"] .board-surface>.section-heading,
  body[data-view="board"] .board-meetings>.section-heading {
    min-height:64px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:10px 16px;
  }

  body[data-view="board"] .board-surface>.section-heading .section-title,
  body[data-view="board"] .board-meetings>.section-heading .section-title {
    min-width:0;
    flex:1 1 auto;
  }

  body[data-view="board"] .board-surface>.section-heading h3,
  body[data-view="board"] .board-meetings>.section-heading h3 {
    margin:0;
    font-size:clamp(1.05rem,5.8vw,1.35rem);
    line-height:1.05;
    white-space:nowrap;
  }

  body[data-view="board"] .board-surface>.section-heading .section-eyebrow {
    flex:0 0 auto;
    margin:0;
    white-space:nowrap;
  }
}
@media(max-width:460px){
  .profile-avatar-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* Kompaktnija i jasnija konstrukcija stranice Moj profil. */
body[data-view="profile"] .profile-page{width:min(1400px,100%);padding:clamp(20px,2.2vw,30px);border-radius:22px}
body[data-view="profile"] .topbar-secondary{display:grid;grid-template-columns:minmax(180px,auto) minmax(0,1fr);align-items:center;gap:18px;padding:8px clamp(18px,3vw,58px)}
body[data-view="profile"] .topbar-secondary>.topbar-title{display:block;margin:0}
.profile-topbar-summary{display:grid;width:100%;grid-template-columns:minmax(280px,1.3fr) minmax(150px,.65fr) minmax(230px,1fr) minmax(210px,.85fr);align-items:stretch;gap:10px;margin:0}
body[data-view="profile"] .profile-topbar-summary .profile-page-hero{min-height:76px;margin:0;padding:10px 13px!important;border-radius:15px!important}
body[data-view="profile"] .profile-topbar-summary .profile-hero-copy{display:none}
body[data-view="profile"] .profile-topbar-summary>div,
body[data-view="profile"] .profile-topbar-summary>.own-profile-pin{box-sizing:border-box;min-width:0;min-height:76px;padding:10px 13px!important;border-radius:15px!important}
body[data-view="profile"] .profile-topbar-summary>div{display:grid;align-content:center;gap:5px}
body[data-view="profile"] .profile-topbar-summary .profile-page-hero .own-profile-head{gap:11px}
body[data-view="profile"] .profile-topbar-summary .profile-page-hero .own-profile-head>span{width:45px;height:45px;border-radius:13px}
body[data-view="profile"] .profile-topbar-summary .profile-page-hero .own-profile-head h3{margin:1px 0 4px;font-size:1.12rem}
body[data-view="profile"] .profile-topbar-summary .profile-role-line{gap:7px}
body[data-view="profile"] .profile-topbar-summary .profile-role-badge{min-height:22px;padding:2px 7px;font-size:.58rem!important}
body[data-view="profile"] .profile-topbar-summary .profile-work-position{font-size:.59rem}
body[data-view="profile"] .profile-topbar-summary>div>small,
body[data-view="profile"] .profile-topbar-summary>.own-profile-pin>small,
body[data-view="profile"] .profile-topbar-summary .own-profile-pin small{font-size:.58rem;font-weight:800;letter-spacing:.055em;text-transform:uppercase}
body[data-view="profile"] .profile-topbar-summary .own-profile-grid strong{font-size:1rem;line-height:1.15}
body[data-view="profile"] .profile-topbar-summary .own-profile-pin strong{font-size:.94rem;line-height:1.1}
body[data-view="profile"] .profile-topbar-summary #revealOwnPin{min-height:32px;padding:0 10px;font-size:.62rem}
body[data-view="profile"] .profile-topbar-summary .own-profile-pin-notice{grid-column:1/-1}
body[data-view="profile"] .profile-topbar-summary.is-pin-revealed>.own-profile-pin{grid-column:span 1}
body[data-view="profile"] .profile-topbar-summary.is-pin-revealed>.own-profile-pin-notice{display:grid;grid-column:span 3;min-height:76px;margin:0;padding:10px 14px}
body[data-view="profile"] .profile-page>.profile-preferences{margin-top:0}
body[data-view="profile"] .profile-page-hero{min-height:112px;gap:22px;padding:18px 20px!important}
body[data-view="profile"] .profile-page-hero .own-profile-head{display:flex;align-items:center;gap:16px}
body[data-view="profile"] .profile-page-hero .own-profile-head>span{width:60px;height:60px;border-radius:17px;font-size:.94rem}
body[data-view="profile"] .profile-page-hero .own-profile-head h3{margin:3px 0 7px;font-size:clamp(1.42rem,2.3vw,1.82rem);line-height:1.05;letter-spacing:-.025em}
body[data-view="profile"] .profile-role-badge{display:inline-flex!important;width:max-content;align-items:center;min-height:27px;margin:0;padding:4px 9px;border:1px solid color-mix(in srgb,var(--ui-panel-accent,#79d7c0) 34%,transparent);border-radius:999px;color:var(--ui-panel-accent,#79d7c0)!important;background:color-mix(in srgb,var(--ui-panel-accent,#79d7c0) 12%,transparent);font-size:.68rem!important;font-weight:850;letter-spacing:.035em}
body[data-view="profile"] .profile-role-line{display:flex;align-items:center;gap:11px;min-width:0;flex-wrap:wrap}
body[data-view="profile"] .profile-work-position{color:var(--ui-panel-muted,rgba(247,244,237,.68));font-size:.7rem;line-height:1.35}
body[data-view="profile"] .profile-work-position strong{color:var(--ui-panel-text,#f7f4ed);font-weight:800}
body[data-view="profile"] .profile-hero-copy{display:grid;gap:4px;max-width:330px!important;text-align:right}
body[data-view="profile"] .profile-hero-copy strong{color:var(--ui-panel-text,#f7f4ed)!important;font-size:.82rem}
body[data-view="profile"] .profile-hero-copy span{color:var(--ui-panel-muted,rgba(247,244,237,.68));font-size:.74rem;line-height:1.45}

body[data-view="profile"] .profile-account-overview{position:relative;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(270px,.65fr);gap:12px;margin-top:14px;animation:profileSectionEnter 480ms 150ms cubic-bezier(.2,.8,.2,1) both;transition:grid-template-columns .48s cubic-bezier(.2,.8,.2,1)}
body[data-view="profile"] .profile-account-overview .own-profile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;min-width:0;max-height:120px;margin:0;overflow:hidden;opacity:1;transform:none;transition:opacity .24s ease,transform .38s cubic-bezier(.2,.75,.25,1),max-height .38s cubic-bezier(.2,.75,.25,1),visibility 0s}
body[data-view="profile"] .profile-account-overview.is-pin-revealed{grid-template-columns:minmax(0,1fr)}
body[data-view="profile"] .profile-account-overview.is-pin-revealed .own-profile-grid{position:absolute;inset:0 auto auto 0;width:64%;max-height:0;visibility:hidden;opacity:0;transform:translateX(-18px) scale(.985);pointer-events:none;transition:opacity .24s ease,transform .38s cubic-bezier(.2,.8,.2,1),max-height .42s ease,visibility 0s .42s}
body[data-view="profile"] .profile-account-overview .own-profile-grid>div,
body[data-view="profile"] .profile-account-overview .own-profile-pin{min-height:78px;margin:0;padding:14px 16px!important;border-radius:15px!important}
body[data-view="profile"] .profile-account-overview .own-profile-grid>div{display:grid;align-content:center;gap:5px}
body[data-view="profile"] .profile-account-overview :is(.own-profile-grid>div,.own-profile-pin)>small,
body[data-view="profile"] .profile-account-overview .own-profile-pin small{font-size:.62rem;font-weight:800;letter-spacing:.055em;text-transform:uppercase}
body[data-view="profile"] .profile-account-overview .own-profile-grid strong{font-size:1.08rem;line-height:1.15}
body[data-view="profile"] .profile-account-overview .own-profile-pin{display:flex;align-items:center;justify-content:space-between;gap:12px}
body[data-view="profile"] .profile-account-overview .own-profile-pin{position:relative;overflow:visible}
body[data-view="profile"] .profile-account-overview .own-profile-pin>span{display:grid;gap:5px}
body[data-view="profile"] .profile-account-overview .own-profile-pin strong{font-size:1.05rem;letter-spacing:.12em}
body[data-view="profile"] .profile-account-overview.is-pin-revealed .own-profile-pin{grid-column:1/-1;width:100%;animation:profilePinExpand .48s cubic-bezier(.2,.8,.2,1) both}
body[data-view="profile"] #ownProfilePin{transition:letter-spacing .3s ease,color .3s ease,transform .3s ease}
body[data-view="profile"] #ownProfilePin.is-revealed{color:var(--theme-glass-accent);letter-spacing:.18em;transform:translateY(-1px)}
body[data-view="profile"] .own-profile-pin-notice{display:grid;grid-column:1/-1;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:16px;margin:0;padding:12px 15px;border:1px solid color-mix(in srgb,var(--theme-glass-accent) 34%,transparent);border-radius:13px;background:color-mix(in srgb,var(--theme-glass-accent) 7%,transparent);animation:profilePinNoticeIn .22s cubic-bezier(.2,.75,.25,1) both}
body[data-view="profile"] .own-profile-pin-notice[hidden]{display:none}
body[data-view="profile"] .own-profile-pin-notice strong{display:block;margin:0;color:var(--theme-glass-text)!important;font-size:.7rem!important;letter-spacing:.04em!important;text-transform:uppercase;white-space:nowrap}
body[data-view="profile"] .own-profile-pin-notice p{margin:0;color:var(--theme-glass-muted);font-size:.68rem;line-height:1.48}
body[data-view="profile"] .own-profile-pin-notice.is-hiding{animation:profilePinNoticeOut .26s cubic-bezier(.4,0,1,1) both}
@keyframes profilePinExpand{from{opacity:.7;transform:translateX(12px) scale(.99)}to{opacity:1;transform:none}}
@keyframes profilePinNoticeIn{from{opacity:0;transform:translateY(10px) scale(.99)}to{opacity:1;transform:none}}
@keyframes profilePinNoticeOut{from{opacity:1;transform:none}to{opacity:0;transform:translateY(-6px) scale(.99)}}
@media(max-width:620px){
  body[data-view="profile"] .profile-account-overview{grid-template-columns:1fr}
  body[data-view="profile"] .profile-account-overview.is-pin-revealed{grid-template-columns:1fr}
  body[data-view="profile"] .own-profile-pin-notice{grid-template-columns:1fr;gap:5px;padding:12px 13px}
  body[data-view="profile"] .own-profile-pin-notice strong{font-size:.66rem!important;white-space:normal}
  body[data-view="profile"] .own-profile-pin-notice p{font-size:.64rem;line-height:1.5}
}
@media(prefers-reduced-motion:reduce){body[data-view="profile"] .own-profile-pin-notice{animation:none}body[data-view="profile"] .profile-account-overview,body[data-view="profile"] .profile-account-overview .own-profile-grid{transition:none}}
body[data-view="profile"] .profile-account-overview #revealOwnPin{min-height:38px;padding:0 12px;border-radius:10px;font-size:.73rem}

body[data-view="profile"] .profile-settings-title{display:flex;align-items:end;justify-content:space-between;gap:22px;margin:24px 2px 12px;padding-bottom:12px;border-bottom:1px solid var(--ui-panel-line,rgba(255,255,255,.12))}
body[data-view="profile"] .profile-settings-title>div{display:grid;gap:3px}
body[data-view="profile"] .profile-settings-title span{color:var(--ui-panel-accent,#79d7c0);font-size:.62rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
body[data-view="profile"] .profile-settings-title h4{margin:0;font-size:1.14rem;letter-spacing:-.015em}
body[data-view="profile"] .profile-settings-title p{max-width:440px;margin:0;color:var(--ui-panel-muted,rgba(247,244,237,.66));font-size:.72rem;text-align:right}
body[data-view="profile"] .profile-settings-layout{gap:14px;margin-top:0}
body[data-view="profile"] .profile-settings-layout .profile-theme-form,
body[data-view="profile"] .profile-animation-form,
body[data-view="profile"] .profile-material-form{padding:17px!important;border-radius:16px!important}
body[data-view="profile"] .profile-animation-form{margin-top:14px}
body[data-view="profile"] .profile-material-form{margin-top:14px}
body[data-view="profile"] .profile-theme-heading{margin-bottom:2px}
body[data-view="profile"] .profile-theme-heading>small{font-size:.66rem;line-height:1.4}

@media(max-width:760px){
  body[data-view="profile"] .profile-page-hero{min-height:0;align-items:flex-start;flex-direction:column;padding:16px!important}
  body[data-view="profile"] .profile-page-hero .own-profile-head>span{width:52px;height:52px;border-radius:15px}
  body[data-view="profile"] .profile-role-line{align-items:flex-start;flex-direction:column;gap:6px}
  body[data-view="profile"] .profile-hero-copy{gap:2px;text-align:left}
  body[data-view="profile"] .profile-account-overview{grid-template-columns:1fr}
  body[data-view="profile"] .profile-account-overview .own-profile-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  body[data-view="profile"] .profile-settings-title{align-items:flex-start;flex-direction:column;gap:5px;margin-top:20px}
  body[data-view="profile"] .profile-settings-title p{text-align:left}
}
@media(max-width:480px){
  body[data-view="profile"] .profile-account-overview .own-profile-grid{grid-template-columns:1fr}
  body[data-view="profile"] .profile-account-overview .own-profile-grid>div,
  body[data-view="profile"] .profile-account-overview .own-profile-pin{min-height:70px}
}

@media (max-width:390px) {
  .topbar-primary { padding-inline:8px; }
  .topbar-tools { gap:5px; }
}

/* Per-user interface themes: independent from seasonal/login themes. */
body[data-interface-theme="atelier"] {
  --ui-header: linear-gradient(100deg,#081713 0%,#10241f 58%,#181a18 100%);
  --ui-content: #f1efe9;
  --ui-table: #fffdfa;
  --ui-table-head: #e4e0d7;
  --ui-table-border: #d7d2c7;
  --ui-ink: #232825;
  --ui-surface-themed:linear-gradient(145deg,rgba(16,54,45,.92),rgba(35,37,33,.9) 58%,rgba(77,31,44,.86));
  --ui-surface-border:rgba(126,218,196,.25);
  --toast-surface:rgba(255,253,248,.97);
  --toast-ink:#18312b;
  --toast-muted:#65706b;
  --toast-border:rgba(40,121,103,.22);
  --toast-accent:#287967;
  --toast-accent-soft:#dceee8;
  --toast-shadow:rgba(5,39,31,.25);
}
body[data-interface-theme="graphite"] {
  --ui-header: linear-gradient(105deg,#111418,#242a30 62%,#191d21);
  --ui-content: #e9edf0;
  --ui-table: #f8fafb;
  --ui-table-head: #dce2e6;
  --ui-table-border: #cbd3d8;
  --ui-ink: #1d252b;
  --ui-surface-themed:linear-gradient(145deg,rgba(35,42,48,.95),rgba(24,29,34,.93) 58%,rgba(51,55,61,.9));
  --ui-surface-border:rgba(190,205,214,.23);
  --toast-surface:rgba(247,249,251,.97);
  --toast-ink:#20282f;
  --toast-muted:#66717a;
  --toast-border:rgba(77,98,113,.24);
  --toast-accent:#526b7c;
  --toast-accent-soft:#e0e7eb;
  --toast-shadow:rgba(20,29,36,.28);
}
body[data-interface-theme="navy"] {
  --ui-header: linear-gradient(105deg,#07182a,#102f4c 62%,#0b2238);
  --ui-content: #e8eef4;
  --ui-table: #f8fbfe;
  --ui-table-head: #d5e1eb;
  --ui-table-border: #c2d0dc;
  --ui-ink: #14283a;
  --ui-surface-themed:linear-gradient(145deg,rgba(12,50,78,.94),rgba(15,36,57,.93) 58%,rgba(31,50,75,.9));
  --ui-surface-border:rgba(143,193,230,.25);
  --toast-surface:rgba(245,249,253,.97);
  --toast-ink:#102b43;
  --toast-muted:#607487;
  --toast-border:rgba(36,97,143,.24);
  --toast-accent:#24618f;
  --toast-accent-soft:#dceaf5;
  --toast-shadow:rgba(4,34,59,.3);
}
body[data-interface-theme="paper"] {
  --ui-header: linear-gradient(105deg,#27251f,#454037 62%,#302d27);
  --ui-content: #faf8f2;
  --ui-table: #ffffff;
  --ui-table-head: #eee9dd;
  --ui-table-border: #ddd5c6;
  --ui-ink: #292721;
  --ui-surface-themed:linear-gradient(145deg,rgba(70,64,53,.94),rgba(43,40,34,.93) 58%,rgba(82,70,51,.9));
  --ui-surface-border:rgba(226,206,164,.25);
  --toast-surface:rgba(255,253,247,.98);
  --toast-ink:#332d23;
  --toast-muted:#756d60;
  --toast-border:rgba(138,106,53,.23);
  --toast-accent:#8a6a35;
  --toast-accent-soft:#f1e8d6;
  --toast-shadow:rgba(49,39,23,.24);
}

body[data-interface-theme] .app-toast {
  position:relative;
  overflow:hidden;
  color:var(--toast-ink);
  border-color:var(--toast-border);
  background:var(--toast-surface);
  box-shadow:0 22px 58px var(--toast-shadow),inset 0 1px 0 rgba(255,255,255,.9);
}
body[data-interface-theme] .app-toast::before {
  position:absolute;
  top:10px;
  bottom:10px;
  left:0;
  width:4px;
  border-radius:0 6px 6px 0;
  background:var(--toast-tone,var(--toast-accent));
  content:"";
}
body[data-interface-theme] .app-toast.is-error { --toast-tone:#b84456; --toast-tone-soft:#f6dfe3; }
body[data-interface-theme] .app-toast.is-success { --toast-tone:var(--toast-accent); --toast-tone-soft:var(--toast-accent-soft); }
body[data-interface-theme] .app-toast.is-update {
  --toast-tone:#ffc85c;
  --toast-tone-soft:rgba(255,216,130,.17);
  --toast-ink:#fff9e9;
  --toast-muted:rgba(255,249,233,.76);
  --toast-border:rgba(255,202,92,.58);
  background:
    radial-gradient(circle at 12% 10%,rgba(255,216,130,.18),transparent 34%),
    linear-gradient(135deg,rgba(49,34,10,.98),rgba(91,57,12,.98));
  box-shadow:0 24px 64px rgba(34,20,3,.46),0 0 0 2px rgba(255,202,92,.18),0 0 30px rgba(255,185,61,.1),inset 0 1px 0 rgba(255,239,198,.22);
}
body[data-interface-theme] .app-toast.is-update::before {
  top:0;
  bottom:0;
  width:6px;
  border-radius:0;
  box-shadow:0 0 22px rgba(255,200,92,.72);
}
body[data-interface-theme] .app-toast.is-update .app-toast-icon {
  color:#ffe09a;
  border:1px solid rgba(255,224,154,.3);
  background:rgba(255,224,154,.13);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 8px 22px rgba(20,11,1,.22);
  animation:toastUpdateIcon 2.4s ease-in-out infinite;
}
body[data-interface-theme] .app-toast.is-update .app-toast-action {
  color:#352207;
  background:linear-gradient(135deg,#ffe29a,#ffc14d);
  box-shadow:0 8px 24px rgba(255,193,77,.3);
}
body[data-interface-theme] .app-toast.is-update .app-toast-action:hover { filter:brightness(1.08); transform:translateY(-1px); }
body[data-interface-theme] .app-toast.is-update.is-mandatory .app-toast-requirement{grid-column:2/-1;grid-row:2;display:inline-flex;align-items:center;width:max-content;max-width:100%;padding:4px 8px;border:1px solid rgba(255,224,154,.25);border-radius:7px;color:#ffe09a;background:rgba(255,224,154,.09);font-size:.7rem;font-weight:850;letter-spacing:.02em}
body[data-interface-theme] .app-toast.is-update.is-mandatory.is-updating .app-toast-requirement{color:#fff4ce}
body[data-interface-theme] .app-toast.is-update.is-mandatory .app-toast-action:disabled{cursor:wait;opacity:.76;transform:none}
body.toast-active:has(.app-toast.is-update.is-mandatory) .toast-backdrop{cursor:not-allowed}
body[data-interface-theme] .app-toast.is-update.is-mandatory.requires-attention{animation:mandatoryUpdateShake .62s cubic-bezier(.36,.07,.19,.97) both!important}
body[data-interface-theme] .app-toast.is-update .app-toast-close { color:rgba(255,249,233,.7); }
body[data-interface-theme] .app-toast.is-update .app-toast-close:hover { color:#fff; background:rgba(255,255,255,.1); }
@keyframes toastUpdateIcon { 50% { color:#fff4ce; background:rgba(255,224,154,.22); box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 0 22px rgba(255,200,92,.22); } }
@keyframes mandatoryUpdateShake{0%,100%{transform:translateX(0) scale(1)}15%{transform:translateX(-9px) rotate(-.45deg)}30%{transform:translateX(8px) rotate(.4deg)}45%{transform:translateX(-6px) rotate(-.3deg)}60%{transform:translateX(5px) rotate(.2deg)}75%{transform:translateX(-3px)}}
@media (prefers-reduced-motion:reduce) {
  body[data-interface-theme] .app-toast.is-update .app-toast-icon { animation:none; }
  body[data-interface-theme] .app-toast.is-update.is-mandatory.requires-attention{animation:mandatoryUpdatePulse .3s ease 2!important}
}
@keyframes mandatoryUpdatePulse{50%{box-shadow:0 24px 64px rgba(34,20,3,.46),0 0 0 5px rgba(255,202,92,.42)}}
body[data-interface-theme] .app-toast-icon {
  color:var(--toast-tone,var(--toast-accent));
  background:var(--toast-tone-soft,var(--toast-accent-soft));
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--toast-tone,var(--toast-accent)) 13%,transparent);
}
body[data-interface-theme] .app-toast-copy strong { color:var(--toast-ink); }
body[data-interface-theme] .app-toast-copy span { color:var(--toast-muted); }
body[data-interface-theme] .app-toast-action {
  color:#fff;
  background:var(--toast-tone,var(--toast-accent));
  box-shadow:0 5px 13px color-mix(in srgb,var(--toast-tone,var(--toast-accent)) 27%,transparent);
}
body[data-interface-theme] .app-toast-close { color:var(--toast-muted); }
body[data-interface-theme] .app-toast-close:hover { color:var(--toast-ink); background:var(--toast-accent-soft); }
body[data-interface-theme] .toast-center-header {
  color:var(--toast-ink);
  border-color:var(--toast-border);
  background:var(--toast-surface);
  box-shadow:0 14px 38px var(--toast-shadow);
}
body[data-interface-theme] .toast-center-header b { color:var(--toast-accent); }
body[data-interface-theme] .toast-center-header button {
  color:var(--toast-accent);
  border-color:var(--toast-border);
  background:var(--toast-accent-soft);
}
body[data-interface-theme] .toast-center-header button:hover { color:#fff; background:var(--toast-accent); }

body[data-interface-theme] .topbar { background:var(--ui-header); }
body[data-interface-theme] .topbar-primary { background:linear-gradient(90deg,rgba(255,255,255,.015),rgba(255,255,255,.035),transparent); }
body[data-interface-theme] .document-table-wrap { border-color:var(--ui-table-border); background:var(--ui-table); }
body[data-interface-theme] .document-table { background:var(--ui-table); }
body[data-interface-theme] .document-table thead { background:var(--ui-table-head); }
body[data-interface-theme] .document-table thead th {
  color:#111714;
  font-weight:900;
  text-shadow:none;
}
body[data-interface-theme] .document-table :is(th,td) { border-color:var(--ui-table-border); }
body[data-interface-theme] .document-table tbody tr { background:var(--ui-table); }
body[data-interface-theme] .document-table tbody tr:nth-child(even) { background:color-mix(in srgb,var(--ui-table-head) 38%,var(--ui-table)); }

.profile-theme-form { display:grid; gap:13px; margin-top:16px; padding-top:16px; border-top:1px solid rgba(255,255,255,.1); }
.profile-theme-heading { display:flex; align-items:end; justify-content:space-between; gap:18px; }
.profile-theme-heading>div { display:grid; gap:3px; }
.profile-theme-heading span { color:#8fddca; font-size:.64rem; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.profile-theme-heading strong { font-size:.98rem; }
.profile-theme-heading>small { max-width:210px; color:var(--muted); font-size:.68rem; text-align:right; }
.profile-theme-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.profile-theme-option { position:relative; display:grid; grid-template-columns:54px 1fr; grid-template-rows:auto auto; gap:2px 10px; padding:10px; border:1px solid rgba(255,255,255,.1); border-radius:12px; background:rgba(255,255,255,.035); cursor:pointer; }
.profile-theme-option:has(input:checked) { border-color:rgba(121,215,192,.62); background:rgba(121,215,192,.1); box-shadow:0 0 0 2px rgba(121,215,192,.08); }
.profile-theme-option input { position:absolute; opacity:0; pointer-events:none; }
.profile-theme-option>strong { align-self:end; font-size:.78rem; }
.profile-theme-option>small { color:var(--muted); font-size:.62rem; line-height:1.35; overflow-wrap:anywhere; }
.profile-theme-swatch { grid-row:1/3; display:grid; grid-template-columns:repeat(3,1fr); overflow:hidden; height:40px; border:1px solid rgba(255,255,255,.16); border-radius:8px; }
.profile-theme-option[data-theme-preview="atelier"] .profile-theme-swatch i:nth-child(1) { background:#10241f; }.profile-theme-option[data-theme-preview="atelier"] .profile-theme-swatch i:nth-child(2) { background:#f1efe9; }.profile-theme-option[data-theme-preview="atelier"] .profile-theme-swatch i:nth-child(3) { background:#d7d2c7; }
.profile-theme-option[data-theme-preview="graphite"] .profile-theme-swatch i:nth-child(1) { background:#242a30; }.profile-theme-option[data-theme-preview="graphite"] .profile-theme-swatch i:nth-child(2) { background:#e9edf0; }.profile-theme-option[data-theme-preview="graphite"] .profile-theme-swatch i:nth-child(3) { background:#cbd3d8; }
.profile-theme-option[data-theme-preview="navy"] .profile-theme-swatch i:nth-child(1) { background:#102f4c; }.profile-theme-option[data-theme-preview="navy"] .profile-theme-swatch i:nth-child(2) { background:#e8eef4; }.profile-theme-option[data-theme-preview="navy"] .profile-theme-swatch i:nth-child(3) { background:#c2d0dc; }
.profile-theme-option[data-theme-preview="paper"] .profile-theme-swatch i:nth-child(1) { background:#454037; }.profile-theme-option[data-theme-preview="paper"] .profile-theme-swatch i:nth-child(2) { background:#faf8f2; }.profile-theme-option[data-theme-preview="paper"] .profile-theme-swatch i:nth-child(3) { background:#ddd5c6; }
.profile-theme-form>button { min-height:42px; border:0; border-radius:10px; color:#10251f; background:#79d7c0; font-weight:900; cursor:pointer; }
.profile-theme-form>button:disabled { opacity:.55; cursor:wait; }

body[data-interface-font="modern"] { --ui-font:Inter,Aptos,"Segoe UI",sans-serif; --ui-heading-font:Inter,Aptos,"Segoe UI",sans-serif; }
body[data-interface-font="humanist"] { --ui-font:"Trebuchet MS",Calibri,Aptos,sans-serif; --ui-heading-font:"Trebuchet MS",Calibri,Aptos,sans-serif; }
body[data-interface-font="classic"] { --ui-font:Georgia,"Times New Roman",serif; --ui-heading-font:Georgia,"Times New Roman",serif; }
body[data-interface-font="accessible"] { --ui-font:Verdana,Tahoma,sans-serif; --ui-heading-font:Verdana,Tahoma,sans-serif; font-size:1.025em; letter-spacing:.005em; }
body[data-interface-font] { font-family:var(--ui-font); }
body[data-interface-font] :is(button,input,select,textarea) { font-family:inherit; }
body[data-interface-font] :is(h1,h2,h3,.topbar-title h2,.section-heading h2) { font-family:var(--ui-heading-font); }

.profile-font-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.profile-font-option { position:relative; display:grid; grid-template-columns:46px minmax(0,1fr); grid-template-rows:auto auto; gap:2px 10px; padding:10px; border:1px solid rgba(255,255,255,.1); border-radius:12px; background:rgba(255,255,255,.035); cursor:pointer; }
.profile-font-option:has(input:checked) { border-color:rgba(121,215,192,.62); background:rgba(121,215,192,.1); box-shadow:0 0 0 2px rgba(121,215,192,.08); }
.profile-font-option input { position:absolute; opacity:0; pointer-events:none; }
.profile-font-option>span { grid-row:1/3; display:grid; width:42px; height:42px; place-items:center; border:1px solid rgba(255,255,255,.13); border-radius:9px; background:rgba(0,0,0,.16); font-size:1rem; }
.profile-font-option>strong { align-self:end; font-size:.76rem; }
.profile-font-option>small { color:var(--muted); font-size:.62rem; line-height:1.3; overflow-wrap:anywhere; }
.profile-font-option[data-font-preview="humanist"]>span { font-family:"Trebuchet MS",sans-serif; }
.profile-font-option[data-font-preview="classic"]>span { font-family:Georgia,serif; }
.profile-font-option[data-font-preview="accessible"]>span { font-family:Verdana,sans-serif; }

@media (max-width:560px) {
  .profile-theme-heading { align-items:start; flex-direction:column; gap:5px; }
  .profile-theme-heading>small { max-width:none; text-align:left; }
  .profile-theme-grid { grid-template-columns:1fr; }
  .profile-font-grid { grid-template-columns:1fr; }
}

/* Full profile page */
.profile-page {
  width:min(1320px,100%);
  margin:0 auto;
  padding:clamp(18px,3vw,34px);
  border:1px solid rgba(255,255,255,.14);
  border-radius:24px;
  color:#f7f4ed;
  background:linear-gradient(145deg,rgba(10,29,24,.94),rgba(20,29,27,.92));
  box-shadow:0 26px 70px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(18px);
  animation:profilePageEnter 560ms cubic-bezier(.2,.8,.2,1) both;
}
.profile-page-hero { display:flex; align-items:center; justify-content:space-between; gap:28px; padding-bottom:22px; border-bottom:1px solid rgba(255,255,255,.1); }
.profile-page-hero .own-profile-head { margin:0; }
.profile-page-hero .own-profile-head>span { width:72px; height:72px; border-radius:20px; font-size:1.05rem; }
.profile-page-hero .own-profile-head h3 { font-size:clamp(1.5rem,3vw,2.25rem); }
.profile-page-hero>p { max-width:390px; margin:0; color:rgba(247,244,237,.68); text-align:right; }
.profile-page>.own-profile-grid { margin-top:18px; }
.profile-page>.own-profile-grid>div { min-height:92px; display:grid; align-content:center; }
.profile-page>.own-profile-grid strong { font-size:1.35rem; }
.profile-settings-layout { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-top:20px; }
.profile-settings-layout .profile-theme-form { align-content:start; margin:0; padding:20px; border:1px solid rgba(255,255,255,.1); border-radius:18px; background:rgba(255,255,255,.025); }
.profile-settings-layout .profile-theme-grid,
.profile-settings-layout .profile-font-grid { grid-template-columns:1fr; }
.profile-page>.own-profile-pin { margin-top:20px; }
.profile-page-hero { animation:profileSectionEnter 480ms 90ms cubic-bezier(.2,.8,.2,1) both; }
.profile-page>.own-profile-grid { animation:profileSectionEnter 480ms 150ms cubic-bezier(.2,.8,.2,1) both; }
.profile-page>.own-profile-pin { animation:profileSectionEnter 480ms 210ms cubic-bezier(.2,.8,.2,1) both; }
.profile-settings-layout>.profile-theme-form:first-child { animation:profileSectionEnter 500ms 280ms cubic-bezier(.2,.8,.2,1) both; }
.profile-settings-layout>.profile-font-form { animation:profileSectionEnter 500ms 340ms cubic-bezier(.2,.8,.2,1) both; }
.profile-animation-form { animation:profileSectionEnter 500ms 400ms cubic-bezier(.2,.8,.2,1) both; }
.profile-page-loading,.profile-page-error { min-height:300px; display:grid; place-items:center; align-content:center; gap:12px; text-align:center; }
.profile-page-error h3,.profile-page-error p { margin:0; }
.profile-page-error button { min-height:42px; padding:0 18px; border:0; border-radius:10px; background:#79d7c0; font-weight:900; cursor:pointer; }

body[data-view="profile"] .topbar-event-switcher { display:none!important; }

.profile-animation-form { display:grid; gap:13px; margin-top:20px; padding:20px; border:1px solid rgba(255,255,255,.1); border-radius:18px; background:rgba(255,255,255,.025); }
.profile-save-bar { position:sticky; bottom:12px; z-index:5; display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:14px; padding:12px 14px 12px 17px; border:1px solid rgba(255,255,255,.12); border-radius:15px; background:rgba(18,29,26,.94); box-shadow:0 14px 34px rgba(0,0,0,.26); backdrop-filter:blur(16px); transition:border-color 180ms ease,background 180ms ease,transform 180ms ease; }
.profile-save-bar>span { display:grid; gap:2px; }
.profile-save-bar strong { font-size:.8rem; }
.profile-save-bar small { color:var(--muted); font-size:.65rem; }
.profile-save-bar>button { min-width:130px; min-height:42px; border:0; border-radius:10px; color:#173129; background:#79d7c0; font-weight:900; cursor:pointer; transition:opacity 180ms ease,transform 180ms ease; }
.profile-save-bar>button:disabled { opacity:.4; cursor:default; }
.profile-save-bar.has-changes { position:fixed; right:clamp(16px,3vw,44px); bottom:clamp(16px,3vw,30px); z-index:120; width:min(590px,calc(100vw - 32px)); border:2px solid #f1c75b; background:linear-gradient(105deg,rgba(60,43,14,.98),rgba(25,47,40,.98)); box-shadow:0 18px 60px rgba(0,0,0,.5),0 0 0 5px rgba(241,199,91,.14); transform:none; animation:profileSaveAttention 520ms cubic-bezier(.2,.8,.2,1) both,profileSaveGlow 2.4s 600ms ease-in-out infinite; }
.profile-save-bar.has-changes strong { color:#fff6d9; font-size:.92rem; }
.profile-save-bar.has-changes small { color:rgba(255,246,217,.78); }
.profile-save-bar.has-changes>button { color:#241b08; background:linear-gradient(135deg,#ffe39a,#f1c75b); box-shadow:0 8px 22px rgba(241,199,91,.25); }
.profile-save-bar.has-changes>button:not(:disabled):hover { transform:translateY(-2px); }
.profile-animation-lock { display:grid; grid-template-columns:auto 1fr; align-items:center; gap:5px 12px; padding:12px 14px; border:1px solid rgba(241,199,91,.36); border-radius:11px; color:#fff3cd; background:rgba(113,76,16,.2); }
.profile-animation-lock::before { grid-row:1/3; content:"❄"; font-size:1.35rem; }
.profile-animation-lock strong { font-size:.76rem; }
.profile-animation-lock span { color:rgba(255,243,205,.76); font-size:.66rem; }
.profile-animation-form.is-locked .profile-animation-grid { opacity:.48; }
.profile-animation-form.is-locked .profile-animation-option { cursor:not-allowed; filter:saturate(.45); }
.profile-animation-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:10px; }
.profile-animation-option { position:relative; display:grid; grid-template-columns:76px minmax(0,1fr); grid-template-rows:auto auto; gap:3px 12px; padding:11px; border:1px solid rgba(255,255,255,.1); border-radius:13px; background:rgba(255,255,255,.035); cursor:pointer; }
.profile-animation-option:has(input:checked) { border-color:rgba(121,215,192,.62); background:rgba(121,215,192,.1); box-shadow:0 0 0 2px rgba(121,215,192,.08); }
.profile-animation-option input { position:absolute; opacity:0; pointer-events:none; }
.profile-animation-option>strong { align-self:end; font-size:.8rem; }
.profile-animation-option>small { color:var(--muted); font-size:.62rem; line-height:1.35; overflow-wrap:anywhere; }
.profile-animation-preview { position:relative; grid-row:1/3; overflow:hidden; width:76px; height:50px; border:1px solid rgba(255,255,255,.15); border-radius:9px; background:linear-gradient(135deg,#063e37,#231528); }
.profile-animation-option[data-animation-preview="none"] .profile-animation-preview { background:linear-gradient(135deg,#18312d,#26252a); }
.profile-animation-option[data-animation-preview="none"] .profile-animation-preview::after { position:absolute; inset:12px; content:""; border:1px solid rgba(255,255,255,.22); border-radius:6px; background:rgba(255,255,255,.045); }
.profile-animation-option[data-animation-preview="grid"] .profile-animation-preview { background-color:#102b28; background-image:linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px); background-size:13px 13px; animation:profileGridPreview 5s linear infinite; }
.profile-animation-option[data-animation-preview="aurora-flow"] .profile-animation-preview::before,.profile-animation-option[data-animation-preview="aurora-flow"] .profile-animation-preview::after { position:absolute; width:58px; height:58px; content:""; border-radius:50%; filter:blur(9px); animation:profileAuroraPreview 4s ease-in-out infinite alternate; }
.profile-animation-option[data-animation-preview="aurora-flow"] .profile-animation-preview::before { top:-22px; left:-8px; background:#55d9b5; }.profile-animation-option[data-animation-preview="aurora-flow"] .profile-animation-preview::after { right:-8px; bottom:-28px; background:#b54884; animation-delay:-2s; }
.profile-animation-option[data-animation-preview="constellation"] .profile-animation-preview { background-color:#11182a; background-image:radial-gradient(circle,#fff 0 1px,transparent 1.6px),radial-gradient(circle,#79d7c0 0 1px,transparent 1.8px); background-position:0 0,11px 8px; background-size:21px 19px,27px 25px; animation:profileStarsPreview 8s linear infinite; }
.profile-animation-option[data-animation-preview="prism"] .profile-animation-preview {
  background:
    radial-gradient(circle at 18% 30%,rgba(115,255,225,.9),transparent 32%),
    radial-gradient(circle at 82% 72%,rgba(255,103,196,.82),transparent 36%),
    conic-gradient(from 210deg at 52% 48%,#132b48,#5b45a2,#d35b9b,#e6c66d,#42cab4,#132b48);
  background-size:130% 130%;
  animation:profilePrismPreview 5s ease-in-out infinite alternate;
}
.profile-animation-option[data-animation-preview="prism"] .profile-animation-preview::after {
  position:absolute;
  inset:-45% -20%;
  content:"";
  background:linear-gradient(112deg,transparent 32%,rgba(255,255,255,.7) 48%,transparent 62%);
  transform:translateX(-48%) rotate(4deg);
  animation:profilePrismShine 3.8s ease-in-out infinite;
}

body[data-interface-animation="grid"] .app-shell::after{opacity:var(--interface-animation-grid-opacity,.56);filter:brightness(var(--interface-animation-brightness,1)) saturate(var(--interface-animation-saturation,1))}
body[data-interface-animation="grid"] .app-shell::before{opacity:var(--interface-animation-orb-opacity,.8);filter:blur(8px) brightness(var(--interface-animation-brightness,1)) saturate(var(--interface-animation-saturation,1))}
body[data-interface-animation="aurora-flow"] .app-shell::after { inset:-18%; background:radial-gradient(ellipse at 20% 35%,rgba(91,224,191,.2),transparent 38%),radial-gradient(ellipse at 78% 65%,rgba(190,67,126,.18),transparent 40%),radial-gradient(ellipse at 55% 12%,rgba(243,212,138,.13),transparent 34%); background-size:120% 120%; opacity:var(--interface-animation-aurora-opacity,.9); filter:blur(18px) brightness(var(--interface-animation-brightness,1)) saturate(var(--interface-animation-saturation,1)); animation:interfaceAuroraFlow 18s ease-in-out infinite alternate; }
body[data-interface-animation="aurora-flow"] .app-shell::before { opacity:var(--interface-animation-orb-opacity,.8);filter:blur(8px) brightness(var(--interface-animation-brightness,1)) saturate(var(--interface-animation-saturation,1));animation:interfaceOrbFloat 16s ease-in-out infinite alternate; }
body[data-interface-animation="constellation"] .app-shell::after { inset:-10%; background-image:radial-gradient(circle,rgba(255,255,255,.42) 0 1px,transparent 1.7px),radial-gradient(circle,rgba(121,215,192,.35) 0 1px,transparent 1.8px),radial-gradient(circle,rgba(243,212,138,.28) 0 1.2px,transparent 2px); background-position:0 0,37px 29px,12px 43px; background-size:86px 82px,113px 107px,149px 137px; opacity:var(--interface-animation-stars-opacity,.48); filter:brightness(var(--interface-animation-brightness,1)) saturate(var(--interface-animation-saturation,1));transform-origin:center; animation:interfaceConstellation 42s linear infinite; }
body[data-interface-animation="constellation"] .app-shell::before{opacity:var(--interface-animation-orb-opacity,.8);filter:blur(8px) brightness(var(--interface-animation-brightness,1)) saturate(var(--interface-animation-saturation,1))}
body[data-interface-animation="prism"] .app-shell::after {
  inset:-28%;
  background:
    linear-gradient(118deg,transparent 19%,rgba(81,226,196,.13) 34%,transparent 47%),
    linear-gradient(62deg,transparent 34%,rgba(210,85,161,.12) 49%,transparent 63%),
    conic-gradient(from 190deg at 52% 48%,transparent,rgba(89,105,220,.1),transparent 28%,rgba(242,197,101,.09),transparent 58%,rgba(80,218,190,.1),transparent 82%);
  background-size:125% 125%,135% 135%,100% 100%;
  opacity:var(--interface-animation-prism-opacity,.9);
  filter:blur(4px) saturate(var(--interface-animation-prism-saturation,1.32)) brightness(var(--interface-animation-brightness,1)) contrast(1.06);
  animation:interfacePrism 22s cubic-bezier(.45,.05,.55,.95) infinite alternate;
}
body[data-interface-animation="prism"] .app-shell::before {
  opacity:var(--interface-animation-prism-orb-opacity,.84);
  filter:blur(7px) saturate(var(--interface-animation-prism-saturation,1.32)) brightness(var(--interface-animation-brightness,1));
  animation:interfacePrismOrb 17s ease-in-out infinite alternate;
}
body[data-interface-animation="none"] .app-shell::before,
body[data-interface-animation="none"] .app-shell::after { opacity:0!important; animation:none!important; }

/* Osobni materijali povrsina i tablica. */
.profile-material-form{margin-top:14px!important;padding:20px!important;border:1px solid rgba(255,255,255,.1)!important;border-radius:18px;background:rgba(255,255,255,.025)}.profile-material-groups{display:grid;grid-template-columns:1fr 1fr;gap:14px}.profile-material-groups fieldset{min-width:0;margin:0;padding:0;border:0}.profile-material-groups legend{margin-bottom:8px;color:#90dcca;font-size:.64rem;font-weight:900;letter-spacing:.09em;text-transform:uppercase}.profile-material-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}.profile-material-option{position:relative;display:grid;grid-template-columns:64px minmax(0,1fr);grid-template-rows:auto auto;gap:3px 10px;min-height:82px;padding:10px;border:1px solid rgba(255,255,255,.1);border-radius:13px;background:rgba(255,255,255,.03);cursor:pointer;transition:transform .18s,border-color .18s,background .18s}.profile-material-option:hover{transform:translateY(-1px);background:rgba(255,255,255,.05)}.profile-material-option>input{position:absolute;opacity:0;pointer-events:none}.profile-material-option:has(input:checked){border-color:rgba(121,215,192,.62);background:rgba(121,215,192,.1);box-shadow:0 0 0 2px rgba(121,215,192,.07)}.profile-material-option>strong{align-self:end;font-size:.76rem}.profile-material-option>small{color:var(--muted);font-size:.59rem;line-height:1.35}.profile-material-preview,.profile-table-preview{position:relative;grid-row:1/3;display:grid;width:64px;height:54px;overflow:hidden;border:1px solid rgba(255,255,255,.17);border-radius:9px;background:linear-gradient(135deg,#12362f,#361b2c)}.profile-material-preview i{position:absolute;border-radius:50%}.profile-material-preview i:first-child{width:34px;height:34px;top:-8px;left:-5px;background:#53dbb6}.profile-material-preview i:last-child{width:30px;height:30px;right:-6px;bottom:-8px;background:#c35391}.profile-material-option.is-glass .profile-material-preview::after{position:absolute;inset:7px;content:"";border:1px solid rgba(255,255,255,.48);border-radius:6px;background:rgba(255,255,255,.09);backdrop-filter:blur(2px)}.profile-material-option.is-themed .profile-material-preview::after{position:absolute;inset:7px;content:"";border:1px solid rgba(255,255,255,.18);border-radius:6px;background:linear-gradient(135deg,#f2efe8,#d9e2dd)}.profile-table-preview{grid-template-columns:1.3fr 1fr;grid-template-rows:15px 1fr 1fr;background:rgba(255,255,255,.08)}.profile-table-preview i{border-right:1px solid rgba(255,255,255,.32);border-bottom:1px solid rgba(255,255,255,.32)}.profile-table-preview i:nth-child(1){grid-column:1/-1;background:rgba(12,34,29,.82)}.profile-material-option.is-modern .profile-table-preview i:nth-child(n+2){background:rgba(244,244,239,.85)}.profile-material-option.is-transparent .profile-table-preview{background:linear-gradient(135deg,rgba(26,81,69,.28),rgba(83,28,59,.2));backdrop-filter:blur(1px)}.profile-material-option.is-transparent .profile-table-preview i{background:rgba(255,255,255,.035);border-color:rgba(255,255,255,.65)}

body[data-interface-surface="glass"]{--surface-window-bg:linear-gradient(145deg,rgba(14,34,31,.3),rgba(35,24,31,.22));--surface-window-border:rgba(255,255,255,.18);--surface-window-blur:4px}body[data-interface-surface="themed"]{--surface-window-bg:var(--ui-surface-themed,var(--theme-glass-bg));--surface-window-border:var(--ui-surface-border,var(--theme-glass-border));--surface-window-blur:10px}
body[data-interface-surface] :is(.home-panel,.general-deadlines,.content-card,.event-card,.item-card,.note-box,.concert-main,.concert-side,.tutorial-card,.contact-card,.profile-page-hero,.own-profile-grid>div,.own-profile-pin,.profile-theme-form){color:var(--theme-glass-text)!important;border-color:var(--surface-window-border)!important;background:var(--surface-window-bg)!important;backdrop-filter:blur(var(--surface-window-blur)) saturate(1.08)!important;-webkit-backdrop-filter:blur(var(--surface-window-blur)) saturate(1.08)!important;transition:background .28s ease,border-color .28s ease,backdrop-filter .28s ease,box-shadow .28s ease}body[data-interface-surface] :is(.home-panel,.content-card,.event-card,.item-card,.note-box,.profile-page-hero,.own-profile-grid>div,.own-profile-pin,.profile-theme-form) :is(h1,h2,h3,h4,strong){color:var(--theme-glass-text)!important}body[data-interface-surface] :is(.home-panel,.content-card,.event-card,.item-card,.note-box,.profile-page-hero,.own-profile-grid>div,.own-profile-pin,.profile-theme-form) :is(p,small,.section-eyebrow){color:var(--theme-glass-muted)!important}body[data-interface-surface="glass"] :is(.home-panel,.general-deadlines,.content-card,.event-card,.item-card,.note-box,.concert-main,.concert-side,.tutorial-card,.contact-card,.profile-page-hero,.own-profile-grid>div,.own-profile-pin,.profile-theme-form){background:linear-gradient(145deg,rgba(7,24,22,.16),rgba(40,17,31,.1))!important;border-color:rgba(255,255,255,.22)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 12px 32px rgba(0,0,0,.08)!important;backdrop-filter:blur(1.5px) saturate(1.04)!important;-webkit-backdrop-filter:blur(1.5px) saturate(1.04)!important}body[data-interface-surface="themed"] :is(.home-panel,.general-deadlines,.content-card,.event-card,.item-card,.note-box,.concert-main,.concert-side,.tutorial-card,.contact-card,.profile-page-hero,.own-profile-grid>div,.own-profile-pin,.profile-theme-form){box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 18px 42px rgba(0,0,0,.2)!important}body[data-interface-surface="glass"] :is(.section-block,.general-deadline-content){border-color:rgba(255,255,255,.16)!important;background:rgba(13,29,27,.14)!important;backdrop-filter:blur(1.5px)!important;-webkit-backdrop-filter:blur(1.5px)!important}

body[data-interface-table="transparent"] .document-table-wrap{border-color:rgba(255,255,255,.34)!important;background:rgba(8,22,20,.16)!important;box-shadow:0 18px 45px rgba(0,0,0,.14);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}body[data-interface-table="transparent"] .document-table{color:#f5f8f6!important;background:transparent!important;border-collapse:collapse}body[data-interface-table="transparent"] .document-table thead{background:rgba(9,25,23,.5)!important;backdrop-filter:blur(3px)}body[data-interface-table="transparent"] .document-table thead th{color:#fff!important;background:rgba(255,255,255,.045)!important;text-shadow:0 1px 8px rgba(0,0,0,.32)}body[data-interface-table="transparent"] .document-table :is(th,td){border:1px solid rgba(255,255,255,.29)!important}body[data-interface-table="transparent"] .document-table tbody tr,body[data-interface-table="transparent"] .document-table tbody tr:nth-child(even),body[data-interface-table="transparent"] .document-table tbody tr.is-pending{--table-row-bg:rgba(255,255,255,.035)!important;background:transparent!important}body[data-interface-table="transparent"] .document-table tbody tr:nth-child(even){--table-row-bg:rgba(255,255,255,.065)!important}body[data-interface-table="transparent"] .document-table td{color:rgba(245,248,246,.86)!important;background:var(--table-row-bg)!important}body[data-interface-table="transparent"] .document-table :is(.table-title strong,.table-description){color:#fff!important}body[data-interface-table="transparent"] .document-table tbody tr:hover{--table-row-bg:rgba(121,217,194,.13)!important}body[data-interface-table="transparent"] .document-table th:first-child,body[data-interface-table="transparent"] .document-table th:last-child,body[data-interface-table="transparent"] .document-table tbody tr:last-child td:first-child,body[data-interface-table="transparent"] .document-table tbody tr:last-child td:last-child{border-radius:0}
@media(max-width:900px){.profile-material-groups{grid-template-columns:1fr}.profile-material-options{grid-template-columns:1fr 1fr}}@media(max-width:520px){.profile-material-options{grid-template-columns:1fr}.profile-material-form{padding:15px!important}}

/* Cjelovit tematski materijal: ista paleta kroz sve razine sadržaja. */
body[data-interface-theme="atelier"][data-interface-surface="themed"]{--ui-panel:#142b25;--ui-panel-raised:#1b342d;--ui-panel-soft:#203a33;--ui-panel-head:#0c211c;--ui-panel-line:rgba(139,218,198,.24);--ui-panel-line-strong:rgba(139,218,198,.4);--ui-panel-text:#f3f6f1;--ui-panel-muted:#b4c4be;--ui-panel-accent:#82d8c2;--ui-panel-accent-soft:rgba(130,216,194,.14)}
body[data-interface-theme="graphite"][data-interface-surface="themed"]{--ui-panel:#242b31;--ui-panel-raised:#2c343b;--ui-panel-soft:#333c44;--ui-panel-head:#171c21;--ui-panel-line:rgba(198,211,220,.2);--ui-panel-line-strong:rgba(198,211,220,.36);--ui-panel-text:#f4f6f8;--ui-panel-muted:#b9c2c9;--ui-panel-accent:#a9c2d2;--ui-panel-accent-soft:rgba(169,194,210,.14)}
body[data-interface-theme="navy"][data-interface-surface="themed"]{--ui-panel:#102f4a;--ui-panel-raised:#173b59;--ui-panel-soft:#1d4565;--ui-panel-head:#092239;--ui-panel-line:rgba(151,201,236,.23);--ui-panel-line-strong:rgba(151,201,236,.4);--ui-panel-text:#f2f7fb;--ui-panel-muted:#b4c9d9;--ui-panel-accent:#88c7ee;--ui-panel-accent-soft:rgba(136,199,238,.15)}
body[data-interface-theme="paper"][data-interface-surface="themed"]{--ui-panel:#403c33;--ui-panel-raised:#4a453a;--ui-panel-soft:#554f42;--ui-panel-head:#2c2923;--ui-panel-line:rgba(232,215,178,.23);--ui-panel-line-strong:rgba(232,215,178,.4);--ui-panel-text:#fffaf0;--ui-panel-muted:#d1c7b4;--ui-panel-accent:#e2c98f;--ui-panel-accent-soft:rgba(226,201,143,.15)}

body[data-interface-surface="themed"]{--surface-window-bg:linear-gradient(145deg,var(--ui-panel-raised),var(--ui-panel));--surface-window-border:var(--ui-panel-line);--theme-glass-text:var(--ui-panel-text);--theme-glass-muted:var(--ui-panel-muted);--theme-glass-accent:var(--ui-panel-accent)}
body[data-interface-surface="themed"] :is(.home-panel,.general-deadlines,.content-card,.event-card,.item-card,.note-box,.concert-main,.concert-side,.tutorial-card,.contact-card,.profile-page-hero,.own-profile-grid>div,.own-profile-pin,.profile-theme-form,.admin-panel,.admin-kpis>article,.admin-subpage>header,.admin-application-grid>section){color:var(--ui-panel-text)!important;border-color:var(--ui-panel-line)!important;background:linear-gradient(145deg,var(--ui-panel-raised),var(--ui-panel))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 16px 36px rgba(0,0,0,.16)!important}
body[data-interface-surface="themed"] :is(.profile-theme-option,.profile-font-option,.profile-animation-option,.profile-material-option,.admin-user-summary,.admin-picker summary,.admin-users-page-list article,.admin-board-item){color:var(--ui-panel-text)!important;border-color:var(--ui-panel-line)!important;background:var(--ui-panel-soft)!important}
body[data-interface-surface="themed"] :is(.profile-theme-option,.profile-font-option,.profile-animation-option,.profile-material-option):has(input:checked){border-color:var(--ui-panel-line-strong)!important;background:color-mix(in srgb,var(--ui-panel-accent) 17%,var(--ui-panel-soft))!important;box-shadow:0 0 0 2px color-mix(in srgb,var(--ui-panel-accent) 9%,transparent)!important}
body[data-interface-surface="themed"] :is(.profile-page,.admin-dashboard,.admin-subpage) :is(h1,h2,h3,h4,h5,strong){color:var(--ui-panel-text)}body[data-interface-surface="themed"] :is(.profile-page,.admin-dashboard,.admin-subpage) :is(p,small,span){border-color:var(--ui-panel-line);color:var(--ui-panel-muted)}

/* Oglasna ploca: redovi, rokovi i sjednice vise nisu bijeli umetci. */
body[data-interface-surface="themed"][data-view="board"] .document-table-wrap.board-notice-table-wrap{border:1px solid var(--ui-panel-line)!important;background:var(--ui-panel)!important;box-shadow:0 14px 32px rgba(0,0,0,.16)!important}
body[data-interface-surface="themed"][data-view="board"] .board-notice-table tbody tr,body[data-interface-surface="themed"][data-view="board"] .board-notice-table tbody tr:nth-child(even){--table-row-bg:var(--ui-panel-raised)!important;background:var(--ui-panel-raised)!important}
body[data-interface-surface="themed"][data-view="board"] .board-notice-table tbody tr:nth-child(even){--table-row-bg:var(--ui-panel-soft)!important;background:var(--ui-panel-soft)!important}
body[data-interface-surface="themed"][data-view="board"] .board-notice-table tbody tr:hover{--table-row-bg:color-mix(in srgb,var(--ui-panel-accent) 13%,var(--ui-panel-raised))!important}
body[data-interface-surface="themed"][data-view="board"] .board-notice-table td{color:var(--ui-panel-muted)!important;border-color:var(--ui-panel-line)!important;background:var(--table-row-bg)!important}body[data-interface-surface="themed"][data-view="board"] .board-notice-table tbody strong{color:var(--ui-panel-text)!important}body[data-interface-surface="themed"][data-view="board"] .notice-row-icon{color:var(--ui-panel-accent)!important;border-color:var(--ui-panel-line)!important;background:var(--ui-panel-accent-soft)!important}body[data-interface-surface="themed"][data-view="board"] .board-notice-action{color:var(--ui-panel-accent)!important;border-color:var(--ui-panel-line-strong)!important;background:var(--ui-panel-accent-soft)!important}
body[data-interface-surface="themed"][data-view="board"] .deadline-panel .compact-item,body[data-interface-surface="themed"][data-view="board"] .board-meetings .compact-item{color:var(--ui-panel-text)!important;border-color:var(--ui-panel-line)!important;background:var(--ui-panel-raised)!important}body[data-interface-surface="themed"][data-view="board"] .deadline-panel .compact-item:hover,body[data-interface-surface="themed"][data-view="board"] .board-meetings .compact-item:hover{color:var(--ui-panel-text)!important;border-color:var(--ui-panel-line-strong)!important;background:color-mix(in srgb,var(--ui-panel-accent) 12%,var(--ui-panel-raised))!important;box-shadow:inset 3px 0 0 var(--ui-panel-accent)!important}body[data-interface-surface="themed"][data-view="board"] :is(.compact-copy strong,.compact-copy span){color:var(--ui-panel-text)!important}body[data-interface-surface="themed"][data-view="board"] .compact-copy small{color:var(--ui-panel-muted)!important}body[data-interface-surface="themed"][data-view="board"] .compact-icon{color:var(--ui-panel-accent)!important;border-color:var(--ui-panel-line)!important;background:var(--ui-panel-accent-soft)!important}

/* Kalendar i dogadjanja: prazna stanja i ugnijezdene kartice slijede temu. */
body[data-interface-surface="themed"] :is(.empty-state,.timeline-empty,.document-empty,.admin-empty){color:var(--ui-panel-muted)!important;border-color:var(--ui-panel-line)!important;background:var(--ui-panel-soft)!important;box-shadow:none!important}body[data-interface-surface="themed"] :is(.general-deadline-content,.general-deadlines-table,.general-deadline-row,.event-detail,.event-link-card,.concert-card){color:var(--ui-panel-text)!important;border-color:var(--ui-panel-line)!important;background:var(--ui-panel-raised)!important}body[data-interface-surface="themed"] :is(.general-deadline-content,.general-deadline-row,.event-detail,.event-link-card,.concert-card) :is(h3,h4,strong){color:var(--ui-panel-text)!important}body[data-interface-surface="themed"] :is(.general-deadline-content,.general-deadline-row,.event-detail,.event-link-card,.concert-card) :is(p,small,span){color:var(--ui-panel-muted)!important}body[data-interface-surface="themed"] .general-deadlines-header{color:var(--ui-panel-muted)!important;background:var(--ui-panel-head)!important}body[data-interface-surface="themed"] .general-deadline-row:hover{background:color-mix(in srgb,var(--ui-panel-accent) 10%,var(--ui-panel-raised))!important}

/* Moderna tablica je sada moderna varijanta odabrane teme; prozirna mreza ostaje zasebna. */
body[data-interface-surface="themed"][data-interface-table="modern"] .document-table-wrap{border-color:var(--ui-panel-line)!important;background:var(--ui-panel)!important;box-shadow:0 16px 36px rgba(0,0,0,.16)!important}body[data-interface-surface="themed"][data-interface-table="modern"] .document-table{color:var(--ui-panel-text)!important;background:var(--ui-panel)!important}body[data-interface-surface="themed"][data-interface-table="modern"] .document-table thead{background:var(--ui-panel-head)!important}body[data-interface-surface="themed"][data-interface-table="modern"] .document-table thead th{color:var(--ui-panel-text)!important;background:transparent!important}body[data-interface-surface="themed"][data-interface-table="modern"] .document-table tbody tr{--table-row-bg:var(--ui-panel-raised)!important;background:var(--ui-panel-raised)!important}body[data-interface-surface="themed"][data-interface-table="modern"] .document-table tbody tr:nth-child(even){--table-row-bg:var(--ui-panel-soft)!important;background:var(--ui-panel-soft)!important}body[data-interface-surface="themed"][data-interface-table="modern"] .document-table :is(th,td){color:var(--ui-panel-muted)!important;border-color:var(--ui-panel-line)!important}body[data-interface-surface="themed"][data-interface-table="modern"] .document-table td{background:var(--table-row-bg)!important}body[data-interface-surface="themed"][data-interface-table="modern"] .document-table :is(.table-title strong,.table-description){color:var(--ui-panel-text)!important}
body[data-theme="christmas"][data-interface-animation] .app-shell::after { inset:0; background:linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.034) 1px,transparent 1px); background-size:64px 64px; opacity:.34; filter:none; animation:backgroundMotifs 26s ease-in-out infinite alternate; }

@keyframes interfaceAuroraFlow { 0% { transform:translate3d(-4%,-3%,0) rotate(-2deg) scale(1); } 50% { transform:translate3d(4%,2%,0) rotate(3deg) scale(1.08); } 100% { transform:translate3d(-1%,5%,0) rotate(-1deg) scale(1.03); } }
@keyframes interfaceOrbFloat { from { transform:translate3d(-5vw,3vh,0) scale(.92); } to { transform:translate3d(5vw,-5vh,0) scale(1.12); } }
@keyframes interfaceConstellation { from { transform:rotate(0deg) scale(1.08); } to { transform:rotate(360deg) scale(1.08); } }
@keyframes interfacePrism { 0% { transform:translate3d(-5%,-3%,0) rotate(-5deg) scale(1.02); } 50% { transform:translate3d(4%,2%,0) rotate(2deg) scale(1.09); } 100% { transform:translate3d(-1%,5%,0) rotate(6deg) scale(1.04); } }
@keyframes interfacePrismOrb { from { transform:translate3d(-9vw,7vh,0) scale(.86); } to { transform:translate3d(7vw,-8vh,0) scale(1.2); } }
@keyframes profileGridPreview { to { background-position:26px 13px; } }
@keyframes profileAuroraPreview { to { transform:translate(18px,8px) scale(1.18); } }
@keyframes profileStarsPreview { to { background-position:42px 38px,65px 58px; } }
@keyframes profilePrismPreview { from { background-position:0% 20%; filter:hue-rotate(-8deg); } to { background-position:100% 80%; filter:hue-rotate(16deg); } }
@keyframes profilePrismShine { 0%,18% { transform:translateX(-55%) rotate(4deg); opacity:0; } 48% { opacity:.85; } 76%,100% { transform:translateX(62%) rotate(4deg); opacity:0; } }
@keyframes profileSaveAttention { from { opacity:0; transform:translateY(24px) scale(.96); } to { opacity:1; transform:none; } }
@keyframes profileSaveGlow { 50% { box-shadow:0 18px 60px rgba(0,0,0,.5),0 0 0 8px rgba(241,199,91,.06); } }

@keyframes profilePageEnter {
  from { opacity:0; transform:translateY(18px) scale(.988); filter:blur(7px); }
  to { opacity:1; transform:none; filter:none; }
}

@keyframes profileSectionEnter {
  from { opacity:0; transform:translateY(14px); }
  to { opacity:1; transform:none; }
}

@media (prefers-reduced-motion:reduce) {
  .profile-page,
  .profile-page-hero,
  .profile-page>.own-profile-grid,
  .profile-settings-layout>.profile-theme-form,
  .profile-animation-form,
  .profile-page>.own-profile-pin { animation:none!important; }
  body[data-interface-animation] .app-shell::before,
  body[data-interface-animation] .app-shell::after,
  .profile-animation-preview { animation:none!important; }
  .profile-save-bar.has-changes { animation:none!important; }
}

@media (max-width:1200px) {
  .profile-settings-layout { grid-template-columns:1fr; }
  .profile-animation-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:700px) {
  .profile-animation-grid { grid-template-columns:1fr; }
}

@media (max-width:620px) {
  .profile-page { padding:16px; border-radius:18px; }
  .profile-page-hero { align-items:flex-start; flex-direction:column; gap:12px; }
  .profile-page-hero>p { text-align:left; }
  .profile-page-hero .own-profile-head>span { width:58px; height:58px; border-radius:16px; }
  .profile-page>.own-profile-grid { grid-template-columns:1fr; }
  .profile-settings-layout .profile-theme-form { padding:15px; }
  body>.profile-save-bar { position:fixed; right:8px; bottom:calc(8px + env(safe-area-inset-bottom)); left:8px; z-index:180; width:auto; margin:0; opacity:0; visibility:hidden; pointer-events:none; transform:translateY(calc(100% + 24px)); }
  body>.profile-save-bar.has-changes { right:8px; bottom:calc(8px + env(safe-area-inset-bottom)); left:8px; width:auto; opacity:1; visibility:visible; pointer-events:auto; transform:none; }
  body>.profile-save-bar>span { min-width:0; }
  body>.profile-save-bar strong { font-size:.8rem; }
  body>.profile-save-bar small { overflow:hidden; font-size:.61rem; text-overflow:ellipsis; white-space:nowrap; }
  body>.profile-save-bar>button { width:auto; min-width:104px; flex:none; }
  .profile-animation-lock { grid-template-columns:auto 1fr; }
}

@media (max-width:390px) {
  body>.profile-save-bar { align-items:stretch; flex-direction:column; gap:8px; }
  body>.profile-save-bar>button { width:100%; }
}
/* Compact search and shared desktop/mobile profile menu. */
.topbar{overflow:visible}
.command-trigger{display:grid!important;grid-template-columns:1fr!important;width:46px!important;min-width:46px!important;padding:0!important;place-items:center!important;gap:0!important;border-radius:14px!important;text-align:center!important}
.command-trigger span,.command-trigger kbd{display:none!important}
.command-trigger svg{display:block;width:19px;height:19px;margin:0!important;place-self:center;transform:none!important}
.topbar-account{position:relative;min-width:0}
.topbar-profile{padding-right:11px}
.topbar-profile>span{display:grid!important;box-sizing:border-box;place-items:center!important;padding:0!important;line-height:1!important;text-align:center!important}
.topbar-profile-chevron{width:15px;height:15px;fill:none;stroke:currentColor;opacity:.62;transition:transform .2s ease}
.topbar-profile[aria-expanded="true"] .topbar-profile-chevron{transform:rotate(180deg)}
.topbar-profile-menu{position:absolute;z-index:600;top:calc(100% + 9px);right:0;display:grid;width:250px;padding:7px;border:1px solid color-mix(in srgb,var(--theme-glass-text) 16%,transparent);border-radius:15px;color:var(--theme-glass-text);background:color-mix(in srgb,var(--theme-body-base) 92%,var(--theme-glass-accent) 8%);box-shadow:0 22px 55px rgba(0,0,0,.38);backdrop-filter:blur(18px) saturate(1.08);-webkit-backdrop-filter:blur(18px) saturate(1.08);animation:profileMenuIn .18s cubic-bezier(.2,.75,.25,1) both}
.topbar-profile-menu[hidden]{display:none}
.topbar-profile-menu button{display:grid;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:10px;width:100%;min-height:54px;padding:7px 9px;border:0;border-radius:10px;color:inherit;background:transparent;text-align:left;cursor:pointer}
.topbar-profile-menu button:hover,.topbar-profile-menu button:focus-visible{outline:0;background:color-mix(in srgb,var(--theme-glass-accent) 13%,transparent)}
.topbar-profile-menu button+button{border-top:1px solid color-mix(in srgb,var(--theme-glass-text) 9%,transparent);border-radius:0 0 10px 10px}
.topbar-profile-menu button>svg{width:19px;height:19px;justify-self:center;fill:none;stroke:var(--theme-glass-accent)}
.topbar-profile-menu button>span{display:grid;gap:2px}.topbar-profile-menu button strong{font-size:.73rem}.topbar-profile-menu button small{color:var(--theme-glass-muted);font-size:.61rem}
.topbar-profile-menu button.is-danger>svg,.topbar-profile-menu button.is-danger strong{color:#ffabb5;stroke:#ffabb5}
.topbar-profile-backdrop,.topbar-profile-menu-head{display:none}
@keyframes profileMenuIn{from{opacity:0;transform:translateY(-7px) scale(.98)}to{opacity:1;transform:none}}
@media(max-width:860px){
  .topbar-profile-chevron{display:none}
  .topbar-profile-backdrop{position:fixed;z-index:1290;inset:0;display:block;border:0;background:rgba(3,10,9,.66);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);animation:profileBackdropIn .18s ease both}
  .topbar-profile-backdrop[hidden]{display:none}
  .topbar-profile-menu{position:fixed;z-index:1300;top:50%;right:auto;bottom:auto;left:50%;width:min(360px,calc(100vw - 28px));max-height:calc(100dvh - 28px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow:auto;padding:8px;border-radius:18px;transform:translate(-50%,-50%);animation:profileMobileMenuIn .22s cubic-bezier(.2,.75,.25,1) both}
  .topbar-profile-menu-head{display:grid;grid-template-columns:42px minmax(0,1fr) 36px;align-items:center;gap:10px;padding:8px 8px 13px;border-bottom:1px solid color-mix(in srgb,var(--theme-glass-text) 10%,transparent)}
  .topbar-profile-menu-head>span{display:grid;width:42px;height:42px;place-items:center;border:1px solid color-mix(in srgb,var(--theme-glass-text) 25%,transparent);border-radius:50%;color:color-mix(in srgb,var(--theme-glass-accent) 15%,#08231d);background:var(--theme-glass-accent);font-size:.72rem;font-weight:900}
  .topbar-profile-menu-head>div{display:grid;gap:2px;min-width:0}.topbar-profile-menu-head>div small{color:var(--theme-glass-muted);font-size:.6rem}.topbar-profile-menu-head>div strong{overflow:hidden;font-size:.8rem;text-overflow:ellipsis;white-space:nowrap}
  .topbar-profile-menu-head>button{display:grid!important;width:36px!important;min-height:36px!important;padding:0!important;place-items:center!important;border:1px solid color-mix(in srgb,var(--theme-glass-text) 12%,transparent)!important;border-radius:10px!important}
  .topbar-profile-menu-head>button svg{width:17px!important;height:17px!important;stroke:var(--theme-glass-text)!important}
  .topbar-profile-menu button{min-height:58px}
}

/* Prirucnik se prikazuje unutar portala kao responzivan PDF preglednik. */
body.manual-viewer-open{overflow:hidden}
.manual-viewer-backdrop{position:fixed;z-index:1600;inset:0;display:grid;padding:clamp(10px,2vw,24px);place-items:center;background:rgba(2,10,8,.78);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.manual-viewer-backdrop[hidden]{display:none}
.manual-viewer-dialog{display:grid;width:min(1180px,100%);height:min(900px,calc(100dvh - 32px));grid-template-rows:auto minmax(0,1fr);overflow:hidden;border:1px solid color-mix(in srgb,var(--theme-glass-text) 18%,transparent);border-radius:22px;color:var(--theme-glass-text);background:color-mix(in srgb,var(--theme-body-base) 94%,#000 6%);box-shadow:0 34px 90px rgba(0,0,0,.58);animation:manualViewerIn .24s cubic-bezier(.2,.75,.25,1) both}
.manual-viewer-header{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:76px;padding:12px 16px 12px 22px;border-bottom:1px solid color-mix(in srgb,var(--theme-glass-text) 13%,transparent);background:color-mix(in srgb,var(--theme-body-base) 86%,var(--theme-glass-accent) 5%)}
.manual-viewer-header>div:first-child{display:grid;gap:3px;min-width:0}
.manual-viewer-header p,.manual-viewer-header h2{margin:0}
.manual-viewer-header p{color:var(--theme-glass-accent);font-size:.61rem;font-weight:900;letter-spacing:.12em}
.manual-viewer-header h2{overflow:hidden;font-size:1rem;text-overflow:ellipsis;white-space:nowrap}
.manual-viewer-actions{display:flex;align-items:center;gap:8px}
.manual-viewer-actions a,.manual-viewer-actions button{display:inline-flex;min-height:42px;align-items:center;justify-content:center;gap:8px;border:1px solid color-mix(in srgb,var(--theme-glass-text) 14%,transparent);border-radius:12px;color:var(--theme-glass-text);background:color-mix(in srgb,var(--theme-glass-text) 5%,transparent);font:inherit;font-size:.72rem;font-weight:850;text-decoration:none;cursor:pointer}
.manual-viewer-actions a{padding:0 14px}
.manual-viewer-actions button{width:42px;padding:0}
.manual-viewer-actions :is(a,button):hover,.manual-viewer-actions :is(a,button):focus-visible{outline:0;border-color:color-mix(in srgb,var(--theme-glass-accent) 55%,transparent);background:color-mix(in srgb,var(--theme-glass-accent) 13%,transparent)}
.manual-viewer-actions svg{width:18px;height:18px;fill:none;stroke:currentColor}
.manual-viewer-frame{position:relative;min-height:0;background:#333}
.manual-viewer-frame iframe{position:relative;z-index:1;display:block;width:100%;height:100%;border:0;background:#fff}
.manual-viewer-fallback{position:absolute;z-index:0;inset:50% auto auto 50%;width:min(360px,calc(100% - 32px));margin:0;transform:translate(-50%,-50%);color:#fff;font-size:.8rem;line-height:1.5;text-align:center}
.manual-viewer-fallback a{color:var(--theme-glass-accent)}
@keyframes manualViewerIn{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
@media(max-width:620px){
  .manual-viewer-backdrop{padding:0}
  .manual-viewer-dialog{width:100%;height:100dvh;border:0;border-radius:0}
  .manual-viewer-header{min-height:calc(64px + env(safe-area-inset-top));padding:calc(8px + env(safe-area-inset-top)) 9px 8px 14px}
  .manual-viewer-header p{display:none}
  .manual-viewer-header h2{font-size:.88rem}
  .manual-viewer-actions{gap:6px}
  .manual-viewer-actions a{min-height:40px;padding:0 10px}
  .manual-viewer-actions button{width:40px;min-height:40px}
}
@media(max-width:380px){
  .manual-viewer-actions a span{display:none}
  .manual-viewer-actions a{width:40px;padding:0}
}
@media(prefers-reduced-motion:reduce){.manual-viewer-dialog{animation:none}}
@keyframes profileBackdropIn{from{opacity:0}to{opacity:1}}
@keyframes profileMobileMenuIn{from{opacity:0;transform:translate(-50%,calc(-50% + 14px)) scale(.97)}to{opacity:1;transform:translate(-50%,-50%)}}
@media(prefers-reduced-motion:reduce){.topbar-profile-menu{animation:none}}

/* Desktop profilni dropdown kao nastavak objedinjene topbar alatne trake. */
@media(min-width:861px){
  .topbar-tools{
    position:relative;
    z-index:220;
  }
  .topbar-account{
    z-index:2;
  }
  .topbar-profile-menu{
    top:calc(100% + 12px);
    right:0;
    width:300px;
    padding:9px;
    gap:5px;
    overflow:visible;
    border-color:color-mix(in srgb,var(--theme-glass-accent) 22%,var(--theme-glass-text) 10%);
    border-radius:19px;
    background:
      radial-gradient(circle at 88% 0,color-mix(in srgb,var(--theme-glass-accent) 12%,transparent),transparent 34%),
      color-mix(in srgb,var(--theme-body-base) 97%,#08110f 3%);
    box-shadow:0 28px 76px rgba(0,0,0,.52),inset 0 1px rgba(255,255,255,.07);
    -webkit-backdrop-filter:blur(22px) saturate(1.12);
    backdrop-filter:blur(22px) saturate(1.12);
    transform-origin:top right;
    animation:profileMenuPolishedIn .22s cubic-bezier(.16,1,.3,1) both;
  }
  .topbar-profile-menu::before{
    position:absolute;
    top:-6px;
    right:28px;
    width:11px;
    height:11px;
    border-top:1px solid color-mix(in srgb,var(--theme-glass-accent) 24%,var(--theme-glass-text) 10%);
    border-left:1px solid color-mix(in srgb,var(--theme-glass-accent) 24%,var(--theme-glass-text) 10%);
    background:color-mix(in srgb,var(--theme-body-base) 97%,#08110f 3%);
    content:"";
    transform:rotate(45deg);
  }
  .topbar-profile-menu button{
    grid-template-columns:42px minmax(0,1fr);
    gap:11px;
    min-height:64px;
    padding:8px 10px;
    border:1px solid transparent;
    border-radius:12px!important;
    transition:color .17s ease,border-color .17s ease,background .17s ease,transform .17s ease;
  }
  .topbar-profile-menu button+button{
    border-top-color:transparent;
  }
  .topbar-profile-menu button:hover,
  .topbar-profile-menu button:focus-visible{
    border-color:color-mix(in srgb,var(--theme-glass-accent) 22%,transparent);
    background:color-mix(in srgb,var(--theme-glass-accent) 11%,transparent);
    transform:translateX(2px);
  }
  .topbar-profile-menu button>svg{
    box-sizing:content-box;
    width:20px;
    height:20px;
    padding:9px;
    border-radius:11px;
    background:color-mix(in srgb,var(--theme-glass-accent) 10%,transparent);
  }
  .topbar-profile-menu button>span{
    gap:4px;
  }
  .topbar-profile-menu button strong{
    font-size:.82rem;
  }
  .topbar-profile-menu button small{
    font-size:.67rem;
    line-height:1.3;
  }
  .topbar-profile-menu button.is-danger{
    margin-top:3px;
    border-top:1px solid color-mix(in srgb,var(--theme-glass-text) 9%,transparent);
  }
  .topbar-profile-menu button.is-danger:hover,
  .topbar-profile-menu button.is-danger:focus-visible{
    border-color:rgba(226,95,113,.2);
    background:rgba(143,32,51,.13);
  }
  .topbar-profile-menu button.is-danger>svg{
    background:rgba(143,32,51,.12);
  }
}
@keyframes profileMenuPolishedIn{
  from{opacity:0;transform:translateY(-9px) scale(.965);filter:blur(3px)}
  to{opacity:1;transform:none;filter:none}
}

/* Profilni izbornik dijeli paletu s aktivnom temom, uz nenametljivu aurora animaciju. */
body[data-interface-theme] .topbar-profile-menu{
  isolation:isolate;
  color:var(--uis-text);
  border-color:var(--uis-line-strong);
  background:
    radial-gradient(circle at 12% 8%,var(--uis-accent-soft),transparent 38%),
    linear-gradient(145deg,var(--uis-card),var(--uis-panel));
  box-shadow:0 28px 76px color-mix(in srgb,var(--uis-head) 58%,transparent),inset 0 1px var(--uis-line);
}
body[data-interface-theme][data-interface-surface="glass"] .topbar-profile-menu{
  color:var(--uig-text);
  border-color:var(--uig-line);
  background:
    radial-gradient(circle at 12% 8%,var(--uig-accent-soft),transparent 38%),
    var(--uig-bg);
}
body[data-interface-theme] .topbar-profile-menu::after{
  position:absolute;
  z-index:-1;
  inset:0;
  border-radius:inherit;
  background:
    radial-gradient(circle at 18% 18%,color-mix(in srgb,var(--uis-accent) 20%,transparent),transparent 28%),
    radial-gradient(circle at 84% 74%,color-mix(in srgb,var(--uis-accent) 13%,var(--uis-card-alt)),transparent 32%);
  clip-path:inset(0 round 18px);
  content:"";
  opacity:.72;
  pointer-events:none;
  transform:scale(1.08) translate3d(-2%,0,0);
  animation:profileMenuAurora 9s ease-in-out infinite alternate;
  will-change:transform,opacity;
}
body[data-interface-theme][data-interface-surface="glass"] .topbar-profile-menu::after{
  background:
    radial-gradient(circle at 18% 18%,color-mix(in srgb,var(--uig-accent) 22%,transparent),transparent 28%),
    radial-gradient(circle at 84% 74%,color-mix(in srgb,var(--uig-accent) 14%,transparent),transparent 32%);
}
body[data-interface-theme] .topbar-profile-menu button{
  color:var(--uis-text);
}
body[data-interface-theme] .topbar-profile-menu button>svg{
  color:var(--uis-accent);
  stroke:currentColor;
  background:var(--uis-accent-soft);
}
body[data-interface-theme] .topbar-profile-menu button small{
  color:var(--uis-muted);
}
body[data-interface-theme] .topbar-profile-menu button:hover,
body[data-interface-theme] .topbar-profile-menu button:focus-visible{
  border-color:var(--uis-line-strong);
  background:var(--uis-accent-soft);
}
body[data-interface-theme][data-interface-surface="glass"] .topbar-profile-menu button{
  color:var(--uig-text);
}
body[data-interface-theme][data-interface-surface="glass"] .topbar-profile-menu button>svg{
  color:var(--uig-accent);
  background:var(--uig-accent-soft);
}
body[data-interface-theme][data-interface-surface="glass"] .topbar-profile-menu button small{
  color:var(--uig-muted);
}
body[data-interface-theme][data-interface-surface="glass"] .topbar-profile-menu button:hover,
body[data-interface-theme][data-interface-surface="glass"] .topbar-profile-menu button:focus-visible{
  border-color:var(--uig-line);
  background:var(--uig-accent-soft);
}
@media(min-width:861px){
  body[data-interface-theme] .topbar-profile-menu::before{
    border-color:var(--uis-line-strong) transparent transparent var(--uis-line-strong);
    background:var(--uis-card);
  }
  body[data-interface-theme][data-interface-surface="glass"] .topbar-profile-menu::before{
    border-color:var(--uig-line) transparent transparent var(--uig-line);
    background:color-mix(in srgb,var(--uis-card) 72%,transparent);
  }
}
@keyframes profileMenuAurora{
  0%{opacity:.56;transform:scale(1.08) translate3d(-3%,-2%,0)}
  50%{opacity:.82;transform:scale(1.14) translate3d(3%,1%,0)}
  100%{opacity:.64;transform:scale(1.1) translate3d(-1%,3%,0)}
}
@media(prefers-reduced-motion:reduce){
  body[data-interface-theme] .topbar-profile-menu::after{animation:none;transform:none}
}

/* Završne proporcije profilnog izbornika: kompaktniji desktop i mobilni prikaz bez scrollbara. */
@media(min-width:861px){
  body[data-interface-theme] .topbar-profile-menu{
    width:280px;
    padding:8px;
    gap:3px;
    background:
      radial-gradient(circle at 14% 8%,var(--uis-accent-soft),transparent 34%),
      linear-gradient(145deg,color-mix(in srgb,var(--uis-card) 94%,var(--uis-panel)),var(--uis-panel));
  }
  body[data-interface-theme][data-interface-surface="glass"] .topbar-profile-menu{
    background:
      radial-gradient(circle at 14% 8%,var(--uig-accent-soft),transparent 34%),
      linear-gradient(145deg,color-mix(in srgb,var(--uis-card) 84%,transparent),color-mix(in srgb,var(--uis-panel) 88%,transparent));
  }
  body[data-interface-theme] .topbar-profile-menu button{
    grid-template-columns:38px minmax(0,1fr);
    min-height:57px;
    padding:7px 9px;
  }
  body[data-interface-theme] .topbar-profile-menu button>svg{
    width:18px;
    height:18px;
    padding:8px;
    border-radius:10px;
  }
  body[data-interface-theme] .topbar-profile-menu button strong{font-size:.77rem}
  body[data-interface-theme] .topbar-profile-menu button small{font-size:.63rem}
}
@media(max-width:860px){
  body[data-interface-theme] .topbar-profile-menu{
    box-sizing:border-box;
    width:min(360px,calc(100vw - 28px));
    max-width:calc(100vw - 28px);
    max-height:none;
    overflow:hidden;
    overscroll-behavior:none;
    scrollbar-width:none;
  }
  body[data-interface-theme] .topbar-profile-menu::-webkit-scrollbar{display:none}
  body[data-interface-theme] .topbar-profile-menu button,
  body[data-interface-theme] .topbar-profile-menu-head{
    box-sizing:border-box;
    min-width:0;
    max-width:100%;
  }
  body[data-interface-theme] .topbar-profile-menu button{
    min-height:56px;
  }
  body[data-interface-theme] .topbar-profile-menu button>svg,
  body[data-interface-theme][data-interface-surface="glass"] .topbar-profile-menu button>svg{
    background:transparent;
  }
}
@media(max-width:860px) and (max-height:520px){
  body[data-interface-theme] .topbar-profile-menu{padding:6px}
  body[data-interface-theme] .topbar-profile-menu-head{
    grid-template-columns:36px minmax(0,1fr) 34px;
    padding:5px 7px 8px;
  }
  body[data-interface-theme] .topbar-profile-menu-head>span{width:36px;height:36px}
  body[data-interface-theme] .topbar-profile-menu button{
    grid-template-columns:34px minmax(0,1fr);
    min-height:47px;
    padding:5px 8px;
  }
  body[data-interface-theme] .topbar-profile-menu button>svg{width:17px;height:17px}
  body[data-interface-theme] .topbar-profile-menu button small{font-size:.58rem}
}

/* The avatar chooser belongs directly to the profile flow, without a second panel behind it. */
body[data-interface-surface] .profile-avatar-form,
body[data-interface-surface="glass"] .profile-avatar-form,
body[data-interface-surface="themed"] .profile-avatar-form{
  color:var(--theme-glass-text)!important;
  border:0!important;
  border-top:1px solid color-mix(in srgb,var(--theme-glass-text) 18%,transparent)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}

/* Profile workspace: compact professional sections instead of a long settings wall. */
.profile-preferences{display:grid;gap:16px;margin-top:24px}
.profile-preferences>header{display:flex;align-items:end;justify-content:space-between;gap:24px;padding:0 2px 14px;border-bottom:1px solid color-mix(in srgb,var(--theme-glass-text) 16%,transparent)}
.profile-preferences>header>div{display:grid;gap:4px}
.profile-preferences>header span{color:var(--theme-glass-accent);font-size:.63rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase}
.profile-preferences>header h4{margin:0;color:var(--theme-glass-text);font-size:1.25rem;letter-spacing:-.02em}
.profile-preferences>header p{max-width:470px;margin:0;color:var(--theme-glass-muted);font-size:.72rem;line-height:1.55;text-align:right}
.profile-preference-list{display:grid;gap:0;overflow:hidden;border:1px solid var(--ui-panel-line);border-radius:18px}
.profile-preference-panel{overflow:hidden;border:1px solid color-mix(in srgb,var(--theme-glass-text) 15%,transparent);border-radius:18px;background:color-mix(in srgb,var(--theme-body-base) 72%,transparent);box-shadow:inset 0 1px 0 color-mix(in srgb,var(--theme-glass-text) 4%,transparent);transition:border-color .22s ease,background .22s ease,box-shadow .22s ease}
.profile-preference-panel::details-content{block-size:0;overflow:clip;opacity:0;transition:block-size .38s cubic-bezier(.2,.8,.2,1),content-visibility .38s allow-discrete,opacity .24s ease}
.profile-preference-panel[open]::details-content{block-size:auto;opacity:1}
.profile-preference-panel[open]{border-color:color-mix(in srgb,var(--theme-glass-accent) 42%,transparent);background:color-mix(in srgb,var(--theme-body-base) 86%,var(--theme-glass-accent) 3%);box-shadow:inset 0 1px 0 color-mix(in srgb,var(--theme-glass-text) 6%,transparent),0 16px 38px rgba(0,0,0,.12)}
.profile-preference-panel>summary{display:grid;grid-template-columns:42px minmax(0,1fr) 34px;align-items:center;gap:14px;min-height:78px;padding:12px 18px;list-style:none;cursor:pointer;user-select:none}
.profile-preference-panel>summary::-webkit-details-marker{display:none}
.profile-preference-panel>summary>b{display:grid;width:38px;height:38px;place-items:center;border:1px solid color-mix(in srgb,var(--theme-glass-text) 16%,transparent);border-radius:12px;color:var(--theme-glass-accent);background:color-mix(in srgb,var(--theme-glass-text) 4%,transparent);font-size:.68rem;letter-spacing:.06em}
.profile-preference-panel>summary>span{display:grid;gap:4px;min-width:0}
.profile-preference-panel>summary strong{color:var(--theme-glass-text);font-size:.88rem}
.profile-preference-panel>summary small{color:var(--theme-glass-muted);font-size:.67rem;line-height:1.4}
.profile-preference-panel>summary>i{display:grid;width:32px;height:32px;place-items:center;border-radius:10px;color:var(--theme-glass-muted);background:color-mix(in srgb,var(--theme-glass-text) 4%,transparent);transition:transform .22s ease,color .22s ease}
.profile-preference-panel>summary>i svg{width:16px;height:16px;fill:none;stroke:currentColor}
.profile-preference-panel[open]>summary>i{color:var(--theme-glass-accent);transform:rotate(180deg)}
.profile-preference-content{padding:0 18px 20px;transform-origin:top}
.profile-preference-content.is-opening{animation:profileAccordionContent .34s cubic-bezier(.2,.8,.2,1) both}
.profile-preference-content::before{content:"";display:block;height:1px;margin-bottom:18px;background:color-mix(in srgb,var(--theme-glass-text) 10%,transparent)}
.profile-preference-list>.profile-preference-panel{border:0;border-bottom:1px solid var(--ui-panel-line);border-radius:0;box-shadow:none}
.profile-preference-list>.profile-preference-panel:last-child{border-bottom:0}
.profile-preference-list>.profile-preference-panel[open]{box-shadow:inset 3px 0 var(--ui-panel-accent)}
body[data-interface-surface] .profile-preference-panel .profile-theme-form,
body[data-interface-surface="glass"] .profile-preference-panel .profile-theme-form,
body[data-interface-surface="themed"] .profile-preference-panel .profile-theme-form,
.profile-preference-panel .profile-theme-form{margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.profile-preference-panel .profile-theme-heading{display:none}
.profile-preference-panel .profile-avatar-grid{margin-top:0}
.profile-preference-panel .profile-theme-grid,
.profile-preference-panel .profile-font-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.profile-preference-panel .profile-animation-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.profile-glass-control{margin-top:18px;padding:16px 18px;border:1px solid var(--uis-line-strong,var(--theme-glass-line));border-radius:16px;color:var(--uis-text,var(--theme-glass-text));background:color-mix(in srgb,var(--uis-inset,var(--theme-glass-card)) 72%,transparent)}
.profile-glass-control[hidden]{display:none!important}
.profile-glass-control-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.profile-glass-control-heading span{display:grid;gap:3px}
.profile-glass-control-heading strong{font-size:15px;color:var(--uis-text,var(--theme-glass-text))}
.profile-glass-control-heading small,.profile-glass-scale{color:var(--uis-muted,var(--theme-glass-muted))}
.profile-glass-control-heading output{min-width:58px;padding:7px 10px;border-radius:10px;text-align:center;font-weight:800;color:var(--uis-head,var(--theme-glass-text));background:var(--uis-accent-soft,color-mix(in srgb,var(--theme-glass-accent) 15%,transparent))}
.profile-glass-control input[type="range"]{width:100%;height:6px;margin:20px 0 9px;cursor:pointer;accent-color:var(--uis-accent,var(--theme-glass-accent))}
.profile-glass-scale{display:flex;justify-content:space-between;gap:12px;font-size:11px;font-weight:700}
.profile-preference-panel :is(.profile-animation-form,.profile-material-form,.profile-animation-grid,.profile-material-groups,.profile-material-groups fieldset,.profile-material-options){background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.profile-preference-panel :is(.profile-animation-form,.profile-material-form,.profile-animation-grid,.profile-material-groups)::before,
.profile-preference-panel :is(.profile-animation-form,.profile-material-form,.profile-animation-grid,.profile-material-groups)::after{content:none!important;display:none!important}
.profile-preference-panel .profile-preference-content,
.profile-preference-panel .profile-preference-content>form,
.profile-preference-panel .profile-material-groups,
.profile-preference-panel .profile-material-groups>fieldset,
.profile-preference-panel .profile-material-options,
.profile-preference-panel .profile-animation-grid{
  background:none!important;
  background-color:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  outline:0!important;
}
.profile-preference-panel .profile-preference-content>form::before,
.profile-preference-panel .profile-preference-content>form::after,
.profile-preference-panel .profile-material-groups::before,
.profile-preference-panel .profile-material-groups::after,
.profile-preference-panel .profile-material-groups>fieldset::before,
.profile-preference-panel .profile-material-groups>fieldset::after{
  content:none!important;
  display:none!important;
  background:none!important;
}
.profile-preference-content.is-opening :is(.profile-animation-option,.profile-material-option){animation:profilePreferenceChoiceIn .38s cubic-bezier(.2,.8,.2,1) both}
.profile-preference-content.is-opening :is(.profile-animation-option,.profile-material-option):nth-child(2){animation-delay:45ms}
.profile-preference-content.is-opening :is(.profile-animation-option,.profile-material-option):nth-child(3){animation-delay:90ms}
.profile-preference-content.is-opening :is(.profile-animation-option,.profile-material-option):nth-child(4){animation-delay:135ms}
.profile-preference-content.is-opening .profile-material-groups fieldset:nth-child(2) .profile-material-option:first-child{animation-delay:90ms}
.profile-preference-content.is-opening .profile-material-groups fieldset:nth-child(2) .profile-material-option:nth-child(2){animation-delay:135ms}
@keyframes profileAccordionContent{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@keyframes profilePreferenceChoiceIn{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
@supports(interpolate-size:allow-keywords){:root{interpolate-size:allow-keywords}}

/* The single save action exists only while the page has unsaved changes. */
.profile-save-bar{position:fixed!important;right:clamp(14px,3vw,42px)!important;bottom:clamp(14px,3vw,28px)!important;left:auto!important;z-index:180!important;width:min(560px,calc(100vw - 28px))!important;margin:0!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translateY(24px) scale(.98)!important}
.profile-save-bar.has-changes{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:none!important}

@media(max-width:900px){
  body[data-view="profile"] .topbar-secondary{display:block;padding:10px 12px}
  body[data-view="profile"] .topbar-secondary>.topbar-title{margin-bottom:9px}
  .profile-topbar-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  body[data-view="profile"] .profile-topbar-summary .profile-page-hero{min-height:0}
  body[data-view="profile"] .profile-topbar-summary>div,
  body[data-view="profile"] .profile-topbar-summary>.own-profile-pin{min-height:70px}
  body[data-view="profile"] .profile-topbar-summary.is-pin-revealed>.own-profile-pin,
  body[data-view="profile"] .profile-topbar-summary.is-pin-revealed>.own-profile-pin-notice{grid-column:1/-1}
  .profile-preferences>header{align-items:flex-start;flex-direction:column;gap:6px}
  .profile-preferences>header p{text-align:left}
  .profile-preference-panel .profile-avatar-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .profile-preference-panel .profile-animation-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(min-width:901px) and (max-width:1380px){
  body[data-view="profile"] .topbar-secondary{grid-template-columns:145px minmax(0,1fr);gap:12px}
  .profile-topbar-summary{grid-template-columns:repeat(4,minmax(150px,1fr));gap:7px}
  body[data-view="profile"] .profile-topbar-summary .profile-work-position{display:none}
}
@media(max-width:620px){
  .profile-topbar-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  html body[data-view="profile"] .profile-topbar-summary .profile-page-hero,
  html body[data-view="profile"] .profile-topbar-summary>.own-profile-pin{grid-column:1/-1;height:auto!important;min-height:78px!important;padding:12px 13px!important}
  html body[data-view="profile"] .profile-topbar-summary>div{height:auto!important;min-height:72px!important;padding:11px 12px!important}
  body[data-view="profile"] .profile-topbar-summary .profile-page-hero .own-profile-head{width:100%;gap:12px}
  body[data-view="profile"] .profile-topbar-summary .profile-page-hero .own-profile-head h3{font-size:1.05rem}
  body[data-view="profile"] .profile-topbar-summary .profile-work-position{display:none}
  html body[data-view="profile"] .profile-topbar-summary>.own-profile-pin{display:flex;align-items:center;justify-content:space-between;flex-direction:row;gap:12px}
  body[data-view="profile"] .profile-topbar-summary>.own-profile-pin>span{display:grid;gap:4px;min-width:0}
  html body[data-view="profile"] .profile-topbar-summary #revealOwnPin{width:auto;flex:none;min-height:38px;padding:0 13px;font-size:.68rem}
  body[data-view="profile"] .profile-topbar-summary .profile-page-hero .own-profile-head>span{width:40px;height:40px}
  body[data-view="profile"] .profile-topbar-summary .profile-page-hero .own-profile-head h3{font-size:.94rem}
  .profile-preferences{margin-top:18px}
  .profile-preference-list{border-radius:15px}
  .profile-preference-panel{border-radius:0}
  .profile-preference-panel>summary{grid-template-columns:36px minmax(0,1fr) 30px;gap:10px;min-height:70px;padding:10px 12px}
  .profile-preference-panel>summary>b{width:34px;height:34px;border-radius:10px}
  .profile-preference-content{padding:0 12px 14px}
  .profile-preference-panel .profile-avatar-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .profile-preference-panel .profile-theme-grid,
  .profile-preference-panel .profile-font-grid,
  .profile-preference-panel .profile-animation-grid{grid-template-columns:1fr}
  .profile-save-bar{right:8px!important;bottom:calc(8px + env(safe-area-inset-bottom))!important;left:8px!important;width:auto!important}
  .profile-save-bar.has-changes{transform:none!important}
}
@media(prefers-reduced-motion:reduce){
  .profile-preference-panel::details-content{transition:none}
  .profile-preference-content,
  .profile-preference-content :is(.profile-animation-option,.profile-material-option),
  body[data-view="profile"] .profile-account-overview.is-pin-revealed .own-profile-pin,
  body[data-view="profile"] .own-profile-pin-notice{animation:none!important}
}

/* Stacked account cards must remain fully visible on narrow phones. */
@media(max-width:480px){
  body[data-view="profile"] .profile-account-overview .own-profile-grid{
    max-height:none;
    overflow:visible;
  }
}

/* Profilna slika ostaje optički centrirana u oba mobilna prikaza. */
@media(max-width:860px){
  .topbar-account{
    display:grid;
    width:44px;
    min-width:44px;
    place-items:center;
  }

  .topbar-profile{
    display:grid!important;
    grid-template-columns:44px!important;
    width:44px!important;
    min-width:44px!important;
    height:44px!important;
    min-height:44px!important;
    gap:0!important;
    padding:0!important;
    place-items:center!important;
  }

  .topbar-profile>span{
    grid-area:1/1;
    margin:0!important;
    place-self:center!important;
    transform:none!important;
  }

  .topbar-profile>span.has-profile-avatar{
    background-position:50% 50%!important;
  }

  .topbar-profile-chevron{
    display:none!important;
  }

  .topbar-profile>strong{
    display:none!important;
  }

  body[data-view="profile"] .own-profile-head>span.has-profile-avatar{
    flex:0 0 auto;
    align-self:center;
    background-position:50% 50%!important;
  }
}
