/*
 * 页面专属样式：工具 · 提示词生成器
 *
 * 前半段 .tool-* 是工具页公共骨架，抄自 page-tool-aspect-ratio.css（两边要一起改）；
 * .pg-* 只属于这个工具。.btn-line 原来只在创作台的样式里，这一页用得到，单独补一份。
 */

#nys-main .tool-page {
	max-width:var(--wrap-mid);
	margin:0 auto;
	padding:40px 28px 90px;
}

/* ---------- 标题区 ---------- */
.tool-head { margin-bottom:26px; }
.tool-crumb {
	display:inline-block;
	font-size:13px;
	color:var(--ink-soft);
	text-decoration:none;
	margin-bottom:10px;
}
.tool-crumb:hover { color:var(--ink); }
.tool-head h1 {
	font-size:38px;
	line-height:1.12;
	margin:0 0 12px;
	text-wrap:balance;
}
.tool-lead {
	font-size:16px;
	line-height:1.6;
	color:var(--ink-body, #4B4B52);
	margin:0;
	max-width:640px;
}

/* ---------- 分节 ---------- */
.tool-sec { margin-top:48px; }
.tool-sec h2 { font-size:24px; margin:0 0 16px; }

/*
 * ⚠ position:relative 不能省：表头最后一格里有个 .sr-only（position:absolute），
 *   滚动容器不是定位元素时它会相对整页定位，把页面撑出横向滚动条（德、法语 390 宽实测）。
 */
.tool-faq details { border-bottom:1px solid var(--border); }
.tool-faq summary {
	cursor:pointer;
	list-style:none;
	padding:16px 28px 16px 0;
	position:relative;
}
.tool-faq summary::-webkit-details-marker { display:none; }
.tool-faq summary::after {
	content:'';
	position:absolute; right:4px; top:50%;
	width:8px; height:8px;
	border-right:1.5px solid var(--ink-soft); border-bottom:1.5px solid var(--ink-soft);
	transform:translateY(-70%) rotate(45deg);
	transition:transform var(--dur);
}
.tool-faq details[open] summary::after { transform:translateY(-30%) rotate(-135deg); }
.tool-faq summary h3 { display:inline; font-size:15.5px; font-family:'Inter',sans-serif; font-weight:600; margin:0; }
.tool-faq p { margin:0 0 16px; font-size:14.5px; line-height:1.65; color:var(--ink-body, #4B4B52); }

.tool-related { list-style:none; padding:0; margin:0; display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.tool-related a {
	display:block;
	padding:14px 16px;
	border:1px solid var(--border);
	border-radius:var(--radius);
	text-decoration:none;
	color:var(--ink);
	font-size:14px;
	min-height:44px;
	transition:border-color var(--dur);
}
.tool-related a:hover { border-color:var(--ink-soft); }

.sr-only {
	position:absolute; width:1px; height:1px; padding:0; margin:-1px;
	overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}


/* ---------- 表单 ---------- */
.pg-form {
	border:1px solid var(--border);
	border-radius:var(--radius-lg);
	padding:22px;
	background:var(--bg);
	box-shadow:var(--shadow);
}
.pg-idea { display:flex; flex-direction:column; gap:6px; font-size:12.5px; color:var(--ink-soft); }
.pg-idea textarea {
	width:100%;
	min-height:86px;
	resize:vertical;
	border:1px solid var(--border);
	border-radius:var(--radius-sm);
	padding:12px 14px;
	font:inherit;
	font-size:16px;
	line-height:1.5;
	color:var(--ink);
}
.pg-idea textarea:focus, .pg-row select:focus { outline:2px solid var(--accent); outline-offset:1px; border-color:transparent; }
.pg-row { display:flex; flex-wrap:wrap; align-items:flex-end; gap:12px; margin-top:14px; }
.pg-row label { display:flex; flex-direction:column; gap:6px; font-size:12.5px; color:var(--ink-soft); }
.pg-row select {
	height:44px;
	min-width:170px;
	border:1px solid var(--border);
	border-radius:var(--radius-sm);
	padding:0 10px;
	font:inherit;
	font-size:15px;
	color:var(--ink);
	background:var(--bg);
}
.pg-go { margin-left:auto; min-height:44px; }
.pg-go.is-busy { opacity:.7; cursor:progress; }
.pg-err { margin:12px 0 0; font-size:13.5px; color:var(--accent); }
.pg-err[hidden] { display:none; }
.pg-note { margin:12px 0 0; font-size:12.5px; color:var(--ink-soft); line-height:1.5; }

/* ---------- 结果 ---------- */
.pg-out { margin-top:36px; scroll-margin-top:calc(var(--topbar-h) + 16px); }
.pg-out h2 { font-size:22px; margin:0 0 6px; }
.pg-ex-idea { margin:0 0 14px; font-size:13.5px; color:var(--ink-soft); }
.pg-cards { display:grid; gap:12px; }
.pg-card {
	border:1px solid var(--border);
	border-radius:var(--radius);
	padding:16px 18px;
	background:var(--bg);
}
.pg-card-h { font-size:12px; font-weight:600; letter-spacing:.02em; text-transform:uppercase; color:var(--accent); margin-bottom:6px; }
.pg-text { margin:0 0 12px; font-size:15px; line-height:1.6; color:var(--ink); overflow-wrap:anywhere; }
.pg-acts { display:flex; gap:8px; flex-wrap:wrap; }
.pg-acts .btn-line {
	display:inline-flex;
	align-items:center;
	min-height:36px;
	padding:0 14px;
	border:1px solid var(--border);
	border-radius:999px;
	background:var(--bg);
	font:inherit;
	font-size:13px;
	font-weight:500;
	color:var(--ink);
	text-decoration:none;
	cursor:pointer;
}
.pg-acts .btn-line:hover { background:var(--bg-soft); }
.pg-acts .btn-line.primary { background:var(--ink); border-color:var(--ink); color:#fff; }

.pg-tips { margin:0; padding-left:20px; display:grid; gap:8px; font-size:14.5px; line-height:1.6; color:var(--ink-body, #4B4B52); }

@media (max-width:760px) {
	#nys-main .tool-page { padding:28px 16px 70px; }
	.tool-head h1 { font-size:30px; }
	.tool-related { grid-template-columns:1fr; }
	.pg-form { padding:16px; }
	.pg-row label { flex:1 1 140px; }
	.pg-row select { min-width:0; width:100%; }
	.pg-go { width:100%; margin-left:0; justify-content:center; }
}