@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Outfit:wght@400;500;600;700;800&display=swap');
:root{--ink:#193f42;--muted:#71827a;--paper:#faf9ef;--orange:#e96e44;--line:#dedfd2}*{box-sizing:border-box}body{margin:0;background:#a5c898;color:var(--ink);font-family:'DM Sans',sans-serif;overflow:hidden}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #efb450;outline-offset:4px}button{transition:transform .15s,background .15s}button:hover{transform:translateY(-2px)}button:active{transform:translateY(1px)}[hidden]{display:none!important}#world{position:fixed;inset:0;width:100%;height:100%;touch-action:none}.vignette{position:fixed;inset:0;pointer-events:none;box-shadow:inset 0 0 160px #19433335}.creator{position:absolute;inset:0;background:linear-gradient(90deg,#f5f5e9 0%,#f5f5e9 37%,#f5f5e9dc 44%,#dbe9ce25 68%,#214b4620);overflow-y:auto}.brand{height:100px;display:flex;align-items:center;padding:20px 4.5%;gap:13px;font-family:Outfit,sans-serif;font-size:12px;line-height:1.3;letter-spacing:2px}.brand b{font-size:15px;letter-spacing:1px}.brand-mark{font-size:40px;color:var(--orange)}.edition{border-left:1px solid #80918a50;padding-left:20px;margin-left:12px;font:10px 'DM Sans',sans-serif;letter-spacing:2px}.create-layout{max-width:1500px;margin:auto;display:grid;grid-template-columns:minmax(400px,.9fr) 1.2fr;min-height:680px;padding:0 5% 25px;gap:6%}.creation-card{max-width:440px;padding-top:20px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;color:#6c8575}.creation-card h1{font:600 clamp(38px,4.4vw,66px)/1.04 Outfit,sans-serif;letter-spacing:-2px;margin:20px 0 15px}h1 em{color:var(--orange);font-style:normal}.intro{font-size:13px;color:#728278;margin:0 0 30px}.field-label{display:block;font-size:11px;font-weight:700;margin:0 0 10px}input,select{width:100%;border:1px solid #cdd6c7;background:#fffef5b0;color:var(--ink);border-radius:9px;padding:12px 14px;font-size:13px}input{font-weight:600}select{padding:10px;font-size:12px}.appearance{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin:19px 0}.swatches{display:flex;gap:9px;align-items:center;height:31px}.swatch{width:25px;height:25px;border:3px solid #faf9ef;border-radius:50%;box-shadow:0 0 0 1px #ddd}.swatch.selected{box-shadow:0 0 0 2px var(--ink);transform:scale(1.08)}.power-options{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-bottom:22px}.power-choice{border:1px solid #d5dbcd;background:#ffffff60;border-radius:10px;padding:10px 5px;color:var(--ink);font-size:11px}.power-choice b{display:block;font-size:24px;margin-bottom:4px}.power-choice.selected{border-color:var(--orange);background:#f6e2d4;box-shadow:0 0 0 1px var(--orange)}.primary{border:0;background:var(--orange);color:white;border-radius:9px;font-weight:700;padding:16px 22px;box-shadow:0 5px 0 #c5553420}.start{width:100%;display:flex;justify-content:space-between;align-items:center;font-size:14px}.start span{font-size:21px}.continue{display:block;margin:14px auto 0;background:none;border:0;text-decoration:underline;color:var(--ink);font-size:12px}.small-note{font-size:10px;text-align:center;color:#7b8879;margin-top:19px}.small-note span{color:var(--orange);font-size:15px;margin-right:4px}.hero-stage{position:relative;display:flex;flex-direction:column;align-items:center;min-height:640px}.world-label{font-size:9px;font-weight:700;letter-spacing:2px;background:#f9f9e9bb;border:1px solid #ffffff80;border-radius:25px;padding:12px 17px;margin-top:9px;backdrop-filter:blur(10px)}.live-dot{display:inline-block;background:#568c65;width:5px;height:5px;border-radius:50%;margin-right:8px}.character-orbit{position:relative;margin-top:10px;width:340px;height:400px;display:flex;flex-direction:column;align-items:center}.orbit-ring{position:absolute;width:285px;height:285px;border:1px solid #faf8d59c;border-radius:50%;top:45px;background:radial-gradient(circle,#f7f7d54d,transparent 70%);box-shadow:0 0 0 25px #f9f9cf12,0 0 0 55px #f9f9cf0c}#portrait{position:relative;width:290px;height:303px;filter:drop-shadow(0 10px 12px #1a413729)}.hero-nameplate{position:relative;text-align:center;background:#fcf9eade;padding:15px 35px;border:1px solid #fff7;min-width:240px;backdrop-filter:blur(14px);border-radius:12px;box-shadow:0 12px 40px #30504319}.hero-nameplate>span{font-size:8px;letter-spacing:1.7px;color:#81907a}.hero-nameplate h2{font:600 30px Outfit;margin:4px 0}.hero-nameplate p{font-size:11px;color:#6f8275;margin:0}.world-caption{align-self:flex-start;margin:32px 0 25px 8%;text-shadow:0 1px 14px #eff6c9;color:#163e35}.world-caption>span{font-size:9px;letter-spacing:2px;font-weight:700}.world-caption h3{font:500 29px/1.15 Outfit;margin:14px 0}.world-caption p{font-size:11px}.feature-pills{display:flex;gap:10px;align-self:flex-start;margin-left:8%}.feature-pills span{font-size:10px;border:1px solid #ffffd98a;background:#ffffed99;padding:9px 13px;border-radius:30px}.creator-footer{display:flex;justify-content:space-between;padding:10px 5% 24px;font-size:8px;letter-spacing:2px;color:#718574}.game-top{position:absolute;top:24px;left:25px;right:25px;display:flex;align-items:flex-start;justify-content:space-between;gap:14px;pointer-events:none}.game-top>*{pointer-events:auto}.hero-card{display:flex;align-items:center;border:1px solid #fff8;border-radius:15px;background:#fcf9edeb;padding:6px 20px 6px 5px;text-align:left;box-shadow:0 8px 25px #1f3d2820;min-width:232px;color:var(--ink)}#miniPortrait{width:58px;height:58px}.hero-card strong{display:block;font:600 20px Outfit}.hero-card span{display:block;font-size:9px;color:#788474;margin:3px 0 8px}.xp-track{height:4px;width:130px;border-radius:4px;background:#dbe0cf;overflow:hidden}.xp-track i{display:block;background:var(--orange);height:100%;width:0;transition:width .5s}.location-chip{text-align:center;background:#fcf9edda;border:1px solid #fff7;border-radius:0 0 16px 16px;padding:12px 30px;margin-top:-24px;backdrop-filter:blur(10px)}.location-chip>span{font:600 16px Outfit;display:block}.location-chip small{font-size:9px;color:#7c8c77;display:block;margin-top:4px}.top-actions{display:flex;gap:9px;align-items:center}.coins,.icon-button{background:#fcf9edeb;border:1px solid #fff8;border-radius:11px;height:43px;min-width:43px;color:var(--ink);display:flex;align-items:center;justify-content:center}.coins{padding:0 17px;color:#bd8529;gap:8px;font-size:17px}.icon-button{font-size:24px}.quest-tracker{position:absolute;left:25px;top:122px;width:250px;background:#fcf9ede8;backdrop-filter:blur(12px);border:1px solid #fff7;border-radius:12px;padding:19px;box-shadow:0 7px 30px #29483315}.quest-tracker .eyebrow{font-size:8px;letter-spacing:1.4px;display:flex;justify-content:space-between}.quest-tracker h3{font:600 19px Outfit;margin:14px 0 8px}.quest-tracker p{font-size:11px;line-height:1.6;color:#748270;margin:0 0 13px}.progress-row{font-size:10px;background:#e7ebdd;padding:9px;border-radius:6px;margin-top:5px}.progress-row.done{color:#3a8064}.quest-tracker button{display:flex;justify-content:space-between;width:100%;margin-top:17px;padding:13px 0 0;background:none;border:0;border-top:1px solid #dce1d3;color:#657c69;font-size:10px}.explore-label{position:absolute;left:30px;bottom:106px;pointer-events:none;color:#fffce8;text-shadow:0 2px 15px #1d4438}.explore-label span{font-size:10px;letter-spacing:2px;text-transform:uppercase}.explore-label h2{font:500 34px Outfit;margin:7px 0}.bottom-bar{position:absolute;bottom:24px;left:25px;right:25px;display:flex;align-items:center;gap:12px;justify-content:flex-end}.keyboard-help{margin-right:auto;background:#fdf8e3c9;border-radius:9px;padding:11px;display:flex;gap:8px;align-items:center;font-size:9px}.keyboard-help span{margin-right:8px;color:#67806c}kbd,.key{font:9px 'DM Sans';border:1px solid #86998460;border-radius:4px;padding:4px 5px;background:#ffffff60;color:#5c7567}.power-button{display:flex;align-items:center;gap:15px;padding:9px 14px;border:1px solid #fef9e9;border-radius:13px;background:#173f40ed;color:#fff5df;text-align:left;box-shadow:0 6px 20px #26453f40;min-width:225px}.power-button>span:first-child{font-size:27px;color:#eaae70}.power-button strong{font-size:12px;display:block}.power-button small{font-size:9px;color:#bed1b6;display:block;margin-top:3px}.power-button .key{color:#d4dfcf;border-color:#b5d1b330;background:#ffffff12;margin-left:auto}.interact-button{border:1px solid #fff8;background:#fcf9ede8;color:var(--ink);border-radius:12px;padding:18px;font-size:12px}.interact-button kbd{margin-left:15px}.interaction-hint{position:absolute;left:50%;bottom:120px;transform:translateX(-50%);background:#183f40ed;color:#fff9df;border:1px solid #ffffdb55;border-radius:25px;padding:12px 20px;font-size:12px;white-space:nowrap;pointer-events:none}.toast{position:absolute;top:100px;left:50%;transform:translate(-50%,-15px);background:#fff9e8;border:1px solid #fff;border-radius:14px;padding:16px 25px;box-shadow:0 10px 35px #214a3830;opacity:0;transition:.3s;pointer-events:none;text-align:center;font-size:13px;max-width:85vw}.toast.show{opacity:1;transform:translate(-50%,0)}dialog{border:1px solid #fff8;border-radius:20px;background:var(--paper);color:var(--ink);padding:0;width:min(600px,92vw);max-height:85dvh;box-shadow:0 25px 100px #102b4160}dialog::backdrop{background:#163d4270;backdrop-filter:blur(5px)}.modal-head{padding:28px 30px 20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:flex-start}.modal-head h2{font:600 28px Outfit;margin:6px 0 0}.close{border:0;background:#e8ebdf;color:var(--ink);width:32px;height:32px;border-radius:50%;font-size:21px}.modal-body{padding:24px 30px;line-height:1.7;font-size:13px}.modal-body p{margin-top:0}.modal-actions{display:flex;gap:10px;margin-top:22px}.secondary{border:1px solid #cdd7c7;background:#e8edde;color:var(--ink);padding:12px 18px;border-radius:8px;font-size:12px}.quest-item{border:1px solid var(--line);border-radius:10px;margin-bottom:10px;padding:14px 17px;position:relative}.quest-item h4{font:600 16px Outfit;margin:0 0 4px}.quest-item p{font-size:11px;line-height:1.6;color:#6c806d;margin:0}.quest-item .reward{font-size:10px;color:#b78939;margin-top:6px}.quest-item.completed{opacity:.6}.quest-item button{float:right;margin-left:8px}.quest-item .status{font-size:9px;letter-spacing:1px;color:#74917c}.tabs{display:flex;gap:8px;margin-bottom:20px}.tabs button{flex:1;border:1px solid #d5decd;background:#edf0e4;color:var(--ink);padding:9px;border-radius:7px;font-size:12px}.tabs button.active{background:var(--ink);color:#fff}.map-wrap{position:relative;width:100%;aspect-ratio:1.5;border-radius:12px;overflow:hidden;background:#a9c894}.map-wrap canvas{width:100%;height:100%}.map-legend{font-size:11px;margin-top:12px;color:#71836e}.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:20px 0}.stat-grid div{text-align:center;background:#e9eddf;border-radius:9px;padding:12px}.stat-grid b{display:block;font:600 24px Outfit}.stat-grid span{font-size:10px}.touch-pad{display:none;position:absolute;bottom:96px;left:20px;grid-template-columns:repeat(3,42px);gap:3px}.touch-pad button{width:42px;height:42px;border:1px solid #fff9;background:#fff6dbd9;border-radius:10px;color:#19463d;font-size:23px;touch-action:none}.touch-pad button:first-child{grid-column:2}.touch-pad button:nth-child(2){grid-column:1;grid-row:2}.touch-pad button:nth-child(3){grid-column:2;grid-row:2}.touch-pad button:nth-child(4){grid-column:3;grid-row:2}
.style-field{margin:0 0 17px}.style-field select{padding:9px 12px}.style-field .field-label{margin-bottom:7px}
@media(min-width:1500px){.create-layout{padding-top:30px}.creation-card{padding-top:40px}.hero-stage{padding-top:15px}.character-orbit{margin-top:30px}}
@media(max-height:800px) and (min-width:801px){.brand{height:75px}.create-layout{min-height:570px}.creation-card{padding-top:5px}.creation-card h1{font-size:47px;margin:14px 0 12px}.intro{margin-bottom:20px}.appearance{margin:14px 0}.hero-stage{min-height:570px}.character-orbit{height:350px}#portrait{height:265px;width:254px}.hero-nameplate{padding:10px 30px}.world-caption{margin-top:20px;margin-bottom:15px}.world-caption h3{font-size:25px}.small-note{margin-top:13px}.power-options{margin-bottom:16px}.creator-footer{padding-bottom:14px}}
@media(max-width:800px){.brand{height:75px;padding:16px 6%}.brand .edition{display:none}.creator{background:linear-gradient(100deg,#f5f5e9f5,#f5f5e9db)}.create-layout{display:flex;padding:0 7% 25px;gap:0;min-height:0}.creation-card{width:100%;max-width:none;padding-top:10px}.creation-card h1{font-size:43px;margin:13px 0}.intro{font-size:12px;margin-bottom:24px}.hero-stage{display:none}.creator-footer{padding:0 7% 20px;font-size:7px;letter-spacing:1px}.game-top{top:12px;left:12px;right:12px}.hero-card{min-width:172px;padding-right:12px}#miniPortrait{width:42px;height:48px}.hero-card strong{font-size:16px}.hero-card span{font-size:8px}.xp-track{width:100px}.location-chip{display:none}.top-actions{gap:5px}.icon-button,.coins{height:35px;min-width:35px;border-radius:9px}.coins{padding:0 8px;font-size:12px}.icon-button{font-size:20px}.quest-tracker{left:12px;top:87px;width:205px;padding:14px}.quest-tracker h3{font-size:17px;margin:10px 0 6px}.quest-tracker p{font-size:10px;margin-bottom:9px}.quest-tracker button{margin-top:10px;padding-top:10px}.quest-tracker .eyebrow{font-size:7px}.explore-label{display:none}.bottom-bar{bottom:18px;left:14px;right:14px;gap:8px}.keyboard-help{display:none}.power-button{min-width:0;padding:10px;gap:8px;margin-left:auto}.power-button .key{display:none}.power-button strong{font-size:11px}.power-button small{font-size:8px}.power-button>span:first-child{font-size:21px}.interact-button{padding:17px 12px;font-size:11px}.interact-button kbd{display:none}.touch-pad{display:grid}.interaction-hint{bottom:93px;font-size:10px;max-width:calc(100vw - 170px);left:auto;right:15px;transform:none;white-space:normal;text-align:center;padding:10px}.toast{top:85px;width:90%;font-size:11px}.modal-head{padding:22px 23px 15px}.modal-body{padding:20px 23px}.modal-head h2{font-size:24px}}
@media(pointer:coarse){.touch-pad{display:grid}.keyboard-help{display:none}}
@media(prefers-reduced-motion:reduce){button,.toast,.xp-track i{transition:none}}

@media(max-height:800px) and (min-width:801px){.brand{height:65px}.creation-card h1{font-size:43px;margin:10px 0}.intro{margin-bottom:16px}.appearance{margin:12px 0}.field-label{margin-bottom:8px}.style-field{margin-bottom:12px}.power-choice{padding:7px 5px}.power-options{margin-bottom:12px}.small-note{margin-top:11px}.start{padding:13px 20px}.hero-stage{min-height:590px}}
