/* =========================================================
   我的主页（myhome）
   1) 页面骨架与导航        —— 由 source/plugin/myhome/home.inc.php 内联结构使用
   2) 资料条（用户名/简介/地址/复制）—— 视觉移植自本机 127.0.0.6（38176）的 .profile 区
   3) 网址卡片网格 + 拖拽 + 右键菜单 + 弹窗 —— 与 static/home_cards.css 同源，独立一份，
      使本插件不依赖旧 homepage 插件的文件（旧插件停用/删除后本页样式不受影响）
   命名空间：.mh-*（页面/资料条）、.hc-*（卡片），不碰 Discuz 自身样式
   ========================================================= */

.mh-page{
	margin:0;padding:0;background:#f7f7f5;color:#4a4f59;
	/* 字体栈与本机 127.0.0.6（38176）一致：楷体优先 */
	font-family:"楷体","KaiTi","STKaiti","Kaiti SC","BiauKai","PingFang SC","Microsoft YaHei",sans-serif;
	-webkit-text-size-adjust:100%;
}
.mh-wrap{max-width:1220px;margin:0 auto;padding:0 16px;}

/* ---------- 顶部导航（左上角 logo 已按要求去掉，导航整体靠右） ---------- */
.mh-head{display:flex;align-items:center;justify-content:flex-end;gap:12px;
	padding:10px 0 4px;flex-wrap:wrap;}
.mh-nav{display:flex;align-items:center;gap:14px;font-size:13px;flex-wrap:wrap;}
/* 右上角一律同一种蓝色描边胶囊 —— 之前文字链接与胶囊混排，看着是两套控件。
   .mh-quiet 不再改颜色（它只是历史遗留的语义类，保留在 DOM 里但不制造第二种样式）。
   用户名是"谁的主页"的标识、不是操作，单独用 .mh-nav-name 保持纯文本。 */
