body {
            margin: 0;
            padding: 0;
            background: radial-gradient(circle at 50% 35%, #2e2a27 0%, #161412 65%, #0a0908 100%);
            font-family: 'Noto Serif SC', 'Georgia', serif;
            color: #e6dfd5;
            min-height: 100vh;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            align-items: center;
            overflow-x: hidden;
            user-select: none;
        }

        /* 博物馆顶部环境聚光灯效果 */
        .spotlight {
            position: fixed;
            top: -20%;
            left: 50%;
            transform: translateX(-50%);
            width: 90vw;
            height: 90vh;
            background: radial-gradient(ellipse at top, rgba(255, 232, 185, 0.12) 0%, rgba(255, 210, 140, 0.03) 45%, transparent 75%);
            pointer-events: none;
            z-index: 1;
        }

        /* 古典巴洛克鎏金木质画框设计 */
        .museum-frame {
            position: relative;
            padding: 22px;
            background: linear-gradient(135deg, #523a22 0%, #2c1d0e 35%, #3f2b17 50%, #1e1308 85%, #3a2613 100%);
            border: 10px solid #26170a;
            border-radius: 6px;
            box-shadow: 
                0 35px 85px rgba(0, 0, 0, 0.95),
                0 10px 25px rgba(0, 0, 0, 0.8),
                inset 0 0 28px rgba(0, 0, 0, 0.9),
                inset 0 0 4px rgba(255, 215, 100, 0.45);
            transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.35s ease;
            z-index: 10;
        }

        @media (min-width: 768px) {
            .museum-frame {
                padding: 30px;
                border-width: 14px;
            }
        }

        /* 画框立体装饰内边线 */
        .museum-frame::before {
            content: '';
            position: absolute;
            inset: 6px;
            border: 2px solid rgba(212, 175, 55, 0.32);
            border-radius: 2px;
            pointer-events: none;
            box-shadow: inset 0 0 10px rgba(0,0,0,0.7);
        }

        /* 亚麻内衬与金色内卡纸 */
        .linen-mat {
            padding: 10px;
            background: #1b1713;
            border: 2px solid #997a3d;
            box-shadow: 
                inset 0 0 18px rgba(0, 0, 0, 0.95),
                0 0 3px rgba(212, 175, 55, 0.3);
            position: relative;
        }

        @media (min-width: 768px) {
            .linen-mat {
                padding: 14px;
            }
        }

        canvas {
            display: block;
            box-shadow: 0 0 15px rgba(0, 0, 0, 0.95);
            width: 100%;
            max-width: 880px;
            height: auto;
            aspect-ratio: 3 / 2;
            cursor: crosshair;
            border-radius: 1px;
        }

        /* 博物馆黄铜拉丝铭牌 */
        .brass-plaque {
            background: linear-gradient(90deg, #7c5f2a 0%, #c8a248 22%, #f1d785 50%, #c8a248 78%, #7c5f2a 100%);
            color: #1c1305;
            box-shadow: 
                0 6px 18px rgba(0, 0, 0, 0.75),
                inset 0 1px 1px rgba(255, 255, 240, 0.65),
                inset 0 -1px 2px rgba(60, 40, 10, 0.7);
            border: 1px solid #594116;
            position: relative;
        }

        /* 铭牌柳钉细节 */
        .brass-plaque::before,
        .brass-plaque::after {
            content: '';
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            width: 5px;
            height: 5px;
            border-radius: 50%;
            background: radial-gradient(circle at 30% 30%, #fff2b2, #5a4214);
            box-shadow: 0 1px 2px rgba(0,0,0,0.6);
        }
        .brass-plaque::before { left: 10px; }
        .brass-plaque::after { right: 10px; }

        /* 艺术控制栏按钮样式 */
        .art-btn {
            background: rgba(34, 30, 26, 0.85);
            border: 1px solid rgba(180, 148, 90, 0.35);
            color: #dfd5c6;
            transition: all 0.25s ease;
            backdrop-filter: blur(8px);
        }

        .art-btn:hover {
            border-color: rgba(230, 195, 115, 0.85);
            background: rgba(58, 49, 38, 0.92);
            color: #fff8eb;
            transform: translateY(-1px);
            box-shadow: 0 6px 16px rgba(0, 0, 0, 0.45);
        }

        .art-btn:active {
            transform: translateY(0);
        }

        .art-btn.active {
            background: linear-gradient(135deg, #b88e3d 0%, #87631f 100%);
            border-color: #f3d88c;
            color: #161005;
            font-weight: 700;
            box-shadow: 0 0 18px rgba(212, 175, 55, 0.4);
        }

        /* 画笔绘制中提示层 */
        .painting-badge {
            pointer-events: none;
            transition: opacity 0.3s ease;
        }

*{box-sizing:border-box}a{color:inherit;text-decoration:none}button{font:inherit}button,a,canvas{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid #ead08b;outline-offset:5px}body{padding:0 24px;font-family:Georgia,"Songti SC","Noto Serif CJK SC","SimSun",serif}.art-header{position:relative;z-index:2;width:min(1120px,100%);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;padding:28px 0 24px;border-bottom:1px solid #b69b5f29}.art-back,.art-home{font-family:system-ui,sans-serif;font-size:12px;color:#b5a590;letter-spacing:1px;min-height:44px;display:flex;align-items:center}.art-home{justify-self:end}.art-back:hover,.art-home:hover{color:#f2d695}.art-heading{text-align:center}.art-kicker{display:block;color:#ac9261;font:9px/1.5 system-ui,sans-serif;letter-spacing:3px}.art-heading h1{font-size:24px;font-weight:400;letter-spacing:6px;margin:9px 0 0}.art-stage{position:relative;z-index:2;width:min(960px,100%);padding:32px 0 10px;display:flex;flex-direction:column;align-items:center}.museum-frame{width:100%;padding:22px;border-width:10px}.linen-mat{padding:10px}canvas{max-width:none}.brass-plaque{margin-top:26px;padding:12px 30px;text-align:center;font-size:12px;letter-spacing:2px;border-radius:2px}.art-hint{color:#a89b89;font:12px/1.8 system-ui,sans-serif;text-align:center;margin:22px 0 8px}.art-footer{position:relative;z-index:2;width:min(1120px,100%);margin:12px 0 0;padding:24px 0 16px;border-top:1px solid #b69b5f29;font-family:system-ui,sans-serif}.art-controls{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 22px}.art-palettes,.art-actions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.art-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:11px 15px;font-size:12px;line-height:1.5;border-radius:5px;cursor:pointer;white-space:nowrap}.art-btn:disabled{opacity:.5;cursor:wait}.art-btn i{width:12px;height:12px;border-radius:50%;border:1px solid #ffffff55}.palette-sunset{background:linear-gradient(135deg,#e5ae44,#8e332b)}.palette-starry{background:linear-gradient(135deg,#edcc60,#245399)}.palette-monet{background:linear-gradient(135deg,#eb9cc6,#75cbb8)}.art-save{background:#b69656;color:#18130c;border-color:#ddbd79}.art-result{min-height:20px;margin:18px 0 14px;text-align:center;color:#bdb09d;font-size:12px;line-height:1.8}.art-footer-meta{display:flex;justify-content:space-between;gap:12px;color:#766e62;font-size:9px;letter-spacing:2px}.painting-badge{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:8px;max-width:95%;width:max-content;padding:9px 14px;border-radius:30px;background:#17130bea;border:1px solid #c5a56255;color:#efd7a9;font:11px/1.5 system-ui,sans-serif}.painting-badge i{width:5px;height:5px;border-radius:50%;background:#dfbf79}.opacity-0{opacity:0}
@media(min-width:1000px){.art-stage{width:840px}.museum-frame{padding:22px;border-width:12px}}
@media(max-width:600px){body{padding:0 14px}.art-header{grid-template-columns:1fr auto;gap:8px;padding:12px 0 18px}.art-heading{grid-column:1/-1;grid-row:2;margin-top:7px}.art-heading h1{font-size:23px;letter-spacing:4px}.art-kicker{font-size:8px;letter-spacing:2px}.art-back,.art-home{font-size:11px}.art-stage{padding-top:26px}.museum-frame{padding:8px;border-width:6px}.museum-frame::before{inset:2px;border-width:1px}.linen-mat{padding:5px;border-width:1px}.brass-plaque{font-size:10px;letter-spacing:1px;padding:11px 22px;margin-top:22px}.art-hint{font-size:11px;max-width:280px;margin-top:18px}.art-footer{margin-top:15px;padding-top:20px}.art-controls{gap:14px}.art-palettes,.art-actions{gap:6px}.art-palettes{width:100%}.art-palettes .art-btn{flex:1;padding:10px 6px;font-size:11px;gap:5px}.art-actions{width:100%}.art-actions .art-btn:first-child{width:100%}.art-actions .art-btn:not(:first-child){flex:1}.art-footer-meta{font-size:8px;letter-spacing:1px}.painting-badge{bottom:12px;font-size:10px;padding:7px 9px}.art-result{font-size:11px;min-height:40px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important}}