.my-space{display:none}
  .my-space[open]{display:flex;flex-direction:column;position:fixed;inset:0;width:100%;max-width:none;height:100vh;height:100dvh;max-height:none;box-sizing:border-box;margin:0;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom);border:0;color:var(--dark);background:var(--background);font-family:var(--sans);overflow:hidden}
  .my-space::backdrop{background:var(--background)}
  .my-space-heading{display:flex;align-items:center;justify-content:space-between;flex-shrink:0;padding:20px 24px 12px}
  .my-space-brand{margin-bottom:8px}
  .my-space-brand .brand{font-size:28px}
  .my-space-brand .brand-icon{width:12px;height:12px}
  .my-space-heading h1{margin:0;font-family:var(--serif);font-size:34px;font-weight:400}
  .my-space-close{display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:transparent;color:var(--primary-dark);font-size:28px;cursor:pointer}
  .my-space-content{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:20px 24px 28px}
  .my-space-identity{display:flex;align-items:center;gap:16px;padding:20px 18px;border:0;border-radius:20px;background:#f2e5e8}
  a.my-space-identity{color:var(--dark);text-decoration:none}
  a.my-space-identity:hover{background:#ecdae0}
  .my-space-identity img,.my-space-avatar{flex-shrink:0;width:60px;height:60px;border:3px solid var(--white);border-radius:50%;object-fit:cover}
  .my-space-avatar{display:grid;place-items:center;background:var(--white);color:var(--primary-dark);font-family:var(--serif);font-size:28px}
  .my-space-identity>div{min-width:0;display:grid;gap:5px}
  .my-space-identity strong{font-size:18px;line-height:1.3;overflow-wrap:anywhere}
  .my-space-identity span{font-size:12px;color:var(--muted)}
  .my-space-identity small{display:flex;align-items:center;gap:6px;margin-top:2px;color:var(--primary-dark);font-size:12px;font-weight:700}
  .my-space-group{padding:22px 0 18px;border-bottom:1px solid #e8dadd}
  .my-space-group h2{margin:0 0 8px;font-size:11px;line-height:1.5;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--primary-dark)}
  .my-space-group a{position:relative;display:flex;align-items:center;gap:12px;min-height:48px;padding:13px 28px 13px 38px;border-radius:10px;font-size:14px;line-height:1.5;color:var(--dark)}
  .my-space-group a::after{position:absolute;right:8px;top:50%;transform:translateY(-50%);content:'›';color:#a75565;font-size:22px;font-weight:400}
  .my-space [data-space-icon="wallet"]{--space-icon:url("../icons/wallet.d62d1dae31c1.svg")}
  .my-space-group a[data-space-complete]{margin:8px 0;background:var(--rose-tint);color:var(--primary-dark);font-weight:700}
  .my-space-group a:hover{background:var(--surface-muted)}
  .my-space-legal{display:grid;padding:0 0 4px 12px}
  .my-space-legal a{position:relative;display:flex;align-items:center;min-height:48px;padding:13px 28px 13px 38px;color:var(--dark);font-size:14px}
  .my-space-logout button{position:relative;width:100%;min-height:48px;padding:12px 16px 12px 38px;border:0;border-radius:10px;background:transparent;color:var(--primary-dark);font:700 14px var(--sans);text-align:left;cursor:pointer}
  .my-space-logout button:hover,.my-space-close:hover{background:#f2e5e8}
  .my-space :is(a,button):focus-visible{outline:2px solid var(--primary-dark);outline-offset:2px}
  .my-space-privacy>summary,.my-space-juridical>summary{position:relative;display:flex;align-items:center;min-height:48px;padding:13px 28px 13px 38px;border-radius:10px;font-size:14px;line-height:1.5;cursor:pointer;list-style:none}
  .my-space-privacy>summary::-webkit-details-marker,.my-space-juridical>summary::-webkit-details-marker,.my-space-account-options>summary::-webkit-details-marker{display:none}
  .my-space-privacy>summary::after,.my-space-juridical>summary::after{content:'›';position:absolute;right:8px;color:#a75565;font-size:22px}
  .my-space-privacy[open]>summary::after,.my-space-juridical[open]>summary::after{transform:rotate(90deg)}
  .my-space-privacy summary small,.my-space-privacy-content a small{display:block;margin-top:4px;font-size:12px;line-height:1.6;font-weight:400;color:var(--muted)}
  .my-space-privacy-content{padding:4px 0 8px}
  .my-space-privacy-content a{align-items:flex-start}
  .my-space-privacy-content a>span{min-width:0}
  .my-space-account-options{margin:0 8px;border-top:1px solid #e8dadd}
  .my-space-account-options>summary{display:flex;align-items:center;min-height:44px;color:var(--muted);font-size:12px;cursor:pointer;list-style:none}
  .my-space-account-options>summary::after{content:'+';margin-left:auto;font-size:16px}
  .my-space-account-options[open]>summary::after{content:'−'}
  .my-space-account-options p{margin:0 0 6px;font-size:12px;line-height:1.6;color:var(--muted)}
  .my-space-account-options a{font-size:12px;color:var(--muted)}
  .my-space summary:focus-visible{outline:2px solid var(--primary-dark);outline-offset:2px}

/* Decorative SVG masks stay scoped to the mobile panel. No icon library. */
  .my-space [data-space-icon="person"]{--space-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%227%22%20r%3D%223.5%22%2F%3E%3Cpath%20d%3D%22M5%2021v-2a7%207%200%200%201%2014%200v2%22%2F%3E%3C%2Fsvg%3E")}
  .my-space [data-space-icon="people"]{--space-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%228%22%20cy%3D%227%22%20r%3D%223%22%2F%3E%3Ccircle%20cx%3D%2217%22%20cy%3D%228%22%20r%3D%222%22%2F%3E%3Cpath%20d%3D%22M2%2021v-3a6%206%200%200%201%2012%200v3M16%2014a5%205%200%200%201%206%205v2%22%2F%3E%3C%2Fsvg%3E")}
  .my-space-identity small,.my-space [data-space-icon="book"]{--space-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%205.5A2.5%202.5%200%200%201%206.5%203H11v16H6.5A2.5%202.5%200%200%200%204%2021.5zM20%205.5A2.5%202.5%200%200%200%2017.5%203H13v16h4.5a2.5%202.5%200%200%201%202.5%202.5z%22%2F%3E%3C%2Fsvg%3E")}
  .my-space [data-space-icon="bookmark"]{--space-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%203h12v18l-6-4-6%204z%22%2F%3E%3C%2Fsvg%3E")}
  .my-space [data-space-icon="invite"]{--space-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%229%22%20cy%3D%227%22%20r%3D%223.5%22%2F%3E%3Cpath%20d%3D%22M2%2021v-2a7%207%200%200%201%2014%200v2M19%207v6M16%2010h6%22%2F%3E%3C%2Fsvg%3E")}
  .my-space [data-space-icon="review"]{--space-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%204h16v13H9l-5%204zM8%208h8M8%2012h5%22%2F%3E%3C%2Fsvg%3E")}
  .my-space [data-space-icon="support"]{--space-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2014v-2a9%209%200%200%201%2018%200v2M3%2012h3v7H3zM18%2012h3v7h-3zM21%2019a3%203%200%200%201-3%203h-4%22%2F%3E%3C%2Fsvg%3E")}
  .my-space [data-space-icon="document"]{--space-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M5%203h9l5%205v13H5zM14%203v5h5M8%2012h8M8%2016h6%22%2F%3E%3C%2Fsvg%3E")}
  .my-space-logout button{--space-icon:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M10%203H4v18h6M9%2012h12M17%208l4%204-4%204%22%2F%3E%3C%2Fsvg%3E")}
  .my-space [data-space-icon="edit"]{--space-icon:url("../icons/pencil.f68a53fde85f.svg")}
  .my-space [data-space-icon="bell"]{--space-icon:url("../icons/bell.3cd5db9d4463.svg")}
  .my-space [data-space-icon="plan"]{--space-icon:url("../icons/crown.5ea4f472c324.svg")}
  .my-space [data-space-icon="privacy"]{--space-icon:url("../icons/shield.35116a3bb787.svg")}
  .my-space [data-space-icon="question"]{--space-icon:url("../icons/question.0de85537c742.svg")}
  .my-space [data-space-icon="app"]{--space-icon:url("../icons/app-install.c68af4088381.svg")}
  .my-space [data-space-icon]::before,.my-space-logout button::before{content:"";position:absolute;left:6px;top:50%;transform:translateY(-50%);width:20px;height:20px;background:#a75565;-webkit-mask:var(--space-icon) center / contain no-repeat;mask:var(--space-icon) center / contain no-repeat}
  .my-space-identity small::before{content:"";flex-shrink:0;width:14px;height:14px;background:#a75565;-webkit-mask:var(--space-icon) center / contain no-repeat;mask:var(--space-icon) center / contain no-repeat}
/* The diary uses the supplied icon; the menu keeps its existing wine tint. */
.my-space [data-space-icon="notebook"]{--space-icon:url("../icons/notebook.8d07d6b0287d.svg")}

@media (min-width:761px) and (orientation:landscape), (min-width:1025px){
  .my-space[open]{inset:20px 20px 20px auto;width:480px;max-width:calc(100vw - 40px);height:calc(100dvh - 40px);padding:0;border:1px solid #e8dadd;border-radius:24px;box-shadow:0 24px 80px rgba(31,16,22,.2)}
  .my-space::backdrop{background:rgba(31,16,22,.3)}
  .my-space-heading{padding:24px 28px 16px;border-bottom:1px solid #e8dadd}
  .my-space-content{padding:24px 28px 28px;scrollbar-width:thin}
  .my-space-group a{min-height:48px}
}