/* 算数計算専用。筆算・条件設定の位置と操作は保ち、金と紙色を使う。 */
html[data-iroiro-pop="elegant"] {
  --calc-ink: #25324b; --calc-muted: #6d675c;
  --calc-panel: #fffdf7; --calc-soft: #f7eedb; --calc-border: #c9ab67;
  --calc-accent: #7b591e; --calc-warm: #7b591e;
  --calc-success: #246445; --calc-danger: #b1314b; --calc-shadow: #ddcda9;
  --calc-setting-selected: #f2dda8; --calc-setting-hover: #faf2dc;
  --calc-setting-primary: #f2dda8; --calc-setting-challenge: #ebd39b;
  --calc-setting-radius: 16px; --calc-setting-button-shadow: 0 3px 0 #aa8949;
}
html[data-iroiro-pop="elegant"] :is(.settings, .work-wrap) {
  border: 2px solid var(--elegant-border); border-radius: 22px;
  background: linear-gradient(145deg, #fffefb, #fffdf7 65%, #faf1df);
  box-shadow: inset 0 0 0 4px #fffdf7, inset 0 0 0 5px #e9d8b1, 0 9px 26px #4b3a2017;
}
html[data-iroiro-pop="elegant"] .question-box,
html[data-iroiro-pop="elegant"] body.sp-ui .question-box { padding-top: 14px; }
html[data-iroiro-pop="elegant"] :is(.operand-card, .operator-card) { background: linear-gradient(#fffdf7, #f7eedb); }
html[data-iroiro-pop="elegant"] .settings .btn-gen {
  color: #fff2ce; background: linear-gradient(145deg, #354563, #1b2942);
  border-color: #c9ab67; box-shadow: inset 0 0 0 2px #e7cf962a, 0 3px 0 #152137;
}
html[data-iroiro-pop="elegant"] .settings .btn-gen-challenge,
html[data-iroiro-pop="elegant"] :is(.wbtn.primary, .wbtn.primary:hover:not(:disabled), .btn-worknext, .btn-answer, .btn-answer:hover) {
  color: #493516; background: var(--elegant-metal); border: 1px solid #a78647;
  box-shadow: inset 0 1px #fff6d7, 0 3px 0 #aa8949;
}
html[data-iroiro-pop="elegant"] .grade-preset-menu { box-shadow: 0 8px 24px #4b3a2030; }
/* リセット・消去・再入力の操作を銅でそろえる。 */
html[data-iroiro-pop="elegant"] :is(.settings .btn-reset-all, .settings .opclear-btn, .settings .op-sub, #ans-tenkey .ansk-win-sub) {
  color: #62301f;
  background: linear-gradient(135deg, #c78f6c, #ffe1cd 26%, #e3b18e 49%, #ffe9d8 67%, #c58b68);
  border: 2px solid #a26b4c;
  box-shadow: inset 0 1px #fff0e0, inset 0 0 0 2px #fff0e066, 0 3px 0 #976043;
}
html[data-iroiro-pop="elegant"] :is(.settings .btn-reset-all, .settings .opclear-btn, .settings .op-sub, #ans-tenkey .ansk-win-sub):hover { filter: brightness(1.06); }
html[data-iroiro-pop="elegant"] :is(.settings .btn-reset-all, .settings .opclear-btn, .settings .op-sub, #ans-tenkey .ansk-win-sub):active {
  transform: translateY(2px); filter: brightness(.98);
  box-shadow: inset 0 2px 4px #62301f33, 0 1px 0 #976043;
}
html[data-iroiro-pop="elegant"] #ans-tenkey .ansk-content {
  background: linear-gradient(145deg, #fffefa, #f0e6cf 76%, #fffaf0);
  border: 2px solid #c9ab67; border-radius: 20px;
  box-shadow: inset 0 0 0 2px #fffdf3, 0 5px 0 #b7a078, 0 12px 24px #3c352326;
}
html[data-iroiro-pop="elegant"] #ans-tenkey .ansk-btn { background: linear-gradient(#fff, #faf5e8); box-shadow: 0 3px 0 #bfaa80; }
html[data-iroiro-pop="elegant"] #ans-tenkey .ansk-btn.act,
html[data-iroiro-pop="elegant"] #ans-tenkey .ansk-btn.act:active {
  color: #f7e5b5; background: #25324b; border-color: #b39a61;
}
html[data-iroiro-pop="elegant"] #ans-tenkey .ansk-win-main { color: #493516; background: var(--elegant-metal); }
html[data-iroiro-pop="elegant"] #ans-tenkey .ansk-btn.rem-key,
html[data-iroiro-pop="elegant"] #ans-tenkey .ansk-btn.rem-key:is(:hover, :active) { color: #176775; background: #eaf3f0; border-color: #7baba4; }
