@import "https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&family=Permanent+Marker&display=swap";*{box-sizing:border-box}:root{--ink:#2b1c10;--line:#4a2f18;--kraft:#c69a63;--kraft-dark:#a67c46;--kraft-light:#e7c99a;--panel:#eddcb8;--tape:#e9dbb4bf}html{overflow-x:hidden}body{color:var(--ink);background:repeating-linear-gradient(135deg, #0000000d 0px, #0000000d 2px, transparent 2px, transparent 10px), var(--kraft);min-height:100vh;margin:0;font-family:Poppins,system-ui,sans-serif;overflow-x:hidden}.app{max-width:1100px;margin:0 auto;padding:24px 16px 60px}.app-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:28px;display:flex}.app-header h1{letter-spacing:1px;color:var(--ink);margin:0;font-family:Permanent Marker,cursive;font-size:46px;font-weight:400;transform:rotate(-2deg)}.app-header p{color:#5a3d22;margin:4px 0 0;font-size:13px;font-weight:600}.layout{flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:24px;display:flex}.canvas-wrap{background:var(--panel);border:4px solid var(--line);max-width:100%;box-shadow:8px 8px 0 var(--line);flex-shrink:0;padding:0;position:relative}.canvas-wrap:before{content:"";background:repeating-linear-gradient(45deg, var(--kraft-light), var(--kraft-light) 10px, var(--line) 10px, var(--line) 12px);border-bottom:3px solid var(--line);height:22px;display:block}.canvas-wrap:after{content:"";background:var(--tape);border:1px dashed #4a2f1866;width:120px;height:34px;position:absolute;top:-14px;left:50%;transform:translate(-50%)rotate(-3deg)}.canvas-stage{margin:12px auto;position:relative}.canvas-stage canvas{display:block}.canvas-loading{background:var(--kraft-light);color:#6b4a28;z-index:1;justify-content:center;align-items:center;font-size:13px;font-weight:600;display:flex;position:absolute;inset:0}.delete-button{color:#fff;border:3px solid var(--line);text-transform:uppercase;cursor:pointer;box-shadow:3px 3px 0 var(--line);z-index:5;background:#d9433f;padding:8px 12px;font-size:12px;font-weight:700;position:absolute;top:-16px;right:-16px}.side-column{flex-direction:column;flex-shrink:0;gap:18px;width:320px;display:flex}.controls{flex-direction:column;gap:18px;display:flex}.win-window{background:var(--panel);border:3px solid var(--line);box-shadow:5px 5px 0 var(--line);position:relative}.win-window:before{content:"";background:var(--tape);z-index:2;border:1px dashed #4a2f1866;width:56px;height:20px;position:absolute;top:-10px;left:16px;transform:rotate(-4deg)}.win-bar{border-bottom:3px solid var(--line);text-transform:lowercase;color:var(--ink);justify-content:space-between;align-items:center;padding:6px 10px;font-size:13px;font-weight:700;display:flex}.win-buttons{gap:5px;display:flex}.win-btn{background:var(--kraft-light);border:2px solid var(--line);justify-content:center;align-items:center;width:16px;height:16px;font-size:9px;line-height:1;display:flex}.win-body{background:repeating-linear-gradient(0deg,#4a2f180a 0 2px,#0000 2px 6px);padding:12px}.win-body.center{text-align:center}.sub-tabs{border-bottom:3px solid var(--line);display:flex}.sub-tab{border:none;border-right:2px solid var(--line);background:var(--kraft-dark);color:#fff2df;cursor:pointer;flex:1;padding:6px 4px;font-family:inherit;font-size:11px;font-weight:700}.sub-tab:last-child{border-right:none}.sub-tab.active{background:var(--panel);color:var(--ink)}.row-scroll{gap:8px;padding-bottom:4px;display:flex;overflow-x:auto}.thumb{border:3px solid var(--line);background:var(--kraft-light);cursor:pointer;flex-shrink:0;width:72px;height:72px;padding:6px;overflow:hidden}.thumb img{object-fit:cover;width:100%;height:100%;display:block}.thumb.active{border-color:#2ecc71}.pick-color{border:3px solid var(--line);background:var(--kraft-light);flex-direction:column;justify-content:center;align-items:center;gap:2px;font-size:11px;font-style:italic;font-weight:700;display:flex}.pick-color input[type=color]{cursor:pointer;background:0 0;border:none;width:40px;height:24px;padding:0}.hint{color:#6b4a28;margin:8px 0 0;font-size:11px}input[type=text]{border:3px solid var(--line);background:var(--kraft-light);width:100%;color:var(--ink);padding:10px;font-family:inherit;font-size:14px}.side-row{justify-content:center;align-items:center;gap:12px;display:flex}.folder-upload{cursor:pointer;color:var(--ink);background:0 0;border:none;flex-direction:column;align-items:center;gap:4px;padding:0;font-family:inherit;font-size:12px;font-weight:700;display:flex}.folder-upload input[type=file]{display:none}.folder-icon{font-size:40px}.btn-flat{border:3px solid var(--line);background:var(--kraft-light);cursor:pointer;box-shadow:3px 3px 0 var(--line);padding:6px 10px;font-size:11px;font-weight:700}.btn-flat.full{text-align:center;width:100%;margin-top:8px}.layer-list{flex-direction:column;gap:6px;max-height:220px;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.layer-row{border:2px solid var(--line);background:var(--kraft-light);cursor:pointer;flex-direction:column;gap:6px;padding:6px 8px;font-size:12px;transition:background .12s,transform 80ms;display:flex}.layer-row:hover{transform:translate(2px)}.layer-row.active{background:#d7ffe0;border-color:#2ecc71}.layer-row.dimmed{opacity:.5}.layer-row-top{align-items:center;gap:6px;display:flex}.layer-icon{font-size:14px}.layer-name{text-overflow:ellipsis;white-space:nowrap;flex:1;font-weight:600;overflow:hidden}.icon-toggle{cursor:pointer;opacity:.55;background:0 0;border:none;padding:2px;font-size:13px;line-height:1}.icon-toggle.off,.icon-toggle.on{opacity:1}.layer-actions{gap:3px;padding-left:20px;display:flex}.layer-actions button{border:2px solid var(--line);cursor:pointer;background:#fff;width:24px;height:22px;padding:0;font-size:10px;transition:background .12s}.layer-actions button:hover:not(:disabled){background:var(--kraft-light)}.layer-actions button:disabled{opacity:.3;cursor:default}.layer-del{color:#b03a3a}.btn-flat.danger{color:#b03a3a;border-color:#b03a3a;margin-top:14px}.layer-settings{border-top:2px dashed var(--line);flex-direction:column;gap:6px;margin-top:12px;padding-top:12px;display:flex}.setting-label{text-transform:uppercase;color:#6b4a28;margin-top:4px;font-size:11px;font-weight:700}.layer-settings input[type=range]{accent-color:#2ecc71;width:100%}.color-swatch{border:3px solid var(--line);cursor:pointer;background:0 0;width:100%;height:30px;padding:0}.download-window{background:var(--kraft-light)}.download-q{margin:4px 0 12px;font-weight:700}.btn-yesno{border:3px solid var(--line);background:var(--panel);cursor:pointer;box-shadow:3px 3px 0 var(--line);padding:8px 22px;font-weight:700}.btn-yesno.yes{background:#baffc9}.row-scroll::-webkit-scrollbar{width:8px;height:8px}.layer-list::-webkit-scrollbar{width:8px;height:8px}.row-scroll::-webkit-scrollbar-track{background:var(--kraft-light)}.layer-list::-webkit-scrollbar-track{background:var(--kraft-light)}.row-scroll::-webkit-scrollbar-thumb{background:var(--kraft-dark);border:1px solid var(--line)}.layer-list::-webkit-scrollbar-thumb{background:var(--kraft-dark);border:1px solid var(--line)}.thumb,.control-item,.win-btn,.btn-flat,.btn-yesno,.icon-toggle,.layer-actions button{transition:transform .1s,box-shadow .1s}.thumb:hover{transform:translateY(-2px)}.btn-flat:hover,.btn-yesno:hover{box-shadow:4px 4px 0 var(--line);transform:translate(-1px,-1px)}.folder-upload:hover .folder-icon{transform:scale(1.08)rotate(-3deg)}.folder-icon{transition:transform .15s;display:inline-block}@media (width<=1040px){.layout{justify-content:center}}@media (width<=720px){.app-header{text-align:center;justify-content:center}.app-header h1{font-size:32px}.side-column{width:100%;max-width:420px}.sub-tab{padding:6px 2px;font-size:10px}}