:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#f3f0eb;background:#11131b;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input{font:inherit}button{cursor:pointer}.hidden{display:none!important}.topbar{height:79px;background:#171923;border-bottom:1px solid #2b2e3a;display:flex;justify-content:space-between;align-items:center;padding:0 clamp(18px,5vw,80px)}.brand{display:flex;gap:14px;align-items:center}.brand-icon{display:grid;place-items:center;color:#282136;background:#eac3b9;width:41px;height:41px;border-radius:13px;font-size:28px}.brand strong{display:block;letter-spacing:3px;font-size:14px}.brand small{display:block;color:#9d9daa;font-size:11px;letter-spacing:.5px;margin-top:4px}.top-actions{display:flex;align-items:center;gap:20px}.counter,.ghost{color:#c0bac4;font-size:13px}.ghost{background:transparent;color:#fff;border:1px solid #555366;border-radius:9px;padding:11px 18px}.gallery-screen{max-width:1370px;margin:auto;padding:40px clamp(20px,5vw,80px) 100px}.hero{position:relative;background:radial-gradient(ellipse at 85% 16%,#413448 0,transparent 52%),linear-gradient(120deg,#2f2738,#221f2c 70%);border:1px solid #554459;border-radius:24px;padding:clamp(32px,6vw,76px);overflow:hidden}.hero:after{content:'✦';position:absolute;right:8%;top:10%;font-size:210px;line-height:1;color:#f4bcba14;transform:rotate(-16deg)}.eyebrow{color:#e8b6a8;font-size:11px;letter-spacing:3px;font-weight:800}h1{font-family:Georgia,serif;font-size:clamp(43px,5.9vw,76px);letter-spacing:-2.4px;line-height:1.07;margin:16px 0}h1 em{color:#e9b3a9;font-weight:400}p{line-height:1.65}.hero p{max-width:550px;color:#c3bbca;font-size:15px}.hero-pills{display:flex;gap:10px;flex-wrap:wrap;margin-top:32px}.hero-pills .hero-pill{display:inline-flex;align-items:center;gap:7px;border:1px solid #6a536a;background:#ffffff08;padding:10px 14px;border-radius:30px;font-size:12px}.hero-pills .ui-icon{width:15px;height:15px;color:#e8b6a8}.gallery-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:45px 0 22px}.gallery-head h2{font-family:Georgia,serif;font-size:33px;margin:0}.gallery-head p{color:#a7a4b0;margin:7px 0 0;font-size:13px}.gallery-head>div:last-child{font-size:12px;color:#c7a6ae}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:20px}.art-card{background:#1d202a;border:1px solid #333541;padding:0;text-align:left;border-radius:15px;overflow:hidden;color:#f6f0ef;transition:transform .2s,border .2s}.art-card:hover{transform:translateY(-5px);border-color:#dcaaa6}.art-cover{aspect-ratio:3/3.75;background:#ddd;position:relative;overflow:hidden}.art-cover img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}.art-card:hover img{transform:scale(1.04)}.art-cover .finished{position:absolute;right:10px;top:10px;background:#25212fea;border-radius:20px;padding:7px 10px;font-size:11px}.art-info{padding:15px}.art-info small{display:block;color:#cf9e9f;font-size:10px;letter-spacing:1.5px;margin-bottom:7px}.art-info strong{display:block;font-size:14px;line-height:1.4}.editor-screen{height:calc(100dvh - 79px);min-height:500px;display:flex;flex-direction:column}.editor-toolbar{min-height:66px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 26px;background:#1d1f2a;border-bottom:1px solid #343644}.art-title{display:flex;flex-direction:column;gap:3px;min-width:190px}.art-title span{font-size:10px;letter-spacing:1.5px;color:#d6a2a6}.art-title strong{font-size:14px}.toolbar-actions{display:flex;align-items:center;gap:7px}.toolbar-actions button{background:#2b2e3b;color:#e7e4ec;border:1px solid #414351;border-radius:8px;padding:9px 12px;white-space:nowrap}.toolbar-actions button:disabled{opacity:.35;cursor:default}.toolbar-actions button.primary{background:#dda5a3;color:#26202a;border-color:#dda5a3;font-weight:700}.sep{width:1px;height:22px;background:#4b4a58;margin:0 7px}#zoomLevel{font-size:11px;width:43px;text-align:center}.editor-layout{display:flex;flex:1;min-height:0}.tools-panel{width:242px;flex:none;background:#1a1c26;padding:23px 20px;overflow:auto;border-right:1px solid #363844}.tools-panel h3{font-size:12px;color:#d6c7cf;letter-spacing:1px;margin:0 0 15px}.tools-list{display:grid;grid-template-columns:1fr 1fr;gap:7px}.tool{border:1px solid #42424f;border-radius:8px;background:#282a37;color:#ded9e3;padding:10px 5px;font-size:12px}.tool span{font-size:17px;display:block;margin-bottom:5px}.tool.active,.mobile-toolbar .active{background:#deb0ab;color:#221d27;border-color:#deb0ab}.tool-extra{margin:25px 0}.tool-extra label{font-size:12px;display:flex;justify-content:space-between;color:#c5bdc9}.tool-extra input{width:100%;accent-color:#e5ada8;margin-top:15px}.palette-header{display:flex;align-items:center;justify-content:space-between}.palette-header h3{margin:0}.color-well{position:relative;background:#333643;border-radius:8px;padding:4px;display:grid;place-items:center;width:32px;height:32px;cursor:pointer}.color-well input{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}.palette{display:grid;grid-template-columns:repeat(6,1fr);gap:7px;margin-top:14px}.swatch{aspect-ratio:1;border-radius:50%;border:2px solid #ffffff22;padding:0;transition:transform .12s}.swatch:hover{transform:scale(1.18)}.swatch.selected{outline:2px solid #fff;outline-offset:2px}.current-color{display:flex;align-items:center;gap:9px;margin:20px 0;color:#b4aebb;font-size:11px}.current-color i{width:24px;height:24px;border-radius:6px;border:1px solid #fff5}hr{border:0;border-top:1px solid #3d3d49;margin:19px 0}.panel-btn{width:100%;padding:11px 7px;margin-bottom:8px;background:#292c38;border:1px solid #484956;border-radius:8px;color:#ddd6dd;font-size:12px;text-align:left}.danger{color:#ebaea7}.tool-note{color:#9997a7;font-size:11px;margin-top:15px}.workspace{flex:1;min-width:0;position:relative;overflow:hidden;background-color:#252833;background-image:radial-gradient(#474953 1px,transparent 1px);background-size:20px 20px;touch-action:none;cursor:crosshair}.canvas-stage{position:absolute;left:0;top:0;transform-origin:top left;box-shadow:0 13px 60px #0009;background:white;line-height:0;will-change:width,height,transform}.canvas-stage canvas{display:block;width:100%;height:100%;touch-action:none}.workspace-hint{position:absolute;bottom:17px;left:50%;transform:translateX(-50%);background:#151721bb;border:1px solid #5555;padding:9px 13px;border-radius:30px;color:#efebf2;font-size:11px;white-space:nowrap;pointer-events:none}.status-toast{position:absolute;top:18px;left:50%;transform:translateX(-50%);background:#171923eb;border:1px solid #595766;color:#f2e9ee;padding:10px 17px;font-size:12px;border-radius:24px;opacity:0;pointer-events:none;transition:opacity .2s}.status-toast.show{opacity:1}.mobile-toolbar{display:none}footer{border-top:1px solid #2e303c;text-align:center;font-size:11px;color:#858292;padding:22px}.editor-screen+footer{display:none}@media(max-width:1000px){.toolbar-actions button span{display:none}.tools-panel{width:205px;padding:18px 12px}.toolbar-actions{gap:4px}.toolbar-actions button{padding:8px}.editor-toolbar{padding:8px 13px}}@media(max-width:680px){.topbar{height:65px;padding:0 15px}.brand-icon{width:34px;height:34px}.brand strong{font-size:12px}.brand small{font-size:9px}.counter{display:none}.gallery-screen{padding:22px 15px 70px}.hero{padding:34px 24px}.gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.art-info{padding:11px}.art-info strong{font-size:12px}.gallery-head{margin-top:32px}.editor-screen{height:calc(100dvh - 65px)}.editor-toolbar{min-height:56px}.art-title{min-width:105px;max-width:150px}.art-title strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}.toolbar-actions button{padding:7px}.toolbar-actions .sep{margin:0 2px}.tools-panel{display:none;position:absolute;z-index:10;bottom:72px;left:10px;right:10px;width:auto;max-height:70vh;border:1px solid #565365;border-radius:13px;box-shadow:0 10px 45px #000b;grid-template-columns:1fr}.tools-panel.mobile-open{display:block}.editor-layout{position:relative}.mobile-toolbar{display:flex;justify-content:space-around;gap:4px;background:#1b1d29;border-top:1px solid #454352;padding:9px 5px max(9px,env(safe-area-inset-bottom))}.mobile-toolbar button{font-size:11px;border:1px solid #4e4c5a;color:#f2e9f0;background:#2d303e;padding:10px 5px;border-radius:9px;flex:1}.workspace-hint{font-size:9px;bottom:9px}.palette{grid-template-columns:repeat(10,1fr)}}

