/* Approved B language across the story space. All colors follow the saved theme. */
:root { --reading-font: "Noto Serif SC", "Songti SC", SimSun, Georgia, serif; }
:root[data-theme="light"] {
  --bg:#faf7f4; --bg2:#f4eeeb; --panel:#fffdfc; --panel2:#f7f2f0; --elevated:#fffdfc;
  --text:#30272c; --dim:#786b71; --line:#eae2e1; --sidebar-bg:#fffcfa;
  --input-bg:#fffcfb; --glass:rgba(255,253,251,.97); --hover:#f6eeed;
  --shadow:0 12px 36px #5a303b08; --gold:#997239;
}
:root[data-theme="light"][data-palette="sakura"] {
  --accent:#b45476; --accent2:#9d4565; --accent-soft:#f9eaf0; --accent-line:#ebcbd7; --art-halo:#f7e4e9;
}
:root[data-theme="dark"] {
  --bg:#1d191e; --bg2:#252027; --panel:#292329; --panel2:#312931; --elevated:#362c34;
  --text:#f2e8ed; --dim:#bbabb4; --line:#443740; --sidebar-bg:#231d23;
  --input-bg:#251f25; --glass:rgba(35,29,35,.97); --hover:#382d35; --gold:#e4bf88;
}
.app { --sidebar-w:230px; }
[data-theme="light"] .homeView { --dim:#786b71; }
.sidebar { background:var(--sidebar-bg); padding:22px 16px 18px; }
.sidebar .brand { margin-bottom:22px; }
.brand > span:last-child { font-family:var(--reading-font); font-size:21px; letter-spacing:.5px; }
.brandSeal { border:0; background:var(--accent-soft); }
.sidebar .brandSeal img { width:62px; top:-2px; left:-11px; }
.sideUser { padding:12px 8px 20px; border-bottom:1px solid var(--line); margin-bottom:10px; }
.sideAvatar { border:1px solid var(--accent-line); background:var(--accent-soft); }
.navGroup { margin-bottom:14px; }
.navGroupTitle { padding:6px 12px; font-size:10px; color:var(--dim); }
.navItem { min-height:44px; margin-bottom:4px; border-radius:11px; font-size:14px; gap:12px; }
.navItem.active::before { left:auto; right:12px; width:4px; height:4px; border-radius:50%; }
.navItem svg { width:19px; height:19px; }
.topbar { height:68px; flex-basis:68px; padding:0 32px; background:var(--glass); border-bottom:1px solid var(--line); }
.pageBreadcrumb { display:flex; gap:10px; align-items:center; min-width:0; }
.pageBreadcrumb>span:last-child { font-family:var(--reading-font); font-size:23px; font-weight:700; white-space:nowrap; }
.pageBrandAvatar { width:33px; height:33px; object-fit:cover; object-position:50% 25%; border-radius:50%; background:var(--accent-soft); }
.topRight { margin-left:auto; gap:5px; flex-shrink:0; }
.topRight .iconBtn { width:40px; height:44px; color:var(--dim); background:none; border:0; }
.topRight .iconBtn svg { width:23px; height:23px; }
.balanceChip { border-radius:25px; min-height:36px; background:transparent; border:1px solid var(--line); font-size:13px; font-weight:500; padding:6px 12px; }
.balancePlus { display:none; }
.bPage { width:100%; max-width:1120px; align-self:center; padding:36px clamp(24px,4vw,54px) 48px; scrollbar-gutter:stable; }
.bPage .pageTitle { font-family:var(--reading-font); font-size:34px; line-height:1.35; font-weight:700; margin:0 0 10px; letter-spacing:.5px; }
.bPage .pageSub { font-size:14px; color:var(--dim); margin-bottom:26px; line-height:1.6; }
.bPage .section { margin:28px 0 16px; }
.bPage .section h2, .bPage h2 { font-family:var(--reading-font); font-size:23px; font-weight:600; }
.bPage .panel { padding:26px; border-radius:20px; border:1px solid var(--line); box-shadow:var(--shadow); }
.bPage .panel+.panel { margin-top:18px; }
.listItem { min-height:78px; padding:18px 22px; border-radius:17px; margin-bottom:12px; border:1px solid var(--line); background:var(--panel); gap:16px; }
.listItem .liTitle { color:var(--text); font-family:var(--reading-font); font-size:19px; font-weight:600; line-height:1.55; }
.listItem .liSub { color:var(--dim); font-size:13px; line-height:1.65; margin-top:4px; }
.listItem .liMain { overflow-wrap:anywhere; }
button.listItem { cursor:pointer; }
button.listItem:hover { background:var(--accent-soft); border-color:var(--accent-line); }
.btnPrimary { min-height:44px; padding:11px 22px; border-radius:12px; font-size:14px; background:var(--accent); color:var(--on-accent); box-shadow:none; font-weight:500; }
.btnGhost { min-height:40px; padding:8px 16px; border-radius:10px; font-size:13px; background:transparent; }
button:disabled { cursor:not-allowed; }
.formRow { margin-bottom:20px; }
.formRow label { font-size:14px; color:var(--dim); margin-bottom:10px; line-height:1.5; }
.formRow input,.formRow textarea,.formRow select { padding:13px 15px; border-radius:12px; font-size:15px; line-height:1.7; border:1px solid var(--line); background:var(--input-bg); color:var(--text); }
.formRow textarea { resize:vertical; min-height:90px; }
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.formRow input:focus,.formRow textarea:focus,.formRow select:focus { border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
.ipArt { display:block; object-fit:contain; width:240px; max-width:100%; height:auto; pointer-events:none; user-select:none; }
.illustratedEmpty { display:flex; flex-direction:column; align-items:center; gap:12px; padding:30px 12px 26px; color:var(--dim); font-size:14px; }
.illustratedEmpty .ipArt { width:230px; margin:0 auto; }
.compactEmpty { padding:12px 0 24px; gap:8px; }
.compactEmpty .ipArt { width:175px; }
.emptyArt { width:185px; margin:0 auto 8px; }
.pageIntro { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:175px; margin:-16px 0 12px; }
.pageIntro>.ipArt { width:205px; flex:0 0 205px; }
.pageIntro .pageSub { margin:0; }
.drawPage .panel { position:relative; z-index:1; }
.drawPage textarea { min-height:160px; }
.drawControls { display:grid; grid-template-columns:minmax(0,1fr) 110px auto; gap:12px; }
.drawControls select { width:100%; min-width:0; min-height:44px; padding:9px 12px; border-radius:11px; font-size:13px; border:1px solid var(--line); color:var(--text); background:var(--panel2); }
.studioArt { width:330px; margin:18px auto 0; }
.drawResults:empty { margin:0!important; }
.workshopPage>.panel>.btnPrimary { min-width:210px; }
.characterEditor .grid2 { gap:20px; }
.characterEditor>.formRow { margin-bottom:24px; }
.characterEditor>.btnPrimary { min-width:210px; }
.workshopPage>.listItem>img { width:60px!important; height:66px!important; border-radius:11px!important; }
.rankItem { gap:18px; padding:20px; }
.rankNumber { width:28px; flex-shrink:0; color:var(--accent); font-size:28px; font-family:var(--reading-font); font-weight:600; text-align:center; }
.rankAvatar { width:78px; height:92px; object-fit:cover; object-position:50% 28%; border-radius:13px; }
.rankArt { width:280px; margin:40px auto 0; opacity:.87; }
.rankItem .muted { white-space:nowrap; }
.bountyItem { flex-wrap:wrap; }
.bountyItem .liMain { flex:1 1 calc(100% - 110px); }
.bountyItem .btnGhost { margin-left:auto; }
.rewardValue { color:var(--gold); display:inline-flex; align-items:center; gap:5px; font-size:15px; white-space:nowrap; }
.rewardValue .uiIcon { width:17px; height:17px; }
.memberBenefits { overflow:hidden; background:linear-gradient(120deg,var(--panel),var(--accent-soft))!important; }
.memberBenefitHead { display:flex; align-items:center; justify-content:space-between; height:136px; margin:0 0 6px; }
.memberBenefitHead h2 { font-size:25px; margin:0; }
.memberBenefitHead>.ipArt { width:170px; height:170px; object-fit:contain; }
.benefitGrid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; padding:14px 0 4px; }
.benefitGrid>div { display:flex; flex-direction:column; align-items:center; gap:9px; text-align:center; padding:4px 8px; border-right:1px solid var(--accent-line); }
.benefitGrid>div:last-child { border-right:0; }
.benefitGrid .uiIcon { color:var(--accent); width:22px; height:22px; }
.benefitGrid strong { font-size:22px; font-weight:500; color:var(--text); font-variant-numeric:tabular-nums; }
.benefitGrid span { color:var(--dim); font-size:12px; }
.membershipPlan .planPrice { color:var(--accent); font-size:27px; font-family:Georgia,serif; }
.membershipPlan>.uiIcon { width:17px; color:var(--dim); }
.taskItem { gap:15px; }
.taskIcon { width:38px; height:42px; display:grid; place-items:center; color:var(--dim); background:var(--panel2); border-radius:10px; flex-shrink:0; }
.taskIcon.done { background:var(--accent-soft); color:var(--accent); }
.taskIcon .uiIcon { width:22px; height:22px; }
.taskItem .rewardValue { font-size:14px; }
.taskItem .btnGhost { min-width:64px; }
.invitationPanel { text-align:center; padding:30px!important; border-style:dashed!important; border-color:var(--accent-line)!important; background:linear-gradient(145deg,var(--panel),var(--accent-soft))!important; }
.invitationPanel .btnPrimary { margin-top:12px; min-width:180px; }
.inviteStats { gap:12px; }
.inviteStats>.panel { padding:20px 9px; min-width:0; }
.inviteStats>.panel>div:first-child { font-family:Georgia,var(--reading-font); font-weight:500!important; font-size:23px!important; color:var(--accent); overflow-wrap:anywhere; }
.inviteStats .muted { margin-top:8px; font-size:12px; }
.settingsContent { max-width:970px; }
.settingsContent .panel { margin-bottom:18px; }
.settingsContent .section { margin-bottom:22px; }
.settingsContent .section h2 { font-size:21px; }
.settingsContent .switchRow { padding:14px 0; align-items:center; gap:18px; }
.settingsContent .switchTitle { font-size:14px; }
.settingsContent .switchDesc { font-size:12px; line-height:1.8; margin-top:5px; }
.settingsContent .sliderRow { margin:20px 0; }
.themePreview { border-radius:16px; background:linear-gradient(110deg,var(--panel),var(--accent-soft)); }
.themePreview .previewCopy strong { font-family:var(--reading-font); }
.modeChoice,.paletteChoice { border-radius:12px; }
.modeChoice { min-height:72px; }
.modeChoice.selected,.paletteChoice.selected { border-color:var(--accent); background:var(--accent-soft); }
.mePage { max-width:800px; }
.profileHero { display:flex; align-items:center; gap:24px; min-height:170px; padding:12px 0 18px; }
.profileAvatar { width:108px; height:108px; flex:0 0 108px; object-fit:cover; object-position:50% 28%; border-radius:50%; border:4px solid var(--panel); background:var(--accent-soft); box-shadow:0 0 0 1px var(--accent-line); }
.profileHero .pageTitle { font-size:38px; overflow-wrap:anywhere; }
.profileBalance { display:flex; gap:7px; align-items:center; color:var(--gold); font-size:15px; }
.profileBalance>.uiIcon { width:17px; }
.profileId { font-size:11px; color:var(--dim); margin:-6px 0 22px; overflow-wrap:anywhere; }
.mePage .listItem { padding:19px 24px; min-height:78px; gap:18px; }
.entryIcon { width:27px; height:27px; color:var(--accent); }
.mePage>.btnDanger { margin-top:14px!important; border-color:var(--accent-line); color:var(--accent); min-height:49px; }
.chatLayout { background:var(--bg); }
.convList { background:var(--panel); border-color:var(--line); }
.convHead { height:74px; color:var(--text); border-color:var(--line); }
.convHead>span { font-family:var(--reading-font); font-size:21px; }
.convItem { border-radius:14px; margin:4px 10px; padding:14px 12px; border:1px solid transparent; }
.convItem.active { background:var(--accent-soft); border-color:var(--accent-line); }
.convAvatar { width:49px; height:57px; border-radius:11px; object-position:50% 30%; }
.convName { font-family:var(--reading-font); font-size:17px; color:var(--text); }
.convTime,.convPreview { font-size:11px; }
.chatBackdrop { opacity:.035; }
.chatEmptyTop { min-height:68px; padding:10px 22px; font-family:var(--reading-font); font-size:17px; border-bottom:1px solid var(--line); }
.chatEmpty { padding:clamp(20px,4vh,50px) 10px 24px; display:flex; flex-direction:column; align-items:center; }
.chatEmpty .storyEmptyArt { width:270px; max-height:32vh; object-fit:contain; margin:0 auto 15px; }
.chatEmpty h2 { font-family:var(--reading-font); font-size:26px; font-weight:500; line-height:1.7; margin:0; color:var(--text); }
.chatEmpty .btnPrimary { margin-top:26px; display:inline-flex; align-items:center; gap:22px; font-family:var(--reading-font); font-size:18px; border-radius:13px; padding:12px 24px; }
.chatTop { background:var(--glass); min-height:72px; border-bottom:1px solid var(--line); }
.chatTopAvatar { border-radius:50%; }
.chatTopName { font-family:var(--reading-font); font-size:20px; font-weight:600; }
.chatTopSub { font-size:11px; margin-top:4px; }
.story { padding:28px 32px 22px; }
.storyMsg { line-height:2; font-size:15px; }
.storyMsg.assistant { padding:18px 22px; border:1px solid var(--line); border-radius:0 18px 18px 18px; background:var(--panel); box-shadow:var(--shadow); }
.storyMsg.user { border-radius:17px 17px 0 17px; padding:12px 20px; }
.statusPanel { background:var(--panel); border-radius:14px; }
.unlockCard { max-width:400px; padding:15px 17px; border-radius:15px; box-shadow:none; }
.unlockIcon { color:var(--accent); background:var(--accent-soft); }
.unlockTitle { font-size:13px; }
.unlockSub { font-size:11px; }
.composerWrap { border-top:1px solid var(--line); background:var(--glass); }
.composer { border-radius:15px; background:var(--input-bg); }
.toolChip { border-radius:8px; background:transparent; font-size:11px; min-height:30px; }
.composerTools::-webkit-scrollbar { height:3px; }
.quickFormat { gap:5px; }
.qfBtn { border-radius:7px; font-size:11px; }
.directivePanel { border-radius:14px; background:var(--panel); }
.directiveHead { font-family:var(--reading-font); }
.sheet { background:var(--panel); border-radius:24px; border:1px solid var(--line); width:min(530px,calc(100vw - 32px)); box-shadow:0 22px 90px #21151d35; }
.sheetHead { padding:17px 23px; border-color:var(--line); }
.sheetHead h3 { font-family:var(--reading-font); font-size:23px; font-weight:600; }
.sheetHead button { color:var(--dim); }
.sheetBody { padding:20px 23px 26px; gap:12px; }
.sheet .pkg { min-height:60px; padding:15px 18px; border:1px solid var(--line); border-radius:13px; background:var(--panel2); }
.sheet .pkgMain { font-size:15px; }
.sheet .pkgSub { color:var(--dim); font-size:11px; line-height:1.7; }
.sheet .pkgPrice { font-family:Georgia,serif; font-size:24px; color:var(--accent); }
.sheet-recharge .sheetBody { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.sheet-recharge .pkg { position:relative; display:flex; flex-direction:column; align-items:flex-start; justify-content:space-between; padding:20px 16px 15px; gap:10px; min-height:126px; }
.sheet-recharge .pkg.popular { border-color:var(--accent-line); background:var(--accent-soft); }
.sheet-recharge .pkgTag { position:absolute; right:10px; top:-8px; font-size:10px; padding:2px 7px; border-radius:6px; }
.sheet-cardActions .pkg,.sheet-archiveMenu .pkg { background:transparent; border-color:var(--line); }
.sheet-cardActions .pkg:hover,.sheet-archiveMenu .pkg:hover { background:var(--accent-soft); }
.sheet-knowledge .sheetBody>.btnGhost { width:100%; justify-content:center; }
.sheet-archiveDelete .confirmCopy { line-height:1.9; font-size:14px; }
.detailView { background:var(--bg); }
.detailHero { min-height:0; padding:0; height:420px; overflow:hidden; }
.detailPoster { width:100%; max-width:960px; height:100%; aspect-ratio:auto; object-fit:cover; object-position:50% 33%; border-radius:0 0 22px 22px; box-shadow:none!important; }
.detailHeroBg { filter:blur(32px)!important; opacity:.15; }
.detailBack { top:18px; left:22px; color:#fff; background:#30212c52; border:1px solid #ffffff60; backdrop-filter:blur(14px); border-radius:50%; }
.detailTitleWrap { position:relative; padding:28px 24px 8px; max-width:820px; margin:auto; }
.detailTitle { font-family:var(--reading-font); font-size:34px; color:var(--text); font-weight:600; }
.detailTier { font-size:21px; color:var(--gold); }
.detailStats { color:var(--dim); font-size:12px; padding-bottom:12px; }
.detailTimes { font-size:11px; color:var(--dim); }
.detailTags { padding-bottom:24px; gap:7px; }
.detailTag { border:0; background:var(--accent-soft); color:var(--accent); font-size:12px; padding:5px 12px; }
.detailCard { padding:22px; border-radius:18px; background:var(--panel); }
.detailCardHead h3 { font-family:var(--reading-font); font-size:21px; font-weight:600; }
.notesBody { color:var(--text); font-size:14px; line-height:1.95; }
.galleryRow { gap:10px; }
.galleryItem { border-radius:11px; }
.authorRow { border-radius:17px; background:var(--panel); }
.authorName { font-family:var(--reading-font); font-size:17px; }
.authorAvatarRing { background:var(--accent-soft); }
.chargeBtn { background:var(--accent); color:var(--on-accent); border-radius:10px; box-shadow:none; }
.supportHint { color:var(--dim); font-size:12px; line-height:1.8; }
.bountyPoolRow { border-radius:12px; }
.detailBar { background:var(--glass); border-color:var(--line); gap:20px; padding:12px 24px calc(12px + env(safe-area-inset-bottom)); }
.startChatBtn { font-family:var(--reading-font); font-size:19px; background:var(--accent); color:var(--on-accent); border-radius:14px; box-shadow:none; }
.barIcon { width:40px; height:44px; background:none; border:0; }
.mobileTabs { background:var(--glass); border-color:var(--line); }
.mTab.active::before { display:none; }
.mTab { color:var(--dim); }
.mTab.active { color:var(--accent); }
.toastMsg { background:var(--elevated); border:1px solid var(--accent-line); border-radius:13px; box-shadow:var(--shadow); }
@media(min-width:921px) {
  .pageBrandAvatar { display:none; }
  .drawPage .studioArt { width:300px; margin:18px auto; }
  .settingsContent .appearancePanel { padding:26px; }
  .detailBar .startChatBtn { flex:0 1 400px; }
}
@media(max-width:920px) {
  .topbar { height:60px; flex-basis:60px; padding:0 18px; gap:4px; }
  .pageBreadcrumb { gap:8px; }
  .pageBreadcrumb>span:last-child { font-size:21px; }
  .pageBrandAvatar { width:29px; height:29px; }
  .topRight { gap:0; }
  .topRight .iconBtn { width:34px; }
  .topRight .iconBtn svg { width:21px; height:21px; }
  .balanceChip { padding:5px 9px; min-height:34px; font-size:12px; }
  .bPage { padding:28px 20px 34px; scrollbar-gutter:auto; }
  .bPage .pageTitle { font-size:30px; margin-bottom:9px; }
  .bPage .pageSub { font-size:13px; margin-bottom:24px; }
  .bPage .panel { padding:19px; border-radius:18px; }
  .bPage .section h2,.bPage h2 { font-size:23px; }
  .listItem { padding:16px; gap:12px; }
  .listItem .liTitle { font-size:18px; }
  .listItem .liSub { font-size:12px; }
  .drawControls { grid-template-columns:minmax(0,1fr) 70px 68px; gap:8px; }
  .drawControls select { font-size:11px; padding:8px; }
  .drawControls .btnPrimary { padding:9px 12px; }
  .drawPage textarea { min-height:145px; }
  .formRow input,.formRow textarea,.formRow select { font-size:14px; padding:12px; }
  .studioArt { width:290px; margin-top:24px; }
  .illustratedEmpty .ipArt { width:220px; }
  .compactEmpty .ipArt { width:160px; }
  .pageIntro { margin:-17px 0 4px; min-height:155px; gap:8px; }
  .pageIntro>.ipArt { width:158px; flex-basis:158px; }
  .pageIntro .pageSub { margin:0; font-size:12px; }
  .memberBenefitHead { height:130px; }
  .memberBenefitHead>.ipArt { width:150px; height:150px; }
  .benefitGrid { gap:0; }
  .benefitGrid strong { font-size:21px; }
  .benefitGrid span { font-size:10px; }
  .membershipPlan .planPrice { font-size:26px; }
  .taskItem { padding:17px 13px; gap:10px; }
  .taskIcon { width:30px; height:36px; }
  .taskItem .liTitle { font-size:15px; }
  .taskItem .rewardValue { font-size:12px; }
  .taskItem .btnGhost { min-width:52px; font-size:12px; padding:7px 10px; }
  .rankItem { padding:17px 14px; gap:12px; }
  .rankNumber { width:18px; font-size:25px; }
  .rankAvatar { width:69px; height:85px; }
  .rankArt { width:250px; margin-top:40px; }
  .settingsContent .section h2 { font-size:20px; }
  .settingsContent .switchDesc { font-size:11px; }
  .settingsContent .formRow { margin-bottom:18px; }
  .profileHero { min-height:148px; gap:22px; padding-top:4px; }
  .profileAvatar { width:90px; height:90px; flex-basis:90px; }
  .profileHero .pageTitle { font-size:36px; }
  .mePage .listItem { min-height:72px; padding:17px 22px; gap:20px; }
  .mePage .listItem .liTitle { font-size:20px; }
  .profileId { font-size:10px; margin:0 0 20px; }
  .chatEmptyTop { min-height:64px; padding:8px 18px; }
  .chatEmpty { padding:15px 0 25px; }
  .chatEmpty .storyEmptyArt { width:240px; max-height:30vh; margin:3vh auto 14px; }
  .chatEmpty h2 { font-size:21px; }
  .chatEmpty .btnPrimary { margin-top:24px; font-size:17px; }
  .chatTop { min-height:66px; padding:9px 13px; gap:9px; }
  .chatTopName { font-size:18px; }
  .story { padding:22px 18px; }
  .storyMsg { font-size:14px; }
  .storyMsg.assistant { padding:16px 18px; }
  .composerWrap { padding-left:14px; padding-right:14px; }
  .toolChip { min-height:40px; font-size:12px; padding:7px 9px; }
  .sheet { width:100%; max-width:560px; left:50%; right:auto; border-radius:24px 24px 0 0; border-bottom:0; bottom:0; top:auto; transform:translateX(-50%); max-height:90dvh; }
  .sheetHead { padding:14px 20px; }
  .sheetHead h3 { font-size:22px; }
  .sheetBody { padding:19px 20px calc(25px + env(safe-area-inset-bottom)); }
  .sheet-recharge .sheetBody { gap:12px; }
  .sheet-recharge .pkg { padding:16px 13px 13px; min-height:124px; }
  .sheet-recharge .pkgMain { font-size:15px; }
  .sheet-recharge .pkgPrice { font-size:24px; }
  .detailHero { height:350px; }
  .detailPoster { object-position:50% 29%; border-radius:0; }
  .detailTitleWrap { padding:25px 20px 10px; }
  .detailTitle { font-size:30px; }
  .detailSection { padding:0 18px; margin-bottom:15px; }
  .detailCard { padding:19px; }
  .detailCardHead h3 { font-size:20px; }
  .detailBar { gap:12px; padding:11px 18px calc(11px + env(safe-area-inset-bottom)); }
  .detailBarIcons { gap:2px; }
  .startChatBtn { min-height:45px; font-size:18px; }
  .mobileTabs { padding-left:0; padding-right:0; }
  .mTab { font-size:12px; gap:4px; }
  .mTab svg { width:24px; height:24px; }
}
@media(max-width:380px) {
  .topbar { padding:0 12px; }
  .pageBrandAvatar { display:none; }
  .pageBreadcrumb>span:last-child { font-size:19px; }
  .bPage { padding-left:16px; padding-right:16px; }
  .pageIntro>.ipArt { width:137px; flex-basis:137px; }
  .pageIntro .pageTitle { font-size:28px; }
  .taskIcon { display:none; }
  .sheetBody { padding-left:16px; padding-right:16px; }
  .drawControls { grid-template-columns:minmax(0,1fr) 64px 58px; gap:6px; }
  .drawControls select { padding:7px 5px; }
}
@media(prefers-reduced-motion:reduce) { .ipArt,button,a { transition:none!important; } }

/* Personal pages use the same navigation and detail affordances. */
.pageActionHead { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:18px; }
.pageActionHead .pageTitle { margin:0; }
.pageActionHead .btnGhost { min-height:44px; flex-shrink:0; }
.profileQuickNav { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; padding:14px 8px; margin-bottom:28px; border:1px solid var(--line); border-radius:20px; background:var(--panel); }
.profileQuickNav button { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:76px; gap:12px; border:0; background:none; color:var(--text); font-size:14px; border-radius:12px; }
.profileQuickNav button:hover { background:var(--accent-soft); }
.profileQuickNav .uiIcon { width:24px; height:24px; color:var(--accent); }
.profileEntryGrid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 16px; }
.profileEntryGrid .listItem { margin:0; }
button.profileBalance { border:0; background:none; padding:4px 0; min-height:44px; font:inherit; }
button.authorLink { border:0; text-align:left; color:inherit; cursor:pointer; }
button.authorMeta { background:none; }
.authorAvatarRing.authorLink { padding:0; flex-shrink:0; }
.detailBookmarkEntry,.commentWriteButton { min-height:44px; }
.detailLoadState { display:grid; place-content:center; min-height:50vh; text-align:center; padding:50px 24px; }
.rechargeHistoryLink { display:flex; align-items:center; justify-content:space-between; grid-column:1/-1; min-height:44px; }
@media(max-width:920px) {
  .profileEntryGrid { grid-template-columns:1fr; gap:8px; }
  .mePage .profileEntryGrid .listItem { min-height:64px; padding:16px 18px; }
  .mePage .profileEntryGrid .liTitle { font-size:17px; }
  .profileQuickNav { gap:0; }
  .profileQuickNav button { gap:10px; font-size:14px; }
  .pageActionHead { gap:10px; }
  .pageActionHead .btnGhost { padding:9px 12px; font-size:13px; }
}