/* READMADE palette (purple / pink / aqua) shared with home, submit and studio. */
body.publishing-app[data-page="mypage"] {
  --rm-ink:#16161c; --rm-ink-soft:#55545e; --rm-paper:#fffefa; --rm-paper-warm:#fff8e9; --rm-panel:#f4f4f8; --rm-line:#dedde6;
  --rm-purple:#6439e8; --rm-purple-deep:#4d2cc0; --rm-coral:#f42c8d; --rm-yellow:#ffc223; --rm-aqua:#08bdb9; --rm-mint:#dcf9f7;
  --header-height:70px; --bg:#ffffff; --surface:var(--rm-paper); --surface-strong:#fff; --surface-muted:var(--rm-panel); --surface-tint:#eeeaff;
  --text:var(--rm-ink); --text-soft:#414252; --muted:var(--rm-ink-soft); --line:var(--rm-line); --line-strong:#bbb8cb;
  --brand:var(--rm-purple); --brand-strong:var(--rm-purple-deep); --brand-soft:#eeeaff; --accent:var(--rm-coral); --accent-soft:#ffe4f0;
  --success:#277e6d; --success-soft:var(--rm-mint); --warning:#a96c16; --warning-soft:#fff0bf; --danger:#d85259; --focus:#4d35ca;
  --ink:var(--rm-ink); --ink-text:var(--rm-paper); --shadow:0 22px 54px rgba(37,30,69,.12); --shadow-small:0 10px 25px rgba(37,30,69,.1);
  --radius:22px; --radius-small:12px; background:#fff;
}
html[data-theme="dark"] body.publishing-app[data-page="mypage"] {
  --rm-ink:#f9f7ff; --rm-ink-soft:#c3bfce; --rm-paper:#18171e; --rm-paper-warm:#24202a; --rm-panel:#24202a; --rm-line:#464150;
  --rm-purple:#a491ff; --rm-purple-deep:#c3b8ff; --rm-coral:#ff7ab8; --rm-mint:#173c3d;
  --surface-strong:#211f2a; --surface-tint:#302752; --text-soft:#dfd9e9; --line-strong:#575264; --brand-soft:#302752; --accent-soft:#512f3d;
  --warning-soft:#4c3a1f; --ink:#12111a; --bg:var(--rm-paper-warm); background:var(--rm-paper-warm);
}
/* Member workspace. Shared login/signup and console styles stay page scoped. */
.rm-mypage-shell { width:min(1180px,calc(100% - 40px)); }
.rm-mypage-card { padding:clamp(20px,4vw,42px); }
.rm-mypage-card > h1 { margin-bottom:26px; }
.rm-mypage-content { gap:24px; }
.rm-mypage-content > .rm-account-status:empty { display:none; }
.rm-member-top-grid { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(270px,1fr); gap:20px; }
.rm-member-continue,.rm-member-plan,.rm-member-tool { border:1px solid var(--line); border-radius:16px; padding:24px; min-width:0; }
.rm-member-continue { background:linear-gradient(135deg,var(--brand-soft),var(--surface)); }
.rm-member-eyebrow { margin:0 0 10px; font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((12px) * var(--rm-ui-type-scale, 1.2))), 1px); font-weight:800; letter-spacing:.1em; color:var(--brand-strong); }
.rm-member-top-grid h2,.rm-member-section-heading h2 { margin:0 0 14px; font-size:1.3rem; line-height:1.4; }
.rm-member-continue h3 { margin:0 0 10px; font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((clamp(1.25rem,2vw,1.7rem)) * var(--rm-ui-type-scale, 1.2))), 1px); line-height:1.4; overflow-wrap:anywhere; }
.rm-member-continue > p:not(.rm-member-eyebrow),.rm-member-plan > p,.rm-member-section-heading > p:last-child { margin:0 0 14px; color:var(--muted); line-height:1.65; }
.rm-member-continue .rm-member-resume-meta { font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((.83rem) * var(--rm-ui-type-scale, 1.2))), 1px); }
.rm-member-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:22px; }
.rm-member-actions a { width:auto; min-height:44px; padding:10px 18px; }
.rm-member-panel-top { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:12px; margin-bottom:16px; }
.rm-member-panel-top h2 { margin:0; }
.rm-member-badge { display:inline-flex; align-items:center; border-radius:999px; padding:5px 10px; font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((.75rem) * var(--rm-ui-type-scale, 1.2))), 1px); line-height:1.4; font-weight:800; color:var(--brand-strong); background:color-mix(in srgb,var(--brand) 10%,var(--surface)); }
.rm-member-badge.is-active { color:var(--brand-strong); border:1px solid color-mix(in srgb,var(--brand) 40%,var(--line)); }
.rm-member-plan-name { display:block; margin-bottom:12px; font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((1.45rem) * var(--rm-ui-type-scale, 1.2))), 1px); line-height:1.4; }
.rm-member-benefits { list-style:none; margin:16px 0 20px; padding:0; display:grid; gap:9px; font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((.9rem) * var(--rm-ui-type-scale, 1.2))), 1px); }
.rm-member-benefits li::before { content:'✓'; margin-right:9px; color:var(--brand-strong); font-weight:900; }
.rm-member-text-link { font-weight:800; font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((.9rem) * var(--rm-ui-type-scale, 1.2))), 1px); }
.rm-member-overview { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border:1px solid var(--line); border-radius:14px; padding:20px 0; }
.rm-member-overview > div { display:flex; flex-direction:column; gap:6px; align-items:center; text-align:center; padding:0 14px; }
.rm-member-overview > div + div { border-left:1px solid var(--line); }
.rm-member-overview strong { font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((1.8rem) * var(--rm-ui-type-scale, 1.2))), 1px); color:var(--brand-strong); line-height:1.2; }
.rm-member-overview span { font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((.83rem) * var(--rm-ui-type-scale, 1.2))), 1px); color:var(--muted); }
.rm-mypage-content .rm-local-projects { padding:24px; }
.rm-member-storage-note { border-left:3px solid var(--brand); background:color-mix(in srgb,var(--brand) 5%,var(--surface)); padding:14px 16px; border-radius:0 9px 9px 0; font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((.85rem) * var(--rm-ui-type-scale, 1.2))), 1px); }
.rm-local-projects .rm-member-storage-note p { font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((.83rem) * var(--rm-ui-type-scale, 1.2))), 1px); margin:5px 0 0; }
.rm-mypage-content .rm-local-project-list { gap:12px; }
.rm-mypage-content .rm-local-project-list li { border:1px solid var(--line); border-radius:12px; padding:16px; gap:12px; align-items:flex-start; }
.rm-member-project-info { flex:1 1 280px; min-width:0; }
.rm-local-project-list .rm-member-project-info a { display:block; color:var(--text); font-weight:850; font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((1.05rem) * var(--rm-ui-type-scale, 1.2))), 1px); line-height:1.5; overflow-wrap:anywhere; }
.rm-member-project-state { display:inline-block; margin:7px 0; color:var(--brand-strong); font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((.8rem) * var(--rm-ui-type-scale, 1.2))), 1px); font-weight:800; }
.rm-member-project-info small { display:block; font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((.78rem) * var(--rm-ui-type-scale, 1.2))), 1px); line-height:1.7; }
.rm-member-project-info small.is-expiring { color:var(--danger); font-weight:750; }
.rm-local-project-actions { gap:8px; flex-wrap:wrap; }
.rm-member-project-open { border:1px solid var(--line); border-radius:9px; min-height:40px; padding:8px 12px; font-weight:800; font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((.85rem) * var(--rm-ui-type-scale, 1.2))), 1px); }
.rm-local-project-actions .rm-local-project-delete { min-height:40px; }
.rm-member-section-heading { margin-bottom:18px; }
.rm-member-section-heading h2 { margin-bottom:8px; }
.rm-member-tool-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.rm-member-tool { display:flex; flex-direction:column; padding:20px; }
.rm-member-tool-number { font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((.8rem) * var(--rm-ui-type-scale, 1.2))), 1px); letter-spacing:.1em; font-weight:900; color:var(--brand-strong); margin-bottom:14px; }
.rm-member-tool h3 { font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((1rem) * var(--rm-ui-type-scale, 1.2))), 1px); margin:0 0 10px; line-height:1.5; }
.rm-member-tool p { margin:0 0 18px; font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((.85rem) * var(--rm-ui-type-scale, 1.2))), 1px); line-height:1.65; color:var(--muted); }
.rm-member-tool > a,.rm-member-tool-state { font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((.83rem) * var(--rm-ui-type-scale, 1.2))), 1px); font-weight:800; margin-top:auto; padding:6px 0; }
.rm-member-tool-state { color:var(--muted); }
.rm-member-ai-heading { display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-bottom:10px; }
.rm-member-ai-heading h3 { margin:0; }
.rm-member-ai-heading .rm-member-badge { font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((.65rem) * var(--rm-ui-type-scale, 1.2))), 1px); padding:3px 7px; }
.rm-member-muted { font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((.8rem) * var(--rm-ui-type-scale, 1.2))), 1px); color:var(--muted); }
.rm-mypage-content .rm-profile-panel { padding:22px 24px; }
.rm-mypage-content .rm-profile-panel dl { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 24px; }
.rm-mypage-content .rm-profile-panel dl > div { grid-template-columns:70px minmax(0,1fr); }
.rm-mypage-content a:focus-visible,.rm-mypage-content button:focus-visible { outline:3px solid var(--brand); outline-offset:3px; }
@media(max-width:980px) { .rm-member-tool-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:720px) {
  .rm-mypage-shell { width:calc(100% - 24px); }
  .rm-mypage-card { padding:20px 16px; }
  .rm-member-top-grid { grid-template-columns:minmax(0,1fr); }
  .rm-member-continue,.rm-member-plan,.rm-mypage-content .rm-local-projects,.rm-mypage-content .rm-profile-panel { padding:20px 16px; }
  .rm-local-projects-heading { flex-direction:column; }
  .rm-local-projects-heading > a { align-self:flex-start; }
  .rm-mypage-content .rm-profile-panel dl { grid-template-columns:minmax(0,1fr); }
  .rm-member-overview { padding:16px 0; }
  .rm-member-overview > div { padding:0 7px; }
  .rm-member-overview span { font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((.75rem) * var(--rm-ui-type-scale, 1.2))), 1px); line-height:1.55; }
}
@media(max-width:420px) { .rm-member-tool-grid { grid-template-columns:minmax(0,1fr); } .rm-member-actions a { flex:1 1 auto; } }

