:root{--ink:#31443f;--muted:#71827d;--mint:#76c9b5;--mint-dark:#3e9f89;--mint-pale:#e7f7f2;--pink:#f39aab;--pink-pale:#fff0f3;--sun:#f5c968;--cream:#fffaf2;--paper:#fff;--line:#dce9e4;--shadow:0 18px 50px rgba(49,82,72,.12);--radius:24px;--radius-sm:14px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:linear-gradient(150deg,#fbfffd 0%,#fff9f5 55%,#f6fbff 100%);font-family:Inter,"PingFang SC","Microsoft YaHei",system-ui,sans-serif;min-height:100vh;line-height:1.6}.ambient{position:fixed;border-radius:50%;filter:blur(2px);opacity:.5;z-index:-1}.ambient-one{width:340px;height:340px;background:#d9f4eb;right:-120px;top:120px}.ambient-two{width:260px;height:260px;background:#ffe2e8;left:-90px;bottom:5vh}.site-header{width:min(1180px,calc(100% - 32px));height:78px;margin:18px auto 0;padding:0 18px 0 22px;background:rgba(255,255,255,.88);backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.8);box-shadow:0 10px 30px rgba(64,91,81,.09);border-radius:22px;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:50}.brand{display:flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none}.brand-mark{width:42px;height:42px;border-radius:13px;background:var(--mint-pale);display:grid;grid-template-columns:repeat(2,9px);gap:3px;place-content:center;transform:rotate(-4deg)}.brand-mark i{width:9px;height:9px;border-radius:50%;background:var(--mint)}.brand-mark i:nth-child(2){background:var(--pink)}.brand-mark i:nth-child(3){background:var(--sun)}.brand b{display:block;font-size:20px;letter-spacing:.08em}.brand small{display:block;color:var(--muted);font-size:8px;letter-spacing:.19em}.site-nav{display:flex;align-items:center;gap:7px}.site-nav>a,.nav-logout{color:#52645f;text-decoration:none;border:0;background:none;padding:10px 13px;border-radius:12px;font:inherit;font-size:14px;cursor:pointer}.site-nav>a:hover,.site-nav>a.active{background:var(--mint-pale);color:var(--mint-dark)}.site-nav .nav-cta{background:var(--ink);color:white}.user-menu{display:flex;align-items:center;border-left:1px solid var(--line);margin-left:5px;padding-left:12px}.user-chip{display:flex!important;align-items:center;gap:7px}.user-chip span{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:var(--pink-pale);color:#c55f74;font-weight:800}.nav-toggle{display:none;background:var(--mint-pale);border:0;border-radius:10px;padding:8px 11px;font-size:20px}.page-shell{width:min(1140px,calc(100% - 32px));margin:52px auto 80px}.narrow-shell{max-width:520px}.wide-shell{max-width:1280px}.site-footer{width:min(1140px,calc(100% - 32px));margin:0 auto;padding:26px 4px 34px;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:var(--muted);font-size:13px}
h1,h2,h3{line-height:1.2;margin-top:0}h1{font-size:clamp(32px,5vw,58px);letter-spacing:-.035em}h2{font-size:clamp(23px,3vw,34px)}p{margin-top:0}a{color:var(--mint-dark)}.eyebrow{display:inline-flex;align-items:center;gap:7px;color:var(--mint-dark);font-weight:800;font-size:12px;letter-spacing:.15em;text-transform:uppercase;margin-bottom:12px}.eyebrow:before{content:"";width:26px;height:6px;border-radius:99px;background:linear-gradient(90deg,var(--mint),var(--sun))}.page-heading{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:30px}.page-heading h1{font-size:42px;margin-bottom:8px}.page-heading p{color:var(--muted);margin:0}.card,.panel{background:rgba(255,255,255,.94);border:1px solid rgba(220,233,228,.9);box-shadow:var(--shadow);border-radius:var(--radius)}.panel{padding:30px}.button,button.primary{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:13px;padding:12px 19px;background:var(--mint-dark);color:#fff;text-decoration:none;font:inherit;font-weight:750;cursor:pointer;transition:.18s}.button:hover,button.primary:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(62,159,137,.25)}.button.secondary,button.secondary{background:var(--mint-pale);color:var(--mint-dark)}.button.ghost,button.ghost{background:white;color:var(--ink);border:1px solid var(--line)}.button.danger,button.danger{background:var(--pink-pale);color:#ba5368}.button.small,button.small{padding:8px 12px;border-radius:10px;font-size:13px}button:disabled{opacity:.55;cursor:not-allowed}.field{margin-bottom:20px}.field label,.field-label{display:block;font-size:13px;font-weight:800;margin-bottom:7px}.field input,.field textarea,.field select,input.ui-input,select.ui-input{width:100%;border:1.5px solid var(--line);border-radius:13px;background:#fbfdfc;color:var(--ink);padding:12px 14px;font:inherit;outline:none}.field textarea{resize:vertical;min-height:90px}.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--mint);box-shadow:0 0 0 4px var(--mint-pale)}.field-note,.muted{color:var(--muted);font-size:13px}.alert{padding:13px 15px;border-radius:13px;margin:0 0 18px;font-size:14px}.alert.error{background:var(--pink-pale);color:#9d4155}.alert.success{background:var(--mint-pale);color:#327d6c}.empty-state{text-align:center;padding:70px 25px}.empty-state .empty-art{font-size:58px;margin-bottom:16px}.empty-state p{color:var(--muted)}
.auth-shell{display:grid;grid-template-columns:1fr 1fr;max-width:960px;margin:30px auto}.auth-art{border-radius:var(--radius) 0 0 var(--radius);padding:52px;background:linear-gradient(145deg,#dff6ee,#fff3df);position:relative;overflow:hidden}.auth-art h1{font-size:42px}.auth-art p{max-width:380px;color:#5d746c}.bead-bloom{display:grid;grid-template-columns:repeat(7,24px);gap:7px;margin-top:45px;transform:rotate(-7deg)}.bead-bloom i{height:24px;border-radius:50%;background:white;box-shadow:inset 0 0 0 6px #ef887d}.bead-bloom i:nth-child(3n){box-shadow:inset 0 0 0 6px #6dc2ae}.bead-bloom i:nth-child(4n){box-shadow:inset 0 0 0 6px #f1c25a}.auth-card{padding:48px;border-radius:0 var(--radius) var(--radius) 0}.auth-card h2{margin-bottom:8px}.auth-card>.muted{margin-bottom:28px}.auth-submit{width:100%;margin-top:5px}.auth-links{text-align:center;margin-top:20px;font-size:14px}
.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.toolbar form{display:flex;gap:9px;flex:1}.toolbar input{min-width:220px}.project-grid,.gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.project-card,.gallery-card{background:white;border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:0 10px 28px rgba(50,74,66,.08);transition:.2s}.project-card:hover,.gallery-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.project-preview,.gallery-preview{aspect-ratio:1;background:repeating-conic-gradient(#f6faf8 0 25%,#edf5f2 0 50%) 0/22px 22px;display:grid;place-items:center;overflow:hidden}.project-preview img,.gallery-preview img{width:100%;height:100%;object-fit:contain}.project-body,.gallery-body{padding:17px}.project-title-row{display:flex;justify-content:space-between;gap:10px}.project-title{font-weight:850;font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.project-meta,.gallery-meta{display:flex;gap:12px;color:var(--muted);font-size:12px;margin:8px 0 14px}.project-actions{display:flex;gap:7px;flex-wrap:wrap}.tag{display:inline-flex;padding:4px 9px;border-radius:99px;background:var(--mint-pale);color:var(--mint-dark);font-size:11px;font-weight:750}.pagination{display:flex;justify-content:center;align-items:center;gap:7px;margin-top:30px}.pagination a,.pagination span{padding:8px 12px;border-radius:10px;background:white;border:1px solid var(--line);text-decoration:none}.pagination .active{background:var(--mint-dark);color:white}.tabs{display:flex;gap:8px;background:#edf6f2;padding:5px;border-radius:14px}.tabs a{padding:8px 14px;border-radius:10px;text-decoration:none;color:var(--muted);font-weight:700;font-size:13px}.tabs a.active{background:white;color:var(--ink);box-shadow:0 3px 10px rgba(50,80,70,.08)}.like-button{border:0;background:var(--pink-pale);color:#b45a6d;border-radius:99px;padding:8px 12px;font:inherit;font-weight:800;cursor:pointer}.like-button.liked{background:var(--pink);color:white}.gallery-card a{text-decoration:none;color:inherit}.gallery-card h3{font-size:17px;margin-bottom:6px}.gallery-card p{color:var(--muted);font-size:13px;min-height:42px}.share-hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:28px}.share-image{padding:20px;display:grid;place-items:center}.share-image img{max-width:100%;max-height:76vh}.share-info{padding:34px;align-self:start;position:sticky;top:24px}.share-info h1{font-size:36px}.share-stats{display:flex;gap:16px;color:var(--muted);font-size:13px;margin:18px 0}.share-actions{display:flex;gap:10px;flex-wrap:wrap}.palette-panel{margin-top:28px;padding:24px;text-align:center}.palette-panel img{max-width:100%}.modal-backdrop{position:fixed;inset:0;background:rgba(35,55,49,.45);backdrop-filter:blur(6px);z-index:100;display:none;place-items:center;padding:18px}.modal-backdrop.open{display:grid}.modal{width:min(520px,100%);background:white;border-radius:22px;padding:28px;box-shadow:var(--shadow)}.modal-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:22px}.admin-table{width:100%;border-collapse:collapse}.admin-table th,.admin-table td{text-align:left;padding:14px 10px;border-bottom:1px solid var(--line);font-size:14px}.admin-table th{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
@media(max-width:900px){.project-grid,.gallery-grid{grid-template-columns:repeat(2,1fr)}.share-hero{grid-template-columns:1fr}.share-info{position:static}.auth-shell{grid-template-columns:1fr;max-width:560px}.auth-art{border-radius:var(--radius) var(--radius) 0 0;padding:35px}.auth-card{border-radius:0 0 var(--radius) var(--radius);padding:35px}.bead-bloom{display:none}.nav-toggle{display:block}.site-nav{display:none;position:absolute;left:0;right:0;top:86px;background:white;border:1px solid var(--line);border-radius:18px;padding:12px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch}.site-nav.open{display:flex}.user-menu{border-left:0;border-top:1px solid var(--line);margin:5px 0 0;padding:8px 0 0;justify-content:space-between}.site-nav>a{padding:11px 13px}.page-heading{align-items:start;flex-direction:column}}
@media(max-width:620px){.page-shell{margin-top:30px}.project-grid,.gallery-grid{grid-template-columns:1fr}.site-header{height:66px;margin-top:10px}.site-nav{top:74px}.page-heading h1{font-size:34px}.panel{padding:20px}.auth-art{display:none}.auth-card{border-radius:var(--radius);padding:28px 22px}.toolbar form{width:100%;flex-direction:column}.toolbar input{min-width:0}.site-footer{flex-direction:column;gap:5px}.admin-table{display:block;overflow-x:auto}}

/* The creator keeps its mature canvas/editor DOM, with the shared visual system layered on top. */
body.creator-page{max-width:min(96vw,1800px);margin:0 auto;padding:0 18px 70px;background:linear-gradient(155deg,#fafffd,#fff8f3 55%,#f4fbff);color:var(--ink)}
.creator-page .creator-header{height:76px;margin:18px 0 0;padding:0 18px 0 22px;background:rgba(255,255,255,.9);border:1px solid var(--line);border-radius:22px;box-shadow:0 10px 30px rgba(64,91,81,.09);display:flex;align-items:center;justify-content:space-between;position:relative;z-index:20}.creator-header nav{display:flex;align-items:center;gap:6px}.creator-header nav>a,.creator-header .nav-logout{padding:9px 12px;border-radius:11px;text-decoration:none;color:#52645f;font-size:13px;background:none;border:0}.creator-header nav>a:hover{background:var(--mint-pale);color:var(--mint-dark)}.creator-header form{margin:0}.creator-page .lang-toggle{position:fixed;right:18px;bottom:18px;top:auto;z-index:90;border-radius:99px;background:var(--ink);box-shadow:var(--shadow);padding:10px 15px}.creator-hero{display:flex;justify-content:space-between;align-items:center;gap:40px;padding:58px clamp(10px,4vw,60px) 38px}.creator-hero h1{font-size:clamp(36px,5vw,68px);margin:0 0 16px;letter-spacing:-.05em}.creator-hero p{font-size:17px;color:var(--muted);max-width:650px}.hero-beads{font-size:52px;line-height:.75;letter-spacing:-11px;color:var(--pink);transform:rotate(10deg);text-shadow:36px 12px var(--mint),-15px 24px var(--sun);opacity:.75;white-space:nowrap}.creator-page .card{background:rgba(255,255,255,.96);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:clamp(20px,3vw,38px);margin-bottom:24px}.creator-page .form-group{margin-bottom:22px}.creator-page label.field-label{color:var(--ink);font-size:13px;letter-spacing:.02em}.creator-page input[type=text],.creator-page input[type=file],.creator-page input[type=number],.creator-page select,.creator-page .palette-search{border:1.5px solid var(--line);border-radius:13px;background:#fbfdfc;padding:12px 14px}.creator-page button{border-radius:13px;background:var(--mint-dark);transition:.18s}.creator-page button:hover:not(:disabled){background:#348c78;transform:translateY(-1px)}.creator-page button.secondary,.creator-page .icon-btn,.creator-page .ratio-btn{background:var(--mint-pale);color:var(--mint-dark);border:1px solid #cce8df}.creator-page .link-button{background:none;color:var(--mint-dark)}.creator-page .checkboxes{display:flex;gap:9px;flex-wrap:wrap}.creator-page .checkboxes label{margin:0;padding:10px 13px;border:1px solid var(--line);border-radius:12px;background:#fbfdfc}.creator-page .hint{color:var(--muted)}.creator-page .canvas-scroll,.creator-page .source-pick-scroll,.creator-page .adjust-viewport{border-color:var(--line);border-radius:16px;background:#f5faf8}.creator-page .editor-side,.creator-page .adjust-controls{background:#fbfdfc;border:1px solid var(--line);border-radius:18px;padding:18px}.creator-page .selected-display{background:var(--mint-pale);border-color:#cce8df;border-radius:14px}.creator-page .palette-swatch{border-radius:9px}.creator-page .results-layout img{border-radius:15px;border:1px solid var(--line)}.result-share-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:24px;padding:18px;background:linear-gradient(100deg,var(--mint-pale),var(--pink-pale));border-radius:16px}.creator-page .coffee-btn{background:var(--pink);box-shadow:0 10px 24px rgba(243,154,171,.25)}
@media(max-width:800px){body.creator-page{padding:0 10px 55px}.creator-page .creator-header{height:auto;min-height:68px;align-items:flex-start;padding:14px;gap:10px}.creator-header nav{justify-content:flex-end;flex-wrap:wrap}.creator-header nav>a{padding:6px 8px}.creator-header .user-chip{display:none!important}.creator-hero{padding:42px 8px 25px}.hero-beads{display:none}.creator-page .editor-layout,.creator-page .adjust-layout{display:block}.creator-page .editor-side,.creator-page .adjust-controls{width:100%;margin-top:16px}.result-share-bar{align-items:flex-start;flex-direction:column}}

button.secondary,button.ghost,button.danger{display:inline-flex;align-items:center;justify-content:center;gap:7px;border-radius:13px;padding:12px 19px;font:inherit;font-weight:750;cursor:pointer}
button.secondary{border:0}button.danger{border:0}.version-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid var(--line)}.version-row:last-child{border-bottom:0}
.share-actions form{margin:0}.share-copy-note{margin:12px 0 0}

/* Community feature wish board. */
.wish-heading{margin-bottom:22px}.wish-compose{margin-bottom:28px;background:linear-gradient(120deg,#fffdf6,#fff8df);border-color:#f3dda0}.wish-compose-copy{display:flex;align-items:baseline;gap:12px;margin-bottom:13px}.wish-compose-copy strong{font-size:18px}.wish-compose-copy span{color:var(--muted);font-size:13px}.wish-compose-field{display:flex;align-items:stretch;gap:12px}.wish-compose-field textarea{flex:1;min-height:88px;resize:vertical;border:1.5px solid #e8cf8a;border-radius:15px;background:rgba(255,255,255,.9);color:var(--ink);padding:13px 15px;font:inherit;outline:none}.wish-compose-field textarea:focus{border-color:var(--sun);box-shadow:0 0 0 4px rgba(245,201,104,.23)}.wish-compose-field button{min-width:118px}.wish-form-error{margin:13px 0 0}.wish-board{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}.wish-column{border-radius:26px;padding:22px;min-height:430px;border:1px solid transparent}.wish-column-pending{background:#fff3bd;border-color:#f0d778}.wish-column-completed{background:#dff4e8;border-color:#b9dfc8}.wish-column-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.wish-column-heading>div{display:flex;align-items:center;gap:10px}.wish-column-heading h2{font-size:24px;margin:0}.wish-column-icon{font-size:25px}.wish-count{font-size:12px;font-weight:800;color:#77652c;background:rgba(255,255,255,.58);padding:5px 10px;border-radius:99px}.wish-column-completed .wish-count{color:#397654}.wish-list{display:grid;gap:14px}.wish-card{position:relative;border-radius:17px;padding:18px;box-shadow:0 8px 20px rgba(75,75,45,.1);scroll-margin-top:110px}.wish-card-pending{background:#fffbe9;border:1px solid #edd98d}.wish-card-completed{background:#f2fff7;border:1px solid #abd4ba;padding-top:46px}.wish-content{white-space:pre-wrap;overflow-wrap:anywhere;font-size:15px;line-height:1.65;margin:0 0 14px}.wish-meta{display:flex;gap:12px;color:var(--muted);font-size:12px}.wish-actions{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:14px}.wish-actions form{margin:0}.wish-like,.wish-complete{border:0;border-radius:99px;padding:7px 12px;font:inherit;font-size:13px;font-weight:800;cursor:pointer}.wish-like{background:#fff0f3;color:#b45a6d}.wish-like.liked{background:var(--pink);color:white}.wish-complete{background:#dff4e8;color:#337653}.wish-complete:hover{background:#c7ead5}.wish-done-label{position:absolute;top:14px;right:14px;padding:4px 9px;border-radius:99px;background:#ccebd7;color:#30734f;font-size:11px;font-weight:850}.wish-empty{min-height:200px;display:grid;place-content:center;text-align:center;color:var(--muted);padding:28px}.wish-empty span{font-size:42px}.wish-empty p{margin:8px 0 0}.wish-card:target{animation:wish-focus 1.6s ease}@keyframes wish-focus{0%,100%{box-shadow:0 8px 20px rgba(75,75,45,.1)}35%{box-shadow:0 0 0 5px rgba(243,154,171,.35),0 12px 28px rgba(75,75,45,.16)}}
@media(max-width:800px){.wish-board{grid-template-columns:1fr}.wish-compose-field{flex-direction:column}.wish-compose-copy{align-items:flex-start;flex-direction:column;gap:3px}.wish-column{min-height:280px}}