/* Genişletilmiş renk ve fırça paneli */
.brush-options{display:flex;flex-direction:column;gap:9px;margin:8px 0 23px}.brush-options label{font-size:12px;color:#d9cfdd}.brush-options small{color:#a9a5b1;font-size:10px}.brush-options select{width:100%;background:#2d3040;color:#fff;border:1px solid #696575;padding:11px 8px;border-radius:9px;cursor:pointer}.palette{display:block}.palette-group{margin:0 0 15px}.palette-group>strong{display:block;font-size:11px;color:#c3b7c8;margin-bottom:9px}.palette-tiles{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.palette-tiles .swatch{width:100%;min-width:0}.tools-panel{width:265px}@media(max-width:1000px){.tools-panel{width:230px}}@media(max-width:680px){.tools-panel{width:auto}.palette-tiles{grid-template-columns:repeat(10,minmax(0,1fr));gap:7px}}

.gallery-controls{display:flex;gap:12px;margin:-8px 0 25px}.gallery-controls input,.gallery-controls select{background:#252734;color:#f5e9ec;border:1px solid #514b5b;border-radius:10px;padding:12px 14px;min-width:0}.gallery-controls input{flex:1}.recent-label{color:#d8bec5;font-size:11px;margin:13px 0 9px}.recent-colors{display:grid;grid-template-columns:repeat(6,1fr);gap:9px;margin-bottom:18px}.recent-colors .swatch{min-height:25px}.editor-toolbar .toolbar-actions{flex-wrap:wrap;justify-content:end}@media(max-width:680px){.gallery-controls{flex-direction:column}.recent-colors{grid-template-columns:repeat(10,1fr)}#beforeBtn,#afterBtn{display:none}}

#restoreInput.hidden{display:none!important}
.tool-extra small{display:block;color:#a9aabb;font-size:11px;line-height:1.35;margin-top:5px}

.save-indicator{font-size:11px;white-space:nowrap;color:#8bc9b2;max-width:150px;overflow:hidden;text-overflow:ellipsis}.art-card:focus-visible,.swatch:focus-visible,button:focus-visible{outline:3px solid #f3bf77;outline-offset:2px}@media(max-width:790px){.save-indicator{display:none}}

/* BerfinidaGames credit remains visible with the atelier footer. */
.site-credit{display:block;margin-top:7px;font-weight:800;letter-spacing:.09em;color:#f2c9e9}

/* V8: clearer collection momentum and faster ways into the studio. */
.hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:25px}.hero-action{border:1px solid #7b617a;background:#ffffff0a;color:#f7edf1;border-radius:10px;padding:11px 15px;font-size:12px;font-weight:800}.hero-action:hover{background:#ffffff18;transform:translateY(-1px)}.hero-action.primary-action{background:#e6aaa4;border-color:#e6aaa4;color:#29202c;box-shadow:0 5px 0 #a76c7540}.collection-progress{height:7px;border-radius:999px;background:#2d2f3a;overflow:hidden;margin:-5px 0 21px;box-shadow:inset 0 1px #0004}.collection-progress span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#e5aaa3,#e8c0a9,#d6a7cf);transition:width .3s ease}.art-state{position:absolute;top:9px;right:9px;border-radius:999px;padding:5px 8px;font-size:9px;font-weight:800;letter-spacing:.04em}.art-state.is-new{background:#171923dc;color:#e7d8db;border:1px solid #ffffff23}.art-state.is-started{background:#e6aaa4;color:#29202c}.art-card.started{border-color:#a96f77}.art-card.started .art-cover:after{content:'';position:absolute;inset:auto 0 0;height:30%;background:linear-gradient(transparent,#1d202ab8);pointer-events:none}@media(max-width:680px){.hero-actions{margin-top:20px}.hero-action{flex:1;padding:10px 9px;font-size:11px}.collection-progress{margin:-4px 0 17px}.art-state{top:6px;right:6px;padding:4px 6px;font-size:8px}}@media(prefers-reduced-motion:reduce){.collection-progress span,.hero-action{transition:none}}

/* V9: each artwork has a visible, locally saved coloring milestone. */
.art-title .art-progress{color:#e7b3a9;font-size:10px;letter-spacing:.04em;font-weight:800}.art-coverage{display:block;margin-top:6px;color:#d9a3a2;font-size:10px;font-weight:800}.art-card.started .art-info{padding-bottom:12px}@media(max-width:680px){.art-title .art-progress{font-size:9px}.art-coverage{font-size:9px;margin-top:4px}}

/* V10: custom vector icon system for the atelier controls. */
.ui-icon{display:inline-block;width:18px;height:18px;flex:0 0 auto;vertical-align:middle;fill:none;stroke:currentColor}.brand-icon .ui-icon{width:25px;height:25px}.ghost,.hero-action,.toolbar-actions button,.panel-btn,.mobile-toolbar button{display:inline-flex;align-items:center;justify-content:center;gap:7px}.tool{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}.tool .ui-icon{width:20px;height:20px}.tool>span{display:block;margin:0;font-size:12px;line-height:1.1}.panel-btn{justify-content:flex-start}.panel-btn .ui-icon{width:16px;height:16px}.hero-action .ui-icon{width:16px;height:16px}.mobile-toolbar button{flex-direction:column;gap:4px}.mobile-toolbar .ui-icon{width:17px;height:17px}.mobile-toolbar button span{font-size:10px;line-height:1}.toolbar-actions button .ui-icon{width:17px;height:17px}.toolbar-actions button.primary .ui-icon{width:18px;height:18px}@media(max-width:1000px){.toolbar-actions button .ui-icon{width:18px;height:18px}}@media(max-width:680px){.ghost .ui-icon{width:16px;height:16px}.ghost span{font-size:11px}.mobile-toolbar button span{font-size:9px}.tool>span{font-size:11px}}@media(prefers-reduced-motion:reduce){.ui-icon{transition:none}}

/* V11: measurable studio goals and an artwork completion moment. */
.studio-hud{display:flex;align-items:baseline;gap:7px;margin-left:auto;padding:6px 10px;border:1px solid #464253;border-radius:9px;background:#242631;color:#d8d0dc;white-space:nowrap}.studio-hud-label{font-size:9px;letter-spacing:.11em;color:#caa4ab;font-weight:800}.studio-hud strong{font-size:12px;color:#f5e7ea}.atelier-mission{position:absolute;z-index:3;top:18px;left:18px;width:210px;padding:14px;border:1px solid #51475a;background:#191b27ed;backdrop-filter:blur(10px);border-radius:13px;box-shadow:0 10px 26px #0005;pointer-events:none}.mission-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#e7b1a8;font-size:10px;font-weight:900;letter-spacing:.09em}.mission-heading strong{font-size:12px;color:#fff0f0}.atelier-mission p{margin:7px 0 10px;color:#aaa5b1;font-size:11px;line-height:1.35}.mission-list{display:grid;gap:7px;margin:0;padding:0;list-style:none}.mission-list li{display:flex;align-items:center;gap:7px;color:#c8c1cd;font-size:11px;transition:color .2s}.mission-list i{display:grid;place-items:center;width:15px;height:15px;border:1px solid #746c7c;border-radius:50%;font-style:normal}.mission-list li.done{color:#f4dedc}.mission-list li.done i{border-color:#e6aaa4;background:#e6aaa4}.mission-list li.done i:after{content:'✓';color:#2c2430;font-size:11px;font-weight:900}.mission-meter{height:4px;margin-top:12px;border-radius:999px;background:#34333e;overflow:hidden}.mission-meter span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#dfa3a1,#ebd0a5);transition:width .35s ease}.completion-screen{position:fixed;z-index:50;inset:0;display:grid;place-items:center;padding:20px;background:#11131bd9;backdrop-filter:blur(8px)}.completion-card{width:min(100%,420px);padding:38px 30px 30px;border:1px solid #725b70;border-radius:24px;text-align:center;background:radial-gradient(circle at 50% 0,#4a394b,#252230 68%);box-shadow:0 28px 80px #000a;animation:completion-pop .45s cubic-bezier(.2,.8,.2,1)}.completion-mark{width:58px;height:58px;padding:14px;color:#2a2330;background:#edbeb5;border-radius:18px;stroke-width:1.6}.completion-card h2{margin:12px 0 8px;font-family:Georgia,serif;font-size:31px;line-height:1.08}.completion-card p{margin:0;color:#c8bdca;font-size:13px}.completion-actions{display:flex;gap:9px;justify-content:center;margin-top:24px}.completion-actions .hero-action{flex:1}.completion-screen.hidden{display:none}@keyframes completion-pop{from{opacity:0;transform:translateY(16px) scale(.94)}to{opacity:1;transform:none}}@media(max-width:1100px){.atelier-mission{width:184px;padding:11px;top:12px;left:12px}.atelier-mission p{display:none}.mission-list{gap:5px}.mission-list li{font-size:10px}.mission-meter{margin-top:9px}}@media(max-width:790px){.studio-hud{display:none}.atelier-mission{top:9px;left:9px;width:auto;padding:8px 10px}.mission-heading{font-size:8px}.mission-heading strong{font-size:10px}.mission-list,.atelier-mission p,.mission-meter{display:none}.completion-card{padding:30px 20px 20px}.completion-card h2{font-size:27px}.completion-actions{flex-direction:column}.completion-actions .hero-action{width:100%}}@media(prefers-reduced-motion:reduce){.mission-list li,.mission-meter{transition:none}.completion-card{animation:none}}

/* V12: BerfinidaGames shared game shell. */
#app.shell{min-height:100dvh;display:flex;flex-direction:column}.topbar.game-top{height:64px;min-height:64px;padding:0 clamp(14px,4vw,56px);display:grid;grid-template-columns:1fr auto 1fr;background:#171923;border-bottom:1px solid #323440}.game-top .back,.game-top .game-nav{display:inline-flex;align-items:center;gap:7px;width:max-content;border:0;background:transparent;color:#e9e4ed;padding:8px 0;font-size:12px;font-weight:750;text-decoration:none}.game-top .back:hover,.game-top .game-nav:hover{color:#edb5ae}.game-top .back .ui-icon{width:16px;height:16px}.game-top .game-nav{justify-self:end;border:1px solid #555160;border-radius:8px;padding:8px 11px}.game-top .game-name{text-transform:uppercase;letter-spacing:.16em;font-size:12px;font-weight:900;color:#f7edf1}.gallery-screen{flex:1}.game-brief{padding:clamp(28px,4vw,52px);border-radius:17px;background:linear-gradient(120deg,#302936,#22242e 72%)}.game-brief:after{display:none}.game-brief h1{font-size:clamp(34px,4.5vw,58px);margin:11px 0}.game-brief p{max-width:515px}.game-brief .hero-pills{margin-top:22px}.game-brief .hero-actions{margin-top:18px}.pause-dialog{border:0;padding:0;background:transparent;color:#f5edf2}.pause-dialog::backdrop{background:#10121cd9;backdrop-filter:blur(7px)}.pause-card{width:min(calc(100vw - 32px),385px);padding:31px 28px 28px;border:1px solid #70586d;border-radius:22px;text-align:center;background:radial-gradient(circle at 50% 0,#4b394d,#252230 67%);box-shadow:0 28px 80px #000b}.pause-card img{display:block;width:138px;height:150px;object-fit:contain;object-position:center bottom;margin:12px auto 5px}.pause-card h2{font-family:Georgia,serif;font-size:28px;margin:7px 0}.pause-card p{color:#c7bdca;font-size:13px;margin:0 0 20px}.pause-card .hero-action{width:100%}.shell>footer{margin-top:auto;padding:19px 15px;color:#a5a0ae;font-size:11px;letter-spacing:.06em}@media(max-width:680px){.topbar.game-top{height:58px;min-height:58px;padding:0 13px}.game-top .back span,.game-top .game-nav span{display:none}.game-top .back{padding:7px}.game-top .game-nav{padding:7px}.game-top .game-name{font-size:10px}.game-brief{padding:29px 22px}.game-brief .hero-pills{display:none}.pause-card{padding:27px 20px 20px}.pause-card img{width:123px;height:135px}.pause-card h2{font-size:25px}}