.mh-link,.mh-nav-btn{
	border:1px solid #e2e6ee;background:#fff;color:#6a5cff;text-decoration:none;
	font-size:12.5px;font-weight:600;padding:3px 12px;border-radius:999px;
	cursor:pointer;font-family:inherit;transition:color .15s,border-color .15s,background .15s;
}
.mh-link:hover,.mh-nav-btn:hover{border-color:#6a5cff;background:rgba(106,92,255,.07);color:#6a5cff;}
.mh-nav-name{color:#8a8f99;font-size:13px;}
.mh-nav-btn.is-used{color:#b0b6c0;border-color:#eceef3;}
.mh-nav-btn.is-used:hover{color:#b0b6c0;border-color:#eceef3;background:#fff;}
/* 已取消分享时的灰态：一眼能看出当前是「未分享」，点它会恢复 */
.mh-nav-btn.is-off{background:#f2f3f7;color:#8a8f99;border-color:#e6e8ee;}
.mh-nav-btn.is-off:hover{background:#eceef3;color:#6a5cff;border-color:#dfe3ea;}
.mh-nav-btn[disabled]{opacity:.55;cursor:progress;}
.mh-foot{padding:22px 0 26px;font-size:12px;color:#9aa0aa;text-align:center;}
.mh-foot a{color:#9aa0aa;text-decoration:none;}
.mh-icp{margin-left:6px;}
.mh-icp a{color:#9aa0aa;text-decoration:none;}
.mh-icp a:hover{color:#6a5cff;}

/* ---------- 资料条 ---------- */
.mh-profile{
	display:flex;flex-direction:column;align-items:center;
	padding:4px 2px 6px;text-align:center;
}
.mh-avatar{
	width:64px;height:64px;border-radius:50%;object-fit:cover;
	background:#e9ecf3;box-shadow:0 6px 16px rgba(43,47,56,.14);
	margin:0 0 10px;
}
.mh-name{
	/* 字色对齐 127.0.0.6 的 .pf-name */
	font-size:26px;font-weight:700;color:#e03a3a;
	margin:0 0 6px;max-width:100%;
	overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.mh-bio-line{
	display:flex;align-items:baseline;justify-content:center;gap:8px;flex-wrap:wrap;
	margin:0 auto 14px;max-width:660px;
}
.mh-bio{
	/* 字色对齐 127.0.0.6 的 .pf-bio */
	color:#e07a7a;font-size:15px;line-height:1.65;
	white-space:pre-wrap;word-break:break-word;
}
.mh-bio:empty{display:none;}
.mh-bio-none{color:#c9a8a8;}
.mh-inline-edit{
	flex:none;border:0;background:none;color:#b0b6c0;
	font-size:12.5px;padding:2px 8px;border-radius:999px;cursor:pointer;
	font-family:inherit;transition:color .15s,background .15s;
}
.mh-inline-edit:hover{color:#6a5cff;background:rgba(106,92,255,.08);}
.mh-inline-edit.is-used{color:#c6cbd3;}
.mh-inline-edit.is-used:hover{color:#c6cbd3;background:none;}
.mh-url{
	display:inline-flex;align-items:center;gap:8px;
	max-width:100%;min-width:0;
	padding:5px 5px 5px 14px;
	background:#fff;border:1px solid #e2e6ee;border-radius:999px;
}
/* 编辑态（改个性网址）时去掉这层白底圆角盒子：输入框外面再套一个大框，看着像两层弹窗 */
.mh-url.mh-url-editing{background:none;border:0;padding:0;}
.mh-url-text{
	font-size:13px;color:#8a8f99;min-width:0;flex:0 1 auto;
	overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
	user-select:all;-webkit-user-select:all;
}
.mh-url-btn{
	flex:none;border:0;background:#6a5cff;color:#fff;
	font-size:12px;font-weight:600;padding:6px 14px;border-radius:999px;
	cursor:pointer;transition:filter .15s ease;font-family:inherit;
}
.mh-url-btn:hover{filter:brightness(1.06);}
.mh-url-btn.is-done{background:#31c193;}

/* ---------- 地址行：胶囊（含复制）+ 状态消息；网址与分享开关在右上角导航 ---------- */
.mh-url-row{
	display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;
	max-width:100%;
}
/* 状态提示独占一行且空时彻底不占位 —— 否则它和地址框一起被 flex 居中，
   会把地址框往左推 (gap 10px + min-width 40px)/2 ≈ 25px，看着就是不居中 */
.mh-msg{font-size:12px;color:#8a8f99;flex:0 0 100%;text-align:center;}
.mh-msg:empty{display:none;}
.mh-msg.is-ok{color:#31c193;}
.mh-msg.is-err{color:#ff4d4f;}

/* ---------- 居中装饰线（参考线上 65958 的 .divider） ---------- */
.mh-divider{
	height:3px;width:100%;max-width:520px;margin:22px auto 12px;border-radius:3px;
	background:linear-gradient(90deg,#6a5cff,#8a5cff,#ff6a9c,#ffb36b,#31c193,#3aa0ff,#6a5cff);
}
/* 装饰线下方的介绍行：文字取插件介绍（后台可改），字色与用户名一致（本轮要求） */
.mh-intro{
	color:#e03a3a;font-size:14px;line-height:1.75;
	text-align:center;max-width:640px;margin:0 auto 10px;
	word-break:break-word;
}

/* ---------- 行内编辑（简介 / 地址）：点一下就地变成输入框 ---------- */
.mh-inline{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:center;width:100%;}
.mh-inline input[type=text]{
	box-sizing:border-box;min-width:0;width:min(90vw,340px);
	border:1.5px solid #e2e6ee;border-radius:10px;
	padding:9px 12px;font-size:14px;color:#2b2f38;outline:0;
	transition:.15s;font-family:inherit;background:#fff;
}
.mh-inline input[type=text]:focus{border-color:#6a5cff;box-shadow:0 0 0 3px rgba(106,92,255,.15);}
.mh-inline .mh-mini{
	border:0;border-radius:999px;padding:7px 16px;font-size:13px;font-weight:600;
	cursor:pointer;transition:.15s;font-family:inherit;
}
.mh-inline .mh-mini-save{color:#fff;background:linear-gradient(135deg,#6a5cff,#a66bff);}
.mh-inline .mh-mini-save:hover{transform:translateY(-1px);}
.mh-inline .mh-mini-cancel{background:#f0f1f5;color:#5a5f6a;}
.mh-inline .mh-mini-cancel:hover{background:#e6e8ee;}
.mh-inline .mh-hint{font-size:12px;color:#9aa0aa;width:100%;}
.mh-inline .mh-hint.is-err{color:#ff4d4f;}
.mh-inline .mh-hint.is-ok{color:#31c193;}

/* ---------- 提示页（404 / 功能关闭） ---------- */
.mh-note{max-width:460px;margin:12vh auto 0;text-align:center;padding:0 16px;}
.mh-note-title{font-size:22px;font-weight:800;color:#2b2f38;margin:0 0 10px;}
.mh-note-text{font-size:14px;line-height:1.7;color:#7a7f8a;margin:0 0 20px;}
.mh-note-links{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;}
.mh-btn{
	display:inline-block;border:0;background:#6a5cff;color:#fff;text-decoration:none;
	font-size:13px;font-weight:600;padding:9px 20px;border-radius:999px;transition:.15s;
}
.mh-btn:hover{filter:brightness(1.06);color:#fff;}
.mh-btn-ghost{background:#fff;color:#5a5f6a;border:1px solid #e2e6ee;}
.mh-btn-ghost:hover{background:#f6f7fb;color:#5a5f6a;}

/* =========================================================
   网址卡片
   ========================================================= */
.home-cards{width:100%;margin:0 0 12px;padding:14px 2px 8px;}
.home-cards-grid{
	display:grid;
	grid-template-columns:repeat(10,1fr);
	column-gap:clamp(10px,1vw,18px);
	row-gap:clamp(8px,0.7vw,12px);
	max-width:1220px;margin:0 auto;
}
.home-cards .hc-app{
	position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;
	padding:6px 2px 5px;text-decoration:none !important;color:#4a4f59 !important;
	border-radius:14px;transition:background .15s,transform .15s;
	user-select:none;-webkit-user-select:none;
}
.home-cards .hc-app:hover{background:rgba(0,0,0,.045);}
.home-cards .hc-app:active{transform:scale(.96);}
.home-cards .hc-icon{
	position:relative;width:clamp(40px,4.6vw,54px);height:clamp(38px,4.3vw,51px);
	border-radius:24%;display:flex;align-items:center;justify-content:center;
	font-size:clamp(15px,1.8vw,21px);font-weight:800;color:#fff;overflow:hidden;
	box-shadow:0 6px 14px rgba(43,47,56,.16);
}
.home-cards .hc-letter{line-height:1;}
.home-cards .hc-label{
	font-size:clamp(11px,1.2vw,13px);font-weight:600;color:#4a4f59;
	max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
/* 响应式：回退到 v1.7（查完 bug 那一版）的纯网格形态 —— 手机 4 列、平板 6 列小卡片，
   不切列表、不隐藏图标。v1.8~v1.10 的列表形态实测不好看，已按用户要求撤销。 */
@media (max-width:760px){.home-cards-grid{grid-template-columns:repeat(6,1fr);}.mh-name{font-size:22px;}}
@media (max-width:480px){.home-cards-grid{grid-template-columns:repeat(4,1fr);}}

/* 只读态（他人主页 / 未登录）：不输出「+」按钮，但空位仍占格。
   ⚠️ 这里**不要**再给 .hc-app 加 cursor:default / hover 透明 —— 卡片本身就是 <a href>，
   抹掉手型与 hover 高亮会让访客看不出它能点（实测反馈：「鼠标放上去没反应，点了却能打开」）。
   该关的是编辑反馈（+ 按钮、拖拽、右键菜单），不是链接反馈。v1.27 起只读态与编辑态观感一致。 */
/* 只读态的占位格：与站长看到的空格子同尺寸同底色，但**不画 + 号、不响应 hover 与点击**。
   必须占格：省略空位会让 CSS grid 把后面的卡前移补位，访客视图与站长视图整体错位，
   看着像「被自动重排」（2026-10-27 实际翻车过一次）。
   注意用 pointer-events:none 而不是 visibility:hidden —— 后者整格不可见，
   访客就看不出这里空着（本轮要求改回可见）。 */
.home-cards .hc-gap{pointer-events:none;user-select:none;-webkit-user-select:none;cursor:default;}
.home-cards .hc-gap:hover{background:transparent;}
.home-cards .hc-gap .hc-icon{background:rgba(0,0,0,.05);box-shadow:none;}
.home-cards .hc-gap .hc-label{color:transparent;}
/* 乙：拖拽进行中才让空洞成为落位目标。平时仍是 pointer-events:none（不可点、不参与命中测试），
   只有 grid 带上 .mh-drag-live（startDrag 加、endDrag 去）的那几秒可命中。
   ⚠ 类加在 #homeCardsGrid 上、.home-cards 是其父级，所以必须用后代选择器；
   写成 .home-cards.mh-drag-live（同类叠加）永不匹配 —— 第一版就是这么失败的。
   双类 + 后代 = (0,3,0)，压得过上面的 (0,2,0) 规则。 */
.home-cards .mh-drag-live .hc-gap{pointer-events:auto;}
.home-cards .hc-gap.hc-drop-hover{background:rgba(106,92,255,.10);}

/* ---------- 可编辑：空位 / 拖拽 ---------- */
.home-cards .hc-ph{
	appearance:none;-webkit-appearance:none;border:0;outline:none;
	color:#9aa0aa;cursor:pointer;background:transparent;
}
.home-cards .hc-ph:hover{background:rgba(0,0,0,.04);}
.home-cards .hc-ph:focus,.home-cards .hc-ph:focus-visible{outline:none;}
.home-cards .hc-ph-ico{
	background:rgba(0,0,0,.05);color:#9aa0aa;box-shadow:none;
	border-radius:24%;font-size:28px;font-weight:400;
}
.home-cards .hc-dragging{opacity:.22;}
.home-cards .hc-drop-hover{outline:2px solid #6a5cff;outline-offset:2px;}
/* 拖动副本的宿主：必须带 .home-cards 类，卡片的尺寸/圆角/图标样式都写在该作用域下 ——
   直接挂到 body 会让 `.home-cards .hc-icon` 失配、图标塌成行内框（实测 16x17），
   看起来就是"只拖文字不拖整张卡"（2026-10-29 反馈）。宿主自己再抵消 .home-cards 的宽度与内边距。 */
.home-cards.hc-clone-host{
	position:fixed;z-index:99999;width:auto;margin:0;padding:0;
	pointer-events:none;background:transparent;
}
.home-cards .hc-clone{position:static;opacity:.96;transition:none;}
.home-cards .hc-clone .hc-icon{box-shadow:0 12px 26px rgba(43,47,56,.35);}

/* ---------- 右键菜单 ---------- */
.hc-menu{
	position:fixed;z-index:2147483000;min-width:124px;
	background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:12px;padding:6px;
	box-shadow:0 14px 36px rgba(43,47,56,.22);
	display:flex;flex-direction:column;gap:2px;
}
.hc-menu[hidden]{display:none;}
.hc-menu button{
	border:0;background:transparent;cursor:pointer;text-align:left;
	font-size:14px;font-weight:600;color:#3a3f49;padding:9px 12px;border-radius:8px;
	transition:.12s;font-family:inherit;
}
.hc-menu button:hover{background:rgba(106,92,255,.1);color:#6a5cff;}
.hc-menu-cancel{margin-top:2px;padding-top:8px;border-top:1px solid rgba(0,0,0,.07);color:#888;}
.hc-menu-cancel:hover{background:rgba(0,0,0,.04);color:#555;}

/* ---------- 添加/编辑弹窗 ---------- */
.hc-modal{position:fixed;inset:0;z-index:2147483001;display:flex;align-items:center;justify-content:center;}
.hc-modal[hidden]{display:none;}
.hc-modal-mask{position:absolute;inset:0;background:rgba(20,22,30,.45);backdrop-filter:blur(2px);}
.hc-modal-box{
	position:relative;width:min(92vw,360px);background:#fff;border-radius:18px;
	padding:22px 20px 18px;box-shadow:0 24px 60px rgba(20,22,30,.3);font-family:inherit;
}
.hc-modal-title{font-size:18px;font-weight:800;color:#2b2f38;margin:0 0 16px;}
.hc-field{display:block;font-size:13px;color:#7a7f8a;margin-bottom:14px;}
.hc-field input[type=text]{
	display:block;width:100%;margin-top:6px;box-sizing:border-box;
	border:1.5px solid #e2e6ee;border-radius:10px;padding:10px 12px;
	font-size:15px;color:#2b2f38;outline:0;transition:.15s;font-family:inherit;
}
.hc-field input[type=text]:focus{border-color:#6a5cff;box-shadow:0 0 0 3px rgba(106,92,255,.15);}
.hc-err{font-size:12px;color:#ff4d4f;min-height:16px;margin:-6px 0 8px;}
.hc-actions{display:flex;justify-content:flex-end;gap:10px;}
.hc-actions button{
	border:0;cursor:pointer;font-size:14px;font-weight:600;padding:9px 20px;
	border-radius:999px;transition:.15s;font-family:inherit;
}
.hc-btn-cancel{background:#f0f1f5;color:#5a5f6a;}
.hc-btn-cancel:hover{background:#e6e8ee;}
.hc-btn-save{color:#fff;background:linear-gradient(135deg,#6a5cff,#a66bff);box-shadow:0 6px 16px rgba(106,92,255,.3);}
.hc-btn-save:hover{transform:translateY(-1px);}

/* ---------- 颜色选择 ---------- */
.hc-color-row{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:6px;}
.hc-presets{display:inline-flex;flex-wrap:wrap;gap:6px;}
.hc-swatch{
	width:22px;height:22px;border-radius:6px;border:2px solid rgba(0,0,0,.12);
	cursor:pointer;padding:0;transition:.12s;
}
.hc-swatch:hover{transform:scale(1.12);}
.hc-swatch.hc-active,.hc-swatch-auto.hc-active{border-color:#222;box-shadow:0 0 0 2px #fff,0 0 0 4px #6a5cff;}
.hc-swatch-auto{
	width:auto;height:22px;padding:0 10px;border-radius:6px;background:#f0f1f5;color:#5a5f6a;
	font-size:12px;font-weight:600;border:2px solid rgba(0,0,0,.12);cursor:pointer;font-family:inherit;
}
.hc-color-custom{width:30px;height:24px;padding:0;border:1px solid #e2e6ee;border-radius:6px;background:#fff;cursor:pointer;}

/* ---------- 积分变动提示条（登录奖励等；服务端渲染，JS 只负责关闭） ---------- */
.mh-credit-notice{
	position:fixed;top:auto;bottom:18px;left:50%;transform:translateX(-50%);z-index:999;
	display:flex;align-items:center;gap:10px;flex-wrap:wrap;
	max-width:calc(100vw - 24px);padding:8px 12px;border-radius:10px;
	background:#fff;border:1px solid #e2e6ee;box-shadow:0 6px 24px rgba(31,38,66,.14);
	font-size:13px;color:#3a3f4a;font-family:inherit;
}
.mh-cre-rule{color:#8a8f99;font-size:12px;}
.mh-cre-item{display:inline-flex;align-items:center;gap:2px;}
.mh-cre-item b{font-weight:700;}
.mh-cre-pos{color:#31c193;}
.mh-cre-neg{color:#ff4d4f;}
.mh-cre-close{border:0;background:transparent;color:#b6bcc8;font-size:18px;line-height:1;cursor:pointer;padding:0 2px;font-family:inherit;}
.mh-cre-close:hover{color:#5a5f6a;}
@media (max-width:480px){.mh-credit-notice{font-size:12px;gap:6px;padding:7px 10px;bottom:10px;}}

/* ---------- v1.39：积分提示对齐核心 .pc_inner 的实际观感（红色胶囊、屏幕中部偏上） ----------
   参照物是这台站真正生效的那份：template/discuzx5/common/extend_common.css:647-652 覆盖了
   template/default/common/common.css:1455-1461，合并结果（data/cache/style_2_common.css 实测）：
     background:#F26C4F(=风格变量 noticetext) / background-image:none / border:none
     border-radius:8px / min-width:300px / height:48px / line-height:48px
     box-shadow:0 0 8px rgba(88,88,88,.3) / padding:0 15px / text-align:center / white-space:nowrap
     文字 #FFF(=wrapbg)，名称 14px、数字 18px，涨跌同色（核心的 em.desc 被重写成了 --dz-ff）
   定位抄 common.js 的 pos:'00'：水平居中 + 垂直居中再上抬 100px，即 top = 50vh − 24 − 100。
   两个颜色不写死：服务端按 $_G['style'] 下发 --mh-cre-bg / --mh-cre-fg，下面的 var() 第二参只是兜底。
   游客浮条（只有 .mh-credit-notice，没有 .mh-cre-core）不受这块影响，仍是底部白胶囊。 */
.mh-credit-notice.mh-cre-core{
	top:calc(50vh - 124px);bottom:auto;
	min-width:300px;height:48px;line-height:48px;padding:0 15px;
	gap:0;flex-wrap:nowrap;border:0;border-radius:8px;justify-content:center;
	background:var(--mh-cre-bg,#f26c4f);
	box-shadow:0 0 8px rgba(88,88,88,.3);
	color:var(--mh-cre-fg,#fff);font-size:14px;font-weight:400;white-space:nowrap;
}
.mh-cre-core .mh-cre-rule{margin:0 5px;color:var(--mh-cre-fg,#fff);font-size:14px;font-weight:400;}
.mh-cre-core .mh-cre-item{margin-right:5px;color:var(--mh-cre-fg,#fff);font-size:14px;font-weight:400;}
.mh-cre-core .mh-cre-item b{margin:0 4px;font-size:18px;font-weight:400;color:var(--mh-cre-fg,#fff);}
.mh-cre-core .mh-cre-pos,.mh-cre-core .mh-cre-neg{color:var(--mh-cre-fg,#fff);}
.mh-cre-core .mh-cre-close{color:var(--mh-cre-fg,#fff);opacity:.72;font-size:20px;}
.mh-cre-core .mh-cre-close:hover{color:var(--mh-cre-fg,#fff);opacity:1;}
@media (max-width:480px){.mh-credit-notice.mh-cre-core{min-width:0;}}

/* ---------- 右上角「消息 / 提醒」的未读数角标 ---------- */
.mh-nav-num{
	display:inline-block;min-width:16px;height:16px;line-height:16px;padding:0 4px;margin-left:4px;
	border-radius:9px;background:#ff4d4f;color:#fff;font-size:11px;font-weight:700;
	vertical-align:middle;text-align:center;
}
a.mh-nav-btn:hover .mh-nav-num{background:#e43c3e;}
