.stage-cfg{--ink: #17140f;--bone: #f3f0ea;--paper: #fbfaf7;--stone: #e4dfd5;--line: rgba(23, 20, 15, .14);--muted: #6f685d;--gold: #a8863a;--gold-hi: #cdb066;--serif: "Noto Naskh Arabic", "Amiri", serif;--sans: "IBM Plex Sans Arabic", "Tajawal", system-ui, sans-serif;font-family:var(--sans);color:var(--ink);background:var(--bone);line-height:1.7;-webkit-font-smoothing:antialiased}.stage-cfg *,.stage-cfg *:before,.stage-cfg *:after{box-sizing:border-box}.stage-cfg button{font:inherit;color:inherit;cursor:pointer}.stage-cfg button:focus-visible,.stage-cfg input:focus-visible{outline:2px solid var(--gold);outline-offset:3px}.stage-cfg h1,.stage-cfg h2,.stage-cfg h3,.stage-cfg p,.stage-cfg ul,.stage-cfg ol,.stage-cfg dl,.stage-cfg dd{margin:0;padding:0}.stage-cfg ul,.stage-cfg ol{list-style:none}.stage-cfg .wrap{max-width:1180px;margin:0 auto;padding:32px 24px 56px}.stage-cfg .state{padding:80px 24px;text-align:center;color:var(--muted)}.stage-cfg .progress{display:flex;gap:8px;margin-block-end:40px}.stage-cfg .progress li{flex:1;padding-block-start:12px;border-block-start:2px solid var(--line);font-size:14px;color:var(--muted)}.stage-cfg .progress li.is-done{border-color:var(--gold);color:var(--ink)}.stage-cfg .progress li.is-now{border-color:var(--ink);color:var(--ink);font-weight:600}.stage-cfg .layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:56px;align-items:start}.stage-cfg .title{font-family:var(--serif);font-weight:700;font-size:clamp(34px,5vw,56px);line-height:1.25}.stage-cfg .lead{margin-block-start:12px;color:var(--muted);font-size:18px;max-width:46ch}.stage-cfg .sub{font-family:var(--serif);font-weight:600;font-size:26px;margin-block:40px 16px}.stage-cfg .note{margin-block-start:16px;color:var(--muted);font-size:14px}.stage-cfg .count-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-block-start:36px}.stage-cfg .count-card{position:relative;text-align:start;padding:28px 24px 22px;background:var(--paper);border:1px solid var(--line);border-radius:4px;transition:border-color .25s,box-shadow .25s}.stage-cfg .count-card:hover{border-color:var(--gold-hi)}.stage-cfg .count-card.is-on{border-color:var(--gold);box-shadow:inset 0 0 0 1px var(--gold)}.stage-cfg .count-art{display:flex;justify-content:center;align-items:flex-end;gap:10px;height:130px;margin-block-end:20px}.stage-cfg .count-art i{display:block;width:52px;height:112px;background:linear-gradient(100deg,#c9a574,#b78d5b 55%,#a67d4d);border-radius:1px;box-shadow:6px 10px 18px #17140f38}.stage-cfg .count-name{display:block;font-family:var(--serif);font-size:26px;font-weight:700}.stage-cfg .count-sub{display:block;color:var(--muted);font-size:15px}.stage-cfg .badge{position:absolute;inset-block-start:16px;inset-inline-end:16px;font-size:12px;padding:2px 10px;background:var(--ink);color:var(--gold-hi);border-radius:2px}.stage-cfg .size-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px}.stage-cfg .size-card{padding:20px 16px;text-align:center;background:var(--paper);border:1px solid var(--line);border-radius:4px;transition:border-color .25s}.stage-cfg .size-card:hover{border-color:var(--gold-hi)}.stage-cfg .size-card.is-on{border-color:var(--gold);box-shadow:inset 0 0 0 1px var(--gold)}.stage-cfg .size-art{display:flex;align-items:flex-end;justify-content:center;gap:10px;height:150px;margin-block-end:14px;border-block-end:1px solid var(--line)}.stage-cfg .person-wrap{height:100%;display:flex;align-items:flex-end}.stage-cfg .person{height:100%;width:auto;fill:#b9b2a5}.stage-cfg .size-board{display:block;background:linear-gradient(100deg,#c9a574,#a67d4d);box-shadow:4px 6px 12px #17140f33}.stage-cfg .size-name{display:block;font-weight:600}.stage-cfg .size-dim{display:block;color:var(--muted);font-size:14px}.stage-cfg .tabs{display:flex;gap:8px;margin-block-end:20px}.stage-cfg .tab{flex:1;padding:12px;background:transparent;border:1px solid var(--line);border-radius:2px;font-weight:500}.stage-cfg .tab b{color:var(--gold)}.stage-cfg .tab.is-on{background:var(--ink);color:var(--paper);border-color:var(--ink)}.stage-cfg .tab.is-on b{color:var(--gold-hi)}.stage-cfg .seg{display:flex;margin-block-start:20px;border-block-end:1px solid var(--line)}.stage-cfg .seg button{flex:1;padding:14px 8px;background:none;border:0;border-block-end:2px solid transparent;margin-block-end:-1px;color:var(--muted);font-weight:500}.stage-cfg .seg button.is-on{color:var(--ink);border-color:var(--gold)}.stage-cfg .seg-soft{margin-block-start:8px}.stage-cfg .seg-soft button{font-size:15px;padding:10px 8px}.stage-cfg .shortcuts{display:flex;flex-wrap:wrap;gap:8px;margin-block-start:16px}.stage-cfg .shortcuts button{padding:6px 14px;font-size:14px;background:none;border:1px solid var(--line);border-radius:999px}.stage-cfg .shortcuts button:hover{border-color:var(--gold)}.stage-cfg .studio{position:relative;display:grid;place-items:center;height:clamp(320px,56vh,540px);overflow:hidden;border-radius:4px;background:#ebe8e2}.stage-cfg .studio-wall{position:absolute;inset:0 0 24%;background:radial-gradient(120% 90% at 30% 10%,#f8f6f1,#e6e2da)}.stage-cfg .studio-floor{position:absolute;inset:76% 0 0;background:linear-gradient(#d9d4ca,#cfc9bd);border-block-start:1px solid rgba(23,20,15,.08)}.stage-cfg .board-wrap{position:relative;z-index:1;height:72%;perspective:1400px;margin-block-start:-4%}.stage-cfg .board{position:relative;width:100%;height:100%;transform-style:preserve-3d;transform:rotateY(-10deg);transition:transform 1s cubic-bezier(.2,.7,.2,1)}.stage-cfg .board.is-flipped{transform:rotateY(170deg)}.stage-cfg .face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:1px;box-shadow:inset 0 0 0 1px #ffffff40,0 1px #17140f40}.stage-cfg .face:after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,rgba(255,255,255,.18),transparent 40%,rgba(0,0,0,.1));pointer-events:none}.stage-cfg .face-back{transform:rotateY(180deg)}.stage-cfg .board-shadow{position:absolute;z-index:-1;inset-inline:6%;inset-block-end:-14px;height:22px;background:radial-gradient(ellipse at center,rgba(23,20,15,.38),transparent 70%);filter:blur(6px)}.stage-cfg .btn-flip{position:absolute;z-index:2;inset-block-end:16px;inset-inline-end:16px;padding:8px 18px;background:#fbfaf7eb;border:1px solid var(--line);border-radius:999px;font-size:14px}.stage-cfg .btn-flip:hover{border-color:var(--gold)}.stage-cfg .chips{display:flex;flex-wrap:wrap;gap:8px;margin-block-end:20px}.stage-cfg .chips button{padding:6px 16px;font-size:14px;background:none;border:1px solid var(--line);border-radius:999px}.stage-cfg .chips button.is-on{background:var(--ink);color:var(--paper);border-color:var(--ink)}.stage-cfg .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:20px 16px}.stage-cfg .tile{display:block;width:100%;padding:0;background:none;border:0;text-align:start}.stage-cfg .tile-img{position:relative;display:block;aspect-ratio:3 / 4;border-radius:2px;box-shadow:0 0 0 1px var(--line);transition:transform .3s,box-shadow .3s}.stage-cfg .tile:hover .tile-img{transform:translateY(-3px)}.stage-cfg .tile.is-on .tile-img{box-shadow:0 0 0 2px var(--gold),0 10px 24px #17140f29}.stage-cfg .check{position:absolute;inset-block-start:8px;inset-inline-end:8px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--ink);color:var(--gold-hi);font-size:13px}.stage-cfg .tile-name{display:block;margin-block-start:8px;font-size:14px}.stage-cfg .empty{padding:32px;color:var(--muted);border:1px dashed var(--line);border-radius:4px}.stage-cfg .upload{margin-block-start:8px;padding:8px 24px 32px;border:1px dashed var(--gold);border-radius:4px;text-align:center;background:var(--paper)}.stage-cfg .upload .sub{margin-block-start:24px}.stage-cfg .upload p{color:var(--muted)}.stage-cfg .upload small{display:block;margin-block-start:12px;color:var(--muted)}.stage-cfg .upload .ok{margin-block-start:14px;color:var(--ink)}.stage-cfg .upload .warn{margin-block-start:14px;padding:10px 14px;background:#f6ecd2;color:#6b5316;border-radius:2px}.stage-cfg .btn-outline{margin-block-start:16px;padding:12px 28px;background:none;border:1px solid var(--ink);border-radius:2px;font-weight:500}.stage-cfg .btn-outline:hover{background:var(--ink);color:var(--paper)}.stage-cfg .summary{position:sticky;inset-block-start:24px;padding:28px;background:var(--paper);border:1px solid var(--line);border-radius:4px}.stage-cfg .summary h3{font-family:var(--serif);font-size:22px;margin-block-end:16px}.stage-cfg .summary dl div{display:flex;justify-content:space-between;gap:12px;padding-block:8px;border-block-end:1px solid var(--line);font-size:15px}.stage-cfg .summary dt{color:var(--muted)}.stage-cfg .summary dd{font-weight:500;text-align:end}.stage-cfg .summary .save dd,.stage-cfg .summary .save dt{color:var(--gold)}.stage-cfg .total{display:flex;justify-content:space-between;align-items:baseline;margin-block:20px}.stage-cfg .total strong{font-family:var(--serif);font-size:34px;line-height:1.2}.stage-cfg .total small{font-family:var(--sans);font-size:15px;font-weight:400;color:var(--muted)}.stage-cfg .btn-primary{width:100%;padding:16px;background:var(--ink);color:var(--gold-hi);border:1px solid var(--ink);border-radius:2px;font-size:17px;font-weight:600;transition:background .25s,color .25s}.stage-cfg .btn-primary:hover:not(:disabled){background:var(--gold);color:var(--ink);border-color:var(--gold)}.stage-cfg .btn-primary:disabled{opacity:.45;cursor:not-allowed}.stage-cfg .hint{margin-block-start:10px;font-size:14px;color:var(--muted);text-align:center}.stage-cfg .btn-link{display:block;margin:14px auto 0;background:none;border:0;color:var(--muted);text-decoration:underline;text-underline-offset:4px}.stage-cfg .review{display:grid;gap:16px;margin-block-start:32px}.stage-cfg .review li{display:flex;align-items:center;gap:20px;padding:16px;background:var(--paper);border:1px solid var(--line);border-radius:4px}.stage-cfg .review-faces{display:flex;gap:8px}.stage-cfg .review-faces span{display:block;width:64px;aspect-ratio:3 / 4;border-radius:1px;box-shadow:0 0 0 1px var(--line)}.stage-cfg .review-meta{display:flex;flex-direction:column;align-items:flex-start}.stage-cfg .review-meta .btn-link{margin:0}@media (max-width: 900px){.stage-cfg .wrap{padding:20px 16px 140px}.stage-cfg .layout{grid-template-columns:1fr;gap:0}.stage-cfg .summary{position:fixed;z-index:50;inset:auto 0 0;padding:12px 16px calc(12px + env(safe-area-inset-bottom));border-radius:0;border-inline:0;border-block-end:0;box-shadow:0 -8px 24px #17140f1a;display:grid;grid-template-columns:auto 1fr;gap:4px 16px;align-items:center}.stage-cfg .summary h3,.stage-cfg .summary dl,.stage-cfg .summary .btn-link{display:none}.stage-cfg .total{margin:0;flex-direction:column;align-items:flex-start}.stage-cfg .total span{font-size:12px;color:var(--muted)}.stage-cfg .total strong{font-size:24px}.stage-cfg .hint{grid-column:1 / -1;margin:0}.stage-cfg .btn-primary{padding:14px}.stage-cfg .count-grid{grid-template-columns:1fr}.stage-cfg .studio{height:clamp(300px,46vh,420px)}.stage-cfg .board-wrap{height:62%}}@media (prefers-reduced-motion: reduce){.stage-cfg *,.stage-cfg *:before,.stage-cfg *:after{transition:none!important;animation:none!important}}.stage-cfg .cropper{margin:20px auto 0;max-width:280px}.stage-cfg .crop-frame{width:100%;background-color:var(--stone);border-radius:2px;box-shadow:0 0 0 1px var(--gold);cursor:grab;touch-action:none}.stage-cfg .crop-frame:active{cursor:grabbing}.stage-cfg .zoom{display:block;margin-block-start:16px;text-align:start;font-size:14px;color:var(--muted)}.stage-cfg .zoom input{display:block;width:100%;margin-block-start:6px;accent-color:var(--gold)}.stage-cfg .crop-hint{margin-block-start:10px;font-size:13px}.stage-cfg .note-field{display:block;margin-block-start:28px}.stage-cfg .note-field span{display:block;margin-block-end:8px;font-weight:500}.stage-cfg .note-field textarea{width:100%;padding:12px 14px;font:inherit;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:2px;resize:vertical}.stage-cfg .review-faces span{width:72px}