/* Visual dashboard layer: icon-bank artwork on site-token surfaces. Reduced-motion safe. */
.rm-mypage-card { position:relative; overflow:hidden; isolation:isolate; }
.rm-mypage-orbs { position:absolute; inset:0; z-index:-1; pointer-events:none; }
.rm-mypage-orbs i { position:absolute; border-radius:50%; filter:blur(56px); opacity:.5; background:var(--brand-soft); animation:rmOrb 16s ease-in-out infinite alternate; }
.rm-mypage-orbs i:nth-child(1) { width:260px; height:260px; top:-90px; right:-60px; }
.rm-mypage-orbs i:nth-child(2) { width:200px; height:200px; bottom:8%; left:-80px; background:var(--accent-soft); opacity:.6; animation-delay:-6s; }
.rm-mypage-orbs i:nth-child(3) { width:150px; height:150px; top:45%; right:10%; background:var(--rm-mint); opacity:.5; animation-delay:-10s; }
@keyframes rmOrb { to { transform:translate(30px,40px) scale(1.15); } }
.rm-ico { display:block; width:100%; height:100%; object-fit:contain; }
.rm-member-continue,.rm-member-plan { position:relative; overflow:hidden; }
.rm-member-icon { position:absolute; right:22px; top:18px; width:72px; height:72px; padding:10px; border-radius:20px; background:var(--surface-strong); border:1px solid var(--line); box-shadow:var(--shadow-small); animation:rmFloat 5s ease-in-out infinite; }
@keyframes rmFloat { 50% { transform:translateY(-6px); } }
.rm-member-continue h3,.rm-member-continue > p { padding-right:76px; }
.rm-h-ico { display:inline-block; vertical-align:middle; width:34px; height:34px; margin-right:10px; padding:4px; border-radius:11px; background:var(--surface-tint); border:1px solid var(--line); }
.rm-member-benefits li::before { content:none; }
.rm-member-benefits li { display:flex; align-items:center; gap:12px; }
.rm-member-benefits li > span { flex:none; width:34px; height:34px; padding:4px; border-radius:11px; background:var(--surface-tint); border:1px solid var(--line); }
.rm-member-badge.is-active { animation:rmPulse 2.8s ease-in-out infinite; }
@keyframes rmPulse { 50% { box-shadow:0 0 0 5px color-mix(in srgb,var(--brand) 14%,transparent); } }

