.hidden { display:none !important; }

:root { --ink:#14231e; --muted:#6d7772; --cream:#f5f2e9; --paper:#fffefa; --gold:#b8964a; --gold-dark:#806425; --line:#ded9cc; }
* { box-sizing:border-box; }
html { background:var(--cream); color:var(--ink); }
body { margin:0; font-family:"Yu Gothic","Hiragino Kaku Gothic ProN",Meiryo,sans-serif; background:radial-gradient(circle at 80% 0%,#e9e4d6 0,transparent 27%),var(--cream); }
button,input,select { font:inherit; }
button { cursor:pointer; }
.topbar { height:82px; max-width:1240px; margin:auto; padding:0 28px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(128,100,37,.24); }
.brand { display:flex; align-items:center; gap:12px; letter-spacing:.12em; }
.brand-mark { width:39px; height:39px; background:var(--ink); color:#f0d590; display:grid; place-items:center; font:700 22px Georgia,serif; transform:rotate(45deg); }
.brand-mark::first-letter { transform:rotate(-45deg); }
.brand-logo { width:48px; height:48px; object-fit:contain; flex:0 0 48px; }
.brand strong,.brand small { display:block; }.brand strong { font:700 15px Georgia,serif; }.brand small { font-size:10px; margin-top:3px; color:var(--muted); }
.outline-button { border:1px solid var(--ink); background:transparent; padding:10px 15px; font-size:12px; font-weight:700; }.outline-button span { color:var(--gold-dark); margin-left:8px; font-size:18px; }
.intro { max-width:1184px; margin:64px auto 38px; padding:0 28px; }
.eyebrow,.step-label { font:700 10px Georgia,serif; letter-spacing:.22em; color:var(--gold-dark); }
.intro h1 { margin:12px 0 14px; font-family:Georgia,"Yu Mincho",serif; font-size:clamp(34px,5vw,59px); font-weight:500; letter-spacing:.03em; }
.intro h1 em { color:var(--gold-dark); font-style:normal; border-bottom:1px solid var(--gold); }
.intro>p:last-child { color:var(--muted); font-size:14px; }
.workspace { max-width:1184px; padding:0 28px; margin:auto; display:grid; grid-template-columns:minmax(0,1.62fr) minmax(300px,.8fr); gap:25px; align-items:start; }
.calculator-card,.result-card,.material-manager { background:rgba(255,254,250,.88); border:1px solid var(--line); box-shadow:0 10px 35px rgba(51,45,31,.06); }
.calculator-card { padding:34px 38px; }
.step-head { display:flex; align-items:center; gap:15px; margin-bottom:22px; }
.step-head>span { width:35px;height:35px; border:1px solid var(--gold); display:grid; place-items:center; color:var(--gold-dark); font:700 12px Georgia,serif; }
.step-head p { margin:0; font-weight:700; font-size:16px; }.step-head small { color:var(--muted); font-size:11px; }
.material-row { display:grid; grid-template-columns:1fr 170px; gap:12px; }
.select-wrap select { width:100%; height:62px; border:1px solid var(--line); background:white; padding:0 17px; font-weight:700; outline-color:var(--gold); }
.density-badge { display:flex; align-items:center; justify-content:center; gap:14px; padding:8px; border:1px solid #d8ceb1; background:#f7f1df; }
.density-badge>span { border:1px solid currentColor; border-radius:50%; width:42px;height:42px; display:grid;place-items:center; font:700 8px Georgia,serif; }
.density-badge div { font-size:9px; color:var(--muted); }.density-badge strong { display:inline-block; font:700 21px Georgia,serif; color:var(--ink); margin:0 3px; }.density-badge small { font-size:8px; }
.density-badge.silver { background:#f2f4f3; border-color:#d5dbd8; }.density-badge.platinum { background:#e9eeee; border-color:#bdc9c6; }
.divider { height:1px; background:var(--line); margin:31px 0; }
.shape-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:7px; }
.shape-grid button { min-height:75px; border:1px solid var(--line); background:white; color:#78807c; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; }
.shape-grid button i { font-style:normal; font-size:25px; font-family:Georgia,serif; line-height:1; }.shape-grid button span { font-size:10px;font-weight:700; }
.shape-grid button i.shape-choice-icon { display:block; position:relative; width:42px; height:30px; background:currentColor; box-shadow:none; }
.shape-grid button i.choice-kamaboko { width:48px; height:27px; border-radius:50% 50% 4px 4px / 100% 100% 4px 4px; background:#7c8783 !important; box-shadow:none; }
.shape-grid button i.choice-ellipse { width:48px; height:28px; border-radius:50%; }
.shape-grid button i.choice-hexagon { width:40px; height:36px; clip-path:polygon(25% 4%,75% 4%,100% 50%,75% 96%,25% 96%,0 50%); }
.shape-grid button i.choice-pipe { width:36px; height:36px; border-radius:50%; }
.shape-grid button i.choice-pipe::after { content:""; position:absolute; inset:8px; border-radius:50%; background:#fff; }
.shape-grid button.active { border:2px solid var(--gold-dark); color:var(--ink); background:#fbf7ec; box-shadow:inset 0 -3px var(--gold); }
.dimension-layout { display:grid; grid-template-columns:170px 1fr; gap:24px; }
.section-visual { border:1px dashed #cfc6b0; min-height:178px; display:flex;flex-direction:column;align-items:center;justify-content:center;background:#faf8f2; }
.section-visual>small { font-size:8px; color:#999; margin-top:17px; }
.hero-shape { width:92px;height:58px; display:grid;place-items:center; color:white; font-size:9px; background:linear-gradient(135deg,#d9c082,#8d6d2c); box-shadow:inset -8px -6px 15px rgba(40,25,0,.2); }
.shape-round { width:75px;height:75px;border-radius:50%; }.shape-triangle { clip-path:polygon(50% 0,100% 100%,0 100%); padding-top:25px; }.shape-kamaboko { border-radius:50% 50% 7% 7%; }.shape-l { clip-path:polygon(0 0,30% 0,30% 70%,100% 70%,100% 100%,0 100%); }.shape-v { clip-path:polygon(0 0,18% 0,50% 66%,82% 0,100% 0,50% 100%); }.shape-plate { height:24px; }.shape-pipe { border-radius:50%; }.shape-pipe::after { content:""; position:absolute; inset:25%; border-radius:50%; background:#fff; box-shadow:inset 3px 3px 7px rgba(30,30,30,.25); }.shape-hexagon { clip-path:polygon(25% 7%,75% 7%,100% 50%,75% 93%,25% 93%,0 50%); }.shape-ellipse { border-radius:50%; }
.fields { display:grid; grid-template-columns:repeat(2,1fr); gap:13px;align-content:start; }
.number-field>span { display:block; font-size:10px;font-weight:700;margin-bottom:6px;color:#59635e; }
.number-field>div { border:1px solid var(--line); background:white; display:flex;align-items:center;height:52px; }
.number-field input { width:100%;height:100%;border:0;background:transparent;padding:0 12px;outline:0;font:600 20px Georgia,serif;color:var(--ink); }
.number-field em { font-style:normal;font-size:10px;color:#8a918d;padding-right:12px; }
.profile-block { margin-top:25px; background:#f3f0e7; padding:19px; border-left:3px solid var(--gold); }
.profile-title { display:flex;justify-content:space-between;align-items:baseline;margin-bottom:13px; }.profile-title strong { font-size:12px; }.profile-title span { font-size:9px;color:var(--muted); }
.profile-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:8px; }
.profile-grid button { background:white;border:1px solid var(--line);padding:11px 7px;display:flex;flex-direction:column;align-items:center;min-height:115px; }
.profile-grid button.active { border:2px solid var(--gold-dark); background:#fffaf0; }
.profile-pic { display:block;width:62px;height:30px;background:linear-gradient(150deg,#ead79f,#9a793b);margin-bottom:8px;box-shadow:inset -5px -5px 7px rgba(52,34,0,.18); }
.profile-grid strong { font-size:10px; }.profile-grid small { color:var(--muted);font-size:8px;margin-top:3px; }.profile-grid em { font-style:normal;color:var(--gold-dark);font-size:8px;margin-top:auto; }
.options-row { display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:22px;padding-top:20px;border-top:1px solid var(--line); }
aside { position:sticky;top:20px; }.result-card { background:var(--ink);color:#f7f3e8;padding:34px;position:relative;overflow:hidden; }
.result-card::after { content:"";position:absolute;width:230px;height:230px;border:1px solid rgba(213,181,105,.15);border-radius:50%;right:-120px;top:-105px;box-shadow:0 0 0 30px rgba(213,181,105,.04); }
.result-kicker { color:#c7a85e;font:700 9px Georgia,serif;letter-spacing:.2em;margin:0; }.result-card h2 { font:500 17px Georgia,"Yu Mincho",serif;margin:8px 0 20px; }
.weight { display:flex;align-items:baseline;justify-content:center;color:#f4d78e;margin:10px 0 20px; }.weight strong { font:500 clamp(48px,6vw,72px) Georgia,serif;letter-spacing:-.04em; }.weight span { font:500 17px Georgia,serif;margin-left:8px; }
.result-rule { height:1px;background:rgba(255,255,255,.17);margin:20px 0; }
.result-card dl { margin:0 0 25px; }.result-card dl div { display:flex;justify-content:space-between;padding:7px 0;font-size:11px; }.result-card dt { color:#a9b1ad; }.result-card dd { margin:0;font-weight:700; }
.gold-button { width:100%;border:0;background:#c5a555;color:#17241f;padding:15px;font-size:11px;font-weight:800;letter-spacing:.05em; }.gold-button:hover { background:#d8bb72; }.gold-button.small { width:auto;padding:13px 22px;align-self:end; }
.caution { color:#87928d;font-size:8px;text-align:center;margin:13px 0 0; }
.formula-card { border:1px solid var(--line);padding:17px 20px;background:rgba(255,254,250,.7);margin-top:13px; }.formula-card span { color:var(--gold-dark);font-size:9px;font-weight:700; }.formula-card p { font:600 13px Georgia,"Yu Mincho",serif;margin:7px 0 3px; }.formula-card small { color:var(--muted);font-size:8px; }
.material-manager { max-width:1128px;margin:0 auto 22px;padding:20px 25px;display:grid;grid-template-columns:1.1fr 1fr 1fr auto auto;gap:13px;align-items:end; }.material-manager h2 { margin:3px 0;font-size:16px; }.material-manager label { font-size:9px;font-weight:700; }.material-manager input { display:block;width:100%;height:41px;border:1px solid var(--line);padding:0 10px;margin-top:5px; }.text-button { border:0;background:transparent;color:var(--gold-dark);font-size:10px;text-decoration:underline; }
.history-section { max-width:1184px;margin:72px auto 0;padding:0 28px; }.history-title { display:flex;justify-content:space-between;align-items:end;border-bottom:1px solid var(--line); }.history-title h2 { font:500 26px Georgia,"Yu Mincho",serif;margin:8px 0 17px; }.empty { color:var(--muted);font-size:12px;padding:30px 0; }
.history-list>div { display:grid;grid-template-columns:85px 1.1fr 1.5fr 100px;gap:15px;align-items:center;padding:18px 8px;border-bottom:1px solid var(--line);font-size:11px; }.history-list time,.history-list span { color:var(--muted); }.history-list b { text-align:right;font:600 16px Georgia,serif; }
footer { max-width:1128px;margin:60px auto 0;padding:28px 0 45px;border-top:1px solid var(--line);display:flex;align-items:center;gap:25px;color:var(--muted);font-size:9px; }.footer span,footer>span { color:var(--ink);font:700 13px Georgia,serif;letter-spacing:.12em; }.footer small,footer>small { margin-left:auto; }
@media(max-width:850px){ .workspace{grid-template-columns:1fr}.result-card{position:relative}aside{position:static}.shape-grid{grid-template-columns:repeat(4,1fr)}.material-manager{grid-template-columns:1fr 1fr}.material-manager>div{grid-column:1/-1}.history-list>div{grid-template-columns:70px 1fr 90px}.history-list span{display:none} }
@media(max-width:560px){ .topbar{padding:0 18px}.outline-button{font-size:0}.outline-button span{font-size:20px;margin:0}.intro{margin-top:40px;padding:0 18px}.workspace,.history-section{padding:0 14px}.calculator-card{padding:25px 18px}.material-row{grid-template-columns:1fr}.shape-grid{grid-template-columns:repeat(3,1fr)}.dimension-layout{grid-template-columns:1fr}.section-visual{min-height:130px}.profile-grid{grid-template-columns:repeat(2,1fr)}.profile-title span{display:none}.fields{grid-template-columns:1fr 1fr}.options-row{grid-template-columns:1fr 1fr}.material-manager{margin:0 14px 18px;grid-template-columns:1fr}.history-list>div{grid-template-columns:62px 1fr 72px;gap:7px}.history-list b{font-size:12px}footer{margin:40px 14px 0;display:block}footer small{display:block;margin-top:10px}}

/* 読みやすさ・管理機能・図説の改善 */
body { font-size:16px; line-height:1.65; }
.brand strong { font-size:17px; }.brand small { font-size:12px; }
.outline-button { font-size:14px; padding:12px 17px; }
.eyebrow,.step-label { font-size:12px; }
.intro>p:last-child { font-size:16px; }
.step-head p { font-size:19px; }.step-head small { font-size:13px; }
.shape-grid button { min-height:88px; }.shape-grid button i { font-size:31px; }.shape-grid button span { font-size:13px; }
.select-wrap select { font-size:16px; }
.density-badge>span { font-size:10px; }.density-badge div { font-size:11px; }.density-badge small { font-size:10px; }
.number-field>span { font-size:13px; }.number-field em { font-size:13px; }
.profile-title strong { font-size:15px; }.profile-title span { font-size:12px; }
.result-kicker { font-size:11px; }.result-card h2 { font-size:21px; }
.result-card dl div { font-size:14px; padding:9px 0; }
.gold-button { font-size:14px; }.caution { font-size:11px; }
.formula-card span { font-size:12px; }.formula-card p { font-size:16px; }.formula-card small { font-size:11px; }
.empty { font-size:14px; }
.section-visual { min-height:210px; padding:18px 8px; overflow:visible; }
.section-visual>small { font-size:11px; color:#6c736f; margin-top:6px; }
.hero-shape { position:relative; width:106px; height:68px; color:#fff; font-size:13px; font-weight:800; text-shadow:0 1px 3px #382b0d; overflow:visible; }
.hero-shape span { position:relative; z-index:2; white-space:nowrap; }
.visual-shape-name { display:block; margin-top:14px; font-size:16px; color:#17241f; letter-spacing:.08em; }
.shape-v { width:115px; height:76px; }
.shape-v span { display:none; }
.shape-l span,.shape-triangle span { color:#fff; text-shadow:0 1px 4px #2b2109; }

.profile-grid button { min-height:190px; padding:15px 8px; }
.profile-grid strong { font-size:14px; margin-top:8px; }
.profile-grid small { font-size:11px; min-height:21px; }
.profile-grid em { font-size:11px; margin-top:5px; }
.profile-angle { font-size:12px; font-weight:800; color:#53431d; margin-top:6px; }
.profile-diagram { position:relative; display:block; width:96px; height:66px; border-bottom:3px solid #554720; margin-bottom:4px; }
.profile-diagram i { position:absolute; left:8px; right:8px; bottom:3px; display:block; background:linear-gradient(145deg,#ead898,#a17b30); box-shadow:inset -8px -7px 12px rgba(62,42,3,.22); }
.profile-diagram b { position:absolute; right:-1px; top:0; color:#725a23; background:#fff9e9; border:1px solid #c6ab65; border-radius:12px; padding:1px 5px; font-size:10px; z-index:2; }
.profile-shallow i { height:24px; border-radius:52% 52% 5px 5px / 100% 100% 5px 5px; }
.profile-flat i { height:34px; border-radius:51% 51% 4px 4px / 100% 100% 4px 4px; }
.profile-standard i { height:46px; border-radius:50% 50% 3px 3px / 100% 100% 3px 3px; }
.profile-high i { left:15px; right:15px; height:59px; border-radius:50% 50% 2px 2px / 100% 100% 2px 2px; }

.admin-login,.material-manager { max-width:1128px; margin:0 auto 24px; padding:24px 28px; background:#fffefa; border:1px solid var(--line); box-shadow:0 10px 35px rgba(51,45,31,.06); }
.admin-login { display:grid; grid-template-columns:1.3fr 1fr auto; align-items:end; gap:18px; }
.admin-login h2,.material-manager h2 { font-size:20px; margin:3px 0; }
.admin-login small { color:var(--muted); font-size:13px; }
.admin-login label,.material-form label { font-size:13px; font-weight:700; }
.admin-login input,.material-form input { display:block; width:100%; height:48px; margin-top:5px; border:1px solid var(--line); padding:0 12px; }
.material-manager { display:block; }
.manager-head { display:flex; justify-content:space-between; align-items:start; border-bottom:1px solid var(--line); padding-bottom:14px; margin-bottom:12px; }
.material-admin-list { display:grid; grid-template-columns:1fr 1fr; gap:8px 14px; }
.material-admin-list>div { display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:7px; padding:10px; background:#f6f3eb; }
.material-admin-list span strong,.material-admin-list span small { display:block; }.material-admin-list span small { color:var(--muted); font-size:11px; }
.material-admin-list button { border:1px solid #b9ae94; background:#fff; padding:6px 8px; font-size:12px; }
.material-form { display:grid; grid-template-columns:1.4fr 1fr 1fr auto auto; gap:12px; align-items:end; margin-top:18px; padding-top:18px; border-top:1px solid var(--line); }
.admin-message { color:#936c12; font-size:13px; font-weight:700; margin:8px 0 0; }
.site-settings-form { display:grid; grid-template-columns:1.25fr 1fr 1fr; gap:14px; align-items:end; padding:18px; background:#f6f3eb; border:1px solid var(--line); }
.site-settings-form label { font-size:13px; font-weight:700; color:#46504b; }
.site-settings-form input[type="text"],.site-settings-form input:not([type]) { display:block; width:100%; height:48px; margin-top:5px; border:1px solid var(--line); background:#fff; padding:0 12px; }
.site-settings-form input[type="file"] { display:block; width:100%; min-height:48px; margin-top:5px; padding:9px; border:1px solid var(--line); background:#fff; }
.site-settings-form .check-label { align-self:center; }

.history-list>div { grid-template-columns:42px 85px 1.1fr 1.4fr 110px 38px; font-size:14px; transition:.2s; }
.history-list>div.saved { background:#fff9e9; }
.star-button,.delete-button { border:0; background:transparent; line-height:1; }
.star-button { font-size:27px; color:#b38a28; }.delete-button { font-size:25px; color:#9d5c53; }
.history-list b { font-size:18px; }
.text-button { font-size:13px; }
footer { font-size:12px; }

@media(max-width:850px){
  .admin-login { grid-template-columns:1fr 1fr; }.admin-login>div { grid-column:1/-1; }
  .material-admin-list { grid-template-columns:1fr; }.material-form { grid-template-columns:1fr 1fr; }
  .history-list>div { grid-template-columns:36px 72px 1fr 95px 32px; }.history-list>div span { display:none; }
}
@media(max-width:850px){.site-settings-form{grid-template-columns:1fr 1fr}}
@media(max-width:560px){
  body { font-size:15px; }.outline-button { font-size:0; }
  .admin-login,.material-manager { margin:0 14px 18px; padding:20px 16px; grid-template-columns:1fr; }
  .admin-login>div { grid-column:auto; }.material-form { grid-template-columns:1fr; }
  .material-admin-list>div { grid-template-columns:1fr auto auto; }
  .profile-grid button { min-height:185px; }
  .history-list>div { grid-template-columns:34px 1fr 80px 28px; padding:14px 3px; }.history-list time { display:none; }
  .history-list b { font-size:14px; }
}
@media(max-width:560px){.site-settings-form{grid-template-columns:1fr;padding:14px}}

/* 素材並び替え・形状管理 */
.admin-section-title { margin:24px 0 12px; padding:10px 12px; background:#193028; color:#fff; font-size:18px; }
.material-admin-list>div { grid-template-columns:1fr auto auto auto auto; }
.material-admin-list button:disabled { opacity:.3; cursor:not-allowed; }
.shape-admin-list { display:grid; grid-template-columns:1fr 1fr; gap:8px 14px; }
.shape-admin-list>div { display:grid; grid-template-columns:42px 1fr auto auto auto auto; align-items:center; gap:8px; padding:10px; background:#f6f3eb; }
.shape-admin-list span strong,.shape-admin-list span small { display:block; }.shape-admin-list span small { color:var(--muted); font-size:15px; }
.shape-admin-list button { border:1px solid #b9ae94; background:#fff; padding:7px 9px; font-size:15px; }
.shape-admin-list button:disabled { opacity:.3; cursor:not-allowed; }

/* 素材純度を正方形の枠内へ中央配置 */
.density-badge>span {
  width:76px !important;
  height:76px !important;
  min-width:76px;
  padding:5px;
  border-radius:3px !important;
  display:flex !important;
  align-items:center;
  justify-content:center;
  text-align:center;
  white-space:normal;
  overflow-wrap:normal;
  word-break:keep-all;
  line-height:1.15;
  font-size:15px !important;
}
.density-badge { gap:12px; padding:10px 12px; }
.density-badge { min-width:220px; }
.material-row { grid-template-columns:1fr 220px; }
@media(max-width:560px){.material-row{grid-template-columns:1fr}}

/* 複数素材の選択・比較 */
.material-multi { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.material-check { position:relative; display:grid; grid-template-columns:24px 1fr; align-items:center; gap:2px 8px; min-height:62px; padding:9px 11px; border:1px solid var(--line); background:#fff; cursor:pointer; }
.material-check.active { border:2px solid var(--gold-dark); background:#fff8e5; box-shadow:inset 0 -3px var(--gold); }
.material-check input { grid-row:1/3; width:19px; height:19px; accent-color:var(--gold-dark); }
.material-check span { font-size:15px; font-weight:800; line-height:1.25; }
.material-check small { font-size:15px !important; color:var(--muted); line-height:1.2; }
.multi-results { margin:0 0 22px; border-top:1px solid rgba(255,255,255,.18); }
.multi-results>div { display:flex; justify-content:space-between; align-items:center; gap:14px; padding:12px 0; border-bottom:1px solid rgba(255,255,255,.14); }
.multi-results span { font-size:15px; font-weight:700; }.multi-results span small { display:block; color:#aeb8b3; font-size:15px !important; font-weight:400; }
.multi-results strong { color:#f4d78e; font:600 21px Georgia,serif; white-space:nowrap; }
@media(max-width:700px){.material-multi{grid-template-columns:1fr}}

/* 純度・比重の独立表示エリアを廃止 */
.material-row { grid-template-columns:1fr !important; }

/* 計算履歴のドラッグ＆ドロップ並び替え */
.history-list>div { grid-template-columns:34px 42px 85px 1.1fr 1.4fr 110px 38px; cursor:grab; position:relative; }
.history-list>div:active { cursor:grabbing; }
.drag-handle { color:#876b2b; font-size:25px; text-align:center; user-select:none; touch-action:none; }
.history-list>div.dragging { opacity:.42; background:#e9e2cf; }
.history-list>div.drop-before::before,.history-list>div.drop-after::after { content:""; position:absolute; left:0; right:0; height:4px; background:var(--gold-dark); z-index:3; }
.history-list>div.drop-before::before { top:-2px; }.history-list>div.drop-after::after { bottom:-2px; }
@media(max-width:850px){.history-list>div{grid-template-columns:30px 36px 72px 1fr 95px 32px}}
@media(max-width:560px){.history-list>div{grid-template-columns:28px 34px 1fr 80px 28px}.history-list>div time{display:none}}

/* 素材選択カード：デスクトップ4列 */
.material-multi { grid-template-columns:repeat(4,minmax(0,1fr)); gap:7px; }
.material-check { min-height:58px; padding:7px 8px; grid-template-columns:20px minmax(0,1fr); gap:1px 6px; }
.material-check input { width:17px; height:17px; }
.material-check span,.material-check small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
@media(max-width:900px){.material-multi{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.material-multi{grid-template-columns:1fr}}

/* 形状ごとの初期値設定 */
.shape-admin-list { grid-template-columns:1fr; }
.shape-admin-list>div { grid-template-columns:42px minmax(180px,1fr) repeat(6,auto); }
.shape-admin-list .default-button { background:#fff8df; border-color:#aa8a3e; color:#5f4815; font-weight:700; }
@media(max-width:850px){
  .shape-admin-list>div { grid-template-columns:42px 1fr repeat(2,auto); }
  .shape-admin-list .default-button { grid-column:span 2; }
}
@media(max-width:560px){
  .shape-admin-list>div { grid-template-columns:36px 1fr auto auto; }
  .shape-admin-list .default-button { grid-column:span 2; white-space:normal; }
}
.shape-admin-glyph { font-size:26px; color:var(--gold-dark); text-align:center; }
.shape-form { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:18px; padding-top:18px; border-top:1px solid var(--line); align-items:end; }
.shape-form label { font-size:15px; font-weight:700; }
.shape-form input { display:block; width:100%; height:48px; margin-top:5px; border:1px solid var(--line); padding:0 12px; font-size:15px; }
.shape-form input[type=file] { padding:9px; }
.shape-form .check-label { display:flex; align-items:center; gap:8px; }.shape-form .check-label input { width:20px; height:20px; margin:0; }
.shape-variant-editor { grid-column:1/-1; display:grid; grid-template-columns:repeat(4,1fr); gap:12px; padding:16px; background:#f7f3e8; border-left:4px solid var(--gold); }
.shape-variant-editor>strong,.shape-variant-editor>p { grid-column:1/-1; margin:0; }
.variant-fieldsets { grid-column:1/-1; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.shape-variant-editor>strong { font-size:17px; }.shape-variant-editor>p { font-size:15px; color:var(--muted); }
.shape-variant-editor fieldset { min-width:0; margin:0; padding:12px; border:1px solid var(--line); background:#fff; }
.shape-variant-editor legend { padding:0 6px; font-size:15px; font-weight:800; color:var(--gold-dark); }
.shape-variant-editor label { display:block; margin-top:8px; font-size:15px; }
.shape-variant-editor input { height:42px; font-size:15px; }
.shape-variant-editor select { display:block; width:100%; min-height:42px; margin-top:5px; border:1px solid var(--line); padding:7px; font-size:15px; background:#fff; }
.variant-image-preview { display:block; width:100%; height:100px; object-fit:contain; margin:4px 0 10px; border:1px solid var(--line); background:#fafafa; }
.shape-variant-editor input[type=file] { height:auto; min-height:46px; padding:8px; }
.shape-variant-editor .variant-remove { display:flex; align-items:center; gap:8px; font-weight:700; color:#8b352d; }
.shape-variant-editor .variant-remove input { width:20px; height:20px; margin:0; }
.profile-custom-image { display:block; width:96px; height:66px; object-fit:contain; margin-bottom:4px; border-bottom:3px solid #554720; background:#fff; }
.variant-delete-button { width:100%; margin-top:12px; padding:9px; border:1px solid #b8665e; background:#fff; color:#8b352d; font-size:15px; font-weight:700; }
.add-variant-button { grid-column:1/-1; justify-self:start; }
.formula-help { font-size:15px; color:var(--muted); background:#fff8df; padding:10px 12px; }
.shape-uploaded-image { position:absolute; inset:8px; width:calc(100% - 16px); height:calc(100% - 16px); object-fit:contain; z-index:3; background:#fff; }
@media(max-width:850px){.shape-admin-list{grid-template-columns:1fr}.shape-form{grid-template-columns:1fr 1fr}.shape-variant-editor{grid-template-columns:1fr 1fr}.variant-fieldsets{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.material-admin-list>div{grid-template-columns:1fr auto auto}.material-admin-list [data-edit],.material-admin-list [data-remove]{grid-row:2}.shape-form{grid-template-columns:1fr}.shape-variant-editor{grid-template-columns:1fr}.variant-fieldsets{grid-template-columns:1fr}}

/* 最小文字サイズ：11pt相当（15px） */
.brand small,
.eyebrow,.step-label,
.step-head small,
.shape-grid button span,
.density-badge>span,.density-badge div,.density-badge small,
.section-visual>small,.hero-shape,.visual-shape-name,
.number-field>span,.number-field em,
.profile-title strong,.profile-title span,
.profile-grid strong,.profile-grid small,.profile-grid em,.profile-angle,.profile-diagram b,
.result-kicker,.result-card dl div,
.gold-button,.caution,
.formula-card span,.formula-card p,.formula-card small,
.admin-login small,.admin-login label,.material-form label,.site-settings-form label,.site-settings-form input,
.material-admin-list span small,.material-admin-list button,.admin-message,
.empty,.history-list>div,.history-list b,
.text-button,
footer,footer small {
  font-size:15px !important;
}
.profile-grid button { min-height:230px; }
.profile-diagram b { top:-8px; right:-8px; }
.density-badge { min-width:190px; }
.material-row { grid-template-columns:1fr 190px; }
.shape-grid button { min-height:96px; }
@media(max-width:560px){
  .profile-grid button { min-height:235px; }
  .material-row { grid-template-columns:1fr; }
}

/* 寸法対応が分かる断面図 */
.triangle-mode { margin:-4px 0 20px; padding:16px; background:#f3f0e7; border-left:4px solid var(--gold); }
.triangle-mode>strong { display:block; margin-bottom:9px; font-size:16px; }
.triangle-mode>div { display:flex; gap:8px; flex-wrap:wrap; }
.triangle-mode button { border:1px solid #bcb39f; background:#fff; color:var(--ink); padding:10px 16px; font-weight:700; font-size:15px; }
.triangle-mode button.active { border:2px solid var(--gold-dark); background:#fff7df; color:#6c5118; }
.diagram-stage { position:relative; width:170px; height:142px; flex:0 0 auto; }
.diagram-stage .hero-shape { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); margin:0; }
.hero-shape.shape-round { width:88px !important; height:88px !important; aspect-ratio:1/1; border-radius:50% !important; }
.hero-shape.shape-square { width:88px !important; height:88px !important; aspect-ratio:1/1; }
.hero-shape.shape-triangle { width:104px !important; height:90px !important; padding:0; }
.hero-shape.shape-triangle.triangle-equilateral { clip-path:polygon(50% 0,100% 100%,0 100%); }
.hero-shape.shape-triangle.triangle-isosceles { width:82px !important; height:100px !important; clip-path:polygon(50% 0,100% 100%,0 100%); }
.hero-shape.shape-triangle.triangle-scalene { width:110px !important; height:88px !important; clip-path:polygon(18% 0,100% 100%,0 100%); }
.hero-shape.shape-kamaboko { width:110px !important; height:70px !important; border-radius:55% 55% 8px 8px / 100% 100% 8px 8px !important; clip-path:none; }
.hero-shape.shape-kamaboko { background:#7c8783 !important; box-shadow:none !important; }
.hero-shape.shape-l { width:102px !important; height:82px !important; }
.hero-shape.shape-v { width:118px !important; height:86px !important; }
.hero-shape.shape-plate { width:116px !important; height:32px !important; }
.hero-shape.shape-pipe { width:92px !important; height:92px !important; border-radius:50% !important; clip-path:none; }
.hero-shape.shape-pipe span { display:none; }
.hero-shape.shape-hexagon { width:102px !important; height:92px !important; }
.hero-shape.shape-ellipse { width:120px !important; height:72px !important; border-radius:50% !important; }
.hero-shape.shape-hexagon span,.hero-shape.shape-ellipse span { display:none; }
.diagram-annotations { position:absolute; inset:0; z-index:4; pointer-events:none; }
.dim { position:absolute; display:inline-block; color:#173c32; background:rgba(255,254,250,.96); border:1px solid #a99868; border-radius:4px; padding:2px 5px; font-size:15px !important; font-weight:900; line-height:1.25; white-space:nowrap; box-shadow:0 1px 3px rgba(30,25,12,.12); }
.dim.diameter { left:40px; top:57px; }
.dim.top { left:53px; top:0; }.dim.left { left:-5px; top:58px; }
.hex-across { position:absolute; left:137px; top:25px; width:33px; height:92px; color:#173c32; }
.hex-across::before,.hex-across::after { content:""; position:absolute; right:19px; width:48px; border-top:2px solid #806f43; }
.hex-across::before { top:0; }.hex-across::after { bottom:0; }
.hex-across i { position:absolute; left:0; top:-5px; font-style:normal; font-size:88px; font-weight:500; line-height:96px; color:#806f43; }
.hex-across b { position:absolute; right:1px; top:33px; padding:2px 4px; border:1px solid #a99868; border-radius:4px; background:rgba(255,254,250,.97); font-size:15px; font-weight:900; line-height:1.25; white-space:nowrap; box-shadow:0 1px 3px rgba(30,25,12,.12); }
.dim.l-a { left:-4px; top:38px; }.dim.l-b { left:58px; bottom:2px; }.dim.l-t { right:-3px; top:40px; }
.dim.v-a { left:-31px; top:3px; }.dim.v-b { right:-35px; top:3px; }.dim.v-angle { left:56px; bottom:-2px; }.dim.v-t { left:54px; top:29px; }
.dim.tri-a { left:25px; bottom:0; }.dim.tri-b { left:-7px; top:30px; transform:rotate(-57deg); }.dim.tri-b2 { right:-7px; top:30px; transform:rotate(57deg); }
.section-visual { min-height:270px; }
.visual-shape-name { margin-top:4px; }
.profile-standard i { display:block !important; width:auto !important; transform:none !important; clip-path:none !important; }
@media(max-width:560px){
  .triangle-mode button { flex:1 1 100%; }
  .section-visual { min-height:260px; }
}
.history-actions { display:flex; align-items:center; justify-content:flex-end; gap:14px; flex-wrap:wrap; padding-bottom:12px; }
.history-actions .text-button { font-size:15px; }
.history-title { gap:18px; flex-wrap:wrap; }
.history-note { margin:10px 0 12px; color:#b3261e; font-size:18px; font-weight:700; line-height:1.6; overflow-wrap:anywhere; }
.history-sort-note { display:none; margin:0 0 16px; padding:10px 12px; color:#493914; background:#fff5d8; border-left:4px solid var(--gold-dark); font-size:16px; line-height:1.6; overflow-wrap:anywhere; }
@media(max-width:560px){
  .history-title { align-items:flex-start; }
  .history-title>div,.history-actions { width:100%; }
  .history-actions { justify-content:flex-start; padding-bottom:10px; }
  .history-note { margin-top:9px; font-size:16px; }
  .history-sort-note { display:block; font-size:15px; margin-bottom:14px; }
  .history-list>div {
    grid-template-columns:36px minmax(0,1fr) minmax(0,1fr) max-content 36px;
    grid-template-rows:auto;
    gap:5px;
    padding:14px 3px;
    align-items:center;
    touch-action:pan-y;
    -webkit-user-select:none;
    user-select:none;
  }
  .history-list>div .drag-handle,.history-list>div time,.history-list>div>span:not(.drag-handle) { display:none; }
  .history-list>div .star-button { grid-column:1; grid-row:1; width:36px; height:40px; padding:0; }
  .history-list>div .history-name { display:contents; }
  .history-list>div .history-material,.history-list>div .history-shape {
    display:block !important;
    min-width:0;
    color:var(--ink);
    font-size:15px !important;
    font-weight:700;
    line-height:1.45;
    overflow-wrap:anywhere;
    word-break:normal;
    touch-action:none;
    cursor:grab;
    -webkit-user-select:none;
    user-select:none;
  }
  .history-list>div .history-weight { touch-action:none; cursor:grab; -webkit-user-select:none; user-select:none; }
  .history-list>div .history-material { grid-column:2; grid-row:1; }
  .history-list>div .history-shape { grid-column:3; grid-row:1; }
  .history-list>div .history-separator { display:none !important; }
  .history-list>div b { grid-column:4; grid-row:1; text-align:right; white-space:nowrap; font-size:15px !important; }
  .history-list>div .delete-button { grid-column:5; grid-row:1; width:36px; height:40px; padding:0; justify-self:end; }
  .history-list>div.touch-dragging { opacity:.4; background:#efe5c9; box-shadow:0 3px 12px rgba(44,34,13,.18); animation:history-drag-ready .24s ease-out; }
  .history-list>div.history-touch-ghost {
    position:fixed !important;
    z-index:9999;
    margin:0 !important;
    pointer-events:none;
    opacity:.9;
    background:#fff9e9;
    border:1px solid rgba(128,100,37,.42);
    box-shadow:0 7px 0 rgba(184,150,74,.2),0 14px 0 rgba(184,150,74,.1),0 20px 28px rgba(35,28,12,.3);
    will-change:transform;
    backface-visibility:hidden;
    contain:layout paint style;
    transition:none !important;
  }
  .history-list>div.history-touch-ghost .star-button,
  .history-list>div.history-touch-ghost .delete-button { opacity:.7; }
}
@keyframes history-drag-ready {
  0% { transform:scale(1); }
  55% { transform:scale(1.012); }
  100% { transform:scale(1); }
}
@media print {
  .topbar,.intro,.material-manager,.admin-login,.calculator-card,.formula-card,.history-actions,footer { display:none !important; }
  body { background:#fff; }
  .workspace { display:block; }
  .workspace aside { position:static; max-width:520px; margin:0 auto 30px; }
  .history-section { margin-top:20px; }
  .history-list>div { break-inside:avoid; }
}

/* 彫金家族ブランド・キャラクターヒーロー */
body { background:linear-gradient(180deg,#082e30 0 610px,#eee9dc 900px,var(--cream) 1180px); }
.topbar { max-width:none; padding:0 max(28px,calc((100vw - 1184px)/2)); background:#062527; color:#fff; border-bottom:1px solid rgba(216,184,110,.4); }
.brand-link { color:inherit; text-decoration:none; min-width:0; }
.brand-link:hover strong,.brand-link:focus-visible strong { color:#f1d58d; }
.brand-link:focus-visible { outline:2px solid #f1d58d; outline-offset:5px; }
.brand-mark { flex:0 0 39px; background:#d7b76d; color:#092b2d; font-family:"Yu Mincho",serif; }
.brand strong { font-family:"Yu Mincho","Hiragino Mincho ProN",serif; font-size:clamp(17px,2vw,25px); line-height:1.25; color:#fff; transition:color .2s; }
.brand-edition { display:inline-block; margin-left:.65em; font-size:.68em; font-weight:700; letter-spacing:.08em; vertical-align:.08em; }
.brand small { margin:0 0 3px; color:#dcc994; font-size:13px !important; letter-spacing:.08em; }
.topbar .outline-button { color:#fff; border-color:rgba(255,255,255,.65); }
.intro { position:relative; max-width:none; min-height:530px; margin:0 0 44px; padding:0 max(28px,calc((100vw - 1184px)/2)); display:flex; align-items:center; background:#073336 url("images/metal-mass-owl-hero.png") center/cover no-repeat; color:#fff; overflow:hidden; }
.intro:after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(2,23,24,.03) 30%,rgba(2,23,24,.22) 49%,rgba(2,23,24,.82) 100%); pointer-events:none; }
.intro-content { position:relative; z-index:1; width:48%; margin-left:auto; padding:48px 0; }
.intro .eyebrow { color:#e2c67c; font-size:12px !important; letter-spacing:.18em; }
.intro h1 { margin:14px 0 20px; font-family:"Yu Mincho","Hiragino Mincho ProN",serif; font-size:clamp(34px,4.5vw,58px); line-height:1.38; letter-spacing:.035em; text-shadow:0 3px 18px rgba(0,0,0,.55); }
.intro-content>p:not(.eyebrow):not(.bookmark-help) { max-width:570px; color:#e5ece9; font-size:15px; line-height:1.9; }
.bookmark-button { display:inline-flex; align-items:center; gap:10px; margin-top:16px; padding:15px 22px; border:1px solid #ebcd81; border-radius:4px; background:linear-gradient(135deg,#e0bd65,#b58d35); color:#102d29; font-weight:800; box-shadow:0 8px 24px rgba(0,0,0,.24); transition:transform .2s,filter .2s; }
.bookmark-button span { font-size:20px; }
.bookmark-button:hover,.bookmark-button:focus-visible { transform:translateY(-2px); filter:brightness(1.1); outline:2px solid #fff; outline-offset:3px; }
.bookmark-help { max-width:520px; margin:12px 0 0; padding:11px 13px; border-left:3px solid #e0bd65; background:rgba(0,0,0,.4); color:#fff; font-size:14px; line-height:1.6; }
.workspace,.history-section { position:relative; }
@media(max-width:850px){
  .topbar { height:auto; min-height:88px; gap:18px; padding-top:12px; padding-bottom:12px; }
  .brand strong { font-size:19px; }.brand small { font-size:12px !important; }
  .intro { min-height:500px; background-position:42% center; }
  .intro-content { width:53%; }
  .intro h1 { font-size:36px; }
}
@media(max-width:620px){
  body { background:linear-gradient(180deg,#082e30 0 740px,#eee9dc 960px,var(--cream) 1180px); }
  .topbar { align-items:flex-start; flex-direction:column; padding:15px 18px; }
  .topbar .outline-button { align-self:flex-end; margin-top:-2px; }
  .brand { align-items:flex-start; }.brand-mark,.brand-logo { margin-top:3px; }
  .brand strong { font-size:17px; }.brand small { white-space:normal; line-height:1.45; }
  .intro { min-height:660px; align-items:flex-end; padding:0 20px; background-position:30% top; background-size:auto 470px; background-repeat:no-repeat; }
  .intro:after { background:linear-gradient(0deg,#062b2d 0 35%,rgba(6,43,45,.82) 48%,rgba(6,43,45,.08) 72%); }
  .intro-content { width:100%; margin:0; padding:0 0 34px; }
  .intro h1 { margin-top:9px; font-size:31px; line-height:1.38; }.desktop-break { display:none; }
  .intro-content>p:not(.eyebrow):not(.bookmark-help) { font-size:14px; line-height:1.75; }
  .bookmark-button { width:100%; justify-content:center; margin-top:10px; min-height:54px; }
}

/* 明るく安心感のある高級感を保つ配色 */
body { background:linear-gradient(180deg,#f8f4e9 0 420px,#eee9dc 760px,var(--cream) 1050px); }
.topbar { background:linear-gradient(90deg,#fffdf8,#f3ead5); color:#243c35; border-bottom-color:rgba(150,113,43,.3); box-shadow:0 3px 16px rgba(90,70,31,.08); }
.brand strong { color:#27483f; }.brand small { color:#876927; }
.brand-link:hover strong,.brand-link:focus-visible strong { color:#9b7122; }
.topbar .bookmark-button { color:#263b34; }
.intro { background-color:#eee8d8; background-image:url("images/metal-mass-owl-hero.png"); background-position:left center; background-size:auto 100%; background-repeat:no-repeat; color:#263c35; }
.intro:after { background:linear-gradient(90deg,rgba(247,243,232,.02) 26%,rgba(247,243,232,.74) 48%,rgba(247,243,232,.98) 73%); }
.intro .eyebrow { color:#8c6927; text-shadow:none; }
.intro h1 { color:#25443b; text-shadow:0 2px 14px rgba(255,255,255,.8); }
.intro-content>p:not(.eyebrow):not(.bookmark-help) { color:#4f5f59; }
@media(max-width:850px){.intro{background-size:auto 100%;background-position:left center}}
@media(max-width:620px){
  body { background:linear-gradient(180deg,#f8f4e9 0 540px,#eee9dc 820px,var(--cream) 1040px); }
  .intro { background-size:auto 100%; background-position:left center; }
  .intro:after { background:linear-gradient(90deg,rgba(247,243,232,.12) 20%,rgba(247,243,232,.8) 48%,rgba(247,243,232,.99) 76%); }
}

/* ヒーロー背景を画面幅いっぱいに表示し、キャラクターと本を安全領域内に保持 */
.intro {
  min-height:clamp(360px,22vw,420px);
  background-size:cover;
  background-position:center 57%;
}
@media(max-width:850px){
  .intro { min-height:360px; background-size:cover; background-position:42% 57%; }
}
@media(max-width:620px){
  .intro { min-height:390px; background-size:cover; background-position:35% 55%; }
}

/* 端末内だけに保存する自由入力素材 */
.custom-material-section { margin-top:18px; padding-top:18px; border-top:1px solid var(--line); min-width:0; }
.custom-material-heading { display:flex; align-items:baseline; justify-content:space-between; gap:14px; margin-bottom:10px; }
.custom-material-heading strong { font-size:15px; }
.custom-material-heading small { color:var(--muted); font-size:12px; }
.custom-material-grid { display:grid; grid-template-columns:repeat(3,minmax(180px,1fr)); gap:8px; overflow-x:auto; padding:1px 1px 7px; scrollbar-width:thin; }
.custom-material-card { min-width:180px; padding:11px; border:1px solid var(--line); background:#fff; transition:border-color .2s,background .2s,box-shadow .2s; }
.custom-material-card.active { border-color:var(--gold-dark); background:#fffaf0; box-shadow:inset 0 -3px var(--gold); }
.custom-material-select { display:flex; align-items:center; gap:7px; margin-bottom:9px; color:#67501d; font-size:12px; font-weight:700; }
.custom-material-select input { width:18px; height:18px; accent-color:var(--gold-dark); }
.custom-name-label,.custom-density-label { display:block; }
.custom-name-label>span,.custom-density-label>span { display:block; margin-bottom:4px; color:#59635e; font-size:11px; font-weight:700; }
.custom-name-label input,.custom-density-label input { width:100%; height:40px; padding:0 9px; border:1px solid #d7d1c3; background:#fff; color:var(--ink); font-size:15px; }
.custom-name-label small { display:block; min-height:1.5em; margin:3px 0 8px; color:#8a918d; font-size:11px; }
.custom-density-label { position:relative; }
.custom-density-label:after { content:"g/cm³"; position:absolute; right:9px; bottom:11px; color:#8a918d; font-size:10px; pointer-events:none; }
.custom-density-label input { padding-right:47px; font-family:Georgia,serif; font-size:17px; }
@media(max-width:620px){
  .custom-material-heading { display:block; }.custom-material-heading small { display:block; margin-top:5px; }
  .custom-material-grid { grid-template-columns:repeat(3,minmax(190px,1fr)); }
}

/* 現在の計算対象 */
.current-calculation { margin:9px 0 3px; padding:9px 11px; border-left:3px solid #d9ba6d; background:rgba(255,255,255,.07); color:#eef2ed; font-size:13px; font-weight:700; line-height:1.65; }

/* PC・タブレット・スマートフォン別の並び替え案内 */
.history-sort-note--tablet,.history-sort-note--mobile { display:none; }
@media(max-width:900px) and (min-width:561px){
  .history-sort-note--desktop { display:none; }
  .history-sort-note--tablet { display:block; }
}
@media(max-width:560px){
  .history-sort-note--desktop,.history-sort-note--tablet { display:none; }
  .history-sort-note--mobile { display:block; color:#173a5e; font-size:15px; }
  .history-sort-note--mobile strong { color:#0d2d52; font-weight:900; }
  .history-list>div .history-dimensions { display:block !important; grid-column:2/5; grid-row:2; color:#4f5d58; font-size:13px !important; line-height:1.5; }
}

/* PCを狭い幅で表示した場合もマウス用6点ハンドルを維持 */
@media(max-width:560px) and (pointer:fine){
  .history-list>div { grid-template-columns:30px 36px minmax(0,1fr) minmax(0,1fr) max-content 36px; }
  .history-list>div .drag-handle { display:block !important; grid-column:1; grid-row:1/3; cursor:grab; }
  .history-list>div .star-button { grid-column:2; }
  .history-list>div .history-material { grid-column:3; }
  .history-list>div .history-shape { grid-column:4; }
  .history-list>div b { grid-column:5; }
  .history-list>div .delete-button { grid-column:6; }
  .history-list>div .history-dimensions { grid-column:3/6; }
}

/* スマートフォンのヒーロー文字を背景から明確に分離 */
@media(max-width:620px){
  .intro h1,.intro-content>p:not(.eyebrow):not(.bookmark-help) { color:#fff; text-shadow:0 2px 8px rgba(18,39,35,.85); }
  .intro-content { padding:18px 12px; border-radius:5px; background:rgba(35,67,60,.72); }
}

/* スマートフォンでも計算入力エリアを必ず表示 */
@media(max-width:620px){
  main.workspace { display:grid !important; grid-template-columns:minmax(0,1fr) !important; }
  .calculator-card { display:block !important; visibility:visible !important; opacity:1 !important; }
  .calculator-card .material-row,.calculator-card .material-multi,.calculator-card .shape-grid,.calculator-card .dimension-layout,.calculator-card .fields,.calculator-card .options-row { visibility:visible !important; opacity:1 !important; }
  .calculator-card .material-row,.calculator-card .material-multi,.calculator-card .shape-grid,.calculator-card .dimension-layout,.calculator-card .fields,.calculator-card .options-row { display:grid !important; }
  .calculator-card .material-multi { grid-template-columns:1fr !important; }
  .calculator-card .shape-grid { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
  .calculator-card .dimension-layout { grid-template-columns:1fr !important; }
  .calculator-card .fields,.calculator-card .options-row { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}

/* タブレットの計算履歴：素材・寸法・6点ハンドルを省略しない */
@media(max-width:900px) and (min-width:561px){
  .history-list>div { grid-template-columns:30px 36px 72px minmax(0,1fr) 95px 32px; grid-template-rows:auto auto; gap:7px 10px; }
  .history-list>div .drag-handle { display:block !important; grid-column:1; grid-row:1/3; align-self:center; cursor:grab; }
  .history-list>div .star-button { grid-column:2; grid-row:1/3; align-self:center; }
  .history-list>div time { display:block !important; grid-column:3; grid-row:1; }
  .history-list>div .history-name { display:block; grid-column:4; grid-row:1; min-width:0; }
  .history-list>div .history-material,.history-list>div .history-shape,.history-list>div .history-separator { display:inline !important; }
  .history-list>div .history-dimensions { display:block !important; grid-column:3/5; grid-row:2; color:#58645f; font-size:13px !important; line-height:1.5; }
  .history-list>div .history-weight { grid-column:5; grid-row:1/3; align-self:center; }
  .history-list>div .delete-button { grid-column:6; grid-row:1/3; align-self:center; }
}

/* 計算結果の素材別表示と履歴保存選択 */
.result-card .multi-results { margin:15px 0 14px; border-top:1px solid rgba(255,255,255,.2); }
.result-card .result-material-row { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:13px 0; border-bottom:1px solid rgba(255,255,255,.16); }
.result-mass-actions { display:flex; align-items:center; gap:10px; flex:0 0 auto; }
.result-save-star { width:38px; height:38px; padding:0; border:1px solid rgba(244,215,142,.65); border-radius:50%; background:transparent; color:#f4d78e; font-size:24px; line-height:1; }
.result-save-star[aria-pressed="true"] { background:#f4d78e; color:#273730; box-shadow:0 0 0 3px rgba(244,215,142,.14); }
.result-save-star:hover,.result-save-star:focus-visible { border-color:#fff; outline:2px solid #fff; outline-offset:2px; }
.result-card .gold-button { margin-bottom:20px; }
.result-card #addHistory {
  border:1px solid #725719;
  border-bottom-width:4px;
  border-radius:7px;
  background:linear-gradient(180deg,#efd98f 0%,#c6a34a 100%);
  box-shadow:0 5px 0 #76591a,0 9px 18px rgba(0,0,0,.24);
  color:#17241f;
  cursor:pointer;
  transform:translateY(0);
  transition:transform .08s ease,box-shadow .08s ease,filter .18s ease;
}
.result-card #addHistory:hover { filter:brightness(1.07); }
.result-card #addHistory:active {
  transform:translateY(4px);
  box-shadow:0 1px 0 #76591a,0 3px 7px rgba(0,0,0,.2);
}
.result-card #addHistory:focus-visible { outline:3px solid #fff; outline-offset:3px; }
.result-card .result-rule { margin:0 0 4px; }

/* 計算履歴の並び替え案内 */
.history-sort-note { margin:0 0 16px; padding:10px 12px; border-left:4px solid #173a5e; background:#eef3f8; color:#173a5e; font-size:15px; line-height:1.65; overflow-wrap:anywhere; }
.history-sort-note strong { color:#0d2d52; font-weight:800; }
.history-sort-note--desktop { display:block; }
.history-sort-note--desktop strong span { display:inline-block; margin-right:5px; font-size:20px; vertical-align:-2px; }
.history-sort-note--mobile { display:none; }
@media(max-width:560px){
  .history-sort-note--desktop { display:none; }
  .history-sort-note--mobile { display:block; color:#173a5e; font-size:15px; }
  .history-sort-note--mobile strong { color:#0d2d52; font-weight:900; }
}
@media print { .bookmark-button,.bookmark-help { display:none !important; } }

/* ヘッダー右側：スクール公式サイトリンク */
.school-site-link {
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  flex:0 0 auto;
  min-height:46px;
  margin-left:auto;
  padding:9px 18px;
  overflow:hidden;
  border:1px solid rgba(157,113,31,.55);
  border-radius:999px;
  background:linear-gradient(135deg,#fffdf7 0%,#f6e8bc 48%,#fffaf0 100%);
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.7),0 5px 15px rgba(95,69,22,.14);
  color:#614817;
  font-size:14px;
  font-weight:800;
  letter-spacing:.06em;
  line-height:1.35;
  text-decoration:none;
  white-space:nowrap;
  transition:transform .2s ease,box-shadow .2s ease,color .2s ease;
}
.school-site-link::before {
  content:"";
  position:absolute;
  top:-35%;
  left:-28%;
  width:22%;
  height:170%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.9),transparent);
  transform:rotate(18deg);
  transition:left .45s ease;
}
.school-site-link:hover,.school-site-link:focus-visible {
  color:#2d4d43;
  transform:translateY(-2px);
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.8),0 8px 20px rgba(95,69,22,.2);
}
.school-site-link:hover::before,.school-site-link:focus-visible::before { left:112%; }
.school-site-link:focus-visible { outline:3px solid #b98b31; outline-offset:3px; }
.school-site-link__jewel {
  position:relative;
  width:21px;
  height:18px;
  flex:0 0 21px;
  clip-path:polygon(50% 0,94% 31%,72% 100%,28% 100%,6% 31%);
  background:conic-gradient(from 45deg at 50% 34%,#fff7c7,#d39a24,#fff1a2,#a97014,#fff7c7);
  filter:drop-shadow(0 1px 1px rgba(94,56,5,.38)) drop-shadow(0 0 5px rgba(222,174,63,.38));
}
.school-site-link__jewel::after {
  content:"";
  position:absolute;
  left:3px;
  right:3px;
  top:5px;
  border-top:1px solid rgba(105,65,8,.55);
  box-shadow:5px 5px 0 -4px rgba(105,65,8,.75),-5px 5px 0 -4px rgba(105,65,8,.75);
}
.school-site-link__label>span+span::before { content:" "; }
@media(max-width:850px){
  .school-site-link { gap:7px; min-height:44px; padding:8px 14px; font-size:13px; }
  .school-site-link__jewel { width:19px; height:16px; flex-basis:19px; }
}
@media(max-width:620px){
  .topbar { flex-direction:row; flex-wrap:nowrap; align-items:center; gap:7px; padding:10px 12px; }
  .topbar .brand-link { flex:1 1 auto; min-width:0; }
  .topbar .brand { gap:8px; }
  .topbar .brand-mark,.topbar .brand-logo { width:36px; height:36px; flex-basis:36px; margin-top:2px; }
  .topbar .brand strong { font-size:15px; line-height:1.3; }
  .topbar .brand small { font-size:10px !important; line-height:1.35; }
  .school-site-link { flex:0 0 auto; width:auto; min-height:38px; margin-left:auto; padding:5px 8px; gap:5px; font-size:10px; letter-spacing:.02em; }
  .school-site-link__jewel { width:16px; height:14px; flex-basis:16px; }
  .school-site-link__label>span { display:block; }
  .school-site-link__label>span+span::before { content:""; }
}
@media print { .school-site-link { display:none !important; } }

/* ヘッダー／フッター操作とコンパクトヒーロー */
.topbar-actions { position:relative; display:flex; align-items:center; margin-left:auto; }
.bookmark-button--header { margin:0; padding:10px 16px; min-height:44px; box-shadow:none; font-size:13px; }
.bookmark-button--header span { font-size:16px; }
.bookmark-help--header { position:absolute; z-index:20; top:calc(100% + 10px); right:0; width:min(390px,80vw); margin:0; background:#102e2e; border:1px solid rgba(224,189,101,.6); box-shadow:0 12px 28px rgba(0,0,0,.3); }
.intro { min-height:265px; }
.intro-content { padding:24px 0; }
.intro h1 { margin:8px 0 10px; font-size:clamp(27px,3.25vw,43px); line-height:1.28; }
.intro .eyebrow { margin:0 0 6px; }
.intro-content>p:not(.eyebrow):not(.bookmark-help) { margin:8px 0 0; line-height:1.65; }
.footer-login { padding:8px 11px; border:1px solid rgba(240,213,144,.55); background:transparent; color:#d9c487; font-size:12px !important; font-weight:700; }
.footer-login:hover,.footer-login:focus-visible { color:#fff; border-color:#f0d590; outline:1px solid #f0d590; outline-offset:2px; }
.footer-login span { margin-left:5px; }
@media(max-width:850px){
  .intro { min-height:250px; }
  .intro h1 { font-size:30px; }
}
@media(max-width:620px){
  .topbar { flex-direction:row; align-items:center; flex-wrap:wrap; }
  .topbar .topbar-actions { width:100%; justify-content:flex-end; }
  .bookmark-button--header { width:auto; min-height:46px; }
  .intro { min-height:330px; background-size:auto 330px; background-position:25% center; align-items:center; }
  .intro:after { background:linear-gradient(90deg,rgba(6,43,45,.18) 20%,rgba(6,43,45,.62) 52%,rgba(6,43,45,.96) 100%); }
  .intro-content { width:58%; margin-left:auto; padding:20px 0; }
  .intro h1 { font-size:24px; }
  .intro .eyebrow { font-size:10px !important; letter-spacing:.1em; }
  .intro-content>p:not(.eyebrow):not(.bookmark-help) { font-size:12px; line-height:1.55; }
  footer { display:grid; gap:8px; }
  .footer-login { justify-self:start; margin-top:4px; }
}

/* スマホでも公式サイトリンクをヘッダー右側に維持 */
@media(max-width:620px){
  .topbar { flex-direction:row; flex-wrap:nowrap; align-items:center; gap:7px; padding:10px 12px; }
  .topbar .brand-link { flex:1 1 auto; min-width:0; }
  .topbar .brand { gap:8px; }
  .topbar .brand-mark,.topbar .brand-logo { width:36px; height:36px; flex-basis:36px; margin-top:2px; }
  .topbar .brand strong { font-size:15px; line-height:1.3; }
  .topbar .brand small { font-size:10px !important; line-height:1.35; }
  .school-site-link { flex:0 0 auto; width:auto; min-height:38px; margin-left:auto; padding:5px 8px; gap:5px; font-size:10px; letter-spacing:.02em; }
  .school-site-link__jewel { width:16px; height:14px; flex-basis:16px; }
  .school-site-link__label>span { display:block; }
  .school-site-link__label>span+span::before { content:""; }
}
