/* Prompt 展間共用樣式。色系：乾燥玫瑰 */
:root{
  --paper:#faf5f3; --card:#fffcfb; --ink:#3f3436; --title:#6a3d45; --sub:#a25f6a; --link:#a25f6a;
  --mute:#a59698; --line:#ecdfdd; --pill:#f3e4e2; --block:#f6ecea; --fill:#f1d5d6; --fill-line:#b8707b;
  --main:#a8616c; --main-d:#96535e; --edge:#e3cfce;
}
*{box-sizing:border-box}
body{font-family:system-ui,'Microsoft JhengHei',sans-serif;margin:0;background:var(--paper);color:var(--ink);font-size:15px;line-height:1.6}
a{color:var(--link);text-decoration:none}
button,input,select{font:inherit;color:inherit}
[hidden]{display:none !important}

/* 頂欄：標題（回首頁）｜找 Prompt｜收藏｜搜尋｜語言 */
.top{position:sticky;top:0;z-index:5;background:rgba(250,245,243,.95);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.top-in{position:relative;max-width:1080px;margin:0 auto;padding:6px 16px 8px;display:flex;align-items:center;gap:6px 12px;flex-wrap:wrap}
.brand{order:1;flex:1 1 auto;font-family:'Great Vibes','Snell Roundhand','Apple Chancery',cursive;font-size:2em;line-height:1.15;color:var(--title);white-space:nowrap}
.lang{order:2;flex:none;width:auto;height:34px;font-size:16px;padding:0 28px 0 10px;border-radius:999px;background-color:var(--card)}
.social{order:2;flex:none;width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:var(--card);color:var(--title);display:grid;place-items:center}
.social:hover{background:var(--pill)}
.tabs{order:3;display:flex;gap:4px;flex:none}
.tabs a{padding:5px 12px;border-radius:999px;color:var(--mute);font-size:.92em;white-space:nowrap}
.tabs a.on{background:var(--pill);color:var(--title);font-weight:600}
.search{order:4;flex:1 1 120px;min-width:0;display:flex;align-items:center;gap:8px;background:var(--card);border:1px solid var(--line);border-radius:999px;padding:0 14px;height:38px;color:var(--mute);margin:0}
.search svg{flex:none}
.search input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-size:16px;-webkit-appearance:none;appearance:none}
.search{padding-right:4px}
.gear{flex:none;width:32px;height:30px;border:0;border-radius:999px;background:transparent;color:var(--sub);cursor:pointer;display:grid;place-items:center;padding:0}
.gear:hover,.gear[aria-expanded=true]{background:var(--pill)}
/* 搜尋設定的小浮動視窗 */
.pop{position:absolute;right:16px;top:calc(100% + 6px);width:min(290px,calc(100vw - 32px));background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:0 14px 34px rgba(106,61,69,.2);padding:12px 14px 14px;z-index:6}
.hits{position:absolute;left:16px;right:16px;top:calc(100% + 6px);max-height:min(70vh,460px);overflow:auto;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:0 14px 34px rgba(106,61,69,.2);padding:6px;z-index:6}
.hit{display:flex;align-items:center;gap:12px;padding:6px 8px;border-radius:10px;color:inherit;min-width:0}
.hit:hover,.hit:focus{background:var(--pill)}
.hit img{flex:none;width:46px;height:46px;border-radius:8px;object-fit:cover}
.hit span{display:flex;flex-direction:column;min-width:0}
.hit b{font-weight:600;color:var(--title);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hit small{color:var(--mute);font-size:.78em;letter-spacing:.06em;text-transform:uppercase;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hit-all{display:block;text-align:center;padding:9px 8px 7px;color:var(--sub);font-size:.92em;border-top:1px dashed var(--line);margin-top:4px}
.hits-none{margin:0;padding:12px 10px;color:var(--mute);text-align:center}
.pop h3{margin:0 0 8px;font-size:.9em;color:var(--sub);letter-spacing:.03em}
.opt{display:flex;align-items:flex-start;gap:9px;cursor:pointer}
.opt input{accent-color:var(--main);width:18px;height:18px;flex:none;margin:2px 0 0}
.opt b{display:block;font-weight:600;color:var(--ink)}
.opt small{display:block;color:var(--mute);font-size:.82em;line-height:1.5;margin-top:1px}

main{max-width:1080px;margin:0 auto;padding:16px}
footer{max-width:1080px;margin:10px auto 0;padding:10px 16px 34px;text-align:center;color:var(--mute);font-size:.8em}
.orn{color:#d3aeb1;text-align:center;letter-spacing:.2em;margin:18px 0 2px;font-size:.85em;overflow:hidden;white-space:nowrap}

/* 控制項一律同高、字級 16px：iPhone Safari 遇到小於 16px 的輸入框會自動放大畫面；原生下拉在 iOS 又比別人矮，所以外觀自己畫 */
select,.field input[type=text],.check,.acts .btn{height:42px}
select,.field input[type=text]{width:100%;padding:0 10px;border:1px solid var(--line);border-radius:10px;background:var(--paper);outline:0;font-size:16px;color:var(--ink);line-height:normal;margin:0}
select{-webkit-appearance:none;appearance:none;padding-right:32px;text-overflow:ellipsis;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23a25f6a' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 11px center}
.field input[type=text]{-webkit-appearance:none;appearance:none}
select:focus,.field input[type=text]:focus{border-color:var(--fill-line);box-shadow:0 0 0 3px rgba(184,112,123,.18)}
.btn{border:1px solid var(--edge);background:var(--paper);border-radius:10px;padding:7px 12px;cursor:pointer;white-space:nowrap}
.btn:hover{background:var(--pill)}
.btn.main{background:var(--main);border-color:var(--main);color:#fff6f4;font-weight:600}
.btn.main:hover{background:var(--main-d)}
.btn.main,.btn.side{height:40px;padding:0 16px}
.btn.side{background:var(--card);color:var(--sub)}
.pill{background:var(--pill);border-radius:8px;padding:2px 9px;font-size:.82em;color:#7a5a5e}
.pill.tool{background:var(--title);color:#fdf1ef}
a.pill{text-decoration:none;transition:background .12s}
a.pill:hover,a.pill:focus-visible{background:var(--fill)}

/* ---------- 首頁：篩選列＋封面牆 ---------- */
.filters{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:2px 0 14px}
.rand{font-size:.88em;color:var(--sub);white-space:nowrap;letter-spacing:.04em}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{border:1px solid var(--edge);background:var(--card);border-radius:999px;padding:5px 14px;cursor:pointer;color:var(--sub);font-size:.92em}
.chip.on{background:var(--main);border-color:var(--main);color:#fff6f4;font-weight:600}
.more{display:flex;justify-content:center;gap:10px;margin-top:20px}
.more .btn{height:40px;padding:0 20px;border-radius:999px;background:var(--card);color:var(--sub)}
.more .btn.main{background:var(--main);color:#fff6f4}
.more .btn.main:hover{background:var(--main-d)}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;grid-auto-flow:dense}
.card{position:relative;display:flex;flex-direction:column;min-width:0}
.card.wide{grid-column:span 2}
.card a{display:flex;flex-direction:column;flex:1 1 auto;color:inherit;min-width:0}
/* 直幅佔一格（5:7）、橫幅佔兩格（約 10:7），同一列高度會自動拉齊 */
.ph{position:relative;flex:1 1 auto;aspect-ratio:5/7;border-radius:12px;overflow:hidden;background:var(--pill);box-shadow:0 6px 18px rgba(106,61,69,.13)}
.card.wide .ph{aspect-ratio:10/7}
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 22%;display:block}
.cap{position:absolute;left:0;right:0;bottom:0;padding:30px 12px 10px;background:linear-gradient(rgba(63,40,44,0),rgba(63,40,44,.74));opacity:0;transition:opacity .15s;pointer-events:none}
.cap b{display:block;color:#fff8f6;font-size:.98em;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cap span{display:block;color:rgba(255,248,246,.82);font-size:.7em;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (hover:hover){.card a:hover .cap,.card a:focus-visible .cap{opacity:1}}
.heart{position:absolute;top:8px;right:8px;width:36px;height:36px;border-radius:50%;border:0;background:rgba(255,252,251,.86);color:var(--main);cursor:pointer;display:grid;place-items:center;padding:0;box-shadow:0 2px 6px rgba(106,61,69,.2)}
.heart svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2}
.heart.on svg{fill:currentColor}
.empty{grid-column:1 / -1;text-align:center;color:var(--mute);padding:48px 10px}

/* ---------- 單頁 ---------- */
.crumb{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;min-height:36px}
.back{font-size:.85em;color:var(--mute)}
.sheet{display:grid;gap:22px}
.cover{margin:0}
.cover img{display:block;width:100%;height:auto;border-radius:14px;box-shadow:0 10px 30px rgba(106,61,69,.18)}
.favbtn{flex:none;display:flex;align-items:center;gap:6px;height:36px;padding:0 14px;font-size:.9em;border-radius:999px;border:1px solid var(--edge);background:var(--card);color:var(--main);cursor:pointer}
.favbtn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2}
.favbtn.on{background:var(--pill);font-weight:600}
.favbtn.on svg{fill:currentColor}
.thead{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.thead.wrapok{flex-wrap:wrap}
h1 .ln{font-weight:inherit;white-space:nowrap}
h1{font-size:1.7em;line-height:1.25;margin:0;color:var(--title);letter-spacing:.02em}
h1 span{display:block;font-size:.5em;font-weight:400;color:var(--sub);letter-spacing:.14em;margin-top:4px;text-transform:uppercase}
.thr{flex:none;display:inline-flex;align-items:center;gap:5px;margin-top:4px;font-size:.82em;border:1px solid var(--edge);border-radius:999px;padding:4px 11px;background:var(--card);white-space:nowrap}
.thr:hover{background:var(--pill)}
.pills{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 0}
.say{margin:14px 0 0;padding:10px 14px;border-left:3px solid #e0bfc1;background:var(--card);border-radius:0 10px 10px 0;color:#6a5053;white-space:pre-line}
h2{font-size:1.2em;margin:0;color:var(--sub);letter-spacing:.03em;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
h2 small{font-weight:400;color:var(--mute);font-size:.68em;letter-spacing:0}
.shead{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:18px 0 8px;min-height:40px}
.panel{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px}
.row{display:grid;gap:10px;margin-bottom:10px}
.row:last-child{margin-bottom:0}
.who{grid-template-columns:minmax(0,1fr);padding-bottom:12px;margin-bottom:12px;border-bottom:1px dashed var(--line)}
.acts{display:flex;gap:6px}
.acts .btn{flex:1 1 0;padding:0 6px;text-align:center}
.hint{font-size:.78em;color:var(--mute);line-height:1.5}
.status{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;font-size:.8em}
.msg{color:var(--sub)}
.del{margin-left:auto;border:0;background:none;padding:0;font-size:1em;color:#b0494f;text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.pc{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}
.field{min-width:0}
.field>label:first-child{display:block;font-size:.82em;color:var(--sub);margin-bottom:3px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.check{display:flex;align-items:center;gap:8px;padding:0 10px;font-size:16px;border:1px solid var(--line);border-radius:10px;background:var(--paper);cursor:pointer;min-width:0}
.check input{accent-color:var(--main);width:17px;height:17px;flex:none;margin:0}
.check span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.out{background:var(--block);border-radius:10px;padding:14px;line-height:1.85;white-space:pre-wrap;overflow-wrap:anywhere;font-size:.95em}
.slot{border-radius:5px;padding:1px 4px}
.slot.done{background:var(--fill);box-shadow:inset 0 -2px 0 var(--fill-line);-webkit-box-decoration-break:clone;box-decoration-break:clone}
.slot.todo{border:1px dashed #cfa3a8;color:var(--main);background:#fff7f6;white-space:nowrap}

@media (min-width:560px){
  .who{grid-template-columns:minmax(0,1fr) auto}
  .who .hint,.who .status{grid-column:1 / -1}
  .acts .btn{flex:0 0 auto;padding:0 12px}
  .grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
}
@media (min-width:860px){
  .top-in{flex-wrap:nowrap;gap:14px;padding:8px 16px}
  .brand{order:0;flex:none;font-size:2.15em}
  .tabs{order:0}
  .search{order:0;flex:1 1 auto}
  .lang,.social{order:0}
  main{padding:26px 16px}
  .grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
  .sheet{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:34px;align-items:start}
  .cover{position:sticky;top:76px}
  h1{font-size:2.1em}
}
@media (min-width:1080px){
  .grid{grid-template-columns:repeat(5,minmax(0,1fr))}
}