/* Moradon Forge — atmosphere stays decorative; all outcomes are server-confirmed. */
.forge-page { --forge-amber: #e3a65d; --forge-muted: #ada995; }
.forge-hero { position: relative; height: 260px; overflow: hidden; border: 1px solid #6c5638; border-radius: 9px 9px 0 0; background: #171811; isolation: isolate; }
.forge-hero picture, .forge-hero img { position: absolute; width: 100%; height: 100%; inset: 0; display: block; }
.forge-hero img { object-fit: cover; object-position: center 55%; }
.forge-hero::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg, #0e100dec, #0e100d30 65%), linear-gradient(0deg, #14160fee, transparent 50%); }
.forge-hero-copy { position: absolute; z-index: 2; left: 24px; bottom: 26px; right: 65px; text-shadow: 0 2px 14px #000; }
.forge-hero .eyebrow { color: #eed0a1; font-size: 10px; letter-spacing: .2em; }
.forge-hero h1 { margin: 4px 0 6px; font: 400 clamp(32px, 5vw, 50px)/1.1 var(--font-display); letter-spacing: -.035em; color: #fff0d3; }
.forge-hero p { margin: 0; color: #e7d2b2; font-size: 13px; }
.forge-seal { position: absolute; z-index: 2; right: 22px; bottom: 27px; width: 38px; height: 48px; display: grid; place-items: center; color: var(--gold2); border: 1px solid #b99a6066; background: #10110f88; border-radius: 3px 3px 18px 18px; }
.forge-embers { position: absolute; inset: 0; z-index: 1; overflow: hidden; pointer-events: none; }
.forge-embers i { position: absolute; bottom: 15%; left: 55%; width: 2px; height: 4px; background: #e9b36c; border-radius: 50%; box-shadow: 0 0 7px #f1813c; opacity: 0; animation: forge-ember 5s linear infinite; }
.forge-embers i:nth-child(2) { left: 65%; animation-delay: -1s; animation-duration: 6s; }
.forge-embers i:nth-child(3) { left: 44%; animation-delay: -3s; animation-duration: 7s; }
.forge-embers i:nth-child(4) { left: 73%; animation-delay: -4s; }
.forge-embers i:nth-child(5) { left: 49%; animation-delay: -2s; animation-duration: 8s; }
@keyframes forge-ember { 0% { transform: translate(0, 0); opacity: 0; } 20% { opacity: .65; } 80% { opacity: .25; } 100% { transform: translate(20px, -150px); opacity: 0; } }
.forge-layout { display: grid; gap: 18px; align-items: start; margin-top: 18px; }
.forge-layout > *, .forge-panel, .forge-item-copy { min-width: 0; }
.forge-panel { padding: 20px; background: linear-gradient(145deg, #25271e, #171b15 60%); border-color: #6b603f; margin: 0; box-shadow: inset 0 1px #e5be6620, 0 12px 36px #0003; }
.forge-selected { display: flex; gap: 14px; align-items: center; padding-bottom: 17px; border-bottom: 1px solid #79705044; }
.forge-item-art { flex: 0 0 auto; padding: 5px; border: 1px solid #a38a4c77; border-radius: 7px; background: radial-gradient(#b7853433, transparent); box-shadow: 0 0 28px #ad752b1c; }
.forge-item-art .ico, .forge-item-art .ico-art { width: 64px; height: 64px; flex-basis: 64px; border-radius: 3px; }
.forge-item-copy { flex: 1; }
.forge-item-copy h2 { margin: 0 0 4px; font-size: 19px; font-family: var(--font-display); font-weight: 400; line-height: 1.3; overflow-wrap: anywhere; }
.forge-item-copy small { display: block; color: var(--dim); font-size: 11px; }
.forge-item-copy .eyebrow { font-size: 9px; }
.forge-change { font-size: 11px; padding: 8px 0; min-width: 48px; }
.forge-evolution { display: flex; gap: 18px; align-items: center; padding: 18px 0 12px; }
.forge-evolution small { color: var(--dim); font-size: 11px; display: block; }
.forge-evolution b { display: block; font: 400 31px/1.25 var(--font-display); font-variant-numeric: tabular-nums; color: var(--gold2); }
.forge-evolution > span { color: var(--forge-muted); font-size: 23px; margin-top: 16px; }
.forge-chance { margin-left: auto; text-align: right; }
.forge-chance b { color: #f3d598; }
.forge-rate { height: 4px; background: #070a06; overflow: hidden; border-radius: 2px; margin-bottom: 10px; }
.forge-rate i { display: block; height: 100%; background: linear-gradient(90deg, #755829, #efd39a); }
.forge-gains { border-bottom: 1px solid var(--line); padding-bottom: 8px; }
.forge-gains summary { display: flex; justify-content: space-between; align-items: center; min-height: 44px; gap: 10px; cursor: pointer; color: var(--dim); font-size: 12px; }
.forge-gains summary .ki { width: 16px; height: 16px; color: var(--gold); }
.forge-gains[open] summary { color: var(--gold2); }
.forge-step { display: flex; align-items: center; gap: 9px; margin: 17px 0 9px; }
.forge-step > span { font-size: 9px; color: var(--gold); font-variant-numeric: tabular-nums; letter-spacing: .07em; }
.forge-step h3 { margin: 0; color: var(--txt); font-size: 12px; font-weight: 600; }
.forge-methods { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.forge-method { display: grid; grid-template-columns: 22px minmax(0,1fr); align-items: center; gap: 5px 8px; text-align: left; border: 1px solid var(--line2); border-radius: 6px; padding: 12px; background: #131710; color: var(--dim); }
.forge-method .ki { width: 20px; height: 20px; color: var(--gold); }
.forge-method b { font-size: 13px; }
.forge-method strong { grid-column: 1 / -1; color: var(--txt); font-size: 19px; font-weight: 500; }
.forge-method small { grid-column: 1 / -1; font-size: 11px; }
.forge-method.on { border-color: var(--gold); background: linear-gradient(130deg, #40371f77, #191e15); box-shadow: inset 0 0 0 1px #b99a6022; color: var(--gold2); }
.forge-method.on::after { content: "Seçili"; grid-column: 1 / -1; color: var(--gold2); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.forge-method:not(.on)::after { content: "Seç"; grid-column: 1 / -1; font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.forge-protection { display: flex; align-items: center; gap: 10px; padding: 12px; width: 100%; border: 1px solid var(--line2); border-radius: 6px; background: #131710; text-align: left; }
.forge-protection > .ki { color: #879989; width: 24px; height: 24px; }
.forge-protection > span:not(.forge-switch) { flex: 1; min-width: 0; }
.forge-protection b { display: block; font-size: 13px; }
.forge-protection small { display: block; font-size: 10px; color: var(--dim); line-height: 1.5; margin-top: 2px; }
.forge-protection.on { border-color: #9aac88; background: #33402e44; }
.forge-protection.on > .ki { color: #c3d5ac; }
.forge-switch { font-size: 10px; border: 1px solid var(--line2); padding: 4px 6px; border-radius: 4px; color: var(--dim); }
.forge-protection.on .forge-switch { color: #d4e6bc; border-color: #a0b98a88; background: #6a835933; }
.forge-risk { display: flex; gap: 10px; align-items: flex-start; padding: 12px; margin-top: 12px; border: 1px solid #62725366; border-radius: 5px; background: #5c7c3910; color: #c2d0b2; }
.forge-risk > .ki { width: 18px; height: 18px; margin-top: 2px; }
.forge-risk p { margin: 0; font-size: 11px; line-height: 1.55; }
.forge-risk p b { display: block; font-size: 12px; margin-bottom: 3px; }
.forge-risk.is-break { background: #ae584514; border-color: #ae675966; color: #efb2a1; }
.forge-risk.is-reset { background: #b99a6014; border-color: #b99a6055; color: #e3cea7; }
.forge-materials > div { display: flex; justify-content: space-between; gap: 10px; padding: 7px 0; border-bottom: 1px solid #ffffff08; font-size: 11px; }
.forge-materials span { min-width: 0; overflow-wrap: anywhere; color: var(--dim); }
.forge-materials b { flex-shrink: 0; font-size: 10px; }
.forge-page .missing { color: #efb2a1; }
.forge-materials .ready b { color: #c2d0b2; }
.forge-submit { width: 100%; min-height: 52px; margin-top: 16px; display: flex; align-items: center; justify-content: center; gap: 9px; font-weight: 650; font-size: 15px; background: linear-gradient(110deg,#e9c584,#b58a49); box-shadow: 0 4px 22px #c48d3322, inset 0 1px #ffeccc66; }
.forge-submit:disabled { opacity: .5; box-shadow: none; }
.forge-footnote { margin: 9px 0 0; text-align: center; color: var(--dim2); font-size: 10px; }
.forge-inventory { padding: 17px; margin: 0; }
.forge-inventory-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px; }
.forge-inventory-heading h2 { margin: 0; font: 400 24px/1.2 var(--font-display); }
.forge-filters { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-bottom: 12px; }
.forge-filters button { min-height: 44px; border: 1px solid var(--line); border-radius: 5px; color: var(--dim); font-size: 11px; background: #11160f; white-space: nowrap; }
.forge-filters .on { color: var(--gold2); border-color: #b99a6077; background: #b99a6010; }
.forge-filters .ki { width: 14px; height: 14px; }
.forge-list-note { margin: 8px 0 12px; color: var(--dim2); font-size: 10px; }
.forge-page .anvil-item { width: 100%; text-align: left; min-width: 0; min-height: 76px; padding: 11px; gap: 10px; border: 1px solid var(--line); background: #12170f; margin-bottom: 7px; }
.forge-page .anvil-item.sel { border-color: var(--gold); background: #343522; box-shadow: inset 3px 0 var(--gold), 0 0 16px #b99a6010; }
.forge-page .anvil-item .info b { white-space: normal; overflow-wrap: anywhere; font-size: 12px; line-height: 1.4; }
.forge-page .anvil-item .info small { display: block; font-size: 10px; }
.forge-page .anvil-item .right { color: var(--gold2); font-size: 11px; white-space: nowrap; }
.forge-page .anvil-item .equipped-label { font-size: 9px; padding: 2px 4px; }
.forge-page .anvil-item .equipped-label .ki { width: 11px; height: 11px; }
.forge-item-max { font-size: 9px; letter-spacing: .08em; }
.forge-empty, .forge-max { padding: 30px 5px; text-align: center; }
.forge-empty > .ki, .forge-max > .ki { width: 42px; height: 42px; color: var(--gold); margin-bottom: 12px; }
.forge-empty h2, .forge-max h3 { font: 400 25px/1.2 var(--font-display); margin: 0 0 10px; color: var(--gold2); }
.forge-empty p, .forge-max p { color: var(--dim); font-size: 13px; margin: 0 auto 20px; max-width: 300px; }
.forge-empty .btn { color: var(--gold2); }
.forge-empty .btn .ki { width: 17px; height: 17px; margin-left: 8px; }
.forge-list-empty { text-align: center; padding: 25px 0; font-size: 13px; color: var(--dim); }
.forge-list-empty > .ki { width: 32px; height: 32px; color: var(--gold); }
.forge-result { display: flex; align-items: center; gap: 12px; background: linear-gradient(125deg,#393120,#22271a); border: 1px solid var(--gold); border-radius: 7px; padding: 16px; margin-bottom: 14px; animation: forge-reveal .55s ease-out both; }
.forge-result > .ki { width: 30px; height: 30px; color: var(--gold2); }
.forge-result > div { min-width: 0; flex: 1; }
.forge-result b, .forge-result span, .forge-result small { display: block; }
.forge-result b { font: 400 21px/1.2 var(--font-display); color: var(--gold2); margin-bottom: 4px; }
.forge-result span { font-size: 12px; overflow-wrap: anywhere; }
.forge-result small { color: var(--dim); font-size: 11px; margin-top: 4px; }
.forge-result.is-break { background: #42261e; border-color: #b97661; }
.forge-result.is-break b, .forge-result.is-break > .ki { color: #f2b09a; }
.forge-result .btn { padding: 0; width: 44px; flex: 0 0 44px; min-height: 44px; font-size: 23px; }
@keyframes forge-reveal { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
.forge-confirm-item { display: flex; align-items: center; gap: 14px; margin: 18px 0; }
.forge-confirm-item > div:last-child { min-width: 0; overflow-wrap: anywhere; }
.forge-confirm-item small { display: block; font-size: 12px; color: var(--dim); margin-top: 5px; }
.forge-confirm .kv b { text-align: right; font-size: 12px; }
.forge-confirm .btn-row { margin-top: 18px; }
.forge-confirm .btn-row .btn { min-height: 48px; white-space: normal; }
.forge-workbench, .forge-inventory { scroll-margin-top: 220px; }
@media (min-width: 1100px) {
  .forge-hero { height: 280px; }
  .forge-hero img { object-position: center 60%; }
  .forge-hero::after { background: linear-gradient(90deg,#0e100de6,transparent 75%),linear-gradient(0deg,#14160faa,transparent 50%); }
  .forge-hero-copy { left: 34px; bottom: 35px; }
  .forge-layout { grid-template-columns: minmax(0,1.25fr) minmax(0,1fr); gap: 22px; }
  .forge-panel { padding: 24px; }
  .forge-inventory { padding: 22px; }
  .forge-item-list { max-height: 760px; overflow-y: auto; padding-right: 3px; scrollbar-width: thin; scrollbar-color: #646644 transparent; }
}
@media (max-width: 420px) {
  .forge-hero { height: 225px; }
  .forge-hero img { object-position: 57% center; }
  .forge-hero-copy { left: 17px; bottom: 20px; right: 55px; }
  .forge-hero h1 { font-size: 34px; }
  .forge-hero p { font-size: 11px; }
  .forge-seal { right: 15px; bottom: 20px; width: 30px; height: 40px; }
  .forge-panel, .forge-inventory { padding: 14px; }
  .forge-selected { gap: 10px; flex-wrap: wrap; }
  .forge-item-art .ico, .forge-item-art .ico-art { width: 52px; height: 52px; flex-basis: 52px; }
  .forge-item-copy h2 { font-size: 17px; }
  .forge-change { margin-left: auto; }
  .forge-evolution { gap: 11px; }
  .forge-evolution b { font-size: 29px; }
  .forge-evolution small { font-size: 10px; }
  .forge-page .anvil-item { padding: 9px; gap: 8px; }
  .forge-page .anvil-item .ico, .forge-page .anvil-item .ico-art { width: 38px; height: 38px; flex-basis: 38px; }
  .forge-page .anvil-item .right { font-size: 10px; }
  .forge-protection { padding: 10px; gap: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .forge-embers { display: none; }
  .forge-result { animation: none; }
  .forge-page *, .forge-confirm * { scroll-behavior: auto; }
}