.rm-member-overview { gap:0; background:var(--surface); }
.rm-stat { display:flex; flex-direction:column; align-items:center; text-align:center; gap:4px; padding:0 8px; }
.rm-stat + .rm-stat { border-left:1px solid var(--line); }
.rm-stat-visual { position:relative; display:grid; place-items:center; width:92px; height:92px; margin-bottom:6px; }
.rm-ring { position:absolute; inset:0; width:100%; height:100%; transform:rotate(-90deg); }
.rm-ring circle { fill:none; stroke-width:2.2; stroke-linecap:round; }
.rm-ring-bg { stroke:var(--line); }
.rm-ring-fg { stroke:var(--brand); stroke-dasharray:100; stroke-dashoffset:calc(100 - var(--p,0)); transition:stroke-dashoffset 1.2s cubic-bezier(.2,.8,.2,1); }
.rm-stat[data-stat="ready"] .rm-ring-fg { stroke:var(--accent); }
.rm-stat[data-stat="checks"] .rm-ring-fg { stroke:var(--rm-aqua); }
.rm-stat-visual em { display:block; width:54px; height:54px; padding:0; }
.rm-stat strong { font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((2rem) * var(--rm-ui-type-scale, 1.2))), 1px); line-height:1.1; font-variant-numeric:tabular-nums; }

