:root{--ink:#284552;--cream:#fff8e9;--teal:#377a83}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;font-family:ui-rounded,'Trebuchet MS',system-ui,sans-serif;color:var(--ink);background:#eee5d6}body{height:100dvh;overflow:hidden;display:grid;grid-template-rows:auto minmax(0,1fr) auto}button,a{font:inherit;touch-action:manipulation}button{cursor:pointer}button:disabled{opacity:.38;cursor:default}button:focus-visible,a:focus-visible{outline:3px solid #d39b47;outline-offset:3px}[hidden]{display:none!important}.color-header{display:flex;align-items:center;gap:12px;padding:max(10px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) 10px max(14px,env(safe-area-inset-left));background:var(--cream);border-bottom:1px solid #ded7c7}.color-header h1{font-size:18px;margin:0;line-height:1.3}.color-header p{font-size:11px;letter-spacing:.05em;margin:3px 0 0;color:#668088}.color-header .heading{flex:1;min-width:0}.square{width:48px;min-width:48px;min-height:48px;display:grid;place-items:center;border:0;border-radius:14px;background:#e8eee6;color:var(--ink);font-size:24px;text-decoration:none}.square.light{background:#f4eddd}#paper{position:relative;display:flex;align-items:center;justify-content:center;min-height:0;min-width:0;padding:10px 16px;background:radial-gradient(ellipse at center,#f8f1e2,#e5d8c4)}#drawing{display:block;touch-action:none;background:#fff;box-shadow:0 8px 30px #463b2528;cursor:crosshair;max-width:100%;max-height:100%}.color-tools{padding:10px max(12px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap;background:var(--cream);border-top:1px solid #ded7c7}.color-tools button{position:relative;min-width:48px;min-height:48px;display:flex;align-items:center;justify-content:center;gap:8px;padding:8px 12px;border:0;border-radius:13px;background:#e8eee6;color:var(--ink);font-weight:700;font-size:13px}.color-tools button.active{background:#ead092;box-shadow:inset 0 0 0 2px #ba964e}.color-tools .icon{font-size:23px;line-height:1}#colorSample{width:24px;height:24px;border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 1px #9caaa8}#download{background:#295461;color:#fff8e9}.loading{position:absolute;inset:0;z-index:5;background:#eee5d6;display:grid;place-content:center;text-align:center;padding:24px;color:var(--ink)}.loading button{min-height:48px;border:0;border-radius:13px;background:#fff8e9;padding:10px 20px}.loading span{font-size:42px}#status{position:absolute;left:50%;top:10px;transform:translateX(-50%);max-width:85%;margin:0;padding:8px 14px;border-radius:14px;background:#fff8e9ed;box-shadow:0 3px 16px #28455215;font-size:12px;line-height:1.4;pointer-events:none}#status:empty{display:none}dialog{border:1px solid #e0d3b8;border-radius:23px;background:#fff8e9;padding:24px;width:min(600px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto;color:var(--ink);box-shadow:0 12px 60px #25415340}dialog::backdrop{background:#25415380;backdrop-filter:blur(4px)}dialog h2{margin:0 48px 16px 0;font-size:24px;line-height:1.25}dialog p{font-size:14px;line-height:1.65}dialog button{min-height:48px;border:0;border-radius:13px;padding:10px 16px;background:#e8eee6;color:var(--ink)}dialog .close{position:absolute;top:10px;right:10px;width:48px;padding:0;background:transparent;font-size:26px}#swatches{display:grid;grid-template-columns:repeat(6,minmax(48px,1fr));gap:9px}#swatches button{height:54px;border:3px solid #fff;box-shadow:0 2px 7px #28455220;position:relative}#swatches button.selected:after{content:'✓';font-size:25px;color:#284552}#sizeOptions{display:flex;gap:12px}#sizeOptions button{flex:1}#sizeOptions i{display:block;border-radius:50%;background:#377a83;margin:auto}.menu-actions{display:grid;gap:9px}.menu-actions button{text-align:left;background:#fff;border:1px solid #e5dbc6}.sheets{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.sheets a{display:block;padding:9px;border:1px solid #ddd4c3;border-radius:15px;text-decoration:none;background:white;color:var(--ink);font-size:13px;font-weight:700}.sheets img{width:100%;height:110px;object-fit:contain;display:block;margin-bottom:8px}.danger-actions{display:flex;gap:10px;flex-wrap:wrap}.keyboard-note{color:#668088;font-size:12px}#printSheet{display:none}@media(max-width:900px){.color-tools .label{display:none}.color-tools button{width:48px;padding:0}.color-tools{gap:6px}.color-header h1{font-size:15px}.color-header p{font-size:10px}.color-header{gap:9px}.sheets img{height:85px}}@media(max-width:500px){.color-tools{padding-top:8px;padding-bottom:8px;gap:6px;max-height:124px}#swatches{grid-template-columns:repeat(4,minmax(48px,1fr))}.color-header{padding:8px 10px}.color-header p{display:none}#paper{padding:8px}.sheets{gap:9px}}@media print{@page{size:A4 landscape;margin:10mm}html,body{display:block;background:white;height:auto;overflow:visible}.color-header,#paper,.color-tools,dialog{display:none!important}#printSheet{display:block;width:100%;height:180mm;object-fit:contain;break-inside:avoid}}