:root{--ink:#735543;--muted:#a48f80;--blue:#4f7991;--rose:#a95c76;--line:#e9dcd0;--cream:#fffaf3;--pink:#f3dfe4;--wash:#dce9ee}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:#fff8ef url('assets/memory-bear-cream-v2.png') center top/100% auto repeat-y;font-family:Georgia,'Noto Serif SC','Songti SC',STSong,serif}button,input,textarea,select{font:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}button:focus-visible,a:focus-visible{outline:2px solid var(--blue);outline-offset:4px}button{border:0}a{color:inherit}.workshop{width:min(100%,540px);padding:52px 23px 40px;margin:auto}.hero{text-align:center;position:relative;margin-bottom:24px}.back{position:absolute;left:0;top:-17px;display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--line);border-radius:50%;background:#fffaf3e8;text-decoration:none;font:30px/1 Georgia;box-shadow:0 2px 6px #89664c09}.eyebrow{font-size:10px;letter-spacing:.25em;margin:7px 0 14px}h1{font-weight:500;font-size:32px;letter-spacing:.06em;margin:0 0 16px}h1 span{position:relative;z-index:0}h1 span:before{content:'';position:absolute;left:-7px;right:-5px;bottom:0;height:13px;background:#dce8edbd;border-radius:60% 35% 40% 30%;transform:rotate(-1deg);z-index:-1}.subtitle{font-size:14px;margin:0;color:#9e8877;letter-spacing:.035em}.panel,.project,.note{border:1px solid #e7d8c9b5;background:linear-gradient(135deg,#fffdf8dc,#fffaf3c7);box-shadow:0 5px 15px #80624e07;border-radius:19px}.quota{padding:13px 17px 12px;margin-bottom:12px}.quota-head{display:flex;align-items:center;gap:10px}.quota h2{font-size:15px;font-weight:500;margin:0 auto 0 0}.muted{color:var(--muted);font-size:13px}.icon-button{padding:0;display:grid;place-items:center;width:28px;height:28px;background:transparent;color:#a68b7c;font:21px/1 Georgia}.quota-track{height:6px;background:#e3e7e4;border-radius:8px;margin:8px 0}.quota-caption{font-size:11px;color:var(--muted);margin:0;line-height:1.5}.counts{display:flex;padding:11px 0;margin:0 0 25px;box-shadow:none;border-radius:15px}.counts button{flex:1;background:none;padding:2px 4px;font-size:12px;color:var(--muted);border-right:1px solid var(--line)}.counts button:last-child{border:0}.counts strong{font:22px/1 Georgia;margin-left:4px;font-weight:400}.counts button[aria-pressed=true]{color:var(--blue)}.counts button[data-filter=review][aria-pressed=true]{color:var(--rose)}.section-head{display:flex;gap:10px;align-items:center;justify-content:space-between}.section-head h2{font-size:21px;font-weight:500;margin:0;letter-spacing:.06em}.section-caption{font-size:12px;color:var(--muted);margin:9px 0 15px}.soft-button{border-radius:99px;background:#efdce1;color:#946479;padding:10px 15px;font-size:13px;border:1px solid #dfbec7;box-shadow:inset 0 1px 0 #fffc}.soft-button.outline{background:#fffaf3ad;border-color:var(--line);color:#987969}.projects,.notes{display:grid;gap:15px}.project{position:relative;padding:18px 17px 0;overflow:hidden}.project:before{content:'';position:absolute;right:0;top:0;width:180px;height:95px;background:radial-gradient(ellipse at 75% 0,#dce8ed6b,transparent 70%);pointer-events:none}.project.review:before{background:radial-gradient(ellipse at 75% 0,#efd9e06b,transparent 70%)}.project-top{display:flex;gap:9px;align-items:center;position:relative}.project h3{font-size:21px;font-weight:600;line-height:1.4;margin:0;overflow-wrap:anywhere}.project-link{border:0;background:none;text-align:left;padding:0}.status{font-size:10px;border-radius:50px;background:#e1ebf0;color:var(--blue);padding:4px 8px;white-space:nowrap}.review .status{background:#f4e0e7;color:var(--rose)}.done .status{color:#817b63;background:#eae9de}.project-description{font-size:12px;color:var(--muted);margin:5px 0 15px;line-height:1.7}.current{font-size:14px;line-height:1.6;margin:0 0 13px;overflow-wrap:anywhere}.current span{font-size:11px;color:var(--muted);margin-right:7px}.owners{display:grid;grid-template-columns:1fr 1fr;gap:8px}.owner{padding:9px 10px;border-radius:12px;background:#e4edf166;font-size:12px;line-height:1.6;color:var(--blue);overflow-wrap:anywhere}.owner.pink{background:#f5e3e86b;color:var(--rose)}.owner b{font-size:14px;display:block;font-weight:500}.next{display:flex;gap:9px;align-items:baseline;text-align:left;width:100%;padding:13px 0;margin:14px 0 0;background:none;border-top:1px solid var(--line);font-size:14px;line-height:1.6}.next small{font-size:11px;color:var(--muted);flex-shrink:0}.next span{margin-left:auto}.divider{height:1px;background:linear-gradient(90deg,transparent,#d3b8a7,transparent);margin:28px 0;position:relative}.divider span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:0 12px;background:#fff8ef;color:#c59aab;font-size:12px}.notes{margin-top:17px}.note{padding:16px 17px}.note-top{display:flex;align-items:center;gap:8px}.note h3{margin:0;font-size:16px;line-height:1.6;font-weight:500;flex:1}.brush{background:linear-gradient(177deg,transparent 35%,#f2dce3ad 36% 86%,transparent 87%);padding:0 2px}.note p{font-size:14px;line-height:1.85;margin:8px 0 0;white-space:pre-wrap;overflow-wrap:anywhere}.note-meta{font-size:10px;color:var(--muted);margin:10px 0 0}.code-note{background:linear-gradient(135deg,#eaf0f4dc,#f2f4f4db);border-color:#c7d8e2}.code-note .note-top{color:var(--blue)}.copy{background:transparent;font-size:12px;color:var(--blue);padding:6px}.code-note pre{padding:13px;background:#ffffff95;border-radius:11px;font:12px/1.8 ui-monospace,SFMono-Regular,Consolas,monospace;color:#4f687d;overflow:auto;margin:12px 0 0;tab-size:2}.empty{padding:25px 15px;text-align:center;color:var(--muted);font-size:14px;border:1px dashed var(--line);border-radius:18px}footer{text-align:center;color:#b19d8e;font-size:10px;line-height:1.9;margin-top:27px}dialog{width:min(calc(100% - 36px),460px);max-height:85dvh;border:1px solid #e6d2c2;border-radius:24px;padding:24px;color:var(--ink);background:#fffaf3;box-shadow:0 16px 50px #4f38212b}dialog::backdrop{background:#6b554047;backdrop-filter:blur(6px)}.dialog-head{display:flex;align-items:center;justify-content:space-between}.dialog-head .eyebrow{font-size:9px;color:var(--muted);margin:0}.dialog-head .close{font-size:26px}dialog h2{font-size:25px;font-weight:500;margin:14px 0 22px}label{display:block;font-size:13px;margin:14px 0 6px}input,textarea,select{width:100%;border:1px solid var(--line);border-radius:11px;background:#fffdf9;color:var(--ink);padding:12px;font-size:15px;outline-color:#a3bbc9}textarea{resize:vertical;min-height:85px;line-height:1.7}select{appearance:none;background:#f6e9ed}.row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}#form-error{color:var(--rose);font-size:12px}#detail-content p{line-height:1.85;white-space:pre-wrap;overflow-wrap:anywhere}.detail-label{font-size:12px;color:var(--muted);margin:17px 0 4px!important}.detail-author{color:var(--blue)}.detail-author.pink{color:var(--rose)}#toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);background:#735543ee;color:#fffaf3;border-radius:30px;padding:11px 20px;font-size:13px;opacity:0;pointer-events:none;z-index:5;transition:opacity .2s}#toast.visible{opacity:1}@media(min-width:600px){body{background-size:540px auto}.workshop{padding-top:56px}}@media(max-width:360px){.workshop{padding-left:18px;padding-right:18px}h1{font-size:29px}.owner{padding:8px}.counts button{font-size:11px}.counts strong{font-size:19px}}@media(prefers-reduced-motion:no-preference){.project,.note{animation:arrive .3s ease both}@keyframes arrive{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}}
/* Cream menus keep iOS native dark select popovers out of this form. */
.choice{position:relative;min-width:0}.choice summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:46px;padding:12px;border:1px solid var(--line);border-radius:11px;background:#f7ebef;color:var(--ink);font-size:15px;line-height:1.5}.choice summary::-webkit-details-marker{display:none}.choice summary span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.choice summary i{width:7px;height:7px;border-right:1.5px solid #ac8896;border-bottom:1.5px solid #ac8896;transform:rotate(45deg);flex:none;margin-right:2px;margin-top:-4px}.choice[open]{z-index:4}.choice[open] summary{border-color:#d7adb9;box-shadow:0 0 0 2px #f2dfe578}.choice[open] summary i{transform:rotate(225deg);margin-top:3px}.choice summary:focus-visible{outline:2px solid #cba5b2;outline-offset:2px}.choice-options{position:absolute;left:0;right:0;top:calc(100% + 6px);padding:5px;max-height:220px;overflow-y:auto;border-radius:13px;border:1px solid #e6d4c8;background:#fffaf4;box-shadow:0 9px 23px #73554320}.choice-options button{display:flex;align-items:center;justify-content:space-between;gap:6px;width:100%;padding:11px 9px;min-height:42px;border-radius:8px;background:transparent;text-align:left;font-size:14px;line-height:1.5;color:var(--ink);overflow-wrap:anywhere}.choice-options button[aria-pressed=true]{background:#f2dfe7;color:#9c5d74}.choice-options button:hover{background:#f7eaf0}.choice-check{width:10px;height:6px;flex:none;visibility:hidden;border-bottom:1.5px solid currentColor;border-left:1.5px solid currentColor;transform:rotate(-45deg);margin:0 3px 4px 0}.choice-options button[aria-pressed=true] .choice-check{visibility:visible}.connection-mark{position:relative;display:block;width:24px;height:24px;color:#7193a6;transform:rotate(-38deg)}.connection-mark:before,.connection-mark:after{content:'';position:absolute;width:13px;height:9px;border:1.6px solid currentColor;border-radius:6px;left:4.5px;box-sizing:border-box}.connection-mark:before{top:3px}.connection-mark:after{bottom:3px}.quota #connection{border-radius:50%;width:32px;height:32px;background:#e5edf382;border:1px solid #d6e1e8;transition:background .15s}.quota #connection:hover{background:#dce9f2}.quota-head{gap:9px}
/* Keep the original artwork scale; repeat only its bear-and-bow middle. */
body{background:#fff8ef}.workshop{position:relative;isolation:isolate;min-height:100svh;padding-bottom:66px}.workshop-bg{position:absolute;inset:34px 0 34px;z-index:-2;overflow:hidden;pointer-events:none}.workshop-bg span{display:block;width:100%;aspect-ratio:683/1860;background:url('assets/memory-bear-cream-v2.png') center center/100% auto no-repeat}.workshop:before,.workshop:after{content:'';position:absolute;left:0;right:0;height:34px;z-index:-1;pointer-events:none;background-image:url('assets/memory-bear-cream-v2.png');background-size:100% auto;background-repeat:no-repeat}.workshop:before{top:0;background-position:center top}.workshop:after{bottom:0;background-position:center bottom}.hero{margin-bottom:18px}.hero h1{margin-bottom:10px}.counts{margin-bottom:17px}
.connection-mark{transform:rotate(-38deg)}.connection-mark:before,.connection-mark:after{width:10px;height:14px;left:7px;border-radius:7px}.connection-mark:before{top:1px;border-bottom-color:transparent}.connection-mark:after{bottom:1px;border-top-color:transparent}.connection-mark{background:linear-gradient(currentColor,currentColor) center/1.6px 8px no-repeat}
.soft-button,.counts button,.project-link,.next,.copy,.back{transition:background-color .2s,box-shadow .2s,transform .18s}.soft-button:active,.back:active{transform:scale(.97)}.copy:active,.next:active,.project-link:active{transform:translateY(1px)}.counts button[aria-pressed=true]{background:#e7eff14d;border-radius:9px}.counts button[data-filter=review][aria-pressed=true]{background:#f4e2e763}
@media(prefers-reduced-motion:no-preference){.hero{animation:arrive .38s ease both}.quota{animation:arrive .38s .04s ease both}.counts{animation:arrive .38s .08s ease both}.project:nth-child(2),.note:nth-child(2){animation-delay:.05s}.project:nth-child(3),.note:nth-child(3){animation-delay:.1s}dialog[open]{animation:dialog-arrive .22s ease both}.choice[open] .choice-options{animation:menu-arrive .17s ease both}.quota-track{transition:width .6s ease}.just-saved{animation:saved-glow 1.4s ease both!important}@keyframes dialog-arrive{from{opacity:0;transform:translateY(9px) scale(.985)}to{opacity:1;transform:none}}@keyframes menu-arrive{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}@keyframes saved-glow{0%,100%{box-shadow:0 5px 15px #80624e07}35%{box-shadow:0 0 0 3px #c9dfe56b,0 5px 20px #9db9c828}}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