.rm-journey { border:1px solid var(--line); border-radius:14px; padding:22px 16px; background:var(--surface); }
.rm-journey ol { list-style:none; margin:0; padding:0; display:flex; justify-content:space-between; position:relative; }
.rm-journey ol::before,.rm-journey ol::after { content:''; position:absolute; top:27px; left:10%; height:3px; border-radius:3px; }
.rm-journey ol::before { right:10%; background:var(--line); }
.rm-journey ol::after { width:0; background:var(--brand); animation:rmGrow 3.2s .4s ease-out forwards; }
@keyframes rmGrow { to { width:var(--journey,0%); } }
.rm-journey li { position:relative; z-index:1; flex:1; display:flex; flex-direction:column; align-items:center; gap:8px; font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((.82rem) * var(--rm-ui-type-scale, 1.2))), 1px); font-weight:800; color:var(--text-soft); }
.rm-journey li > span { display:block; width:56px; height:56px; padding:9px; border-radius:50%; background:var(--surface-strong); border:2px solid var(--line); opacity:0; transform:scale(.6); animation:rmPop .5s calc(var(--i)*.18s + .2s) cubic-bezier(.3,1.5,.5,1) forwards; }
.rm-journey li.is-done { color:var(--brand-strong); }
.rm-journey li.is-done > span { border-color:var(--brand); background:var(--brand-soft); }
@keyframes rmPop { to { opacity:1; transform:scale(1); } }

.rm-member-tool { position:relative; overflow:hidden; transition:transform .25s ease,box-shadow .25s ease,border-color .25s; }
.rm-member-tool:hover { transform:translateY(-4px); border-color:var(--brand); box-shadow:var(--shadow-small); }
.rm-member-tool-number { display:flex; align-items:center; gap:10px; }
.rm-tool-emoji { display:block; width:56px; height:56px; padding:8px; border-radius:16px; background:var(--surface-tint); border:1px solid var(--line); transition:transform .3s; }
.rm-member-tool:hover .rm-tool-emoji { transform:rotate(-6deg) scale(1.08); }
.rm-mypage-content > * { animation:rmRise .6s ease both; }
.rm-mypage-content > *:nth-child(n+3) { animation-delay:.1s; }
.rm-mypage-content > *:nth-child(n+5) { animation-delay:.2s; }
@keyframes rmRise { from { opacity:0; transform:translateY(16px); } }
@media(max-width:720px) {
  .rm-stat-visual { width:64px; height:64px; } .rm-stat-visual em { width:38px; height:38px; } .rm-stat strong { font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((1.5rem) * var(--rm-ui-type-scale, 1.2))), 1px); }
  .rm-member-icon { width:52px; height:52px; padding:7px; right:12px; top:12px; border-radius:14px; }
  .rm-member-continue h3,.rm-member-continue > p { padding-right:56px; }
  .rm-journey li { font-size:round(nearest, max(var(--rm-ui-type-min, 0px), calc((.7rem) * var(--rm-ui-type-scale, 1.2))), 1px); } .rm-journey li > span { width:42px; height:42px; padding:6px; } .rm-journey ol::before,.rm-journey ol::after { top:20px; }
}
@media(prefers-reduced-motion:reduce) {
  .rm-mypage-card *,.rm-mypage-content > * { animation:none !important; transition:none !important; }
  .rm-journey li > span { opacity:1; transform:none; } .rm-journey ol::after { width:var(--journey,0%); }
}