/* Final Settings surface for the controlled PEARL / NACRE pilot.
   This intentionally removes the spreadsheet/slab treatment from Settings only. */

.settings-profile-grid{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(280px,.85fr);
  gap:18px;
  margin-bottom:30px;
}
.settings-profile-card{
  position:relative;
  overflow:hidden;
  min-width:0;
  padding:22px 24px;
  border:1px solid var(--border);
  border-radius:24px;
  background:linear-gradient(145deg,rgba(255,255,255,.60),rgba(255,255,255,.25));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.62),0 18px 44px rgba(72,64,78,.07);
  backdrop-filter:blur(18px) saturate(118%);
  -webkit-backdrop-filter:blur(18px) saturate(118%);
}
.settings-profile-card h2,.settings-profile-card h3{margin:5px 0 7px}
.settings-profile-card p{margin:0}
.settings-profile-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.settings-profile-actions .btn{min-height:44px;padding:10px 16px;border-radius:15px}

/* The section itself is editorial whitespace, never a giant rectangular card. */
body[data-seelo-theme="nacre"] .settings-section,
.settings-section{
  display:block;
  margin:30px 0 0;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  overflow:visible!important;
}
.settings-section>div:first-child{margin-bottom:14px}
.settings-section>div:first-child h2{font-size:27px;letter-spacing:-.025em;margin:4px 0 7px}
.settings-section>div:first-child p{max-width:700px;margin:0;line-height:1.5}

/* Theme is one compact material tile, not a full-width row. */
.settings-appearance-compact{
  display:flex;
  align-items:center;
  gap:14px;
  width:min(520px,100%);
  min-height:78px;
  padding:14px 16px;
  border:1px solid rgba(77,67,86,.12);
  border-radius:20px;
  background:linear-gradient(145deg,rgba(255,255,255,.61),rgba(255,255,255,.24));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.62),0 14px 34px rgba(72,64,78,.06);
  backdrop-filter:blur(16px) saturate(118%);
  -webkit-backdrop-filter:blur(16px) saturate(118%);
}
.appearance-material{
  flex:0 0 50px;
  width:50px;
  height:50px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.68);
  background-image:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.28)),var(--ops-pearl-asset);
  background-size:cover;
  background-position:center;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.70),0 8px 20px rgba(70,61,78,.10);
}
.settings-appearance-compact span:last-child{display:grid;gap:3px}
.settings-appearance-compact b{font-size:14px;letter-spacing:.01em}
.settings-appearance-compact small{font-size:12px}

/* Administration is a compact card grid, never stacked spreadsheet rows. */
.settings-admin-section{padding-top:4px!important}
.settings-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  align-items:stretch;
}
body[data-seelo-theme="nacre"] .settings-card,
.settings-card{
  appearance:none;
  -webkit-appearance:none;
  position:relative;
  overflow:hidden;
  isolation:isolate;
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  align-items:start;
  gap:14px;
  width:100%;
  min-width:0;
  min-height:158px;
  margin:0;
  padding:18px;
  text-align:left;
  color:var(--ink);
  font:inherit;
  border:1px solid rgba(77,67,86,.12)!important;
  border-radius:22px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.61),rgba(255,255,255,.24))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.60),0 15px 36px rgba(72,64,78,.065)!important;
  backdrop-filter:blur(17px) saturate(118%)!important;
  -webkit-backdrop-filter:blur(17px) saturate(118%)!important;
  cursor:pointer;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background .16s ease;
}
.settings-card::after{
  content:"";
  position:absolute;
  z-index:-1;
  right:-34px;
  top:-42px;
  width:136px;
  height:118px;
  border-radius:48% 52% 66% 34%/42% 58% 42% 58%;
  background:radial-gradient(circle at 38% 42%,rgba(255,255,255,.42),rgba(207,226,232,.13) 34%,rgba(207,190,216,.08) 58%,transparent 72%);
  filter:blur(2px);
  pointer-events:none;
}
body[data-seelo-theme="nacre"] .settings-card:hover,
.settings-card:hover{
  transform:translateY(-2px);
  border-color:color-mix(in srgb,var(--accent) 30%,var(--border))!important;
  background:linear-gradient(145deg,rgba(255,255,255,.72),color-mix(in srgb,var(--accent-soft) 13%,rgba(255,255,255,.28)))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72),0 19px 40px rgba(72,64,78,.09)!important;
}
.settings-icon{
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border:1px solid rgba(86,74,94,.12);
  border-radius:14px;
  background:rgba(255,255,255,.46);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.66);
  font-size:18px;
  line-height:1;
  color:var(--accent-dark);
}
.settings-card .k{margin:1px 0 8px;letter-spacing:.13em}
.settings-card h3{margin:0 0 8px;font-size:20px;letter-spacing:-.02em}
.settings-card p{margin:0;font-size:13px;line-height:1.48;color:var(--muted)}

@media(max-width:1050px){
  .settings-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .settings-profile-grid{grid-template-columns:1fr}
  .settings-grid{grid-template-columns:1fr}
  .settings-card{min-height:0}
}