.co{max-width:1320px;margin:0 auto;padding:0 clamp(16px,3vw,40px)}.co__head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:10px 32px;display:flex}.co__intro{flex-direction:column;gap:8px;max-width:720px;display:flex}.co__h1{font:400 clamp(34px, 4.4vw, 56px)/1.04 var(--display);margin:0}.co__intro p{color:var(--body);text-wrap:pretty;margin:0;font-size:17px;line-height:1.55}.co__title{color:var(--muted);font-size:15px;font-weight:800}.co__main{flex-wrap:wrap;align-items:flex-start;gap:20px;margin-top:20px;display:flex}.co__left{flex-direction:column;flex:999 520px;gap:12px;min-width:0;display:flex}.co__bar{border:2px solid var(--line);background:#fff;border-radius:18px;flex-wrap:wrap;align-items:center;gap:8px;padding:8px;display:flex}.co__seg{background:var(--chip);border-radius:12px;gap:4px;padding:4px;display:flex}.co__seg button{cursor:pointer;font:800 14px var(--text);color:var(--sub);background:0 0;border:none;border-radius:9px;padding:8px 14px}.co__seg button[aria-pressed=true]{color:var(--ink);background:#fff;box-shadow:0 1px 3px #1b1a172e}.co__gap{flex:1}.co__btn{border:2px solid var(--field);font:800 14px var(--text);color:var(--ink);cursor:pointer;background:#fff;border-radius:12px;padding:10px 14px}.co__btn:hover{border-color:var(--ink)}.co__btn:disabled{opacity:.45;cursor:default}.co__btn:disabled:hover{border-color:var(--field)}.co__btn--ink{border-color:var(--ink)}.co__btn--ink:hover{background:var(--cream-hover)}.co__btn--share{background:var(--yellow)}.co__btn--share:hover{background:#ffd24d}.co__btn--go{border-color:var(--ink);background:var(--orange);color:#fff;padding:10px 16px;font-size:15px}.co__btn--go:hover{background:var(--orange-hover)}.co__strip{gap:8px;padding:4px 4px 8px;display:flex;overflow-x:auto}.co__colors{display:none}@media (width>=900px){.co__strip{display:none}.co__colors{display:flex}}.co__dot,.co__swatch{cursor:pointer;border:none;border-radius:50%;padding:0;box-shadow:inset 0 0 0 1.5px #1b1a1733}.co__dot{flex:none;width:44px;height:44px}.co__swatch{aspect-ratio:1;width:100%;transition:transform .12s}.co__swatch:hover{transform:scale(1.08)}.co__dot[aria-checked=true],.co__swatch[aria-checked=true]{box-shadow:0 0 0 3px #fff, 0 0 0 5px var(--ink)}.co__mat{background:var(--chip);border-radius:28px;justify-content:center;padding:clamp(14px,2.4vw,28px);display:flex;position:relative}.co__sheet{background:#fff;border-radius:6px;width:min(100%,600px);position:relative;overflow:hidden;box-shadow:0 26px 54px #1b1a1729}.co__canvas{aspect-ratio:2/3;touch-action:manipulation;cursor:crosshair;width:100%;height:auto;display:block}.co__loading{text-align:center;font:400 24px var(--display);color:#8a847a;background:#fff;justify-content:center;align-items:center;padding:20px;display:flex;position:absolute;inset:0}.co__side{flex-direction:column;flex:300px;gap:16px;min-width:0;max-width:420px;display:flex}.co__colors{border:2.5px solid var(--ink);box-shadow:0 6px 0 var(--ink);background:#fff;border-radius:24px;flex-direction:column;gap:12px;padding:16px}.co__colors-head{justify-content:space-between;align-items:center;gap:10px;display:flex}.co__side h2{margin:0;font-size:17px;font-weight:800}.co__now{color:var(--muted);align-items:center;gap:8px;font-size:14px;font-weight:800;display:flex}.co__now span{border:2px solid var(--ink);border-radius:50%;width:26px;height:26px}.co__grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;display:grid}.co__pick{border:2px solid var(--line);background:#fff;border-radius:24px;flex-direction:column;gap:12px;padding:16px;display:flex}.co__pages{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;display:grid}.co__page{aspect-ratio:210/297;cursor:pointer;box-shadow:0 0 0 1px var(--edge);background:#fff;border:none;border-radius:6px;justify-content:center;align-items:center;padding:0;display:flex;position:relative;overflow:hidden}.co__page img{object-fit:contain;width:86%;height:86%}.co__page[aria-current]{box-shadow:0 0 0 3px var(--ink)}.co__dot-mark{background:var(--yellow);width:11px;height:11px;box-shadow:0 0 0 2px var(--ink);border-radius:50%;position:absolute;top:5px;right:5px}.co__note{color:var(--muted);margin:-4px 0 0;font-size:14px;line-height:1.45}.co__confirm{background:var(--cream);border-radius:16px;flex-direction:column;gap:10px;padding:12px 14px;display:flex}.co__confirm>span{font-size:15px;font-weight:700;line-height:1.5}.co__confirm>div{flex-wrap:wrap;gap:8px;display:flex}.co__confirm button{border:2px solid var(--ink);font:800 14px var(--text);color:var(--ink);cursor:pointer;background:#fff;border-radius:12px;padding:9px 14px}.co__confirm button.dark{background:var(--ink);color:#fff}.co__make{background:var(--cream);border-radius:20px;align-items:center;gap:12px;padding:14px 16px;display:flex}.co__make:hover{color:var(--ink);background:#ffe69a}.co__make>span:last-child{flex-direction:column;gap:2px;display:flex}.co__make b{font-size:16px}.co__make span span{color:var(--sub);font-size:14px}.co__star{background:var(--ink);width:36px;height:36px;color:var(--yellow);border-radius:50%;flex:none;justify-content:center;align-items:center;font-weight:900;display:flex}.color-top[data-astro-cid-kw4v4f74]{padding-top:clamp(18px,2.6vw,28px)}